@font-face {
    font-family: 'Bebas Neue';
    src: url('../font/BebasNeueRegular.eot');
    src: url('../font/BebasNeueRegular.eot?#iefix') format('embedded-opentype'),
        url('../font/BebasNeueRegular.woff') format('woff'),
        url('../font/BebasNeueRegular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Bebas Neue Book';
    src: url('../font/BebasNeueBook.eot');
    src: url('../font/BebasNeueBook.eot?#iefix') format('embedded-opentype'),
        url('../font/BebasNeueBook.woff') format('woff'),
        url('../font/BebasNeueBook.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

.clearfix::after {
    content: "";
    display: table;
    clear: both;
}

body {
    min-width: 1200px;
    margin: 0;
    padding: 0;
    font-family: "Open Sans", sans-serif;
    color: #ffffff;
}

.container {
    width: 1170px;
    margin: 0 auto;
}

.page-header,
.page-footer {
    color: #ffffff;
    background-color: #282828;
}

.page-header {
    min-height: 934px;
    padding-top: 22px;
    background-image: url("../img/header-bg.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
    z-index: 1;
}

.page-header::after {
    content: "";
    background-color: rgba(90, 92, 102, 0.7);
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: opacity 0.2s;
}

.page-header:hover:after {
    opacity: 0;
}

.header-logo {
    margin: 7px 0;
    float: left;
}

.brandly-first {
    color: rgba(220, 0, 0, 0.8);
    font-size: 48px;
    font-family: "Bebas Neue Book";
}

.brandly-last {
    color: rgba(220, 0, 0, 0.8);
    font-size: 36px;
    font-family: "Bebas Neue";
}

.main-nav {
    margin-top: 10px;
    float: right;
    font-size: 18px;
}

.main-nav li {
    float: left;
    margin: 0 0 0 76px;
}

.main-nav a {
    text-decoration: none;
    color: #ffffff;
    font-weight: 300;
    position: relative;
}

.main-nav a:before {
    position: absolute;
    content: "";
    width: 0%;
    height: 2px;
    bottom: 0;
    left: 0px;
    background-color: #ffffff;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
}

.main-nav a:hover:before {
    visibility: visible;
    width: 100%;
}

.promo {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    text-transform: uppercase;
}

.promo p {
    padding-bottom: 28px;
}

.promo-first,
.promo-third {
    font-size: 30px;
    font-weight: 300;
}

.promo-first {
    letter-spacing: 8px;
}

.promo-second {
    font-family: "Lato", sans-serif;
    font-size: 60px;
    white-space: nowrap;
    font-weight: 900;
}

.btn-quick-order {
    margin-top: 20px;
    display: inline-block;
    font-family: "Lato", sans-serif;
    font-size: 18px;
    color: #ffffff;
    padding: 16px 49px;
    border: 2px solid #ffffff;
}

.select {
    position: absolute;
    bottom: 55px;
    left: 50%;
    transform: translate(-50%, -50%);
}

.select input[type="radio"] {
    display: none;
    position: relative;
}

.select label {
    display: inline-block;
    width: 12px;
    height: 12px;
    background-color: #ffffff;
    border-radius: 50%;
    float: left;
    text-align: center;
    margin: 0 5px;
}

.trending-select label {
    background-color: #878787;
}

#select-1:checked~label[for="select-1"],
#select-2:checked~label[for="select-2"],
#select-3:checked~label[for="select-3"],
#select-4:checked~label[for="select-4"] {
    background: none;
    box-shadow: 0 0 0 2px #ffffff;
}

#select-tr-1:checked~label[for="select-tr-1"],
#select-tr-2:checked~label[for="select-tr-2"],
#select-tr-3:checked~label[for="select-tr-3"],
#select-tr-4:checked~label[for="select-tr-4"] {
    background: none;
    box-shadow: 0 0 0 2px #dc0000;
}

.heading {
    font-size: 40px;
    font-weight: 300;
    font-style: italic;
    color: #333333;
    text-align: center;
    position: relative;
    /*margin: 85px 0;*/
    margin-bottom: 85px;
}

.heading::before {
    content: "";
    height: 3px;
    width: 112px;
    background-color: #dc0000;
    position: absolute;
    top: -25px;
    left: 50%;
    transform: translate(-50%, -50%);
}

.heading::after {
    content: "";
    height: 3px;
    width: 112px;
    background-color: #dc0000;
    position: absolute;
    bottom: -25px;
    left: 50%;
    transform: translate(-50%, -50%);
}

.latest-category {
    margin-bottom: 30px;
}

.latest-category a {
    display: inline-block;
    position: relative;
    width: 370px;
    height: 418px;
    font-size: 40px;
    font-style: italic;
    text-align: center;
    color: #ffffff;
    outline: 3px solid #ffffff;
    outline-offset: -31px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    margin: 0;
    float: left;
    vertical-align: middle;
    z-index: 3;
    margin-right: 30px;
}

.latest-category .latest-watches {
    margin: 0;
}

.latest-products p {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    white-space: nowrap;
    font-weight: 300;
}

.latest-products {
    padding-top: 80px;
}

.latest-men {
    background-image: url("../img/latest-men.jpg");
    z-index: -2;
}

.latest-category a::after {
    content: "";
    background-color: rgba(90, 92, 102, 0.7);
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: opacity 0.2s;
}

.latest-category a:hover:after {
    opacity: 0;
}

.latest-woman {
    background-image: url("../img/latest-woman.jpg");
    z-index: -2;
}

.latest-watches {
    background-image: url("../img/latest-watches.jpg");
    z-index: -2;
}

.latest-promo a::after {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: opacity 0.2s;
}

.latest-collection::after {
    background-color: rgba(90, 92, 102, 0.7);
}

.latest-sale::after {
    background-color: rgba(90, 92, 102, 0.4);
}

.latest-promo a:hover:after {
    opacity: 0;
}

.latest-promo a {
    display: inline-block;
    position: relative;
    font-family: "Lato", sans-serif;
    width: 570px;
    height: 418px;
    font-size: 45px;
    z-index: 3;
    color: #ffffff;
    text-align: center;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    float: left;
    padding-bottom: 60px;
}

.latest-promo .latest-collection {
    margin-right: 30px;
}

.latest-collection {
    background-image: url("../img/latest-collection.jpg");
    z-index: -2;
}

.latest-sale {
    background-image: url("../img/latest-sale.jpg");
}

.latest-promo p {
    font-weight: 700;
}

.latest-promo p::before {
    content: "";
    height: 2px;
    width: 192px;
    background-color: #ffffff;
    position: absolute;
    top: -15px;
    left: 50%;
    transform: translate(-50%, -50%);
}

.latest-promo p::after {
    content: "";
    height: 2px;
    width: 192px;
    background-color: #ffffff;
    position: absolute;
    bottom: -15px;
    left: 50%;
    transform: translate(-50%, -50%);
}

.trending-items {
    margin-top: 60px;
    padding-bottom: 130px;
    padding-top: 85px;
    background-image: url("../img/trending-bg.jpg");
    font-family: "Lato", sans-serif;
    white-space: nowrap;
    font-size: 18px;
    color: #777777;
    position: relative;
}

.trending-select li {
    background-color: #878787;
}

.trending-select li:nth-child(3) {
    box-shadow: 0 0 0 2px #dc0000;
    background: none;
}

.trending-jacket {
    color: #dc0000;
    font-size: 30px;
    font-weight: bold;
    margin: 20px 0;
}

.trending-right {
    width: 570px;
    float: left;
}

.trending-text-top {
    font-family: "Open Sans", sans-serif;
    margin-bottom: 45px;
    font-weight: 300;
    letter-spacing: 2.5px;
    position: relative;
}

.trending-text-top::after {
    position: absolute;
    content: "";
    width: 30px;
    height: 1px;
    bottom: -25px;
    left: 0;
    background-color: #000000;
}

.trending-text-main,
.trending-text-bottom {
    margin: 50px 0 50px;
    font-family: "Lato", sans-serif;
    font-weight: 300;
    letter-spacing: 2px;
}


/*.trending-size-select li,*/

.trending-size-select label,
.trending-btn-shop,
.trending-btn-size-guide {
    font-size: 16px;
    color: #777777;
    font-family: "Open Sans", sans-serif;
    font-weight: bold;
    text-transform: uppercase;
}

.trending-items img {
    float: left;
    margin: 0 30px 0 0;
}

.size-select input[type="radio"] {
    display: none;
    position: relative;
}

.size-select label {
    display: inline-block;
    width: 70px;
    height: 50px;
    border: 1px solid #333333;
    border-left: 1px solid #afafaf;
    border-right: 1px solid #afafaf;
    color: #333333;
    float: left;
    text-align: center;
    padding: 13px 0;
    margin: 30px 30px 30px 0;
}

#select-size-1:checked~label[for="select-size-1"],
#select-size-2:checked~label[for="select-size-2"],
#select-size-3:checked~label[for="select-size-3"],
#select-size-4:checked~label[for="select-size-4"] {
    background-color: #333333;
    border: 1px solid #333333;
    color: #ffffff;
}

.trending-btn {
    float: left;
    width: 170px;
    height: 50px;
    margin-right: 30px;
    border: 1px solid #333333;
    color: #333333;
    text-align: center;
    padding: 13px 0;
}

.from-the-blog {
    padding: 85px 0 60px;
    position: relative;
}

.blog-item h3,
.blog-author {
    font-family: "Lato", sans-serif;
}

.blog-item h3 {
    color: #dc0000;
    font-size: 30px;
    font-weight: bold;
    padding: 25px 0;
}

.blog-author {
    font-size: 16px;
    color: #333333;
    opacity: 0.8;
}

.blog-item p {
    font-size: 18px;
    color: #333333;
    font-weight: 300;
    border-top: 1px solid #ecf0f1;
    border-bottom: 1px solid #ecf0f1;
    padding: 25px 0;
    margin: 30px 0;
    opacity: 0.6;
}

.blog-btn {
    display: inline-block;
    width: 170px;
    height: 50px;
    border: 1px solid #333333;
    color: #333333;
    text-align: center;
    padding: 13px 0;
    text-transform: uppercase;
    font-weight: bold;
}

.blog-item {
    float: left;
    width: 570px;
    margin-right: 30px;
}

.blog-item:last-child {
    margin-right: 0;
}

.rel {
    position: relative;
}

.arrow-left,
.arrow-right {
    content: "";
    position: absolute;
    width: 28px;
    height: 49px;
    /*    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28.031' height='49' viewBox='0 0 28.031 49'%3E%3Cmetadata%3E%3C?xpacket begin=' ' id='W5M0MpCehiHzreSzNTczkc9d'?%3E%3Cx:xmpmeta xmlns:x='adobe:ns:meta/' x:xmptk='Adobe XMP Core 5.6-c140 79.160451, 2017/05/06-01:08:21 '%3E%3Crdf:RDF xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns%23'%3E%3Crdf:Description rdf:about=''/%3E%3C/rdf:RDF%3E%3C/x:xmpmeta%3E%3C?xpacket end='w'?%3E%3C/metadata%3E%3Cdefs%3E%3Cstyle%3E .cls-1 { fill: %23333; fill-rule: evenodd; opacity: 0.3; } %3C/style%3E%3C/defs%3E%3Cpath id='left_arrow' class='cls-1' d='M254.37,3514.5l20.28-20.23a1.186,1.186,0,0,0,0-1.68l-2.247-2.24a1.19,1.19,0,0,0-1.686,0l-23.369,23.31a1.184,1.184,0,0,0,0,1.68l23.369,23.31a1.189,1.189,0,0,0,1.685,0l2.248-2.24a1.186,1.186,0,0,0,0-1.68Z' transform='translate(-247 -3490)'/%3E%3C/svg%3E");
*/
    background-image: url(../img/arrow.svg);
    top: 50%;
    transform: translate(-50%, -50%);
}

.arrow-left {
    left: -128px;
}

.arrow-right {
    right: -128px;
    transform: rotate(180deg);
}

.page-footer {
    height: 250px;
    padding-top: 75px;
    z-index: 1;
    background-image: url("../img/footer-bg.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    margin-bottom: 160px;
    position: relative;
}

.page-footer::after {
    content: "";
    background-color: rgba(90, 92, 102, 0.7);
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: opacity 0.2s;
}

.page-footer:hover:after {
    opacity: 0;
}

.footer-form label {
    font-weight: 300;
    font-size: 18px;
    margin-bottom: 27px;
    display: inline-block;
    margin-right: 100%;
    white-space: nowrap;
}

.form-field {
    float: left;
    /*    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15.156' height='11' viewBox='0 0 15.156 11'%3E%3Cmetadata%3E%3C?xpacket begin=' ' id='W5M0MpCehiHzreSzNTczkc9d'?%3E%3Cx:xmpmeta xmlns:x='adobe:ns:meta/' x:xmptk='Adobe XMP Core 5.6-c140 79.160451, 2017/05/06-01:08:21 '%3E%3Crdf:RDF xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns%23'%3E%3Crdf:Description rdf:about=''/%3E%3C/rdf:RDF%3E%3C/x:xmpmeta%3E%3C?xpacket end='w'?%3E%3C/metadata%3E%3Cdefs%3E%3Cstyle%3E .cls-1 { fill: %23fff; fill-rule: evenodd; } %3C/style%3E%3C/defs%3E%3Cpath id='email' class='cls-1' d='M417.493,4176.17L417,4176H404a1.382,1.382,0,0,0-1,1v9a1.4,1.4,0,0,0,1,1h14c0.367,0,0-.64,0-1v-9A0.715,0.715,0,0,0,417.493,4176.17ZM417,4186a8.333,8.333,0,0,0,1,0H404c-0.039,0,0,.04,0,0h0l5-4,0.783,0.79a1.128,1.128,0,0,0,1.416,0l0.8-.79,5,4h0Zm-6.173-3.66h0c-0.006.01,0.192-.35,0.178-0.34a2.871,2.871,0,0,1-.5.45h-0.006S410,4182,410,4182c-0.126,0,.081.07,0,0l-5-5a1.456,1.456,0,0,0-1,0h13c0.023,0-.015-0.02,0,0l-6,5ZM404,4185v-8l4,4Zm13-7v7l-4-4Z' transform='translate(-403 -4176)'/%3E%3C/svg%3E");
*/
    background-image: url(../img/email.svg);
    background-repeat: no-repeat;
    background-position: 27px 50%;
    border: 1px solid #ffffff;
    width: 770px;
    height: 50px;
    font-size: 13px;
    font-weight: 300;
    padding-left: 80px;
    color: #ffffff;
}

::placeholder {
    /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #ffffff;
    opacity: 1;
    /* Firefox */
}

:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #ffffff;
}

::-ms-input-placeholder {
    /* Microsoft Edge */
    color: #ffffff;
}

.form-submit {
    float: right;
    background-color: #ffffff;
    text-align: center;
    width: 270px;
    height: 50px;
    border-radius: 0px;
    text-transform: uppercase;
    color: #000000;
    font-weight: bold;
    padding: 14px 0;
}