html, body {
  margin: 0;
  background:#1a1a1a;
  color: #fff;
  font-size:16px;
  font-family: Tahoma, Geneva, sans-serif; 
  overflow-x: hidden;
  width: screen-width;

}
body{
 padding: 3% 17% 3% 17%; 
}
.bg{
 top: 0;
 left: 0;
 position: absolute;
 background: url('files/tthbg.png');
 opacity: 0;
 width: 100%;
 height: 100%;
 z-index: -1;
}
.phone{
visibility: hidden;
}
.nav .container {
 background: transparent;
 top: 0;
 left: 0;
 padding: 0;
 width: 100%;
 padding-bottom: 5%;
}
.nav p {
text-align: center;
}
.nav p a {
  color: #fff;
  font-size: 24px;
}
.nav p a span{
  border-bottom: 2px solid #fff;
}
.nav p a:hover{
  text-decoration: none;
}
.nav p a:focus{
  text-decoration: none;
}
.nav .gallery{
padding:17px 20px 17px 20px;
outline:2px solid #fff;
width: 232px;
letter-spacing: 6px;
font-weight: 900;
text-align: center;
}
.nav .gallery span{
border-bottom: none;
font-weight: normal;
}
.current span{
 letter-spacing: 24px;
 border-bottom: 2px solid #fff;
}
.current .second{
 letter-spacing:6px;
 border-bottom: none;
 font-size: 16px;
 font-weight: 300px;
}
.archive{
float: right;
}

.main, .main2 {
width: screen-width;
overflow: hidden;
}
.main .container{
 border-top: 2px solid #fff;
 padding-top: 6%;
 padding-bottom: 6%;
 width: 100%;
}


.main .col-md-8{
overflow: hidden;
margin-right: 40px;
max-width: 100%;
max-height: 450px;
padding: 0;
background: transparent;
}
.main iframe {
    border: 4px solid #fff;
    overflow: hidden;
    -ms-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -o-transform: scale(0.5);
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    
    -ms-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;

}
.main #overlay, .main2 #overlay{
    -ms-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -o-transform: scale(0.5);
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    
    -ms-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}
.main .col-md-4{
float: right;
max-width: 260px;
text-align: right;
}
.main h1{
  font-size: 24px;
}
.main p{
 font-size:16px;
}
.main a{
margin-top:12px;
color: #fff;
text-decoration: none;
}

.past {
 width: screen-width;
 text-align: right;
}
.past h1{
font-size:24px;
letter-spacing: 16px;
}
.note{
position: relative;
background: #1a1a1a;
width: 170px;
top: 24px;
margin-left: auto;
margin-right: auto;
}

.past1{
width: device-width;
padding: 0;
margin: 0;
border-top: 2px solid #fff;
}
.description {
cursor: pointer;
font-size: 24px;
padding: 1% 0;
}

.content{
 display: none;
}
.main2 {
 width: screen-width;
}
.main2 .container{
 width: 100%;
 padding-top: 6%;
 padding-bottom: 6%;
}
.main2 .col-md-8{
padding: 0;
overflow: hidden;
margin-right: 40px;
max-width: 100%;
max-height: 450px;
background: transparent;
}
.main2 iframe{
    border: 4px solid #fff;
    overflow: hidden;
    -ms-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -o-transform: scale(0.5);
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    
    -ms-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}


.main2 .col-md-4{
float: right;
max-width: 270px;
text-align: right;
}
.main2 h1{
 font-size: 24px;
}
.main2 p{
 font-size:16px;
}
.main2 a{
margin-top:12px;
color: #fff;
text-decoration: none;
}
.main2 a:hover, .main a:focus{
text-decoration: none;
color: rgba(250,169,115,1);
}
.support2{
padding: 0;
margin: 0;
text-align: center;
margin-bottom: 3%;
}

.support2 #game2, .support2 #game1, .support2 img{
max-width: 100%;;
margin-bottom: 12px;
text-align: left;
}
.support2 #game1, .support2 img{
border: 2px solid #fff;
}
#game1{
padding: 11px;
cursor: default;
}
.action{
animation: act 3s ease-in infinite;
}
#tth2{
color: rgba(250,169,115,1);
}
.big{
font-size: 32px;
letter-spacing: 8px;
color:#fff;
opacity:0;
text-align: center;
}
@keyframes act{
0%{opacity: 0}
50%{opacity: 1}
100%{opacity: 0}
}


