/*
	Squid Grid System ~ Bradley Taunt
	Modified 960 Grid System
*/

/* `HTML & Body Elements
----------------------------------------------------------------------------------------------------*/
html { background: none; } 

body{ background: #d5d5d5; font-family: Arial, Helvetica, sans-serif; }

h1 { margin: 0; font-size: 18px; color: #000; }

p { font-size: 12px; padding: 0 0 10px 0; margin: 0; color: #000; }

a { text-decoration: none; color: #007dd9; }
a:hover { color: #7cb2d9; }

hr { padding: 0; margin: 10px 0 10px 0px; width:100%;max-width: 940px; display: none; }

select { width: 215px; margin: 0 0 10px 10px; }

input.btn { float: none;
    display: block;
    width: 100px;
    margin: 10px auto;
    }
    
p.top-info {
  margin-top: 50px;
  text-align: center;
  top: 18px;
  left: 0px;
  width: 100%;
  max-width: 600px;
  font-weight: 900;
}

/* `Container
----------------------------------------------------------------------------------------------------*/

#container-top{
	margin-left: auto;
	margin-right: auto;
	width:100%;
	max-width: 960px;
	height: 10px;
	background: #000;
}

#container{
	margin-left: auto;
	margin-right: auto;
	max-width: 960px;
	width: 100%;
	background:#fff;
	margin-bottom: 5px;
}

#footer{
	margin-left: auto;
	margin-right: auto;
	max-width: 960px;
	width: 100%;
	background:none;
	margin-bottom: 20px;
}
#footer p { text-align: right; }


/* `Content >> Global
----------------------------------------------------------------------------------------------------*/
hr,
.franchise-sidebar,
.featured-franchise,
.full-width2,
.full-width,
.sidebar,
.feature-slider,
.logo
{
	display: inline;
	float: left;
	position: relative;
	margin-left: 0px;
	margin-right: 0px;
}

/* `Grid >> Sections
----------------------------------------------------------------------------------------------------*/

.logo { width: 100%;max-width: 940px; }
	.logo img { float: left; padding: 7px 0 0 0; margin: 0; }
	.logo ul.nav { float: right; list-style: none; margin: 50px 0 0 0; display: none; }
	.logo ul.nav li { display: inline; padding: 0; margin: 0; }
	.logo ul.nav li a { border-right: 1px solid #d5d5d5; padding: 5px 15px; margin: 0; color: #000; font-weight: 800; }
	.logo ul.nav li a:hover { color: #656565; }

.feature-slider { width: 100%; max-width: 680px; display: none; }
	.feature-slider .search { position: absolute; z-index: 10; top:265px; left:20px; width: 220px; background: url(../images/fade.png) repeat-y; }
	.feature-slider .search p { padding: 10px 10px 7px 10px; color: #000; font-weight: 900; text-align: center; font-size: 18px; margin: 0; }

.sidebar, .sidebar2 { width: 100%; height: 402px; border-bottom: 1px solid #d5d5d5; }

.sidebar2 { float: none;text-align:center;}


	.sidebar .column { width: 100%; background: #d5d5d5; margin-bottom: 10px; }
	.sidebar .column h1 { box-sizing:border-box;padding: 10px 0 10px 10px; width: 100%; background: #000; font-size: 12px; color: #fff; margin-bottom: 10px; }
	.sidebar .column p { padding: 0 10px 10px 10px; }
	
.franchise-sidebar { width:100%; border-bottom: 1px solid #d5d5d5; }
	.franchise-sidebar .column { width:100%; background: #d5d5d5; margin-bottom: 10px; }
	.franchise-sidebar .column h1 { box-sizing:border-box;padding: 10px 0 10px 10px; width:100%;margin-top:10px; background: #000; font-size: 14px; color: #fff; margin-bottom: 10px; }
	.franchise-sidebar .column p { padding: 0 10px 10px 10px; }
	.franchise-sidebar .column-image { width:100%; background:none; margin-bottom: 10px; } 
	.franchise-sidebar .column-image h1 { padding: 10px 0 10px 10px; width: 228px; background: #000; font-size: 14px; color: #fff; margin-bottom: 10px; }
	.franchise-sidebar .column-image p { padding: 0 10px 10px 10px; }
	.franchise-sidebar .column-image img {   }
	
.full-width { width: 940px; }
	
.full-width2 { width: 940px; }
	.full-width2 h1 { padding: 10px 0 10px 10px; width: 930px; background: #000; font-size: 14px; color: #fff; margin-bottom: 10px; }

.featured-franchise { width: 100%;max-width: 680px; }
	.featured-franchise h1 { padding: 0px; width: 100%;max-width: 670px; background: #000; font-size: 14px; color: #fff; margin-bottom: 10px; }
	.featured-franchise h1 span { color: #d5d5d5; text-transform: uppercase; font-size: 13px; text-decoration: underline; }

/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clearfix:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

/*
	The following zoom:1 rule is specifically for IE6 + IE7.
	Move to separate stylesheet if invalid CSS is a problem.
*/

        #image{border:4px #666 solid;height:480px;width:640px;}
        .thumb{float:left;margin-right:10px;margin-top:10px;}




.logo h1 {
    margin-top:15px;
    font-size: 30px;
    position:relative;
 
}



#mainContactForm {
	display:block;
	background-position:top;
	background-repeat:repeat-x;
	min-height: 290px;
	background-color: #d5d5d5;
	float: right;
	width:100%;
	max-width: 645px;
	padding: 7px 0 0 10px;
	-webkit-box-shadow:  0px 3px 10px 0px rgba(50, 50, 50, 0.75);
	-moz-box-shadow:  0px 3px 10px 0px rgba(50, 50, 50, 0.75);
	box-shadow:  0px 3px 10px 0px rgba(50, 50, 50, 0.75);
	border:1px solid #fff;
}

optgroup { font-weight:bolder; color:black; }



/* Google Search */

.customSearch { float:left; width:300px; display:block; margin-top:0px; margin-left:-10px;  }
.customSearch div{
padding: 0;
}
#hamburger{
	display: block;
	position: absolute;
	right: 20px;
	top: 0px;
}
#mobile-nav{
	display: none;
	margin-top: 50px;
}
#mobile-nav ul{
	list-style: none;
	padding: 0;
	margin: 0;
	
}
#mobile-nav ul li {
	margin: 0;
}
#mobile-nav ul li a{
	text-align: center;
	display: block;
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 18px;
	background-color: rgb(221, 221, 221);
	border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}
hr{
	display: none !important;
}
p{
padding-left: 10px;
padding-right: 10px;
box-sizing: border-box;
}
@media (min-width: 960px){
	hr{
		display: inline !important;
	}
	#mobile-nav{
		display: none;
	}
	#hamburger{
		display: none;
	}
	.feature-slider{
		display: block;
	}
	p.top-info { position: absolute;left: 380px;margin-top:0px;}
	.featured-franchise h1{
	padding: 10px 0 10px 10px;
	}
	
	hr, .franchise-sidebar, .featured-franchise, .full-width2, .full-width, .sidebar, .feature-slider, .logo{
	  display: inline;
	  float: left;
	  position: relative;
	  margin-left: 10px;
	  margin-right: 10px;
	}
	.logo ul.nav{
		display: block;
	}
	.sidebar, .sidebar2 { width: 238px; height: 402px; border-bottom: 1px solid #d5d5d5; }
	.customSearch { float:left; width:300px; display:block; margin-top:45px; margin-left:-10px;  }
	.sidebar2 { float:right !important; }
	.sidebar .column { width: 238px; background: #d5d5d5; margin-bottom: 10px; }
	.sidebar .column h1 { box-sizing: border-box;padding: 10px 0 10px 10px; width: 228px; background: #000; font-size: 12px; color: #fff; margin-bottom: 10px; }
	.logo h1 {
    margin-top:15px;
    font-size: 30px;
    position:absolute;
	}
	.customSearch div{
	padding: 4px;
	}
	.franchise-sidebar { width: 238px; border-bottom: 1px solid #d5d5d5; }
	.franchise-sidebar .column { width: 238px; background: #d5d5d5; margin-bottom: 10px; }
	.franchise-sidebar .column h1 { box-sizing: border-box;padding: 10px 0 10px 10px; width: 228px;margin-top:0px; background: #000; font-size: 14px; color: #fff; margin-bottom: 10px; }
	.franchise-sidebar .column p { padding: 0 10px 10px 10px; }
	.franchise-sidebar .column-image { width: 238px; background:none; margin-bottom: 10px; }
	.franchise-sidebar .column-image h1 { padding: 10px 0 10px 10px; width: 228px; background: #000; font-size: 14px; color: #fff; margin-bottom: 10px; }
	.franchise-sidebar .column-image p { padding: 0 10px 10px 10px; }
	.franchise-sidebar .column-image img {   }
}