html body{
    margin: 0%;
}
@font-face {
    font-family: 'logs';
    src: url('fonts/Social Media Circled.otf');
  }
.nav-bar{
    position: fixed;
    width: 100%;
    height: auto;
    z-index: 9999;
}
.blak{
    display: flex;
    padding: 10px;
    background-color: black;
    align-items: center;
}
.iz,.de{
    flex: 1;
}
.iz{
    display: flex;
}
.lks{
    color: #ffffff;
    font-family: 'Open Sans';
    text-decoration: none;
    padding: 0px 5px 0px;
    font-size: 1.2rem;
    transition: 0.2s;
}
.lks:hover{
    color: rgb(90, 90, 90);
}

.de{
    text-align: end;
    display:contents;
}
.margin-001{
    margin: 0%;
    align-self: center;
}
.sosial-1{
 padding: 10px 0px 0px;
 font-family: 'logs';
 color: white;
 text-decoration: none;
 font-size: 1.8rem;
 transition: 0.2s;
}
.sosial-1:hover{
    color: rgb(66, 66, 66);
    font-size: 2rem;
}
#web-style{
 background-color: rgba(255, 255, 255, 0);
 color: white;
 font-family: 'Poppins';
 border-radius: 8px;
}
.option-color{
    color: black;

}
.pad-001{
    padding: 0px 30px 0px;
}

.container {
    position: relative;
    width: 100%;
    height: auto;
    background-color: black;
  }

  .image {
    width: 100%;
    height: auto;
  }

  .text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 55px;
    text-align: center;
    padding: 10px;
    font-family: 'Archivo Black';
  }
.title{
    text-align: center;
    font-size: 40px;
    font-family: 'Kanit';
}
.separacion{
    display: flex;
    align-items: center;
}
.izq,.der{
    flex: 1;
    padding: 20px;
}
.desk{
    font-family: 'Open Sans';
    font-size: 1.1rem;
    padding: 8px 15px 0px;
}
.der{
    align-items: center;
}
.ttt{
    font-family: 'Roboto';
    text-align: center;
}
.lore-lobo{
    font-family: 'Open Sans';
    padding: 0px 60px 0px;
    font-size: 1.1rem;
}
.de-1{
    align-items: center;
    text-align: center;
    padding: 20px 0px 0px;
    
}
.imghor{
    height: 350px;
    width: auto;
    border-radius: 20px;
}
.imgtam{
    height: 300px;
    width: auto;
    padding: 20px 0px 0px;
    border-radius: 20px;
}
.lobox{
    height: 500px;
    width: auto;
    padding: 10px 0px 0px;
    border-radius: 20px;
}
.logs{
    display: flex;
    align-items: center;
    padding: 50px 50px 20px;
}
.end{
    background-color: black;
}
.red{
    background-image: url("img/red%20log%20bl.png");
    background-size: 100% 100%;
    padding: 80px 90px 0px;
    transition: 0.2s;
}
.red:hover{
    background-image: url("img/team red-logo.png");
    background-size: 100% 100%;
}

.repro{
    padding: 30px 0px 30px;
}
.title-2{
    font-family: 'Roboto';
    text-align: center;
    padding: 0px 0px 20px;
}
.text-2{
    padding: 0px 50px 0px;
    font-family: 'Open Sans';
    font-size: 1.1rem;
}
.casa{
    display: flex;
    align-items: center;
}
.IZ,.DE{
    padding: 20px;
    flex: 1;
    align-items: center;
}
.textcolor{
    color: rgb(177, 94, 255);
}
.butts{
    border-radius: 9px;
background: linear-gradient(145deg, #939393, #aeaeae);
box-shadow:  5px 5px 10px #6f6f6f,
             -5px -5px 10px #d7d7d7;
             
             border-color: #e30c0c00;
             font-family: 'Poppins';
             color: white;
             font-size: 15px;
}
.butts:hover{
    background: linear-gradient(145deg, #555555, #464646);
}
.fonter{
    font-family: 'Poppins';
}
.titlexd{
    font-family: 'Roboto';
    text-align: center;
    font-size: 30px;
}
.text-3{
    font-family: 'Open Sans';
    padding: 0px 50px 0px;
    font-size: 1.1rem;
}
.funtes{
    padding: 30px 0px 30px;
    background-color: rgb(209, 209, 209);
}
.text-4{
    text-align: center;
    font-family: 'Poppins';
    font-size: 30px;
    font-weight: 20px;
}
.line{
    width: 75%;
    height: 2px;
    color: white;
}
.conditions{
    text-align: center;
    color: #ffffff;
    font-family: 'Open Sans';
    font-size: 1.1rem;
    padding: 30px 100px 30px;
}
.apa{
    text-align: center;
    color: #ffffff;
    font-family: 'Open Sans';
    font-size: 1.1rem;
    padding: 0px 100px 0px;
}
.stt2{
    color: rgb(74, 144, 249);
    text-decoration: none;
    transition: 0.2s;
}
.stt2:hover{
    color: gray;
}
.stt{
    color: rgb(168, 203, 255);
    text-decoration: none;
    transition: 0.2s;
}
.stt:hover{
    color: rgb(58, 58, 58);
}
.redlink{
    color: white;
}
.redlink:hover{
    color: rgb(58, 58, 58);
}
.sosial{
    padding: 10px 5px 0px;
    font-family: 'logs';
    color: white;
    text-decoration: none;
    font-size: 3rem;
    transition: 0.2s;
   }
   .sosial:hover{
       color: rgb(131, 0, 0);
       font-size: 3.3rem;
   }
.term{
    padding: 30px 200px 50px;
}
.condi{
    color: #ffffff;
    font-size: 1.1rem;
    text-decoration: none;
    transition: 0.3s;
    font-family: 'Open Sans';
}
.condi:hover{
    color: rgb(58, 58, 58);
}
.divi-001{
    display: flex;
}
.iz-001,.de-001{
    flex: 1;
}
.Copyrigth{
    color: #ffffff;
    font-size: 1.1rem;
    padding: 20px 200px 40px;
    font-family: 'Open Sans';
}
#sep{
    padding: 20px 50px 20px;
    font-family: 'Open Sans';
    font-size: 1.1rem;
    margin: 0%;
}
.colorb{
    background-color: #ffffff;
}
.check{
    font-family: 'Open Sans';
    padding: 10px 0px 10px;
}
.tranfor-001{
    font-family: 'Roboto';
}
.tranfor-002{
    text-decoration: underline;
}
.tranfor-003{
    font-size: 1.3rem;
}