/*
 * Simple Login Modal
 * Version: 1.0
 *
 * Author: Chris Rivers
 *
 * Changelog: 
 * Version: 1.0
 *
 */

html, body { height:100%; }

body {
	background: none repeat scroll 0 0 #000;
	color: #000000;
	font-family:"Raleway",arial; font-weight: 100;
	font-size: 12px;
	height: 100%;
}

h1, h2, h3, h4, h5 {
    color: #000;
    font-family:"Raleway",arial; 
	font-weight: 700;
}

/* Header
--------------------*/
#header {
	background:#1e263b;
	bottom: 0;
	height: 44px;
	padding: 13px 0;
	position: absolute;
	width: 100%;
	z-index: 100;
}

#header.fixed {
	bottom:auto;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
}

#header .inner { margin:0 auto; width:1000px; }
#header h1 { display: inline-block; float:left; margin-top: 8px; }
#header h1 a { color:#fff; font-family: "Oswald",arial,serif; font-size: 26px; font-weight: 700; }

#header ul { float:right; height:20px; margin-top: 14px; }
#header ul li { float:left; margin-left:17px; }
#header ul li.clear { float:none; }
#header ul li a { color:#fff; font-family:"Raleway",arial; font-size: 14px; font-weight: 700; text-transform:uppercase; }
#header ul li a:hover, #header ul li a.active { border-bottom:solid 1px #445581; padding-bottom:2px; }

/* Slide
--------------------*/
.slide {
	background-color: #fff;
	background-position: 50% 0;
	background-repeat: no-repeat;
	background-size: cover;
	height: 100%;
	width: 100%;
}

.slide .section-heading { margin-bottom:40px; text-align:center; }
	
.slide .section-heading h2 {
	font-family: "Raleway",Arial !important;
	font-size: 36px;
	font-weight: 900;
	line-height: 48px;
	padding: 0 0 6px;
	text-transform: uppercase;
}
	
.slide .section-heading h3 { 
    font-family: "Raleway",Arial !important;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 1px;
    line-height: 30px;
    text-transform: uppercase;
}

.slide .section-heading h3 span { 
	border-top: 5px solid #e5e5e5; 
	display: inline-block;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 10px;
}

/* Intro Slide
--------------------*/
.slide.layout-intro {
	background-attachment:fixed;
	height: 100%;
	overflow: hidden;
	position: relative;
}

.slide.layout-intro .inner { 
	margin:0 auto; 
	padding-top: 278px; 
	position:relative;
	width:1000px; 
}

.slide.layout-intro .intro-wrap { 
	padding: 0 0 20px;
}
	
.slide.layout-intro h1 {
	color:#fff; 
	font-family: 'Raleway', sans-serif;
	font-size:40px;
	font-weight:900; 
	padding-bottom:13px;
	text-align:center; 
}

