/*
 *  * Author: Carlos Alvarez
 *   * URL: http://alvarez.is
 *    *
 *     * Project Name: Onassis - Free Bootstrap 3 Theme
 *      * Version: 1.0
 *       * URL: http://blacktie.co
 *        */

body {
  background-color: #f2f2f2;
    font-family: "Lato";
    font-weight: 300;
    font-size: 16px;
    color: #555;

    -webkit-font-smoothing: antialiased;
    -webkit-overflow-scrolling: touch;
}

/* Titles */
h1, h2, h3, h4, h5, h6 {
    font-family: "Raleway";
    font-weight: 300;
    color: #333;
}


/* Paragraph & Typographic */
p {
    line-height: 28px;
    margin-bottom: 25px;
}

.centered {
    text-align: center;
}

/* Links */
a {
    color: #f85c37;
    word-wrap: break-word;

    -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
    -moz-transition: color 0.1s ease-in, background 0.1s ease-in;
    -ms-transition: color 0.1s ease-in, background 0.1s ease-in;
    -o-transition: color 0.1s ease-in, background 0.1s ease-in;
    transition: color 0.1s ease-in, background 0.1s ease-in;
}

a:hover,
a:focus {
    color: #7b7b7b;
    text-decoration: none;
    outline: 0;
}

a:before,
a:after {
    -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
    -moz-transition: color 0.1s ease-in, background 0.1s ease-in;
    -ms-transition: color 0.1s ease-in, background 0.1s ease-in;
    -o-transition: color 0.1s ease-in, background 0.1s ease-in;
    transition: color 0.1s ease-in, background 0.1s ease-in;
}

a.less-prominent {
	color: #666666;
}
 hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

#strappingHeroSlider{
	position:absolute;
	top:0;
}


#headerwrap1{
	position:relative;
}

#headerwrap1 .container{
	position: absolute;
	width: 100%;
	margin: 0 auto;
	max-width: none;
	bottom: 20px;
}

#headerwrap1 h1, #headerwrap1 h3{
	text-shadow: 0 0 40px rgba(0,0,0,.3);
}

#headerwrap1 h1{
	margin: 0;
	padding-top: 130px;
}

@media screen and (max-height: 500px) {

	#headerwrap1 h1{
		padding-top: 60px;
		font-size:90px;
	}
	#headerwrap1 h3{
		font-size:26px;
	}

}

/* ==========================================================================
 *    Wrap Sections
 *       ========================================================================== */
@media screen and (min-width: 480px) {
	#headerwrap1 {
	/*background: url(../img/shirtless_model_low.jpg) no-repeat center top;*/
	background-attachment: relative;
	background-position: center center;
	/*height:100%;*/
	width: 100%;
	padding-top:100px;
	text-align:center;
	-webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

#headerwrap2 {
	background: url(../img/tank_underwear_low.jpg) no-repeat center top;
	padding-top:100px;
	text-align:center;
	background-attachment: relative;
	background-position: center center;
	min-height: 800px;
	width: 100%;
	
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

#headerwrap3 {
	background: url(../img/underwearbed_low.jpg) no-repeat center top;
	background-attachment: relative;
	background-position: center center;
	min-height: 800px;
	width: 100%;
	padding-top:100px;
	text-align:center;
	-webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#headerwrap4 {
	background: url(../img/white_tank.jpg) no-repeat center top;
	background-attachment: relative;
	background-position: center center;
	min-height: 800px;
	width: 100%;
	padding-top:100px;
	text-align:center;
	-webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#headerwrap_bottoms {
	background: url(../img/bottoms_low.jpg) no-repeat center top;
	background-attachment: relative;
	background-position: center center;
	min-height: 800px;
	width: 100%;
	padding-top:100px;
	text-align:center;
	-webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#headerwrap_accessories {
	background: url(../img/green_jacket.jpg) no-repeat center top;
	background-attachment: relative;
	background-position: center center;
	min-height: 800px;
	width: 100%;
	padding-top:100px;
	text-align:center;
	-webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#headerwrap5 {
	background: url(../img/teamm8_bathing.jpg) no-repeat center top;
	background-attachment: relative;
	background-position: center center;
	min-height: 800px;
	width: 100%;
	padding-top:100px;
	text-align:center;
	-webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#headerwrap6 {
	background: url(../img/cosmetics_low.jpg) no-repeat center top;
	background-attachment: relative;
	background-position: center center;
	min-height: 800px;
	width: 100%;
	padding-top:100px;
	text-align:center;
	-webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

}





