@charset "utf-8";
/* CSS Document */
html {
min-height: 100%;

}
body {
	background-image: url(../img/bg/bg_lower_body.jpg);
	background-repeat: repeat-x;
	background-position: left bottom;
	min-height: 100%;
}
.wrapper {
	background-image: url(../img/bg/bg_upper_body.jpg);
	background-repeat: repeat-x;
	background-position: left top;
}

#logo { padding: 0px 0px 0px; }
#right-col {

	padding-top: 30px;
	padding-bottom: 60px;
}
#right-col p {
	font-size:11px;
	line-height: normal;
}

#features #content .inner, #about #content .inner {
	background-image: url(../img/bg/bg_left_divider.gif);
	background-repeat: repeat-y;
	background-position: 635px top;
	margin-top:50px;
}
#features h1 {text-shadow:2px 2px 0 #CCCCCC; }

#home #content .inner {
	margin-top:50px;
	height:500px;
	overflow:hidden;
	*overflow:visible;
}

#home #footer {float:left;}

#home h1{
	font-size: 92px;
	line-height: 78px;
	font-weight: bold;
	letter-spacing: -4px;
	text-shadow: #ccc 2px 3px 0px;
}
#home h3{ 
	font-size: 22px;
	line-height: 26px;
	color: #999; 
	font-weight: normal;
}

#load {position:absolute; left:400px; top:300px; z-index:567; display:none;}

.example1, .example2, .example3 {}

#home .example1 .cu3er-content {height:560px;}
#home .example2 .cu3er-content {height:361px;}
#home .example3 .cu3er-content {height:556px;}

#home .example1 h1 {margin-top:35px;}
.example2 #cu3er-container {background-color:#CCC}

#home .example2 a.button-large {margin:0 auto 0px;}
#home .example2 #cu3er-container{*height:361px;}


#home .example2 h1, #home .example3 h1 {font-size:60px; letter-spacing:-3px; margin-bottom:5px; line-height:62px;}
#home .example3 h1 {font-size:72px; margin-bottom:20px; margin-top:36px;}
#home .example2 h1 {margin-top:12px;}

#home .example3 .grid_8 {top:-30px; left:-50px; margin-bottom:40px;}



#about h3, #about #right-col p {margin-bottom:5px;}
#about #right-col span { display:block; font-size:9px;}
#about h1 {text-transform:none; }


#page #content .inner, #support #content .inner, #contact #content .inner, #legal #content .inner {padding-top:80px; padding-bottom:40px;}

#mainnavi {
 	float:right;
}
#main_cu3er {
	position: relative;
	z-index: 500;
	top: -25px;
	left: 0px;
	height: 570px;
}

#mainnavi ul {
	margin: 0px 0px;
	float:right;
	text-align:right;
}

#mainnavi li {
	list-style: none;
	margin: 0px -1px 0px 0;
	padding:7px 1px 10px 0px;
	text-shadow: #fff 1px 1px 0px;
	float: left;
}

#mainnavi li a {
	color: #2185c5;
	font-weight: bold;
	padding: 10px 15px 11px;
	font-size:11px;
	

	/*-moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;*/
		
}
#mainnavi li a:hover, #mainnavi li a#navi-demo:hover {
	color: #FFF;
	text-shadow: #0f6298 0px 1px 0px;
	border-top:0;	
	background: url(../img/sprites/sprite_buttons.png) no-repeat -1px -50px	;



}
#mainnavi li a#navi-demo {
	color: #74684d;
	background-image: url(/img/sprites/sprite_buttons.png);
	background-repeat: no-repeat;
	background-position: right -301px;
	text-shadow: #fee58f 0px 1px 0px;
	
}

a#cm-demo {font-size:11px; width:200px; text-align:center; display:block; margin-top:6px; font-weight:bold;}
#home .example2 a#cm-demo { margin:6px auto;}

#mainnavi a.selected, #features #navi-features, #pricing #navi-pricing, #about #navi-about, #support #navi-suppoprt, #contact #navi-contact {
	/*background-color: #f2f2f2;*/
	color:#999;
	text-shadow: #fff 1px 1px 0px;	/*border-top: 1px solid #CCC;
	border-bottom: 1px solid #FFF;*/
	background:0; 
	cursor:pointer;
}

#mainnavi li a.hover .selected {  }

#header {}

#header .inner {



}
.shadow{	
	border-radius:3px;
	border: 1px solid #c1c1c1;
	background: #f0f0f0 url(../img/bg/header_bg.jpg) repeat-x left bottom;	
	box-shadow: 0px 1px 4px #d4d4d4;
	-moz-box-shadow: 0px 1px 4px #d4d4d4;
	-webkit-box-shadow: 0px 1px 4px #d4d4d4;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;	
}

