@font-face {
    font-family: 'ArialRoundedMTBoldRegular';
    src: url('fonts/arlrdbd.eot');
    src: url('fonts/arlrdbd.eot') format('embedded-opentype'),
         url('fonts/arlrdbd.woff2') format('woff2'),
         url('fonts/arlrdbd.woff') format('woff'),
         url('fonts/arlrdbd.ttf') format('truetype'),
         url('fonts/arlrdbd.svg#ArialRoundedMTBoldRegular') format('svg');
}

body{
	margin:0;
	padding:0;
	font-family: 'ArialRoundedMTBoldRegular';
	font-size:15px;
	line-height:18px;
	color:#222;
	width:100%;
	background:#eee;
}

a.btn-white, a.btn-white:visited {
	color: #fff;
	text-decoration: none;
	border: 2px #fff solid;
	border-radius: 3px;
	padding:10px 30px;
	font-size:24px;
}

a.btn-white:hover{background:#4bad29; color:#fff; text-decoration: none;}

a.btn-green, a.btn-green:visited{
	color: #fff;
	text-decoration: none;
	border: 2px #279500 solid;
	background:#4bc81f;
	border-radius: 3px;
	padding:10px 30px;
	font-size:24px;
}

a.btn-green:hover{background:#fff; color:#4bc81f; border: 2px #4bc81f solid; text-decoration: none;}

a {
	color: #4bad29;
	text-decoration: none;
}

a:visited {
	color: #4bad29;
}

a:focus {
	outline: thin dotted;
}

a:active,
a:hover {
	color: #666;
	outline: 0;
}

a:hover {
	text-decoration: underline;
}

h1,h2,h3,h4,h5,h6 {
	clear: both;
	line-height: 1.3;
	font-weight:normal;
}

/* Form fields, general styles first. */
input[type=text],input[type=password],input[type=tel],input[type=email], select{
	color: #222;
	padding: 2%;
	width:46%;
	margin:0 5px 10px 0;
	font-family:Arial, Helvetica, sans-serif;
	border-radius:4px;
	border: 2px solid #ddd;
}

textarea {
	color: #222;
	padding: 2%;
	width:93.5%;
	margin:0 0 10px 0;
	font-family:Arial, Helvetica, sans-serif;
	border-radius:4px;
	border: 2px solid #ddd;
}

input[type=text]:focus,input[type=password]:focus,input[type=tel]:focus,input[type=email]:focus,
textarea:focus, select:focus {
	border: 2px solid #4bad29;
	outline: 0;
}

/* Buttons */
input[type="submit"]{
	background: #4bad29; /* Old browsers */
	background: -webkit-linear-gradient(top, #4bad29 0%, #29a100 100%); /* Chrome 10+, Safari 5.1+ */
	background:   linear-gradient(to bottom, #4bad29 0%, #29a100 100%); /* W3C */
	border: none;
	border-bottom: 3px solid #1f7900;
	border-radius: 2px;
	color: #fff;
	display: block;
	padding: 10px 24px 9px;
	text-decoration: none;
	cursor:pointer;
	font-size:14px;
}
input[type="submit"]:hover,
input[type="submit"]:focus{
	background: #29a100; /* Old browsers */
	background: -webkit-linear-gradient(top, #29a100 0%, #4bad29 100%); /* Chrome 10+, Safari 5.1+ */
	background:   linear-gradient(to bottom, #29a100 0%, #4bad29 100%); /* W3C */
	outline: none;
}

input[type="button"]{
	background: #bbb; /* Old browsers */
	background: -webkit-linear-gradient(top, #bbb 0%, #999 100%); /* Chrome 10+, Safari 5.1+ */
	background:   linear-gradient(to bottom, #bbb 0%, #999 100%); /* W3C */
	border: none;
	border-bottom: 3px solid #666;
	border-radius: 2px;
	color: #fff;
	display: inline-block;
	padding: 10px 24px 9px;
	text-decoration: none;
	cursor:pointer;
	font-size:14px;
}
input[type="button"]:hover,
input[type="button"]:focus{
	background: #999; /* Old browsers */
	background: -webkit-linear-gradient(top, #999 0%, #bbb 100%); /* Chrome 10+, Safari 5.1+ */
	background:   linear-gradient(to bottom, #999 0%, #bbb 100%); /* W3C */
	outline: none;
}

/* Placeholder text color -- selectors need to be separate to work. */
::-webkit-input-placeholder { color: #999; }
:-moz-placeholder {	color: #999; }
::-moz-placeholder { color: #999; }
:-ms-input-placeholder { color: #999; }

/* table */
table{ width:100%; font-size:14px; margin:1.5% 0;}
table tr th{text-align:left; border-bottom:3px #ddd solid; line-height:24px; padding:5px 10px;}
table tr td{border-bottom:1px #ddd solid; line-height:24px; padding:5px 10px;}
table tr:nth-child(even){background:#fafafa;}
table tr:first-child:hover{background:none;}
table tr:hover{background:#f1fbee;}

hr{
	background-color:none;
	border-top:1px solid #ddd;
}

.wrapper{
	max-width:1600px;
	margin:0 auto;
	padding:0;
}

header{
	width:100%;
	overflow:hidden;
	padding:0;
	background:#fff;
}

#home-slide{
	min-height:660px;
	background:url('images/home-slide.jpg') no-repeat center top;
}

.home-slogan{
	height:390px;
	padding-top:70px;
	text-align:center;
}

.home-slogan h1 {font-size:60px; color:#fff;}

.home-recommend{
	overflow:hidden;
	width:86%;
	padding:23px 7%;
	color:#fff;
	line-height:50px;
	font-size:18px;
	background: rgba(0, 0, 0, 0.6);
}

.home-recommend span{float:left; width:20%; text-align:center; }
.home-recommend span:first-child{width:29%;}
.home-recommend span + span{margin-left:2%;}

.home-recommend span.orange{ background:#fc8a04; border:2px #d47300 solid; border-radius:3px;}
.home-recommend span.blue{ background:#16a0e0; border:2px #0078b0 solid; border-radius:3px;}
.home-recommend span.green{ background:#4bc81f; border:2px #279500 solid; border-radius:3px;}

header hgroup {height:100px; width:86%; padding:0 7%;}
header hgroup h1{float:left; width:30%;}

nav.main, nav.page {
	float:left;
	padding:35px 0 0 0;
	font-size:16px;
	width:70%;
	font-family:Arial, Helvetica, sans-serif;
}

nav.main ul, nav.page ul{
	list-style:none;
	padding:0;
	margin:0;
	float:right;
}

nav.main ul li, nav.page ul li{
	display:inline-block;
}

nav.main ul li a, nav.page ul li a{
	color:#fff;
	line-height:28px;
	padding:7px 20px;
	border-radius: 2px;
}

nav.main ul li a:hover{
	color:#4bad29;
	text-decoration:none;
}

nav.page ul li a{
	color:#777;
}

nav.page ul li a:hover, nav ul li.selected a{
	color:#4bad29;
	text-decoration:none;
}

nav.main ul li:last-child a, nav.page ul li:last-child a{
	background:#4bad29;
	color:#fff;
	text-decoration:none;
}

nav.main ul li:last-child a:hover, nav.page ul li:last-child a:hover{background:#555;}

section{
	width:100%;
	background:#fff;
}

.greenbg{
	background:#4bc81f;
	color:#fff;
}

.bluebg{
	background:#dffde7;
	text-align:center;
	min-height:150px;
}

.content{
	width:86%;
	padding:3% 7%;
	overflow:hidden;
}

.content h1{text-align:center; font-size:30px;}

.content .point{
	float:left;
	width:25%;
	text-align:center;
	margin:15px 0;
}

.content .point img{
	background:#dffde7;	
	padding:15px;
	border-radius:5px;
}

.content .point h2{font-size:16px;}

.content .features{ width:30%; padding-top:20px;}
.content .features ul{ list-style:none; padding:0;}
.content .features ul li{line-height:50px; font-size:16px;}
.content .features ul li + li{border-top:1px dotted #fff;}
.content .features ul li img{padding:5px; border-radius:3px; background:#fff; float:left; margin-top:5px; margin-right:20px;}
.content .features ul li a{color:#fff;}

.content .features .screenshot{position:absolute; margin-left:380px; margin-top:30px;}

.content .testimonial{float:left; width:46%; margin:2%;}
.content .testimonial .profile{float:left; width:20%; margin-right:2%; padding-top:15px;}
.content .testimonial .profile img{border-radius:50px;}
.content .testimonial .comment{float:left; width:78%; font-family:Arial, Helvetica, sans-serif; color:#777; font-size:13px;}
.content .testimonial .comment span{color:222; font-family: 'ArialRoundedMTBoldRegular'; font-size:15px;}

.content .plan{float:left; padding:1% 2% 2% 2%; width:27.5%; font-family:Arial, Helvetica, sans-serif; color:#fff;}
.content .plan h2{font-family: 'ArialRoundedMTBoldRegular'; font-size:30px; margin:10px 0;}
.content .plan span{font-family: 'ArialRoundedMTBoldRegular'; background:#fff; border-radius:4px; padding:5px 15px; margin-bottom:5px; display:inline-block;}
.content .plan + .plan{margin-left:1.5%;}
.content .plan input[type=submit]{border: none; color: #222; padding: 10px 44px 9px; font-family: 'ArialRoundedMTBoldRegular'; text-transform:uppercase; font-size:18px;}
.content .orange input[type=submit]{ background:#ffd7a9;}
.content .blue input[type=submit]{ background:#abe4ff;}
.content .green input[type=submit]{ background:#c0ffa9;}
.content .orange input[type=submit]:hover{ background:#fc8a04; color:#fff;}
.content .blue input[type=submit]:hover{ background:#16a0e0; color:#fff;}
.content .green input[type=submit]:hover{ background:#4bc81f; color:#fff;}

.content .signup{float:left; width:24%; border-radius:4px; text-align:right; padding-right:2.5%;}
.content .signup-form{float:left; width:70%; padding-left:3%; border-left:1px #ddd solid;}
.content .signup-form p{ font-family:Arial, Helvetica, sans-serif;}
.content .orange{ background:#fc8a04; border:2px #d47300 solid; border-radius:4px;}
.content .blue{ background:#16a0e0; border:2px #0078b0 solid; border-radius:4px;}
.content .green{ background:#4bc81f; border:2px #279500 solid; border-radius:4px;}

.content .orange span{ color:#fc8a04; }
.content .blue span{ color:#16a0e0; }
.content .green span{ color:#4bc81f; }

.content .orange:hover{ background:#fff; color:#fc8a04; border:2px #fc8a04 solid; }
.content .blue:hover{ background:#fff; color:#16a0e0; border:2px #16a0e0 solid;}
.content .green:hover{ background:#fff; color:#4bc81f; border:2px #4bc81f solid;}

.feature + .feature{border-top:1px #eee solid;}
.feature h2{clear:none; font-size:30px;}
.feature p{ font-family:Arial, Helvetica, sans-serif;}
.feature ul.alignright{float:right; margin:0 0 10px 30px; columns: 3;  -webkit-columns: 3;  -moz-columns: 3; list-style-image:url('images/icon-tick.png');list-style-position: inside; margin-top:-55px;}
.feature ul.alignright li + li{margin-top:10px;}

img.alignright{float:right; margin:0 0 10px 40px;}
img.alignleft{float:left; margin:0 40px 10px 0;}

.contact div{float:left; width:50%;}
.contact div h2{font-size:30px;}
.contact div p{ font-family:Arial, Helvetica, sans-serif;}

.faq{background:#f6f6f6;}
.faq ol li+li{border-top:1px dotted #bbb;}
.faq ol li h4{margin-bottom:0;}
.faq ol li p{font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#555;}

.error-msg{background:#ed1616; color:#fff; margin-bottom:10px; padding:3px 10px; font-size:12px; font-family:Arial, Helvetica, sans-serif; border-radius:3px;}
.success-msg{background:#4bc81f; color:#fff; margin-bottom:10px; padding:3px 10px; font-size:12px; font-family:Arial, Helvetica, sans-serif; border-radius:3px;}

footer{
	width:100%;	
}

.widgets{
	width:86%;
	padding:1.5% 7%;
	background:#222;	
	overflow:hidden;
}

.widgets .widget{
	float:left;	
	color:#999;
}
.widgets .firstcolumn ul{list-style:none; padding:0;columns: 2;  -webkit-columns: 2;  -moz-columns: 2;}
.widgets .firstcolumn ul li a{color:#999; line-height:30px;}
.widgets .firstcolumn{ width:34%;}
.widgets .othercolumn{ width:17%;}
.widgets .logocolumn{ width:32%; text-align:center; padding-top:20px;}

.copyright{
	padding:0 7%;
	color:#999;
	background:#121212;
	font-size:11px;
	line-height:30px;
	font-family:Arial, Helvetica, sans-serif;
	text-align:center;
}

.sb-slidebar {
	height: 100%;
	overflow-y: auto; /* Enable vertical scrolling on Slidebars when needed. */
	position: fixed;
	top: 0;
	z-index: 0; /* Slidebars sit behind sb-site. */
	display: none; /* Initially hide the Slidebars. Changed from visibility to display to allow -webkit-overflow-scrolling. */
	background-color: #222222; /* Default Slidebars background colour, overwrite this with your own css. */
	-webkit-transform: translate(0px); /* Fixes issues with translated and z-indexed elements on iOS 7. */
}

@media (max-width : 1599px) {
	.wrapper{width:100%;}
	select { min-width:35%; }
	input[type=text],input[type=password],input[type=number],input[type=email],textarea { min-width:35%;}
	table{ width:100%;}
}

@media (max-width : 1200px) {

}

@media (max-width : 999px) {
	nav.main ul li a, nav.page ul li a{	padding:7px 15px;}
	.feature ul.alignright{float:none; margin:20px 0 10px 0; columns: 3;  -webkit-columns: 3;  -moz-columns: 3;}
	.content .testimonial .profile{width:30%;}
	.content .testimonial .comment{width:68%;}
}

@media (max-width : 768px) {
	#sb-site {
	width: 100%;
	position: relative;
	z-index: 1; /* Site sits above Slidebars */
	}
	#home-slide{
		min-height:660px;
		background:url('images/home-slide.jpg') no-repeat center top;
	}
		
	.home-slogan h1 {font-size:50px;}
	
	nav.main, nav.page{display:none;}
	.sb-toggle-left{float:left; width:30px; margin:0 15px 0 0;}
	header hgroup{text-align:right; height:80px;}
	header hgroup h1{float:none; width:auto; clear:none;}
	nav {
		float:left;
		padding:0;
		font-size:16px;
		width:100%;
		font-family:Arial, Helvetica, sans-serif;
	}
	
	nav ul{
		list-style:none;
		padding:0;
		margin:0;
	}
	
	nav ul li + li{
		border-top:1px solid #333;
	}
	
	nav ul li{
		border-bottom:1px solid #000;
	}
	
	nav ul li a, nav ul li a:visited{
		color:#fff;
		line-height:28px;
		padding:5% 10%;
		border-radius: 2px;
		display:block;
		background:#111;
	}
	
	nav ul li a:hover{
		text-decoration:none;
		background:#4bad29;
	}
		
	nav ul li:last-child a{
		background:#4bad29;
		color:#fff;
		text-decoration:none;
	}
	
	nav ul li:last-child a:hover{background:#333;}
	.bluebg{min-height:200px;}
	.content .point{width:50%;}
	.feature{ text-align:center;}
	.feature ul.alignright{ columns: 2;  -webkit-columns: 2;  -moz-columns: 2; text-align:left;}
	img.alignright{float:none; margin:0;}
	img.alignleft{float:none; margin:0;}
	.content .features {width:100%;}
	.content .features .screenshot{position:static; margin-left:0; margin-top:10px;}
	.content .features .screenshot img{width:100%;}
	.content .testimonial{width:100%; margin:2% 0;}
	.content .testimonial + .testimonial{border-top:1px #eee solid;}
	.content .testimonial .profile{width:20%;}
	.content .testimonial .comment{width:78%;}
	.content .signup{width:14%;}
	.content .signup-form{width:80%;}
	.content .plan input[type=submit]{padding: 10px 34px 9px;}
	.contact div:first-child{width:60%;}
	.contact div:last-child{width:35%; margin-left:5%;}
	.widgets .firstcolumn{ width:65%;}
	.widgets .othercolumn{ width:50%;}
	.widgets .logocolumn{ width:35%;}
}

@media (max-width : 650px) {
	.content h1{font-size:26px;}
	.home-slogan{height:360px;	padding-top:50px;}	
	.home-recommend span{width:30%;}
	.home-recommend span:first-child{width:100%;}
	.home-recommend span.orange, .home-recommend span.blue, .home-recommend span.green{ font-size:17px;}
	img.alignright, img.alignleft{width:100%;}
	.content .signup{width:100%; float:none; padding:0; margin:0; text-align:center;}
	.content .signup-form{width:100%;  float:none; padding:0; margin:0; border-left:none; border-top:1px solid #ddd;}
	.content .plan{margin-top:20px;}
	.content .plan input[type=submit]{padding: 10px 34px 9px;}
	.contact div{ float:none; width:100%;}
	.contact div:first-child, .contact div:last-child{width:100%; margin-left:0;}
	.contact div + div{border-top:1px solid #ddd;}
}

@media (max-width : 480px) {
	input[type=text],input[type=password],input[type=tel],input[type=email], select, textarea {width:96%; padding:3% 2%;}
	.content h1{font-size:24px;}
	.home-recommend span.orange, .home-recommend span.blue, .home-recommend span.green{ font-size:14px;}
	.content .point h2{font-size:14px;}
	.feature ul.alignright{columns: 1;  -webkit-columns: 1;  -moz-columns: 1;}
	.content .testimonial .profile{width:30%;}
	.content .testimonial .comment{width:68%;}
	.content .plan{margin-top:20px; float:none; width:90%; padding:2% 5% 5% 5%; }
	.content .plan + .plan{margin-left:0;}
	.content .plan input[type=submit]{ width:100%;}
	.widgets .firstcolumn{ width:100%;}
	.widgets .othercolumn{ width:50%;}
	.widgets .logocolumn{ width:100%; padding:15px 0; border-top:1px dotted #444;  border-bottom:1px dotted #444;}
}

@media (max-width : 320px) {
	header hgroup {height:60px;}
	header hgroup h1 img{max-width:180px;}
	.bluebg{min-height:180px;}
	.content h1{font-size:22px;}
	.home-slogan h1 {font-size:35px;}
	.home-slogan{height:290px;	padding-top:20px;}	
	.home-recommend span{ width:100%;}
	.home-recommend span + span{margin-left:0; margin-top:2%;}
	.content .point{width:100%; float:none; margin:35px 0;}
	.content .features ul li{font-size:12px;}
	.content .testimonial{text-align:center;}
	.content .testimonial .profile, .content .testimonial .comment{float:none; width:100%;}
	.content .signup-form{ overflow-x:auto;}
	.widgets .othercolumn{ width:100%; padding-bottom:15px;}
	.widgets .othercolumn + .othercolumn{ border-top:1px dotted #444;}
}