/*----------------------------------------------
------------------------------------------------
		Author:		JJ Nold & Lindsay Schneider
		Version:	4.5.2010
		Site: 		http://www.cchwebsites.com
		Copyright:  CCH Site Builder 2010
		
		Content:	Layout
		
		1			General Definitions
		2			Backgrounds and Containers
		3			Header
		4			Home
		5			About
		6			Templates
		7			Features
		8			Content
		9			Services
		10			Contact
		11			Footer
------------------------------------------------
------------------------------------------------*/

/* ----- 1 - General Definitions ----- */
.left { float:left; }
.right { float:right; }
.clear {clear:both; }
div#content { padding:30px 30px 10px 30px; }
div#content li { background:url(../img/bullet.gif) no-repeat 3px 5px; padding-left:20px; line-height:120%; font-size: .9em; }
.zero-bottom { margin-bottom:0; }
.block { display:inline-block; padding: 20px !important; width: 240px; background-color: #F5F5F5 !important; border: 1px solid #DCE1E5; margin-top: 15px; margin-right: 10px; text-align: center; }
.block:hover { background-color: #DCE1E5 !important; }
.stack { display: inline-block; }

/* ----- 2 - Backgrounds and Containers ----- */
body { background:url(../img/body-bg.png) repeat #2975bb; }
div#navbar-background { background:url(../img/nav-body-bg.png) repeat-x 0 141px; }
div#page-container { width:960px; margin:0 auto; position:relative; background:url(../img/content-bg.png) repeat-x left bottom #fff; }
div#header-container { height:141px; background:url(../img/header-wave.png) no-repeat; }
div#top-nav { height:40px; background:url(../img/nav.png) no-repeat; }
div#rounded-bottom { width:960px; height:16px; margin:0 auto; background:url(../img/rounded-bottom.gif) no-repeat; }
div#separator { width:863px; height:68px; margin:0 auto; background:url(../img/separator.png) no-repeat; }
div#login-container { margin:5px 20px 0 0; }

/* ----- 3 - Header Elements ----- */
div#header-container span#phone-number { width:350px; height:20px; display:block; position:absolute; top:10px; left:435px; text-align:left; }
a#login { display:block; width:100px; height:25px; background:url(../images/login.gif) no-repeat; text-indent:-1000em; position:absolute; right:360px; top:5px; }
a#test-drive { width:329px; height:40px; overflow:hidden; display:block; float:right; text-indent:-1000em; background:url(../images/test-drive.png) no-repeat 0 0; }
a#wk-logo { width:257px; height:57px; float:left; padding:5px 0 0 15px; }
a#sb-logo { width:139px; height:139px; position:absolute; top:70px; left:835px; }
#translate {background-color: #E8E8E8; border: 1px solid #DCDCDC; color: #FFFFFF; display: inline-block; font-family: arial; font-size: 12px; font-weight: bold; padding: 5px 13px; position: absolute; left: 0; text-decoration: none; top: 110px;}

/* ----- 4 - Home ----- */
div#content.index div#boxes-container div.boxes { width:280px; float:left; position:relative; margin:0 10px; }
div#content.index div#boxes-container div.boxes div { height:218px; background: url(../img/box.png) no-repeat 0 0;}
div#content.index div#boxes-container img { position:absolute; }
div#content.index div#boxes-container img#design-icon { left:78px; top:48px; }
div#content.index div#boxes-container img#template-icon { left:38px; top:55px; }
div#content.index div#boxes-container img#drive-icon { left:90px; top:48px; }
div#content.index div#boxes-container a { display:block; width:85px; height:42px; background:url(../img/more.gif) no-repeat; position:absolute; bottom:15px; right:23px; text-indent:-1000em; }
div#content.index div#boxes-container a#sbWebinarLink { display:block; width:900px; height:300px; background:transparent; position:relative; bottom:35px; right:0; text-indent:0;}
#sbWebinarImage { margin-left: -5px; }
div#content.index div#home-text { width:450px; float:left; margin:50px 0;}
div#content.index div#home-text ul { padding:0 0 0 15px; }
div#content.index div#brainshark { margin:50px 0 0 0; }
div#content.index div#sidebar.right img { padding:0 0 0 5px; vertical-align:middle; }
div#content.index div#sidebar div { float:left; width:300px; margin-top:-30px; text-align:center; }
div#content.index div#sidebar div.right { float:right; }

/* ------ 5 - About ----- */
div#content.about p { text-align:justify; }
div#content.about img { margin-left:20px; }
div#content.about div.left { width:69%; }
div#content.about div.right { width:30%; }

/* ------ 6 - Templates ----- */
div#content.styles div.lefty { float:left; width:69%; }
div#content.styles div.righty { float:right; width:30%; }

/* ------ 7 - Features -----
See css/features.css */

/* ------ 9 - Services ----- */
div#content.services-page img.right { margin-left:20px; }
.mediaBlock { margin:30px 0; }
.mediaBlock img { padding-right:10px; }
.mediaBlock h3 { margin-bottom:.4em; }
.mediaBlock p { margin:0; }
div#content .mediaBlock .margin { margin: 0 70px 10px; }
div#content.services-page p { text-align:justify; }
.services-page .mediaBlock li { margin-bottom: 10px; }


/* ------ 8 - Content ----- */
div#content.content-page p { text-align:justify; }
div#content ul.bullet-clear { margin:0 0 1.5em 0; }
div#content ul.bullet-clear li h3 { margin:0; }
div#content ul.bullet-clear li { background-image:none; padding:0; list-style:none; }
div#content ul li.bullet { margin-left:170px !important; background:url(../img/bullet.gif) no-repeat 3px 5px; padding-left: 20px;}
#mobile_icon {position:relative; bottom:2em; text-align:center;}
#mobile_icon img {vertical-align: middle;}

/* ------ 11 - Footer ----- */
div#footer { width:960px; margin:0 auto; position:relative; }