


/* CSS Document */



* { margin:0; padding:0; }

body {
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	font-size:12px;
	font-family: 'Open Sans', sans-serif;
	
}  

img{
	max-width:100%;
	height:auto;

}


#preloaded-images {
   position: absolute;
   overflow: hidden;
   left: -9999px; 
   top: -9999px;
   height: 1px;
   width: 1px;
}

strong{ font-weight:700;}

img.desktop{ display:block;}
img.mobile{  display:none; width:100%;}

img.responsive{ width:100%;}


hr{margin-top: 1.5rem;
margin-bottom: 1.75rem;
border-width: 0;
border-top: 1px solid #cccccc;
}

h1 {font-size: 42px; color: #ffffff; font-weight: 700; padding-bottom: 30px; line-height: 1.1em;}
h2 {font-size: 28px; color: #5cb85c; font-weight: 700; padding-bottom:10px; text-transform: uppercase;} 
h3 {font-size:18px; padding-bottom:7px; line-height:1.3em;} 
h4 {font-size:16px; padding-bottom:3px;} 
h5 {} 
h6 {}

p {font-size:15px;  font-weight:600; line-height:1.25em; margin-bottom:15px;}



span.ital{ font-style: italic;}

a {}

a:hover, a:focus, a:active {}

a:focus, a:active {}



p.title{font-size: 14px;
color: #5cb85c;
margin-top:-7px;}



.top-rule{padding-top: 20px;
margin-top: 20px;
border-top: 1px solid #5cb85c;}



.slicknav_menu {display:none;}
.mobile-logo{ display:none;}

#toTop p{ 
line-height:.9em;
padding-top:22px;
font-weight:bold;
/* width:60%; */
margin:0 auto;
font-size:11px;
float:left;
padding-left:7px;
}
	




/*
PADDING
===============================================================*/

.padtop{ padding-top:40px;}

.nomargin{margin:0!important;}


/*
RESPONSIVE VIDEO
===============================================================*/

.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; margin:30px 0 40px 0;} 
.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.player input{font-size:16px;}



/*
HEADER
===============================================================*/

#header{ 

width: 100%;
min-height: 115px;
-webkit-box-shadow: 0px 10px 25px -1px rgba(0, 0, 0, 0.58);
-moz-box-shadow: 0px 10px 25px -1px rgba(0, 0, 0, 0.58);
box-shadow: 0px 10px 25px -1px rgba(0, 0, 0, 0.58);
z-index: 500;
position: relative;

background:url(../images/header-bg.jpg) left no-repeat;
background-size:cover;
}

.header-logo{
	width:35%;
	float:left;
	padding-top: 25px;
}

.logo{ padding-top:20px;}

.mobile-logo{
display:none;
position:absolute;
z-index:9000;
top:5px;
left:10px;
max-width:260px;
width:50%;
}



/* NAVIGATION
============================================= */

#primary-nav{ 
	font-size: 20px;
	padding:30px 0 0 0;
	margin-top:38px;
	z-index:1;
	font-weight:400;
	width:65%;
	float:right;
}

#primary-nav ul{
	
	float:				right;

}

#primary-nav ul li{
	display:	 inline;
	
}



#primary-nav a{
	color:				#1e244f;
	-o-transition:		color .3s ease-in-out;
  	-ms-transition:		color .3s ease-in-out;
  	-moz-transition:	color .3s ease-in-out;
  	-webkit-transition:	color .3s ease-in-out;
  	transition:			color .3s ease-in-out;
	
}

#primary-nav a.last{ padding-right:0;}

#primary-nav li a:hover{ color:#5cb85c;}

#primary-nav .sfHover{ color:#5cb85c;}

#primary-nav li {padding-bottom:30px; display:block;}

#primary-nav a { padding:0 20px;}
#primary-nav a.sf-with-ul { padding-right:17px !important; }

#primary-nav a.sf-with-ul:hover { color:#5cb85c;}




body#services a.services,
body#services.wireless a.wireless,
body#services.commercial a.commercial,
body#services.fiber a.fiber,

body#kohler a.kohler,
body#contact a.contact,
body#about a.about
{ color:#5cb85c;}


/*
INTRO
===============================================================*/


#intro{ 
background:url(../images/intro-bg.jpg) center no-repeat;
background-size:cover;
display:block;
position:relative;
-webkit-box-shadow: 0px 11px 41px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 11px 41px 0px rgba(0,0,0,0.75);
box-shadow: 0px 11px 41px 0px rgba(0,0,0,0.75);
padding:110px 0;
}



#intro p{
	font-size:15px; color:#ffffff; font-weight:600; padding-bottom:7px; line-height:1.5em;}

