/*
 Project Name: Divina Noite
 Theme Name: Default
 Author: Digisoft Informática
 URI: www.lojadivinanoite.com.br 

 Sumary:
 [ 1 - Home ]
 
*/


/*************************
 1 - Home
**************************/

ul.verao-19-showcase {list-style: none; margin: 40px 0 0;}
ul.verao-19-showcase > li {display: inline-block; vertical-align: top;}
ul.verao-19-showcase > li.left-dual {width: 66%; margin-right: 10px;}
ul.verao-19-showcase > li.right {width: 32.5%;}

ul.verao-19-showcase > li.left-dual > .box-title {background: #fff url(../img/summer-19/px.jpg) 0px 0px repeat; display: inline-block; height: 594px; width: 49.5%; vertical-align: top;}
ul.verao-19-showcase > li.left-dual > .box-title > .title {background: transparent url(../img/summer-19/title.svg) center center no-repeat; background-size: contain; width: 270px; height: 200px; margin: 85px auto 60px; display: block;}
ul.verao-19-showcase > li.left-dual > .box-title > p {color: #fff; font-size: 16px; font-style: italic; font-family: 'Lato', sans-serif; margin: 0 0 20px 0; display:  inline-block; max-width: 70%;}
ul.verao-19-showcase > li.left-dual > .box-title > p:first-of-type {font-size: 21px;}    
ul.verao-19-showcase > li.left-dual > .camisolas {background: #fff url(../img/summer-19/summer-camisolas.jpg) center center no-repeat; background-size: cover; display: inline-block; height: 594px; width: 50.5%; position: relative;}
ul.verao-19-showcase > li.left-dual > .camisolas > a {display: block; height: 100%; width: 100%;}
ul.verao-19-showcase > li.left-dual > .camisolas .name {background: transparent url(../img/summer-19/name-camisolas.svg) center top no-repeat; display: inline-block; height: 250px; width: 230px; position: absolute; left: 0; top: 100px;}
ul.verao-19-showcase > li.left-dual > .camisolas .name button {display: block; border-radius: 30px; border: 1px solid #fff; padding: 10px 20px; background-color: transparent; font-style: italic; font-size: 15px; font-family: 'Lato', sans-serif; position: relative; margin: 170px auto 0; line-height: 10px;}


ul.verao-19-home {list-style: none; margin: 12px 0;}
ul.verao-19-home > li {display: inline-block; width: 32.5%; height: 291px; vertical-align: top; position: relative;}
ul.verao-19-home > li.camisetao {background: #fff url(../img/summer-19/summer-camisetao.jpg) center center no-repeat; background-size: cover;}
ul.verao-19-home > li.infantil {background: #fff url(../img/summer-19/summer-infantil.jpg) center center no-repeat; background-size: cover; margin: auto 10px;}
ul.verao-19-home > li.masculino {background: #fff url(../img/summer-19/summer-masculino.jpg) center center no-repeat; background-size: cover;}
ul.verao-19-home > li > a {display: block; width: 100%; height: 100%;}

ul.verao-19-home > li.fitness {background: #fff url(../img/home/fitness/home-fitness.jpg) center center no-repeat; background-size: cover;}
ul.verao-19-home > li.outlet {background: #fff url(../img/home/outlet/home-outlet.jpg) center center no-repeat; background-size: cover; margin: auto 10px;}
ul.verao-19-home > li.inverno {background: #fff url(../img/home/inverno/home-inverno.jpg) center center no-repeat; background-size: cover;}

ul.verao-19-home-vertical {margin: 0px;}
ul.verao-19-home-vertical > li {display: block; width: 100%;}
ul.verao-19-home-vertical > li:first-of-type {margin-bottom: 12px;}
ul.verao-19-home-vertical > li.short-dolls {background: #fff url(../img/summer-19/summer-short-dolls.jpg) center center no-repeat; background-size: cover;}
ul.verao-19-home-vertical > li.pijamas {background: #fff url(../img/summer-19/summer-pijamas.jpg) center center no-repeat; background-size: cover;}

ul.verao-19-home > li .name {display: inline-block; height: 190px; width: 190px; position: absolute;}
ul.verao-19-home > li .name button {display: block; border-radius: 30px; border: 1px solid #fff; padding: 10px 20px; background-color: transparent; font-style: italic; font-size: 15px; font-family: 'Lato', sans-serif; position: relative; margin: 130px auto 0; line-height: 10px;}

ul.verao-19-home > li.camisetao .name {background: transparent url(../img/summer-19/name-camisetao.svg) center top no-repeat; left: 10px; bottom: 0px;}
ul.verao-19-home > li.infantil .name {background: transparent url(../img/summer-19/name-infantil.svg) center top no-repeat; right: 0px; bottom: 0px;}
ul.verao-19-home > li.masculino .name {background: transparent url(../img/summer-19/name-masculino.svg) center top no-repeat; right: 0px; bottom: 0px;}
ul.verao-19-home > li.short-dolls .name {background: transparent url(../img/summer-19/name-short-dolls.svg) center top no-repeat; right: 0px; bottom: 0px;}
ul.verao-19-home > li.pijamas .name {background: transparent url(../img/summer-19/name-pijamas.svg) center top no-repeat; right: 0px; bottom: 0px;}

ul.verao-19-home > li.fitness .name {background: transparent url(../img/home/fitness/name-fitness.svg) center top no-repeat; left: 10px; bottom: 0px; width: 220px; height: 200px; left: auto; right: 10px; top: 30px;}
ul.verao-19-home > li.outlet .name {background: transparent url(../img/home/outlet/name-outlet.svg) center top no-repeat; right: 0px; bottom: 0px; width: 220px; height: 200px; bottom: auto; right: 10px;}
ul.verao-19-home > li.inverno .name {background: transparent url(../img/home/inverno/name-inverno.svg) center top no-repeat; right: 0px; bottom: 0px; width: 240px; height: 200px; bottom: auto; right: 10px;}
ul.verao-19-home > li.fitness button {margin-top: 200px; border-color: #000; color: #000;}
ul.verao-19-home > li.outlet button {margin-top: 200px; border-color: #ad0064; color: #ad0064;}
ul.verao-19-home > li.inverno button {margin-top: 200px;}


@media screen and (max-width: 1060px) {
    ul.verao-19-showcase > li.left-dual {width: 65.1%;}
    ul.verao-19-showcase > li.right {width: 32%;}
    ul.verao-19-showcase > li.left-dual > .box-title, ul.verao-19-showcase > li.left-dual > .camisolas {height: 532px;}
    ul.verao-19-showcase > li.left-dual > .box-title > .title {height: 150px;}

    ul.verao-19-home > li {height: 260px; width: 32%;}    
    ul.verao-19-home-vertical > li {width: 100%;}
}

@media screen and (max-width: 1000px) {
    ul.verao-19-showcase > li.left-dual > .box-title > .title {width: 100%;}
    ul.verao-19-showcase > li.left-dual > .box-title p {width: 90%;}
}

@media screen and (max-width: 800px) {
    ul.verao-19-showcase > li.left-dual > .box-title > .title {width: 100%; margin: 50px auto 30px;}
}

@media screen and (max-width: 740px) {    
    ul.verao-19-showcase > li {display: block;}
    ul.verao-19-showcase > li.left-dual {width: 100%;}
    ul.verao-19-showcase > li.right {width: 100%;}

    ul.verao-19-showcase > li.left-dual > .box-title {position: absolute; width: 140px; height: auto; z-index: 2;}
    ul.verao-19-showcase > li.left-dual > .box-title > .title {width: 80%; height: 100px; margin: 20px auto 15px;}
    ul.verao-19-showcase > li.left-dual > .box-title > p {display: none;}
    ul.verao-19-showcase > li.left-dual > .camisolas {width: 100%; max-width: 410px; margin-bottom: 12px;}
    ul.verao-19-showcase > li.left-dual > .camisolas .name {top: 170px;}
    
    ul.verao-19-home > li {height: 290px; width: 100%; max-width: 410px;}    
    ul.verao-19-home > li.infantil, ul.verao-19-home > li.outlet {margin: 10px auto;}
    ul.verao-19-home {text-align: center;}
    
    ul.verao-19-home-vertical {max-width: 410px; margin: 0 auto;}
    ul.verao-19-home-vertical > li {display: block; width: 100%;}
    
    ul.verao-19-home > li.fitness .name, ul.verao-19-home > li.outlet .name, ul.verao-19-home > li.inverno .name {width: 190px; background-size: contain;}
}

@media screen and (max-width: 600px) {    
    ul.verao-19-showcase > li.left-dual > .camisolas {height: 420px;}
}