/* -- medias - cell - */
 
@media  (min-width:100px) and (max-width:700px){
   *{
      margin:0;
      padding:0;
      box-sizing:border-box;
      font-family: "Special Gothic Condensed One", sans-serif;
    font-weight: 200;
    font-style: normal;
    font-stretch:extra-condensed;
  }
  .special-gothic-condensed-one-regular {
    font-family: "Special Gothic Condensed One", sans-serif;
    font-weight: 200;
    font-style: normal;
  }
    body{
        background-color: #666;
     }
    #header-h{
    display:flex;
    justify-content:space-between;
    align-items: center;
    padding:10px 20px;
    border-bottom:1px solid lightgray;
    position:sticky;
    background-color: white;   
    z-index:100;
}
h1{
    font-size: 1.4em;
    font-family: Poppins, sans-serif;
}
.ham .bar{
    display:block;
     width:25px;
     height:2px;
     background-color:black;
     margin-bottom:6px;
     transition:all 0.3s ease-in-out;
  }
.ham{
    display:block;
 }
 .carrossel{
   width:100%;
   height:100%;
   margin: 0 auto;
   z-index:0;
}
.carrossel img{
  width:100%;
  height:100%;
  margin: 0 auto;
  z-index:0;
}
   /* Menus navegacao */
    .menu ul{
    position:absolute;
    display:none;
    background-color: rgb(160, 160, 160);
    align-items:center;
    width:100%;
    max-width:100%;
    left:-100%;
    margin-top:260px;
    padding:10px 10px;
    transition: transform .5s ease-in-out;
    transform:translateX(-110%);
}  
.menu ul{
    margin:auto;
}  
.menu-mobile ul{
    position:absolute;
    display:block;
    background-color: rgb(172, 172, 172);
    align-items:center;
    width:100%;
    max-width:400px;
    left:-100%;
    margin-top:260px;
    padding:10px 10px;
    transition: transform .5s ease-in-out;
    transform:translateX(-110%);
}  
    .menuleft ul{
    position:absolute;
    display:block;
    width:100%;
    max-width:100%;
    padding:0px;
    left:0%;
    margin-top:260px;
    transition: transform .5s ease-in-out;
    transform:translateX(-1%);
}
.menuleft ul{
    position:absolute;
    display:block;
    width:100%;
    max-width:100%;
    padding:0px;
    left:0%;
    margin-top:275px;
    transition: transform .5s ease-in-out;
    transform:translateX(0%);
}
.menuleft ul li{
    position:relative;
    display:block;
    padding:12px;
    width:100%;
    max-width:100%;
    border-bottom:1px solid rgb(126, 103, 62);
    text-align: center;
}
    .menu-mobile a{
    padding:10px 0;
    width:100%;
    text-align:center;
    color:black;
    z-index:1000;
}
.dropdown .dropdown-itens{
    display:none;
    position:relative;
    margin-top: 0px;
}
.menu-mobile ul li a:hover{
    display:none;
    text-decoration:none;
    color: rgb(143, 78, 13); 
    background-color: rgba(164, 160, 154, 0);
    padding:15px;
}
.dropdown:hover .dropdown-itens{
        display:none;
        position:relative;
        margin-top: 0px;
    }
   .ham--bar .bar:nth-child(1){
   transform:translateY(8px) rotate(45deg);
}
    .ham--bar .bar:nth-child(2){
   opacity:0;
}

.ham--bar .bar:nth-child(3){
   transform:translateY(-8px) rotate(-45deg);
}
.menu-mobile{
    text-transform:uppercase;
   }
   .menu-mobile ul,li,a{
   list-style:none;
   }
   /* End menu mobile */