#intro h3{
	color:#ffffff;}


/*
BANNERS & TITLES
=========================================*/

.banner{ }

.banner h1{ padding:20px 0; width:60%; background:url(../images/banner-title-bg.png) no-repeat right; background-size:cover;}

.commercial.banner{  background: url(../images/banner-commercial.jpg) no-repeat;
background-position: 30%; background-size:cover;}



/*
PANEL
=========================================*/

#panel{ background:url(../images/panel-bg.jpg) repeat; padding:30px 0;}

	
.panel-box{ padding-bottom:30px;}

#panel img{ padding-bottom:10px;}

#panel p{ font-size:14px; color:#666666; line-height:1.3em}


/*
CONTENT
=========================================*/

.content{ 
	padding-top:40px;
	padding-bottom:40px;
	}
	
.content.no-margin-bottom{ margin-bottom:0; border-bottom:1px solid #e7e7e7;}
	
.divider{ height: 1px;

margin: 30px 0;
background: #cccccc;}
	
.subhead{ padding-bottom: 10px;
margin-bottom: 20px;
border-bottom: 1px solid #5cb85c;
margin-top:30px;}
	
.content p{ font-weight:400; line-height:1.5em;}

.content h3{font-style:italic;}


/*
COLS
=========================================*/

.full-col{ width:100%;  }



.three-quarter-col{width:72%;}

.quarter-col{ width:21%; padding-right:4%; float:left;  }
.quarter-col.last{ width:23%; padding-right:0;  }



/*
FOOTER
=========================================*/


#footer{ 
	background:url(../images/footer-bg.jpg) repeat-x;
	width:100%;
  background-size:cover;
	-webkit-box-shadow: 0px 2px 7px 0px rgba(0,0,0,0.61);
-moz-box-shadow: 0px 2px 7px 0px rgba(0,0,0,0.61);
box-shadow: 0px 2px 7px 0px rgba(0,0,0,0.61);
display:block;
padding:20px 0;
	}

#footer h2{
  font-size: 18px;
color: #ffffff;
font-weight: 700;
text-transform:uppercase;}


#footer p{
  font-size: 16px;
color: #ffffff;
font-weight: 300;
font-style: italic;}



.footer-contact{
  width:50%;
float:right;
text-align:right;}

.footer-name img{
  width:200px;
}

.footer-name{ 
  width: 50%;
float: left;}



/* 9 - SlickNav
â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“â€“ */




/*
    Mobile Menu Core Style
*/

