/*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"); }


/*Background*/
html { margin:0; height:100vh; overflow:hidden }
body { margin:0; height:100vh; padding:0; background:url(pattern.png); background-size: 1vh auto; background-repeat:repeat; background-attachment:fixed; overflow:hidden; }
#fade { z-index:-1; position: fixed; display:block; top:0; padding:0; width:100vw; height:100vh; background-color:white; opacity:0.7; }
iframe { position:fixed; display:flex; top:0; left:0; padding:0; width:100vw; height:100vh; scale:1.6; transform-origin: 50% 0; overflow-y:auto; }


/*Lock Screen*/
@media screen and (orientation:landscape) {
	#lock_screen { display:none; }
	iframe  { display:flex; }
}
@media screen and (orientation:portrait) {
	#lock_screen { z-index:5; position: fixed; display:flex; top:0; padding:0; width:100vw; height:100vh; backdrop-filter: blur(10px); align-items:center; justify-content:center; }
	iframe { display:none; }
}


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


/*Intro*/
#intro { position:fixed; display:flex; top:0; padding:0; width:100vw; height:94vh; justify-content:center; align-items:center; background-image: linear-gradient(rgba(0,51,153,0.25),rgba(255,255,255,0.25),rgba(0,51,153,0.25)); }
#intro_content {display:flex; width:60vw; justify-content:center; flex-direction:column;}
#intro_elements { display:flex; width:60vw; height:18vh; margin:4vh 0 4vh; justify-content:space-between; flex-direction:row;}
#intro_element { width:18vh; height:18vh; border-radius:50%; background-size:contain; box-shadow:0 1vh 1vh #999; }
#intro_text { display:flex; width:60vw; height:6vh; justify-content:center; align-items:center; }
.intro_element_link {transition: transform 1.5s; }
.intro_element_link:hover { -ms-transform: scale(1.25); -webkit-transform: scale(1.25); transform: scale(1.25); }


/*Mini Top Bar*/
#mini_bar { position:fixed; display:flex; top:0vh; padding:0; width:100vw; height:4vh; justify-content:center; background-color:#003399; }
#mini_contents { display:flex; flex-direction:row; width:60vw; height:4vh; justify-content:space-between; }
#mini_bar_text { display:flex; width:12vw; height:4vh; align-items:center; }
#mini_elements { display:flex; width:6vw; height:4vh; justify-content:space-between; flex-direction:row; }
#mini_element { width:1.75vh; height:1.75vh; border-radius:50%; align-self:center; background-size:contain; }
#social_group { display:flex; width:12vw; height:4vh; justify-content:right; }
.social { width:auto; height:1.75vh; margin:0.5vw 0 0 1vw; }


/*Top Bar*/
#top_bar { position:fixed; display:flex; top:4vh; padding:0; width:100vw; height:18vh; justify-content:center; }
#area { display:flex; width:12vw; height:18vh; justify-content:center; align-items:center; }
#banner { display:flex; width:36vw; height:18vh; justify-content:center; align-items:center; background-image: linear-gradient(rgba(0,51,153,0.25),rgba(255,255,255,0.25),rgba(0,51,153,0.25)); }
#account { display:flex; width:12vw; height:18vh; margin-top:-0.25vh; justify-content:center; align-items:center; }
#area_buttons { display:flex; width:10vw; height:18vh; justify-content:center; flex-direction:column; }


/*Middle Bar*/
#middle_bar { position:fixed; display:flex; top:22vh; padding:0; width:100vw; height:4vh; justify-content:center; }
#middle_contents { display:flex; flex-direction:row; width:60vw; height:4vh; border-radius:1vh; justify-content:space-between; background-color:#003399; }
#middle_bar_text { display:flex; width:12vw; height:4vh; justify-content:center; text-align:center; }
#search { display:flex; justify-content:center; align-items:center; width:30vw; height:4vh; }


/*Bottom Bar*/
#bottom_bar{ z-index:2; position:fixed; display:block; top:94vh; padding:0; width:100vw; height:6vh; border-top: 0.2vh solid #003399; background-color:white; }
#bottom_contents { display:flex; justify-content:center; align-items: center; margin-left:20vw; width:60vw; height:6vh; }
#main_links { display:flex; justify-content:space-between; width:14vw; }


