@charset "utf-8";
/* Advisory Outdoor Services Styles */

/* Global properties ======================================================== */
* { margin:0; padding:0;}     /* turns off extra spacing around paragraphs*/

html{
	height:100%;				/* Force vertical scrollbars in VTz + Opera to prevent 'jumping' */
	margin-bottom:1px;
	overflow-y:scroll;			/* this line is for IE */
}

a.ViewMore {color: red!important; font-size: 12px!important; line-height: 3em;}
a.ViewMore:hover {color:green;}

a.ViewMoreButton {
    background-color: red!important; 
    color: white!important; 
    font-size: 18px!important; 
    font-weight: bold; 
    padding: 5px 15px 5px 15px; 
    border-radius: 5px;
}
a.ViewMoreButton:hover {background-color:green;}

#BannerR {float: right; display: inline-block; padding-top: 30px;}

body {	background-color: #fff; 
    line-height: 1.5em;
    font-family: 'Open Sans', Arial, Helvetica, serif;}

a       {color: #7D4E16; font-weight: bold; text-decoration: none;}
a:hover {color: #386D35;}

a.green       {color: #386D35; font-weight: bold; text-decoration: none; }
a.green:hover {color: red;}

table.Columns2 {float: left; display: inline-block; margin-right: 20px;}

h1{	
	text-align: left;
	vertical-align: top;
	color: #386D35;		/* green */
	font-family: 'Open Sans', Arial, Helvetica, serif;
	font-weight: bold;
	margin-top: 0px;
	margin-bottom:25px;
	margin-left: 0px;
}

h2 {	
	color: red;		
	font-family: 'Open Sans', Arial, Helvetica, serif;
	font-weight: bold;
	vertical-align: top;
	display: inline;
}

h3 {	
	text-align: center;
	vertical-align: top;
	color: #7D4E16;		/* brown */
	font-family: 'Open Sans', Arial, Helvetica, serif;
	font-weight: bold;
}
h4 {	
	color: #386D35;		/* green */
	font-family: 'Open Sans', Arial, Helvetica, serif;
	font-weight: bold;
	display: inline;
}

img {border:0px; padding:0px;}
img.framed {border:1px; padding:0px; border-color:#000;}

img.center {					/* This is to center an image for all browsers */
  display: block;
  margin-left: auto;
  margin-right: auto;
}


.50percent {width: 50%; height: auto;}
	
.BeforeAfterPhoto {width: 300px;  }	


.Centered {margin: auto; }
.CenterAloneMobileContainer {display: inline;}
.CenterAloneMobileL { float: left; margin-right: 20px;}
.CenterAloneMobileR { float: right; margin-left: 20px;}

.ContactBlock {display: inline;}

.ClearL {clear: left;}

.ColorGreen {color: #386D35;}
.ColorRed {color: red;}

.ContentsCentered {text-align: center;}
.ContentsCentered table {margin-left: auto; margin-right: auto;}

.ContentsLeft {text-align: left;}
.ContentsRight {text-align: right;}

.Copyright{ 
	background-color: #386D35;
	color: #ffffff; 
	font-family: 'Open Sans', Arial, Helvetica, serif;
	vertical-align:middle; 
	font-weight:normal;
    padding-top: 10px; padding-bottom: 10px;
}


.FloatR {float: right;margin-left: 20px;}
.FloatL {float: left; margin-right: 20px;}
.FloatTable {float: left; margin-right: 20px;}

.FrameGray {
	background-color: #d3d3d3;
	padding: 6px;
	-webkit-box-shadow: 0 0 6px rgba(50, 50, 50, .75);
	-moz-box-shadow: 0 0 6px rgba(50, 50, 50, .75);
	box-shadow: 0 0 6px rgba(50, 50, 50, .75);
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

.iframe560 {width: 560px; height: 345px;}
.iframe560v {width: 310px; height: 560px; float: left; margin-right: 20px;}
.iframe560a {width: 560px; height: 315px;}
.iframe420 {width: 420px; height: 315px;}


.KeepTogether {display: inline-block; word-wrap:normal; word-break:keep-all;}

.Link_Copyright:link, .Link_Copyright:visited, .Link_Copyright:active {
	color: #ffffff;
	font-family: 'Open Sans', Arial, Helvetica, serif;
	font-weight: normal;
}
.Link_Copyright:hover {
	color:#d2232a;
	font-family: 'Open Sans', Arial, Helvetica, serif;
	font-weight: normal;
}

.Link_Nav:link, .Link_Nav:visited, .Link_Nav:active {
	color: #ffffff;		/* white*/
	font-family: 'Open Sans', Arial, Helvetica, serif;
	font-weight: normal;
}
.Link_Nav:hover {
	color: #386D35;		/* green */
	font-family: 'Open Sans', Arial, Helvetica, serif;
	font-weight: normal;
}

.mainmenu ul {
	list-style-type: none;	
}
.mainmenu li {
	display: inline;
	float: left;
	padding: 0px;
	padding-top: 4px; 
}

.MobileCenter {display: inline;}

.NavStripe { 
	background:url(images/SilverStripe.png) top repeat-x; 
	width: 100%;
	height: 30px;
		}

/* make all images inside slideshow fill their container */
.SlideContainer {margin-top: 5px; margin-left: 30px; float: right}
#fadeshow { width: 400px !important; height: 300px !important;}
#fadeshow {border-style: solid; border-width: thick; border-radius: 5px; border-color: #ccc;}
#fadeshow img { width: 100%; height: auto; background-color: transparent; margin-top: 0px!important; margin-left: 0px!important }
@media all and (max-width: 768px){ 
    .SlideContainer {float: none; display: block; margin-left: auto; margin-right: auto; margin-bottom: 20px;}
}
@media all and (max-width: 440px){ 
    #fadeshow { width: 300px!important; height: 225px!important;}
}

.PadTop5 { padding-top: 5px;}
.MarginB10 {margin-bottom: 10px;}


.TextBody {	color: #4f4f4f;	font-family: Georgia, "Times New Roman", Times, serif;	text-align: left;}
.TextCaption {font-size: 14px; font-family: Arial, sans-serif; line-height: 14px; text-align: center; padding-top: 6px; padding-bottom: 2px;}

.VertBottom {vertical-align: bottom;}
.VertMid {vertical-align: middle;}
.VertTop {vertical-align: top;}


#menu-icon {display: none; width: 40px; height: 40px; background: url(images/menu40.jpg) right;}
nav ul {	list-style: none; margin: 0px;}
nav li {	display: block;	}


.Phone {	
	font-family: 'Open Sans', Arial, Helvetica, serif;
	font-weight: bold;
	text-align: right;
	margin-top: 0px;
	margin-bottom:15px;
	margin-left: 0px;
}
.Phone a:link, a:visited, a:active {
	color: red;		/* red */
	text-decoration: none;
}
.Phone a:hover {
	color: #386D35;		/* green */
	text-decoration: none;
}


.Certifications {	
	color: #8e8a8f;		/* gray */
	font-family: 'Open Sans', Arial, Helvetica, serif;
	font-weight: bold;
	text-align: right;
	margin-top: 0px;
	margin-bottom:15px;
	margin-left: 0px;
}
.MenuIntro {	
	color: #8e8a8f;		/* gray */
	font-family: 'Open Sans', Arial, Helvetica, serif;
	font-weight: bold;
	margin-top: 0px;
	margin-bottom:05px;
	margin-left: 0px;
}

.TopPhoneContainer {text-align: right; margin-top:20px; margin-bottom: 25px;}
.TopPhone {color: green; font-size: 34px; font-family: 'Myriad Pro', Arial, sans-serif; font-style: normal; font-weight: bold; }
    
.TableThird {width: 33%; float: left; text-align: center; margin-left: auto; margin-right:auto; }


/* NAVIGATION Menu (removed June 2020 for one-page option) */
.NavTop2 {text-align: right; margin-right: -27px/*offsets link padding */; margin-top:5px; margin-bottom: 25px;}
ul.mainNav2 { font-family: 'Open Sans', Arial, sans-serif; }
ul.mainNav2 li {list-style-type: none; display: inline; }
ul.mainNav2 li a, ul.mainNav2 li a:visited {
    padding-right: 27px;    /* match with NavTop2 right margin */
    text-decoration: none;
    color: #386D35;
	text-align: left;
}
ul.mainNav2 li a:hover {
    color: red;
}
ul.mainNav2 li a.current, ul.mainNav2 li a.current:visited, ul.mainNav2 li a.parent, ul.mainNav2 li a.parent:visited  {   color: #000;}
@media all and (max-width: 499px){
	.NavTop2 {text-align: left; margin-right: 10px; margin-top:5px; margin-bottom: 5px;}
}

#Footer {background-color: #ccc; padding-top: 10px; padding-bottom: 10px;}
.FooterColumn {width: 25%; display: inline-block; float: left; text-align: center; vertical-align: top; line-height: 1.2em}
.FooterPhone {color: red; font-size: 30px; font-family: 'Myriad Pro', Arial, sans-serif; font-style: normal; font-weight: bold; }
.FooterColumn h4 {padding-bottom: 10px!important; display: block; }

/* MOBILE OPTIMIZATION *************************************** */
img { max-width: 100%; height: auto; }
.MobileOpt img {height: auto;}
	
/* FOR SPECIFIED VIEWPORT ============================================================================================= */ 

@media all and (min-width: 1000px) {				/* LARGE DEVICES */
	.MobileHide {display: inline-block;}
	.MobileShow {display: none;}
	h1 { font-size: 28px; line-height: 32px;}
	h2, h3 { font-size: 24px; line-height: 32px;}
	h4 { font-size: 14x;}
	.Copyright		{font-size: 14px; line-height: 30px;}
	.Link_Copyright {font-size: 14px; line-height: 30px;}
	.Link_Nav {	font-size: 22px; padding-right: 60px;}	
	.sidebar { font-size: 16px;}
	.TextBody {	font-size: 18px; line-height: 24px;}
	.table1000 {   width: 1000px; margin: auto; }
	.Certifications {font-size: 15px; }
}
@media all and (min-width: 980px) {
	.Phone {font-size: 150%;}
	.Certifications {font-size: 14px; }
	ul.mainNav2 { font-size:18px; line-height: 32px;}
}

@media (min-width: 769px) and (max-width: 999px) {	/* medium devices */ 
    #BannerR  {margin-right: 10px;}
    .MobileHide {display: inline-block;}
	.MobileShow {display: none;}
	.fb-like{	margin-left: 10px; margin-right: 10px;}
	h1 { font-size: 26px;}
	h2, h3 { font-size: 18px; line-height: 24px;}
	h4 { font-size: 12px;}
	.Copyright		{font-size: 14px; line-height: 30px;}
	.Link_Copyright {font-size: 14px; line-height: 30px;}
	.Link_Nav {	font-size: 36px; padding-right: 40px;}	
	.mainmenu {	margin-left: 20px;}
	.sidebar { font-size: 16px;}
	.TextBody {	font-size: 16px; line-height: 24px; margin-left: 10px; margin-right: 10px;}
	.table1000 {   width: 100%;   }
	.Phone {font-size: 140%; }
	.ServiceAreaMap {width: 150px; height: auto;}
    .Certifications {font-size: 12px; }	    
	ul.mainNav2 { font-size:16px; line-height: 32px; text-align: left;  margin-left: 10px;}		
	.MenuIntro { text-align: left; margin-left:10px;}
    .FooterColumn h4, .FooterColumn {font-size: 14px;}	
}

/* small devices */ 
@media all and (max-width: 768px) {
	#BannerR { float: none; display: block; padding-top: 0; margin-left: auto; margin-right: auto; text-align: center;}
    .TopPhoneContainer {margin-left: auto; margin-right: auto; text-align: center; font-size: 90%; margin-top: 0px; margin-bottom: 0px;}
	.MobileHide {display: none;}
	.MobileShow {display: inline-block;}
	.fb-like {	margin-left: 20px;}
	h1 { font-size: 24px; line-height: 28px; text-align: center;}
	h2, h3 { font-size: 17px; line-height: 22px;}
    h2.CheckServices {display: block; margin-left: 30px;}
	h4 { font-size: 10px;}
    .Copyright		{font-size: 14px; line-height: 20px;}
	.Link_Copyright {font-size: 14px; line-height: 20px;}
	.Link_Nav {	font-size: 22px; padding-right: 20px;}	
	.mainmenu li {	margin-left: 15px;}
	.sidebar { font-size: 14px;}
	.TextBody {	font-size: 14px; line-height: 20px; margin-left: 10px; margin-right: 10px;}
	.table1000 {   width: 100%; }
	.Phone {font-size: 110%; padding-top: 15px !important; font-weight: 600 !important; display: block; float: none; margin: 0; text-align: center; padding-bottom: 10px!important;}	
	.ServiceAreaMap {width: 100px; height: auto;}
    .NavTop2 {margin-left: 10px!important;}
    ul.mainNav2 { font-size:16px; line-height: 32px;}
	.MenuIntro {text-align: left;	margin-left:10px;}
	.Certifications {font-size: 14px; text-align: center;}
    .CenterAloneMobileContainer {display: block; width: 100%; text-align: center; align-content: center; background-color: white; }
	.CenterAloneMobileL, .CenterAloneMobileR {display: block; float: none; margin-left: auto!important; margin-right: auto!important; }  
    .FooterColumn {width: 45%; height: 130px; float: unset; }
    .FooterColumn h4 {font-size: 15px;}
    .FooterCol4 {vertical-align: bottom;}
}

@media all and (max-width: 600px) {
   h2, h3 { font-size: 15px; line-height: 20px;} 
}
/* very small devices ONLY HAVE A FEW DIFFERENCES to override the above */ 
@media all and (max-width: 480px) {
	h1 {line-height: 30px;}
	.fb-like {	margin-left: 20px;}
	.Link_Nav {	font-size: 30px; padding-right: 10px;}	
	.sidebar {	width: 100%;	float: left; 	margin-left: 5px; margin-right: 5px; margin-bottom: 15px;}
	#menu-icon { display: inline-block;}
	#nav-wrap {margin-top: -40px;}
	#nav {  display: none; } /* visibility will be togggled with jquery */
	nav li {	font-size: 16px; line-height: 24px; margin-left: 45px;}
	.TextBody {	margin-left: 12px; margin-right: 10px;}
	.fadeshowWrap {display: block; margin: auto; float: right;}
	.iframe420 {width: 294px; height: 221px;}	
	.iframe560 {width: 294px; height: 182px;}
	.iframe560a {width: 294px; height: 182px;}
	.MobileMarginBottom {margin-bottom: 10px;}
	.Phone {font-size: 22px; display: block; float: none; margin-left: auto; margin-right: auto; }	
	ul.mainNav2 { font-size:18px; text-align: left; margin-left: 0px; }
    .FooterColumn {width: 100%; display: block; margin-left: auto; margin-right: auto;}
    .FooterColumn h4 {font-size: 16px;}
    .FooterColumn {height: auto; padding-bottom: 20px;}
}
/* VERY small devices ONLY HAVE A FEW DIFFERENCES to override the above */ 
@media all and (max-width: 320px) {
	.Link_Nav {	font-size: 20px; padding-right: 10px;}	
	.Phone {font-size: 22px; text-align: left; padding-left: 10px;}	
	.Certifications {font-size: 16px; }	
	ul.mainNav2 { font-size:16px; line-height: 26px; margin-left: 0px; }

}