.wrap {
	box-shadow:inset 1px 1px 0px #fff;
   -moz-box-shadow:inset 1px 1px 0px #fff;
   -webkit-box-shadow:inset 1px 1px 0px #fff;
   
   	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius:3px;
	
   padding:0px 60px 0px;
   /*width:958px;*/
  	margin: 0 -60px 0 -60px;
	


}
.header-top {
	margin-left:auto;
margin-right:auto;
padding:9px 60px;
width:840px;
text-align:right;
font-size:9px;
}

#footer {
	margin-top: 30px;
	margin-bottom: 20px;
	font-size: 11px;
}
#footer a {text-shadow: #fff 1px 1px 0px; }
#home #footer {margin-top:0;}
#footer li {
	float: left;
	padding-right: 20px;
}
#footer .social ul {text-align:right; float:right; margin-bottom:0}
#footer .social li {padding-right:7px; }

#footer .social-large ul {
	text-align:center;
	margin-top:40px;
	margin-bottom:40px;
}

#footer .social-large ul li, #examples li{ float:none; display:inline; }
#footer #examples li {padding-right:20px;}
#examples {text-align:center; margin-bottom:2px;}
#examples li a {font-weight:bold;}



#pricing #misc{ 

	background-image: url(../img/bg/bg_top_divider.gif);
	background-repeat: repeat-x;
	background-position: left top;
	display: block;
}
#footer .inner .grid_12{ margin: 8px 0px 7px; }
.copyright {
	font-size: 9px;
	color: #999;
	padding-top:3px;
}
.copyright-home { text-align:center; margin-bottom:5px;}

#features h2 {
	font: italic normal 22px "Times New Roman", Times, serif;
	
}

#features-content, .home-content, .cu3er-content{ margin-top: 30px; }

#features-content p { margin-bottom: 30px; }
#features-content h4 { margin-bottom: 10px; font-size:15px; }
#features-content h4 a { color:#000;}

#features-content .grid_3 { width:156px; }
#features-content .grid_3 h4 { font-size:12px; }
#features-content .grid_3 p { margin-bottom: 20px; font-size:11px; }


#features-navi {
	padding-bottom: 40px;
	z-index: 10;	
}
#features-navi ul{
	list-style-type: square;
	list-style-position: inside;
}

#features-navi li {
	font-size: 10px;
	line-height: normal;
}
#features-navi h3, .nextprev a{
	font-size: 18px;
	font-weight: normal;
	color: #333;
	text-transform: uppercase;
	letter-spacing: -1px;
	display: block;
	margin-bottom: 0px;
	margin-top: 8px;
	padding-bottom: 8px;
	line-height: 18px;
}
#features-navi h3.selected a{ }
#features-navi h3 a.current {
		/*margin-left: -22px;
	
	padding:5px;
	margin-left:-5px;*/
	color:#999;
	/*text-shadow: #ccc 1px 2px 1px;*/
}
#features-navi div  {
	padding: 0;
	height: 70px;
	font-size: 9px;
	cursor:pointer;
}
.placeholder {	position: relative;	left: -58px; top: 8px;}
.pos {	position: relative;	left: -34px; top: 8px;}
#get-cu3er {
	padding-top: 30px;
	margin-bottom: 20px;
}

a.button-large {
	background-image: url(../img/sprites/sprite_buttons.png);
	background-position: 0px -50px;
	height: 46px;
	width: 200px;
	display: block;
	position: relative;
	outline: 0;
	line-height: 44px;
	text-align: center;
	font-size: 15px;
	font-weight: bold;
	text-transform:uppercase;
	color:#FFF;
	position:relative;
	
	/*-webkit-transition: all 200ms ease-out;
	-moz-transition: all 200ms ease-out;
	-o-transition: all 200ms ease-out;
	transition: all 200ms ease-out;	*/
}

a.button-large:hover {
	background-position: 0px 0px;	
	color:#248dd0;
	text-shadow: #fff 1px 2px 0px;
	

}

#home a.button-large {margin-top:10px;}
#features a.button-large {margin-left:-10px; margin-bottom:20px;}
#get-cu3er a{
	background-image: url(../img/sprites/sprite_buttons.png);
	background-position: 0px 0px;
	height: 46px;
	width: 170px;
	display: block;
	position: relative;
	text-indent: -9999px;
	outline: 0;
}
#get-cu3er a:hover {
	background-image: url(../img/sprites/sprite_buttons.png);
	background-position: 0px -50px;
	
}