/*Main Contents*/
#main_contents { position:fixed; display:flex; top:26vh; padding:0; width:100vw; height:74vh; justify-content:center; }
#contents { display:flex; flex-direction:row; width:60vw; height:74vh; justify-content:space-between; }
#filters { display:flex; width:12vw; height:74vh; justify-content:center; border-right:1px dotted #CCCCCC; overflow-y:auto; }
#filters_holder { display:flex; width:10vw; height:74vh; justify-content:left; flex-direction:column; }
#scales { display:flex; width:12vw; height:74vh; justify-content:center; border-left:1px dotted #CCCCCC;}
#scales_holder { display:flex; width:10vw; height:74vh; justify-content:left; flex-direction:column; overflow-y:auto; }
#content { display:flex; margin:0.5vh 0 0.5vh 0; }


/*Products*/
#technical{ display:flex; width:12vw; height:74vh; justify-content:center; border-right:1px dotted #CCCCCC; overflow-y:auto; }
#technical_holder { display:flex; width:10vw; height:74vh; justify-content:left; flex-direction:column; }
#technical_data { display:flex; margin:0.5vh 0vw 0.5vh 0vw; height:6vh; width:12vw; justify-content:left; }
#text_data { width:14vw; height:auto; }
#text_row { display:flex; flex-direction:row; justify-content:space-between; width:40vw; margin:0.5vh 1vw 0.5vh 1vw; }
#text_column { display:flex; flex-direction:column; justify-content:left; }


/*Show Case*/
#showcase { display:flex; width:36vw; height:68vh; flex-direction:column; overflow-y:scroll; }
#showcase_model { display:flex; margin:2vh 1vw 2vh 1vw; width:34vw; height:24vw; align-content:center; flex-direction:column; background-color:white; border:1px solid #999999; border-radius:1vh; }
#showcase_title { display:flex; margin:0.5vh 1vw 0.5vh 1vw; width:32vw; height:auto; justify-content:center; text-align:center;}
#showcase_class { display:flex; margin:0.5vh 1vw 2vh 1vw; width:32vw; height:2.5vh; justify-content:center; }
#showcase_history { display:flex; margin:0.5vh 1vw 0.5vh 1vw; width:32vw; justify-content:space-between; }


