@media screen and (orientation:landscape) 
{

body
{
font-family:Montserrat;font-weight:200;font-size:1.4vw;line-height:2vw;;color:white;padding:0;
margin:0;background:rgb(60,60,60);
}

select
{
background:rgb(60,60,60);color:rgb(180,180,180);font-size:1vw;width:12vw;
}

a
{
color:rgb(255,255,0);
text-decoration:none;
}

.imlogo
{
width:16vw;position:absolute;left:50vw;margin-left:-8vw;top:5vw;
}

.imlogosmall
{
width:12vw;position:absolute;left:50vw;margin-left:-6vw;top:5vw;
}

.textdiv
{
overflow-y: auto; 
border:1px solid rgb(120,120,120);border-radius:1vw;position:absolute;left:50vw;margin-left:-21vw;
height:9.6vw;width:40vw;top:17vw;padding:1.5vw 1vw 1vw;;font-size:1.4vw;font-family:Montserrat;color:white;
line-height:2.1vw;
}

.header
{
text-align:left;position:absolute;left:50vw;margin-left:-19vw;top:16vw;height:2vw;line-height:2vw;
font-size:1vw;background:rgb(60,60,60);color:white;
}

.button
{
position:absolute;font-size:1.6vw;font-weight:500;height:4vw;line-height:4vw;width:16vw;
left:50vw;margin-left:-8vw;top:35vw;text-align:center;background:rgb(0,162,255);
cursor:pointer;border-radius:2vw;
}

.button_2c
{
position:absolute;font-size:1.6vw;font-weight:500;height:4vw;line-height:4vw;width:14vw;
left:50vw;margin-left:-7vw;top:35vw;text-align:center;background:rgb(0,162,255);
cursor:pointer;border-radius:2vw;
}

.button_2l
{
position:absolute;font-size:1.4vw;font-weight:500;height:3vw;line-height:3vw;width:12vw;
left:50vw;margin-left:-20vw;top:35.5vw;text-align:center;background:rgb(120,120,120);
cursor:pointer;border-radius:2vw;
}

.button_2r
{
position:absolute;font-size:1.4vw;font-weight:500;height:3vw;line-height:3vw;width:12vw;
left:50vw;margin-left:8vw;top:35.5vw;text-align:center;background:rgb(80,80,80);
color:rgb(220,120,0);
cursor:pointer;border-radius:2vw;
}

.footer
{
text-align:center;position:absolute;width:80vw;left:10vw;
top:40vw;
height:5vw;line-height:5vw;
font-size:1vw;color:rgb(120,120,120);
}

.noter
{
text-align:center;position:absolute;width:30vw;left:50vw;margin-left:-15vw;top:29.5vw;height:1.5vw;line-height:1.5vw;
font-size:1vw;color:rgb(120,120,120);background:rgba(60,60,60,0.9);
}

.question
{
font-family:Montserrat;
font-style:italic;
font-weight:200;
border:none;
text-align:center;
padding:0;margin:0;
position:absolute;width:8vw;left:45.7vw;margin-left:-4vw;top:31.2vw;height:2vw;line-height:2vw;
font-size:1.3vw;color:rgb(120,120,120);background:rgb(65,65,65);
text-transform:lowercase;
}

.login
{
text-align:left;
position:absolute;
left:50vw;
width:26vw;
margin-left:-13vw;
top:20vw;
}

.login_input
{
float:right;
color:rgb(120,120,120);
border:none;
background:rgb(70,70,70);
width:15vw;
font-size:1.4vw;
line-height:2vw;
height:2vw;
}

.loggedin
{
position:absolute;
left:34vw;
top:8.4vw;
cursor:pointer;
margin-left:-1.5vw;
background-image:url("https://x.roya.vc/images/logged_in.png");
background-size:2vw;
width:2vw;
height:2vw;
}

.loggedout
{
position:absolute;
left:34vw;
top:8.4vw;
cursor:pointer;
margin-left:-1.5vw;
background-image:url("https://x.roya.vc/images/logged_out.png");
background-size:2vw;
width:2vw;
height:2vw;
opacity:0.5;
}

.loggedin2
{
position:absolute;
cursor:pointer;
left:23vw;
top:7.5vw;
margin-left:-1.5vw;
background-image:url("https://x.roya.vc/images/logged_in.png");
background-size:2vw;
width:2vw;
height:2vw;
}

.fullscreen
{
position:absolute;left:0;top:0;width:100vw;height:100vh;
}

.videopanel
{
position:absolute;left:50vw;top:21vw;width:10vw;margin-left:0vw;height:3vw;line-height:3vw;font-size:1.4vw;
color:white;background-image:url('https://x.roya.vc/images/videopanel.png');background-size:10vw;
text-align:center;display:none;opacity:0.8;
}

.videobutton
{
position:absolute;top:0vw;width:3vw;height:3vw;
cursor:pointer;
}

.videoinput
{
opacity: 0.0; position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height:100%;
}

.loader
{
position:absolute;left:0;top:0;height:100vh;width:100vw;;margin:0;padding:0;
background:rgb(50,150,255);opacity:0.8;display:none;text-align:center;color:white;font-size:5vh;
font-weight:500;
}

.ls_list
{
display:block;
cursor:pointer;
padding:0.5vw 0 0.5vw;
opacity:0.7;
}

.ls_list:hover
{
opacity:1;
padding:0.5vw 0 0.5vw;
display:block;
cursor:pointer;
}

.top-right
{
position:absolute;
text-align:right;
left:70vw;
width:9vw;
top:7.7vw;
cursor:pointer;
font-size:3vw;
color:rgb(200,200,200);
font-family:Montserrat;
}

.gianttextdiv
{
overflow-y: auto; 
background:rgb(30,30,30);
border:1px solid rgb(120,120,120);border-radius:1vw;position:absolute;left:50vw;margin-left:-31vw;
height:25vw;width:60vw;top:12vw;padding:1.5vw 1vw 1vw;;font-size:1.4vw;font-family:Montserrat;color:white;
line-height:2.1vw;
}


}



