/* --------------------------------------
   Layout
   -------------------------------------- */
   @font-face {
    font-family: 'lobster_1.3regular';
    src: url('http://www.sedalialocksmith.com/lobster_1.3-webfont.eot');
    src: url('http://www.sedalialocksmith.com/lobster_1.3-webfont.eot?#iefix') format('embedded-opentype'),
         url('http://www.sedalialocksmith.com/lobster_1.3-webfont.woff2') format('woff2'),
         url('http://www.sedalialocksmith.com/lobster_1.3-webfont.woff') format('woff'),
         url('http://www.sedalialocksmith.com/lobster_1.3-webfont.ttf') format('truetype'),
         url('http://www.sedalialocksmith.com/lobster_1.3-webfont.svg#lobster_1.3regular') format('svg');
    font-weight: normal;
    font-style: normal;

}

   @font-face {
    font-family: 'lobster_1.3regular';
    src: url('http://sedalialocksmith.com/lobster_1.3-webfont.eot');
    src: url('http://sedalialocksmith.com/lobster_1.3-webfont.eot?#iefix') format('embedded-opentype'),
         url('http://sedalialocksmith.com/lobster_1.3-webfont.woff2') format('woff2'),
         url('http://sedalialocksmith.com/lobster_1.3-webfont.woff') format('woff'),
         url('http://sedalialocksmith.com/lobster_1.3-webfont.ttf') format('truetype'),
         url('http://sedalialocksmith.com/lobster_1.3-webfont.svg#lobster_1.3regular') format('svg');
    font-weight: normal;
    font-style: normal;

}
   
