
/* --------------------------------------
   Layout
   -------------------------------------- */
 
body { 	background: #666;
			-webkit-font-smoothing: antialiased;
			text-rendering: optimizelegibility;	 color:#000;
			font-family: 'arial', sans-serif;}h1,h2,h3,h4,h5,h6,{font-family: 'arial', serif;
}

 .shadowboxAround { background:#fff; box-shadow:0 0 8px #333; margin-bottom:10px; margin-top:10px; border:1px #000}
 #topheader { background:#153b60}
  #topheader2 {background:url('http://gardencitylocksmiths.us/images/pooler-locksmith-101a.jpg.html'); background-position:left top; background-repeat:repeat-x}
.white { color:#FFF}
a{color:#CCC}
a:hover {color:#FFF}.yellow2 {color: #FC0; text-shadow:1px 2px 3px #000; text-transform:uppercase; font-size:2em; text-align:center; font-family:impact, "Arial Black";}
   .white2 { font-size:14px}
	  a[href^=tel] { color: inherit; text-decoration: none; }
.header { margin:0;  margin-bottom:11px;}
.nomargin {padding:0; margin:0;}

.red { color:#990000;}	
.gray { color:#666; letter-spacing:1px; font-weight:normal; text-shadow:none}
.gray2 {color:#666 !important; font-weight:bold}
.gray3 {color:#333 !important; font-weight:bold}
.blue {color:#8FA0C1}
.headerfont{color:#FFCC00; margin-bottom:0px; font-size:36px; 
            line-height:130%; text-shadow:1px 3px 1px #000; font-weight:bold;}
.headerspacing {padding:0px 10px; text-align:left}
.header p { color:#666; font-size:12px; text-align:center; margin:0; padding:0; text-transform:uppercase}
.contentbg {padding:10px 0px 0px 30px; margin-bottom:10px}.phone { text-align:center; color:#fff; font-size:2em}
.contentbg p { color:#000;  margin-right:10px;}
.contentbg h1 { color:#0A152B; font-size:3em; padding:0; margin:0; font-weight:bolder; text-shadow:1px 1px 1px #fff;}
.contentbg h2{ color:#cc0000; font-size:2em; margin-right:10px; text-shadow:1px 1px 1px #fff}
.contentbg h3{ font-size:1.5em; color:#333; text-shadow:1px 1px 1px #FFF;}
.well{ padding:20px;  margin:10px 15px 10px 5px; box-shadow:none;
         background:#333; border-bottom:4px solid #FFB429; border-top:0;
		 border-right:0;  border-left:0; border-radius:0px; text-shadow:1px 1px 1px #000;}
		 
.well p{ color:#FFF;}
.footertext { font-size:18px;}
.footertext a{font-size:18px;}
footer { padding-top:20px;
	color: #fff;
	font-size: 11px;   box-shadow:0px 0 5px #000; border-top:1px #666 solid;
	 margin-top:10px;  background:#132549;
}
.cities ul {
    margin-left: 20px;
}
.cities li {
    list-style: outside none none;
}
.cities a {
    color: #3cd9f8;
    font-size: 12px;
    line-height: 140%;
    text-decoration: none;
    text-transform: uppercase;
}
.cities a:hover {
    text-decoration: underline;
}


.footSer { padding-bottom:10px}
footer a{color:#CCC; font-size:14px}
footer a:hover {color:#FFF}
footer h4{ font-size:20px; padding-top:10px;}

.coupon { font-size:1.7em; color:#FF9}
.boxshadow { margin:10px 20px; float:right; box-shadow: 0 0 15px 0 #000; border-radius:20px;}

#schemacss {
    margin: 10px 0;
    color:#FFF; text-align:left;
}
.schema_add_map div {
    display: inline; 
}
#schemacss strong {color:#FCCE92}
#schemacss  h2{
font-size:30px;  margin:0px !important;  padding:0px !important; color:#FCCE92; text-shadow:1px 1px 2px #000;
}
.servicesfooter{ font-size:9px; background:#333; padding:5px 5px 20px 5px; text-shadow:1px 1px 1px #000;}
#schemacss a{color:#CCC; font-size:12px}
#schemacss a:hover {color:#FFF}

.marginTopLeft { margin:10px 0px; padding:0;}
.bgphone { background: #369; }
.PhoneTop { color:#1B3754; text-shadow:1px 1px 1px #3E7BB7; font-size:28px; letter-spacing:-1px; text-align:left; font-weight:bold; font-style:italic; text-transform:uppercase;}
.creditCC { text-align:right; float:right; margin-top:5px}
.serviceBg{background-image:url("http://gardencitylocksmiths.us/images/pooler-locksmith_35.jpg"); background-repeat:repeat-x; padding-bottom:5px}
.sideline {border-right:4px solid #0B162B; box-shadow:1px 0 0 0 #284B91; padding-right:10px }
.sideline2 {border-right:8px solid #f4f4f4; padding-left:20px}
.footerlinks {padding-top:10px}
.servicebox { border:10px solid #081528; -webkit-border-radius: 5px;
-moz-border-radius: 5px;  box-shadow:0 8px 2px #0F2544;
border-radius: 5px; margin-right:15px; margin-bottom:15px}
.servicebox2 {background: rgb(204,123,10); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(204,123,10,1) 0%, rgba(240,126,11,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(204,123,10,1)), color-stop(100%,rgba(240,126,11,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(204,123,10,1) 0%,rgba(240,126,11,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(204,123,10,1) 0%,rgba(240,126,11,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(204,123,10,1) 0%,rgba(240,126,11,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(204,123,10,1) 0%,rgba(240,126,11,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc7b0a', endColorstr='#f07e0b',GradientType=0 ); /* IE6-9 */

border:10px solid #ED9334; -webkit-border-radius: 5px;
-moz-border-radius: 5px; 
border-radius: 5px; margin-right:15px; margin-bottom:15px; padding:5px; text-align:center; text-transform:uppercase; font-weight:bold; letter-spacing:-1px; color:#93520B; text-shadow:1px 1px 1px #EDB015;  border:10px solid #0A152B; box-shadow:0 3px 2px #333; font-size:18px}

.servicebox3 {background: #000; border:10px solid #0A152B; -webkit-border-radius: 5px;
-moz-border-radius: 5px;  box-shadow:0 3px 2px #333;
border-radius: 5px; margin-right:15px; margin-bottom:15px; padding:5px; text-align:center; text-transform:uppercase; font-weight:bold; letter-spacing:-1px; color:#fff; text-shadow:1px 1px 1px #333; font-size:22px}

.servicebox5 {background: #132549; border:10px solid #0A152B; -webkit-border-radius: 5px;
-moz-border-radius: 5px;  box-shadow:0 3px 2px #333;
border-radius: 5px; margin-right:15px; margin-bottom:15px; padding:5px; text-align:center; font-weight:bold;  color:#fff; text-shadow:1px 1px 1px #333; font-size:12px}
.servicebox5 strong{ font-size:18px; color:#F90}

.servicebox4 {background: #FFFFFF; border:10px solid #0A152B; box-shadow:0 3px 2px #333; -webkit-border-radius: 5px;
-moz-border-radius: 5px;  font-size:22px; color:#000; text-shadow:1px 1px 1px #fff;
border-radius: 5px; margin-right:15px; margin-bottom:15px;  text-align:right; text-transform:uppercase; font-weight:bold; letter-spacing:-1px; }
.floatleft {float:left}
.phoneside { padding-right:5px;}
.phoneside1 { font-size:23px; padding-bottom:10px}
.couponYellow { font-size:45px; text-shadow:2px 4px 4px #000; color:#FC0}
.servicebox a{ width:100%; display:block; padding:7px 20px; margin-bottom:1px; color:#fff; text-shadow:1px 1px 1px #000; text-decoration:none;background: rgb(39,79,139); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(39,79,139,1) 0%, rgba(12,22,34,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(39,79,139,1)), color-stop(100%,rgba(12,22,34,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(39,79,139,1) 0%,rgba(12,22,34,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(39,79,139,1) 0%,rgba(12,22,34,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(39,79,139,1) 0%,rgba(12,22,34,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(39,79,139,1) 0%,rgba(12,22,34,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#274f8b', endColorstr='#0c1622',GradientType=0 ); /* IE6-9 */
 color:#ffd39e !important; text-shadow:1px 1px 1px #000;
 font-size:19px;}
 .servicebox a:hover{opacity:0.8; color:#fff;}
 a.active1{ background:#163A63}
.col-sm-4.services1 p{color:#ccc; text-shadow:1px 1px 1px #000}

/* --------------------------------------
   Typography
   -------------------------------------- */



/* --------------------------------------
   Navbar
   -------------------------------------- */
.navbar {font-size:127%; font-family: Arial, Helvetica, sans-serif; background:none; padding:0; margin-left:15px;  margin-right:15px; margin-bottom:0px; min-height:0px; padding-left: 0px; padding-right: 0px; -webkit-border-radius: 5px 5px 0px 0px;
-moz-border-radius: 5px 5px 0px 0px;
border-radius: 5px 5px 0px 0px; color:#999; background:#274A90; }

.navbar-nav > .active > a, .navbar-nav > .active > a:hover, .navbar-nav > .active > a:focus, .navbar-nav > li > a:hover, .navbar-nav > li > a:focus{background: #132549; color:#F9B45E !important; text-shadow:1px 1px 1px #000; text-align:center; } 

.navbar-nav > li > a { color:#FAF2D8; text-shadow:1px 1px 1px #000; margin:0px;  text-align:center; border-right:1px solid #1C3360; box-shadow:1px 0 0 0 #3966BF;}

.navbar-toggle {    background-color: rgba(0, 0, 0, 0);    border: 1px solid #bdbab9;    border-radius: 4px;    height: 32px;    padding: 5px 7px;    position: absolute;    right: 10px;    top: 19px;    width: 38px;}

.navbar-toggle:hover, .navbar-toggle:focus {
    background-color: #3A3A37;}

    .service1 { color:#fff}  
/* --------------------------------------
   Carousel
   -------------------------------------- */
  
	
.carousel-indicators {
    bottom: -7px;}
	
.carousel-indicators li {
    border: none; background:#000; box-shadow:0px 0px 5px #000;
    border-radius: 10px;
      height: 17px;
    width: 17px;}
	
.carousel-indicators .active {
    background-color:#535354; box-shadow:0px 0px 5px #000;
    height: 17px;  border: none;
    margin: 0;
    width: 17px;}





/* others */

@media (max-width: 1199px) { .navbar-nav > .active > a, .navbar-nav > .active > a:hover, .navbar-nav > .active > a:focus, .navbar-nav > li > a:hover, .navbar-nav > li > a:focus{padding:13px 40px}   .header p { font-size:9px}
.navbar-nav > li > a { padding:13px 40px; font-size:88%}
.PhoneTop { font-size:22px}.contentbg h1 {font-size:2.4em}
.headerfont{line-height:120%; font-size:190% }
.white { font-size:22px}
.logo{  padding-left:5px; padding-top:0; margin-top:-10px;}

.panel.panel-default { font-size:150%; }
 .panel.panel-default2{ font-size:150%; }
.footertext a,  .footertext {
    font-size: 15px;  text-transform:none}
.col-3 h2{ font-size:26px}
.servicebox a { font-size:15px}
.phoneside1{ font-size:17px;}
.gray3{ font-size:18px}
.floatleft{ width:41%}
.couponYellow{ font-size:36px}
	
.carousel-indicators {
    bottom: -10px;}
	
.carousel-indicators li {
 
      height: 15px;
    width: 15px;}
	
.carousel-indicators .active {

    height: 15px; 
    width: 15px;}


}	


@media (max-width: 994px) {.navbar-nav > .active > a, .navbar-nav > .active > a:hover, .navbar-nav > .active > a:focus, .navbar-nav > li > a:hover, .navbar-nav > li > a:focus{padding:6px 30px}   
.navbar-nav > li > a { padding:6px 30px; font-size:12px} .contentbg h1 {font-size:2em}
.header p { font-size:8px}
.PhoneTop { font-size:18px}.headerfont{line-height:100%;}
.footertext a,  .footertext {font-size: 16px; color:#fff; text-transform:none}
.footertext a:hover {color:#fff}
.panel, .panel.panel-default {line-height:50%}
 .panel.panel-default strong, .panel.panel-default2 strong, .panel strong {font-size:17px}
 .gray {letter-spacing:normal} 
.servicebox a { font-size:10px}
.phoneside1{ font-size:21px;}
.gray3{ font-size:20px}
.floatleft{ width:25%}
.servicebox3 {font-size:20px} .headerfont { line-height:190%; font-size:20px}
.couponYellow{ font-size:26px}
.col-3 h2{ font-size:20px}
.carousel-indicators {
    bottom: -11px;}
	
.carousel-indicators li {
 
      height: 13px;
    width: 13px;}
	
.carousel-indicators .active {

    height: 13px; 
    width: 13px;}
	.footerlinks {padding-top:5px}

}
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {	
	.servicebox a { font-size:18px}
.phoneside1{ font-size:37px;}
.gray3{ font-size:25px}
.floatleft{display:none}
.servicebox3 {font-size:20px}
.couponYellow{ font-size:33px} .servicebox4 { text-align:center; background-color:#CCC}
.col-3 h2{ font-size:30px}
.PhoneTop, .creditCC {display:none}  
 .service1, .banner {display:none}
 .navbar-toggle {top: 17px; } 
.headerfont { line-height:110%; font-size:26px; margin-top:0;}
 .col-9.contentbg { width:100%; margin:0; border:none; padding:5px 20px} 
aside { width:100% !important; margin:0; border:none} .footertext a,  .footertext { font-size:20px !important; text-align:center}
.navbar-toggle:hover {
background:#0E2347; }
.logo { width:400px; margin:0; padding:10px;}
.bgphone{ display:none !important}
.carousel {display:none}
#topheader {background:none}
.header { margin-bottom:0px; background:#000000; margin-top:0; border-bottom:5px solid #F07E0B; padding:5px}
#schemacss {text-align:center !important; font-size:12}
.sideline { border:none; box-shadow:none} 
.navbar { 
    background: none repeat scroll 0 0 #333; margin:10px 30px; 
    }
	.navbar-nav > li > a { font-size:20px; box-shadow:none; border-bottom:1px solid #666; margin:10px}
 .col-9.contentbg h2 { font-size:200%}
.services1 {border-bottom:1px solid #1B469B; padding-bottom:10px}
}
/* Portrait & landscape phone */
@media (max-width: 480px) {.headerfont { font-size:22px; background:none !important;} .fontsmallschema{ font-size:16px}}
@media (max-width: 488px) {.logo {width:300px;} .col-8.contentbg h2 { font-size:150%}
.headerfont { font-size:32px; background:none !important;}
.phone { font-size:18px}.panel, .panel.panel-default { font-size:30px; line-height:100% !important}
.contentbg h1{ font-size:22px !important}.navbar-toggle {top: 22px;  }.boxshadow{  display:none !important} .white { font-size:32px}
}
@media (max-width: 360px) {.headerfont { font-size:22px ; background:none !important;} .fontsmallschema{ font-size:14px} .logo { height:90px;  width:200px; margin-top:-10px} .phoneside1 { font-size:26px} .white{font-size:18px}
 .col-8.contentbg {padding:5px}  .col-9 h2{font-size:20px !important}
#schemacss a { font-size:17px !important}}

/* Large desktop */
@media (min-width: 1200px) {

.white { color:#fff; text-shadow:1px 1px 1px #000;}
	.headerfont{ font-size:250%; margin-top:10px;}
	
.navbar-nav > .active > a, .navbar-nav > .active > a:hover, .navbar-nav > .active > a:focus, .navbar-nav > li > a:hover, .navbar-nav > li > a:focus{padding:12px 70px;}   
.navbar-nav > li > a { padding:12px 70px;}

body { 
			color:#000; 
			-webkit-font-smoothing: antialiased;
			text-rendering: optimizelegibility;	
			font-family: 'arial', sans-serif;}h1,h2,h3,h4,h5,h6,{font-family: 'arial', serif;
			
} 
.footertext, .footertext a { font-size:15px; text-align:right; color:#faf2d8; text-transform:none }
.footertext a { font-variant:normal; font-weight:bold;}
.footertext a:hover {color:#fff;}
	
}