.slicknav_btn { position: relative; display: block; vertical-align: middle; float: right; padding: 0.438em 0.625em 0.438em 0.625em; line-height: 1.125em; cursor: pointer; }
.slicknav_menu  .slicknav_menutxt { display: block; line-height: 1.188em; float: left; }
.slicknav_menu .slicknav_icon { float: left; margin: 0.188em 0 0 0.438em; }
.slicknav_menu .slicknav_no-text { margin: 0 }
.slicknav_menu .slicknav_icon-bar { display: block; width: 1.125em; height: 0.125em; -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; }
.slicknav_btn .slicknav_icon-bar + .slicknav_icon-bar { margin-top: 0.188em }
.slicknav_nav { clear: both }
.slicknav_nav ul,
.slicknav_nav li { display: block; margin-bottom:0 !important; border-bottom:1px solid #666666;}
.slicknav_nav .slicknav_arrow { font-size: 0.8em; margin: 0 0 0 0.4em; color:#8dcf01; }
.slicknav_nav .slicknav_item { cursor: pointer; }
.slicknav_nav .slicknav_row { display: block; }
.slicknav_nav a { display: block }
.slicknav_nav .slicknav_item a,
.slicknav_nav .slicknav_parent-link a { display: inline }
.slicknav_menu:before,
.slicknav_menu:after { content: " "; display: table; }
.slicknav_menu:after { clear: both }
/* IE6/7 support */
.slicknav_menu { *zoom: 1 }

/* 
    User Default Style
    Change the following styles to modify the appearance of the menu.
*/

.slicknav_menu {
    font-size:16px;
	z-index:9000;
	position:relative;
	-webkit-box-shadow: 0px 10px 22px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 10px 22px 0px rgba(0,0,0,0.75);
box-shadow: 0px 10px 22px 0px rgba(0,0,0,0.75);

background:url(../images/panel-bg.jpg) no-repeat;


    }
	
	

	
/* Button */
.slicknav_btn {
    text-decoration:none;
   /* text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); */
padding:10px 15px;
margin:15px 10px 15px 15px;
text-align:left;
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
}
/* Button Text */
.slicknav_menu  .slicknav_menutxt {
   color: #22263C;
   font-weight: BOLD;
	font-size:15px;
}
/* Button Lines */
.slicknav_menu .slicknav_icon-bar {
  background-color:#44446e;
}

.slicknav_nav {
	color:#fff;
	margin:0;
	padding:0;
	font-size:20px;
	letter-spacing:.05em;
	}
	
.slicknav_nav, .slicknav_nav ul {
     list-style: none;
   overflow:hidden;
	width:100%;
	-webkit-box-shadow: inset 0px 9px 17px -8px rgba(0,0,0,0.75);
	-moz-box-shadow: inset 0px 9px 17px -8px rgba(0,0,0,0.75);
	box-shadow: inset 0px 9px 17px -8px rgba(0,0,0,0.75);
}
.slicknav_nav ul {
    padding:0;
    margin:0;
}
.slicknav_nav .slicknav_row {
    /*padding:5px 10px;
    margin:2px 5px;*/
}
.slicknav_nav a{
    padding: 20px 30px;
    text-decoration:none;
    color:#333333;
	font-size:16px;
	font-weight:700;
	
}
.slicknav_nav .slicknav_item a,
.slicknav_nav .slicknav_parent-link a {
    padding:0;
    margin:0;
}

.slicknav_nav .slicknav_txtnode {
     margin-left:15px;   
}

.slicknav_parent.slicknav_open{ 
	-webkit-box-shadow: inset 0px 9px 17px -8px rgba(0,0,0,0.75);
	-moz-box-shadow: inset 0px 9px 17px -8px rgba(0,0,0,0.75);
	box-shadow: inset 0px 9px 17px -8px rgba(0,0,0,0.75);
background:#ffffff;}


.slicknav_nav ul.sub li a {color:#333333;}


.slicknav_parent.slicknav_open .slicknav_item.slicknav_row a{
	color:#000000;
}

.slicknav_nav ul.sub{
-webkit-box-shadow: none; 
-moz-box-shadow: none; 
box-shadow: none; 
border-bottom:0;
font-size:80%;
}


.slicknav_nav ul.sub li a{
	padding: 20px 30px;
border-bottom: none;
font-size: 90%;
background:#ededed
	}
	
.slicknav_nav ul.sub li{
	border-bottom:none;
	border-top:1px solid #cccccc;}



/*
TO TOP
=========================================*/


#toTop p{ 
line-height:.9em;
padding-top:22px;
font-weight:bold;
/* width:60%; */
margin:0 auto;
font-size:11px;
float:left;
padding-left:7px;
}
	
#toTop {
	z-index:1000;
        background: url(../images/back-to-top.png) no-repeat #1eb0b2;;
        text-align:center;
		line-height:1em;
        position:fixed;
bottom: 150px;
right: -12px;
        cursor:pointer;
        display:none;
        height: 40px;
width: 45px;
        -moz-border-radius: 5px 0 0 5px;
-webkit-border-radius: 5px 0 0 5px;
border-radius: 5px 0 0 5px; /* future proofing */
-khtml-border-radius: 5px 0 0 5px;


 -webkit-transition: all 500ms ease-in;
    -moz-transition: all 500ms ease-in;
    -o-transition: all 500ms ease-in;
    transition: all 500ms ease-in;

    -webkit-box-shadow: -1px 0px 7px 2px rgba(0,0,0,0.55);
-moz-box-shadow: -1px 0px 7px 2px rgba(0,0,0,0.55);
box-shadow: -1px 0px 7px 2px rgba(0,0,0,0.55);


}

#toTop:hover {
         background: url(../images/back-to-top.png) no-repeat #1eb0b2;
		 color:#ffffff;
		 font-weight:bold;
		 right: 0;

 -webkit-transition: all 500ms ease-out;
    -moz-transition: all 500ms ease-out;
    -o-transition: all 500ms ease-out;
    transition: all 500ms ease-out;

		 }

/* SUPERFISH */



/*** Superfish ***/
.sf-menu, .sf-menu * {
    margin: 0;
    padding: 0;
    list-style: none;
}
.sf-menu li {
    position: relative;
}
.sf-menu ul {
    position: absolute;
    display: none;
    top: 100%;
    left: 0;
    z-index: 99;
}
.sf-menu > li {
    float: left;
}
.sf-menu li:hover > ul,
.sf-menu li.sfHover > ul {
    display: block;
}

.sf-menu a {
    display: block;
    position: relative;
}
.sf-menu ul ul {
    top: 0;
    left: 100%;
}



/*** DEMO SKIN ***/





.sf-menu {
    float: right;
    width:auto;
}
.sf-menu ul {
    box-shadow: 2px 2px 6px rgba(0,0,0,.2);
    min-width: 12em; /* allow long menu items to determine submenu width */
    *width: 12em; /* no auto sub width for IE7, see white-space comment below */
	
}
.sf-menu a {
    
    padding: .75em;
    text-decoration: none;
    zoom: 1; /* IE7 */
}

.sf-menu li {
    
    -webkit-transition: background .2s;
    transition: background .2s;
}
.sf-menu ul li {
    
}
.sf-menu ul ul li {
    
}
.sf-menu li:hover,
.sf-menu li.sfHover {
    
    /* only transition out, not in */
    -webkit-transition: none;
    transition: none;
}



/*** arrows (for all except IE7) **/
.sf-arrows .sf-with-ul {
    padding-right: 13px !important;
    *padding-right: 1em; /* no CSS arrows for IE7 (lack pseudo-elements) */
}
/* styling for both css and generated arrows */
.sf-arrows .sf-with-ul:after {
    content: '';
    position: absolute;
    top: 10px;
right: 7px;
    /* margin-top: -3px; */
    height: 0;
    width: 0;
    /* order of following 3 rules important for fallbacks to work */
    border: 3px solid transparent;
    border-top-color:#30a041; /* edit this to suit design (no rgba in IE8) */
}
.sf-arrows > li > .sf-with-ul:focus:after,
.sf-arrows > li:hover > .sf-with-ul:after,
.sf-arrows > .sfHover > .sf-with-ul:after {
    border-top-color: #0e4113; /* IE8 fallback colour */
}
/* styling for right-facing arrows */
.sf-arrows ul .sf-with-ul:after {
    margin-top: -5px;
    margin-right: -3px;
    border-color: transparent;
    border-left-color:  #0e4113; /* edit this to suit design (no rgba in IE8) */
    
}
.sf-arrows ul li > .sf-with-ul:focus:after,
.sf-arrows ul li:hover > .sf-with-ul:after,
.sf-arrows ul .sfHover > .sf-with-ul:after {
    border-left-color:  #0e4113;
}

ul.sf-menu li:hover ul,
ul.sf-menu li.sfHover ul,
ul.sf-menu li ul
{
    right: 0px;
}


#primary-nav ul.sub{ 
	background: #ffffff;
border-top:1px solid #cccccc;


-webkit-box-shadow: 0px 23px 19px -6px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 23px 19px -6px rgba(0,0,0,0.75);
box-shadow: 0px 23px 19px -6px rgba(0,0,0,0.75);

}


#primary-nav ul.sub li a{ 
	cursor:pointer;
	border-right: 0;
	border-bottom: 1px solid #cccccc;
	padding:15px 10px;
	 -webkit-transition: all 500ms ease-in;
    -moz-transition: all 500ms ease-in;
    -o-transition: all 500ms ease-in;
    transition: all 500ms ease-in;
    font-size:80%;
    padding:20px;


}