.nextprev a {
	margin-top:20px;
	font-size:14px;
	text-transform: none;
	font-weight: bold;
	letter-spacing: normal;
}

.last.nextprev {text-align:right}

#pricing #content.outer { /*background: url(../img/bg/bg_upper_body.jpg) repeat-x 0px 155px;*/ }

#pricing #content .inner {
	margin-top:70px;
	/*background-image: url(../img/bg/pricing_divider_bg.gif);
	background-repeat: repeat-y;
	background-position: center top;*/
	width:960px;
	padding:0 0px;
}


.account, .signup {
	float:left;
	width:319px;
	text-align: center;
	zoom: 1;
	margin:0;
	
}
.account .info {
	padding:180px 0 10px 0;
	background: url(../img/pricing_plans_20.png) no-repeat 24px top;
	*background-color:#FFF;
	/*border-right: 1px solid #cecece;*/
}

.info.pro {	
	background-position: -260px top;
}

.info.pro-pack {
	background-position: -547px top;
	border:0;
}

.account ul {
	margin:30px 75px 40px;	
}

.account li {
	background-image: url(../img/sprites/icons.png);
	background-repeat: no-repeat;
	background-position: 151px 0px;
	text-transform: uppercase;
	line-height: 24px;
	text-align: left;
}

.account li.off {
		background-position: 151px -50px;
}
.account li.savings {
	font-weight:bold;
	margin-bottom:-10px;
}

.account li.savings span{
	display:block;
	color: #628e1f;
	text-transform: none;
	margin-top: -5px;
	padding: 0px;
	font: normal 9px Arial, Helvetica, sans-serif;
}

.account a {
	text-transform: uppercase;
	font-size:12px;
}

.account a.button-large {
	margin:0 60px 20px;
	font-size:15px;
}
.signup a.button-large, #form-button {
	margin:0 0px 20px 0px;
	font-size:12px;
	position:relative;

}

.account p {
	margin-top:2px;
	
}

.account p a {font-size:9px; text-transform:none;}

#pricing #misc {
 padding-top:30px;	
 text-align:center;
 font-weight:bold;
 margin-top:60px;
}
a.exit {
	background-image: url(../img/sprites/icons.png);
	background-repeat: no-repeat;
	background-position: 0px -50px;
	text-indent: -9000px;		
	outline:0;
	display:block;
	
	width:16px;
	margin:10px 0 10px 231px;
	

}
.signup, #login-container {
	position:relative;
	border:1px solid #CCC;
	width:200px;
	height:600px;
	overflow:hidden;
	padding:0 59px;
	font-size:10px;
	background-image: url(../img/bg/form_bg.jpg);
	background-repeat: repeat-x;
	background-position: left top;
	margin-left:-1px;
}

label{display:block;}
input, select{
	background-image: url(../img/sprites/sprite_buttons.png);
	background-position:0 -350px;
	background-repeat:no-repeat;
	border:solid 1px #d9d9d9;
	
	margin:0;
	padding:8px 5px 9px;
	vertical-align:top;
	width:190px;
}
input:focus {
	background-position:0 -400px;
}
.text_field, .input { text-align: left; margin-bottom:10px;	}

.error input, #contact .error input, #contact .error textarea { 
	border:solid 1px #ff0000;
	box-shadow: 0px 0px 4px #ff0000;
	-moz-box-shadow: 0px 0px 4px #ff0000;
	-webkit-box-shadow: 0px 0px 4px #ff0000;