a:focus { 
    outline: none; 
}
.active{
display: show;
}
#tth:hover, #tth:focus{
text-decoration: none;
color: rgba(250,169,115,1);
}
#koen:hover, #koen:focus{
text-decoration: none;
color: #32CD32;
}


@media (min-width: 1280px) and (max-width: 1600px){
.nav p a {
  font-size: 18px;
}
.current .second{
 letter-spacing:4px;
 font-size: 12px;
}

.main .col-md-4, .main2 .col-md-4{
float: right;
max-width: 270px;
text-align: right;
}
.main h1, .main2 h1{
  font-size: 18px;
}
.main p, .main2 p{
 font-size:12px;
}
.description {
font-size: 18px;
}
.main .col-md-8, .main2 .col-md-8{
margin-right: 0px;
max-width: 100%;
max-height: 300px;
padding: 0;
background: transparent;
text-align: center;
}
.main iframe, .main2 iframe {
     border: 6px solid #fff;
    -ms-transform: scale(0.33);
    -moz-transform: scale(0.33);
    -o-transform: scale(0.33);
    -webkit-transform: scale(0.33);
    transform: scale(0.33);
    
    -ms-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}
.main #overlay, .main2 #overlay{
    -ms-transform: scale(0.33);
    -moz-transform: scale(0.33);
    -o-transform: scale(0.33);
    -webkit-transform: scale(0.33);
    transform: scale(0.33);
    
    -ms-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}
}

@media (min-width: 961px) and (max-width: 1279px){
.nav p a {
  font-size: 16px;
}
.current .second{
 letter-spacing:1px;
 font-size: 12px;
}
.current span{
 letter-spacing: 12px;
}
.nav .gallery{
padding:12px 16px 12px 16px;
outline:2px solid #fff;
width: 164px;
letter-spacing: 6px;
font-weight: 900;
text-align: center;
}
.main .col-md-4, .main2 .col-md-4{
float: right;
max-width: 225px;
text-align: right;
}
.main h1, .main2 h1{
  font-size: 16px;
}
.main p, .main2 p{
 font-size:12px;
}
.description {
font-size: 16px;
}
.main .col-md-8, .main2 .col-md-8{
margin-right: 0px;
max-width: 100%;
max-height: 270px;
padding: 0;
background: transparent;
}

.main iframe,.main2 iframe{
border: 8px solid #fff;
    -ms-transform: scale(0.25);
    -moz-transform: scale(0.25);
    -o-transform: scale(0.25);
    -webkit-transform: scale(0.25);
    transform: scale(0.25);
    
    -ms-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}
.main #overlay, .main2 #overlay{
    -ms-transform: scale(0.25);
    -moz-transform: scale(0.25);
    -o-transform: scale(0.25);
    -webkit-transform: scale(0.25);
    transform: scale(0.25);
    
    -ms-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}
}

@media (max-width: 960px){
.nav p {
 display: inline;
 margin-right: 0;
}
.nav p a {
  font-size: 16px;
}
.nav .col-md-4{
  margin-top: 10px;
}
.current span{
 letter-spacing: 8px;
}
.current .second{
 letter-spacing:0px;
 font-size: 11px;
}
.nav .gallery{
padding:4px 6px 4px 6px;
outline:2px solid #fff;
width: 132px;
letter-spacing: 4px;
text-align: center;
}
.archive{
float: left;
}
.main .col-md-4, .main2 .col-md-4{
float: left;
max-width: 270px;
text-align:left;
}
.main h1, .main2 h1{
  font-size: 16px;
}
.main p, .main2 p{
 font-size:12px;
}
.main .col-md-8, .main2 .col-md-8{
margin-right: 0px;
max-width: 100%;
max-height: 225px;
padding: 0;
overflow: hidden;
background: transparent;
}
.description {
font-size: 16px;
}
.main iframe,.main2 iframe {
    border: 8px solid #fff;
    -ms-transform: scale(0.25);
    -moz-transform: scale(0.25);
    -o-transform: scale(0.25);
    -webkit-transform: scale(0.25);
    transform: scale(0.25);
    
    -ms-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}
.main #overlay, .main2 #overlay{
    -ms-transform: scale(0.25);
    -moz-transform: scale(0.25);
    -o-transform: scale(0.25);
    -webkit-transform: scale(0.25);
    transform: scale(0.25);
    
    -ms-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}
}
