/* --------------------------------------
   Layout
   -------------------------------------- */
   
  @font-face {
   font-family: 'oswaldbold';
    src: url('../fonts/oswald-bold-webfont.woff2') format('woff2'),
         url('../fonts/oswald-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;}
  
body {
	 font-family: Verdana, Geneva, sans-serif;
    color: #222; background-image:url(../images/garage-door-repair-north-end-110.jpg); background-repeat:repeat;
 font-size: 15px;
    overflow-x: hidden;}

.blackAll, .blackAll h2, .blackAll strong{ color:#000 !important; text-shadow:none !important}
a, a:hover { color: #000;}
p{    font-family: Tahoma, Geneva, sans-serif;	font-size:1em;}
div.container{	position:relative;}
.floatLeft { float:left}
.floatRight { float:right}
.noborder { border-right:none !important}
/* --------------------------------------
   Header and Navigation, LOGO
   -------------------------------------- */
.banner-wallpaper {
    background-color:#000;       }
	a[href^=tel] { color: inherit; text-decoration: none; }

#CreditCardVER1 { padding:5px; float:left;} 
#phoneTopVER1 p { margin:0; padding:0; line-height:100%;}
#phoneTopVER1 { font-size:18pt; letter-spacing:-1px; color:#FCA402; padding-top:5px;}
.phoneVER1TopsmallFontVER1 { font-size:12pt; text-transform:uppercase}
#phoneTopVER1 img { float:left; margin-top:10px; margin-right:10px;}
#SeoPhoneBGVER1{background: #627d4d; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #627d4d 0%, #1f3b08 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #627d4d 0%,#1f3b08 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #627d4d 0%,#1f3b08 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#627d4d', endColorstr='#1f3b08',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ color:#fff;}
#seoPaddingVER1 h1 { padding:7px 0 0 0; margin:0; color:#FCA402; font-size:24pt; font-family: 'oswaldbold';}
.phoneVER1 { text-align:center; color:#fff; font-size:2em; }
#seoPaddingVER1 strong{ background:#333; color:#FFF; padding:3px 10px; letter-spacing:1px;}
.bgWhiteVER1{ background:#FFF; }

/* --------------------------------------
   Navigation
   -------------------------------------- */
.navbar-inverse{
		background:none; border-bottom:none; text-transform:lowercase !important
		
}

.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:focus, .navbar-inverse .navbar-nav > .active > a:hover {
    background:#000 !important;
    color: #FFC; text-shadow:1px 2px 1px #1A2D10;
		
}
.navbar-inverse .navbar-nav > li > a{
	font-family: Verdana, Geneva, sans-serif; text-transform:lowercase !important; padding:11px 20px; 	
	 	font-size:1.2em; font-weight:bold; text-shadow:1px 1px 1px #B8D69E;
	color: #000;
   background:#78995D;
}

.navbar-inverse .navbar-nav > li > a:focus, .navbar-inverse .navbar-nav > li > a:hover {
      color: #222; text-decoration:underline;
}

.navbar { margin-bottom:0; background:#78995D; }
.navbar .navbar-nav {
  display: inline-block;
  float: none;
  vertical-align: top;
}

.navbar .navbar-collapse {
  text-align: center;
}
/* --------------------------------------
   Banner
   -------------------------------------- */
   #bannerVER1{
	 margin:0px auto; 
    width: 100%; 
   	background-size:cover;
	position:relative;
}

.carousel-caption h2{ font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; text-shadow:1px 2px 2px #000;}
.carousel-caption p{ color:#ccc}

#bootstrap-menu{
    -webkit-transition:all 0.3s 0s ease-in-out;
    transition:all 0.3s 0s ease-in-out; margin:0;
	 font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	 font-weight:bold; 
}
		
.banner-wallpaper{ background-repeat:no-repeat !important}
.carousel-indicators li {
    background-color: rgba(255, 255, 255, 0.3);
    border: medium none;
    border-radius: 10px;
    box-shadow: 0 0 3px #555;
    height: 12px;
    margin: 0;
    padding: 0;
    width: 12px;
}
.carousel-indicators .active {
    background-color: rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(0, 0, 0, 0.1);
       height: 12px;
    margin: 0;
    width: 12px;
}
	
		
/* --------------------------------------
   MainContent
   -------------------------------------- */	
.shadowborderMainVER1{ box-shadow:0px 0px 3px #333}
.shadowborderMain2VER1 { box-shadow:0px 0px 15px #ccc; margin-bottom:15px; background-color: rgba(255, 255, 255, 0.3); margin-top:7px}
.contentbgVER1 { margin-top:10px; margin-bottom:20px; padding:5px; margin-right:10px;  text-shadow:1px 1px 1px #fff; }
p.despatch{ color:#666 !important; font-style:italic; text-align:center; font-size:13pt; font-weight:bold;}
.contentbgVER1 p {color:#000;  margin-right:20px; margin-left:20px; text-shadow:1px 1px 1px #fff;}
.contentbgVER1 ul, .contentbgVER1 li {color:#222; text-shadow:none; list-style:square; margin-right:20px; margin-left:10px;  text-shadow:1px 1px 1px #fff;}

.wellcontet {  background-color: rgba(255, 255, 255, 0.8);
			background-repeat:repeat;  
		-moz-box-shadow:0px 0px 14px #15260D;
		  -webkit-box-shadow:0px 0px 14px #15260D;
		  box-shadow:0px 0px 14px #15260D;}
		  
.contentbgVER1 h1 { color: #333; text-transform:uppercase;  font-family: 'oswaldbold'; font-size:220%;  padding:0 10px 0px 20px; margin:0; font-weight:normal;}
.contentbgVER1 h2, .contentbgVER1 h3, .contentbgVER1 h4, .contentbgVER1 h5{ color: #000; font-size:1.6em; margin-right:20px; margin-right:20px;
                 margin-left:20px;  font-family: Arial, Helvetica, sans-serif; font-weight:normal; letter-spacing:-1px;}
.shadowImgBox { margin:10px 20px; float:right; }

		
/* --------------------------------------
   leftPanel
   -------------------------------------- */	
   
.otherservices { 

background: #a4b357; /* Old browsers */
background: -moz-linear-gradient(top,  #a4b357 0%, #75890c 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #a4b357 0%,#75890c 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #a4b357 0%,#75890c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a4b357', endColorstr='#75890c',GradientType=0 ); /* IE6-9 */
padding:5px 10px; text-align:center; font-family: 'oswaldbold'; font-size:26pt; color:#000; text-shadow:1px 1px 1px #C8DB5C; margin-top:15px; margin-bottom:1px; text-transform:uppercase}

.boxCoupon { 
background: #7d7e7d; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #7d7e7d 0%, #0e0e0e 62%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #7d7e7d 0%,#0e0e0e 62%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #7d7e7d 0%,#0e0e0e 62%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
padding:10px;
-moz-box-shadow:    inset 0 0 25px #000000;
   -webkit-box-shadow: inset 0 0 25px #000000;
   box-shadow:         inset 0 0 25px #000000;
   margin-bottom:1px;
   color: #ccc; text-shadow:2px 2px 2px #222;}
   
.boxCoupon h2{ margin:0; padding:0; text-align:right; text-transform:uppercase; letter-spacing:-1px; font-size:30pt; color:#fff; text-shadow:1px 2px 1px #000} 

.boxCoupon h5{ margin:0; padding:0; text-align:right; text-transform:uppercase; letter-spacing:-1px; font-size:30pt; color:#fff; text-shadow:1px 2px 1px #000} 
.boxCoupon h3{ margin:0; padding:0; text-transform:uppercase; text-align:center; letter-spacing:-1px; font-size:27pt; color:#fff; text-shadow:1px 2px 1px #000} 

.boxCoupon h4{ margin:0; padding:0; text-transform:uppercase; text-align:right; letter-spacing:-1px; font-size:20pt; color:#fff; text-shadow:1px 2px 1px #000} 
.centerAlign { text-align:center !important}
.couponFont { font-size:14pt;}

/* --------------------------------------
   FooterServicesHomePage
   -------------------------------------- */
   
   	
   .servicesGarageDoorPadding { background-color: rgba(0, 0, 0, 0.7);  padding:10px; min-height:180px; }
   h4 { color:#FFD952}
  .servicesGarageDoor .post {
      padding: 5px; 
    position: relative; color:#ccc }
	 .servicesGarageDoor .post img{ float:left; padding:0 5px 5px 0; border-radius:50% 50%}
  .servicesGarageDoor .post-1 {
    transform: translate(100px, 20px);}
  .servicesGarageDoor .post-2 {
    z-index: 2; }
  .servicesGarageDoor .post-3 {
    transform: translate(-100px, 20px); }	

 a.nonedecoration{ text-decoration:none !important; color:#605F5F;}
 #footerbg {background:#171717;
text-align:center; color:#605F5F; font-weight:bold; padding:10px; 
   -moz-box-shadow:    inset 0 0 15px #0A0A0A;
   -webkit-box-shadow: inset 0 0 15px #0A0A0A;
   box-shadow:         inset 0 0 15px #0A0A0A}
 
#schemacss {font-size:110%;  margin: 10px 0;  color:#fff; font-style:normal}			  
#schemacss h2{	font-family: 'oswaldbold'; font-size:26pt; color:#fff; text-shadow:1px 1px 1px #000; margin:0;
				 text-transform:none}
.schema_add_map div { display: inline; }
.footerTExt a, .footerTExt a:hover{color: #605F5F;}
.footerBackground {background:#000;  padding:10px 50px; color:#fff; text-align: center}
   .footerBackground h1{ padding:0; font-weight:bold; font-size:27pt; letter-spacing:1px; margin:0 0 10px 0; color:#eee; text-shadow:2px 2px 2px #0D1708;  font-family: "oswaldbold"; opacity:0.9}   
       img.FooterIMGSErvices{ float:left; margin-right:10px; -webkit-border-radius:50%;
					-moz-border-radius:50%;
					border-radius:50%; width:20%}	
	#brandSchema { background:#202020;  color:#CCC}
	#brandSchema a{ color:#fff;}
	#schemacss h2 strong{ letter-spacing:1px;
    background: #e39a3b none repeat scroll 0 0;
    color: #fff;
    padding-left: 10px;
    padding-right: 10px;}
	#schemacss strong { color:#FC0}
	#brandright { text-align:right; font-size:13pt; font-weight:bold}
	#brandright img{ float:right}
.clearboth { clear:both} 
.paddingBrand { padding:10px;}
    

/* Small screen laptop and pc */
@media (max-width: 1199px) {#phoneTopVER1{ font-size:18pt; line-height:160%}  
							#CreditCardVER1 { width:40%} .contentbgVER1 h1 { font-size:21pt}
							#phoneTopVER1 {font-size:15pt}
							#CreditCardVER1 { width:30%}
							#seoPaddingVER1 h1 { font-size:18pt}											
							.navbar-inverse.sticky {
										position: fixed;
										font-size: 18px;
										line-height: 48px;
										height: 70px; 
										width: 100%;          
										background: #78995D;
										text-align: left;
										padding-left: 20px;
										opacity:0.9; }
							.navbar-inverse.sticky .navbar-nav > li > a{font-size:0.65em; background:#78995D}
							.navbar-inverse.sticky .navbar-nav{margin:5px 0;}
							.navbar-inverse{ font-size: 12px; height: auto;}													
							#bannerVER1{margin:0px auto 0;}	
							.navbar-inverse.sticky {top:0;}
							.navbar-inverse .navbar-nav > li > a{
										 padding:11px 20px; }
							  .servicesGarageDoorPadding {  min-height:240px; }
								  .carousel-caption h2{ font-size:12pt; margin:0; padding:0;}
							  
							 .boxCoupon h5{ font-size:23pt;} .carousel-caption .btn {display:none}
			
					
}
					
@media (max-width: 994px) { .servicesGarageDoorPadding {  min-height:315px; }
   .carousel-caption h2{ font-size:13pt;} .carousel-caption .btn {display:none}
							#phoneTopVER1{ font-size:12pt; line-height:240%} 
							#phoneTopVER1 strong{ font-size:11pt}
							#CreditCardVER1 { width:47%}
							#seoPaddingVER1{ font-size:12px}
							a, a:hover { font-size:16px}
							.contentbgVER1 h1 { font-size:20pt}
							.navbar-inverse.sticky {height: 40px; }
							.navbar-inverse.sticky .navbar-nav > li > a{font-size:0.65em; padding:5px 24px; background:#78995D}
							.navbar-inverse.sticky .navbar-nav{margin:5px 0;}
							.navbar-inverse.sticky .navbar-brand{top:0;font-size:1em;}		
							.navbar-inverse{ font-size: 12px; height: auto;}
							.navbar-brand{ font-size:20pt;}							
							#bannerVER1{margin:0px auto 0;}	
							.navbar-inverse.sticky {top:0;}
							.navbar-inverse .navbar-nav > li > a{
										 padding:11px 13px; }	
							#phoneTopVER1 {font-size:14pt; line-height:100%}
							#seoPaddingVER1 h1 { font-size:12pt; text-transform:uppercase}
							#CreditCardVER1 { width:25%}
							#seoPaddingVER1 { text-transform:lowercase}
							img.floatLeftSErvices { width:35%}
							.carousel-indicators { bottom:-5px;}
							#seoPaddingVER1 h1 { font-size:14pt}
							#schemacss h2 { font-size:20pt}.carousel-caption { padding-bottom: 14px;}
							#schemacss{ font-size:100%}
							#brandright { font-size:8pt}	 .boxCoupon h5{ font-size:18pt;} 													
}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {	 .otherServices { display:none;} .carousel-caption { bottom:-10px; padding-bottom:20px} .carousel-indicators { bottom:-10px} .carousel-caption .btn { display:none}	#footerbg a, #footerbg a:hover, #footerbg, a, a:hover{font-size:16pt}
							.contentbgVER1{ width:100%; clear:both; margin:0;}
							aside {width:100%; line-height:inherit; clear:both; margin:0; padding:0;}
							#SeoPhoneBGVER1 { display:none}						
							.bgphone2 img{width:224px; margin:0 auto}
							.bgphone2 p{ font-size:20pt;} h2.visible-xs{ padding-left:5px; padding-bottom:5px;}	
							.quickResponse, .hoursResponse, .callPHone, .coupon{ width:461px; margin:10px auto}
							.bgphone2 {
background: #425631;

text-align:center; color:#fff;} h3.visible-xs { font-size:27pt; text-transform:uppercase; font-weight:bold; text-align:center;  font-family: "oswaldbold"; color:#333;}
							.contentbgVER1 h1 { font-size:20pt}
							.navbar-inverse{height:auto; opacity:0.9;}
							.navbar-inverse .navbar-nav > li > a{font-size:20px; font-weight:bold; padding:10px 40px !important;}
							.navbar-inverse .navbar-nav > .active > a, .navbar-inverse 
							.navbar-nav > .active > a:focus, .navbar-inverse .navbar-nav > 							
							.active > a:hover {	border:none; padding:10px 40px}
							.navbar-nav{float: inherit!important; clear:left; margin:0px;}
							.navbar-collapse{padding-bottom:5px;}
							.navbar-inverse.sticky .navbar-nav > li > a{font-size:20px; font-weight:bold;  padding:10px 20px !important;}
							.navbar-inverse.sticky .navbar-nav > .active > a, 
							.navbar-inverse.sticky .navbar-nav > .active > a:focus, .navbar-inverse.sticky .navbar-nav > 
							.active > a:hover {	border:none;  padding:10px 20px}
							.navbar-inverse.sticky{height:auto; opacity:0.9;}
							.navbar-collapse.sticky{padding-bottom:5px;}
							.navbar-inverse.sticky .navbar-brand{top:0; font-size:1.1em; color:#fff}							
							#bannerVER1{margin:0px auto 0; background:#000;}	
							.navbar-inverse .navbar-toggle { border-color: #93BF6E;}
							.navbar-inverse .navbar-toggle:hover,
							.navbar-inverse .navbar-toggle:focus { background-color:#425631;}
							.navbar-inverse.sticky {top:0;}	
							 .servicesGarageDoorPadding {  min-height:140px; }
							.navbar-toggle { background: #222}
							img.FooterIMGSErvices { width:inherit}	
							img.floatLeftSErvices {display:none }	
							.servicebox a:hover, .servicebox a{ font-size:16pt}		 #brandright { font-size:130%}	
								 h2.visible-xs{ color:#fff; font-size:18pt}
								 
							 .boxCoupon h5, .boxCoupon h2, .boxCoupon h3, .boxCoupon h4, .boxCoupon{ text-align:center !important} 
							 .boxCoupon h5, .boxCoupon h2, .boxCoupon h3, .boxCoupon h4{ font-size:32pt} 		


}

/* Portrait & landscape phone */
@media (max-width: 670px) { 
							 .contentbgVER1 h1 { font-size:18pt}
							a, a:hover, #footerbg a, #footerbg a:hover, #footerbg{ font-size:16pt}	
							 .navbar-inverse.sticky {top:0;}
							 .banner-wallpaper { display:none}		
							
							
}
@media (max-width: 520px) {	#schemacss { text-align:center}		
							.bgphone2 p { font-size:18pt}
							.bgphone2 { font-size:12px}
							#schemacss h2 { font-size:26pt}  	
							.shadowImgBox { display:none}
							.servicesGarageDoor .post img { float:inherit}
							 .navbar-inverse.sticky .navbar-brand{top:0; font-size:12pt;}	
							 .navbar-inverse .navbar-brand{top:0; font-size:15pt;}
							 .navbar-inverse.sticky {top:0;}
							 h2.visible-xs{ font-size:13pt}								 
							 .boxCoupon h5, .boxCoupon h2, .boxCoupon h3, .boxCoupon h4{ font-size:25pt} 
							
}

@media (max-width: 400px) {	.bgphone2 p { font-size:18pt}
							.bgphone2 { font-size:12px}									
							#schemacss h2 { font-size:17pt}
							.contentbgVER1 h1, .contentbgVER1 h2, .contentbgVER1 h3, .contentbgVER1 h4, .contentbgVER1 h5{ font-size:16pt}
							#otherservices { font-size:19pt}
							.navbar-brand{ font-size:18pt;}	
							.navbar-inverse.sticky .navbar-brand { font-size:12pt;}								
							.navbar-inverse.sticky .navbar-brand{top:0; font-size:11pt;}	
							 .navbar-inverse .navbar-brand{top:0; font-size:13pt;}	
							 .navbar-inverse.sticky {top:0;}
							  h2.visible-xs{ font-size:12pt}
							  img.FooterIMGSErvices { display:none}							 
							  .footerBackground h1 { font-size:20pt}							  
							 .boxCoupon h5, .boxCoupon h2, .boxCoupon h3, .boxCoupon h4{ font-size:22pt} 
							  
}

@media (max-width: 360px) {	.bgphone2 p { font-size:16pt}
							.bgphone2 { font-size:12px}
							a, a:hover, #footerbg a, #footerbg a:hover, #footerbg{ font-size:14px}
							#schemacss a, #schemacss{ font-size:14px}
							.emailSM{ font-size:13px !important}	
							.navbar-inverse.sticky .navbar-brand { font-size:10pt;}													
							.navbar-inverse.sticky .navbar-brand{top:0; font-size:11pt; text-transform:lowercase}	
							 .navbar-inverse .navbar-brand{top:0; font-size:10pt;}	
							.navbar-inverse.sticky {top:0;}
							 h2.visible-xs{ font-size:8pt}	
							 .boxCoupon h5, .boxCoupon h2, .boxCoupon h3, .boxCoupon h4{ font-size:18pt}
						
}
@media (max-width: 240px) {	.bgphone2 p { font-size:14pt}	.servicebox a:hover, .servicebox a{ font-size:13pt}							
							#footerServicesHome h2{ font-size:12px}
							.asideServices { font-size:12px !important}
							a, a:hover, #footerbg a, #footerbg a:hover, #footerbg{ font-size:12px}
							.navbar-brand{ font-size:11px;}	
							.navbar-inverse.sticky .navbar-brand { font-size:12px;}	
							.navbar-inverse .navbar-nav > li > a, .navbar-inverse.sticky .navbar-nav > li > a
							{font-size:12px !important; font-weight:bold; padding:10pxpx !important;}
							.navbar-inverse.sticky .navbar-brand{top:0; font-size:10pt; text-transform:lowercase}	
							 .navbar-inverse .navbar-brand{top:0; font-size:9pt;}	
							 .navbar-inverse.sticky {top:0;}
							  h2.visible-xs{ font-size:11pt}	
}


@media (min-width: 1200px) {
.navbar-inverse{
            // set animation
            -webkit-transition: all 0.4s ease;
            transition: all 0.4s ease;}

#bannerVER1{margin:0px auto 0; background:#000;}
.navbar-nav{margin:0;}
.navbar-inverse.sticky {top:0;
            position: fixed;
            font-size: 24px;
            line-height: 48px;
            height: 60px; 
            width: 100%;          
		background:#78995D;
            text-align: left;
           			opacity:0.94; box-shadow:5px 5px 5px #2B511E }

.navbar-inverse.sticky .navbar-nav > li > a{font-size:0.65em; padding:10px 42px; background:#78995D}
.navbar-inverse.sticky .navbar-nav{margin:5px 0;}

}
@media (min-width: 1266px) {  #footerServicesHome h2{ font-size:14pt; font-family:Georgia, "Times New Roman", Times, serif} }
@media (min-width: 1280px) { #footerServicesHome h2{ font-size:16pt} }