/*Show Case Gallery*/
#showcase_gallery { display:flex; position:relative; align-items:center; margin:2vh 1vw 1vh 1vw; width:32vw; height:18vw; }
#showcase_photo { display:flex; width:32vw; height:18vw; border-radius:1vh; background-size:100% 100%; }
#showcase_buttons { z-index:2; position:absolute; display:flex; width:32vw; height:1.4vw; justify-content:space-between;}
.showcase_button { width:1.4vw; height:1.4vw; margin:0 0.5vw 0 0.5vw; background-color:white; border-radius:1vh; border:1px solid #006600; color:#006600; text-align:center; font-family:myriad; letter-spacing:0.25vh; font-size:2.2vh; cursor:pointer; }
.showcase_button:hover { border:1px solid #003399; color:#003399; }


/*Texts*/
.giant_brand { font-family:brand; margin:0.5vh 0; font-size:2.5vh; letter-spacing:1vh; text-justify:inter-word; font-variant-ligatures: no-common-ligatures; }
.medium_brand { font-family:brand; margin:0.5vh 0; font-size:1vh; letter-spacing:0.25vh; text-justify:inter-word; font-variant-ligatures: no-common-ligatures; }
.big_text { font-family:myriad; margin:0.5vh 0; font-size:2.5vh; letter-spacing:0.25vh; 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:1.75vh; text-align: justify; text-justify:inter-word; font-variant-ligatures: no-common-ligatures; }
.small_text { color:#999999; font-family:myriad; font-size:1.5vh; text-align: justify; text-justify:inter-word; font-variant-ligatures: no-common-ligatures; }


/*Inputs*/
#inputs_content { display:flex; justify-content:center; align-items:center; margin:2vh 0 2vh 0; }
.inputs { height:2.5vh; border:1px solid #999999; border-radius: 1vh; padding-top:1vh; text-align:center; font-family:myriad; font-size:1.25vh; }
.inputs:read-only { background:#DDDDDD; }
.inputs:required { border-color:#FF0000; }
.inputs_label { position:absolute; display:block; height:1.5vh; margin-top:-3.75vh; padding:0.25vh 0.5vw 0.25vh 0.5vw; background-color:#999999; border-radius:1vh; color:white; text-align:center; font-family:myriad; font-size:1.25vh; line-height:1.4; }
.long_inputs { width:100%; border:1px solid #999999; border-radius: 1vh; padding-top:1vh; font-family:myriad; font-size:1.25vh; resize:none; }
.long_inputs:read-only { background:#DDDDDD; }
.long_inputs:required { border-color:#FF0000; }
.search_text { height:2.25vh; padding-left:0.5vw; border: 1px solid white; border-radius:1vh 0 0 1vh; text-align:left; font-family:myriad; font-size:1.5vh; }
#radio_content { display:flex; margin:0.5vh 0 0.5vh 0; }
input[type="radio"] { appearance: none; width:1.5vh; height:1.5vh; border-radius:0.5vh; background-color:#006600; }
input[type="radio"]:checked { background-color:#FF0000; }
.radio_label { position:relative; display:table-cell; height:auto; margin-top:0vh; margin-left:0.25vw; color:#999999; text-align:left; font-family:myriad; font-size:1.5vh; }


/*Account*/
#account_form { display:flex; width:20vw; height:18vh; margin-top:1vh; justify-content:center; flex-direction:column; }
#account_info { display:flex; width:10vw; height:16vh; margin-top:1vh; justify-content:center; flex-direction:column; }
#login_area { display:flex; width:20vw; flex-direction:row; justify-content:space-around; }
#account_area { display:flex; width:10vw; margin:1vh 0 1vh 0; flex-direction:row; justify-content:space-between; }


/*Buttons*/
button { width:10vw; height:4vh; margin:1vh 0 1vh 0; background-color:white; border-radius:1vh; border:1px solid #006600; color:#006600; text-align:center; font-family:myriad; letter-spacing:0.25vh; font-size:1.5vh; cursor:pointer; }
button.selected, button.selected:hover { color:#FF0000; border:1px solid #FF0000; }
button:hover { color:#003399; border:1px solid #003399; }
.search_button { width:2.8vh; height:2.6vh; background:white; border-radius: 0 1vh 1vh 0; border: 1px solid white; text-align:center; color:white; font-family:myriad; font-size:1.5vh; cursor:pointer; }
.button { width:10vw; height:4vh; margin:1vh 0 1vh 0; background-color:white; border-radius:1vh; border:1px solid #006600; color:#006600; text-align:center; font-family:myriad; letter-spacing:0.25vh; font-size:1.5vh; cursor:pointer; }
.button.selected, button.selected:hover { color:#FF0000; border:1px solid #FF0000; }
.button:hover { color:#003399; border:1px solid #003399; }


/*Main Links*/
a.intro:link, a.intro:visited { font-family:myriad; margin:0.5vh 0; font-size:2vh; letter-spacing:0.25vh; text-justify:inter-word; font-variant-ligatures: no-common-ligatures; }
a.intro:hover { text-decoration:underline; text-underline-position:under; }
a.menu:link, a.sub_menu:visited { text-align:center; font-family:myriad; font-size:2vh; color:#FA5F02; text-decoration:none; cursor:pointer; }
a.menu:link, a.menu:visited { color:#FA5F02; }
a.menu:hover { text-decoration:underline; text-underline-position:under; }
a.menu.active { text-decoration:underline; text-underline-position:under; text-decoration-style:double; }
a.sub_menu:link, a.sub_menu:visited { margin-left:1.6vw; height:1.75vh; padding:0.5vh 0.5vh; background-color:#EEEEEE; border-radius:0.5vh; border-style:solid; border-width:medium; border-color:white; text-align:center; font-family:myriad; font-size:1.25vh; color:black; text-decoration:none; cursor:pointer; }
a.sub_menu:hover { border-color:#05A0FD; text-decoration:underline; text-underline-position:under; }
a.sub_menu.active { border-color:#FA5F02; text-decoration:underline; text-underline-position:under; text-decoration-style:double; }
a.bottom:link, a.bottom:visited { text-decoration:none; color:#999999; font-family:myriad; font-size:1.75vh; }
a.bottom:hover { text-decoration: underline; text-underline-position:under; }
a.bottom.active { text-decoration: underline; text-underline-position:under; text-decoration-style:double; }


/*Links*/
a { text-decoration:none; color:#003399; font-family:myriad; font-size:1,5vh; }
a.current:link, a.current:visited { font-family:myriad; font-size:1.5vh; color:#003399; text-decoration:none; cursor:pointer; }
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; }