html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
a{outline: 0;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}
.clear{clear:both ;overflow:hidden; height:0px; font-size:0px; display: block;}
input:focus, select:focus, textarea:focus, button:focus {outline: none;}
input, textarea, select{font-family: 'Nunito', sans-serif; font-weight: 300; -webkit-appearance: none; appearance: none; -moz-appearance: none; border-radius: 0;}
a{cursor: pointer; text-decoration: none; border: none;}
body{background: #eeede9; font-family: 'Nunito', sans-serif; font-weight: 300; font-size: 14px;}
#content-block *:last-child{margin-bottom: 0;}
input[type="submit"]{position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: none; background: none; padding: 0; opacity: 0; cursor: pointer;}

/* ===============
   GLOBAL SETTINGS 
   =============== */
#content-block{position: relative; overflow: hidden; padding-top: 90px; right: 0; max-width: 900px; margin: 0 auto;}
.app-container{padding-bottom: 55px;}
header .close-menu-layer{position: fixed; display: none;}
.box-size{position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
/*buttons*/
.button{font-family: 'copperplate', sans-serif; font-weight: normal; font-style: normal; display: block; text-align: center; text-transform: uppercase; padding: 15px 40px; line-height: 24px; font-size: 22px; margin-bottom: 32px; position: relative;}
.button.type-1{color: #fff; background: #202020;}
.button.type-1:hover{background: #9b9482; color: #f3eedb;}
.button.type-2{color: #fff; background: #77b354;}
.button.type-2:hover{background: #9b9482; color: #f3eedb;}
.button.type-3{font-size: 16px; line-height: 16px; border: 2px #1d1d1d solid; padding-left: 20px; padding-right: 20px;}
.button.type-3:hover{background: #fff;}
/*direction buttons*/
.buttons-wrapper{margin-bottom: 32px; position: relative; margin-top: 55px;}
.submit-wrapper{padding-top: 55px;}
.direction-button{line-height: 44px; background: #75b44c; color: #fff; font-size: 22px; text-transform: uppercase; font-family: 'copperplate', sans-serif; padding: 0 20px; width: 180px; position: relative;}
.direction-button:hover{background: #9b9482; color: #f3eedb;}
.direction-button:active{background: #000; color: #fff;}
.direction-button.prev{float: left; text-align: right;}
.direction-button.prev:before{content: "<"; position: absolute; line-height: 44px; top: 0; left: 20px;}
.direction-button.next{float: right;}
.direction-button.next:after{content: ">"; position: absolute; line-height: 44px; top: 0; right: 20px;}
.buttons-wrapper.disabled-left .prev{background: #9a9a9a; opacity: 0.5;}
.buttons-wrapper.disabled-left:before{width: 50%; height: 100%; content: ""; position: absolute; z-index: 1; left: 0; top: 0;}
.buttons-wrapper.disabled-right .next{background: #9a9a9a; opacity: 0.5;}
.buttons-wrapper.disabled-right:after{width: 50%; height: 100%; content: ""; position: absolute; z-index: 1; right: 0; top: 0;}
/*table view*/
.table-view{display: table; width: 100%; height: 100%;}
.row-view{display: table-row;}
.cell-view{display: table-cell; vertical-align: middle;}
/*checkboxes, radio buttons*/
.checkbox-entry{position: relative; margin-bottom: 10px;}
.checkbox-entry input{position: absolute; left: -30px; display: none;}
.checkbox-entry label{font-size: 18px; color: #000; line-height: 18px; display: block; padding: 4px 0 4px 38px; position: relative; cursor: pointer;}
.checkbox-entry label:before{position: absolute; content: ""; width: 22px; height: 22px; border: 2px #1d1d1d solid; left: 0px; top: 0; background: #fff;}
.checkbox-entry label:after{content: ""; width: 0px; height: 0px; left: 12px; top: 12px; background: #1d1d1d; position: absolute;}
.checkbox-entry.active label:after{content: ""; width: 14px; height: 14px; left: 6px; top: 6px;}
.checkbox-entry label a{color: #9b9583;}
.checkbox-entry label a:hover{text-decoration: underline;}
.application-container{max-width: 900px; margin: 0 auto;}
.app-grid{padding-left: 20px; padding-right: 20px; max-width: 610px; margin: 0 auto; position: relative;}
.app-grid-colours{padding-left: 15px; padding-right: 15px; max-width: 620px; margin: 0 auto;}
/*fields, textarea*/
.field-entry{margin-bottom: 10px; text-align: left; position: relative;}
.field-entry label, .ruler-entry label{font-size: 18px; color: #000; line-height: 18px; padding: 4px 0; display: block;}
.field-entry input, .field-entry textarea, .field-entry .select-wrapper, .fabric-column input, .order-summary-numbers-box .data .right input{width: 100%; border: 2px #1d1d1d solid; height: 48px; line-height: 48px; padding: 0 10px; font-size: 21px; color: #000; background: #fff;}
/*.field-entry input[type="file"]{position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0;}*/
.field-entry textarea{line-height: 22px; padding-top: 5px; padding-bottom: 5px; height: 96px;}
.field-entry .select-wrapper{overflow: hidden; position: relative;}
.field-entry .select-wrapper:before{width: 2px; height: 16px; background: #1d1d1d; position: absolute; content: ""; top: 50%; margin-top: -8px; right: 19px;}
.field-entry .select-wrapper:after{height: 2px; width: 16px; background: #1d1d1d; position: absolute; content: ""; top: 50%; margin-top: -1px; right: 12px;}
.field-entry select{border: none; background: none; margin: 0; width: 100%; height: 100%; position: absolute; left: 0px; padding: 0 40px 0 10px; font-size: 21px; z-index: 1;}
.field-entry .description{font-size: 18px; color: #909090; text-align: center; display: block; line-height: 18px; padding: 6px 0; text-transform: uppercase; font-weight: 400;}
.tailor-it-box input, .tailor-it-box .select-wrapper{background: none;}
/*invalid fields style*/
.field-entry.invalid input, .field-entry.invalid textarea, .field-entry.invalid .select-wrapper, .checkbox-entry.invalid label:before, .ruler-entry.invalid .ruler-data input, .ruler-entry.invalid .ruler{border-color: rgba(255, 0, 0, 0.5);}
label span{font-size: 80%; color: rgba(255, 0, 0, 1); display: none;}
.invalid label span{display: inline;}
/*field columns*/
.field-columns .field-entry{width: 50%; float: right; padding-left: 7px;}
.field-columns .field-entry:first-child{float: left; padding-left: 0; padding-right: 7px;}
.field-columns-level-2 .field-columns{width: 48%; float: right; padding-left: 7px;}
.field-columns-level-2 .field-columns:first-child{float: left; padding-left: 0; padding-right: 7px;}
.field-columns-level-2 input, .field-columns-level-2 select{text-align: center;}
/*page title*/
.page-title{text-align: center; overflow: hidden; font-size: 42px; line-height: 42px; color: #212121; font-family: 'copperplate', sans-serif; font-weight: normal; text-transform: uppercase; margin-bottom: 20px; padding: 0 30px; margin-bottom: 32px; padding-top: 55px;}
.page-title .title{position: relative; display: inline-block;}
.page-title .title:before, .page-title .title:after{background: #212121; height: 2px; width: 500px; top: 50%; margin-top: -1px; right: 100%; content: ""; margin-right: 15px; position: absolute;}
.page-title .title:after{right: auto; left: 100%; margin-left: 0; margin-left: 15px;}
/*horizontal line*/
.line{height: 1px; background: url(../img/line-separator.png);}
/*forgot password link*/
.forgot-password{float: right; line-height: 26px; font-size: 18px; margin-bottom: 10px; text-decoration: underline; color:#1d1d1d;}
.forgot-password:hover{text-decoration: none;}
/*align center*/
.align-center{text-align: center;}
/*lazy load*/
.lazy-load{opacity: 0;}
.lazy-load.loaded{opacity: 1;}

/*iPad*/
/*@media only screen and (max-width: 980px) {*/
#content-block{padding-top: 90px; -moz-transition:all 500ms ease-out; -o-transition:all 500ms ease-out; -webkit-transition:all 500ms ease-out; -transition:all 500ms ease-out; -ms-transition:all 500ms ease-out;}
/*}*/
/*other devices*/
@media only screen and (max-width: 760px) {

}
/*iPhone*/
@media only screen and (max-width: 480px) {
    #content-block{padding-top: 65px;}
    #content-block .button{padding-left: 10px; padding-right: 10px;}
    .app-grid{padding-left: 10px; padding-right: 10px;}
    .app-grid-colours{padding-left: 7px; padding-right: 7px;}
    /**/
    .button{font-size: 16px; line-height: 18px; margin-bottom: 20px;}
    .buttons-wrapper{margin-top: 30px;}
    .submit-wrapper{padding-top: 20px;}
    .field-entry label, .ruler-entry label{font-size: 16px;}
    .forgot-password{font-size: 16px;}
    .checkbox-entry label{font-size: 16px;}
    .page-title{font-size: 32px; line-height: 32px; padding-top: 20px; margin-bottom: 15px;}
    .app-container{padding-bottom: 30px;}
    .direction-button{font-size: 16px; width: 120px; padding: 0 10px;}
    .direction-button.next:after{right: 10px;}
    .direction-button.prev:before{left: 10px;}
    .field-entry .description{font-size: 14px; line-height: 14px; padding: 4px 0;}
    /**/
    .field-columns .field-entry, .field-columns-level-2 .field-columns{padding-left: 3px; width: 50%;}
    .field-columns .field-entry:first-child, .field-columns-level-2 .field-columns:first-child{padding-left: 0; padding-right: 3px;}
}
@media only screen and (max-width: 400px) {
    .forgot-password{float: left; clear: both;}
}

/* ======
   LOADER 
   ====== */
.loader{background: #262626; position: fixed; z-index: 12;}
.loader img{width: 103px; height: 102px; position: absolute; left: 50%; top: 50%; margin: -51px 0 0 -51px;}

/* ======
   HEADER 
   ====== */
header{background: #202021; position: fixed; width: 100%; left: 0; top: 0; z-index: 10; height: 90px;}
#logo{position: absolute; left: 2%; top: 35px; width: 30%; min-width: 297px; max-width: 341px; z-index: 1;}
#logo img{display: block; width: 100%;}
.menu-button{width: 35px; height: 35px; background: url(../img/menu-icon.png) 0 0 no-repeat; position: absolute; right: 20px; top: 25px; display: none; z-index: 1;}
#content-block.active .menu-button{background-position: 0 -35px;}
nav{position: absolute; right: 2%; top: 35px;}
nav li{float: left; margin-left: 15px; position: relative;}
nav a{color: #bbbaaf; color: #bbbaaf; text-transform: uppercase; letter-spacing: 1px; display: block; position: relative; display: block; padding: 5px 0; font-size: 13px; line-height: 13px;}
nav a:after{position: absolute; width: 19px; height: 2px; background: url(../img/nav-hover.png); left: 50%; margin-left: -10px; bottom: -8px; content: ""; opacity: 0; z-index: 1;}
nav a:hover:after, nav a.active:after{opacity: 1;}

/*iPad*/
/*@media only screen and (max-width: 980px) {*/
header{background: url(../img/header-border.png) left 80px repeat-x #202021; font-size: 18px; line-height: 28px; font-family: 'copperplate', sans-serif;}
.responsive-wrapper{position: fixed; right: -350px; top: 0; bottom: 0; width: 350px; margin-top: 82px; background: #202021; overflow-y: auto; -webkit-overflow-scrolling: touch; -moz-overflow-scrolling: touch; -o-overflow-scrolling: touch;-ms-overflow-scrolling: touch; overflow-scrolling: touch;}
#content-block.active .responsive-wrapper{right: 0;}
#content-block.active{right: 350px;}
#content-block.active header .close-menu-layer{display: block;}
#logo{top: 35px; left: 20px;}
.menu-button{display: block;}
nav{position: relative; top: auto; right: auto;}
nav li{margin-left: 0; float: none;}
nav li a:after{height: 100%; width: 3px; right: 0; left: auto; top: 0; margin: 0; background: #575757;}
nav li a{color: #6d6b5e; font-size: 20px; line-height: 20px; text-align: left; background: url(../img/header-border.png) left bottom repeat-x; padding: 15px 30px; text-align: right;}
nav li a.active, nav li a:hover{color: #fff;}
/*}*/
/*other devices*/
@media only screen and (max-width: 760px) {

}
/*iPhone*/
@media only screen and (max-width: 480px) {
    header{height: 65px; background-position: left 58px;}
    #logo{top: 25px; left: 10px; min-width: 0; width: 250px;}
    .menu-button{right: 10px; top: 15px;}
    .responsive-wrapper{margin-top: 60px; width: 250px; right: -250px;}
    #content-block.active{right: 250px;}
    nav li a{font-size: 16px; padding: 10px 20px 10px 20px;}
}
@media only screen and (max-width: 320px) {
    #logo{top: 27px; left: 10px; min-width: 0; width: 190px;}
}

/* =========
   TAILOR IT 
   ========= */
#content-block .tailor-it-box{padding-bottom: 22px; overflow: hidden;}
.tell-us-more-box .page-title{padding-top: 32px;}
.tell-us-more-blocks{}
.tell-us-more-blocks .entry{width: 25%; float: left; text-align: center;}
.tell-us-more-blocks .entry .title{font-size: 24px; line-height: 24px; color: #000; font-family: 'copperplate', sans-serif; text-transform: uppercase; position: relative; padding-bottom: 10px; margin-bottom: 10px; text-shadow: 0 1px 0 rgba(0,0,0,0.5);}
.tell-us-more-blocks .entry .title:before{background: #9b9583; height: 2px; width: 25px; position: absolute; left: 50%; bottom: 0; margin-left: -12px; content: "";}
.tell-us-more-blocks .entry img{max-width: 100%; height: auto; margin-bottom: 5px; display: inline-block;}
.tell-us-more-blocks .entry .selection-entry{padding: 8px 0 8px 32px; position: relative; font-size: 24px; line-height: 24px; text-align: left; color: #9b9583; cursor: pointer; margin: 0 auto; width: 120px;}
.tell-us-more-blocks .entry .selection-entry.active:before, .foldable-content .swiper-slide.selected .description-mark span:before, .summary-box .description div:before{width: 22px; height: 22px; background: #222220; border-radius: 50%; position: absolute; left: 0; top: 50%; margin-top: -11px; content: "";}
.tell-us-more-blocks .entry .selection-entry.active:after, .foldable-content .swiper-slide.selected .description-mark span:after, .summary-box .description div:after{height: 3px; width: 8px; border: 1px #eeede9 solid; position: absolute; top: 50%; margin-top: -3px; left: 7px; content: ""; border-top: none; border-right: none; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg);}
.tell-us-more-blocks .entry .selection-entry.active{color: #212121;}

/*iPad*/
@media only screen and (max-width: 980px) {

}

/*other devices*/
@media only screen and (max-width: 760px) {
    .tell-us-more-blocks .entry{width: 50%;}
    .tell-us-more-blocks .entry{padding: 12px 0;}
}

/*iPhone*/
@media only screen and (max-width: 480px) {
    .tell-us-more-blocks .entry .title{font-size: 19px;}
    .tell-us-more-blocks .entry .selection-entry{font-size: 19px; padding-top: 4px; padding-bottom: 4px;}
}
@media only screen and (max-width: 320px) {

}

/* ================
   CHOOSE BODY TYPE 
   ================ */
.body-type-box{max-width: 530px; margin: 0 auto;}
.body-type-box .entry{float: left; width: 33.33%; text-align: center; margin: 22px 0; cursor: pointer;}
.body-type-box .entry img{display: inline-block; max-width: 90%; height: auto;}
.body-type-box .entry .title{font-size: 21px; color: #9b9583; line-height: 21px; padding-top: 27px; position: relative;}
.body-type-box .entry .title:before, .body-type-box .entry .title:after{height: 9px; width: 70%; position: absolute; left: 15%; top: 10px; content: ""; background: #d0cec2;}
.body-type-box .entry .title:after{background: #64a93c; width: 0; left: 50%; opacity: 0;}
.body-type-box .entry.active .title:after{width: 70%; left: 15%; opacity:1;}
.body-type-box .entry.active .title{color: #000;}
/*iPad*/
@media only screen and (max-width: 980px) {

}

/*other devices*/
@media only screen and (max-width: 760px) {

}

/*iPhone*/
@media only screen and (max-width: 480px) {

}
@media only screen and (max-width: 320px) {
    .body-type-box .entry{width: 50%;}
    .body-type-box .entry .title{font-size: 18px; line-height: 18px;}
}

/* ================
   BODY MEASURMENTS 
   ================ */
   .rulers-container{max-width: 690px; padding: 0 20px; margin: 0 auto;}
.ruler-entry{margin-bottom: 15px;}
.ruler{border: 2px #1d1d1d solid; height: 44px; line-height: 44px; position: relative; margin-right: 170px; overflow: hidden;}
.ruler-center{width: 2px; background: #1d1d1d; content: ""; position: absolute; left: 50%; margin-left: -1px; height: 100%; top: 0;}
.ruler-center:before, .ruler-center:after{width: 0; height: 0; border-style: solid; position: absolute; content: ""; left: -6px;}
.ruler-center:before{border-width: 8px 7px 0 7px; border-color: #1d1d1d transparent transparent transparent; top: 0;}
.ruler-center:after{border-width: 0 7px 8px 7px; border-color: transparent transparent #1d1d1d transparent; bottom: 0;}
.ruler-data{width: 150px; height: 48px; float: right;}
.ruler-data input{width: 65px; float: left; height: inherit; border: none; margin: 0; padding: 0; text-align: center; background: #000; font-size: 18px; line-height: 48px; color: #fff; font-weight: 400; border: 2px transparent solid;}
.youtube-link{width: 65px; float: right; height: inherit; background: #fff; border: 2px #848484 solid; position: relative;}
.youtube-link:before{width: 0; height: 0; border-style: solid; border-width: 8.5px 0 8.5px 14px; border-color: transparent transparent transparent #212121; position: absolute; left: 50%; top: 50%; content: ""; margin: -8.5px 0 0 -7px;}
.youtube-link:active{background: #9b9482;}
.youtube-link:active:before{border-left-color: #f3eedb;}
/**/
.body-measurments-inputs .field-entry{margin-right: 85px;}
.body-measurments-inputs .field-entry .youtube-link{position: absolute; bottom: 0; right: -85px; height: 48px;}
/**/
.draggable-ruler{position: relative; width: 100000px; float: left; cursor:url(../img/drag.png) 16 9, ew-resize!important; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; -o-user-select: none;}
.draggable-ruler li{width: 104px; height: 44px; float: left; background: url(../img/ruler--background-image.png) left bottom repeat-x; position: relative;}
.draggable-ruler li span{position: absolute; left: 14px; top: 7px; font-size: 18px; line-height: 18px; color: #1d1d1d; letter-spacing: 5px;}
/**/

/*iPad*/
@media only screen and (max-width: 980px) {

}

/*other devices*/
@media only screen and (max-width: 760px) {

}

/*iPhone*/
@media only screen and (max-width: 480px) {
    .rulers-container{padding-left: 10px; padding-right: 10px;}
    .ruler-data{width: 123px;}
    .youtube-link{width: 48px;}
    .ruler{margin-right: 133px;}
}
@media only screen and (max-width: 320px) {
    .body-measurments-inputs .field-entry{margin-right: 75px;}
    .body-measurments-inputs .field-entry .youtube-link{right: -75px;}
    .draggable-ruler li span{font-size: 16px; line-height: 16px; left: 15px; letter-spacing: 3px;}
    .ruler-data input{font-size: 14px; width: 48px;}
    .ruler-data{width: 106px;}
    .ruler{margin-right: 116px;}
}


/* ==============
   DESIGN A SHIRT 
   ============== */
.foldable-entry{}
.foldable-title, .shirt-size-title{font-size: 32px; color: #898370; line-height: 32px; padding-top: 14px; padding-bottom: 14px; font-family: 'copperplate', sans-serif; background: url(../img/line-separator.png) left bottom 7px repeat-x #d5d4c7; cursor: pointer;}
.foldable-title .title, .shirt-size-title .title{position: relative; padding-right: 30px; text-transform: uppercase;}
.foldable-title .title:before{width: 2px; height: 16px; background: #898370; position: absolute; content: ""; top: 50%; margin-top: -8px; right: 7px;}
.foldable-title.active .title:before{display: none;}
.foldable-title .title:after{height: 2px; width: 16px; background: #898370; position: absolute; content: ""; top: 50%; margin-top: -1px; right: 0;}
.foldable-title .title span{font-size: 75%;}
.foldable-content{padding: 25px 0 45px 0;}
.foldable-content .swiper-container{width: 600px; margin: 0 auto; height: 210px; margin-bottom: 35px;}
/*.foldable-content .swiper-wrapper{padding-bottom: 35px;}*/
.foldable-content .swiper-slide-container{width: 200px;}
.foldable-content .swiper-slide .image-entry{margin: 0 2px; height: 154px; position: relative;}
.foldable-content .swiper-slide .image-entry img{position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.foldable-content .swiper-slide .description-mark{position: absolute; bottom: 29px; left: 2px; right: 2px; font-family: 'copperplate', sans-serif; font-size: 14px; line-height: 14px; min-height: 14px; padding: 7px 0; background: #000; text-align: center;}
.foldable-content .swiper-slide .description-mark span{display: inline-block; padding: 0 5px; color: #edece9; text-transform: uppercase;}
.foldable-content .swiper-slide.selected .description-mark{background: #d1cfc2;}
.foldable-content .swiper-slide.selected .description-mark span{padding-left: 27px; margin-left: 5px; color: #000; position: relative;}
.foldable-content .swiper-slide .price-mark{font-family: 'copperplate', sans-serif; font-size: 14px; line-height: 15px; padding: 5px; position: absolute; left: 12px; top: 9px; color: #d1cfc2; background: #000;}
/**/
.no-custom-pagination.swiper-container{height: 177px;}
.no-custom-pagination .swiper-slide .description-mark{bottom: 0;}
.no-custom-pagination .pagination{display: none;}
/**/
.fabrics-block{margin-bottom: 35px;}
.fabric-column{float: right; width: 300px;}
.fabric-column:first-child{float: left; width: auto;}
.fabric-column input{background: none; padding: 0; width: 195px; text-align: center; float: left;}
.fabric-label{font-size: 18px; color: #000; line-height: 48px;}
.fabric-preview{height: 48px; width: 94px; float: right; background-size: cover; background-position: right bottom; cursor: pointer;}
/**/
.fixed-popup{position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 10; display: none;}
.fixed-popup-content{position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); -moz-transform: translateY(-50%) translateX(-50%); -webkit-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); width: 100%; max-width: 650px;}
.fixed-popup-content img{display: block; width: 100%; height: auto;}
.close-layer{position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.5);}
.close{position: absolute; width: 33px; height: 33px; border: 1px #000 solid; right: 34px; top: 14px; background: #eeede9; cursor: pointer; line-height: 33px; text-align: center;}
.close:before, .close:after{width: 23px; height: 1px; background: #2c2c2c; position: absolute; left: 5px; top: 16px; content: ""; transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg);}
.close:after{transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg);}
.close:active{background: #2c2c2c;}
.close:active:before, .close:active:after{background: #f2ded9;}
/**/
.colors-wrapper{margin-bottom: 35px;}
.colors-wrapper .entry{float: left; width: 14.28%;}
#content-block .colors-wrapper .entry div{height: 45px; margin: 5px; cursor: pointer; position: relative;}
.colors-wrapper .entry div.active:after{border: 4px #a5c071 solid; position: absolute; width: 100%; height: 100%; left: 0; top: 0; content: "";}
.app-grid-colours .checkbox-entry{display: inline-block;}
.text-divider{font-size: 24px; line-height: 24px; color: #9b9583; text-transform: uppercase; font-family: 'copperplate', sans-serif; text-align: center; padding: 20px 0 25px 0;}
.text-divider span{display: inline-block; position: relative;}
.text-divider span:before, .text-divider span:after{position: absolute; height: 1px; background: #9b9583; width: 23px; content: ""; top: 50%; right: 100%; margin-right: 10px;}
.text-divider span:after{right: auto; left: 100%; margin-right: 0; margin-left: 10px;}
/*shirt fit*/
.shirt-fit-checkboxes .checkbox-entry{float: left; width: 25%;}
/**/
#content-block .colors-wrapper.buttons .entry div{height: 68px; overflow: hidden; position: relative;}
.colors-wrapper.buttons .entry div img{position: absolute; max-width: 80%; height: auto; left: 50%; top: 50%; transform: translateY(-50%) translateX(-50%); -moz-transform: translateY(-50%) translateX(-50%); -webkit-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%);}
.foldable-subtitle{font-size: 21px; line-height: 21px; color: #9b9583; text-transform: uppercase; text-align: center; padding-bottom: 10px; border-bottom: 2px #9b9583 solid; margin-bottom: 25px;}
.foldable-subtitle span{font-size: 90%;}
/**/
.upgrades-checkboxes{border-top: 2px #9b9583 solid; border-bottom: 2px #9b9583 solid; padding: 18px 0 8px 0;}
.upgrades-checkboxes .checkbox-entry{display: inline-block; margin-right: 24px;}
.upgrades-checkboxes .column{width: 50%; float: left; text-align: right;}
.upgrades-checkboxes .column:first-child{text-align: left;}
/*iPad*/
@media only screen and (max-width: 980px) {

}

/*other devices*/
@media only screen and (max-width: 760px) {
    .foldable-content .swiper-container{width: 400px;}
    /**/
    .fabric-column, .fabric-column:first-child{float: none;}
    /**/
    #content-block .colors-wrapper .entry div{margin: 3px;}
}

/*iPhone*/
@media only screen and (max-width: 480px) {
    .foldable-title{font-size: 22px; line-height: 22px;}
    .close{right: 20px; top: 10px;}
    /**/
    .colors-wrapper .entry{float: left; width: 25%;}
    /**/
    .shirt-fit-checkboxes .checkbox-entry{width: 50%;}
    /**/
    .upgrades-checkboxes .column{width: 100%; text-align: left;}
}
@media only screen and (max-width: 420px) {
    .foldable-content .swiper-container{width: 300px; height: 173px;}
    .no-custom-pagination.swiper-container{height: 144px;}
    .foldable-content .swiper-slide-container{width: 150px;}
    .foldable-content .swiper-slide .image-entry{height: 116px;}
}

/* =============
   ORDER SUMMARY
   ============= */
.top-title-box{padding: 35px 0 45px 0; background: #d0cec2;}
.top-title-box .title{text-align: center; font-size: 32px; color: #2c2c2c; text-transform: uppercase; font-family: 'copperplate', sans-serif; line-height: 32px; margin-bottom: 20px;}
.order-title-box{padding: 30px 0 25px 0;}
.order-title-box .page-title{padding-top: 0; margin-bottom: 20px;}
.order-title-box .description{font-size: 21px; color: #6a6a6a; line-height: 21px; text-align: center;}
/**/
.summary-box{text-align: center; padding: 20px 0;}
.summary-box .column-1{float: left; width: 33%; margin: 10px 0;}
.summary-box .column-2{float: left; width: 67%;}
.summary-box .column{float: left; width: 50%; margin: 10px 0;}
.summary-box img{display: inline-block; margin-bottom: 12px;}
.summary-box .title{margin-bottom: 15px; font-size: 21px; color: #000; line-height: 21px;}
.summary-box .description div{display: inline-block; padding-left: 27px; position: relative; font-size: 18px; line-height: 22px; color: #7d7d7d;}
/**/
.size-letter{float: right;}
.shirt-size-title{color: #212121;}
.shirt-size-title .title{padding-right: 0; margin-right: 35px;}
.shirt-size-columns{padding: 30px 0;}
.shirt-size-box .column{float: left; width: 50%; padding-left: 20px;}
.shirt-size-box .column:first-child{padding-left: 0; padding-right: 20px;}
.shirt-size-box .column .entry{float: left; width: 100%; font-size: 21px; color: #2c2c2c; line-height: 21px; padding: 7px 0;}
.shirt-size-box .column .entry span{color: #8d8d8d;}
.shirt-size-box .column .left{float: left; width: 65%;}
.shirt-size-box .column .right{float: right; width: 35%; text-align: right;}
/**/
.shirt-summary-entries-box{background: url(../img/line-separator.png) left top repeat-x;}
.shirt-summary-entries-box:first-child{background: none; margin-top: -25px;}
.shirt-summary-entry{padding: 20px 0; background: url(../img/line-separator.png) left bottom repeat-x;}
.shirt-summary-entry .image-entry{float: left; width: 140px;}
.shirt-summary-entry .image-entry img{height: 75px;}
.shirt-summary-entry .description-entry{margin-left: 140px; padding-right: 70px; position: relative; line-height: 24px;}
.shirt-summary-entry .description-entry .title{font-size: 21px; color: #161616;}
.shirt-summary-entry .description-entry .data{font-size: 19px; color: #6a6a6a;}
.shirt-summary-entry .description-entry .price{position: absolute; right: 0; top: 0; font-size: 21px; line-height: 21px; color: #2c2c2d; font-weight: 400;}
.delete-item{font-size: 36px; line-height: 36px; width: 27px; height: 36px; float: left; color: #6a6a6a; text-transform: uppercase; text-align: center; cursor: pointer; margin-right: 10px;}
/**/
.order-summary-numbers-box{padding-top: 35px;}
.order-summary-numbers-box .data{width: 100%; float: right; text-align: right; color: #000; line-height: 35px; font-size: 21px;}
.order-summary-numbers-box .data .entry{float: left; width: 100%;}
.order-summary-numbers-box .data .entry:last-child{margin-top: 35px;}
.order-summary-numbers-box .data .left{margin-right: 130px;}
.order-summary-numbers-box .data .right{float: right; width: 120px;}
#content-block .order-summary-numbers-box .data .right input{height: 35px; line-height: 35px; display: block; margin-bottom: 3px; font-size: 21px; text-align: right;}
.order-summary-numbers-box .button.type-3{position: absolute; left: 0; top: 0;}
.order-summary-numbers-box .data .checkbox-entry{float: right; clear: both;}
.order-summary-numbers-box .data .checkbox-entry label{padding-left: 0; padding-right: 38px;}
.order-summary-numbers-box .data .checkbox-entry label:before{left: auto; right: 0;}
.order-summary-numbers-box .data .checkbox-entry label:after{left: auto; right: 12px;}
.order-summary-numbers-box .data .checkbox-entry.active label:after{left: auto; right: 6px;}
/**/
.login-popup-content{padding: 0 20px 40px 20px; background: #eeede9;}
/*iPad*/
@media only screen and (max-width: 980px) {

}

/*other devices*/
@media only screen and (max-width: 760px) {
    .shirt-size-box .column:first-child, .shirt-size-box .column{width: auto; float: none; padding: 0;}
}

/*iPhone*/
@media only screen and (max-width: 480px) {
    .top-title-box .title{font-size: 21px; line-height: 24px;}
    .summary-box .column-1, .summary-box .column-2, .summary-box .column{float: none; width: auto; margin: 0;}
    .summary-box .title{margin-bottom: 0; float: left; width: 50%; text-align: left;}
    .summary-box img, .summary-box .description div:after, .summary-box .description div:before{display: none;}
    .summary-box .description div{padding-left: 0;}
    .summary-box .description{float: left; width: 50%; text-align: right;}
    .summary-box .title, .summary-box .description, .shirt-size-box .column .entry{font-size: 18px; line-height: 18px; padding: 8px 0;}
    .shirt-size-columns, .summary-box{padding: 10px 0;}
    .shirt-summary-entry .description-entry{padding-right: 0; line-height: 18px;}
    .shirt-summary-entry .description-entry .price{position: relative; right: auto; bottom: auto; font-size: 16px;}
    .shirt-summary-entry .description-entry .title{font-size: 16px;}
    .shirt-summary-entry .description-entry .data{font-size: 14px;}
    .order-summary-numbers-box .data{font-size: 18px; line-height: 30px;}
    #content-block .order-summary-numbers-box .data .right input{height: 30px; line-height: 30px; font-size: 18px;}
    .order-summary-numbers-box .button.type-3{top: auto; bottom: 0;}
    .order-summary-numbers-box{padding-top: 15px;}
    .shirt-summary-entry .image-entry{width: 120px; text-align: center;}
    .shirt-summary-entry .description-entry{margin-left: 120px;}
    .login-popup-content{padding: 30px 10px 10px 10px;}
    .login-popup-content .page-title{padding-left: 0; padding-right: 0;}
    .top-title-box{padding: 20px 0 30px 0;}
    .order-title-box{padding-top: 25px;}
    .delete-item{margin-right: 0;}
}
@media only screen and (max-width: 320px) {

}

/* ========
   CHECKOUT
   ======== */
.foldable-title.type-1{color: #212121;}
.foldable-title.type-1 .title:before, .foldable-title.type-1 .title:after{background: #212121;}
.payment-option-indicate-entry{height: 35px; position: relative; float: left; margin: 30px 15px 0 0; cursor: pointer;}
.payment-option-indicate-entry img{position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0;}
.payment-option-indicate-entry img:first-child{position: relative; height: inherit; width: auto; opacity: 1;}
.payment-option-indicate-entry.active img{opacity: 1;}
.payment-option-indicate-entry.active img:first-child{opacity: 0;}

/* ===============
   ORDER PROCESSED
   =============== */
.order-processed-box{text-align: center; padding-top: 30px;}
.order-processed-box .title{font-size: 32px; line-height: 32px; color: #2c2c2c; text-transform: uppercase; font-family: 'copperplate', sans-serif; margin-bottom: 30px;}
.order-processed-box .description{font-size: 21px; line-height: 27px; color: #6a6a6a; margin-bottom: 50px;}
.order-processed-box .description p, .order-processed-box .description ul, .order-processed-box .description ol, .order-processed-box .description img{margin-bottom: 27px;}
/*iPad*/
@media only screen and (max-width: 980px) {

}

/*other devices*/
@media only screen and (max-width: 760px) {

}

/*iPhone*/
@media only screen and (max-width: 480px) {
    .order-processed-box .description{font-size: 18px; line-height: 25px; margin-bottom: 25px;}
    .order-processed-box .description p, .order-processed-box .description ul, .order-processed-box .description ol, .order-processed-box .description img{margin-bottom: 20px;}
    .order-processed-box .title{font-size: 28px; line-height: 28px; margin-bottom: 12px;}
}
@media only screen and (max-width: 320px) {

}

/* =================
   BORDER BOX STYLES
   ================= */
.field-entry input, .field-entry textarea, .field-entry .select-wrapper, .field-entry select, .field-entry, #content-block, .field-columns, .ruler-data input, .youtube-link, .fabric-column input, .fixed-popup-content, .colors-wrapper .entry div:after, .shirt-size-box .column, .order-summary-numbers-box .data .right input{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}

/* =============
   SWIPER STYLES
   ============= */
.swiper-container{width:100%; height:inherit; background-position: center center; background-size: cover;}
.swiper-slide{overflow:hidden; position:relative; background-position: center center; background-size: cover;}
.pagination{position:absolute; left: 0; bottom: 0; font-size:0; text-align: center; width: 100%;}

.slider-entry{position:relative;}
.swiper-container {
    margin:0 auto;
    position:relative;
    overflow:hidden;
    -webkit-backface-visibility:hidden;
    -moz-backface-visibility:hidden;
    -ms-backface-visibility:hidden;
    -o-backface-visibility:hidden;
    backface-visibility:hidden;
    /* Fix of Webkit flickering */
    z-index:1;
}
.swiper-wrapper {
    position:relative;
    width:100%;
    height: inherit!important;
    -webkit-transition-property:-webkit-transform, left, top;
    -webkit-transition-duration:0s;
    -webkit-transform:translate3d(0px,0,0);
    -webkit-transition-timing-function:ease;

    -moz-transition-property:-moz-transform, left, top;
    -moz-transition-duration:0s;
    -moz-transform:translate3d(0px,0,0);
    -moz-transition-timing-function:ease;

    -o-transition-property:-o-transform, left, top;
    -o-transition-duration:0s;
    -o-transform:translate3d(0px,0,0);
    -o-transition-timing-function:ease;
    -o-transform:translate(0px,0px);

    -ms-transition-property:-ms-transform, left, top;
    -ms-transition-duration:0s;
    -ms-transform:translate3d(0px,0,0);
    -ms-transition-timing-function:ease;

    transition-property:transform, left, top;
    transition-duration:0s;
    transform:translate3d(0px,0,0);
    transition-timing-function:ease;

    cursor:url(../img/drag.png) 16 9, ew-resize!important;
    margin: 0 auto;
}
.swiper-free-mode > .swiper-wrapper {
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -ms-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    margin: 0 auto;
}
.swiper-slide {
    float: left;
    height: inherit!important;
}

/* IE10 Windows Phone 8 Fixes */
.swiper-wp8-horizontal {
    -ms-touch-action: pan-y;
}
.swiper-wp8-vertical {
    -ms-touch-action: pan-x;
}
.swiper-pagination-switch {
    /* Stylize pagination button: */
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    margin: 0 5px;
    cursor: pointer;
    border:2px solid #9b9583;
}
.swiper-active-switch {background: rgba(155,149,131,1);}

/* ==============
   CSS ANIMATIONS
   ==============  */
.class{-moz-transition:none; -o-transition:none; -webkit-transition:none; transition:none; -ms-transition:none;}
.checkbox-entry label:after, .body-type-box .entry .title:after{-moz-transition:all 0.15s ease-out; -o-transition:all 0.15s ease-out; -webkit-transition:all 0.15s ease-out; transition:all 0.15s ease-out; -ms-transition:all 0.15s ease-out;}
.lazy-load.loaded{-moz-transition:all 300ms ease-out; -o-transition:all 300ms ease-out; -webkit-transition:all 300ms ease-out; transition:all 300ms ease-out; -ms-transition:all 300ms ease-out;}
.responsive-wrapper{-moz-transition:all 500ms ease-out; -o-transition:all 500ms ease-out; -webkit-transition:all 500ms ease-out; transition:all 500ms ease-out; -ms-transition:all 500ms ease-out;}
/*transition delay*/
.class{transition-delay: 500ms; -moz-transition-delay: 500ms; -webkit-transition-delay: 500ms; -ms-transition-delay: 500ms;}



/*iPad*/
@media only screen and (max-width: 980px) {

}

/*other devices*/
@media only screen and (max-width: 760px) {

}

/*iPhone*/
@media only screen and (max-width: 480px) {

}
@media only screen and (max-width: 320px) {

}

/* =============
   CSS ADDITIONS
   =============  */
.edit-button{position: absolute; border: 2px #1d1d1d solid; right: 0; bottom: 0; font-size: 16px; text-transform: uppercase; line-height: 25px; padding: 0 10px; color: #1d1d1d;}
.edit-button:active{background: #fff;}
@media only screen and (max-width: 480px) {
    .edit-button{position: relative; right: auto; bottom: auto; margin-top: 5px; display: inline-block;}
}
.fixfixed header{display: none;}

.fixfixed #content-block{-moz-transition: none; -o-transition: none; -webkit-transition: none; -transition: none; -ms-transition: none;}
.loader.box-size{position: absolute;}

#bodyPicturesForm {margin-top: 40px}
#bodyPicturesForm .field-entry {
    font-size: 18px;
    height: 55px;
    line-height: 20px;
}
#bodyPicturesForm .field-entry label span
{
    display: inline;
    margin-left: 10px;
    color: #444;
}
#bodyPicturesForm .field-entry .custom-file-input{
    border: 0px;
    background: transparent;
    color: transparent;
    height: auto;
    line-height: 24px;
    padding: 0;
}
.custom-file-input::-webkit-file-upload-button {
    visibility: hidden;
}
.custom-file-input::before {
    content: 'Take picture';
    display: inline-block;
    background: -webkit-linear-gradient(top, #f9f9f9, #e3e3e3);
    border: 1px solid #999;
    border-radius: 3px;
    padding: 5px 8px;
    outline: none;
    white-space: nowrap;
    -webkit-user-select: none;
    cursor: pointer;
    text-shadow: 1px 1px #fff;
    font-size: 10pt;
    color:#000;
    font-family: 'Nunito', sans-serif;
    font-weight: 300;
    width: 83%;
}
.custom-file-input:hover::before {
    border-color: black;
}
.custom-file-input:active::before {
    background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9);
}
.card-logos{width: 200px; height: 27px; background-image: url('../img/credit-cards.png'); background-repeat: no-repeat; margin: 3px 0px; }
.card-logos.visa{background-position: 0 0;}
.card-logos.mastedcard{background-position: 0 -30px;}
.card-logos.american_express{background-position: 0 -60px;}

/* ==============
   CLIENTS PHOTOS
   ============== */
.clients-photos-box *{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.clients-photos-box{text-align: center; padding-top: 40px;}
.clients-photos-box:after{content: ""; display: block; clear: both;}
.clients-photos-box .row{margin: 0 -15px;}
.clients-photos-box .column{padding: 0 15px; float: left; width: 33.3333%;}
.client-photo-entry{max-width: 225px; margin: 0 auto; border: 1px #9e9585 dashed; position: relative;}
.client-photo-entry.active{border-style: solid;}
.client-photo-entry img{display: block; width: 100%; height: auto; position: relative;}
.client-photo-entry .uploaded-image{width: 100%; height: 100%; left: 0; top: 0; position: absolute; background: #eeede9; display: none;}
.client-photo-entry.active .uploaded-image{display: block;}
.clients-photos-box .column .title{font-size: 24px; line-height: 24px; color: #000; font-family: 'copperplate', sans-serif; text-transform: uppercase; position: relative; padding-bottom: 15px; margin-bottom: 20px;}
.clients-photos-box .column .title:after{position: absolute; width: 28px; height: 2px; background: #a19c8b; left: 50%; bottom: 0; margin-left: -14px; content: "";}
.client-photo-entry input[type="file"]{position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer;}
.client-photo-entry .remove-file{position: absolute; top: 0; right: 0; width: 50px; height: 50px; cursor: pointer; background: url(../img/new-image-button.png); display: none;}
.client-photo-entry.active .remove-file{display: block;}
.client-photo-entry .loading-bar{position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0,0,0,0.6); display: none;}
.client-photo-entry.loading .loading-bar{display: block;}
.client-photo-entry .loading-bar .bar{position: absolute; width: 90%; height: 25px; border: 2px #eeede9 solid; left: 5%; top: 50%; margin-top: -12px;}
.client-photo-entry .loading-bar .fill{position: absolute; height: 100%; left: 0; top: 0; background: #9e9585;}
.client-photo-entry .loading-bar .number{text-align: center; font-size: 22px; color: #eeede9; line-height: 22px; position: relative; top: 30px;}
/*iPad*/
@media only screen and (max-width: 980px) {

}
/*other devices*/
@media only screen and (max-width: 760px) {
    .clients-photos-box .column{width: 100%; margin-bottom: 30px;}
}
/*iPhone*/
@media only screen and (max-width: 480px) {

}