/* General Styles */
body {background-color: #f5f5f5; font-size: 14px; color: #333;}
html {margin: 0px; padding: 0px; }

h1, h2, h3, h4, h5, h6 {font-family: 'Oswald', sans-serif; color: #336699; font-weight: 300;}
h1 {font-size: 40px; letter-spacing: -1px; /*line-height: 35px;margin: 0px 0px 10px 0px;*/}
h2 {color: #f90;}
h3 {font-size: 25px; letter-spacing: -0.5px; line-height: 26px; margin: 0px 0px 15px 0px;}
h4 {font-size: 18px; letter-spacing: -0.5px; line-height: 17px; margin: 7px 0px 2px 0px;color: #333;}
h5 {font-size: 15px; color: #000!important; letter-spacing: -0.5px; line-height: 17px; margin: 0px 0px 7px 0px;}

hr {margin: 10px 0px 15px 0px ;}

a {color: #336699;}
a:hover {color: #07325D;}
p {padding: 0px; margin: 0px; font-size: 14px; line-height: 16px;font-family: 'Open Sans Condensed', sans-serif;}

/* Body Styles */
.header {max-width: 1100px; padding: 0px; margin: 20px auto; }
.container {max-width: 1200px!important; padding: 0px; margin: 20px auto 30px auto; display: flex;}
.clearfix {clear: both; height: 0px; line-height: 0px; margin: 0px; padding: 0px;}

.giftcard { float:right; padding: 0 15px 0 5px; max-width: 100%;}
	@media only screen and (max-width: 599px) {.giftcard {width: 50%;} }
.imgresp {max-width: 100%; margin: 0px 0px 10px 0px;}

.left {
		width: 35%;
		background-color: white;
	border-top: 2px solid #e8e8e8;
	border-right: 2px solid #e8e8e8;
	border-bottom: 2px solid #e8e8e8;
	border-left: 2px solid #e8e8e8;
	padding: 15px 20px 15px 25px;
	margin: 0px;
	min-height: 600px;
	}

.banner {margin: 5px 0px;}

@media only screen and (max-width: 768px) {.left {display: none;} }

article {margin-bottom: 15px;}

article > p > i {margin: 3px 7px 10px 0px; float: left; font-size: 30px!important;}

.lock {margin: 3px 0px 20px 0px; float: left; font-size: 30px!important;}
.secure {margin: 3px 10px 0px 0px; float: left; font-size: 30px!important; }
.hundredpercent {max-width: 560px; margin: 0 auto; padding: 0px; letter-spacing: -1px; text-align: center;}
@media only screen and (max-width: 599px) {
	.secure {margin: 0px;}
	.hundredpercent { width: 100%; padding: 0px 7px; margin: 0px;}
	.hundredpercent > i {display: none;}
}

.right {
		width: 65%;
	padding: 0px;
	margin-left: 7px;
	min-height: 600px;
}
.account {
	width: 97%;
	background-color: white;
	border: 2px solid #e8e8e8;
	padding: 15px 7px 7px 7px;
	margin-bottom: 10px;
}
.plan {
	width: 97%;
	background-color: white;
	border: 2px solid #e8e8e8;
	padding: 15px 5px 7px 9px;
	margin-bottom: 10px;
}

@media only screen and (max-width: 599px) {
	.plan {padding: 15px 3px 7px 3px;}
	.btn {margin: 0 auto; width: 100%;}
}
.payment {
	width: 97%;
	background-color: white;
	border: 2px solid #e8e8e8;
	padding: 15px 5px 7px 9px;
	margin: 0px;
}

.register {padding: 0px 5px 7px 9px; margin: 0px;text-align: center; width: 97%;}
.submit {
	width: 97%;
	background-color: #336699;
	border: 2px solid #003366;
	padding: 15px 5px 15px 9px;
	margin: 10px 0px;
	font-family: 'Oswald', sans-serif;
	color: #fff;
	font-weight: 300;
	font-size: 25px;
	line-height: 24px;
	white-space: normal;
}

form {margin: 0px; padding: 0px; display: inline;}

.submit:hover {
	background-color: #003366;
}

@media only screen and (max-width: 768px) {
		.container { flex-direction: column-reverse;}
		.left, .right { width: 100%; margin: 0px; padding: 0px; }
	.right {margin-bottom: 10px;}

}

.logobox {width: 35%; margin: 0px; padding: 0px; float: left;}
.logobox > img {max-width: 100%;}
.titlebox {width: 60%; padding-top:35px; margin-left: 7px; float: left; }

@media only screen and (max-width: 1200px) {
	.header {width: 80%;}
	.titlebox { padding-top: 0px;}
}

@media only screen and (max-width: 970px) {
	.logobox {width: 100%; text-align: center; margin: 0px; padding: 0px;}
	.titlebox{width: 100%; text-align: center; margin: 0px; padding: 0px;}
	.logobox > img {max-width: 50%;}
}

@media only screen and (max-width: 768px) {
	.logobox > img {max-width: 60%;}
}

@media only screen and (max-width: 599px) {
	.logobox > img {max-width: 85%; margin-bottom: 20px;}
}


/* Login Styles */

.form-control{background-color:#fff;background-image:none;border:1px solid #ccc;border-radius:4px;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset;color:#555;display:block;font-size:14px;height:50px!important;line-height:1.42857;padding:6px 12px;transition:border-color .15s ease-in-out 0s,box-shadow .15s ease-in-out 0;width:100%}
input{padding:10px 5px;border:2px solid #e8e8e8;margin:0 0 10px;font-family:'Open Sans Condensed',sans-serif;border-radius:0!important}
.inner-addon{position:relative}
.inner-addon .glyphicon{position:absolute;padding:17px!important;pointer-events:none}
.left-addon .glyphicon{left:0}
.right-addon .glyphicon{right:0}
.left-addon input{padding-left:35px!important}
.right-addon input{padding-right:30px!important}

/* Error Styles */
.error { font-family: 'Open Sans Condensed';  color: red; font-weight: 800; letter-spacing: 0.5px; }
.input-error { float: right; margin-top: -10px; margin-bottom: 10px; }
.cascade-error {  }
.plan-error {  }

/* Membership Plan Styles */


.plan-title{font-family:'Oswald',sans-serif; font-size:18px; letter-spacing:-.5px; line-height:18px; margin-top:12px}
.plan-title span{color:#f90}
.plandesc{display:inline-block; width:70%; margin:0; padding:0;text-align:left}
.planprice{display:inline-block;width:25%; margin:0; padding:10px 7px 0 0; text-align:right; font-family:'Oswald',sans-serif; font-size:30px; letter-spacing:-1px; font-weight:300;vertical-align:top}
.planprice sub{font-size:14px; bottom:2px; font-weight:300;}

@media only screen and (max-width: 599px) {
.plandesc{width:100%;text-align:center}
.planprice{width:100%;text-align:center; font-size: 60px; margin: 10px 0px 20px 0px; padding: 11px 0px;}
}
.funkyradio div{clear:both;overflow:hidden}
.funkyradio label{width:100%;border:1px solid #ccc;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset;font-weight:400}
.funkyradio input[type="radio"]:empty,.funkyradio input[type="checkbox"]:empty{display:none}
.funkyradio input[type="radio"]:empty ~ label,.funkyradio input[type="checkbox"]:empty ~ label{position:relative;line-height:2.5em;margin-top:7px;padding:4px 0 4px 10px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}

@media only screen and (max-width: 599px) {
	.funkyradio input[type="radio"]:empty ~ label,.funkyradio input[type="checkbox"]:empty ~ label{text-indent:0; padding:4px 0 4px 0px}

}
.funkyradio input[type="radio"]:empty ~ label:before,.funkyradio input[type="checkbox"]:empty ~ label:before{position:absolute;display:block;top:0;bottom:0;left:0;content:'';width:2.5em}
.funkyradio input[type="radio"]:hover:not(:checked) ~ label,.funkyradio input[type="checkbox"]:hover:not(:checked) ~ label{color:#333;background-color:#f0f0f0;border-color:#66afe9}
.funkyradio input[type="radio"]:checked ~ label,.funkyradio input[type="checkbox"]:checked ~ label{color:#fff;background-color:#369;border-color:#66afe9;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset,0 0 8px rgba(102,175,233,0.6);outline:0 none;transition:all .2s linear}
.funkyradio input[type="radio"]:checked ~ label:before,.funkyradio input[type="checkbox"]:checked ~ label:before{text-indent:.9em;color:#333}
.funkyradio input[type="radio"]:focus ~ label:before,.funkyradio input[type="checkbox"]:focus ~ label:before{box-shadow:0 0 0 3px #999}

/* Pricing Styles */

.payother{font-family:'Oswald',sans-serif; font-size:18px; letter-spacing:-.5px; line-height:17px; margin-top:12px}
.payotherALT{font-family:'Oswald',sans-serif; font-size:18px; letter-spacing:-.5px; line-height:19px; margin:12px 0px;}
.funkyradio2 div{overflow:hidden; width: 100%; }
.funkyradio2 .option {width: 48%; float: left; margin: 0px 0px 0px 5px; padding: 0px;}
.funkyradio2 .option2 {width: 48%; float: left; margin: 0px 0px 0px 5px; padding: 0px;}
.funkyradio2 label{ border:1px solid #ccc;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset;font-weight:400; }
.funkyradio2 input[type="radio"]:empty,.funkyradio2 input[type="checkbox"]:empty{display:none}
.funkyradio2 input[type="radio"]:empty ~ label,.funkyradio2 input[type="checkbox"]:empty ~ label{width: 100%; text-align: center; position:relative;line-height:2.5em;margin-top:7px;padding:7px 0px 7px 0px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}

@media only screen and (max-width: 599px) {
.funkyradio2 input[type="radio"]:empty ~ label,.funkyradio2 input[type="checkbox"]:empty ~ label{text-indent:0; padding:15px 0 15px 0px}
.funkyradio2 .option {width: 100%; float: left; margin: 0px; padding: 0px;}
.funkyradio2 .option2 {width: 100%; float: left; margin: 0px; padding: 0px;}
}

.funkyradio2 input[type="radio"]:empty ~ label:before,.funkyradio2 input[type="checkbox"]:empty ~ label:before{position:absolute;display:block;top:0;bottom:0;left:0;content:'';width:2.5em}
.funkyradio2 input[type="radio"]:hover:not(:checked) ~ label,.funkyradio2 input[type="checkbox"]:hover:not(:checked) ~ label{color:#333;background-color:#f0f0f0;border-color:#66afe9}
.funkyradio2 input[type="radio"]:checked ~ label,.funkyradio2 input[type="checkbox"]:checked ~ label{color:#fff;background-color:#369;border-color:#66afe9;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset,0 0 8px rgba(102,175,233,0.6);outline:0 none;transition:all .2s linear;}
.funkyradio2 input[type="radio"]:checked ~ label:before,.funkyradio2 input[type="checkbox"]:checked ~ label:before{text-indent:.9em;color:#333;}
.funkyradio2 input[type="radio"]:focus ~ label:before,.funkyradio2 input[type="checkbox"]:focus ~ label:before{box-shadow:0 0 0 3px #999;}

.cc-style {width: 90%; color: #669999; padding: 0px; margin: 0px 0px 7px 0px;}
.promotional {width: 65%; text-align: center;font-family:'Oswald',sans-serif; font-weight: 300!important; font-size:12px; color: #999; letter-spacing: -0.5px; margin: 0 auto; padding: 0px;}

@media only screen and (max-width: 599px) {
	.promotional {width: 100%;}
}


/* Bundle Style */
.funkyradio3 div{clear:both;overflow:hidden}
.funkyradio3 label{width:100%;border:1px solid #f90;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset;font-weight:400}
.funkyradio3 input[type="radio"]:empty,.funkyradio3 input[type="checkbox"]:empty{display:none}
.funkyradio3 input[type="radio"]:empty ~ label,.funkyradio3 input[type="checkbox"]:empty ~ label{position:relative;line-height:2.5em;margin-top:7px;padding:4px 0 4px 10px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}

@media only screen and (max-width: 599px) {
	.funkyradio input[type="radio"]:empty ~ label,.funkyradio3 input[type="checkbox"]:empty ~ label{text-indent:0; padding:4px 0 4px 0px}

}
.funkyradio3 input[type="radio"]:empty ~ label:before,.funkyradio3 input[type="checkbox"]:empty ~ label:before{position:absolute;display:block;top:0;bottom:0;left:0;content:'';width:2.5em}
.funkyradio3 input[type="radio"]:hover:not(:checked) ~ label,.funkyradio3 input[type="checkbox"]:hover:not(:checked) ~ label{color:#333;background-color:#f0f0f0;border-color:#66afe9}
.funkyradio3 input[type="radio"]:checked ~ label,.funkyradio3 input[type="checkbox"]:checked ~ label{color:#fff;background-color:#369;border-color:#66afe9;box-shadow:0 1px 1px rgba(0,0,0,0.075) inset,0 0 8px rgba(102,175,233,0.6);outline:0 none;transition:all .2s linear}
.funkyradio3 input[type="radio"]:checked ~ label:before,.funkyradio3 input[type="checkbox"]:checked ~ label:before{text-indent:.9em;color:#333}
.funkyradio3 input[type="radio"]:focus ~ label:before,.funkyradio3 input[type="checkbox"]:focus ~ label:before{box-shadow:0 0 0 3px #999}

#coupon_code { width: 100%; text-transform: uppercase; }
#apply_coupon { margin: 5px auto; padding: 10px; background: #369; color: #eee; font-weight: bold; text-transform: uppercase; }


footer {width: 85%; font-family:'Open Sans Condensed',sans-serif; font-size: 14px;
	    line-height: 18px; text-align: center; padding: 20px; margin: 10px auto;}

div.bounce-overlay {
    display          : none;
    position         : fixed;
    left             : 0;
    top              : 0;
    z-index          : 444;
    width            : 100%;
    height           : 200%;
    min-height       :  100%;
    text-align       : center;
    overflow         : hidden;
    background-color : hsla(0, 0%, 0%, 0.9);
}
a.bounce-overlay-graphic {
    display   : block;
    cursor    : pointer;
    max-width : 80%;
    margin    : 20% auto 0;
}
a.bounce-overlay-graphic img {
    width : 100%;
}
a.bounce-overlay-close {
    display         : none;
    position        : absolute;
    top             : 1%;
    right           : 5%;
    z-index         : 9999;
    width           : 40px;
    height          : 40px;
    line-height     : 40px;
    font-size       : 25px;
    text-decoration : none;
    color           : #666;
    padding         : 2px 10px;
    background      : #292929;
}

a.bounce-overlay-close:hover {
    background : #ccc;
}

@media (min-width : 1400px) {
    a.bounce-overlay-graphic {
        margin-top : 5%;
        max-width  : 800px;
}
}