/* ============================================================

	Project: Druva 
	Author: Cole Winans (@ColeWinans) of Uptrending, LLC.
	Contact: Cole@Uptrending
	Portfolio: Http://www.Uptrending.com
	
	screen.css
	-Site wide layout, style, and functions.

============================================================*/
/*------------------------------------------------------------
 	=Presets
------------------------------------------------------------ */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:none;}ins{background-color:#ff9;color:#000;text-decoration:none;}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:700;}del{text-decoration:line-through;}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help;}table{border-collapse:collapse;border-spacing:0;}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0;}input,select{vertical-align:middle;}body{font:13px/1.231 sans-serif;font-size:small;}select,input,textarea,button{font:99% sans-serif;}pre,code,kbd,samp{font-family:monospace, sans-serif;}html{overflow-y:scroll;}a:hover,a:active{outline:none;}ul,ol{margin-left:2em;}ol{list-style-type:decimal;}nav ul,nav li{list-style:none;list-style-image:none;margin:0;}small{font-size:85%;}td{vertical-align:top;}sub,sup{font-size:75%;line-height:0;position:relative;}sup{top:-.5em;}sub{bottom:-.25em;}pre{white-space:pre-wrap;word-wrap:break-word;padding:15px;}textarea{overflow:auto;}.ie6 legend,.ie7 legend{margin-left:-7px;}input[type=checkbox]{vertical-align:bottom;}.ie7 input[type=checkbox]{vertical-align:baseline;}label,input[type=button],input[type=submit],input[type=image],button{cursor:pointer;}button,input,select,textarea{margin:0;}input:invalid,textarea:invalid{border-radius:1px;-moz-box-shadow:0 0 5px red;-webkit-box-shadow:0 0 5px red;box-shadow:0 0 5px red;}.no-boxshadow input:invalid,.no-boxshadow textarea:invalid{background-color:#f0dddd;}a:link{-webkit-tap-highlight-color:#FF5E99;}button{width:auto;overflow:visible;}.ie7 img{-ms-interpolation-mode:bicubic;}body,select,input,textarea{color:#444;}a,a:active,a:visited{color:#607890;}a:hover{color:#036;}strong,th,h1,h2,h3,h4,h5,h6{font-weight:700;}input[type=radio],.ie6 input{vertical-align:text-bottom;}::-moz-selection,::selection{background:#FF5E99;color:#fff;text-shadow:none;}



/*------------------------------------------------------------
 	=Global Styles
------------------------------------------------------------ */
body { background: url('/images/bg-clouds-top.jpg') top right repeat-x; font-family: 'Helvetica',arial,sans-serif; }
	 body.page-id-2218 { background: url('/images/bg-clouds-top.jpg') top right repeat-x !important; font-family: 'Helvetica',arial,sans-serif; }
#container { width: 960px; margin: 0 auto; }

/*-----------------------------
	=Typography
------------------------------*/
h1, h2, h3, h4, h5, h6 { color: #3d3d3d; font-weight: normal; }
h1 { font-size: 31px; }
h2 { font-size: 25px; }
h3 { font-size: 22px; }
h4 { font-size: 18px; }
h5 { font-size: 16px; }
h6 { font-size: 14px; }
#main section h1 { padding-bottom: 10px; }
p { font-size: 18px; color: #666; line-height: 22px; font-weight: lighter;}
figcaption { font-size: 11px; color: #878787; line-height: 14px;}
aside span { font-size: 14px; color: #345670; }
label { font-size: 14px; color: #555; }



/*------------------------------------------------------------
 	=Layout
------------------------------------------------------------ */
/*-----------------------------
	=Header
------------------------------*/
header { margin-top: 10px; min-height: 100px; }
header strong { float: left; }
header strong a { background: url('../images/layout/header/druva-logo.png'); height: 78px; width: 228px; display: block; text-indent: -9999px; }
div.sep-bar { float: left; }
div.sep-bar { width: 960px; height: 2px; margin-top: 5px; }

/*-----------------------------
	=Content
------------------------------*/
#main { margin-top: 20px; width: 100%; min-height: 300px; overflow: hidden; }
#main section, aside { width: 50%; }
#main aside { float: right; }
#main aside .wrapper { width: 350px; float: right; }
#main section { float: left; }
#main section div.row { width: 350px; min-height: 50px; margin-top: 25px; }
#main section div.row figure { width: 50%; float: left; }
#main section div.row figure img { float: left; padding-right: 10px;}
#main section div.row figure figcaption { padding: 10px 0 0 0; width: 140px; font-size: 12px;}
aside form { margin-top: 15px; }
aside form input { background: url('../images/layout/content/input-bg.png') no-repeat; margin: 3px 0 10px 0; width: 325px; height: 22px; border: none; padding: 6px 10px 10px; font-weight: bold; }
aside form select { margin: 3px 0 15px; width: 325px; padding: 3px; font-weight: bold; }
#create-account button { background: url('../images/buttons/create-account-btn.jpg') no-repeat; width: 200px; height: 41px; text-indent: -999em; border: none; margin-top: 5px; }
#signup-now button { background: url('/images/buttons/signup-now-btn.jpg') no-repeat; width: 156px; height: 41px; text-indent: -999em; border: none; margin-top: 25px; margin-left: 148px;}

/*-----------------------------
	=Signup Form
------------------------------*/
#main aside .wrapper span strong {/*padding-left: 150px;*/ display: block; float: right;}
.signup-form form dl{
	overflow: hidden;
	margin: 5px 0;
}
.signup-form form dl dt{
	float: left;
	width: 140px;
	padding: 8px 0 0 0;
	text-align: right;
}

.signup-form form dl dd{
	width: 370px;
	float: left;
	margin-left: 10px;
}
.signup-form form input{
	background: #eee;
	border: 1px solid #ccc;
	padding: 3px 5px;
	width: 358px;
	margin: 3px 0 5px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-khtml-border-radius: 5px;
}
.signup-form form select{
	background: #eee;
	border: 1px solid #ccc;
	margin: 3px 0 5px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-khtml-border-radius: 5px;
	width: 370px;
}
.errorMsg{
	color: #f00;
	margin: 10px 0;
	font: normal 16px Arial;
}
.bare-bones-signup #main aside .wrapper {
    width: 520px;
	border: 1px solid #CCCCCC; 
	padding: 20px; 
		
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

.bare-bones-signup #main section {
    width: 40%;
}

.signup-form form .col2 {border: 1px solid transparent; overflow: auto; width: 518px;}
.signup-form form .col2 dl.half {float: left; width: 259px;}
.signup-form form .col2 dl.half dt {}
.signup-form form .col2 dl.half dd {width: 109px;}
.signup-form form .col2 dl.half input {width: 97px;}
.signup-form form .col2 dl.half:last-child dt{width: 80px; padding-left: 25px;}
.signup-form form .col2 dl.half:last-child dd {width: 144px;}
.signup-form form .col2 dl.half:last-child input {width: 132px;}

/*-----------------------------
	=Footer
------------------------------*/
footer { width: 100%; padding: 40px 0; clear: both; }
footer small { float: left; font-size: 11px; color: #9a9a9a;}



/*------------------------------------------------------------
 	=Utilities
------------------------------------------------------------ */
/* For image replacement */
.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }

/* Hide for both screenreaders and browsers: css-discuss.incutio.com/wiki/Screenreader_Visibility */
.hidden { display: none; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: by Jon Neal. www.webaim.org/techniques/css/invisiblecontent/  &  j.mp/visuallyhidden */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: drupal.org/node/897638 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* The Magnificent Clearfix: Updated to prevent margin-collapsing on child elements. j.mp/bestclearfix */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }

/* Fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page */
.clearfix { zoom: 1; }

.caption { font-size: 11px; margin-top: 10px; width:100%; text-align: center; float: left; }




/*------------------------------------------------------------
 	=Print Styles
------------------------------------------------------------ */
@media print{*{background:transparent!important;color:#000!important;text-shadow:none!important;filter:none!important;-ms-filter:none!important;}a,a:visited{color:#444!important;text-decoration:underline;}a[href]:after{content:" (" attr(href) ")";}abbr[title]:after{content:" (" attr(title) ")";}.ir a:after,a[href^=javascript:]:after,a[href^=#]:after{content:"";}pre,blockquote{border:1px solid #999;page-break-inside:avoid;}thead{display:table-header-group;}tr,img{page-break-inside:avoid;}@page{margin:.5cm;}p,h2,h3{orphans:3;widows:3;}h2,h3{page-break-after:avoid;}}