body {
	 font-family:Tahoma, Geneva, sans-serif;
    color: #222;
	background-image:url(../images/sedalia-locksmith-1111aa.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;}
	

/* --------------------------------------
   Header and Navigation, LOGO
   -------------------------------------- */
.banner-wallpaper {
    background-color: #000;
    background-image: url("../images/sedalia-locksmith.jpg");
    background-attachment: fixed;
    background-repeat: repeat-y; 
	-webkit-box-shadow: 0 8px 10px -6px black;
	-moz-box-shadow: 0 8px 10px -6px black;
	box-shadow: 0 8px 10px -6px black; margin-bottom:5px;}
	
.navbar-brand{
	position:absolute;
	top:10px; color: #FC0 !important;	
	display:block; text-shadow:2px 2px 2px #000;
	font-family: 'lobster_1.3regular'; 
	 font-size:28pt; font-weight:bolder	
}

#CreditCard { padding:5px; float:left;} 
#phoneTop { font-size:20pt; text-transform:uppercase; font-weight:bolder; color:#999; line-height:170%; float:right}
#SeoPhoneBG{background: #0D204F; color:#999}
#seoPadding{ line-height:270%}
.phone { text-align:center; color:#fff; font-size:2em; }

/* --------------------------------------
   Navigation
   -------------------------------------- */
.navbar-inverse{
		background: #a90329; /* Old browsers */
		background: -moz-linear-gradient(top,  #a90329 0%, #8f0222 44%, #6d0019 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  #a90329 0%,#8f0222 44%,#6d0019 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  #a90329 0%,#8f0222 44%,#6d0019 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=0 ); /* IE6-9 */
		height:70px;
		border-color:transparent;
}

.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:focus, .navbar-inverse .navbar-nav > .active > a:hover {
    background-color:#FFA22E;
    color: #000; 
	-webkit-border-radius: 0 0 50% 50%;
	-moz-border-radius: 0 0 50% 50%;
	 border-radius: 50% 0 50% 50%;
	
}
.navbar-inverse .navbar-nav > li > a{
	font-family: Arial, Helvetica, sans-serif;
	font-size:1em;
	color:#ffffff;
}
.navbar-inverse .navbar-nav > li > a:focus, .navbar-inverse .navbar-nav > li > a:hover {
      color: #FC0;
}

.navbar { margin-bottom:0;}

/* --------------------------------------
   Banner
   -------------------------------------- */
   #banner{
	 margin:0px auto; 
    width: 100%; 
   	background-size:cover;
	position:relative;
}

#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; 
}
.serviceBanner { padding:7px;}
.serviceBanner img{box-shadow: 0 0 20px #000; border:5px solid rgba(255,255,255,0.1);  
					width:200px; margin:0 auto; 				
					-webkit-border-radius:50% 0 50% 50%;
					-moz-border-radius:50% 0 50% 50%;
					border-radius:50% 0 50% 50%;}
.serviceBanner h2 { font-size:18px; letter-spacing:-1px; margin:0; padding:0; text-align:center; }
.serviceBanner a{ text-shadow:2px 2px 2px #000; color:#FEBF01; text-transform:lowercase; font-style:italic}
.serviceBanner a:hover{ opacity:0.8}
		
				.carousel-indicators { bottom:-20px; background-color:rgba(0,0,0,0.8); width:90px; left:75%; opacity:0.7;
				 -webkit-box-shadow: 0 8px 6px -6px black;
	   			-moz-box-shadow: 0 8px 6px -6px black;
				-webkit-border-radius: 10px;
					-moz-border-radius: 10px;
					border-radius: 10px;
				}
.banner-wallpaper{ background-repeat:no-repeat !important}
		
/* --------------------------------------
   MainContent
   -------------------------------------- */	
 
 #MainContentShadow {-webkit-box-shadow: 0px 0px 25px #000;
	   -moz-box-shadow:0px 0px 25px #000;
	        box-shadow:0px 0px 25px #000;
 			border:1px solid #f4f4f4;
					padding:10px; background: #EFEFEF; margin-bottom:20px;}	

.contentbg { margin-top:10px; margin-bottom:20px; padding:5px; margin-right:10px }
.contentbg p { color:#222;  margin-right:20px; margin-left:20px; text-shadow:none}
.contentbg ul, .contentbg li {color:#333; text-shadow:none; list-style:square; margin-right:20px; margin-left:10px;}
.contentbg h1 { color: #0D204F; font-weight:bolder; font-size:200%;  padding:0 10px 10px 20px;
                margin:0; font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; letter-spacing:-1px;}
.contentbg h2, .contentbg h3, .contentbg h4, .contentbg h5{ color: #333; font-size:1.6em; margin-right:20px; margin-right:20px;
                 margin-left:20px;  font-family:Tahoma, Geneva, sans-serif; font-weight:bold}
.shadowImgBox { margin:10px 20px; float:right; box-shadow: 0 0 10px #ccc; padding:1px;  -webkit-border-radius: 50%;
				-moz-border-radius: 50%; border-radius: 50%;}

		
/* --------------------------------------
   RightPanel
   -------------------------------------- */	
   
#otherservices { font-family:Tahoma, Geneva, sans-serif; font-size:27pt; color:#f4f4f4; 
                   text-shadow:2px 2px 2px #000; padding:3px; letter-spacing:-1px; margin-top:15px; font-weight:bolder; text-align:center;
				  -webkit-box-shadow: 0 8px 6px -6px black;
	   			-moz-box-shadow: 0 8px 6px -6px black;
				-webkit-border-radius: 10px;
					-moz-border-radius: 10px;
					border-radius: 10px;
	       		 box-shadow: 0 8px 6px -6px black; background:#0D204F; text-align:center}
.GraybgCoupon2 { background:#0D204F;
 				padding:20px; margin-top:20px;  -webkit-box-shadow: 0 8px 6px -6px black;
	   			-moz-box-shadow: 0 8px 6px -6px black;
	       		 box-shadow: 0 8px 6px -6px black;
					 -webkit-border-radius: 10px;
					-moz-border-radius: 10px;
					border-radius: 10px; } 
.GraybgCoupon2
		 p{ text-transform:lowercase; font-size:14pt; 
   			 color:#CCC; text-shadow:1px 1px 1px #333; text-align:center; font-weight:bolder; margin:0; padding:0;}
.BGYellowMainServices { background:#FEBF00; padding:0px 10px; 
						text-align:center; color:#000; font-size:50pt; font-weight:bolder; letter-spacing:-2px; margin:0;} 
.bluecoupon { background: #000; padding:10px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; margin-top:10px;} 
.REDBG { background:#000;-webkit-box-shadow: 0 8px 6px -6px black; -moz-box-shadow: 0 8px 6px -6px black;
	           box-shadow: 0 8px 6px -6px black;
			   padding:10px 20px; margin-top:15px; 	
			   	-webkit-border-radius: 10px;
					-moz-border-radius: 10px;
					border-radius: 10px;}
.BGWhiteMain { padding:5px; -webkit-border-radius: 20px; -moz-border-radius: 20px; 
 	                border-radius: 20px; margin-top:10px; color:#000; text-shadow:1px 1px 1px #fff;
				    background:#ccc; text-align:center; font-size:20pt; font-weight:bolder; line-height:100%}
.CouponYellowServices { color:#FEBF00;  font-size:50pt; text-shadow:none; 
                    line-height:100%; font-weight:bolder; letter-spacing:-2px; margin:0; text-align:center; padding:0;}
.CouponYellowServices2 { color:#000;  font-size:50pt; text-shadow:none; 
  				   line-height:100%; font-weight:bolder; letter-spacing:-2px; margin:0; text-align:center; padding:0; text-shadow:none}
 
.BGWhiteMain2 { padding:5px; -webkit-border-radius: 20px; -moz-border-radius: 20px; 
  				   border-radius: 20px; margin-top:10px; color:#fff; text-shadow:none; background:#000; 
  				   text-align:center; font-size:25pt; font-weight:bolder}
.YellowPhoneAside {
		background: #febf01; /* Old browsers */
		background: -moz-linear-gradient(top,  #febf01 0%, #febf01 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  #febf01 0%,#febf01 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  #febf01 0%,#febf01 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#febf01', endColorstr='#febf01',GradientType=0 ); /* IE6-9 */
		padding:10px 20px; margin-top:15px; margin-bottom:20px; -webkit-box-shadow: 0 8px 6px -6px black;
		-moz-box-shadow: 0 8px 6px -6px black;
		box-shadow: 0 8px 6px -6px black;
		-webkit-border-radius: 10px;
			-moz-border-radius: 10px;
			border-radius: 10px;
		}

/* --------------------------------------
   FooterServicesHomePage
   -------------------------------------- */	
#footerServicesHome{ padding:1px 0px;   
   	    vertical-align: middle; margin:0 auto;
	    text-align:center; text-transform:lowercase}	
#footerServicesHome h2{font-family: 'lobster_1.3regular'; text-align:center; color:#000;
                        text-align:center; font-weight:bold; font-size:14pt; padding-bottom:0; margin-bottom:0;}
.boxServices{ 
		background: #2B030E;
			 padding:10px 20px;			
			 margin:7px 0; color:#fff;}
.boxServices h2{  color: #FEBF01 !important; margin:0; padding:0;}
.boxServices p{ color:#fff; padding:10px}
 a.nonedecoration{ text-decoration:none !important; color:#fff;}
 #footerbg {background: #F90;
text-align:center; color:#000; font-weight:bold; padding:10px 20px;}
 
#schemacss {font-size:120%;  margin: 10px 0;  color:#2B030E; text-align:center; text-transform: lowercase; font-style:normal}			  
#schemacss h2{	font-family: 'lobster_1.3regular'; 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: #000;}

/* Small screen laptop and pc */
@media (max-width: 1199px) {#phoneTop{ font-size:18pt; line-height:160%} 
							#CreditCard { width:40%} .contentbg h1 { font-size:21pt}
							#otherservices { font-size:20pt}
							.navbar-inverse.sticky {
										position: fixed;
										font-size: 18px;
										line-height: 48px;
										height: 70px; 
										width: 100%;          
										background: #333;
										text-align: left;
										padding-left: 20px;
										opacity:0.9; }
							.navbar-inverse.sticky .navbar-nav > li > a{font-size:0.65em;}
							.navbar-inverse.sticky .navbar-nav{margin:5px 0;}
							.navbar-inverse.sticky .navbar-brand{
									text-indent:0;	color: #FC0 !important; 
									width:auto; top:10px; 
									font-family:Arial, Helvetica, sans-serif; 
									font-style: normal;}		
							.navbar-inverse{ font-size: 12px; height: auto;}
							.navbar-brand{
								 font-size:21pt; height: auto; top:auto}
							
							#banner{margin:0px auto 0; background:#000;}	
							.BGWhiteMain { font-size:20px}
							.BGYellowMainServices { font-size:34pt}
							.BGWhiteMain2 { font-size:26px}
							.GraybgCoupon2 p{font-size:18px}
							.navbar-inverse.sticky {top:0;}
							.navbar-inverse.sticky .navbar-brand{ font-size:16pt}
					
}
					
@media (max-width: 994px) {#otherservices { font-size:17pt}
							#phoneTop{ font-size:12pt; line-height:240%} 
							#CreditCard { width:47%}
							#seoPadding{ font-size:12px}
							a, a:hover { font-size:16px}
							.contentbg h1 { font-size:20pt}
							.navbar-inverse.sticky {height: 40px; }
							.navbar-inverse.sticky .navbar-nav > li > a{font-size:0.65em; padding:10px;}
							.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:17pt;}							
							#banner{margin:0px auto 0; background:#000;}	
							.BGWhiteMain { font-size:20px}
							.BGYellowMainServices { font-size:26pt}
							.BGWhiteMain2 { font-size:26px}
							.GraybgCoupon2 p{font-size:18px}
							.CouponYellowServices { font-size:40pt}
							.CouponYellowServices2 { font-size:40pt}
							.navbar-inverse .navbar-nav > li > a{padding:15px 5px; text-transform:lowercase}
							.navbar-inverse.sticky {top:0;}

}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {	#footerbg a, #footerbg a:hover, #footerbg, a, a:hover{font-size:16pt}
							.contentbg{ width:100%; clear:both}
							.asideServices {width:100%; text-align:center; line-height:inherit; clear:both}
							#SeoPhoneBG { display:none}
							.bgphone2 {background: #333; padding:5px; text-transform:uppercase; font-weight:bolder;
									   text-align:center; font-size:15px; text-shadow:1px 1px 1px #000; color:#ccc;}
							.bgphone2 img{width:224px; margin:0 auto}
							.bgphone2 p{ font-size:20pt;}			
							.contentbg h1 { font-size:20pt}
							#footerServicesHome h2{ clear:both}
							.boxServices{ min-height:inherit; text-align:center} .boxServices a, .boxServices a:hover{ font-size:22pt}
							#footerServicesHome img{ display:none}
							.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;}							
							#banner{margin:0px auto 0; background:#000;}	
							.BGWhiteMain { font-size:30px}
							.BGYellowMainServices { font-size:56pt}
							.BGWhiteMain2 { font-size:46px}
							.GraybgCoupon2 p{font-size:38px}
							.CouponYellowServices { font-size:50pt}
							.CouponYellowServices2 { font-size:50pt}
							#otherservices { font-size:47pt}
							.navbar-inverse .navbar-toggle { border-color: #999;}
							.navbar-inverse .navbar-toggle:hover,
							.navbar-inverse .navbar-toggle:focus { background-color:#000;}
							.navbar-inverse.sticky {top:0;}
							
														

}

/* Portrait & landscape phone */
@media (max-width: 670px) {.banner-wallpaper { display:none}
							 .contentbg h1 { font-size:18pt}
							a, a:hover, #footerbg a, #footerbg a:hover, #footerbg{ font-size:16pt}
							.BGWhiteMain { font-size:20px}
							.BGYellowMainServices { font-size:46pt}
							.BGWhiteMain2 { font-size:36px}
							.GraybgCoupon2 p{font-size:28px}
							.CouponYellowServices { font-size:40pt}
							.CouponYellowServices2 { font-size:40pt}
							#otherservices { font-size:36pt}
							 .boxServices a, .boxServices a:hover{ font-size:18pt}	
							 .navbar-inverse.sticky {top:0;}			
}
@media (max-width: 520px) {	
							.bgphone2 p { font-size:18pt}
							.bgphone2 { font-size:12px}
							#schemacss h2 { font-size:26pt}  	
							.shadowImgBox { display:none}
							.BGWhiteMain { font-size:18px}
							.BGYellowMainServices { font-size:36pt}
							.BGWhiteMain2 { font-size:26px}
							.GraybgCoupon2 p{font-size:18px}
							.CouponYellowServices { font-size:30pt}
							.CouponYellowServices2 { font-size:30pt}
							#otherservices { font-size:26pt}
							 .boxServices a, .boxServices a:hover{ font-size:16pt}
							 .navbar-inverse.sticky .navbar-brand{top:0; font-size:12pt;}	
							 .navbar-inverse .navbar-brand{top:0; font-size:15pt;}
							 .navbar-inverse.sticky {top:0;}	
}

@media (max-width: 400px) {	.bgphone2 p { font-size:18pt}
							.bgphone2 { font-size:12px}									
							#schemacss h2 { font-size:20pt}
							.contentbg h1, .contentbg h2, .contentbg h3, .contentbg h4, .contentbg 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;}
}

@media (max-width: 360px) {	.bgphone2 p { font-size:16pt}
							.bgphone2 { font-size:12px}
							#quickTime { font-size:16pt; text-align:left}
							#quickTime1 { font-size:14pt; text-align:left}
							#couponServices { font-size:11pt; text-align:left;}
							#contactPhone { font-size:20pt; text-align:left}
							a, a:hover, #footerbg a, #footerbg a:hover, #footerbg{ font-size:14px}
							#schemacss a, #schemacss{ font-size:14px}
							.emailSM{ font-size:13px !important}
							#otherservices { font-size:16pt}
							.navbar-brand{ font-size:11pt;}	
							.navbar-inverse.sticky .navbar-brand { font-size:10pt;}	
							.BGYellowMainServices { font-size:25pt}							
							.navbar-inverse.sticky .navbar-brand{top:0; font-size:11pt; text-transform:lowercase}	
							 .navbar-inverse .navbar-brand{top:0; font-size:9pt;}	
							.navbar-inverse.sticky {top:0;}
}
@media (max-width: 240px) {	.bgphone2 p { font-size:14pt}							
							#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;}
}


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

#banner{margin:0px auto 0; background:#000;}
.navbar-nav{margin:10px 0 0;}
.navbar-inverse.sticky {top:0;
            position: fixed;
            font-size: 24px;
            line-height: 48px;
            height: 70px; 
            width: 100%;          
		background: #a90329; /* Old browsers */
		background: -moz-linear-gradient(top,  #a90329 0%, #8f0222 44%, #6d0019 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  #a90329 0%,#8f0222 44%,#6d0019 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  #a90329 0%,#8f0222 44%,#6d0019 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=0 ); /* IE6-9 */
            text-align: left;
            padding-left: 20px;
			opacity:0.9; }

.navbar-inverse.sticky .navbar-nav > li > a{font-size:0.65em;}
.navbar-inverse.sticky .navbar-nav{margin:5px 0;}
.navbar-inverse.sticky .navbar-brand{
		text-indent:0;
		color: #FC0 !important; font-family:Arial, Helvetica, sans-serif; letter-spacing:-1px; 
	    width:auto; top:10px; 	 font-size:16pt; text-shadow:3px 3px 3px #000; text-transform: uppercase; font-style: normal}
}
@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} }