@media screen and (orientation:portrait)
{

body
{
font-family:Montserrat;font-weight:200;font-size:1.4vw;line-height:2vw;;color:white;padding:0;
margin:0;background:rgb(60,60,60);
}

select
{
background:rgb(60,60,60);color:rgb(250,250,250);font-size:3vw;width:28vw;
}

a
{
color:rgb(255,255,0);
text-decoration:none;
}

.imlogo
{
width:40vw;position:absolute;left:50vw;margin-left:-20vw;top:5vw;
}

.imlogosmall
{
width:30vw;position:absolute;left:50vw;margin-left:-15vw;top:3vw;
}

.textdiv
{
overflow-y: auto; 
border:1px solid rgb(120,120,120);border-radius:3vw;position:absolute;left:50vw;margin-left:-43vw;
height:60vw;width:80vw;top:32vw;padding:6vw 3vw 3vw;;font-size:7vw;font-family:Montserrat;color:white;
line-height:9vw;
}

.header
{
text-align:left;position:absolute;left:50vw;margin-left:-38vw;top:30vw;height:4vw;line-height:4vw;
font-size:3vw;background:rgb(60,60,60);color:white;
}

.button
{
position:absolute;font-size:6vw;font-weight:500;height:12vw;line-height:12vw;width:60vw;
left:50vw;margin-left:-30vw;top:120vw;text-align:center;background:rgb(0,162,255);
cursor:pointer;border-radius:6vw;
}

.button_2c
{
position:absolute;font-size:6vw;font-weight:500;height:12vw;line-height:12vw;width:34vw;
left:50vw;margin-left:-17vw;top:120vw;text-align:center;background:rgb(0,162,255);
cursor:pointer;border-radius:6vw;
}

.button_2l
{
position:absolute;font-size:4vw;font-weight:500;height:9vw;line-height:9vw;width:22vw;
left:50vw;margin-left:-42vw;top:121.5vw;text-align:center;background:rgb(120,120,120);
cursor:pointer;border-radius:6vw;
}

.button_2r
{
position:absolute;font-size:4vw;font-weight:500;height:9vw;line-height:9vw;width:22vw;
left:50vw;margin-left:20vw;top:121.5vw;text-align:center;
background:rgb(80,80,80);
color:rgb(220,120,0);
cursor:pointer;border-radius:6vw;
}

.footer
{
text-align:center;position:absolute;width:80vw;left:10vw;
top:142vw;
height:5vw;line-height:5vw;
font-size:3vw;color:rgb(120,120,120);
}

.noter
{
text-align:center;position:absolute;width:74vw;margin-left:-37vw;left:50vw;top:103vw;height:5vw;line-height:5vw;
font-size:3.6vw;color:rgb(120,120,120);background:rgba(60,60,60,0.9);
}

.question
{
font-family:Montserrat;
font-style:italic;
font-weight:200;
border:none;
text-align:center;
padding:0;margin:0;
position:absolute;width:40vw;left:28vw;margin-left:-20vw;top:107.5vw;height:7vw;line-height:7vw;
font-size:5vw;color:rgb(120,120,120);background:rgb(65,65,65);
text-transform:lowercase;
}


.login
{

font-size:6vw;
line-height:10vw;
text-align:center;
position:absolute;
left:50vw;
width:60vw;
margin-left:-30vw;
top:42vw;
}

.login_input
{
padding:0;
margin:0;
color:rgb(120,120,120);
border:none;
background:rgb(70,70,70);
width:55vw;
font-size:6vw;
line-height:8vw;
height:8vw;
}

.loggedin
{
position:absolute;
left:14vw;
top:12vw;
margin-left:-5vw;
background-image:url("https://x.roya.vc/images/logged_in.png");
background-size:8vw;
width:8vw;
height:8vw;
}

.loggedout
{
position:absolute;
left:14vw;
top:12vw;
margin-left:-5vw;
background-image:url("https://x.roya.vc/images/logged_out.png");
background-size:8vw;
width:8vw;
height:8vw;
opacity:0.5;

}

.loggedin2
{
position:absolute;
left:6vw;
top:7.5vw;
background-image:url("https://x.roya.vc/images/logged_in.png");
background-size:8vw;
width:8vw;
height:8vw;
}

.fullscreen
{
position:absolute;left:0;top:0;width:100vw;height:100vh;
}

.videopanel
{
position:absolute;left:50vw;margin-left:0vw;top:55vw;width:40vw;height:13vw;line-height:13vw;
background-image:url('https://x.roya.vc/images/videopanel.png');background-size:40vw;
text-align:center;display:none;opacity:0.8;
}

.videobutton
{
position:absolute;top:0vw;width:12vw;height:13vw;
cursor:pointer;
}

.videoinput
{
opacity: 0.0; position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height:100%;
}

.loader
{
position:absolute;left:0;top:0;height:100vh;width:100vw;;margin:0;padding:0;
background:rgb(50,150,255);opacity:0.8;display:none;text-align:center;color:white;font-size:5vh;
font-weight:500;
}

.ls_list
{
display:block;
cursor:pointer;
opacity:0.9;
padding:3.5vw 0 3.5vw;
}

.ls_list:hover
{
padding:3.5vw 0 3.5vw;
opacity:1;
display:block;
cursor:pointer;
}

.top-right
{
position:absolute;
text-align:right;
left:87vw;
width:9vw;
top:10vw;
cursor:pointer;
font-size:16vw;
color:rgb(200,200,200);
font-family:Montserrat;
}

.gianttextdiv
{
overflow-y: auto; 
background:rgb(30,30,30);
border:1px solid rgb(120,120,120);border-radius:3vw;position:absolute;left:50vw;margin-left:-48vw;
height:100vw;width:90vw;top:22vw;padding:6vw 3vw 3vw;;font-size:5vw;font-family:Montserrat;color:white;
line-height:6.5vw;
}


}