@charset "UTF-8";

/* --------- Website Global Settings ------------------- */

* {margin: 0; padding: 0; }    /* general reset */

html {
	overflow-y:scroll; }    /* prevents sideway jump for short pages */
	
body {font-family:Verdana, Geneva, sans-serif; 
		}

.clearfloat {clear:both;}

/* -------------------- Fonts  ------------------- */

p {
  font-size: 1rem;
}

h1 {font-size:1.8rem;
	color:#006BB3;}
	
.internal h1 {
  text-align: center;
  margin-bottom:1.3rem ;
  background-color: black;
  padding:.6rem .3rem;
  color: #009BDF;
  border-top:1px white solid;
}

.internal-m h1 {
  text-align: center;
  padding:.6rem .3rem;
  color: #1E94E6;
  font-size:1.6rem;
}

h2 {font-size:1.3rem;
	color:#E20D0D;}

h3 {font-size:1.3rem;
	line-height:23px;
	padding:8px 0;
  font-weight: bold;
}

.internal h3 {
  font-size:1.1rem;
	padding:8px 0;
  color: #009BDF;
  font-weight: normal;
}
	

h4 {font-size:85%;
	padding:8px 0;
	}
	
a {color:#006BB3;}
a:hover {color:#E20D0D;}

label {
color:#555;
}

.internal ul li {
  margin-bottom:.6rem;
}

/* ------------------ NEW Home Page Template ---------------- */

.head-bg {
  background-color: black;
}


/* ------------------ Home Page Template --------------------------------------- */
			
#head-wrap { width:100%;
          height:110px;
        background-color: black;
           }
				
#head { width:931px;
          height:135px;
		  margin:0 auto;
		  xbackground: url(../images/design/header.jpg) no-repeat;	
          }
		  
#logo {
	width:400px;
	height:100px;
	background:url(../images/design/GBC_Logo_5.png) no-repeat;
	float:left;
	margin:5px 0 0 30px;
}

#logo h2 {
	color:#2a6fbb;
	font-size:1.3em;
	margin:90px 0 0 70px;
}
		  
	#phone {	margin:20px 30px 0 0;
				width:250px;
				height:75px;
				text-align:right;
				float:right;
        color:white;
				}
					
		#phone h2 { 
				font-size:20px;
		    }
		  
#wrap-pages {	width:100%;	
       	background: url(../images/design/centre-bg.png) repeat-x ;
        }
        
.wrap-pages {	
       	background-color: black;
       		width:100%;
        }

