body{
    background-color:black;
    font-family:'Mont Web';
    box-sizing:border-box
}
h1,h2,h3,h4{
    font-family:'Mont Heavy Web'
}
h1{
    font-size:3em
}
h2{
    font-size:2.5em;
    margin-bottom:40px
}
h3{
    font-size:2em
}
h4{
    font-size:1.5em
}
img{
    max-width:100%
}
.missing{
    height:600px
}
.button{
    display:inline-block;
    background-color:black;
    font-family:'Mont Heavy Web';
    font-size:1em;
    color:white;
    text-decoration:none;
    padding:15px 20px;
    position:relative;
    text-transform:uppercase
}
.text-center{
    text-align:center
}
.flex{
    display:flex
}
.flex.flex-50>div{
    flex:0 1 50%;
    padding:50px
}
form button{
    border:0
}
form .input-group{
    margin-bottom:20px
}
form .input-group select{
    color:#696969
}
form .input-group input[type=text],form .input-group select{
    width:100%;
    height:46px;
    padding:0;
    box-sizing:border-box;
    border:2px solid black;
    padding-left:10px;
    font-family:'Mont Web';
    font-size:1em
}
form .input-group input[type=text]::placeholder,form .input-group select::placeholder{
    font-family:'Mont Web'
}
form .input-group input[type=email],form .input-group select{
    width:100%;
    height:46px;
    padding:0;
    box-sizing:border-box;
    border:2px solid black;
    padding-left:10px;
    font-family:'Mont Web';
    font-size:1em
}
form .input-group input[type=email]::placeholder,form .input-group select::placeholder{
    font-family:'Mont Web'
}
form .disclaimer{
    font-size:12px;
    line-height:14px;
    text-align:left
}
.container{
    margin:auto;
    max-width:1920px;
    font-family:'Mont Web';
    background-color:white;
    overflow-x:hidden
}
.container .small-box{
    max-width:800px;
    margin:0 auto
}
.container .header{
    margin:0;
    padding:0;
    line-height:0;
    height:200px;
    display:flex
}
.container .header .picture{
    width:10%;
    height:100%;
    background-position:center bottom;
    background-size:cover
}
.container .header .picture:nth-child(1){
    background-image:url("../img/header/matrix-blue.jpg")
}
.container .header .picture:nth-child(2){
    background-image:url("../img/header/matrix-green.jpg")
}
.container .header .picture:nth-child(3){
    background-image:url("../img/header/matrix-orange.jpg")
}
.container .header .picture:nth-child(4){
    background-image:url("../img/header/matrix-purple.jpg")
}
.container .header .picture:nth-child(5){
    background-image:url("../img/header/matrix-green-2.jpg")
}
.container .header .picture:nth-child(6){
    background-image:url("../img/header/matrix-pink.jpg")
}
.container .header .picture:nth-child(7){
    background-image:url("../img/header/matrix-purple-2.jpg")
}
.container .header .logo{
    width:30%;
    background-image:url("../img/header/logo.jpg");
    background-position:center;
    background-size:cover
}
.container .video-wrapper{
    background:black;
    padding:80px
}
.container .video-wrapper video{
    width:100%
}
.container .carousel-wrapper{
    height:380px
}
.container .carousel-wrapper .owl-carousel .owl-nav button.owl-prev,.container .carousel-wrapper .owl-carousel .owl-nav button.owl-next{
    font-family:'Mont Web'
}
.container .carousel-wrapper .owl-carousel .owl-item img{
    width:auto
}
.container .carousel-wrapper .item{
    display:flex
}
.container .carousel-wrapper .item .image{
    height:380px;
    width:50%;
    background-size:cover;
    background-position:left center
}
.container .carousel-wrapper .item .content{
    width:50%;
    height:380px;
    position:relative
}
.container .carousel-wrapper .item .content>div{
    width:80%;
    position:absolute;
    bottom:0;
    padding:10%
}
.container .carousel-wrapper .item .content>div h3{
    font-size:3em
}
.container .carousel-wrapper .item .content>div p{
    font-size:1.5em
}
.container .carousel-wrapper .owl-nav{
    position:absolute;
    top:50%;
    font-size:6em;
    color:white;
    margin-top:-60px;
    width:100%
}
.container .carousel-wrapper .owl-nav .owl-next{
    position:absolute;
    right:0px
}
.container img{
    max-width:100%
}
.container .bestsellers{
    padding:40px
}
.container .bestsellers h2{
    text-align:center
}
.container .product-list{
    display:flex
}
.container .product-list .product-item{
    padding:40px;
    cursor:pointer;
    flex:1 1 0px
}
.container .product-list .product-item .image{
    margin:auto;
    text-align:center;
    height:250px;
    width:250px;
    overflow:hidden;
    background-repeat:no-repeat;
    background-size:auto 100%;
    background-position:left center;
    transition:background-position .3s ease
}
.container .product-list .product-item .image:hover{
    background-position:right center
}
.container .product-list .product-item .title{
    font-family:'Mont Heavy Web';
    text-align:center;
    margin-bottom:10px
}
.container .product-list .product-item .description{
    font-family:'Mont Web';
    text-align:center
}
.container .buy{
    background-color:#EEEEEE;
    padding-top:60px
}
.container .buy h2{
    text-align:center
}
.container .buy .buttons-wrapper{
    padding:50px
}
.container .so-color{
    background-size:auto 100%;
    min-height:300px
}
.container .so-color .poster{
    line-height:0;
    background:url(../img/so-color-poster-back.jpg) center center no-repeat;
    background-size:cover;
    height:600px;
    width:50%
}
.container .so-color .poster img{
    height:600px
}
.container .so-color .content{
    width:50%;
    height:600px;
    background-color:#f381b4;
    background-size:cover;
    padding:40px;
    padding-top:120px;
    box-sizing:border-box
}
.container .so-color .content h2{
    font-size:3em;
    margin-bottom:5px
}
.container .so-color .content h3{
    font-family:'Mont Web'
}
.container .so-color .content .product-list{
    width:100%
}
.container .so-color .content .product-list .product-item{
    width:50%
}
.container .so-color .content .product-list .product-item .image img{
    height:400px
}
.container .so-color .content .product-list .product-item .description{
    text-align:center;
    font-family:'Mont Heavy Web'
}
.container .find-out{
    display:flex;
    flex-direction:column;
    justify-content:center;
    text-align:center;
    min-height:100vh
}
.container .find-out p{
    max-width:600px;
    margin:30px auto
}
.container .find-out .disclaimer{
    margin:20px 0;
    max-width:100%
}
.container .about{
    background-color:#7351B7;
    color:white
}
.container .about .poster{
    width:35%;
    line-height:0;
    background:url("../img/matrix-footer.jpg") center right;
    background-size:cover;
    min-height:300px
}
.container .about .content{
    width:65%;
    padding:10px
}
.container .about .content p{
    margin:20px
}
.container .about .content p:last-child{
    margin-bottom:0
}
.container .about .content img{
    max-width:300px
}
.container footer{
    display:flex;
    height:100px;
    padding:60px 40px;
    background-color:black;
    color:white
}
.container footer .logo{
    width:200px;
    margin-bottom:10px
}
.container footer>div{
    width:50%
}
.container footer .menu{
    list-style:none;
    margin-left:0;
    display:flex
}
.container footer .menu li{
    margin-right:10px
}
.container footer .menu li:first-child{
    padding-right:10px;
    border-right:white 2px solid
}
.container footer .menu li a{
    color:#FFF;
    text-decoration:none
}
.container footer .social{
    list-style:none;
    display:flex;
    justify-content:flex-end
}
.container footer .social li{
    margin:20px
}
.container footer .social li:first-child{
    margin-left:0
}
.favs{
    padding-top:30px;
    background-color:black;
    color:white
}
.favs .before-after{
    text-align:right
}
.favs .before-after video{
    width:80%;
    margin:auto
}
.favs h2{
    text-align:center;
    color:white
}
.favs ul li{
    margin-bottom:40px;
    display:flex
}
.favs ul li .stars{
    width:100px;
    margin-bottom:10px
}
.favs ul li .product-shot{
    width:150px
}
.favs ul li .author{
    margin-top:10px;
    font-weight:700
}
.favs .reviews{
    padding-left:0 !important;
    padding-top:100px !important
}
@media (max-width: 768px){
    .container .header{
        height:130px
    }
    .container .before-after{
        text-align:center
    }
    .container .carousel-wrapper{
        height:auto
    }
    .container .carousel-wrapper .item{
        display:block
    }
    .container .carousel-wrapper .item .image,.container .carousel-wrapper .item .content{
        width:100%
    }
    .container .flex{
        display:block
    }
    .container .product-list{
        display:block
    }
    .container .so-color .poster{
        height:800px;
        width:100%
    }
    .container .so-color .content{
        width:100%
    }
    .container .so-color .content .product-list{
        display:flex
    }
    .container .so-color .content .product-list .product-item{
        width:100%
    }
    .container .about .poster{
        width:100%
    }
    .container .about .content{
        width:100%
    }
    .button{
        width:300px
    }
    .button:first-child{
        margin-bottom:20px
    }
}
@media (max-width: 640px){
    .container .header{
        height:100px
    }
    .container footer{
        display:block
    }
}
@media (max-width: 1000px){
    .favs .flex{
        display:block
    }
}
/*# sourceMappingURL=styles.css.map */