/* GAMETOBER HOME PAGE THEME */

.gametober .home-page {
    background-color: black;
}

.gametober .left-banner, .gametober .right-banner {
    height: 592px;
    width: 400px;
}

.gametober .left-banner {
    background-image: url('/marketing/images/181001/en/left.jpg');
    background-size: cover;
    left: -400px;
}

html.french .gametober .left-banner {
    background-image: url('/marketing/images/181001/fr/left.jpg');
}

.gametober .left-banner a img, .gametober .right-banner a img {
    height:320px;
    width: 400px;
}

.gametober .right-banner {
    background-image: url('/marketing/images/181001/en/right.jpg');
    background-size: cover;
    right: -400px;
}

html.french .gametober .right-banner {
    background-image: url('/marketing/images/181001/fr/right.jpg');
}

.gametober #hp-gametober{
    background-image: linear-gradient(to bottom,#f0f2f5 00%, #f0f2f5 50%, #0f035600 80%,#0f035600 100%);
}
/* GAMETOBER LANDING PAGE */

.gametober-hero-left {
    right: 0;
}

.gametober-hero-left, .gametober-hero-right {
    position: absolute;
    width: 200%;
}

#gametober-landing, #gametober-hero{
    background-color: #282E3A;
}

.btn-gametober {
    background-color:#43ffda;
    border-radius: 50px;
}

.btn-gametober:hover {
    background-color:#009688;
}

#gametober-landing .gametober-side {
    width:100%;
    height:200%;
    background-image: url("https://staging.canadacomputers.com/templates/ccnew/assets/img/side.gif");
    background-repeat: repeat-y;
    animation: slide-top 2s steps(4, end) 0s infinite reverse none running;
}

@-webkit-keyframes slide-top {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(-100px);
            transform: translateY(-100px);
  }
}
@keyframes slide-top {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(-100px);
            transform: translateY(-100px);
  }
}

#gametober-landing .gametober-side {
    width:60px;
    height:120%;
    background-repeat: repeat-y;
    animation: slide-top 2s steps(4, end) 0s infinite reverse none running;
}

#gametober-landing .left {
    position:absolute;
    right:0;
    background-image: url("https://staging.canadacomputers.com/templates/ccnew/assets/img/side.gif");
}
#gametober-landing .right {
    position:absolute;
    left:0;
    background-image: url("https://staging.canadacomputers.com/templates/ccnew/assets/img/side-r.gif");
}

#gametober-landing .pl-hdr-product_title {
    max-height: 5.3em;
    min-height: 5.3em;
}

@media only screen and (max-width: 691px) {
    #gametober-landing .btn strong {
        font-size: 12px;
    }
}

.ani-slow-bounce {
	-webkit-animation: slow-bounce 2.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate both;
	        animation: slow-bounce 2.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate both;
}

@-webkit-keyframes slow-bounce {
  0% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  100% {
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
  }
}
@keyframes slow-bounce {
  0% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  100% {
    -webkit-transform: translateY(-50px);
            transform: translateY(-50px);
  }
}

.ani-slow-bounce-rev {
	-webkit-animation: slow-bounce-rev 2.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate both;
	        animation: slow-bounce-rev 2.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate both;
}

@-webkit-keyframes slow-bounce-rev {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
  }
}
@keyframes slow-bounce-rev {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
  }
}

.gametober-side-shadow {
    position: absolute;
    top: -5%;
    left:-5%;
    height:110%;
    width: 110%;
    background-image: linear-gradient(to bottom, #282e3a 0%,#282e3a 5%,#282e3a00 40%,#282e3a00 60%,#282e3a 85%, #282e3a 100%);
    z-index: 1;
}