.wrap-pages ul.menu { 
  background-color: white;
}


		/* --- HOME PAGE Template - Base Section -- */
		
		#base {width:960px; height:370px; margin:12px auto; background: white url(../images/design/side-shadow-left.png) no-repeat left top; }
		
			#base p {font-size:.8rem;}
			#base h3 {padding:7px 0 0; color:#0093DD;}
			#base ul {margin-left:25px;}
			#base li {	font-size:13px;
						color:#666;
						padding:2px 0;
						line-height:18px;}
			
			.middle p {font-size:.9rem;}
			.middle h3 {padding:7px 0 0; color:#0093DD;}
			.middle ul {margin-left:25px;}
			.middle li {	
			      font-size:.9rem;
						color:#444;
						padding:2px 0;
			}
			   
		.right-shadow {height:390px; width:14px; float:right; background: white url(../images/design/side-shadow-right.png) no-repeat top;}
		
		.cat_textbox_short, .cat_listbox_short {width:250px; background-color:#f7f3f3; border:1px solid #cecbcc; padding:5px 3px; color:#898787;}
		.cat_listbox_short {font-family:Verdana, Geneva, sans-serif; font-size:10px;}

		/* --- BOXES --- */
		
		.parts {float:left; width:275px; margin:20px 0 15px 20px; padding:0 10px; background:url(../images/icons/Brake-disk.jpg) no-repeat left top;}
		.special {float:left; width:285px; margin:20px 0 15px 10px; padding:0 10px; background:url(../images/icons/Car-repairs.jpg) no-repeat left top;}
		.hours {float:left; width:275px; margin:20px 0 15px 10px;; padding:0 10px; background:url(../images/icons/Car-service.jpg) no-repeat left top;}
		
		.icon {float:left; margin-right:10px; width:46px; overflow:hidden; padding:7px 0;}
		.icon-last {float:left; margin-right:10px; width:46px; overflow:hidden; padding-top:5px;}
		
		.box-head {
			margin:10px 0 35px 75px;
		}
		
			/* --- BOXES NEW --- */
		
		.parts-n {
		    margin-top:1rem;
		    background:url(../images/icons/Brake-disk.jpg) no-repeat left top;
		}
		.special-n {
		    margin-top:1rem;
		    background:url(../images/icons/Car-repairs.jpg) no-repeat left top;
		}
		.hours-n {
		    margin-top:1rem;
		    background:url(../images/icons/Car-service.jpg) no-repeat left top;
		}
	
		
		/* ------------ Opening Hours Table- -------------------- */
		
		table.opening-hours td {
			  border-bottom: 1px solid #CCCCCC;
			  color: #999999;
			  font-size: 12px;
			  padding: 2px;
		  }
		  
		  	table.opening-hours-n td {
			 font-size: .8rem;
		  }
		
		.g-plusone {padding-top:5px;
		}
		

/*----- Template - Inside Pages - variables only  --- */

body#inside { background: url(../images/design/body-inside-bg.png) repeat-x;}
#wrap-pages-inside {	width:100%;		
       			background: url(../images/design/centre-inside-bg.png) repeat-x ;}

#wrap-nav-inside {	width:100%;	
				height:40px;			
       			background:#000 ;}
				
.center-inside {
   float:left;
    margin-top:10px;
    width: 940px;
}

#base-inside {
	width:960px; 
	margin:57px auto 10px; 
	background: white url(../images/design/side-shadow-left.png) no-repeat left top; 
}
		
.content-inside {
   position:relative;
   padding: 0 40px 10px 40px;
}

/* ---- Internal Pages Green Links -- */
a.action-link {color:green;}
a.action-link:hover {color:red;}
	
#footer {
  width:896px; 
  margin:0 auto; 
  font-size:11px; 
  text-align:center; 
  color:#999; 
  height:30px; 
  padding-bottom:5px;}

#footer a {font-size:11px; color:#999;}
#footer a:hover {color: #0093DD;}

.footer {
  font-size:.8rem; 
  color:#fff; 
  padding:.7rem 0;
  width:100%;
  background-color: black;
}

.footer-m {
  font-size:.8rem; 
  color:#777; 
  padding:.7rem 0;
  width:100%;
}
.footer a {
  color:#009BDF;
}
.footer a:hover {
  color:#fff;
}
			

/* ------ Navigation CSS  --------------------- */

#nav { width:740px;
		  margin:0 auto;
		  }

#nav li {
	border-left:1px solid #D0CCCD; 
}

#nav li.last {border-right:1px solid #D0CCCD;}

#nav li a {
			color:black;
			font-size:.8rem; 
			}
			
	#nav li a:hover {color:#0080FF; background-color:#ddd;}
	
	#nav li.selected a { color:#0080FF;
						}	

#nav li ul {width: 165px; visibility:hidden; position: absolute;}
#nav li ul li a:hover {background:#ccc;}
#nav ul li:hover > ul { visibility: visible; }

/* ---------- Hamburger Menu Color Change CSS -------------- */

button.menu-icon.dark::after {
    /* the block itself, the first line */
    background: #fff;
    /* middle and bottom */
    box-shadow: 0 7px 0 #fff, 0 14px 0 #fff;
    /* respect WebKit */
    -webkit-box-shadow: 0 7px 0 #fff, 0 14px 0 #fff;
}
	
/* -------------------------- Home Page General CSS ------------------------------ */
.hp-box {
  background-color: #fff;
  text-align: center;
  	margin-bottom:1rem;
  	padding-bottom:.5rem;
}

.image-rt {
	margin:14px 10px 20px 0;
	float: right;
}

.image-rt-n {
	xmargin-bottom:1rem;
}