.headerwrap h1 {
	margin-top: 130px;
	color: white;
	font-size: 140px;
	font-weight: 700;
	letter-spacing: 3px;
}

#headerwrap2 h1 {
	margin-top: 130px;
	color: white;
	font-size: 140px;
	font-weight: 700;
	letter-spacing: 3px;
}

.headerwrap h2 {
	color: white;
	font-size: 80px;
	font-weight: 100;
	letter-spacing: 2px;
	margin:0;
}
.headerwrap h3 {
	color: white;
	font-size: 40px;
	font-weight: 100;
	letter-spacing: 2px;
	margin:0;
}

#straight-fashion-banner {
	margin:0;
	padding-top: 100px;
}

.white_content {
    text-align: center;
    position: fixed;
    top: 25%;
    left: 25%;
    width: 50%;
    height: 50%;
    min-height: 450px;
    padding: 16px;
    background-image:
    linear-gradient(
      to bottom, 
      rgba(235, 112, 0, .97), rgba(152, 54, 0, .97)
    );
    z-index:11;
    overflow: hidden;
    border-radius: 3px;
    color: white;
    border: 1px solid #562412;
}

a.glyphicon-chevron-down {
    font-size: 2.8em;
}


.customer-img {
	width: 75%;
}
.form-legend {
	margin-top:	30px;
	font-size: 14px;
	font-style: italic;
}
.answer {
	display:none;
}
.arrow {
	font-size: 12px;
}
.question a:hover h3{
	color: #808080;
}
.fundlogo {
	max-width: 250px;
	text-align: center;
	padding: 20px 50px 20px 50px;
}
#fbofferactivation {
		font-size: 170%;
}
#shadow {
	background:rgba(0,0,0,0.7);
	width:100%;
	height:100%;
	z-index: 10;	
	position: fixed;
	top:0;
	left: 0;
}

.white_content h2 {
	color: white;
}
.white_content p {
	margin-bottom: 15px;
}
#invite-splash-textbox {
	width: 130px;
	margin-right: 10px;
}
#email-splash-textbox {
	width: 260px;
	margin-right: 10px;
}
#email-thanks {
	display: none;
}
.splash-form {
	display: inline-block;
	text-align: center;
}
.splash-form-btn {
	background-color: rgba(126,45,0,1);
	color: white;
}
.inline-form-el {
	display:inline;
	width:100px;
}
.cc-num {
	width:210px;
}
.cvc-form-el {
	width: 80px;
}
#getstarted {
	padding: 20px 40px;
	border: 1px solid #e6e4e6;
	background-color: #f0f6f5;
	border-radius: 6px;
}
#signupform {
	text-align: left;
}
#whatitcosts {
	background: #f0f6f5;
	border-radius: 3px;
	border: 1px solid #e6e4e6;
}
#invite-code-button {
	background: rgba(253,201,56, 0.3);
}
#faqs {
	background: #e0e0e0;
	border-radius: 3px;
	border: 1px solid #e6e4e6;
	text-align: center;
}

#mens #brand-slider {
  background: #000;
  padding: 15px 0;
}

/* line 580, main.scss */
#mens #brand-slider .slides li {
  margin-right: 20px;
}
/* line 585, main.scss */
#mens #brand-slider img {
  width: auto;
  margin: 0 auto;
}

#mens .wrapper {
  width: 90%;
  max-width: 1100px;
  margin: 0 auto;
  clear: both;
}

#mens h1, #mens h2, #mens h3, #mens h4, #mens h5, #mens h6, #mens p, #mens ul, #mens ol {
  margin-top: 0;
  margin-bottom: 0;
  padding-bottom: 8px;
  padding-top: 8px;
}

#mens #brand-slider .slides li {
  margin-right: 20px;
}

#amount-charged-today
{
	text-align: right;
	float: right;
	width: 50%;
}
#what-charged-today
{
	float: left;
	width: 50%;
}