/* corpo */
.new-02{
 color: rgb(200, 200, 200);
 font-family: "Special Gothic Condensed One", sans-serif;
 font-size: 1em;
 font-weight:lighter;
 font-style:italic;
 font-stretch:extra-condensed;
 padding:0px;
 margin:40px 20px 20px 20px;
}
.new-02 h3{
 color: rgb(200, 200, 200);
 font-family: "Special Gothic Condensed One", sans-serif;
 font-size:1em;
 font-weight:lighter;
 font-style:normal;
 text-align:justify;
 line-height:1em;
 font-stretch:extra-condensed;
 padding:0px;
 margin:20px 20px 20px 20px;
}
.art {
   display: grid; 
   grid-template-columns: auto;
   margin: auto;
   gap:20px;
   justify-content: center;
   padding: 20px;
}
.art {
   display: grid; 
   grid-template-columns: auto;
   margin-top: 50px;
   gap:20px;
   justify-content: center;
   padding: 20px;
}
.art .artes{
   background-color: rgb(9, 6, 10);
   width:350px;
   height:550px;
   border-radius: 20px;
   font-size: 1em;
   margin-top:50px;
}

.art .artes{
   background-color: rgb(9, 6, 10);
   width:350px;
   height:550px;
   border-radius: 20px;
   font-size: 1em;
   margin:0 auto;
}
#logo img{
    width: 84px;
    height:30px;
    margin-top: 5px;
}

/* Social links */
.social img{
width:20px; 
height:20px;
margin:0px 2px;
}
.comunica-01 img{
    width:200px;
    height:200px;
    border-radius: 50%;
    position:absolute;
    vertical-align: middle;
 }
 .comunica-01{
    width:200px;
    height:200px;
    border-radius: 50%;
    position:absolute;
    vertical-align: middle;
    margin:0 auto;

 }
 .arte-image{
    /* background-image:url("../images/arte03.png"); */
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width:200px;
    height:200px;
    border-radius:50%;
    margin:0 auto;
 }
  
 .communication{
    /* background-image:url("../images/arte03.png"); */
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width:200px;
    height:200px;
    border-radius:50%;
    margin:0 auto;
 }
 /* Margim top round img */
 .communication{
   margin-top: 30px;
}
 .motion-gra{
    /* background-image:url("../images/arte03.png"); */
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width:200px;
    height:200px;
    border-radius:50%;
    margin:0 auto;
 }
 .sala-a{
    /* background-image:url("../images/arte03.png"); */
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width:200px;
    height:200px;
    border-radius:50%;
    margin:0 auto;
 }
 .servico-a{
    /* background-image:url("../images/arte03.png"); */
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width:200px;
    height:200px;
    border-radius:50%;
    margin:0 auto;
 }
 /* End - section */
 .arte-image{   
   margin-top:10px;
 }
 .arte-texto h3{
    width: 220px;
    height:50px;
   margin-top:10px;
   margin-bottom:15px;
 }
 .sobre-laz{
    width:100%;
    margin:30px;
    padding:5px;
 }
 .sobre{
    width:95%;
    margin:10px;
    margin:0 auto;
    padding:35px 50px;
    border-radius: 20px;
    border-width: 2px;
    border-color: rgb(213, 239, 15);
    text-align: justify;
    font-family: Poppins, Verdana, Geneva, Tahoma, sans-serif;
    line-height: 1.3em;
    font-size: 1em;
    color:rgb(137, 137, 138);
    background-color: rgb(10, 6, 1);
 }
 .sobre p, h3{
    text-align: left;
    padding: 10px 10px;
    font-family: Poppins;
 }
 .empty{
    height: 80px;
    text-align: center;
}
 .comunica-empty, h3{
    font-family: .3em;
    font-weight: 300;
    line-height:1.1em;
    text-align: center;
    margin-top: 10%;
    margin-bottom: 30%;
}
 #comunica-empty{
    margin-top: 10px;
    margin-bottom: 30%;
}
.port-01{
    display:flex;
    justify-content:space-between;
    align-items: center;
    padding: 20px;
    width:100%;
    background-color: black;
    margin:0 auto;
 }
 .port-01 img{
    width: 50%;
    height: 50%;
    object-fit: fill;
    border-radius: 20px;
 }
 .special-gothic-condensed-one-regular {
    font-family: "Special Gothic Condensed One", sans-serif;
    font-weight: 400;
    font-style: normal;
  }
  
 .port-tit{
    width: 100%;
    height: 100px;
    margin: auto;
    text-align: center;
 }
 .port-tit p{
    text-align: center;
    font-style:normal;
    font-size: 2em;
    font-weight: 600;
    font-family: "Special Gothic Condensed One", sans-serif;
    font-weight: 600;
    font-style: normal;
    font-stretch:extra-condensed;
    font-variant-caps:all-small-caps;
    margin-bottom: 1px;
    margin-top: 30px;
    padding: 2px;
 }
 .port-pr{
    text-align:left;
    font-style:normal;
    font-size: .9em;
    font-family: "Special Gothic Condensed One", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-stretch:extra-condensed;
    margin-top: -30px;
    padding: 10px 10px 40px 10px;
 }
 .port-02 img{
    width: 100%;
    height: 50%;
    object-fit: fill;
    border-radius: 20px;
 
 }
 .port-03 img{
    width: 30%;
    height: 50%;
    object-fit: fill;
    border-radius: 10px;    
    margin:0;

 }
 .port-03{
    display:flex;
    justify-content:space-between;
    align-items: center;
    padding: 10px;
    width:100%;
    background-color: black;
    margin:0 auto;
 }
 #origem{
 width: 100%;
 object-fit: fill;
 gap:0%;
 border-radius: 0px;
}
#origem img{
 width: 50%;
 height: 50%;
 object-fit: fill;
 border-radius: 20px;
}
.bot-action{
margin-top: 10px;
margin-bottom: 10px;
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}

