:root{
    --header:black;
    --hover: #DFE8E8;
    --white: white;
    --blue: rgb(18, 237, 245);
    --footer: #737373;
}
*{
    font-family: 'Roboto Condensed', sans-serif;
    color: var(--white);
}
body{
    width: 100%;
}
.navbar{
    background-color: var(--header);
}
.navbar a{
    font-family: 'Teko', sans-serif;
    font-size: 35px;
}
.navbar-brand.custom{
    color: var(--blue);
    font-size: 42px;
}
.navbar-brand.custom:hover{
    color: var(--hover);
}
.nav-item{
    padding: 6px;
}
.dropdown-menu{
    background-color: var(--hover);
}
.dropdown-menu a{
    color: var(--header);
}
#navbarDropdown:hover,#navbarDropdown:focus, #navbarDropdown2:hover,#navbarDropdown2:focus{
    outline: var(--header);
}
.dropdown-toggle::after {
    display:none;
}
.fa.fa-steam{
    margin-left: 4px;
    color: var(--header);
}
.banner{
    height: 90vh;
    background-image:url("../img/triton-survival-banner.jpg"); 
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom;
}
.youtubect{
    overflow: hidden;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.contmb{
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.container-fluid.d-flex{
    height: 45vh;
}
.logo2{
    height: 30vh;
}

.btn{
    font-family: 'Teko', sans-serif;
    font-size: 26px; 
    border-radius: 30px;
    width: 200px; 
}

.kickimage:hover{
    
    box-shadow: 4px 4px 10px #999;
    border: 2px solid var(--header);
}
.banner .btn, .bannermb .btn{
    background-color: var(--white) ;
    color:var(--header);
    opacity: 0.6;
    filter: alpha(opacity=60); 
    box-shadow: 4px 4px 10px #999;
}
.entries .btn, .games .btn{
    background-color: var(--blue);
    color: var(--header);
}
.entries .btn:hover, .games .btn:hover{
    border: 2px solid var(--blue);
    color: var(--header);
    background-color: var(--hover);
}
.banner .btn:hover, .bannermb .btn:hover{
    background-color: var(--hover);
    color: var(--header);
    border: 2px solid var(--header);
}
.youtubect{
    background-image:url("../img/asteroid.jpg"); 
    border-top: 2px solid var(--blue);
}
.youtubect iframe{
    width: 1120px;
    height: 630px;
    margin-top: 3%;
    margin-bottom: 3%;
    box-shadow: 20px 20px 20px var(--header);
}
.survive, .build, .explore, .fight{
    height: 100vh;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    border-top: 2px solid var(--blue);
}
.explore{
    background-image: linear-gradient(
    to left, rgb(24, 24, 24), transparent), url("../img/triton-survival-explore.jpg");
}
.build{
    background-image: linear-gradient(
    to right, rgb(24, 24, 24), transparent), url("../img/triton-survival-build.jpg");
}
.survive{
    background-image: linear-gradient(
        to right, rgb(24, 24, 24), transparent), url("../img/triton-survival-survive.jpg");
}
.fight{
    background-image: linear-gradient(
        to left, rgb(24, 24, 24), transparent), url("../img/triton-survival-fight.jpg");
}
.survive h1, .explore h1, .fight h1, .build h1{
    font-family: 'Teko', sans-serif;
    font-size: 48px;
}
.survive h3, .explore h3, .fight h3, .build h3{
    font-family: 'Teko', sans-serif;
    font-size: 26px;
    color: var(--blue);
}
.survive p, .explore p, .fight p, .build p{
    font-size: 18px;
}
.newsbody, .stbody, .ppbody, .mrbody, .bibody, .tjbody, .arbody, .contlg{
    background-attachment: fixed;
    background-size: cover;
    background-repeat: no-repeat;
}
.newsbody{
    background-image: url("../img/asteroid.jpg");
}
.stbody{
    background-image: linear-gradient(
         rgb(7, 6, 68), transparent), url("../img/shopping_tycoon/shopping-tycoon-banner.jpg");
}
.ppbody{
    background-image: linear-gradient(
         rgb(7, 6, 68), transparent), url("../img/piggy_princess/piggy-princess-banner.jpg");
}
.mrbody{
    background-image: linear-gradient(
        rgb(7, 6, 68), transparent), url("../img/match3_revolution/match3-revolution-banner.jpg");
}
.bibody{
    background-image: linear-gradient(
        rgb(7, 6, 68), transparent), url("../img/breakout_invaders/breakout-invaders-banner.jpg");
    background-position: center;
}
.tjbody{
    background-image: linear-gradient(
        rgb(7, 6, 68), transparent), url("../img/tompi_jones/tompi-jones-banner.jpg");
}
.arbody{
    background-image: linear-gradient(
        rgb(7, 6, 68), transparent), url("../img/arkhelom_3d/arkhelom-3d-banner.jpg");
    background-position: center;
}
.capt{
    background-color: black;
}
.games h1{
    font-family: 'Teko', sans-serif;
    font-size: 45px;
}
.games h3{
    font-family: 'Teko', sans-serif;
    font-size: 30px;
    opacity: 0.5;
    filter: alpha(opacity=50);
}
.games .st {
    color: #08FB17;
}
.games .pp{
    color: #FB08B5;
}
.games .mr{
    color: var(--blue);
}
.games .bi{
    color: orangered;
}
.games .tj{
    color: red;
}
.games iframe{
    width: 1120px;
    height: 630px;
}
.cols{
    background-color: black;
}
.entries .col-xl-10, .entries .col-lg-10{
    background-color: var(--header);
}
.entries h1{
    font-family: 'Teko', sans-serif;
    font-size: 35px;
}
.entries h5{
    font-size: 16px;
    opacity: 0.5;
    filter: alpha(opacity=50);
}
.entries p{
    font-size: 18px;
}
.contlg{
    background-image: url("../img/contact.jpg");
}
.contmb{
    background-image: url("../img/contactmb.jpg");
}
.cnt.d-flex{
    height: 100vh;
}
.boxcontact{
    width: 100%;
    height: 200px;
    background-color: var(--blue);
    background-image: linear-gradient(var(--blue),white);
    border-radius: 10px 10px 10px 10px;
}
.boxcontact a{
    text-decoration: none;
    color:var(--footer);
}
.boxcontact h1, .boxcontact span{
    color: black;
    font-size: 28px;
}
.dircorreo:hover{
    color: var(--black) !important;
}
.site-footer{
  background-color:#26272b;
  padding:45px 0 20px;
  font-size:15px;
  line-height:24px;
  color:var(--footer);
}
hr{
  border-top-color:#bbb;
  opacity:0.5;
  filter: alpha(opacity=50);
}
.site-footer h6{
  color:var(--white);
  font-size:16px;
  margin-top:5px;
  font-weight: bold;
}
.site-footer a{
  color:var(--footer);
  text-decoration: none;
}
.site-footer a:hover{
  color: var(--hover);
}
.social-icons{
  text-align:center;
}
.social-icons a{
  width:40px;
  height:40px;
  line-height:40px;
  margin-left:6px;
  margin-right:0;
  border-radius:100%;
  background-color:#33353d;
}
@media (max-width: 991.98px) { 
    .dropdown-toggle::after {
        display:inline-block;
    }
    .youtubect iframe, .games iframe{
        width: 746px;
        height: 420px;
    }
}
@media (max-width: 767.98px) { 
    .youtubect iframe, .games iframe{
        box-shadow: none;
        width: 560px;
        height: 315px;
    }
    .logo1{
        height: 16vh;
    }
    .survive, .build, .explore, .fight{
        background-color: var(--header);
        border-top: 2px solid var(--blue);
        background-image: none;
    }
    .build, .fight{
        height: 60vh;
    }
    .survive{
        height: 52vh;
    }
    .explore{
        height: 45vh;
    }
    .survive h1, .explore h1, .fight h1, .build h1, .survive h3, .explore h3, .fight h3, .build h3{
        font-family: 'Teko', sans-serif;
    }
    .survive h1, .explore h1, .fight h1, .build h1{
        font-size: 34px;
    }
    .survive h3, .explore h3, .fight h3, .build h3{
        font-size: 22px;
        color: var(--blue);
    }
    .survive p, .explore p, .fight p, .build p{
        font-size: 18px;
    }
    .boxcontact h1, .boxcontact span{
        color: black;
        font-size: 18px;
    }
}
@media (max-width: 576px) { 
    .banner{
        background-image: none;
        height: 0;
    }
    .youtubect{
        background-image: url("../img/asteroidmb.jpg"); 
    }
    .bannermb{
        background-image: url("../img/triton-survival-banner-mobile.jpg"); 
        height: 90vh;
        background-position: bottom;
        background-size: cover;
        background-repeat: no-repeat;
    }
    .logo2{
        height: 30vh;
    }
}