/*
CSS FRAMEWORK MADE BY WILLIAM ÅSTRÖM

CSS & HTML AUTHORING TO  : THE 29 DOLLAR WEBSITE
DATE : 2011-0916

Contact me by email: william@williamastrom.se
or visit my website: www.williamastrom.se;

*/

/*************************************************
	CSS RESET
**************************************************/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}

/*************************************************
	FONT FACES
**************************************************/


/*************************************************
	SETUP
**************************************************/
body { font:16px/1.5 arial,serif; background:#fff; }

/*************************************************
	WEBSITE FRAME SETUP
**************************************************/
.col140 { width:140px;}
.col220 { width:220px;}
.col300 { width:300px;}
.col310 { width:300px;}
.col380 { width:380px;}
.col460 { width:460px;}
.col540 { width:540px;}
.col620 { width:620px;}
.col700 { width:700px;}
.col780 { width:780px;}
.col860 { width:860px;}
.col940 { width:940px;}

.col140,.col220,.col300,.col310,.col380,.col460,.col540,.col620,.col700,.col780,.col860,.col940
{float:left; margin:0 10px; overflow:hidden;}

.section {margin: 20px 0; overflow:hidden;}
.inner { width: 960px; margin-left: auto; margin-right:auto;}
.row {overflow:hidden;}

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

/*************************************************
	TYPOGRAPHY
**************************************************/

h1,h2,h3,h4,h5,h6
{font-family:arial,serif; font-weight:700; line-height:1; }

h1 { font-size: 36px; }
h2 { font-size: 24px; margin: 30px 0 20px;}
h3 { font-size: 18px; margin: 30px 0 10px;}
h4 { font-size:	14px; margin: 30px 0 10px ;font-weight:700; }

p { margin: 10px 0; font: 16px/1.5 arial,sans-serif;}
p + p { margin:10px 0 0 0;}  

a {
	color:#A6A6A6;
	text-decoration: none;
}
.col540 a {
	color:#A80000;
	text-decoration: none;
}
.col310 a {
	color:#A80000;
	text-decoration: none;
}
a:hover { color:#888; text-decoration: underline;}

dt {float:left; margin: 0 5px 0 0; font:700 12px/20px arial,sans-serif ;}
dd{text-align:right; float:right; margin: 0 0 0 5px; font:400 14px/20px arial,sans-serif }

/* -- COLORING -- */
p,label,dd
{ color:#666; } /* Main Text Color */

h1,h2,h3,h4,dt
{color:#0e0e0e;} /* Main Headline Text Color */



/*************************************************
	WEBSITE CONTENT 
**************************************************/
#top { height: 10px; background:#0e0e0e;}
#header { height:50px; margin:0 auto; }
#intro {
	background:#fff url(../images/background-header.gif) repeat-x left bottom;
	height:350px;
	border-top:1px solid #eee;
	border-bottom: 1px solid #e5e5e5;
}
#contentpage #intro { height:100px; border-top:1px solid #f9f9f9; border-bottom: 1px solid #f1f1f1;background:#fff url(../images/background-contentheader.gif) repeat-x left bottom;}
#slider {margin:30px 0;}
.slider-wrapper {
	overflow:auto;
	height: 350px;
}
#slider-aside {margin:30px 0;}
#content {}
#main {padding-bottom:80px;}
#aside { float:right;}
#footer {background:#0e0e0e; padding:10px 0;}
#footer ul,#footer p {font-size:13px;}
#footer .omega {float:right;}
#footer h3 {color:#fff; margin:0px 0px 10px;}

span {color:#a62f2f;}
.branding { line-height:50px ; margin-top:8px;} /* The Logo */
h1.branding,div.branding { font-size:30px; font-weight:700; letter-spacing:-1px; font-family:'arial black',arial,serif;}


#contentpage #intro h1 {line-height:100px; width:960px margin:0 10px; text-align:right;}
.button-action {background-color:#a62f2f; color:#fff; text-align:center; width:200px; margin:0 auto; padding:5px 0px; display:block;}
.rounded3 {-webkit-border-radius: 3px;-moz-border-radius: 3px; border-radius: 3px;}

#main img {float:left; padding:0px 18px 18px 0;}

/*************************************************
	Navbar
**************************************************/
ul#navbar 				{ font-size:14px;}
ul#navbar 				{ float:right; height:50px;}
ul#navbar li 			{ display:inline-block; float:left;}
ul#navbar li a 			{ display:block; float:left; margin:0 7px;padding:20px 0px 10px;}
ul#navbar li.active 	{ background:#0e0e0e; padding:0 5px; }
ul#navbar li.active a 	{ color:#fff;}


/*************************************************
	Front Page
**************************************************/
#frontpage p {}
#frontpage h2:first-child,#frontpage h3:first-child,#contentpage h2:first-child,#contentpage h3:first-child {margin-top:0;}

/* DOWNLOAD FORM */
form#download {margin:40px 0 0 0;}
form#download h3 {margin:0px; font-size:32px; text-align:center;}
form#download h4 {margin:5px 0 20px 0; font-size:20px; text-align:center; color:#4b4b4b;}
form#download .row {overflow:hidden; margin:3px 0;}
form#download label { font-size:13px;line-height:40px;width:50px; float:left; display:block;}
form#download input {width:228px; float:left; display:block; border:1px solid #bbb; background:#bbb;padding:10px 10px;}
form#download input:focus {outline:0px; background:#ccc;}
form#download input#button-subdl { color:#fff; width:150px; float:right; background: #a62f2f; border:0px;}

/*************************************************
	Content Page
**************************************************/

#contentpage h1 {font-size:48px;letter-spacing:-1px;}

/* FORM */
form#contactform {}
form#contactform .row {overflow:hidden; margin:3px 0;}
form#contactform label { font-size:13px;line-height:40px;width:150px; float:left; display:block;}
form#contactform input,form#contactform textarea {width:365px; float:right; display:block; border:1px solid #bbb; background:#bbb;padding:10px 10px;}
form#contactform textarea {height:200px;}
form#contactform input:focus,form#contactform textarea:focus {outline:0px; background:#ccc;}
form#contactform input#button-subdl { color:#fff; width:150px; float:right; background: #a62f2f; border:0px;}

/*************************************************
	COMPARE Page
**************************************************/
ul.site-features{font-size:16px; list-style:square; margin:20px 0 20px 2em;}

/*************************************************
	Features Page
**************************************************/
#features-content {}
#features-content .feature-container {}
#features-content .feature {float:left; height:130px; margin: 10px 10px 0 0; width:260px;}
#features-content .custom {height:165px;}
#features-content .feature .details {float:left; margin:0 !important; width:195px;}
#features-content .feature h4 {font-size:18px; line-height:1em;  margin:2px 0 0 0 !important;}
#features-content .feature p {font-size:13px; margin:10px 0 5px 0;}
#features-content .feature ul {list-style:square; padding-left:25px; margin:0;}
#features-content .feature ul li {font-size:11px; padding:2px; margin:0;}


#features-content .feature .graphic {
	background:url('/images/features-icons.jpg') no-repeat;
	float:left; 
	height:40px; 
	margin:0 10px 0 0; 
	width:40px; 
}

#features-content strong {color: #444; font-weight:bold;}

#features-content .feature .domain { background-position: 0 0; }
#features-content .feature .leads { background-position: -40px 0; }
#features-content .feature .newsletters { background-position: -80px 0; }
#features-content .feature .pages { background-position: -120px 0; }
#features-content .feature .maps { background-position: -160px 0; }
#features-content .feature .doctor { background-position: -200px 0; }
#features-content .feature .videos { background-position: -240px 0; }
#features-content .feature .articles { background-position: -280px 0; }
#features-content .feature .tech { background-position: -320px 0; }
#features-content .feature .slideshow { background-position: -360px 0; }
#features-content .feature .places { background-position: -400px 0;}

/*************************************************
	chriopractic-newsletters Page
**************************************************/

#newsletter-form {
	background-color: #cccccc;
	height: 120px;
	margin:0 40px 0 40px;
	padding: 15px;
	position:relative;
}
#newsletter-form span.label { color:#444; display:inline-block; font-size:16px; width:160px; }
#newsletter-form input { display:inline-block; padding:5px; width:240px; }
#newsletter-form .inputs { padding:5px; position:relative;}
#newsletter-form input.submit { cursor:pointer; float:right; margin-right:6px; position:relative; top:5px; width:80px;}
#newsletter-form .required { color:red; position:absolute; left:-3px;}