/*background-position:0 -450px;*/

}
.error label, .error p, .error p a{color:#C00;}

#head h3 {text-align:left; line-height:20px; margin-top:10px; margin-bottom:7px; clear:both;}
#signform {text-align:left; position:relative;}
.account .log-in {margin-bottom:30px; margin-top:5px; }
input#terms, #UserAutoLogin {text-align:left; width:auto; background:0; *border:0;}
.checkbox_field {margin-bottom:22px; margin-top:25px; *margin-top:13px;}
.checkbox_field p, .checkbox_field label {margin-left:20px; margin-top:-13px; *margin-top:-17px;}
#test {height:500px;}
#head a {font-weight:bold;}

#login_page #content .inner {
	padding-top:120px;
	background-image: url(../img/bg/login_page_bg.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	padding-bottom: 50px;
}
#login_page #head {
	background-image: url(../img/logo/logo_header_bg.png);
	background-repeat: no-repeat;
	background-position: 0px 2px;
	padding-left: 45px;
}
#login_page #head p { color:#999; }
#login-container {width:200px; height:450px; margin:0 auto; padding-top:30px;}
.footnote {font-size:10px; color:#666; margin-top:20px;}
.footnote b {color:#09F; font-weight:normal;}


#legal ol { list-style-position:inside; }
#legal h3 {margin-bottom:10px; }
#legal ol.latin { list-style-type:lower-latin; }
#legal ol li { padding-left: 20px;}



a.small-button {
	display: block;	
	padding: 0;
	width:90px;	
	height: 24px;
	line-height: 23px;
	text-align:center;
	font-size: 9px;	
	background-image: url(../img/sprites/sprite_buttons.png);
	background-repeat: no-repeat;
	background-position: 0px -200px;
	border-right: 1px solid #CCC;
	text-transform: uppercase;

}
a.small-button.blue, input.small-button.blue {	
	color:#fff;
	background-position: 0px -250px; 
}
a.small-button.blue:hover, input.small-button.blue:hover{ color:#2389ca; background-position: 0px -200px; border-right: 1px solid #CCC;}

.project-top li a { 
	background-position: 0px 999px;
	width:auto;
	padding:0 10px;
	
}

a.small-button:hover {
	color:#fff;
	background-position: 0px -250px;
	border-right: 1px solid #238bcd;
}

#support #content .inner img {margin-bottom:20px; }

#contact #content .inner {
	background-image:url(../img/bg/bg_left_divider.gif);
background-position:494px top;
background-repeat:repeat-y;	
margin-top:50px;
padding-top:20px;
}

#contact #content h4 {margin-bottom:3px;}
#contact #content p {margin-bottom:10px;}
#contact #content .grid_3 {
	margin-bottom:30px;	
	font-size:11px;
}

#contact input, #contact select, #contact textarea {
	width:300px;
	border:solid 1px #d9d9d9;
	
}
#contact label {font-size:10px;}
#contact select {width:311px}
#contact textarea { padding:8px 5px 9px; margin-bottom:20px;}
#contact input:focus {
	/*border-radius:3px;
	border: 1px solid #c1c1c1;	
	box-shadow: 0px 1px 4px #d4d4d4;
	-moz-box-shadow: 0px 1px 4px #d4d4d4;
	-webkit-box-shadow: 0px 1px 4px #d4d4d4;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;	*/
}

#contact-form .small-button {margin-left:12px; margin-top:15px;}

.hidden {
display:none;
}

#error_page #content .inner {
	padding-top:120px;
	background-image: url(../img/bg/404_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
	padding-bottom: 50px;
}

#error-container {
height:100%;
margin:350px auto 0;
padding-top:30px;
width:700px;
}
#error-container h1 {font-size:24px; letter-spacing:0;}
#error-container h3, #error-container h1 {margin-bottom:10px; text-align:center;}

#examples li a.active {color:#999; cursor:pointer;}


/* Samples/Tempates */

.tmplt-wrap{
	display:inline;
	float: left;
	position: relative;
	margin-left: 0px;
	margin-right: 31px;
	/**margin-right: 10px;*/
	margin-bottom:10px;
	/*width:230px;*/
}

.tmplt-wrap.last{ margin-right:0; }
.tmplt { 
	padding:10px;
	background-color:#FFF;
	border: solid 1px #d1d1d1;
	
	box-shadow: 0px 1px 4px #d4d4d4;
	-moz-box-shadow: 0px 1px 4px #d4d4d4;
	-webkit-box-shadow: 0px 1px 4px #d4d4d4;

	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.tmpl-overlay{
	position:absolute;
	z-index:101;
	top:11px;
	width:227px;
	height:135px;	
	background-image: url(../img/sprites/icons.png);
	background-repeat: no-repeat;
	background-position: 0px -200px;	
}


.tmplt-info {
	margin-top:5px; 
	padding-left:11px;
	
}

.tmplt-info h6{ margin-bottom:0; font-size:11px; }
.tmplt-info p{ color:#999;}
.tmpl-overlay a {
	background-image: url(../img/sprites/icons.png);
	background-repeat: no-repeat;
	line-height:24px;
	display:block;
	padding-left:35px;
	margin-left:64px;
}
.tmpl-overlay a.preview {
	
	background-position: 0px -150px;
}
.tmpl-overlay a.preview:hover {	background-position: -250px -150px;}

.tmpl-overlay a.use-this {
	margin-top:42px;
	margin-bottom:2px;
	background-position: 0px -100px;	
}
.tmpl-overlay a.use-this:hover {background-position: -250px -100px;}