/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

/* SCROLL 
------------------------------------------------------------ */
::-webkit-scrollbar {
  width: 5px;
}

::-webkit-scrollbar-track {
  background-color:transparent;
}

::-webkit-scrollbar-thumb {
  background-color:#00ff00;
}

/* NAVIGATION
------------------------------------------------------------ */
#navigation{
  width:95%;
  height:auto;
  margin:0;
  padding:0;
  position:relative;
  color:#00ff00;
  text-align:left;
  overflow-y:auto;
  overflow-x:hidden;
}

#hubbardian{
  width:100%;
  height:49vw;
  margin:0 auto;
  padding:0;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  position:relative;
  -webkit-transition:.5s;
  -o-transition:.5s;
  transition:.5s;
} 

#hubbardian:hover{
  -webkit-filter:drop-shadow(0 -2px 3px #00ff00);
          filter:drop-shadow(0 -2px 3px #00ff00);
}

#hubbardian > p{
  width:50%;
  height:100%;
  margin:0;
  padding:0;
  background-size:100%;
  background-repeat:no-repeat;
  background-position:bottom left; 
}

#hubbardian > p:nth-child(1){
  background-image:url(../image/tg/sion_pixel_gr.png);
}

#hubbardian > p:nth-child(2){
  background-image:url(../image/tg/timegreen_pixel_gr.png);
}

#navigation > h1{
  display:block;
  margin:0;
  padding:0;
  font-size:9.5vw;
  font-weight:bold;
  text-align:center;
}

#navigation font{
  display:block;
  font-size:3.5vw;
  line-height:.9em;
  font-weight:bold;
  text-align:center;
}

#navigation span{
  width:100%;
  display:block;
  margin:1% 0%;
  padding:.5% 0%;
  color:#000;
  font-size:4.6vw;
  font-weight:bold;
  background-color:#00ff00;
}

#navigation ul{
  margin:0;
  padding:0% 0% 0% 6%;
  color:#00ff00;
  font-size:4vw;
  line-height:4.5vw;
  list-style-type: square;
  text-align:left;
}

#navigation li > a{
  display:block;
  color:#00ff00;
  font-size:5vw;
  text-decoration:none;
}

#navigation li > a:hover{
  color:#000;
  background-color:#00ff00;
}

#sedative > img{
  width:3.5vw;
  height:3.5vw;
  margin:1% 0%;
}


/* FOR PORTRAIT
------------------------------------------------------------ */
@media screen and (orientation: portrait) {

.min{
  width:100%;
  margin:0;
  padding:0;
  display:block;
}

}

/* FOR LANDSCAPE
------------------------------------------------------------ */
@media screen and (orientation: landscape) {

#navigation{
  width:100%;
  height:23vw;
  color:#000;
  overflow:hidden;
  background-color:#00ff00;
  overflow-wrap:break-word;
}

#hubbardian{
  display:none;
} 

#navigation > h1{
  display:none;
}

#navigation font{
  display:none;
}

.min{
  width:48%;
  margin:1% 0%;
  padding:0;
  display:inline-block;
  vertical-align:top;
}

#navigation span{
  display:none;
}

#navigation ul{
  width:90%;
  margin:0;
  padding:0% 0% 0% 10%;
  color:#000;
  line-height:2.7vw;
  list-style-type: square;
  text-align:left;
}

#navigation li > a{
  display:block;
  color:#000;
  font-size:3vw;
  font-weight:bold;
  text-decoration:none;
}

#navigation li > a:hover{
  color:#00ff00;
  background-color:#000;
}

#sedative > img{
  width:3.5vw;
  height:3.5vw;
  margin:1% 0%;
}

}