/*Fonts*/ 
@font-face { font-family:brand; font-style:normal; font-weight:normal; src:url("resin.otf"); }
@font-face { font-family:myriad; font-style:normal; font-weight:normal; src:url("myriad.ttf"); }


/*Pré-Loader*/ 
#preloader { z-index:999; position:fixed; display:flex; width:100vw; height:100vh; margin:0 ; background-color:white; }


/*Background*/
body { margin:0; height:100vh; padding:0; }


/*Images*/
.rm_logo { margin-top:-2.5vh; width:auto; height:10vh; }
.logo { width:5vh; height:2.5vh; border: 0.1vh solid Grey; border-radius: 1vh; }
.small_media { width:auto; height:3vh; margin: 0 0.25vw 0 0.25vw; }
.big_media { width:auto; height:6vh; margin: 0 0.5vw 0 0.5vw; }
.qrcode { width:12vw; height:12vw; }


/*Top Bar*/
#top_bar { position:fixed; display:block; top:5vh; padding:0; width:100vw; height:5vh; background-color:white; }
#top_contents { display:flex; justify-content:space-between; margin-left:20vw; width:60vw; height:5vh; }
#menu { display:flex; justify-content:space-between; align-items:center; width:40vw; height:5vh; }
#current { display:flex; justify-content:space-between; align-items:center; width:5vw; height:5vh; }
#sub_menu { display:flex; justify-content:space-between; align-items:center; width:14vw; height:5vh; }
#top_media { position:absolute; display:flex; justify-content:flex-end; margin:-4vh 0 0 66vw; align-items:center; width:14vw; height:3vh; }


/*Main Contents*/
#main_contents { display:flex; top:0; padding:0; flex-direction:column; }
#content { display:flex; padding:0; width:100vw; height:85vh; background-position:center; background-size: cover; }
#separator { display:flex; padding:0; width:100vw; height:10vh; }
#big_titles { display:flex; margin-left:20vw; align-self:center; width:30vw; flex-direction:column; }
#titles { display:flex; margin-left:20vw; align-self:center; width:20vw; flex-direction:column; }
#social { display:flex; flex-direction:row; align-self:center; width:40vw; max-height:60vh; }
#archive { display:flex; flex-direction:column; align-self:center; width:40vw; height:60vh; }
#texts { display:flex; flex-direction:column; align-self:center; width:40vw; max-height:60vh; }


/*Text Area*/
#text_row { display:flex; flex-direction:row; justify-content:space-between; width:40vw; margin:2vh 0 2vh 0; }
#text_column { display:flex; flex-direction:column; justify-content:center; width:40vw; margin:2vh 0 2vh 0; }
#text_content { display:flex; justify-content:center; align-items:center; margin:2vh 0 2vh 0; flex-wrap:wrap; }
#archive_tabs { display:flex; flex-direction:row; justify-content:space-between; width:40vw; height:5vh;}
#archive_titles { display:flex; flex-direction:row; justify-content:space-between; width:40vw; height:5vh;}
#time_titles { display:flex; justify-content:flex-start; align-items:center; width:6vw; height:5vh;}
#user_titles { display:flex; justify-content:flex-start; align-items:center; width:3vw; height:5vh; }
.time_area { display:none; flex-direction:column; width:40vw; height:50vh; overflow-y: hidden; }
.users_area { display:none; flex-direction:column; width:40vw; height:50vh; overflow-y:hidden; }
#archive_row { display:flex; flex-direction:row; justify-content:space-between; width:40vw; }
#time_item { display:flex; justify-content:flex-start; align-items:center; width:6vw; }
#user_item { display:flex; justify-content:flex-start; align-items:center; width:3vw; }


/*Bottom Bar*/
#bottom_bar{ position:fixed; display:block; top:95vh; padding:0; width:100vw; height:5vh; border-top: 0.5vh solid #00309A; background-color:white; }
#bottom_contents { display:flex; justify-content:space-between; align-items: center; margin-left:20vw; width:60vw; height:5vh; }
#main_links { display:flex; justify-content:space-between; width:14vw; }