.bounce {
	-webkit-animation-name: bounce;
	-moz-animation-name: bounce;
	-o-animation-name: bounce;
	animation-name: bounce;
}
.animated{-webkit-animation-fill-mode:both;
-moz-animation-fill-mode:both;
-ms-animation-fill-mode:both;
-o-animation-fill-mode:both;
 
            animation-iteration-count: infinite;
       -moz-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
 
animation-fill-mode:both;
-webkit-animation-duration:2s;
-moz-animation-duration:2s;
-ms-animation-duration:2s;
-o-animation-duration:2s;
animation-duration:2s;
}
 
 
@-webkit-keyframes bounce {
	0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);}	40% {-webkit-transform: translateY(-30px);}
	60% {-webkit-transform: translateY(-15px);}
}
 
@-moz-keyframes bounce {
	0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);}
	40% {-moz-transform: translateY(-30px);}
	60% {-moz-transform: translateY(-15px);}
}
 
@-o-keyframes bounce {
	0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);}
	40% {-o-transform: translateY(-30px);}
	60% {-o-transform: translateY(-15px);}
}
@keyframes bounce {
	0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
	40% {transform: translateY(-30px);}
	60% {transform: translateY(-15px);}
}

#get-started-title {
	text-align: center;
}
#payment-info {
	background: #d8f3ee;
	border-radius: 3px;
	border: 1px solid #73c4b5;
	padding: 5px;
	margin-bottom: 20px;
}
#order-summary {
	background: #d8f3ee;
	border-radius: 3px;
	border: 1px solid #73c4b5;
	padding: 5px;
	margin-bottom: 20px;
}

#coupon-code {
	background: #d8f3ee;
	border-radius: 3px;
	border: 1px solid #73c4b5;
	padding: 5px;
	margin-bottom: 20px;
}

.clearfix:after { 
   content: " ";
   display: block; 
   height: 0; 
   clear: both;
}

#padlock {
	float: left;
	background: url(../img/padlock.png);
	width:48px;
	height: 48px;
}
#signup-button {
	text-align: center;
	margin-bottom: 20px;
}
#secure-payment-title {

}
#siteseal {
	float: right;
}
#security-icons {
	height:50px;
}

.arrowcontainer {
	position:relative;
	width: 100%;
	height:100%;
}
.payment-errors
{
	color: red;
}

.header-banner {
    background-color: rgba(0, 0, 0, 0.4);
	padding-top:30px;
	height:100%;
	width:100%;
}

.header-banner.special{
	
}

.flex-direction-nav{
	display:none;
}

.flexslider{
	background: black !important;
	text-align: center;
}
.flexslider .slides{
	text-align: center;
}
.flexslider .slides img{
	width:auto !important;
}

#member-login {
	position: fixed;
	top:2%;
	left: 90%;
	opacity: .6;
}
#signup-cta-button {
	display: block;
	margin: 0 auto;
}
input.invalid {
      border: 2px solid red;
}

.validation.failed:after {
      color: red;
      content: 'Validation failed';
}
.validation.passed:after {
      color: green;
      content: 'Validation passed';
}
@media screen and (max-width: 768px) and (min-width: 480px) {

	.white_content 	{
		height: 500px;
		width: 500px;
		top: 5%;
    left: 5%;
    min-height: 450px;
    padding: 5px;
	}
	#member-login {
	left: 80%;
	}
}

@media screen and (max-width: 1200px) and (min-width: 768px) {

	#member-login {
	left: 85%;
	}
	.white_content 	{
		height: 50%;
		width: 70%;
		top: 25%;
    left: 15%;
    padding: 5px;
	}
}

/* mobile shit */
@media screen and (max-width: 480px) {
	.header-banner{
		padding-left:25px;
		padding-right:25px;
		text-align: center;
	}
	#headerwrap1 h1{
		font-size:42px;
		text-align: center;
		display:block;
		padding-left:20px;
		padding-right:20px;
	}
	#headerwrap1 h3{
		font-size:22px;
		text-align: center;
		display:block;
		padding-left:20px;
		padding-right:20px;
	}

	#member-login {
	left: 70%;
	}

	h2 {
		margin-top: 0 !important;
		padding-top: 10px;
	}
	#order-summary h3 {
		font-size: 18px;
		font-weight: bold;
	}

	.white_content h2 {
		font-size: 14px;
	}
	p {
		font-size: 14px;
	}
	.w h3 {
	margin-top: 0 !important;
	padding-top: 10px;
	font-weight: 500;
	color: #7b7b7b;
	letter-spacing: 1px;
}
	.headerwrap {
		background-size: 100%;
	}
	#headerwrap1 {
	background: url(../img/shirtless_model_mobile.jpg) no-repeat center top;