#primary-nav ul.sub li a:hover{ 
	background: #1eb0b2;
color:#ffffff!important;
	 -webkit-transition: all 500ms ease-in;
    -moz-transition: all 500ms ease-in;
    -o-transition: all 500ms ease-in;
    transition: all 500ms ease-in;
}	

/*
FORM STYLING / CONTACT PAGE
=========================================*/



/* ====================================================================================================================
 * RESPONSIVE
 * ====================================================================================================================*/



@media screen and (max-width: 1024px) {

#intro{padding:70px 0;}
	
}



@media screen and (max-width: 860px) {
 
}






@media (max-width: 768px) {

.slicknav_menu { display:block !important;}
  #header{ display:none !important;}
.mobile-logo{ display:block;}

	
.half-col.left{width:40%; float:left;}
.half-col.right{width:55%; float:right;}

.three.columns{ margin:0 0 30px 0; width:100%;}



}
	
@media (max-width: 680px) {


img.desktop{ display:none !important; }
img.mobile{ display:block !important; }	

#intro{ background-position:left;}

.footer-name, .footer-contact{ width:100%; text-align:center; padding-bottom:10px;}



}


@media (max-width: 550px) {


h1{ font-size:30px;}


}




@media (max-width: 480px) {
	
h1{ font-size:30px;}
h3{font-size:18px;}

#intro{
  background-position:left;
  padding: 20px 0;}

  .half-col.left{width:100%; float:left;}
.half-col.right{width:100%; float:right;}

.footer-name, .footer-contact{ width:100%; text-align:center; padding-top:20px;}


}




@media (max-width: 375px) {



}
