:root{     --cl-black:#000;     --cl-white:#FFF;     --cl-transparent: transparent;      --cl-orange-logo:#ff4901;     --cl-background:#f1f1f1;             --cl-white-cream:#fdfdfd;      --cl-grey-lighten-3:#f5f5f5;     --cl-grey-lighten-2:#e0e0e0;     --cl-grey-lighten-1:#bdbdbd;     --cl-grey:#9e9e9e;     --cl-grey-darken-1:#757575;     --cl-grey-darken-2:#616161;     --cl-grey-darken-3:#212121;       --cl-red-lighten-3:#ffcdd2;     --cl-red-lighten-2:#e57373;     --cl-red-lighten-1:#ef5350;     --cl-red:#f44336;     --cl-red-darken-1:#e53935;     --cl-red-darken-2:#d32f2f;     --cl-red-darken-3:#b71c1c;      --cl-blue-lighten-4:#e1f5fe;     --cl-blue-lighten-3:#bbdefb;     --cl-blue-lighten-2:#90caf9;     --cl-blue-lighten-1:#64b5f6;     --cl-blue:#1e88e5;     --cl-blue-darken-1:#1976d2;     --cl-blue-darken-2:#1565c0;     --cl-blue-darken-3:#0d47a1;        --cl-green-lighten-3:#a5d6a7;     --cl-green-lighten-2:#81c784;     --cl-green-lighten-1:#66bb6a;     --cl-green:#4caf50;     --cl-green-darken-1:#388e3c;     --cl-green-darken-2:#2e7d32;     --cl-green-darken-3:#1b5e20;       --cl-orange-lighten-3:#ffe0b2;     --cl-orange-lighten-2:#ffb74d;     --cl-orange-lighten-1:#ffa726;     --cl-orange:#ff9800;     --cl-orange-darken-1:#f57c00;     --cl-orange-darken-2:#ef6c00;     --cl-orange-darken-3:#e65100;        --cl-blue-grey-lighten-3:#cfd8dc;      --cl-blue-grey-lighten-2:#b0bec5;     --cl-blue-grey-lighten-1:#78909c;     --cl-blue-grey:#607d8b;     --cl-blue-grey-darken-1:#546e7a;     --cl-blue-grey-darken-2:#455a64;     --cl-blue-grey-darken-3:#37474f;         --cl-pink-lighten-4:#eeaec3;     --cl-pink-lighten-3:#f48fb1;     --cl-pink-lighten-2:#f06292;     --cl-pink-lighten-1:#ec407a;     --cl-pink:#e91e63;     --cl-pink-darken-1:#d81b60;     --cl-pink-darken-2:#ad1457;     --cl-pink-darken-3:#880e4f;               --cl-purple-lighten-3:#ce93d8;     --cl-purple-lighten-2:#ea80fc;     --cl-purple-lighten-1:#ba68c8;     --cl-purple:#9c27b0;     --cl-purple-darken-1:#7b1fa2;     --cl-purple-darken-2:#6a1b9a;     --cl-purple-darken-3:#4a148c;      --cl-teal-lighten-3:#80cbc4;     --cl-teal-lighten-2:#4db6ac;     --cl-teal-lighten-1:#26a69a;     --cl-teal:#009688;     --cl-teal-darken-1:#00897b;     --cl-teal-darken-2:#00796b;     --cl-teal-darken-3:#004d40;      --cl-brown:#795548;     --cl-yellow:#ffeb3b;     --cl-yellow-darken-1:#fbc02d;          --cl-lime:#c6ff00;     --cl-light-green:#76ff03;     --cl-green-whats:#0DC143;                --font-oxygen: 'Oxygen', sans-serif;     --font-roboto: 'Roboto', sans-serif;      --font-nunito: 'Nunito', sans-serif;      }    html, body {     height: 100%;     line-height: 1.5;     font-family: -apple-system,BlinkMacSystemFont,segoe ui,Roboto,Oxygen-Sans,Ubuntu,Cantarell,helvetica neue,sans-serif; }  a{   color:var(--cl-blue-darken-3);   font-weight: 600;   text-decoration: none;   -webkit-transition: 0.3s ease-in-out;   -moz-transition: 0.3s ease-in-out;   -o-transition: 0.3s ease-in-out; } a:hover, a:hover:visited{   color:var(--cl-blue-darken-2); }   .transition,.animate{     -webkit-transition: .3s ease-in-out;    -moz-transition: .3s ease-in-out;    -o-transition: .3s ease-in-out; } .hide{   display: none !important; }  h1, h2, h3, h4, h5, h6{   font-weight: 700;   margin: 15px 0;   font-size: 1.6rem; }  img, video {   height: auto;   max-width: initial; }  .hr{   height: 1px;   border-bottom: 1px dotted var(--cl-grey);   margin:7px 0; } .space{   display: block;   width: 100%;   height: 30px; }  .left{ float: left;} .center{ margin:0 auto} .right{ float: right;}  .text-center{text-align: center;} .text-right{text-align: right;}  .text-small{ font-size: 0.8rem; } .text-medium{ font-size: 1rem; } .text-big{ font-size: 1.2rem; } .text-larger{ font-size: 1.4rem; }  .text-orange{ color: #a93f05; } .text-yellow{ color: var(--cl-yellow-darken-1); } .text-grey{ color: var(--cl-grey-darken-1); } .text-red{ color: var(--cl-red-darken-3); } .text-green{ color: var(--cl-green-darken-2); } .text-blue{ color: var(--cl-blue); } .text-purple{ color: var(--cl-purple-lighten-1); }  .text-bold{ font-weight: bold; }   .nowrap{   overflow: hidden;     white-space: nowrap;     text-overflow: ellipsis; } .grid2{   display: grid;   grid-template-columns: 49% 49%;   column-gap: 2%; } .grid3{   display: grid;   grid-template-columns: 32% 32% 32%;   column-gap: 2%; } .grid4{   display: grid;   grid-template-columns: repeat(4,23%);   column-gap: 2.5%; }  .fixed { position: fixed; }  .mb-5{ margin-bottom: 5px !important; } .mb-10{ margin-bottom: 10px !important; } .mb-15{ margin-bottom: 15px !important; } .mb-20{ margin-bottom: 20px !important; } .mb-25{ margin-bottom: 25px !important; } .mb-30{ margin-bottom: 30px !important; } .mb-50{ margin-bottom: 50px !important; }  .mt-5{  margin-top: 5px !important; } .mt-10{ margin-top: 10px !important; } .mt-15{ margin-top: 15px !important; } .mt-20{ margin-top: 20px !important; } .mt-25{ margin-top: 25px !important; } .mt-30{ margin-top: 30px !important; } .mt-50{ margin-top: 50px !important; }  .ml-5 { margin-left: 5px !important;} .ml-10 {margin-left: 10px !important;} .ml-15 {margin-left: 15px !important;} .ml-20 {margin-left: 20px !important;} .ml-25 {margin-left: 25px !important;} .ml-30 {margin-left: 30px !important;}  .mr-5 {margin-right: 5px !important;} .mr-10 {margin-right: 10px !important;} .mr-15 {margin-right: 15px !important;} .mr-20 {margin-right: 20px !important;} .mr-25 {margin-right: 25px !important;} .mr-30 {margin-right: 30px !important;}    .pt-5{ padding-top: 5px !important; } .pt-10{ padding-top: 10px !important; } .pt-15{ padding-top: 15px !important; } .pt-20{ padding-top: 20px !important; } .pt-25{ padding-top: 25px !important; } .pt-30{ padding-top: 30px !important; } .pt-50{ padding-top: 50px !important; }  .pb-5{ padding-bottom: 5px !important; } .pb-10{ padding-bottom: 10px !important; } .pb-15{ padding-bottom: 15px !important; } .pb-20{ padding-bottom: 20px !important; } .pb-25{ padding-bottom: 25px !important; } .pb-30{ padding-bottom: 30px !important; }  .pb-50{ padding-bottom: 50px !important; }  .pl-5{ padding-left: 5px !important; } .pl-10{ padding-left: 10px !important; } .pl-15{ padding-left: 15px !important; } .pl-20{ padding-left: 20px !important; } .pl-25{ padding-left: 25px !important; } .pl-30{ padding-left: 30px !important; } .pl-50{ padding-left: 50px !important; }  .pr-5{ padding-right: 5px !important; } .pr-10{ padding-right: 10px !important; } .pr-15{ padding-right: 15px !important; } .pr-20{ padding-right: 20px !important; } .pr-25{ padding-right: 25px !important; } .pr-30{ padding-right: 30px !important; } .pr-50{ padding-right: 50px !important; }   body{     margin: 0;     padding: 0;     position: relative;     background-color: var(--cl-background);     min-height:100vh;     flex-direction:column;     display:flex; }  header{  }  main{     flex: 1 0 auto;     margin-top: 50px;     padding-bottom: 30px;     display: block; }  main .content{     display: grid;     overflow: hidden; }  footer{     flex-shrink: 0; } main, header, footer{   position: relative; }      .social {     display:inline-block;     overflow:hidden;     color:transparent;     font-size:.9rem;     line-height:2rem;     cursor:pointer;     opacity:1!important;     padding:3px 0;     background-color:rgba(255,255,255,.8);     -webkit-transition:all .2s ease-in-out;     -o-transition:all .2s ease-in-out;     transition:all .2s ease-in-out   }   .social .icon {     background-image:url(../images/icons.webp);     background-position:0 0;     width:30px;     height:30px;     border-radius:5px;     display:block;     float:left;     color:transparent;     -webkit-transition:0.3s ease-in-out;     -moz-transition:0.3s ease-in-out;     -o-transition:0.3s ease-in-out   }   .social .icon {     opacity:.7;     -webkit-transition:0.4s ease-in-out;     -moz-transition:0.4s ease-in-out;     -o-transition:0.4s ease-in-out   }   .social:hover .icon {     opacity:1   }   .social.twitter:hover,   footer .top .social-box .social.twitter:hover {     background-color:#209CED   }   .social.youtube:hover,   footer .top .social-box .social.youtube:hover {     background-color:#FD0203   }   .social.facebook:hover,   footer .top .social-box .social.facebook:hover {     background-color:#0D76EE   }   .social.discord:hover,   footer .top .social-box .social.discord:hover {     background-color:#5865F2   }    .social.instagram:hover,   footer .top .social-box .social.instagram:hover {     background:rgb(112,70,206);     background:-moz-linear-gradient(190deg,rgba(112,70,206,1) 0%,rgba(252,22,139,1) 44%,rgba(255,220,112,1) 100%);     background:-webkit-linear-gradient(190deg,rgba(112,70,206,1) 0%,rgba(252,22,139,1) 44%,rgba(255,220,112,1) 100%);     background:linear-gradient(190deg,rgba(112,70,206,1) 0%,rgba(252,22,139,1) 44%,rgba(255,220,112,1) 100%)   }   .social.tiktok:hover,   footer .top .social-box .social.tiktok:hover {     background-color:#000   }   .social.feed:hover,   footer .top .social-box .social.feed:hover {     background-color:var(--cl-orange-logo)   }   .social.pinterest:hover,   footer .top .social-box .social.pinterest:hover {     background-color:#E50122   }   .social.whatsapp:hover,   footer .top .social-box .social.whatsapp:hover {     background-color:#2AD048   }    .icon {      background-image:url(../images/icons.webp);     background-position:0 0;     width:30px;     height:30px;     display:inline-block;      overflow:hidden;     color:transparent;     -webkit-transition:0.3s ease-in-out;     -moz-transition:0.3s ease-in-out;     -o-transition:0.3s ease-in-out   }   .icon.big {     width:45px;     height:45px   }   .icon.giant {     width:100px;     height:100px   }   .icon.black {     -webkit-filter:invert(100%);     filter:invert(100%)   }   .icon.grey {     -webkit-filter:invert(40%);     filter:invert(40%)   }   .icon.twitter {     background-position:0 0   }   .icon.youtube {     background-position:-30px 0   }   .icon.facebook {     background-position:-60px 0   }   .icon.instagram {     background-position:-90px 0   }   .icon.steam {     background-position:-180px -60px   }   .icon.discord {      background-position:-210px -60px   }   .icon.tiktok {     background-position:-120px 0   }   .icon.feed {     background-position:-150px 0   }   .icon.pinterest {     background-position:-210px 0   }   .icon.whatsapp {     background-position:-180px 0   }   .icon.search {     background-position:-270px 0   }   .icon.heart {     background-position:0 -30px   }   .icon.arrow {     background-position:-30px -30px   }   .icon.star {     background-position:-60px -30px   }   .icon.clock {     background-position:-90px -30px   }   .icon.info {     background-position:-120px -30px   }   .icon.question {     background-position:-150px -30px   }   .icon.marker {     background-position:-180px -30px   }   .icon.date {     background-position:-210px -30px   }   .icon.view {     background-position:-240px -30px   }   .icon.trash {     background-position:-270px -30px   }   .icon.enter {     background-position:0 -60px   }   .icon.mail {     background-position:-30px -60px   }   .icon.book {     background-position:-60px -60px   }   .icon.person {     background-position:-90px -60px   }   .icon.menu {     background-position:-120px -60px   }   .icon.cross {     background-position:-150px -60px   }   .icon.giant.play {     background-position:-200px -240px   }     .btn-go-top {     display:block;     overflow:hidden;     position:fixed;     cursor: pointer;     bottom:20px;     right:20px;     border-radius:5px;     background-color:var(--cl-orange-logo);     color:#FFF;     opacity:.8;     width:35px;     height:35px;     text-align:center;     z-index:15   }   .btn-go-top:hover {     opacity:1;     color:#FFF;  }   .btn-go-top .material-icons {     font-size:1.6rem;     line-height:35px   }   .btn-go-top:hover .material-icons {     color:#FFF   }   .btn {     font-weight:700;     font-size:.9rem;     text-transform:uppercase;     text-align:center;     line-height:40px;     padding:0 5px;     margin-right: 5px;     border-radius:5px;     border:1px;     border-style:solid;     text-decoration:none;     cursor:pointer;     opacity: 1;     -webkit-transition:0.3s ease-in-out;     -moz-transition:0.3s ease-in-out;     -o-transition:0.3s ease-in-out   }   .btn:hover{     opacity: 0.6;     color:#FFF;   }   .btn.btn-big {     width:99%;     margin:0 auto;     display:block;     overflow:hidden   }   .btn.btn-small {     min-width:120px;     padding-left:15px;     padding-right:15px;     display:inline-block;     overflow:hidden;     line-height:30px   }   .btn.btn-medium {     max-width:300px;     width: 90%;     margin:0 auto;     display:block;     overflow:hidden   }   .btn.btn-pq {     margin:0px 3px;     display:inline-block;     padding:2px;     line-height:1.5rem;     font-size:.9rem;     font-weight:400   }   .btn.center {     margin:0 auto;     display:block;     max-width:300px;     width:99%   }   .btn.tag {     text-transform:uppercase;     padding:5px 10px;     margin:3px 3px;     display:inline-block;     font-size:.8rem;     line-height:1.3rem;     border-radius:0;     font-weight:600;     background-color:var(--cl-grey-lighten-1);     border-color:var(--cl-grey-lighten-1);     color:var(--cl-grey-darken-1)   }   .btn.tag:hover {      background-color:var(--cl-orange);     border-color:var(--cl-orange);     color:var(--cl-white)   }   .btn.tag span {     display:inline-block;     margin-left:7px;     font-size:.75;     color:var(--cl-grey);     -webkit-transition:0.3s ease-in-out;     -moz-transition:0.3s ease-in-out;     -o-transition:0.3s ease-in-out   }   .btn.tag:hover span {     color:var(--cl-grey-clean)   }   .btn.clean {     background-color:var(--cl-white);     border-color:var(--cl-grey-darken-2);     color:var(--cl-grey) !important;   }   .btn.clean:hover {     background-color:var(--cl-grey-lighten);     border-color:var(--cl-grey);     color:var(--cl-grey) !important;   }   .btn.green {     background-color:var(--cl-green-darken-1);     border-color:var(--cl-green-darken-1);     color:var(--cl-white) !important;   }   .btn.green-whats {     background-color:var(--cl-green-whats);     border-color:var(--cl-green-whats);     color:var(--cl-white) !important;   }   .btn.black {     background-color:var(--cl-black);     border-color:var(--cl-black);     color:var(--cl-white) !important;   }   .btn.grey {     background-color:var(--cl-blue-grey);     border-color:var(--cl-blue-grey);     color:var(--cl-white) !important;   }   .btn.grey-clean {     background-color:var(--cl-grey-lighten-1);     border-color:var(--cl-grey-lighten-1);     color:var(--cl-grey-darken-3) !important;   }   .btn.red {     background-color:var(--cl-red-darken-2);     border-color:var(--cl-red-darken-2);     color:var(--cl-white) !important;   }      .btn.blue-facebook {     background-color:rgb(16,119,240);     border-color:rgb(16,119,240);     color:var(--cl-white) !important;   }   .btn.blue-twitter {     background-color:rgb(34,154,239);     border-color:rgb(34,154,239);     color:var(--cl-white) !important;   }   .btn.instagran{     background:rgb(112,70,206);     background:-moz-linear-gradient(190deg,rgba(112,70,206,1) 0%,rgba(252,22,139,1) 44%,rgba(255,220,112,1) 100%);     background:-webkit-linear-gradient(190deg,rgba(112,70,206,1) 0%,rgba(252,22,139,1) 44%,rgba(255,220,112,1) 100%);     background:linear-gradient(190deg,rgba(112,70,206,1) 0%,rgba(252,22,139,1) 44%,rgba(255,220,112,1) 100%);      color:var(--cl-white) !important;   }   .btn.orange {     background-color:var(--cl-orange-darken-3);     border-color:var(--cl-orange-darken-3);     color:var(--cl-white) !important;   }   .btn.purple {     background-color:var(--cl-purple-darken-1);     border-color:var(--cl-purple-darken-1);     color:var(--cl-white) !important; } .btn .icon {     display:inline-block;     margin-bottom:-10px;     margin-right:5px; }  .btn .material-icons{   font-size: 1.3rem;   line-height: 1.5rem; }  .btn.red .material-icons, .btn.green .material-icons{   color: var(--cl-white); }  .overlay, .overlayView{     display: block;     overflow: hidden;     position: fixed;     left: 0;     top: 0;     bottom: 0;     right: 100%;     opacity: 0;     z-index: 998;     background-color: rgba(0,0,0,.7);     -webkit-transition: all .4s ease-in-out;     -o-transition: all .4s ease-in-out;     transition: all .4s ease-in-out; } .overlay.view, .overlayView{     right: 0;     opacity: 1; }    header{   position:fixed;    top:0;   left: 0;   right: 0;   z-index: 10;   font-family: var(--font-oxygen);   background-color: var(--cl-grey-darken-3);   border-bottom:2px solid var(--cl-orange-logo); } header nav{   display: block;         margin:0 30px;   max-height: 50px; } .medium header nav{   max-width: 1350px;   width: 94%;   margin: 0 auto; }   header nav .logo{  display: block;    float: left;    position: relative;  overflow: hidden; } header nav .logo img{   width: auto;   height: 40px;   margin: 5px 0; }   header nav .item{   display: block;     float: left;     position:relative;   max-height: 50px;   line-height: 50px;     font-size: 0.9rem;   text-transform: uppercase;   letter-spacing: 2px;    font-weight: 600;   color: var(--cl-white);   padding:0px 10px;   background-color:transparent;   overflow: hidden;    -webkit-transition: .3s ease-in-out;   -moz-transition: .3s ease-in-out;   -o-transition: .3s ease-in-out; }  header nav .item:hover{   overflow:initial;   background-color: var(--cl-grey-darken-2);   color: var(--cl-white); }  header nav .item.w-submenu > a{   color: var(--cl-white);   display: block;     line-height: 50px;    font-weight: 600;  }  header nav .item.w-submenu{   padding-right: 25px; } header nav .item.w-submenu::after{   content: '\203A';   transform: rotate(90deg);   position: absolute;   top: 2px;   right: 5px;   color: var(--cl-grey-lighten-1);   font-size: 1.5rem;   -webkit-transition: .3s ease-in-out;   -moz-transition: .3s ease-in-out;   -o-transition: .3s ease-in-out; } header nav .item.w-submenu:hover::after{   color:var(--cl-white) }  header nav .item .submenu{   display: block;   opacity: 0;   position: absolute;      z-index: 11;   top: 150%;   left: 0px;   max-height: 0px;   background-color: var(--cl-white);   min-width: 120px;   max-height: 0;   box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px,        rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;   -webkit-transition: .3s ease-in-out;   -moz-transition: .3s ease-in-out;   -o-transition: .3s ease-in-out; } header nav .item .submenu.long{   min-width: 250px; } header nav .item:hover .submenu{   opacity: 1;   display: block;   top:100%;   max-height: 1000px;   opacity: 1; }  header nav .item .submenu a{   display: block;   padding: 5px 10px;   font-size: 0.8rem;   line-height: 1.8rem;   font-weight: 600;   text-transform: uppercase;   background-color: transparent;    color: var(--cl-grey-darken-2);   -webkit-transition: .3s ease-in-out;   -moz-transition: .3s ease-in-out;   -o-transition: .3s ease-in-out;   letter-spacing: 1px; }  header nav .item .submenu a:hover{   background-color: var(--cl-grey-lighten-3); }  header nav .menu-btn, header nav .button{   display: block;   float: right;   width: 30px;   height: 30px;   padding:10px;   cursor: pointer;   background-color: transparent;   -webkit-transition: .3s ease-in-out;   -moz-transition: .3s ease-in-out;   -o-transition: .3s ease-in-out; } header nav .menu-btn:hover, header nav .button:hover{   background: var(--cl-orange-logo); } header nav .menu-btn{   float: left; }     main .nav-mobile {     display: block;     overflow: hidden;     position: fixed;     left: -500px;     top: 0;     bottom: 0;     width: 90%;     max-width: 320px;     z-index: 999;     font-family: var(--font-oxygen);     border-top: 3px solid var(--cl-orange-logo);     -webkit-transition: all .4s ease-in-out;     -o-transition: all .4s ease-in-out;     transition: all .4s ease-in-out;     box-shadow: rgba(0,0,0,.25) 0 14px 28px,rgba(0,0,0,.22) 0 10px 10px;     background: rgb(255,255,255); } main .nav-mobile.view {     left: 0; }    main .nav-mobile .logo {     display: block;     text-align: center;     margin: 20px 50px 10px; } main .nav-mobile .logo img {     width: 100%;     max-width: 230px;     height: auto; }   main .nav-mobile .close {     position: absolute;     display: block;     cursor:pointer;      top: 5px;     right: 5px;     padding-top: 3px;     width: 25px;     height: 25px;     line-height: 1.1rem;     font-size: 1.4rem;      text-decoration: none;     color: #444;     font-weight: 700;     background-color: rgb(255,255,255,0);     border-radius: 3px;     text-align: center;     -webkit-transition: all .2s ease-in-out;     -o-transition: all .2s ease-in-out;     transition: all .2s ease-in-out; } main .nav-mobile .close:hover{     background-color: rgb(0,0,0,0.08); }  main .nav-mobile .items{     display: block;     overflow: hidden;     margin:20px 0; }  main .nav-mobile .items .title{   display: block;   overflow: hidden;   font-size: 0.85rem;   font-weight: 600;   line-height: 30px;   padding: 10px 20px 0;   text-transform: uppercase;   color: var(--cl-grey);   letter-spacing: 1px; }  main .nav-mobile .items a{   color: var(--cl-grey-darken-2);   display: block;   overflow: hidden;   font-size: 0.95rem;   line-height: 30px;   padding: 5px 20px;   letter-spacing: 1px;   text-decoration: none;   opacity: 1;   background-color: rgb(255,255,255,0);   -webkit-transition: all .2s ease-in-out;   -o-transition: all .2s ease-in-out;   transition: all .2s ease-in-out;   text-transform: uppercase;  } main .nav-mobile .items a:hover{     background-color: rgba(0,0,0,0.02);          opacity: 1;     padding-left: 30px; }  main .nav-mobile .items a .material-icons{   float: left;   font-size: 1.4rem;   margin-top: 5px;   margin-right: 7px;   color: rgba(0,0,0,0.4); }  main .nav-mobile .items a span.icon{     float: left;     margin-right: 10px; }  main .nav-mobile .items .arcodion{     display: block; }  main .nav-mobile .items .arcodion > a::after{     content: '\203A';     margin-left: 7px;     color: #CCC;     font-size: 1.5rem;     display: block;     float: right;     margin-top: -3px;     transform: rotate(0deg);     -webkit-transition: all .2s ease-in-out;     -o-transition: all .2s ease-in-out;     transition: all .2s ease-in-out; } main .nav-mobile .items .arcodion:hover > a::after{     transform: rotate(90deg);     margin-top: 0px; }   main .nav-mobile .items .arcodion > .subitems{     display: block;     overflow: hidden;     max-height: 0px;     -webkit-transition: all .8s ease-in-out;     -o-transition: all .8s ease-in-out;     transition: all .8s ease-in-out; } main .nav-mobile .items .arcodion:hover > .subitems{     max-height: 1000px; }    main .nav-mobile .items .arcodion > .subitems > a{     font-size: 0.9rem;     line-height: 1.3rem;     letter-spacing: initial;     padding: 7px 5px 7px 45px; } main .nav-mobile .items .arcodion > .subitems > a:hover{     padding-left: 50px; } main .nav-mobile .items .arcodion > .subitems > a::before{     content: '\203A';     margin-right: 10px;     color: #CCC;     font-size: 1.5rem;     display: block;     float: left;     margin-top: -3px; }  main .nav-mobile .buttons{     display: block;     overflow: hidden;     padding: 10px 20px 2px; } main .nav-mobile .buttons > a{     margin-bottom:15px; } main .nav-mobile .buttons > a span.icon{     margin-right: 5px;     margin-left:-35px }   main .nav-mobile .buttons .checkbox{     display: block; }         .toggler-wrapper { 	display: block; 	width: 45px; 	height: 25px; 	cursor: pointer; 	position: relative; }  .toggler-wrapper .label-text{   position: absolute;   right: -200px;   left: 55px;    top: 1px;   font-size: 1rem;   line-height: 1.4rem; }   .toggler-wrapper input[type="checkbox"] { 	display: none; }  .toggler-wrapper input[type="checkbox"]:checked+.toggler-slider { 	background-color: #44cc66; } .toggler-wrapper input[type="checkbox"]:checked+.toggler-slider.red { 	background-color: var(--cl-red-darken-1); }   .toggler-wrapper .toggler-slider { 	background-color: #ccc; 	position: absolute; 	border-radius: 100px; 	top: 0; 	left: 0; 	width: 100%; 	height: 100%; 	-webkit-transition: all 300ms ease; 	transition: all 300ms ease; }  .toggler-wrapper .toggler-knob { 	position: absolute; 	-webkit-transition: all 300ms ease; 	transition: all 300ms ease; } .toggler-wrapper.style-1 input[type="checkbox"]:checked+.toggler-slider .toggler-knob { 	left: calc(100% - 19px - 3px); }  .toggler-wrapper.style-1 .toggler-knob { 	width: calc(25px - 6px); 	height: calc(25px - 6px); 	border-radius: 50%; 	left: 3px; 	top: 3px; 	background-color: #fff; }       main .container{   display: block;   overflow: hidden;   margin:30px;   padding:20px;   background-color: var(--cl-white-cream);   color:var(--cl-grey-darken-3); } main .container.no-bg{   background-color: transparent;   padding:0px; } .medium main .container{   max-width: 1350px;   width: 90%;   margin: 30px auto; }  main .container aside{   min-height: 700px;   background-color: #999; }         input[type="text"], input[type="email"], input[type="password"], input[type="file"], select, textarea{     background-color: var(--cl-grey-lighten-3);     width: 99.5%;     padding: 10px 10px;     margin: 4px 2px;     display: inline-block;     border: 1px solid var(--cl-grey);     border-radius: 4px;     box-sizing: border-box;     -webkit-transition: all .3s ease-in-out;     -o-transition: all .3s ease-in-out;     transition: all .3s ease-in-out;     font-size: 0.9rem;     font-weight: inherit;     line-height: 1.3rem;     letter-spacing: 0.7px; }  textarea{   letter-spacing: -0.5px; } input[type="text"]:hover, input[type="text"]:focus, textarea:hover, textarea:focus,  select:hover, select:focus{     background-color: var(--cl-white); }  input:not([type="submit"]).alert, input:not([type="submit"]).alert:hover, input:not([type="submit"]).alert:focus, input:not([type="submit"]).alert:focus-visible, textarea.alert, textarea.alert:hover, textarea.alert:focus, textarea.alert:focus-visible, select.alert, select.alert:hover, select.alert:focus, select.alert:focus-visible{     border: 1px solid var(--cl-red);     background-color: var(--cl-red-lighten-3); }  input:not([type="submit"]).readonly:hover, input:not([type="submit"]).readonly:focus, textarea.readonly:hover, textarea.readonly:focus{     background-color: var(--cl-grey-lighten-1);     border: 1px solid var(--cl-grey); } select:hover,select:focus{     background-color: var(--cl-white);     border: 1px solid var(--cl-grey-lighten-1); }   .place-value::before{     content: "R$ ";     color:var(--cl-grey); } .place-km::after{     content: " KM";     color:var(--cl-grey); }  select.clean{     width: 100%;     padding:10px 20px;     border: 1px solid var(--cl-grey);     border-radius: 5px;     background-color: var(--cl-white);          font-size: 0.9rem;     line-height: 1.5rem;     letter-spacing: 1px;      background: var(--cl-white) url("data:image/svg+xml,<svg height='10px' width='10px' viewBox='0 0 16 16' fill='%23000000' xmlns='http://www.w3.org/2000/svg'><path d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/></svg>") no-repeat;     background-position: calc(100% - 0.75rem) center !important;     -moz-appearance:none !important;     -webkit-appearance: none !important;     appearance: none !important; }     .faq{     display: block;     overflow:hidden;     opacity: 1;     margin-top: 0px; } .faq.no-animate{     opacity: 0;     margin-top: 20px; }  .faq > h1, .faq >h2, .faq >h3{     font-style: normal;     font-weight: 3rem;     font-size: 2rem;     line-height: 38px;     color: var(--cl-red); } .faq .item{     font-style: normal;     color: #222222;     display: block;     overflow:hidden;     background: var(--cl-white);     border: 1px solid var(--cl-grey-lighten-1);     border-radius: 5px;     padding:30px 40px;     margin-bottom: 10px;     margin-top: 0;     opacity: 1; } .faq .item.no-animate{     margin-top: 20px;     opacity: 0; }  .faq .item .title{     font-weight: 700;     font-size: 1.2rem;     line-height: 1.5rem;     padding: 0px;     margin: 0px;     color: var(--cl-grey-darken-2); }  .faq .item .text{     font-size: 0.9rem;     line-height: 1.5rem;     padding-top: 15px; }    .pagination{     display: block;     overflow: hidden;     margin:30px 0px;     text-align: right;     font-style: normal;     font-weight: 700;     font-size: 0.9rem;     line-height: 1.2rem;     font-family: var(--font-oxygen); } .pagination a{     display: inline-block;     padding: 10px;     min-width: 20px;     background-color: rgba(0,0,0,0);     color: var(--cl-grey-darken-2);     margin:0px 0px 0px 5px;     text-align: center;     text-decoration: none;     border-radius: 5px; } .pagination a.big{     padding:10px 30px;     background-color: transparent;     color:var(--cl-grey); }   .pagination a:hover, .pagination a.active{     background-color: var(--cl-black);     color:var(--cl-white); }  .pagination a.disabled, .pagination a.disabled:hover{   background-color: rgba(0,0,0,0);   color: var(--cl-grey); }  .pagination .filter{     display: inline-block;     text-align: left;     font-weight: 400;  } .pagination .filter select{     width: auto;     min-width: 150px;     margin: 0 15px; } .pagination .filter select:hover, .pagination .filter select:active{     border-color: var(--cl-grey); }  .pagination.full{     text-align: center; } .pagination.full a, .pagination.full a.big{     width: 100%;     max-width: 300px; } .pagination .m-icon{   position: relative;   top: 3px;   z-index: 2;    } .pagination .m-icon .material-icons{   margin: 0px;   padding: 0px;   font-size: 1.4rem;   line-height: 1rem;   font-weight: 800;   position: relative;   height: 19px;   top: 2px; }     .form > .content .line.form-msg{     text-align: center;     width: 98%;     padding:0px;     margin: 0px;     border:2px solid var(--cl-red-darken-2);     border-radius: 5px;     color:var(--cl-red-darken);     opacity: 0;     max-height: 0px;     -webkit-transition: 0.2s ease-in-out;     -moz-transition: 0.2s ease-in-out;     -o-transition: 0.2s ease-in-out; } .form > .content .line.form-msg{     margin:0px 0.5%; } .form-alert-error {     text-align: center;     width: 100%;     padding: 5px;     margin: 0px;     border:2px solid var(--cl-red-darken-2);     border-radius: 5px;     color:var(--cl-red-darken-2);     font-size: .75rem;     font-weight: 400;     display: block;     box-sizing: border-box;     margin-bottom: 5px; } .form > .content .line.form-msg.show{     max-height: 100px;     opacity: 1;     margin: 0px 0px 15px;     padding:5px 0px; } .form > .content .line.form-msg.show{     margin: 20px 0.5% 10px; }      .card{   display: block;   overflow: hidden;   padding:20px;   background-color: #FFF;   position: relative;   border: 1px solid rgba(0,0,0,0.04); } .card.padding-none{   padding:0; } .card.padding-big{   padding: 40px; } .card.padding-small{   padding: 10px; }   .card > .title{   font-family: var(--font-oxygen);   color: var(--cl-grey-darken-3);   font-weight: 600;   font-size: 1.2rem;   line-height: 1.8rem;   padding-bottom: 5px;   margin-bottom: 5px;   z-index: 1;   border-bottom: 1px dotted rgba(0,0,0,0.3); } .card > .title span{   color: var(--cl-orange-logo); }   .card > .title h1, .card > .title h2, .card > .title h3{   display: inline-block;    position: relative;   z-index: 2;   margin: 0;   padding: 0;   font-weight: 600;   font-size: 1.2rem;   line-height: 1.8rem; }  .card > .title.w-sub{   margin-bottom: 5px; } .card > .title .icon{   float: right;   margin-top: 10px; } .card > .sub-title{   display: block;   overflow: hidden;   font-size: 0.9rem;   margin-bottom: 20px; }    .card > .title .icon{   display: inline-block;   float: left;   margin-top: -3px; } .card > .content{   font-size: 1rem;   line-height: 1.4rem;   display: block;    } .card > .float-btn{      position: absolute;   top:20px;   right: 20px;   width: 250px; }  .card.table{   padding: 0px; } .card.table .content{   display: block;   overflow: hidden; } .card.table .header, .card.table .content .line{   display: grid; } .card.table .header{   font-size: 0.8rem;   line-height: 1.2rem;   font-weight: 700;   text-transform: uppercase;   padding: 7px 10px;   color:var(--cl-grey-darken);   border-bottom: 1px solid var(--cl-grey-lighten-2);   border-top: 1px solid var(--cl-grey-lighten-2); } .card.table .header a{   color:var(--cl-black);   font-weight: 700; } .card.table .header a.active::after{   content:'\2191';   color:var(--cl-grey-darken-1);   margin-left: 5px; } .card.table .header a.asc.active::after{   content:'\2193'; }  .card.table .content.message-error{   font-size: 1rem;   line-height: 2.5rem;   text-align: center;   display: block;   font-weight: 600;   text-transform: uppercase;   padding: 20px 0;   color: var(--cl-red-darken-1); }  .card.table .content .line{   line-height: 1.8rem;   padding: 10px 10px;    font-size: 1rem;   background-color: transparent;   border-bottom: 1px solid var(--cl-grey-lighten-2); } .card.table .content .line:hover{   background-color: var(--cl-blue-lighten-4); }    .badge{   display: inline-block;   background-color: var(--cl-blue-grey-darken-1);   color:var(--cl-white);   font-size: 0.7rem;   font-weight: 700;   text-transform: uppercase;   padding:0px 10px;   text-align: center;   border-radius: 5px;   margin-right: 5px;   letter-spacing: 0.5px;   opacity: 1;   -webkit-transition:0.3s ease-in-out;   -moz-transition:0.3s ease-in-out;   -o-transition:0.3s ease-in-out } .badge:hover{   color:var(--cl-white) !important;   opacity: 0.6; } .badge.green{   background-color: var(--cl-green-darken-1); } .badge.orange{   background-color: var(--cl-orange-darken-3); } .badge.purple{   background-color: var(--cl-purple-darken-1); } .badge.red{   background-color: var(--cl-red-darken-2); } .badge.blue{   background-color: var(--cl-blue-darken-1); } .badge.grey{   background-color: var(--cl-grey-lighten-2);   color:var(--cl-grey-darken-2); } .badge.grey-darken{   background-color: var(--cl-grey-darken-2); }  .badge.grey:hover{   color: var(--cl-grey-darken-2) !important; }   .login-page main{     margin: 0px;     padding: 0px; } .login-page main .container{     margin: 0; } .login-page footer{   margin-top: 0; }  .login-form-bg{   display: block;   width: 100%;    padding: 0px;   margin: 0px;   min-height:100vh;   position: absolute;   background: var(--cl-grey-lighten-2);   background-image:url('../images/bg-login.jpg');   background-position: center center;   background-size: cover;   background-repeat: no-repeat; }  .login-form{   margin: 0px auto;   max-width: 400px;   width: 90%;     padding-top: 30px;   } .login-form .logo{   display: block;   width: 90%;   max-width: 300px;   margin: 50px auto 0; } .login-form .logo img{   width: 100%;   height: auto; } .login-form > .sub-title{   font-size: 1rem;   line-height: 1.4rem;   color: var(--cl-grey-darken-2); } .login-form > .sub-title-2{   font-weight: 600;   font-size: 1rem;   margin-top: 30px;   color: var(--cl-grey-lighten-2); } .login-form > .card{   padding: 10px 30px 30px 30px;   margin-top: 30px;   box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;   } .login-form > .card > .page-title h1{   background-color: rgb(255,255,255); } .login-form > .card.actions{   display: flex;   text-decoration: none;   line-height: 1.8rem;   font-size: 1rem;   font-weight: 600;   padding: 20px 30px;   margin-top: 10px;   color: var(--cl-orange-darken-3); } .login-form > .card.actions:hover{   color:var(--cl-orange-darken-2); }  .login-form > .card.actions .icon{   margin-right: 10px; }   .login-form > .card.box .request-pass{   font-size: 0.9rem;   line-height: 1.2rem;   margin-top: 20px;   font-weight: 600;   display: inline-block;   text-transform: uppercase;   color: var(--cl-orange-darken-3); } .login-form > .card.box .request-pass:hover{   color: var(--cl-orange-darken-2); }   .float-modal{   background-color: var(--cl-white);   display: block;   position: fixed;   z-index: 999;   min-height: 50px;   top: -150%;   max-width: 750px;   width: 80%;   margin: 0 50%;   -ms-transform: translateX(-50%);   transform: translateX(-50%);   box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;   -webkit-transition: all .4s ease-in-out;   -o-transition: all .4s ease-in-out;   transition: all .4s ease-in-out; } .float-modal.view {   top: 80px; } .float-modal > .close{   background-color: var(--cl-grey-darken-3);   padding: 5px;   height: 30px;   width: 30px;   font-size: 1.2rem;   line-height: 25px;   text-align: center;   color: var(--cl-white);   border-radius: 50%;   display: block;   position: absolute;   z-index: 11;   right: -15px;   top: -15px;   -webkit-transition: all .2s ease-in-out;   -o-transition: all .2s ease-in-out;   transition: all .2s ease-in-out; } .float-modal > .close:hover{   background-color: var(--cl-black);   color:var(--cl-white); }  .float-modal > .title{   padding: 5px 20px;   font-weight: 800;   font-size: 0.9rem;   line-height: 1.4rem;   background-color: var(--cl-grey-darken-3);   color: var(--cl-white);   text-transform: uppercase; } .float-modal > .content{   padding:20px; }   .tab-div{   display: block;   overflow: hidden; }  .tab-div .tab-bar{   display: block;   overflow: hidden;   margin-bottom: 10px;   border-bottom:1px solid var(--cl-grey); } .tab-div .tab-bar .tab-aba{   display: block;   overflow: hidden;   float: left;   font-size: 0.9rem;   line-height: 1.5rem;   font-weight: 400;   padding:3px 10px;   border:1px solid var(--cl-grey);   border-bottom: none;   color:var(--cl-grey-darken-1);   opacity: 1;   background-color: var(--cl-grey-lighten-2);   margin-left: 10px;   -webkit-transition: all .2s ease-in-out;   -o-transition: all .2s ease-in-out;   transition: all .2s ease-in-out; } .tab-div .tab-bar .tab-aba:hover{   opacity: 0.7; } .tab-div .tab-bar .tab-aba.active{   background-color: var(--cl-blue);   border:1px solid var(--cl-blue-darken-1);   border-bottom: none;   color:#FFF; }   .tab-div .tab-content{   display: none;   overflow: hidden; } .tab-div .tab-content.show{   display: block; }     .sliceBox{	   margin:5px;   position:fixed !important;   padding:15px;   background-color:#FFFFFF;   box-shadow: 1px 1px 3px #333333;   -moz-box-shadow: 1px 1px 3px #333333;   -webkit-box-shadow: 1px 1px 3px #333333;   -webkit-transition: 0.3s ease-in-out;   -moz-transition: 0.3s ease-in-out;   -o-transition: 0.3s ease-in-out;   opacity: 0.0;   -moz-opacity: 0.0;   filter: alpha(opacity=0);   z-index: 1000; } .sliceBoxView{   opacity: 1;   -moz-opacity: 1;   filter: alpha(opacity=100); } .sliceBox .close{   float: right;   position: absolute;   right: -15px;   top: -15px;    z-index:10;   } .sliceBox .close a, .sliceBox .close a:hover{   background-color: #f80;   border-radius: 15px;      color: #fff;   display: block;   font-family: "Lucida Sans Unicode","Lucida Grande",sans-serif;   font-size: 10px;   font-weight: bold;   margin: 5px;   padding: 3px 8px;   text-shadow: 0 1px 1px #666;       text-shadow: 0 1px 1px #666;   box-shadow: 0px 1px 3px #000000;   -moz-box-shadow: 0px 1px 3px #000000;   -webkit-box-shadow: 0px 1px 3px #000000; } .sliceBox .title{   border-bottom: 1px solid #ccc;   color: #BBB;   font-size: 14px;   left: 0;   margin-bottom: 10px;      overflow: hidden;   padding: 10px 15px;   position: absolute;   right: 0;   top: 0;   background-color:#333;   z-index:1; } .sliceBox .sb_content{   overflow:hidden;   width:100%;   padding-top:30px; } .sliceBox .actions{   margin-top: 15px;   text-align: right;   overflow: hidden;   -webkit-transition: 0.3s ease-in-out;   -moz-transition: 0.3s ease-in-out;   -o-transition: 0.3s ease-in-out;   opacity: 0.0;   -moz-opacity: 0.0;   filter: alpha(opacity=0);	 } .sliceBox .actions_view{   opacity: 1;   -moz-opacity: 1;   filter: alpha(opacity=100); }  .sliceBox .sb_content .details{   font-size:11px;   color:#666;	   margin:5px 0px 0px; } .sliceBox .sb_content .input_line{   margin:1px 0px;	 } .sliceBox .sb_content .text{   margin:5px 0px 0px 0px;   overflow:hidden;   font-size:12px;	   line-height:19px; } .sliceBox .sb_content .table{   overflow:hidden;   font-size:11px;   border:1px solid #CCC;   border-top:none;	   margin:5px 0px; } .sliceBox .sb_content .table .line{   overflow:hidden;   border-top:1px solid #CCC;		   background-color:#FFF;   -webkit-transition: 0.4s linear;   -moz-transition: 0.4s linear;   -o-transition: 0.4s linear; } .sliceBox .sb_content .table .line:hover{   background-color:#EFEFEF; } .sliceBox .sb_content .table .line .cell{   overflow:hidden;   float:left;   padding:2px 0px 2px 7px; }   .sliceBox .sb_content .table .line .cell .button{   padding: 2px;   font-size: 10px !important;   text-align: center;    } .sliceBox .sb_content .table .line .cell .loading{   width:25px;   height:25px;   overflow:hidden; } .sliceBox .sb_content .table .line .cell .titleField{   padding: 3px;   margin-top:2px;   border: 1px solid #FFF;   font-size: 12px !important;   width: 95%;   color:#333;   -webkit-transition: 0.4s linear;   -moz-transition: 0.4s linear;   -o-transition: 0.4s linear; } .sliceBox .sb_content .table .line:hover .cell .titleField{   border: 1px solid #CCCCCC; } .sliceBox .sb_content .table .line .l_text{   font-size:11px;   padding-top:7px;	 } .sliceBox .sb_content .table .line .msgNone{   color:#999; } .sliceBox .sb_content .table .line .msgOk{   color: #0C3; } .sliceBox .sb_content .table .line .msgError{   color: #F00; }  .sliceBox .actions .button{   cursor: pointer;   margin: 3px 10px;      padding: 5px 20px;   margin:2px; }  .sliceBox .sb_content .input_line .inputText{   padding:5px; } 
 body{     background-color:#fcfcfc;     background-image: url(../images/bg001.webp);     background-repeat: no-repeat;     background-attachment: fixed;     background-position: center; }  h1, h2, h3, h4, h5 {     border: 0 none;     font-family: var(--font-oxygen);     margin: 0;     padding: 0;     overflow: hidden; }  h1 {     font-size: 2rem;     line-height: 2.6rem;     font-weight: 500; } h2 {     font-size: 1.8rem;     line-height: 2.2rem;     font-weight: 500; } h3 {     font-size: 1.4rem;     line-height: 1.8rem;     font-weight: bold; } h4, h5 {     font-size: 1.2rem;     line-height: 1.6rem;     font-weight: bold; } .hr {     overflow: hidden;     display:block;     width:100%;     height:1px;     background-color: rgba(0,0,0,0.1); }     header{     display: block;     background-color: var(--cl-white);     width: 100%;     margin: 0;     padding: 0;     font-family: var(--font-poppins);     border-top: 4px solid var(--cl-orange-logo);     border-bottom: none;     height: 80px;     box-shadow: 0 0 1em rgba(0,0,0,0.3);     } header nav .menu-btn:hover .icon, header nav .button:hover .icon{     filter: none; } header nav .menu-btn,  header nav .button{     padding: 25px 10px; } header nav .button img{     display: inline-block;     margin-top: -2px;     width: 30px;      height: 30px; }   header nav .logo img {     width: auto;     height: 50px;     margin: 10px 0 20px; }  header nav .item{     color: var(--cl-grey-darken-3);     line-height: 80px;     max-height: 80px;     font-weight: 600;     letter-spacing: 1px; } header nav .item:hover{     color: var(--cl-white);     background-color: var(--cl-orange-logo); } header nav .item.w-submenu > a {     color: var(--cl-grey-darken-3);     line-height: 80px;     font-weight: 600; } header nav .item.w-submenu:hover > a, header nav .item.w-submenu > a:hover{     color: var(--cl-white);    } header nav .item .submenu a{     padding: 10px 15px;     font-size: 0.9rem;     color: var(--cl-grey-darken-3); } header nav .item .submenu a:hover{     color:var(--cl-grey-darken-1); }  header.show-nav-adm{     top:30px } .nav-adm{     position: fixed;     display: block;     overflow: hidden;     top:0px;     left: 0px;     right: 0px;     z-index: 7;      height: 30px;     background-color: #333;     color:var(--cl-grey-lighten-1);     font-size: 1rem;     line-height: 30px;     font-weight: 600;     padding:0px; } .nav-adm.hide{     display: none; } .nav-adm .content{     max-width: 1350px;     width: 90%;     margin:0 auto;     display: grid;     grid-template-columns: 40% 58%;     column-gap: 2%; } .nav-adm span{     display: inline-block;     margin: 0 10px 0 0;     font-weight: 400; } .nav-adm a{     color:#fff;     font-weight: 600;      display: inline-block;     margin: 0 10px 0 0; } .nav-adm a:hover{     color:var(--cl-orange-logo); } .nav-adm a::after{     content: "|";     color:var(--cl-grey-darken-1);     font-size: 0.9rem;     margin-left: 10px; } .nav-adm a.logoff{     float: right; }  .nav-adm a.bt{     color:#FFF;     opacity: 1;     padding: 0 10px;     background-color: var(--cl-blue-grey); } .nav-adm a.bt:hover{     color:#FFF;     opacity: 0.7; } .nav-adm a.logoff:after, .nav-adm a.bt:after{     display: none; }  .nav-adm a.bt.blue{     background-color: var(--cl-blue); } .nav-adm a.bt.green{     background-color: var(--cl-green-darken-1); } .nav-adm a.bt.red{     background-color: var(--cl-red-darken-1); } .nav-adm a.bt.orange{     background-color: var(--cl-orange-darken-2); }      main{     margin-top: 100px; }    footer{     font-size: 0.9rem;     line-height: 1rem;     border-top: 3px solid var(--cl-orange-logo);     background: #111;     margin-top: 50px; } footer .top{     display: block;     overflow: hidden;     color: var(--cl-grey-lighten-2);     padding:30px 0 0; }  footer .top .logo{     display: block;     position: relative;     max-width: 500px;     width: 80%;     margin:0 auto;     text-align: center; } footer .top .logo img{     max-width: 250px;     width: 100%;     height: auto;     position: relative;     z-index: 1;     }    footer .top .links, footer .top .social-box{     display: block;     overflow: hidden;     text-align: center;     padding:10px 20px; } footer .top .links a{     display: inline-block;     padding: 5px 5px;     color: var(--cl-grey-lighten-2);     text-transform: uppercase;     font-size: 0.9rem;     line-height: 2rem;     font-weight: 700; } footer .top .links a:hover{     color: var(--cl-orange-logo); } footer .top .links a::after{     content:'\2022';     margin-left: 10px;     color: var(--cl-grey-darken-2); }  footer .top .links a:last-child::after{     display: none; }    footer .top .social-box .social {     display: inline-block;     background-color: var(--cl-grey-darken-3);     border-radius: 50%;     padding: 5px;     margin: 0px 5px;     height: 30px;     width: 30px; } footer .top .social-box .social:hover{     background-color: initial; }  footer .bottom{     display: block;     overflow: hidden;     padding: 25px 30px;     text-align: center;     color:var(--cl-grey-lighten-1);     line-height: 1.5rem;     font-size: 0.8rem; } footer .bottom a{     color:var(--cl-grey-lighten-2) } footer .bottom a:hover{     color:var(--cl-grey-lighten-3); } footer .bottom .logo{     max-width: 150px;     height: auto;     margin-top: 20px;     display: inline-block; }  footer .top .box.box-social{     float: right; } footer .top .box.box-social .social span.ico{     background-color: var(--cl-orange-logo); } footer .top .box.box-social .social:hover span.ico{     background-color: var(--cl-orange-darken-3); }       .search-view-box{     background-color: var(--cl-white);     display: block;     position: fixed;      z-index: 999;         min-height: 50px;     top: -150%;     max-width: 750px;     width: 80%;     margin: 0 50%;     -ms-transform: translateX(-50%);     transform: translateX(-50%);     box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;      -webkit-transition: all .4s ease-in-out;     -o-transition: all .4s ease-in-out;     transition: all .4s ease-in-out; } .search-view-box.view{     top: 80px; } .search-view-box .btn-search-close{     background-color: var(--cl-grey-darken-3);     padding: 5px;     height: 30px;     width: 30px;     font-size: 1.2rem;     line-height: 25px;     text-align: center;     color: var(--cl-white);     border-radius: 50%;     display: block;     position: absolute;     z-index: 11;     right: -15px;     top: -15px;     -webkit-transition: all .2s ease-in-out;     -o-transition: all .2s ease-in-out;     transition: all .2s ease-in-out;  }  .search-view-box .btn-search-close:hover {     background-color: var(--cl-black);     color:var(--cl-white);  }   .search-box-content{     display: block;     overflow: hidden;     width: 90%;     margin:20px auto 30px;  }  .search-box-content .title{     font-size: 1.3rem;     font-weight: 600;     margin: 10px 3px;     line-height: 1.5rem;  }  .search-box-content form{     display: block;     overflow: hidden;  }  .search-box-content form .search-text{     width: 80%;     float: left;     display: inline-block;     margin-left: 3px;  }  .search-box-content form .btn{     width: 18%;      float: right;     display: inline-block;     margin-top: 4px;  }   .search-box-content .links{     display: grid;     overflow: hidden;     grid-template-columns: repeat(2,50%);  }  .search-box-content .links a{     font-size: 0.9rem;     line-height: 1.4rem;     display: block;     overflow: hidden;     white-space: nowrap;     text-overflow: ellipsis;     padding: 3px 5px 3px 10px;     color:var(--cl-grey-darken-3);  }  .search-box-content .links a:hover{     color:var(--cl-orange-darken-3);  }  .search-box-content .links a::before {     content: "\276F";     margin-right: 10px;     margin-left: 0;     -webkit-transition: all .2s ease-in-out;     -o-transition: all .2s ease-in-out;     transition: all .2s ease-in-out;  }  .search-box-content .links a:hover::before {     margin-right: 5px;     margin-left: 5px;  }     .login-form .title{     display: block;     overflow: hidden;     text-align: center;     position: relative; }  .login-form .title h1{          font-family: var(--font-oxygen);     color: var(--cl-grey-darken-3);     font-size: 2rem;     line-height: 2.5rem;     font-weight: 600;     letter-spacing: -0.5px;     margin: 20px 0;     padding: 0 5px;     text-align: center;     display: inline-block;     z-index: 1;     position: relative; } .login-form .title h1 span{     color: var(--cl-orange-logo); } .login-form .title.medium h1{     font-size: 1.7rem;     line-height: 2.2rem;     margin: 15px 0; } .login-form .title.small h1{     font-size: 1.5rem;     line-height: 2rem;     margin: 5px 0;  } .login-form .title .subtitle{     display: block;     font-family: var(--font-oxygen);     font-size: 1rem;     font-weight: 400;     line-height: 1.3rem;     margin-top: -15px;     margin-bottom: 15px; } .login-form .title .subtitle span, .login-form .title .subtitle strong{     font-weight: 700; }       .page-header {     display: block;     overflow: hidden;     position: relative;     width: 100%;     margin: 0 0 30px 0px;     border-left: 3px solid var(--cl-orange-logo);     padding: 0 0 0 15px; }  .page-header h1, .page-header h2, .page-header h3 {   overflow: hidden;   font-size: 1.7rem;   font-weight: 300;   text-shadow: 1px 0px 1px rgba(0,0,0,0.2); }  .page-title{     display: block;     width: 100%;     position: relative;     padding: 2px 7px;     border-left: 5px solid var(--cl-orange-logo);     text-transform: uppercase;     margin: 0 0 10px 0px; } .page-title h1, .page-title h2, .page-title h3 , .page-title h4, .page-title span{     margin: 0;     padding: 0;     font-size: 1rem;     font-weight: bold;     line-height: 1.2rem; }  .page-header .checkbox-nsfw, .page-title .checkbox-nsfw{     position: absolute;     top:0px;     right: 0px;     text-transform: capitalize;     width: 230px; } .page-header .checkbox-nsfw{     top:10px; } .page-header .checkbox-nsfw .toggler-wrapper .label-text, .page-title .checkbox-nsfw .toggler-wrapper .label-text{     top:0px; }   .page-header .message {     overflow: hidden;     position: relative;     padding: 5px 0;     font-size: 1.2rem;     font-style: italic;     color: var(--cl-grey-darken-3);     text-decoration: underline double var(--cl-grey-lighten-2); } .page-header .details {     overflow: hidden;     position: relative;     padding: 3px 0;     font-size: 1rem;     color: var(--cl-grey-darken-3); } .page-header .details .type {     background-color: var(--cl-orange-logo);     color: var(--cl-white);     padding: 1px 5px;     text-transform: uppercase;     font-weight: bold;     margin-right: 5px; }   .page-header-image{      width: 100%;     display: flex;     align-items: center;     -webkit-justify-content: center;     justify-content: center;     position: relative;     margin-bottom: 30px; } .page-header-image a{     width: 100%;     display: block; } .page-header-image img {     width: 100%;     height: auto;     display: block;      border-bottom: 3px solid var(--cl-orange-logo);      } .page-header-image img.small {     display: none; }  .page-header-image .tag{     left: 15px;     top: 15px;     position: absolute;     background-color: rgba(0,0,0,0.5);     color: #fff;     display: block;     float: left;     width: auto;     height: auto;      padding: 5px 7px;     text-transform: uppercase;     font-size: 0.75rem;     text-shadow: 1px 1px 1px #000;     border-left: 3px solid var(--cl-orange-logo);     font-weight: bold;     -webkit-transition: 0.3s ease-in-out;     -moz-transition: 0.3s ease-in-out;     -o-transition: 0.3s ease-in-out; } .page-header-image:hover .tag{     background-color: var(--cl-orange-logo); }   .page-container{     display: grid;     grid-template-columns: auto 300px;     column-gap: 40px;  }  .page-container.full{     grid-template-columns: 100%;     column-gap: 0px; }  .page-container .content{     display: block;     font-size: 1.1rem;     line-height: 2rem; } .page-container .content > div{     display: block; } .page-container .content .div-space{     display: block;     width: 100%;     height: 15px; }  .page-container .content .discover-list{     grid-template-columns: 100%;     margin: 20px 0;      width: 100%;     line-height: 1.6rem; }   .page-container .content .tags{     display: block;     overflow: hidden;     margin:30px 0;     width: 100%; } .page-container .content .tags span, .page-container .content .tags a{     display: inline-block;      margin: 0 3px;     padding: 2px 5px;     font-size: 1rem;     font-weight: 500;     color: var(--cl-grey-darken-1);     border-bottom: 2px solid rgba(255,255,255,0);     -webkit-transition: 0.3s ease-in-out;     -moz-transition: 0.3s ease-in-out;     -o-transition: 0.3s ease-in-out; } .page-container .content .tags span{     padding-left: 0; } .page-container .content .tags a:hover{     border-bottom: 2px solid var(--cl-orange-logo); }    .page-container .content .user{     width: 100%;     overflow: hidden;     display: grid;     grid-template-columns: 140px auto;     column-gap: 40px;  }  .page-container .content .user .avatar a{     display: inline-block;     overflow: hidden;     width: 140px;     text-align: center; } .page-container .content .user .avatar img{     width: auto;     max-width: 100%;     height: auto;     border-radius: 50%;  } .page-container .content .user .name{     overflow: hidden;     font-size: 1.2rem;     padding-top: 15px; }   .page-container .content .user .details{     overflow: hidden;     font-size: 1rem;     line-height: 1.4rem;     font-style: italic;     padding: 7px 0px;     color:var(--cl-grey-darken-1); } .page-container .content .user .details p{     padding: 0px;     margin: 0px; } .page-container .content .user .subdetails{     font-size: .9rem;     line-height: 1.3rem;     color:var(--cl-grey-darken-1); } .page-container .content .user .subdetails span{     font-weight: 700; }    .news-list{     display: grid;     grid-template-columns: repeat(3,33.3%); }  .news-list .item{     display: block;     padding: 10px; } .news-list .item .content{     display: grid;     grid-template-rows: 255px auto;     height: 100%;     background-color: var(--cl-white);          box-shadow: 1px 1px 10px -5px rgba(0,0,0,0.5);     -webkit-transition: 0.3s ease-in-out;     -moz-transition: 0.3s ease-in-out;     -o-transition: 0.3s ease-in-out; } .news-list .item .content:hover{     box-shadow: 1px 1px 10px -5px rgba(0,0,0,0.9); }  .news-list .item .content .image{     display: block;     overflow: hidden;     position: relative;     border-bottom: 5px solid var(--cl-orange-logo); } .news-list .item .content .image a.img{     line-height: 0;     width: 100%;     height: 100%;     text-align: center;      display: flex;     align-items: center;     -webkit-justify-content: center;     justify-content: center; } .news-list .item .content .image a.img img{     width: auto;     height: 105%;      -webkit-transition: 0.3s ease-in-out;     -moz-transition: 0.3s ease-in-out;     -o-transition: 0.3s ease-in-out; } .news-list .item .content:hover .image a.img img{     height: 110%; }  .news-list .item .content .image .tag{     display: inline-block;     background-color: var(--cl-orange-logo);     position: absolute;     bottom:0px;     left: 0px;     padding:4px 10px 2px;     color: var(--cl-white);     font-size: 0.75rem;     line-height: 1rem;     font-weight: 700;     text-transform: uppercase; }  .news-list .item .content .text{     display: grid;     grid-template-rows: auto 20px;     row-gap: 10px;     padding:15px; }  .news-list .item .content .text .title{     overflow: hidden;     display: block;      font-size: 1.1rem;     line-height: 1.5rem;     font-weight: 400;      margin-bottom: 10px;     font-family: var(--font-oxygen);     color: var(--cl-grey-darken-3); }  .news-list .item .content .text .message{     overflow: hidden;     display: block;     font-size: .95rem;     line-height: 1.3rem;     color: var(--cl-grey-darken-3); }   .news-list .item .content .text .details{     overflow: hidden;     display: grid;     grid-template-columns: 48% 48%;     column-gap: 2%;     font-size: .85rem;     line-height: 20px;     color: var(--cl-grey-darken-2); }   .more-list{     display: block;     margin-top: 30px;     text-align: center; } .more-list .text{     font-size: 0.9rem;     line-height: 1.2rem;     color:var(--cl-grey-darken-2);     margin-top: 10px;  }  .list-text{     display: block;     font-size: 1.1rem;     line-height: 1.4rem;     padding: 0 15px 30px;     color: var(--cl-grey-darken-3); }  .list-text .image{     float: left;     margin-right: 20px; } .list-text .image img{     max-width: 100%;     height: auto; } .list-error{     text-align: center;     font-size: 0.9rem;     line-height: 1.4rem;     color:var(--cl-grey-darken-2);     padding:20px 0 0px; }  .footer_scripts_content{     display: none !important; }   .truncate {     display: block;     white-space: nowrap;     overflow: hidden;     text-overflow: ellipsis; }  .tag_h{     overflow: hidden;     display: block;     margin:0 0 25px 0;     width: 100%; } .tag_h h1, .tag_h h2, .tag_h h3, .tag_h h4{     font-size: 1.4rem;     line-height: 1.6rem;     font-weight: 800;     font-family: var(--font-oxygen);     margin:  0;     padding: 0; } .tag_h h3, .tag_h h4{     font-size: 1.2rem;     line-height: 1.3rem; }     .post_warning_content{     overflow: hidden;     text-align: center;     height: auto;     max-height: 500px;     padding: 15px 20px;     background-color: var(--cl-red-darken-2);     color: #FFF;     border-radius: 5px;     text-shadow: 1px 0px 1px rgba(0,0,0,0.5);     margin: 0 0 25px 0;      -webkit-transition: .2s ease-in-out;     -moz-transition: .2s ease-in-out;     -o-transition: .2s ease-in-out; } .post_warning_content.init-hide{     height: 0;     margin:0;     padding: 0; }  .post_warning_content_aviso{     background-color: var(--cl-orange-darken-2);     color: #FFF; } .post_warning_content .post_wc_title{     overflow: hidden;     font-size: 1.6rem;     line-height: 2rem;     font-weight: bold; } .post_warning_content .post_wc_line{     overflow: hidden;     font-size: 1.2rem; }  .post_warning_content .post_wc_line .btn{     text-shadow: none; } .content_center{     overflow: hidden;     display: block;     padding:10px 0;     text-align: center;     width: 100%; } .content_left{     overflow: hidden;     float:left !important;     padding: 10px 20px 10px 0px;     width:40%; }  .content_right{     overflow: hidden;     text-align: right;     float:right !important;     padding: 10px 0px 10px 20px;     width:40%;  }   .tag_list_otype{     list-style-type: disc;     margin: 0;    }   .tag_list_ntype{     list-style-type: decimal;     margin: 0;   }     .quote{     overflow: hidden;          position:relative;     min-height: 55px;     margin:15px 0;  } .quote .quote-content{     background-color: var(--cl-grey-lighten-3);     color: #222;     font-size: 0.95rem;     margin: 3px 3px 3px 17px;     overflow: hidden;      padding: 15px 15px 15px 30px;     line-height: 1.6rem;     border-radius: 1px;      -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);     -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);     box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4); } .dark_theme .quote .quote-content{     background-color: #444;     color: #eee; } .quote .quote-icon{     background: #ff4800 none repeat scroll 0 0;     border-radius: 3px;     color: #fff;     font-size: 1rem;     height: 30px;     left: 0px;     padding-top: 5px;     position: absolute;     text-align: center;     top: 10px;     width: 35px; } .quote .spoiler-icon{     background: #f10 none repeat scroll 0 0; } .quote .quote-content .spoiler-bt-hide{     font-size: 0.8rem;     margin-top: 5px; } .quote .quote-content .spoiler-bt-hide a{     color:var(--cl-red-darken-2);     text-transform: uppercase;     font-weight: 700; }   .slice-highlight{     padding:0px 3px;     border-radius:5px;     background-image: linear-gradient(#df93507a, #df93507a);     background-repeat: no-repeat;     background-position: 0% 100%;     background-size: 0px 100%;     transition: background-size .5s, background-position .5s ease-in .5s; } .slice-highlighted{     background-size: 100% 100%;     background-position: 0% 0%;     transition: background-position .5s, background-size .5s ease-in .5s; }         .sbbcode-hide{     display:none; } .url-protect-sbbcode, .urli-protect-sbbcode{     color:#039be5;           } .image-protect-sbbcode, .image-url-protect-sbbcode, .youtube-protect-sbbcode, .vimeo-protect-sbbcode, .video-protect-sbbcode, .twitter-protect-sbbcode, .reddit-protect-sbbcode, .steam-protect-sbbcode, .iframe-protect-sbbcode,  .instagram-protect-sbbcode, .facebook-protect-sbbcode, .slide-sbbcode, .twitch-protect-sbbcode, .twitch-live-protect-sbbcode, .twitch-clip-protect-sbbcode, .twitch-videos-protect-sbbcode{      color: transparent;     display: block;     overflow: hidden;     font-size: 0.8rem;     text-align: center; }   .youtube-protect-div-sbbcode, .video-protect-div-sbbcode{     display: block;     width: 100%;     margin-bottom: 35px;            } .bg-div-sbbcode{      background-color:#b1b1b1; }    .url-protect-sbbcode span, .urli-protect-sbbcode span, .image-protect-sbbcode span,  .youtube-protect-sbbcode span, .reddit-protect-sbbcode span, .steam-protect-sbbcode span, .iframe-protect-sbbcode span, .vimeo-protect-sbbcode span, .video-protect-sbbcode span, .twitch-protect-sbbcode span, .twitch-clip-protect-sbbcode span, .twitch-videos-protect-sbbcode span, .twitch-live-protect-sbbcode span,  .instagram-protect-sbbcode span, .facebook-protect-sbbcode span, .slide-sbbcode span, .image-url-protect-sbbcode span{     display:none; } .text-hide-sbbcode{     width: 5px;       display: block;     height: 5px;     color: rgba(0,0,0,0);  }  .twitter-view{     margin: 0 auto;     max-width: 500px;     display: block;     padding:10px;     text-align: center; } .facebook-view, .reddit-view{      margin: 0 auto;     display: block;     padding:10px;     text-align: center; } .iframe-view{      margin: 0 auto;     display: block;     padding:10px 0;     text-align: center; }   .div_image{     text-align: center; }  .div_image img, .article-media img, .code_youtube{     max-width:100%; }  .article-media{     text-align:center;     padding:10px 3px;     width: 100%; }   .article-media img{     cursor:pointer;     max-width:100%;     height:auto;     min-width: 150px; }    .video-container{     position: relative;     padding-bottom: 56.25%;     height: 0;     overflow: hidden; } .video-container iframe,  .video-container object,  .video-container embed{     position: absolute;     top: 0;     left: 0;     width: 100%;     height: 100%; }     .slider-container{     display:block;     position:relative;      overflow: hidden;     padding-bottom: 40px; }  .slider-container img {   width: 100%;   max-width: 100%;   display: block;   pointer-events: none; }  .slider-container .slider-container{   max-width: 700px;   margin: 0 auto;   overflow: hidden;   position: relative; }  .slider-container .count-slides{   position: absolute;     z-index: 100;     top: 5px;     right: 15px;      font-size: 1rem;     color: #fff;     font-weight: bold;     text-shadow: 1px 0px 1px rgba(0,0,0,0.5); }  .slider-container .dots{   position: absolute;   bottom: 15px;   left: 0px;   display: -webkit-box;   display: -ms-flexbox;   display: flex; }  .slider-container .dots span{   width: 15px;   height: 15px;   border-radius: 50%;   background: #979797;   opacity: .3;   margin-right: .5rem;   cursor: pointer;   -webkit-transition: all .4s ease-in-out;   -o-transition: all .4s ease-in-out;   transition: all .4s ease-in-out; } .slider-container .dots span.dots_active{   opacity: 1; }  .slider-container .dots span:last-child{   margin-right: 0; }  .slider-container .dots span:hover{   opacity: .6; }  .slider-container .slider{   -webkit-user-select: none;      -moz-user-select: none;       -ms-user-select: none;           user-select: none;     -webkit-transition: all .4s ease-in-out;     -o-transition: all .4s ease-in-out;     transition: all .4s ease-in-out;   display: -webkit-box;   display: -ms-flexbox;   display: flex;   -webkit-box-align: center;       -ms-flex-align: center;           align-items: center;   -webkit-transform: translateX(0);       -ms-transform: translateX(0);           transform: translateX(0);   will-change: transform; }  .slider-container .slider .slider__item{   -ms-flex-negative: 0;       flex-shrink: 0;   width: 100%; }  .slider-container .slider__item:nth-child(even){   background: rgb(123, 122, 122); }    .slider-container .arrows{     display: block;     -webkit-box-pack: center;     -ms-flex-pack: right;     justify-content: right;     margin-top: 0.5rem;     width: 100px;     position: absolute;     bottom: 0px;     right: 0px; }  .slider-container .arrows__item{   cursor: pointer;   font-size: 2.5rem;   line-height: 1;   -webkit-user-select: none;      -moz-user-select: none;       -ms-user-select: none;           user-select: none;   display: inline-block;   margin: 0 1rem;  }  .slider-container .slider-execution-line{   width: 100%;   height: 7px;   margin-top: 0px; }  .slider-container .slider-execution-line__progress{   background: -webkit-gradient(linear, right top, left top, from(#5f5f5f), to(#c1c1c1));   background: -o-linear-gradient(right, #5f5f5f, #c1c1c1);   background: linear-gradient(to left, #5f5f5f, #c1c1c1);   width: 0%;   height: 100%;   -webkit-transition: width .9s ease-in-out;   -o-transition: width .9s ease-in-out;   transition: width .9s ease-in-out; }      .destaque-box-tab{     display: block;      overflow: hidden;     border-bottom: 1px solid var(--cl-grey-lighten-2); } .destaque-box-tab .destaque-box-tab-item{     display: block;     overflow: hidden;     float: left;          text-align: center;     padding: 15px 5px 5px 5px;     margin-right: 10px;     color: #333;     border-bottom:3px solid rgba(0,0,0,0);     text-transform: uppercase;     font-size: 0.8rem;     -webkit-transition: 0.3s ease-in-out;     -moz-transition: 0.3s ease-in-out;     -o-transition: 0.3s ease-in-out; } .destaque-box-tab-p .destaque-box-tab-item{     margin: 0px 3px 5px 3px; } .destaque-box-tab-big .destaque-box-tab-item{     font-size: 1rem; } .dark_theme .destaque-box-tab .destaque-box-tab-item{     color: #999; }   .destaque-box-tab .destaque-box-tab-item:hover,  .destaque-box-tab .active{     border-bottom: 3px solid #ff4800 } .destaque-box-tab .destaque-box-tab-item.disable:hover,  .destaque-box-tab .disable{     border-bottom: 3px solid rgba(0,0,0,0); }  .destaque-box-tab.slice-box-tab .destaque-box-tab-item{     padding: 0px 5px; } .destaque-box-tab.slice-box-tab .home-news-content{     overflow: hidden; }     .tag_table ol{     margin:0 !important; }  table.tag_table {   border: 1px solid rgba(0,0,0,0.2);   background-color: rgba(0,0,0,0.02);   width: 100%;   text-align: left;   border-radius: 3px; } table.tag_table td, table.tag_table th {   border: 0px solid rgba(0,0,0,0);   padding: 5px 20px; } table.tag_table tbody th {   font-size: 0.9rem; } table.tag_table tbody td {   font-size: 1rem; } table.tag_table tr:nth-child(even) {   background: rgba(255,255,255,0.7); }  .dark_theme table.tag_table {   border: 1px solid rgba(255,255,255,0.2);   background-color: rgba(255,255,255,0.1); } .dark_theme table.tag_table tr:nth-child(even) {   background: rgba(255,255,255,0.05); }    .about-page.medium main .container {     max-width: 1000px; } .about-text{     display: block;     font-size: 1.1rem;     line-height: 1.6rem;     padding: 0 20px; }     .link-ico{     width: 30px;     height: 30px;     margin-right: 7px;     display:inline-block;     float: left;     background-repeat : no-repeat;      background-image: url("../images/social-icons.webp");     background-position:0px 0px;     border-radius: 50%;   }  .link-ico-official-site{ background-position:0px 0px; } .link-ico-android{ background-position:-30px 0px; } .link-ico-battlenet{ background-position:-60px 0px; } .link-ico-discord{ background-position:-90px 0px; } .link-ico-epic{ background-position:-120px 0px; } .link-ico-facebook{ background-position:-150px 0px; } .link-ico-gog{ background-position:-180px 0px; } .link-ico-google{ background-position:-210px 0px; } .link-ico-instagram{ background-position:-240px 0px; } .link-ico-ios-ipad{ background-position:-270px 0px; } .link-ico-ios-iphone{ background-position:-300px 0px; } .link-ico-itch{ background-position:-330px 0px; } .link-ico-origin{ background-position:-360px 0px; } .link-ico-playstation{ background-position:-390px 0px; } .link-ico-play-store{ background-position:-420px 0px; } .link-ico-reddit{ background-position:-450px 0px; } .link-ico-steam{ background-position:-480px 0px; } .link-ico-switch{ background-position:-510px 0px; } .link-ico-twitch{ background-position:-540px 0px; } .link-ico-twitter{ background-position:-570px 0px; } .link-ico-uplay{ background-position:-600px 0px; } .link-ico-wikia{ background-position:-630px 0px; } .link-ico-wikipedia{ background-position:-660px 0px; } .link-ico-windows{ background-position:-690px 0px; } .link-ico-xbox{ background-position:-720px 0px; } .link-ico-youtube{ background-position:-750px 0px; } .link-ico-myanimelist{ background-position:-780px 0px; } .link-ico-animenewsnetwork{ background-position:-810px 0px; } .link-ico-animedb{ background-position:-840px 0px; }    .inactive-msg{     display: block;     padding:6px 20px;     margin-bottom: 20px;     border-radius: 10px;     font-size: 1rem;     line-height: 2rem;     text-align: center;     color:var(--cl-white);     border:2px solid var(--cl-red-darken-2);     background-color: var(--cl-red-lighten-1); }     .sliceToasts{      position: fixed;     bottom: 0px;     right: 5px;     max-width: 350px;           min-width: 300px;     height: 70%;     z-index: 200;     display: flex;     flex-direction: column; }  .sliceToasts .toast-item{           display: block;     width: 100%;                    margin-top:100%;     -webkit-transition: 0.5s ease-in-out;     -moz-transition: 0.5s ease-in-out;     -o-transition: 0.5s ease-in-out;      opacity: 0.0;     -moz-opacity: 0.0;     filter: alpha(opacity=0); } .sliceToasts .toast-item-view{     margin-top:0px;     opacity: 1;     -moz-opacity: 1;     filter: alpha(opacity=100); } .sliceToasts .toast-item-hide{     opacity: 0.0;     -moz-opacity: 0.0;     filter: alpha(opacity=0); }  .sliceToasts .toast-item .toast-item-content{     font-weight: 600;     font-size:0.9rem;     line-height:1.3rem;     float:right;     display:block;     margin: 5px;       padding:10px 20px;     border-radius: 20px; } .sliceToasts .toast-item .clean{     background-color: var(--cl-grey-darken-2);     color:#fff; } .sliceToasts .toast-item .red{     background-color: var(--cl-red-darken-2);     color:#fff; } .sliceToasts .toast-item .green{      background-color: var(--cl-green-darken-1);     color:#fff; }  .sliceToasts .toast-item .orange{     background-color: var(--cl-orange-darken-3);     color:#fff; }     .database-details{     display: grid;     grid-template-columns: 320px auto;     column-gap: 20px;     margin-bottom: 30px; }  .database-details .cover{     display: block;     padding:10px; } .database-details .cover a{     display: block;     text-align: center; } .database-details .cover img{     width: 98%;     max-width: 350px;     height: auto;     box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 2px 0px; }   .database-details .details{     display: block; } .database-details .details .line{     display: block;     padding:3px 0; } .database-details .details .line .perfil-links{     display: inline-block;     line-height: 30px;     height: 30px;     margin: 5px 25px 5px 0; }   .discorver-form .top-line{     display: grid;      grid-template-columns: auto 300px;     column-gap: 10px; } .discorver-form .line .title span{     color:var(--cl-orange-darken-3); } .discorver-form .top-line .btn{     margin-top: 22px; } .discorver-form .line{     margin:3px 0; } .discorver-form .line .title{     font-size: 0.9rem;     line-height: 1.2rem;     color: var(--cl-grey-darken-2); }   .discorver-form .bt-advance{     font-weight: 700;     font-size: 0.8rem;     line-height: 1.2rem;     text-transform: uppercase; }  .discorver-form .options-line{     display: grid;      grid-template-columns: repeat(4,24%);     column-gap: 1.3%; } .discorver-form .badge-list{     display: block;     overflow: hidden;     padding: 10px 5px; } .discorver-form .badge-list .badge {     padding: 5px;     background-color: var(--cl-grey-lighten-3);     border: 1px solid var(--cl-grey-darken-2);     color: var(--cl-grey-darken-2);     margin: 3px;     font-weight: 600;     min-width: 100px;      padding: 3px 5px;     font-size: 0.9rem;     text-transform: capitalize; } .discorver-form .badge-list .badge.active, .discorver-form .badge-list .badge:hover {     color: var(--cl-white) !important;     background-color: var(--cl-green-darken-1);     border: 1px solid var(--cl-green-darken-1); }    .discover-list{     display: grid;     grid-template-columns: 49% 49%;     column-gap: 2%;     row-gap: 30px; }   .discover-list .item{     display: grid;     grid-template-columns: 250px auto;     column-gap: 20px; } .discover-list .item .cover{     display: block;     padding:10px; } .discover-list .item .cover a{     display: block;     text-align: center; } .discover-list .item  .cover img{     width: 98%;     max-width: 300px;     height: auto;     box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 2px 0px; }   .discover-list .item  .details{     display: block; } .discover-list .item .details .line{     display: block;     padding:3px 0; }   .anime-premiere-bts{     display: grid;     grid-template-columns: 45% 45%;     column-gap: 10%;      font-size: 0.9rem;     line-height: 1.2rem;     margin:0px 0 30px; } .anime-premiere-bts .left{     text-align: left; } .anime-premiere-bts .right{     text-align: right; } .anime-premiere-bts .title{     display: block;     font-size: 1.2rem;     line-height: 1.6rem; } .anime-premiere-bts .title a{     font-weight: 600;  } .anime-premiere-bts .details{     display: block;     color: var(--cl-grey-darken-2); }   .news-top{     background-color: var(--cl-grey-darken-3);     padding:5px 5px;     margin-top: 30px; } .news-top.blue-grey{     background-color: var(--cl-blue-grey-darken-3); } .news-top.green{      background-color: var(--cl-green-darken-3); } .news-top.pink{      background-color: var(--cl-pink-darken-3); }  .news-top.orange{      background-color: var(--cl-orange-darken-3); } .news-top.purple{      background-color: var(--cl-purple-darken-3); } .news-top .google-auto-placed{     display: none !important; }  .news-top > .title{     display: block;     overflow: hidden;     font-weight: 600;     font-size: 1rem;     line-height: 1.4rem;     text-transform: uppercase;     color:var(--cl-white);     padding: 3px 0 0 10px; } .news-top > .title .material-icons{     font-size: 1.4rem;     float: left;     margin-right: 7px;     margin-top: 1px; }   .news-top > .news-list {     grid-template-columns: auto 50%; }  .news-top > .news-list .item .content {     grid-template-rows: 200px auto; }  .news-top > .news-list .small{     display: grid;     grid-template-columns: 50% 50%; }  .calendar-home{     display: block;     overflow: hidden;     position: relative; } .calendar-home .paginator{     position: absolute;     height: 60px;     width: 40px;     background-color: rgba(0,0,0,0.05);     color:var(--cl-grey-darken-1);     top:35%;     float: inherit !important;     -webkit-transition: .3s ease-in-out;     -moz-transition: .3s ease-in-out;     -o-transition: .3s ease-in-out; } .calendar-home .paginator:hover{     background-color: var(--cl-black);     opacity: 0.5;     color:var(--cl-white); } .calendar-home .paginator.left{     left:0px;     border-radius: 0 30% 30% 0;     text-align: left; } .calendar-home .paginator.right{     right:0px;     border-radius: 30% 0 0 30%;     text-align: right; } .calendar-home .paginator .material-icons{     font-size: 2.5rem;     line-height: 60px; }    .calendar-home .list{     display: block;     overflow: hidden;     margin:0px 30px; } .calendar-home .list-content{     display: grid;     grid-template-columns: repeat(10,200px);     column-gap: 20px;     margin:20px 0px;     overflow: hidden;      -webkit-transition: .3s ease-in-out;     -moz-transition: .3s ease-in-out;     -o-transition: .3s ease-in-out; }  .calendar-home .list .item{     display: grid;     grid-template-rows: 285px 40px;     row-gap: 5px;     text-align: center;  } .calendar-home .list .item .image{     display: block;     padding:5px; } .calendar-home .list .item .image img{     display: block;     height: auto;     width: 100%;     max-height: 290px;     border-radius: 5px;      max-width: 200px;     box-shadow: rgba(0, 0, 0, 0.18) 0px 2px 4px;     -webkit-transition: .3s ease-in-out;     -moz-transition: .3s ease-in-out;     -o-transition: .3s ease-in-out; } .calendar-home .list .item:hover .image img{     box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;      }  .calendar-home .list .item .title{     font-size: 0.9rem;     line-height: 1.1rem;     font-weight: 600;      overflow: hidden;     -webkit-line-clamp: 2;     line-clamp: 2;     -webkit-box-orient: vertical;     color: var(--cl-grey-darken-2);     display: -webkit-box; } .calendar-home .list .item:hover .title{     color: var(--cl-grey-darken-3); }  .slide-home{     display: grid;     grid-template-columns: auto 350px;     column-gap: 10px;     padding:0px 10px 10px 10px;      margin:10px 0 10px; } .slide-home .slide-left{     display: block;     overflow: hidden;     position: relative; } .slide-home .slide-right{     display: grid;     grid-template-rows: 160px 160px;     row-gap: 10px; }   .slide-home .item{     background-color: #222;     display: block;     overflow: hidden;     position:relative;     z-index: 2; } .slide-home .item.active{     z-index: 3; } .slide-home .slide-left .item{     position: absolute;     top:0;     bottom: 0;     left: 0;     right: 0; } .slide-home .slide-right .item{     position:relative; }  .slide-home .item .image{     text-align: center;     align-items: center;     -webkit-justify-content: center;     justify-content: center;     bottom: 0px;     right: 0px;     top: 0px;     left: 0px;     display: flex;     position: absolute; } .slide-home .item .image img{     height: 100%;     width: auto;     display: inline-block;     -webkit-transition: .3s ease-in-out;     -moz-transition: .3s ease-in-out;     -o-transition: .3s ease-in-out; }    .slide-home .item:hover .image img{     height: 105%; }   .slide-home .slide-right .item .image img{     height: 140%; } .slide-home .slide-right .item:hover .image img{     height: 145%; }    .slide-home .item .title{     position: absolute;     bottom:0px;     left: 0px;     right: 0px;     padding:15px 20px;     background-color: rgba(0,0,0,0.6); } .slide-home .item .title a{     color:#FFF;     font-family: var(--font-roboto);     font-weight: 700;     font-size: 1.4rem;     line-height: 1.6rem;     text-shadow: 1px 1px 1px #000;      -webkit-line-clamp: 2;     line-clamp: 2;     -webkit-box-orient: vertical;     box-orient:vertical;     display: -webkit-box;     overflow: hidden; } .slide-home .slide-right .item .title{     padding:15px 15px; } .slide-home .slide-right .item .title a{     font-size: 1rem;     line-height: 1.2rem; }   .slide-home .item .title span{     position: absolute;     height: 6px;     background-color: var(--cl-orange-logo);     top:-3px;         left: 20px;     right: 90%;      -webkit-transition: .7s ease-in-out;     -moz-transition: .7s ease-in-out;     -o-transition: .7s ease-in-out; } .slide-home .item.active .title span{         right: 60%; } .slide-home .slide-right .item .title span{     left: 15px;     right: 70%; }  .slide-home .item.active:hover .title span, .slide-home .slide-right .item:hover .title span{     right: 50%; }    .slide-home .item .tag{     position: absolute;     top:10px;     left: 10px;     color:#FFF;     background-color: rgba(0,0,0,0.6);     border-left: 3px solid var(--cl-orange-logo);     padding:5px 5px 5px 2px;      font-weight: 800;     font-size: 0.8rem;     line-height: 1rem;     text-transform: uppercase;     text-shadow: 1px 1px 1px #000; } .slide-home .item:hover .tag{     background-color: var(--cl-orange-logo); }  .slide-home .bts{      display: block;     position: absolute;     top: 5px;     right: 10px;     z-index: 4;     background: rgba(0,0,0,0.6);     border-radius: 20px;     padding: 5px 2px;     line-height: 0px; }  .slide-home .bts a{     display: inline-block;     color: transparent;     width: 20px;     height: 20px;     border-radius: 100%;     margin: 0 3px;     background-color: rgba(255,255,255,0.6);     -webkit-transition: .3s ease-in-out;     -moz-transition: .3s ease-in-out;     -o-transition: .3s ease-in-out;      -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);     -moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4);     box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4); } .slide-home .bts a.active, .slide-home .bts a:hover{     background-color: rgba(255,255,255,0.95); }  .slide-home .slide-left .item{     opacity: 0;      -webkit-transition: .2s ease-in-out;     -moz-transition: .2s ease-in-out;     -o-transition: .2s ease-in-out; } .slide-home .slide-left .item.bg{     opacity: 1;     z-index: 0; } .slide-home .slide-left .item.active{     opacity: 1; }    .allow-overshadows{     -webkit-transition: .1s ease-in-out;     -moz-transition: .1s ease-in-out;     -o-transition: .1s ease-in-out;     filter: blur(0px); } body.overshadows .allow-overshadows{     filter: blur(5px); }   .page-error{     padding:20px 0;     text-align: center;     font-size: 1.2rem;     line-height: 1.8rem;     font-weight: 600;     color:var(--cl-grey-darken-3);     font-family: var(--font-oxygen); } .page-error .title{     font-size: 7rem;     line-height: 8rem;     color:var(--cl-black);     font-family: var(--font-roboto); }   .sidebar{     display: block;     height: 100%;     width: 100%;     position: relative; } .news-bottom{     width: 100%;     display: block;     position: relative; }   .more-news{     width: 100%;     display: block;     overflow: hidden; }  .more-news .hr{     display: block;     width: 100%;     height: 4px;     padding: 0;     margin: 0;     background-color: var(--cl-background); } .more-news .item{     display: flex;     overflow: hidden;     position: relative;     height: 200px;     margin:2px 0; }  .more-news .item .image{     line-height: 0;     width: 100%;     height: 100%;     position: relative;     text-align: center;     display: flex;     align-items: center;     -webkit-justify-content: center;     justify-content: center; } .more-news .item .image img{     width: auto;     height: 100%;     -webkit-transition: .2s ease-in-out;     -moz-transition: .2s ease-in-out;     -o-transition: .2s ease-in-out; } .more-news .item .image:hover img{     height: 105%; } .more-news .item .tag{     position: absolute;     top: 10px;     left: 10px;     color: #FFF;     background-color: rgba(0,0,0,0.6);     border-left: 3px solid var(--cl-orange-logo);     padding: 5px 5px 5px 2px;     font-weight: 700;     font-size: 0.75rem;     line-height: 1rem;     text-transform: uppercase;  } .more-news .item:hover .tag{     background-color: var(--cl-orange-logo); }  .more-news .item .title{     position: absolute;     bottom: 0px;     left: 0px;     right: 0;      padding:10px;     background-color: rgba(0,0,0,0.6); } .more-news .item .title a{     display: block;     color:var(--cl-white);     font-size: 1rem;     line-height: 1.2rem;     font-weight: 600;     overflow: hidden;     -webkit-line-clamp: 2;     line-clamp: 2;     -webkit-box-orient: vertical;     display: -webkit-box; } .more-news .item:hover .title a{     color:var(--cl-grey-lighten-3); } .more-news .item .title span{     position: absolute;     top:-2px;     left: 10px;     right: 70%;     height: 4px;     background-color:var(--cl-orange-logo);     -webkit-transition: .2s ease-in-out;     -moz-transition: .2s ease-in-out;     -o-transition: .2s ease-in-out; }   .more-news .item:hover .title span{     right: 50%; }   .news-bottom .more-news{     display: grid;     height: auto;     grid-template-columns: repeat(4, 24%);     column-gap: 1%; } .news-bottom .more-news .item{     height: 160px; } .news-bottom .more-news .google-auto-placed{     display: none !important; }      .abp{     display:block;     overflow: hidden;     text-align: center;     width: 100%;     min-height: 50px;      } .sidebar .abp{     min-height: 250px; }   #nav-stick.abp{      }       .comment-box{      overflow: hidden;     padding: 20px 0px;      } .comment-box .comment-content{     overflow: hidden;     padding:10px 5px; }  .comment-box .comment-title{     font-size: 14px;     overflow: hidden;     border-bottom: 3px solid #333;     padding: 5px 0px;     margin-bottom: 10px;     font-weight: bold;     text-transform: uppercase; } .comment-box .comment-details{     overflow: hidden;     padding: 0px 20px 10px;     font-size: 1rem;      line-height: 1.3rem;     color:#333;   }  .dark_theme .comment-box .comment-title{     border-bottom: 3px solid #ccc; } .dark_theme .comment-box .comment-details{     color:#ccc;   }   .external-script-content{     overflow: hidden;     padding: 30px 0px;     max-width: 600px;     margin: 0 auto; }  .sharer_content_box .btn-sharer, .social-box-footer a, .social-button-header .social-button-header-content .social-bth,  .box-youtube-bt .aBt, .box-twitter-bt .aBt, .box-facebook-bt .aBt, .box-dailymotion-bt .aBt, .box-steam-bt .aBt, .box-discord-bt .aBt{     background: url("../images/images-base.webp");      background-position:-297px -94px; }      .social-box-footer a{     display:block;     float:left;     margin: 25px 10px 25px 5px;               color:transparent;     width:80px;      height:80px; } .social-box-footer a{     background-position:  -212px -5px; } .social-box-in-comment{     padding: 0px 15px;     overflow: hidden; } .social-box-in-comment a{     margin: 5px 10px 5px 5px; } .social-box-footer .social-bt-div-box{     display:block;     float:left;     margin: 5px 10px 5px 5px;     width:280px;       height:80px;   }  .social-box-in-comment .box-social-bt{     height:80px;     padding: 15px 15px 7px 15px;     margin:auto;   } .social-box-in-comment .box-social-bt .aBt{     height:80px;      right: -10px; }  .social-box-footer .social-bt-facebook{     background-position: -212px -5px; } .social-box-footer .social-bt-twitter{     background-position: -212px -89px; } .social-box-footer .social-bt-youtube{     background-position: -297px -89px; } .social-box-footer .social-bt-steam{     background-position: -298px -5px; } .social-box-footer .social-bt-dailymotion{     background-position: -381px -5px; } .social-box-footer .social-bt-instagram{     background-position: -381px -89px; } .social-box-footer .social-bt-discord{     background-position: -465px -89px; }       .sharer_content_box{     overflow: hidden;     margin:20px 0px;     max-height: 60px;		     max-width: 950px;     margin: 0 auto; } .sharer_content_box_border{     padding-botton:30px;     border-radius:0 0 5px 5px;      max-height: 80px;     overflow: hidden;     height: 80px; } .sharer_content_box .btn-sharer{     display:block;     float:left;     cursor:pointer;               width:46px;      height:46px;     color:transparent;     padding: 0px;     margin:10px 5px 5px 0px;	     opacity: 1;     border-radius:50%;     transition: all 0.2s linear 0s; } .sharer_content_box .btn-sharer{     background-position: -152px -5px; }  .sharer_content_box .btn-sharer:hover{      opacity: 0.5;       margin-top:5px;  }   .sharer_content_box .btn-sharer-twitter{     background-position: -54px -5px; } .sharer_content_box .btn-sharer-facebook{     background-position: -5px -5px; } .sharer_content_box .btn-sharer-whatsapp{     background-position: -54px -103px; } .sharer_content_box .btn-sharer-whatsapp-web{     background-position: -54px -103px;   } .sharer_content_box .btn-sharer-pinterest{     background-position: -103px -5px; } .sharer_content_box .btn-sharer-tumblr{     background-position: -5px -54px; } .sharer_content_box .btn-sharer-pocket{      background-position: -103px -103px;  } .sharer_content_box .btn-sharer-flipboard{     background-position: -103px -54px; }  .sharer_content_box .btn-sharer-blogger{      background-position: -54px -54px; }   .content-bottom{     display: block;     margin:30px 0; }   .list-items{     display: block; } .list-items a{     font-size: 1.2rem;     line-height: 1.6rem;     padding: 5px 10px;     background-color: rgba(0,0,0,0);     -webkit-transition: 0.3s ease-in-out;     -moz-transition: 0.3s ease-in-out;     -o-transition: 0.3s ease-in-out;      overflow: hidden;     -webkit-line-clamp: 1;     line-clamp: 1;     -webkit-box-orient: vertical;     display: -webkit-box; } .list-items a:hover {     background-color: rgba(0,0,0,0.04); } .list-items a::before{     content: "\203A";     color:var(--cl-grey-lighten-1);     font-size: 1.2rem;     line-height: 1.4rem;     font-weight: 600;     margin-right: 10px; } .list-items .hr{     border-bottom: 1px dotted var(--cl-grey-lighten-2);     background-color: none;     height: 0px;     margin: 0;     padding: 0; }  .fonts-container{     display: block;     font-weight: 400;     font-size: 1rem;     line-height: 1.6rem;     margin: 30px 0;  }  .review-box{     display: block;     overflow: hidden;     padding:20px 25px;     margin:10px 0px;     font-size: 1rem;         overflow: hidden;     border-radius: 5px; }  .review-box .details-top{     display: grid;     grid-template-columns: 80px auto;     column-gap: 3%; }  .review-box .details-top .note{     border:2px solid var(--cl-blue-grey-darken-1);     background-color: var(--cl-blue-grey-lighten-3);     border-radius: 10px;     min-height: 50px;     padding:7px 10px;     text-align: center; }  .review-box .details-top .note.n0, .review-box .details-top .note.n1, .review-box .details-top .note.n2{     border:2px solid  var(--cl-red-darken-2);     background-color:  var(--cl-red-lighten-2); }  .review-box .details-top .note.n3, .review-box .details-top .note.n4{     border:2px solid var(--cl-orange-darken-3);     background-color: var(--cl-orange-lighten-3); }  .review-box .details-top .note.n6, .review-box .details-top .note.n5{     border:2px solid var(--cl-blue-grey-darken-1);     background-color: var(--cl-blue-grey-lighten-3); }  .review-box .details-top .note.n7, .review-box .details-top .note.n8{     border:2px solid var(--cl-blue-darken-2);     background-color: var(--cl-blue-lighten-4); }  .review-box .details-top .note.n9, .review-box .details-top .note.n10{     border:2px solid var(--cl-green-darken-1);     background-color: var(--cl-green-lighten-3); }   .review-box .details-top .note .value{     font-size: 2rem;     font-weight: 700; } .review-box .details-top .note .value span{     font-size: 1.4rem; }  .review-box .details-top .note .micon{     line-height: 1rem; } .review-box .details-top .note .micon i.material-icons{     font-size: 2rem; }  .review-box .details-top .text{     font-size: 1.1rem;     line-height: 1.5rem; }  .review-box .details{     display: block;     margin-top: 20px;     font-size: 1rem;     line-height: 1.2rem; } .review-box .details .block{     width: 48%;     float: left;     margin: 0 2% 0 0; } .review-box .details p{     margin: 3px 0px 3px 10px;     padding: 0px; } .review-box .details .title{     font-weight: 700;     font-size: 0.8rem;     text-transform: uppercase; }
    @media screen and (max-width: 1500px) {        } @media screen and (max-width: 1370px) {        } @media screen and (max-width: 1200px) {        .discover-list .item{         grid-template-columns: 200px auto;     }      .database-details{         grid-template-columns: 200px auto;     }      .slide-home{         grid-template-columns: auto 300px;     }      .news-bottom .more-news{         grid-template-columns: repeat(2, 49.5%);         column-gap: 1%;         row-gap: 5px;     }     .news-bottom .more-news .item{         height: 220px;     }        } @media screen and (max-width: 1000px) {       .news-list {         grid-template-columns: repeat(2,50%);     }     header nav .item.item3{         display: none;     }      .discorver-form .options-line{         grid-template-columns: repeat(2,49%);         column-gap: 2%;      }       .tab-div .tab-bar.big{         border-bottom:none;         border-left: 3px solid var(--cl-grey);         padding-left: 5px;      }     .tab-div .tab-bar.big .tab-aba{         margin: 5px 10px 5px 0;         border-bottom: 1px solid var(--cl-grey);     }       .page-container{         grid-template-columns: 100%;         column-gap: 0px;         row-gap: 30px;     }      .database-details{         grid-template-columns: 300px auto;     }           .news-top > .news-list {         grid-template-columns: 100%;     }      .news-top .news-list .item .content .image a.img img{         height: 140%;     }     .news-top .news-list .item .content:hover .image a.img img{         height: 145%;     }         .slide-home{         grid-template-columns: 100%;         grid-template-rows: 280px 200px;         column-gap: 0;         row-gap: 10px;     }     .slide-home .slide-right {         grid-template-columns: 49% auto;         grid-template-rows: 100%;         row-gap: 0px;         column-gap: 10px;     }      .more-news{         display: grid;         grid-template-columns: 48% 48%;         column-gap: 2%;         row-gap: 15px;     }     .more-news .item{         height: 300px;     }       .news-bottom .more-news{         grid-template-columns: repeat(3, 33%);         column-gap: 1%;              }     .news-bottom .more-news .item:last-child{         display: none;     }     .news-bottom .more-news .item{         height: 200px;     }  } @media screen and (max-width: 900px) {       header nav .item.item2{         display: none;      }         .discover-list{         grid-template-columns: 100%;         column-gap: 0;     }      .news-top .news-list .item .content .image a.img img{         height: 120%;     }     .news-top .news-list .item .content:hover .image a.img img{         height: 125%;     }      .more-news .item{         height: 260px;     }          } @media screen and (max-width: 750px) {      .discorver-form .top-line {         grid-template-columns: 100%;     }     .discorver-form .bt-advance{         float: right;     }      .database-details{         grid-template-columns: 100%;         column-gap: 0;         row-gap: 20px;     }     .post_warning_content{         padding: 20px 30px;     }     .post_warning_content .post_wc_title{         font-size: 1.4rem;         line-height: 1.6rem;       }     .post_warning_content .post_wc_line {         font-size: 1.1rem;     }      .more-news .item{         height: 200px;     }       .news-bottom .more-news{         grid-template-columns: repeat(2, 49.5%);         column-gap: 1%;              }     .news-bottom .more-news .item:nth-last-child(-n + 2){         display: none;     }     .news-bottom .more-news .item{         height: 200px;     }  } @media screen and (max-width: 700px) {       .news-list {         grid-template-columns: repeat(1,100%);     }       .news-list .item .content .image a.img img{         width: 105%;         height: auto;     }     .news-list .item .content:hover .image a.img img{         width: 110%;         height: auto;     }        .news-top .news-list .item .content .image a.img img{         width: auto;         height: 110%;     }     .news-top .news-list .item .content:hover .image a.img img{         width: auto;         height: 115%     }       header nav{         text-align: center;     }     header nav .item{         display: none;     }      header nav .logo{         display: inline-block;         float:inherit;     }       main {         margin-top: 80px;     }     .medium main .container{         margin-top: 0;         width: 90%;         padding: 20px 5%;     }     header{         height: 50px;     }     header nav .logo img{         height: 30px;         margin: 10px 0 10px;     }     header nav .menu-btn,      header nav .button {          padding: 10px 5px;     }      .search-box-content .links{         grid-template-columns: repeat(1,100%);     }       .tab-div .tab-bar{         border-bottom:none;         border-left: 3px solid var(--cl-grey);         padding-left: 5px;      }     .tab-div .tab-bar .tab-aba{         margin: 5px 10px 5px 0;         border-bottom: 1px solid var(--cl-grey);     }      .destaque-box-tab{         border-bottom:none;         border-left: 3px solid var(--cl-grey-lighten-2);         padding-left: 10px;      }     .destaque-box-tab .destaque-box-tab-item{         padding: 5px;     }      .social-box-in-comment{         display: none;     }  }  @media screen and (max-width: 650px) {       .page-header-image img.big {         display: none;     }      .page-header-image img.small {         display: block;     }       .page-container .content .user{         grid-template-columns: 100%;         column-gap: 0px;         row-gap: 10px;         text-align: center;     }      .post_warning_content .post_wc_line.grid2{         grid-template-columns: 100%;         column-gap: 0;         row-gap: 10px;     } }  @media screen and (max-width: 600px) {      .news-top > .news-list .small {         grid-template-columns: 100%;     }     .news-top > .news-list .item .content{         grid-template-rows: 230px auto;     }     .news-top .news-list .small .item .content .image a.img img{         width: auto;         height: 140%;     }     .news-top .news-list .small .item .content:hover .image a.img img{         width: auto;         height: 145%     }        .slide-home{         grid-template-columns: 100%;         grid-template-rows: 280px;         column-gap: 0;         row-gap: 0px;     }     .slide-home .slide-right {         display: none;     }      .page-title{         overflow: hidden;         width: 100%;     }     .page-header .checkbox-nsfw,     .page-title .checkbox-nsfw{         position: relative;         float: left;         margin-top: 5px;         top:0px;     }       .review-box .details-top{         display: block;     }     .review-box .details-top .note{         width: 65px;         margin:0 auto;     }      .review-box .details .block{         width: 100%;         float: initial;         margin: 0 0 15px 0;     }    }  @media screen and (max-width: 500px) {       .search-box-content form .search-text{         width: 70%;     }     .search-box-content form .btn {         width: 26%;     }     .discorver-form .options-line{         grid-template-columns: 100%;         column-gap: 0;      }      .discover-list .item{         grid-template-columns: 180px auto;         column-gap: 10px;     }      .news-list .item .content .image a.img img{         width: auto;         height: 105%;     }     .news-list .item .content:hover .image a.img img{         height: 110%;         width: auto;     }       .page-header h1,     .page-header h2,     .page-header h3 {         font-size: 1.5rem;         line-height: 2rem;     }      .search-box-content form .search-text{         width: 98%;         float: auto;     }     .search-box-content form .btn {         width: 98%;         float: auto;         margin-top: 10px;     }      .anime-premiere-bts{         grid-template-columns: 100%;         row-gap: 20px;     }     .anime-premiere-bts .right,     .anime-premiere-bts .left{         text-align: center;     }       .anime-premiere-bts .title{         font-size: 1rem;         line-height: 1.2rem;     }       .pagination{         text-align: center;     }       .content_left,     .content_right{         float: initial !important;         width: 100%;         padding:10px 0;     }      .discover-list .item{         grid-template-columns: 100%;         column-gap: 0px;     }      .post_warning_content{         padding: 20px 20px;     }     .post_warning_content .post_wc_title{         font-size: 1.2rem;         line-height: 1.5rem;       }      .calendar-home .list-content{         grid-template-columns: repeat(10,170px);     }     .calendar-home .list .item {         grid-template-rows: 235px 40px;     }      .more-news {         display: grid;         grid-template-columns: 100%;         column-gap: 0%;     }     .more-news .item{         height: 270px;     }      .news-bottom{         display: none;     } }  @media screen and (max-width: 440px) {       .page-container .content .user .avatar a{         width: 100px;     }     .more-news .item{         height: 250px;     } } @media screen and (max-width: 410px) {       .news-list .item .content {         grid-template-rows: 200px auto;     }      header nav .logo img{         height: 20px;         margin: 15px 0;     }     main .nav-mobile .items a{         padding: 5px 10px;         font-size: 0.9rem;         letter-spacing: 0px;     }     main .nav-mobile .items a:hover{         padding-left: 10px;      }     main .nav-mobile .items .title{         font-size: 0.8rem;         padding: 10px 10px 0;     }      footer .top .links a{         display: block;     }     footer .top .links a::after{         display: none;     }      .discorver-form .line .title span{         display: block;     }     .discorver-form .top-line .btn{         margin: 22px 0;         width: 100%;         max-width: 100%;     }     .discorver-form .badge-list .badge{         min-width: auto;         padding: 3px 7px;     }      .more-news .item{         height: 220px;     } }