/*Texts*/
.logo_big { font-family:brand; margin:1vh 0; font-size:4vh; letter-spacing:1.75vh; }
.logo_medium { font-family:brand; margin:1vh 0; font-size:3vh; letter-spacing:1.5vh; }
.logo_brand { color:#0000FF; font-family:brand; font-size:2vh; letter-spacing:1vh; }
.big_text { font-family:myriad; margin:0.5vh 0; font-size:3vh; letter-spacing:0.5vh; text-justify:inter-word; font-variant-ligatures: no-common-ligatures; }
.medium_text { font-family:myriad; margin:0.5vh 0; font-size:2vh; letter-spacing:0.25vh; text-justify:inter-word; font-variant-ligatures: no-common-ligatures; }
.normal_text {color:#999999; font-family:myriad; font-size:2vh; text-align: justify; text-justify:inter-word; font-variant-ligatures: no-common-ligatures; }
.small_text {color:#999999; font-family:myriad; font-size:1.75vh; text-align: justify; text-justify:inter-word; font-variant-ligatures: no-common-ligatures; }
.mini_text {color:#999999; font-family:myriad; font-size:1.5vh; text-align: justify; text-justify:inter-word; font-variant-ligatures: no-common-ligatures; }
.text_brand { color:#0000FF; font-family:myriad; font-size:2vh; text-justify:inter-word; font-variant-ligatures: no-common-ligatures; }
.menu_text { margin-left:-2vh; color:black; font-family:myriad, monospace; font-size:2vh; font-weight:300; font-variant-ligatures: no-common-ligatures; letter-spacing:0.1vw; }
.copyright { margin-left:9.3vh; color:#999; font-family:myriad; font-size:1.25vh; }


/*Inputs*/
.inputs { height:4vh; border:1px solid #999999; border-radius: 1vh; padding-top:1vh; text-align:center; font-family:myriad; font-size:1.75vh; }
.inputs:read-only { background:#DDDDDD; }
label { position:absolute; display:block; height:2vh; margin-top:-5vh; padding:0.5vh 0.5vw 0 0.5vw; background-color:#999; border-radius:2vh; color:white; text-align:center; font-family:myriad; }


/*Buttons*/
.buttons { width:20vw; height:5vh; background:#00309A; border-radius:1vh; border:1px solid #00309A; text-align:center; color:white; font-family:myriad; font-size:2vh; cursor:pointer; }
#archive_tabs button { width:10vw; height:5vh; background:#EEEEEE; border:none; text-align:left; color:#FF0000; font-family:myriad; font-size:2vh; cursor:pointer; }
#archive_tabs button:hover { background:#CCCCCC; }
#archive_tabs button.active { color:#0000FF; }


/*Links*/
a { text-decoration:none; color:#FF0000; font-family:myriad; font-size:2vh; }
a.current:link, a.current:visited { font-family:myriad; font-size:1.75vh; color:#FF0000; text-decoration:none; cursor:pointer; }
a.menu:link, a.menu:visited { font-family:myriad; color:#0000FF; text-decoration:none; cursor:pointer; font-size:1.75vh; }
a.account:link, a.account:visited { width:6vw; height:2.5vh; padding-top:0.5vh; border-radius:1vh; text-align:center; font-family:myriad; font-size:1.5vh; color:white; text-decoration:none; cursor:pointer; }
a.knowmore:link, a.knowmore:visited { margin-top:2vh; width:8vw; height:3vh; padding-top:1vh; border-radius:1vh; background:white; text-align:center; font-family:myriad; font-size:1.75vh; text-decoration:none; cursor:pointer; }
a.bottom:link, a.bottom:visited { text-decoration:none; color:#FF0000; font-family:myriad; font-size:1.75vh; }