.description {
	width:350px;
	float:left;
	height:250px;
	margin:30px 0 0 10px;
}

.description h1 {font-size:25px; color:#66d0f9; padding:0px 0 7px;}
.description p {font-size:15px; color:white; line-height:20px;}
.description ul {margin-left:25px;}
.description li {font-size:16px; color:white; padding:6px 0;}
.description a {color:#20b1eb; font-size:14px;}
.description a:hover {color:#d81251;}

/* --------------------------New Home Page General CSS ------------------------------ */

.description-n {
	margin-top: 1rem;
}

.description-n h1 {font-size:25px; color:#66d0f9;}
.description-n p {color:#999; }
.description-n ul {padding-left:15px;}
.description-n li {color:#999; padding-bottom: .5rem;}
.description-n a {color:#20b1eb; font-size:14px;}
.description-n a:hover {color:#d81251;}

/* ------------ General Internal Pages CSS ------------------------------- */

#inside-left {
        width:620px;
				float:left; }
				
	#inside-left h3 {padding:10px 0 0px 0;}
	
	#inside-left ul {margin-left:30px;}
	
	#inside-left li {padding:4px 0; font-size:13px; color:#666;}
				
#inside-right {width:230px;
				float:right;
				padding:5px 5px 5px 10px;
				background-color:#F4F9FC;
				border:1px #E3E3E3 solid;}
	
	 #inside-right h3 {padding:5px 0;}
	 
#left-col {width:500px;
			padding:10px 0px;
			float:left;}
			
			.content-inside ul {
			  margin:0px 0 15px 40px;
			}
			.content-inside li {
			  padding:5px 0;
			}

			
#col-images {
      width:320px;
			padding:10px 0px;
			float:right;
		 }

#service-col-images {
      width:350px;
			height:850px;
			padding:10px 0px;
			float:right;
			background:url(../images/design/car-logos.jpg) no-repeat; }
			
ul.servicing {	
			float:left;
			display:block;
}

/* -------------------- Location & Hours Page --------------------- */

#form-contact {width:280px; float:left; margin-left:10px; }
	
	#form-contact h3 {padding:5px 0}

#map {width:560px; float:left; margin:10px 15px;}

table.opening-hours td {font-size:12px; color:#999; padding:2px; border-bottom:1px #CCC solid;}


.req {font-size: 11px; color:red;}


/* -----------------------Forms System Page ----------------------------*/

td#title {font-size:18px; font-weight:lighter; padding-bottom:15px;}

.webform-results td  {font-size:14px; padding-bottom:10px;}


/* -------------------- Booking Form CSS ------------------- */

#booking {width:100%;
			}
			
			#booking h3 { display:block;							
							font-size:1rem;
							font-weight:500;	
							background:#006BB3;
							color:white;
							padding:10px 0px 10px 20px;
							margin-bottom:10px;
							}
			
.booking-left {width:390px;	
				height:330px;		
			margin:20px 20px 0 0px;
			float:left;
			border:none;
			padding-bottom:20px;
			background:#EDEEEF;
			overflow:hidden;
			}		

.booking-right {
      width:390px;
			height:330px;
			padding-bottom:20px;
			float:left;
			border:none;
			margin-top:20px;
			background:#EDEEEF;
			}
			
#booking .button-book {	width:200px;
			border:none;
			margin:20px auto;
			}
		
#booking input[type="email"] {
    width:90%;
    margin-left:1rem;
}

#booking input[type="text"] {
    width: 90%;
    margin-left:1rem;
    }

#booking textarea {
    width: 90%;
    margin-left:1rem;
}

.yes-no {
    width:90%;
    margin-left: 1rem;
}

.btn {
  margin-left: 1rem;
}

[type=checkbox]+label, [type=radio]+label {
  margin-left:0;
}


/* -------------------- Contact Form CSS ------------------- */

.contact-left 	{width:370px;			
				margin-top:20px;
				float:left;
						}		

.contact-right {width:480px;
			
			padding:10px 0 20px 10px;
			float:right;
			margin-top:20px;
			background:#EDEEEF;
			}