/* empty-division */
/*
.contato-btn{
    display:flex;
    justify-content:center;
    align-items: center;
    text-align: center;
    width: 300px;
    height:50px;
    border-radius: 20px;
    background-color: rgb(0, 0, 0);
    margin:auto;
    font-family: roboto;
    font-size: .9em;
    color: rgb(163, 163, 163);
    cursor:pointer;
    text-decoration: none;
    transition: transform 9s;
}
.contato-btn:hover{
    text-decoration:none;
    color: rgb(40, 126, 154); 
    background-color: rgb(4, 28, 49);
    width: 300px;
    height:50px;
    padding:10px; 
    text-decoration: overline;
}*/
.contato-class{
    text-decoration: none;
}
#container-main{
   margin-top: 140px;
}
#comunica{
      margin-bottom: 10px;
      margin-top: 70px;
}

/* Call to Action - ini */
.bot-action{
margin-bottom: 30px;
padding: 20px 5px 20px 5px;
}
.contato-btn{
   width: 250px;
   height: 40px;
   background-color: rgb(0, 0, 0);
   text-align: center;
 border-radius: 20px;
 margin: 0 auto;
}
.contato-btn a{
 font-family: Roboto, sans-serif;
 font-size: 1.8em;
 font-weight: 500;
 font-style:normal;
 font-stretch:extra-condensed;
 font-variant-caps:all-small-caps;
 text-decoration: none;
} 
.contato-btn a:hover{
 font-family: Roboto, sans-serif;
 font-size: 1.8em;
 font-weight: 600;
 font-style:normal;
 font-stretch:extra-condensed;
 font-variant-caps:all-small-caps;
 text-decoration:none;
 color: dimgrey;
} 

/* Call to Action - fim */
/* Call to Action - curso */
.courses-ini{
display: grid;
  grid-template-columns: auto;
  gap:1px;
  justify-content:space-around;
  margin:5%;
  width: 90vw;
}
.courses-ini a{
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
 font-size: 1.2em;
 font-weight: 300;
 font-style:normal;
 text-decoration: none;
}
.courses-ini a:hover{
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
 font-size: 1.2em;
 font-weight: 500;
 font-style:normal;
 text-decoration: none;
 color:rgb(110, 88, 62)
}
.contato-btn-h{
   width: 250px;
   height: 40px;
   background-color: rgb(0, 0, 0);
   text-align: center;
   padding:6px;
 border-radius: 20px;
 margin:0px;
}

/* Call to Action - curso end */
#rodape{
   text-align: center;
   padding: 20px;
   font-size: 0.7em;
}
/* video */
.video_play{
  margin:30px;
}
#video01 .video_play{
  margin:5px;
  width: 300px;
}
#video01{
display: grid;
  grid-template-columns: auto;
  margin:0 auto;
  gap:5px;
  justify-content: space-around;
  margin-bottom:10px;
  width: 100vw;
}
}