@import url('https://fonts.googleapis.com/css?family=Nunito:300,300i,400,400i,600,600i,700,700i&display=swap');
*{
    margin:0px;
    padding:0px;
    box-sizing: border-box;
    font-family: 'Nunito', sans-serif;
}
a{
    text-decoration: none;
}
ol, ul {
    list-style: none;
}
body{
    width:100%;
    min-height: 100%;
}

/* ===== wardrobe container ===== */
.wardrobe{
    width:100%;
    min-height: 100%;
}

    /* ===== CABEÇALHO ===== */
    .wardrobe .header{
        width:100%;
        height:130px;
    }
        .wardrobe .header .drawer_icon{
            width:100%;
            height:100%;
            padding:15px 4px;
        }
            .wardrobe .header .header_logo{
                height:80px;
                width: 300px;
                position: absolute;
                
                left: 50%;
                -webkit-transform: translateX(-50%);
                -moz-transform: translateX(-50%);
                -ms-transform: translateX(-50%);
                -o-transform: translateX(-50%);
                transform: translateX(-50%);
            }

    /*--------------*/

    
    /* ======== wardrobe item ======== */
    .wardrobe .border{
        border-top:30px solid #5B5B5B !important;
        padding-top:30px !important;
    }
    .wardrobe .drawer{
        width:100%;
        min-height:200px;
        max-height:auto;
        padding:10px 30px;
        text-align:justify;
        display:flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content:center;
        align-content: center;
    }
        .wardrobe .drawer > h2{
            text-align:center;
        }
        
        .wardrobe .drawer p{
            margin:15px 0;
        }

    /*--------------*/        



    /* ========== RODA PÉ ========== */
    .wardrobe .content_infor{
        width:100%;
        min-height:200px;
        height:auto;
        display:flex;
        flex-direction: column;
    }
        .wardrobe .content_infor .footer{
            width:100%;
            background:#313131;
            padding:12px 10px;
        }

            /*  ========== ICONE HEADER MARECHAL ==========  */
            .wardrobe .content_infor .footer .footer_icon{
                width:100%;
                height:150px;
                padding-top:30px;
            }
                .wardrobe .content_infor .footer .footer_icon .icon{
                    width:100px;
                    position: absolute;
                    left: 50%;
                    -webkit-transform: translateX(-50%);
                    -moz-transform: translateX(-50%);
                    -ms-transform: translateX(-50%);
                    -o-transform: translateX(-50%);
                    transform: translateX(-50%);
                }
            /*--------------*/
                
            
            /* ========== ENDEREÇO ========== */
            .wardrobe .content_infor .footer .footer_end{
                width:100%;
                height:220px;
                color:#919191;
            }
                .wardrobe .content_infor .footer .footer_end h4{
                    color:#e5e5e5;
                    margin-bottom:15px;
                }
                .wardrobe .content_infor .footer .footer_end p{
                    text-indent: 2px;
                    margin-bottom:5px;
                }
                    .wardrobe .content_infor .footer .footer_end h4::after{
                        content:'';
                        display: block;
                        width:20px;
                        height:2px;
                        background-color:#71c7ec;
                    }
            /*--------------*/        
            

            /*  ========== REDE(S) SOCIAL(AIS) ==========  */
            .wardrobe .content_infor .footer .footer_redes{
                width:100%;
                height:50px;
            }
                .wardrobe .content_infor .footer .footer_redes .redes-icon{
                    font-size:40px;
                    margin-left:45%;
                    color:#dad8d8;
                }
                    .wardrobe .content_infor .footer .footer_redes .redes-icon:hover{
                        color:#ffffff;
                    }
            /*--------------*/
        /*--------------*/
    /*--------------*/    


    /* ===== copyright ===== */
    .wardrobe .infor_copy{
        width:100%;
        height:40px !important;
        font-size:14px;
        background:#1a1a1a;
        color: #F1F1F1;
        padding:12px 30px;
    }
        .wardrobe .infor_copy a{
            color: #71c7ec;
        }
    /*--------------*/
/*--------------*/
/* =============== breackpoints =============== */
@media (min-width:740px){
    .wardrobe .content_infor .footer {
        display:flex;
        flex-direction: row;
    }

    
    .wardrobe .content_infor .footer .footer_icon{
        width:50%;
        height:220px;
        padding-top:40px;
    }
        .wardrobe .content_infor .footer .footer_icon .icon{
            width: 300px;
            height: 80px;
            left: 10%;
            -webkit-transform: translateX(-10%);
            -moz-transform: translateX(-10%);
            -ms-transform: translateX(-10%);
            -o-transform: translateX(-10%);
            transform: translateX(-10%);
        }
    

    .wardrobe .content_infor .footer .footer_end{
        width:50%;
        height:220px;
    }

    .wardrobe .content_infor .footer .footer_redes{
        width:5%;
        height:220px;
    }
        .wardrobe .content_infor .footer .footer_redes .redes-icon{
            margin-left:0px;
        }
            .wardrobe .content_infor .footer .footer_redes .redes-icon{
                margin-left:0px;
            }
}




@media (min-width:870px){
    .wardrobe .drawer{
        padding:10px 25px;
    }
        .wardrobe .drawer .card{
            width:260px;
            height:320px;
        }
}


@media (min-width:900px){
    .wardrobe .drawer{
        padding:10px 50px;
    }

        .wardrobe .drawer .card{
            width:280px;
            height:320px;
        }
} 


@media (min-width:1024px){
    .wardrobe .drawer{
        padding:10px 40px;
    }

        .wardrobe .drawer .card{
            width:280px;
            height:320px;
            
        }




    .wardrobe .content_infor .footer .footer_icon{
        width:60%; 
    }
        .wardrobe .content_infor .footer .footer_icon .icon{
            left: 35%;
            -webkit-transform: translateX(-35%);
            -moz-transform: translateX(-35%);
            -ms-transform: translateX(-35%);
            -o-transform: translateX(-35%);
            transform: translateX(-35%);
        }
    

    .wardrobe .content_infor .footer .footer_end{
        width:37%;
    }

    .wardrobe .content_infor .footer .footer_redes{
        width:3%;  
    } 
} 


@media (min-width:1200px){
    .wardrobe .drawer{
        padding:10px 60px;
    }

        .wardrobe .drawer .card{
            width:280px;
            height:320px;
            
        }
}