/*
Site: Lyn Lake Chiropractic
Author: Christian Ross (http://twitter.com/christianross)
Author URI: http://www.thinairweb.com
Jan 18, 2012 
*/


/* ---- Reset CSS ---- */

html, body, img {
	margin: 0; padding: 0; border: 0; outline: 0;
	font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit;
	vertical-align: baseline;
}
:focus { outline: 0; }

html { overflow-x: auto; overflow-y: auto; }

body { line-height: 1; }
p { margin:0; padding:0; }

blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
em { font-style: italic; }
strong { font-weight: bold; }
.clear:after { content: "."; display: block; height: 0;	font-size: 0; clear: both; visibility: hidden; }
.clear { display: inline-block; }
/* \*/
.clear { display: block; }
/* */ 


/*  BGCC - CSS  */
@import url(http://fonts.googleapis.com/css?family=Brawler);
@import url(http://fonts.googleapis.com/css?family=Lato:400,400italic,700,700italic);


p 				{ padding:0; margin:0 0 20px 0; font-family:'Lato', sans-serif; font-size:100%; color:#111; line-height:1.4em; }
.completesite 	{ font-family:'Lato', sans-serif; font-size:100%; color:#111; line-height:1.4em; }

h1, h2, h3, h4, h5, h1.completesite, h2.completesite { color:#000; font-weight:normal; font-family:'Brawler', serif; }
h1, h1.completesite { margin: 0 0 .1em 0; font-size: 2.2em; line-height:1.2em; }
h2, h2.completesite { margin: 0 0 .1em 0; font-size: 1.4em; line-height:1.2em; }
h3 { margin: 0; font-size: 18px; line-height:24px; font-weight: 700; }
h4 { margin: 0; font-size: .9em; line-height:22px; font-weight: 700; }

#featured h2, #feature h2.completesite { text-align: center; padding: 6px 0 8px; }
#featured p, #featured div.completesite { font-size: .9em; margin-top: 10px; }
#featured h4 { margin-top: 8px; }

/*  Layout  */
body {
	margin: 0px;
	background: url(../images/farmer.png) #E3E3E3;
	font-family: 'Lato', sans-serif;
	font-family:100%; line-height:1.4em;
	color:#111; text-align:left;
}

#wrap		{ width: 90%; margin: 30px auto; position: relative; max-width: 1080px;}
#main		{ margin: 0; padding: 10px 10px 30px; background-color: #7993BA; }
#container	{ box-shadow: 0px 0px 2px #444; }

#balloon 	{ position: absolute; width: 144px; height: 183px; z-index: 99; right: 0; margin: -35px 10px 0 0;}

#header		{ clear:both; background: url(../images/header-bg2.png) repeat-x; z-index: 9; position: relative; height: 130px;}
  #name		{ clear:both; padding: 20px 0 0 3%; width: 75%; height: 46px; }
    #name h2 { float: left; padding: .8% 1.3% 0 0; margin: 0 1.5% 0 0; border-right: 1px solid #DDD; }
    #title 	{ float: left; font-size: .7em; padding-top: 1.5%; }
  #nav		{ clear:both; margin: 14px 0 0 2%; position: relative; }

#banner		{ margin:0 auto; position: relative; margin-top: -50px;}
  #banner img { width:100%; max-width: 100%; overflow-x: hidden; }

#content	{ clear:both; background-color:#FFF; border-top: 4px solid #EEE; }
  #main-content	{ float: left; width: 60%; padding: 3%; }
  #aside		{ float: right; width: 27%; margin:3%; }
    #featured	{ background-color: #EEE; margin: 0; border-radius: 5px; padding: 5% 8%; }
      #featured img { width:100%; max-width: 100%; overflow-x: hidden; }
    #contact	{ width: 100%; height: 120px; margin: 8% 0; }
      #logo		{ float: right; width: 90px; }

#footer	{ clear: both; margin: 5px 0 0 0; width:100%; font-size:.8em; color: white; }
  #fcopy	{ float: left; text-align:left; width: 33%; }
  #fnav		{ float: right; width: 63%; text-align:right; }
#affiliations { clear: both; width:100%; margin:2% auto; text-align:center; font-size:.9em; }
#affiliations img { width:10%; max-width: 10%; overflow-x: hidden; }


/*  links  */
a { white-space:normal; }

a:link, a:visited, a:active, a:hover { color: #284888; font-weight: bold; text-decoration:none; } 
a:hover   { color: #7993BA; }

a.mainNav:link, a.mainNav:active, a.mainNav:visited, a.mainNav:hover {
	text-transform:uppercase;
	font-size:.9em;
	color:#FFF;
	font-family:'Lato', sans;
	font-weight:normal;
	padding:0 7px;
}
a.mainNav:hover { text-decoration:none; color:#ddd; }

a.footerNav:link, a.footerNav:active, a.footerNav:visited, a.footerNav:hover {
	text-decoration:none;
	font-size:.9em;
	font-weight:normal;
	color:#FFF;
	text-transform: uppercase;
	}
a.footerNav:hover { color:#284888; }


/* Lists */
ul { padding:0; margin:0; }
li { padding:0; margin:0 0 0 20px; border:0; }

#nav ul { margin:0; padding:0; list-style:none; }
#nav li { margin:0; padding:14px .1%; display:inline-block; }
#nav li:hover {background: url(../images/nav-hover.png) 50% 0 no-repeat;}

#contact ul { margin:0; padding:10px 0 0 0; list-style:none; float: left; }
#contact li { margin:0; padding:0; font-size: .8em; line-height: 1.2em; }
#contact li:first-child { font-weight: bold; }

#footer ul { margin:0; padding:0; list-style:none; }
#footer li { margin:0; padding:0 .5%; display:inline; }

#affiliations ul { margin:15px 0 0; padding:0; list-style:none; }
#affiliations li { margin:0; padding:0 .5%; display:inline; }


@media screen and (max-width: 800px) {

	a.mainNav:link, a.mainNav:active, a.mainNav:visited, a.mainNav:hover {
		font-size:.7em;
		padding:0 6px;
	}

	#name h2 { font-size: 1.0em; }
	#title { line-height: .9em; width: 25%; padding-top: 0; }
	
	#fcopy {  clear: both; float: none; display: block; width: 100%; text-align: center; }
	#fnav {  clear: both; float: none; display: block; width: 100%; text-align: left; text-align: center; padding-bottom: 5px; }
	
	#balloon { margin: 0 15px 0 0; width: 80px; height: 127px;}
	#balloon img { height: 127px; }
	
	#featured p { font-size: .8em; }
	#featured h2 { font-size: 1.1em; }

}

@media screen and (max-width: 520px) {

	#header		{ background: url(../images/header-bg3.png) repeat-x; height: 210px; }
	#banner		{ margin:0 auto; position: relative; margin-top: -130px;}
	#nav		{ clear:both; margin: 50px 0 0 0; position: relative; text-align: center; }

	a.mainNav:link, a.mainNav:active, a.mainNav:visited, a.mainNav:hover {
		font-size:.8em;
		padding:0 5px;
		line-height: .4em;
	}
	#name { padding-top: 15px; }
	#name h2 { border-right: 0; font-size: 1.3em; }

	#balloon { margin: 0 15px 0 0; width: 63px; height: 100px;}
	#balloon img { height: 100px; }
		
	#main-content { float: none; display: block; width: 93% }
	#aside { float: none; display: block; width: 93%; }
	#featured, #fnav, #contact { display: none; }
	
	#title { visibility: hidden; display: none; height: 0px; clear: both; float: none; }
	
	#nav ul { margin:0; padding:0; list-style:none; }
	#nav li { margin:0; padding:0; display:inline-block; line-height: .3em; }
	#nav li:hover { background: none; }
	
	
	div.completesite { font-size: .8em; }
	h1, h1.completesite { font-size: 1.2em; }
	h2, h2.completesite { font-size: 1.0em; }
	h3, h3.completesite { font-size: .9em; }
	
}

@media screen and (max-width: 400px) {

	#header		{ background: url(../images/header-bg3.png) repeat-x; height: 170px; }
	#banner		{ margin:0 auto; position: relative; margin-top: -90px;}
	#name		{ padding-top: 8px; }
	#name h2	{ font-size: 1.3em; }
	#nav		{ clear:both; margin: 24px 0 0 0; position: relative; text-align: center; }
	#footer { font-size: .7em; }
}