background-attachment: relative;
background-size: cover;
-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    max-width: 480px;
}

#headerwrap2 {
	background: url(../img/tank_underwear_mobile.jpg) no-repeat center top;
	background-size: cover;
}

#headerwrap3 {
	background: url(../img/underwearbed_mobile.jpg) no-repeat center top;
	background-size: cover;
}

#headerwrap4 {
	background: url(../img/white_tank.jpg) no-repeat center top;
	background-size: cover;
}

#headerwrap5 {
	background: url(../img/teamm8_bathing.jpg) no-repeat center top;
	background-size: cover;
}

#headerwrap6 {
	background: url(../img/cosmetics_mobile.jpg) no-repeat center top;
	background-size: cover;
}

#headerwrap_bottoms {
	background: url(../img/bottoms_mobile.jpg) no-repeat center top;
	background-size: cover;
}
#headerwrap_accessories {
	background: url(../img/green_jacket.jpg) no-repeat center top;
	background-size: cover;
}
.headerwrap h1 {
	margin-top: 130px;
	color: white;
	font-size: 40px;
	font-weight: 4070;
	letter-spacing: 3px;
}

#headerwrap2 h1 {
	margin-top: 130px;
	color: white;
	font-size: 40px;
	font-weight: 700;
	letter-spacing: 3px;
}

.headerwrap h2 {
	color: white;
	font-size: 30px;
	font-weight: 100;
	letter-spacing: 2px;
}
.headerwrap h3 {
	color: white;
	font-size: 20px;
	font-weight: 100;
	letter-spacing: 2px;
}

.white_content {
    text-align: center;
    position: fixed;
    top: 5%;
    left: 5%;
    width: 90%;
    min-height: 480px;
    padding: 16px;
    background-image:
    linear-gradient(
      to bottom, 
      rgba(235, 112, 0, .88), rgba(152, 54, 0, .88)
    );
    z-index:11;
    overflow: hidden;
    border-radius: 3px;
    color: white;
    border: 1px solid #562412;
}

a.glyphicon-chevron-down {
    font-size: 1.8em;
}

}

/* Portfolio Wrap */
#portfoliowrap {
	background: url(../img/portfolio-bg.jpg) no-repeat center top;
	margin-top: 0px;
	padding-top:70px;
	text-align:center;
	background-attachment: relative;
	background-position: center center;
	min-height: 500px;
	width: 100%;
	
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}


#portfoliowrap h3 {
	color: #ffffff;
}

.port-space {
	padding-bottom: 20px;
}


/* White Wrap */

.w {
	background: #ffffff;
	padding-top: 35px;
	padding-bottom: 35px;
	text-align: center;
}

.w h3 {
	font-weight: 700;
	color: #7b7b7b;
	letter-spacing: 1px;
}

.w bold {
	color: #2f2f2f;
}


/* Grey Wrap */

.g {
	background: #f2f2f2;
	padding-top: 35px;
	padding-bottom: 35px;
	text-align: center;
}
.g2 {
	background: #f2f2f2;
	padding-top: 35px;
	padding-bottom: 35px;
}

/* Dark Grey Wrap */
#dg {
	background: #e0e0e0;
	padding-top: 70px;
	padding-bottom: 70px;
	text-align: center;
}

.la h3 {
	text-align: left;
	line-height: 140%;
}
.la h4 {
	text-align: left;
	line-height: 140%;
	font-size: 125%;
}
/* Footer Wrap */

#f {
	background: #2f2f2f;
	padding-top: 70px;
	padding-bottom: 70px;
	text-align: center
}

#f h3 {
	color: white;	
}