.slide.layout-intro .intro-wrap div { color:#fff; font-family: 'Raleway', sans-serif; font-weight:700; text-align:center; }
.slide.layout-intro .lead { font-size:14px; margin-bottom:10px; }
.slide.layout-intro .close { font-size:14px; }

/* About Slide
--------------------*/
.slide.layout-about { height:auto; }
.slide.layout-about .inner { margin:0 auto; padding: 140px 0; width:1000px; }

.slide.layout-about .section-callouts {}
.slide.layout-about .section-callouts .group { float: left; margin-right: 40px; width: 300px; }
.slide.layout-about .section-callouts .group-1 {}
.slide.layout-about .section-callouts .group-2 {}
.slide.layout-about .section-callouts .group-3 { margin:0; }

.slide.layout-about .section-callouts img {
	display: block;
	height: auto;
	margin: 0 auto;
	width: 110px;
}

.slide.layout-about .section-callouts h3 {
	font-family: "Raleway",Arial;
	font-size: 20px;
	font-weight: 900;
	line-height: 30px;
	text-transform: uppercase;
	text-align:center;
}
	
.slide.layout-about .section-callouts p {
	font-family: "Open Sans",Arial;
	font-size: 18px;
	line-height: 28px;
	text-align:center;
}

/* Demo Slide
--------------------*/
.slide.layout-demo { height:auto; min-height:600px; overflow:hidden; }
	
.slide.layout-demo .section-heading { 
	background:#313848; 
	margin-bottom: 127px; 
	padding:80px 0; 
	opacity: 0;
	transform: perspective(500em) rotateX(90deg);
	-webkit-transform: perspective(500em) rotateX(90deg);
	transform-origin: left top;
	-webkit-transform-origin: left top;
	transition: all 1s ease-in-out;
	-webkit-transition: all 1s ease-in-out;
}

.slide.layout-demo .section-heading.transition {
	opacity: 1;
	transform: perspective(500em) rotateX(0deg);
	-webkit-transform: perspective(500em) rotateX(0deg);
}

.slide.layout-demo .section-heading h2 { color:#fff; }
.slide.layout-demo .section-heading h3 { color:#fff; }
.slide.layout-demo .section-heading h3 span { border-top: 5px solid #5a5f6c; }

/* Footer
--------------------*/
#footer { background:#1e263b; text-align:center; padding:20px 0; }
#footer p { color:#fff; font-family: "Open Sans",arial, sans-serif; font-size: 12px; }
	
/* Third Party Styles
-------------------------*/
.simple-login * { font-family: arial,sans-serif; }
.simple-login.isModal { display:none; }

.simple-login h3 { font-weight: 400; }	

.simple-login .login-header { color: #444; font-weight: bold; margin-bottom: 11px; }
.simple-login .login-block-register-link { margin-top:8px; font-size:11px; }

.simple-login .group { margin-bottom:5px; }
.simple-login label { display:block; margin-bottom:5px; }

.simple-login input.ccm-input-text, 
.simple-login input.ccm-input-password {
	background-color: #ffffff;
	border: 1px solid #cccccc;
	border-radius: 4px;
	color: #555555;
	display: inline-block;
	font-size: 12px;
	height: 20px;
	line-height: 20px;
	margin-bottom: 5px;
	padding: 4px 8px;
	vertical-align: middle;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}        

.simple-login .btn, .demo-btn, .btn {
	display: inline-block;
	*display: inline;
	padding: 4px 12px;
	margin-bottom: 0;
	*margin-left: .3em;
	font-size: 12px;
	line-height: 20px;
	color: #333333;
	text-align: center;
	text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
	vertical-align: middle;
	cursor: pointer;
	background-color: #f5f5f5;
	*background-color: #e6e6e6;
	background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
	background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
	background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
	background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
	background-repeat: repeat-x;
	border: 1px solid #cccccc;
	*border: 0;
	border-color: #e6e6e6 #e6e6e6 #bfbfbf;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
	border-bottom-color: #b3b3b3;
	-webkit-border-radius: 4px;
	   -moz-border-radius: 4px;
	        border-radius: 4px;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	*zoom: 1;
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	   -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}

.simple-login .ccm-input-submit, .demo-btn, .primary {
	color: #ffffff;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	background-color: #006dcc;
	*background-color: #0044cc;
	background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
	background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
	background-image: -o-linear-gradient(top, #0088cc, #0044cc);
	background-image: linear-gradient(to bottom, #0088cc, #0044cc);
	background-repeat: repeat-x;
	border-color: #0044cc #0044cc #002a80;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0044cc', GradientType=0);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	margin-bottom:10px;
}

.simple-login-sign { color:#444; font-size:12px; }
.simple-login-sign a { color:#0E708F; }
.simple-login-sign a:hover { color:#0E708F; }
.simple-login-register a { color:#0E708F; font-size:12px; }

.demo { text-align:center; }
.demo .simple-modal-init { 
	color: #fff;
	cursor: pointer;
	font-family:"Raleway",arial;
	font-size: 22px;
	font-weight: 900;
	padding: 20px 60px; 
}

.dvGlobalMask {
    background: #000;
    display: none;
    left: 0;
    position: absolute;
    top: 0;
    z-index: 9999;
}

.simple-login-modal {
    background: #FFFFFF;
    box-shadow: 5px 5px 20px #000000;
    display: none;
	position: absolute;
    width: 273px;
    z-index: 10000;
	background-color: #ffffff;
	border: 1px solid #999;
	border: 1px solid rgba(0, 0, 0, 0.3);
	*border: 1px solid #999;
	-webkit-border-radius: 6px;
	   -moz-border-radius: 6px;
	        border-radius: 6px;
	-webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
	   -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
	        box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
	-webkit-background-clip: padding-box;
	   -moz-background-clip: padding-box;
	        background-clip: padding-box;
}

.simple-login-modal .login-header { display:none; }
.simple-login-modal .modal-header { clear: both; padding: 9px 19px; border-bottom: 1px solid #eee; margin-bottom: 22px; }

.simple-login-modal .modal-header .close {
    background: none;
    border: 0 none;
    cursor: pointer;
    padding: 0;
    color: #000000;
    float: right;
    font-size: 20px;
    font-weight: bold;
    line-height: 18px;
	margin-top: 2px;
    opacity: 0.2;
    text-shadow: 0 1px 0 #FFFFFF;
}

.simple-login-modal h3 { font-family:"Raleway",arial; font-size: 18px; }
.simple-login-modal .loginButton { margin-top: 8px; padding-right: 6px; text-align: right; }

/* Business Theme */
.simple-login-modal.business {
	background:#1e1e1e;
}

.simple-login-modal.business .modal-header {
	border-bottom:solid 1px #000;
	margin-bottom: 0;
	-webkit-box-shadow: inset 0 1px  #303030;
	   -moz-box-shadow: inset 0 1px 0 #303030;
	        box-shadow: inset 0 1px 0 #303030;
}

.simple-login-modal.business .modal-header .close { color: #FFFFFF; text-shadow: 0 1px 0 #000000; }
.simple-login-modal.business .modalbody { border-top: solid 1px #303030; }

.simple-login-modal.business h3 { color:#fff; }
.simple-login-modal.business .simple-login { padding:15px 20px 10px; }

.simple-login-modal.business input.ccm-input-text, 
.simple-login-modal.business input.ccm-input-password { width:90%; }

.simple-login-modal.business .simple-login label { color:#fff; font-size:12px; }

/* Twitter Theme */
.simple-login-modal.twitter {
	background-color:#fff;
}

.simple-login-modal.twitter .modal-header {
	background:#ececec;
	border-bottom:solid 1px #ccc;
	margin-bottom: 0;
}

.simple-login-modal.twitter .modal-header .close { color: #000; text-shadow: 0 1px 0 #fff; }
.simple-login-modal.twitter .modalbody { border-top: solid 1px #fff; }

.simple-login-modal.twitter h3 { color:#303030; }
.simple-login-modal.twitter .simple-login { padding:15px 20px 10px; }

.simple-login-modal.twitter input.ccm-input-text, 
.simple-login-modal.twitter input.ccm-input-password { width:90%; }
.simple-login-modal.twitter .simple-login label { color:#303030; font-size:12px; }

/* Dream Theme */
.simple-login-modal.dream {
	background-color:#5A1A77;
}

.simple-login-modal.dream .modal-header {
	background:#481060;
	border-bottom:solid 1px #2c0f39;
	margin-bottom: 0;
}

.simple-login-modal.dream .modal-header .close { color: #fff; text-shadow: 0 1px 0 #000; }
.simple-login-modal.dream .modalbody { border-top: solid 1px #872baf; }

.simple-login-modal.dream h3 { color:#fff; }
.simple-login-modal.dream .simple-login { padding:15px 20px 10px; }

.simple-login-modal.dream input.ccm-input-text, 
.simple-login-modal.dream input.ccm-input-password { width:90%; }
.simple-login-modal.dream .simple-login label { color:#fff; font-size:12px; }

.simple-login-modal.dream .ccm-input-submit {
	background-color: #5A1A77;
	*background-color: #5A1A77;
	background-image: -ms-linear-gradient(top, #5A1A77, #5A1A77);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5A1A77), to(#5A1A77));
	background-image: -webkit-linear-gradient(top, #5A1A77, #5A1A77);
	background-image: -o-linear-gradient(top, #5A1A77, #5A1A77);
	background-image: -moz-linear-gradient(top, #5A1A77, #5A1A77);
	background-image: linear-gradient(top, #5A1A77, #5A1A77);
	background-repeat: repeat-x;
	border-color: #5A1A77 #5A1A77 #5A1A77;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
	filter: progid:dximagetransform.microsoft.gradient(startColorstr='#5A1A77', endColorstr='5A1A77', GradientType=0);
	filter: progid:dximagetransform.microsoft.gradient(enabled=false);
	font-weight:bold;
}

/* Customization Bar
-----------------------*/
#style_selector {
	background: #fff;
	display:none;
	position: fixed;
	right: 0;
	top: 90px;
	width: 215px;
	z-index: 100000;
}

#style_selector_container {
    border: 1px solid rgba(23, 24, 26, 0.15);
    border-bottom-left-radius: 2px;
    border-top-left-radius: 2px;
    box-shadow: 0 2px 9px 2px rgba(0, 0, 0, 0.14);
}

#style_selector_container .style-main-title {
    background-image: -moz-linear-gradient(center top , #fff 0%, #f7f4f4 100%);
	background-image: -ms-linear-gradient(top, #fff, #f7f4f4);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#f7f4f4));
	background-image: -webkit-linear-gradient(top, #fff, #f7f4f4);
	background-image: -o-linear-gradient(top, #fff, #f7f4f4);
	background-image: -moz-linear-gradient(top, #fff, #f7f4f4);
	background-image: linear-gradient(top, #fff, #f7f4f4);
    border-bottom: 1px solid rgba(23, 24, 26, 0.15);
    color: #000;
    font-size: 15px;
    height: 44px;
    line-height: 44px;
    text-align: center;
}

#style_selector_container .box-title {
    border-bottom: 1px solid rgba(23, 24, 26, 0.15);
    font-size: 12px;
    height: 41px;
    line-height: 41px;
    text-align: center;
}

#style_selector_container .box-title.double {
	background-image: -moz-linear-gradient(center top , #fff 0%, #f7f4f4 100%);
	background-image: -ms-linear-gradient(top, #fff, #f7f4f4);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#f7f4f4));
	background-image: -webkit-linear-gradient(top, #fff, #f7f4f4);
	background-image: -o-linear-gradient(top, #fff, #f7f4f4);
	background-image: -moz-linear-gradient(top, #fff, #f7f4f4);
	background-image: linear-gradient(top, #fff, #f7f4f4);
	border-top: 1px solid rgba(23, 24, 26, 0.15); 
}

#style_selector_container .box-title a { color:#fff; font-weight:bold; margin-bottom: 3px; }

#style_selector_container .styles { padding: 17px; text-align: center; }
#style_selector_container .styles a { cursor:pointer; display:inline-block; height:30px; width:30px; }
#style_selector_container .styles a.business { background:#000; }
#style_selector_container .styles a.twitter { background:#ccc; }
#style_selector_container .styles a.dream { background:#5A1A77; }