#f i {
	font-size: 26px;
	color: white;
	padding-left: 10px;
	padding-right: 10px;
}

/* Copyright Wrap */

#c {
	background: #222222;
	padding-top: 15px;
	text-align: right;
}

#c p {
	color: white
}

#h {
	background: #222222;
	padding-top: 15px;
	text-align: left;
}

#h p {
	color: white
}

#h a {
	color: white;
	font-size: 200%;
	font-weight: bold;
}


/* item Wrap */

#itemwrap {
	background: url(../img/item-bg.jpg) no-repeat center top;
	margin-top: 0px;
	padding-top:70px;
	text-align:center;
	background-attachment: relative;
	background-position: center center;
	min-height: 500px;
	width: 100%;
	
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

#itemwrap h1 {
	margin-top: 40px;
	color: white;
	font-size: 100px;
	font-weight: 700;
	letter-spacing: 3px;
}

#itemwrap h2 {
	color: white;
	font-size: 50px;
	font-weight: 100;
	letter-spacing: 2px;
}


.desc {
	text-align: left;
}

.desc-b {
	border-left: 4px solid #bababa;
}

.desc-a i {
	color: #555;
	padding-right: 8px;
}

.desc-b i {
	color: #555;
	padding-right: 8px;
}



/* MENU CONF*/

.menu {
	position: fixed;
	right: -200px;
	width: 260px;
	height: 100%;
	top: 0;
	z-index: 10;
	text-align: left;
}

.menu.menu-open {
	right: 0px;
}

.menu-wrap {
	position: absolute;
	top: 0;
	left: 60px;
	background: #1a1a1a;
	width: 200px;
	height: 100%;
}

.menu h1.logo a {
	font-family: 'Raleway', Helvetica, Arial, sans-serif;
	font-size: 16px;
	font-weight: 800;
	letter-spacing: 0.15em;
	line-height: 40px;
	text-transform: uppercase;
	color: #ffffff;
	margin-top: 20px;
}

.menu h1.logo a:hover {
	color: #f85c37;
}

.menu img.logo {
	margin: 20px 0;
	max-width: 160px;
}

.menu a {
	margin-left: 20px;
	color: #808080;
	display: block;
	font-size: 12px;
	font-weight: 700;
	line-height: 40px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.menu a:hover {
	color: #ffffff;
}

.menu a:active {
	color: #ffffff;
}

.menu a > i {
	float: left;
	display: inline-block;
	vertical-align: middle; 
	text-align: left;
	width: 25px;
	font-size: 14px;
	line-height: 40px;
	margin: 25px 2px;
}

.menu-close {
	cursor: pointer;
	display: block;
	position: absolute;
	font-size: 14px;
	color: #808080;
	width: 40px;
	height: 40px;
	line-height: 40px;
	top: 20px;
	right: 5px;
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}

.menu-close:hover {
	color: #ffffff;
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}

/* Push the body after clicking the menu button */
.body-push {
	overflow-x: hidden;
	position: relative;
	left: 0;
}

.body-push-toright {
	left: 200px;
}

.body-push-toleft {
	left: -200px;
}

.menu,
.body-push {
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
		-ms-transition: all .3s ease;
		 -o-transition: all .3s ease;
			transition: all .3s ease;
}

#menuToggle {
	position: absolute;
	top: 20px;
	left: 0;
	z-index: 11;
	display: block;
	text-align: center;
	font-size: 14px;
	color: #ffffff;
	width: 40px;
	height: 40px;
	line-height: 40px;
	cursor: pointer;
	background: rgba(0,0,0,0.25);
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}

#menuToggle:hover {
	color: #ffffff;
	background: rgba(0,0,0,0.2);
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}


/* BUTTON CONF */

.btn-theme {
	color: #fff;
	background-color: #1abc9c;
	padding-left: 40px;
	padding-right: 40px;
	padding-bottom: 10px;
	padding-top: 10px;
	font-weight: 700;
	border-radius: 3px;
}

.btn-theme:hover {
	cursor: pointer;
	color: white;
	background-color: #16a085;
	
}

/* TEAM CONF */

.team {
	padding-top: 20px;
}

.team:hover {
	background: white;
}

.team a {
	padding-right: 10px;
	padding-left: 10px;
}
