*{ outline: none; }
html{ overflow-y: scroll; width: 100%; }
body{ overflow-x: hidden; overflow-y: hidden; margin: 0; width: 100%; color: #004B6A; font-size: 14px; font-family: 'Open Sans', sans-serif; line-height: 1.5; }

hr{ display: block; margin: 0; height: 2px; background: #E4EAEF; border: none; }
strong{ font-weight: 700; }
img{ border: none; }
.clear{ display: block; clear: both; }
a{ color: #004B6A; }

/* Welcome */
#welcome_holder{ position: relative; z-index: 200; overflow: hidden; width: 100%; height: 100%; }
#welcome_holder .inner{ position: relative; margin: 0 auto; z-index: 5; padding-top: 9em; width: 22em; color: #ffffff; font-family: 'Ropa Sans', sans-serif; }
#welcome_holder .logo{ margin-bottom: 7em; }
#welcome_holder .title{ display: block; margin: 0.5em 0; font-size: 3.285714286em; width: 100%; text-align: center; cursor: pointer; }
#welcome_holder hr{ display: block; width: 100%; height: 2px; background: #A8BEC8; border: none; border-top: 1px solid #002C3C; }
#welcome_holder .cta{ display: block; margin-top: 6em; width: 100%; text-align: center; font-size: 1.714285714em; cursor: pointer; }
#welcome_holder .cta_images{ display: block; margin-top: 2em; width: 100%; text-align: center; cursor: pointer; }
#welcome_holder .mouse{ display: inline; }
#welcome_holder .door{ position: fixed; top: 0; width: 51%; height: 100%; background: #004B6A;  }
#welcome_holder .door.left{ left: 0; }
#welcome_holder .door.right{ right: 0; }

/* Structure */
#wrapper{ display: block; margin: 0 auto; width: 72em; }
#header{ padding-top: 3em; width: 72em; height: 10em; text-align: center; }

/* Navigation */
#nav{ margin: 0 0 2em 0; padding: 0; width: 101%; height: 3em; list-style: none; }
#nav li{ position: relative; padding: 0 2em; float: left; margin-right: 2.64em;  }
#nav li a{ display: block; position: relative; overflow: hidden; color: #004B6A; font-weight: 700; text-decoration: none; text-transform: uppercase; line-height: 3; }
#nav .last{ margin: 0; }
#nav .active{ background: #E87B70; }
#nav .active a{ color: #ffffff; }
#nav .arrow{ display: none; position: absolute; bottom: 0; left: 50%; margin-left: -.357142857em; width: .714285714em; }
#nav .active .arrow{ display: block; }
#nav .hover{ display: block; position: absolute; left: 0; bottom: -3px; height: 3px; width: 100%; background: #A1BACB; opacity: 0; filter: alpha(opacity=0)}

/* Banner */
#banner{ position: relative; width: 72em; height: 13em; }
#banner .floor{ display: block; position: absolute; left: .05em; bottom: -0.05em; z-index: 10; color: #ffffff; font-size: 14em; font-family: 'Ropa Sans', sans-serif; line-height: 1; }
#banner .image_holder{ float: left; width: 48em; height: 13em; background: #E4EAEF; }
#banner .cta{ float: left; padding: 2em; width: 20em; height: 9em; background: #A2BACA; color: #ffffff; }
#banner .cta .streamer{ display: block; margin-bottom: 0.5em; font-size: 2em; font-family: 'Ropa Sans', sans-serif; line-height: 1.2; }
#banner .cta img{ display: inline; position: relative; top: 1px; }

/* Content */
#content{ padding: 2em; }
#content .page_heading{ margin: 0 0 1em 0; width: 18em; font-family: 'Ropa Sans', sans-serif; }
#content h1{ margin: 0 0 1em 0; font-size: 2.5em; font-weight: normal; }
#content h2{ margin: 0 0 1em 0; font-size: 2.5em; font-weight: normal; }
#content .subtitle{ font-size: 1.8em; line-height: 1.25; }
#content .intro{ width: 43em; color: #4C8297; }
.intro p{ margin: 1em 0 0 0; font-size: 1.285714286em; }
.intro a{ color: #4C8297; }

#content .aside{ float: left; margin-right: 6em; width: 18em; }
#content .aside.right{ margin-left: 5em; margin-right: 0; }
.submenu{ margin: 1.5em 0 0 0; padding: 0; list-style: none; font-size: 1.5em; font-family: 'Ropa Sans', sans-serif;}
.submenu li{ position: relative; margin: 0.5em 0; }
.submenu a{ color: #A2BACA; text-decoration: none; }
.submenu .arrow{ display: none; }
.submenu .active .arrow{ display: block; position: absolute; top: 0.2em; left: -1.5em; }
.submenu .active a{ color: #004B6A; }

#content .article{ float: left; width: 43em; margin-bottom: 5em; }
#content .article .page_heading{ width: 100%; }
#content .article .col{ float: left; margin-right: 5em; width: 19em; }
#content .article .last{ margin: 0; }
#content .article .image_holder{ float: left; margin-top: 2em; width: 46em; height: 13em; background: #E4EAEF; }
#content .article h1{ font-family: 'Ropa Sans', sans-serif; margin: 0 0 1em 0; font-size: 2.5em; }
#content .article h2{ font-family: 'Ropa Sans', sans-serif; margin: 1.5em 0 0 0; font-size: 1.8em; line-height: 1.25; }
#content .article h2.first{ margin: 0; }

#content .aside .title{ display: block; margin: 2em 0 1em 0; font-size: 1.285714286em; font-weight: 700;}
#content .aside .contact_title{ display: block; width: 5em; float: left; clear: both; color: #004B6A; font-size: .8em; font-weight: 700; text-transform: uppercase; line-height: 2.1 }
.contact #content .aside a{ color: #004B6A;  }
.contact #content .article{ float: left; margin-top: 6.25em; width: 43em; }

/* Thumb navigation */
#thumb_nav{ margin: 4em 2em 3em 2em; padding: 0; list-style: none;}
#thumb_nav li{ position: relative; float: left; width: 19em; margin-bottom: 5em; margin-right: 5em; opacity: 0.4; filter: alpha(opacity=40); cursor: pointer; }
#thumb_nav .last{ margin: 0; }
#thumb_nav .thumb{ display: block; width: 19em; height: 10em; background: #E4EAEF; }
#thumb_nav .title{ display: block; margin: 0.5em 0; font-size: 1.8em; font-family: 'Ropa Sans', sans-serif; line-height: 1.25;}
#thumb_nav p{ margin: 1em 0 3em 0; }
#thumb_nav .btn{ display: inline-block; padding: 0 0.6em; background: #A1B9C9; color: #ffffff; font-weight: 700; text-transform: uppercase; line-height: 2}
#thumb_nav .clear{ float: none; clear: both; }
.aside #thumb_nav{ margin: 2em 0 3em 0;  }

#thumb_nav .arrow_holder{ position: absolute; top: 3em; left: -2em; overflow: hidden; width: 4em; height: 4em; background: #ffffff; }
#thumb_nav .arrow_blue, #thumb_nav .arrow_white{ position: absolute; top: 0; left: 0; z-index: 5; width: 4em; height: 4em; }
#thumb_nav .arrow_white{ left: -4em; }
#thumb_nav .arrow_blue img, #thumb_nav .arrow_white img{ position: absolute; top: 50%; left: 50%; margin: -1.071428572em 0 0 -1.071428572em; width: 2.142857143em; height: 2.142857143em; }
#thumb_nav .bg_blue{ position: absolute; right: 0; top: 0; height: 4em; width: 0; background: #004B6A; }
/* Footer */
#footer{ padding-top: 3em; width: 100%; height: 20em; background: #F3F6F6; color: #AEC3D0; }
#footer .inner{ margin: 0 auto; width: 68em; }
#footer .title{ display: block; margin: 0 0 1em 0; font-weight: 700; color: #588598; }
#footer .col{ position: relative; float: left; width: 19em; margin-right: 5em; }
#footer .last{ margin: 0; padding-top: 2.5em; }

.contact_title{ display: block; width: 5em; float: left; clear: both; color: #588598; font-size: .714285714em; font-weight: 700; text-transform: uppercase; line-height: 2.1 }
.text{ display: block; float: left;  }
#footer a{ color: #AEC3D0;  }

#footer ul{ list-style: none; padding: 0; margin: 0;  }
#footer ul a{ text-decoration: none; }

#komma_link{ position: absolute; bottom: -4.3em; display: block; margin: 50px 0 0 0; height: 30px; color: #588598; cursor: pointer; opacity: 0.5; filter: alpha(opacity=50); }
#komma_logo{ display: block; float: left; margin: 0 10px 0 0; width: 30px; height: 30px; }
#komma_text{ position: relative; top: -1px; left: 0; display: block; float: left; line-height: 1.2}

/* Contact form */
form{ position: relative; margin-top: 3em;}
.column{ float: left; margin-right: 5em; width: 19em; }
.column.last{ margin-right: 0; }
.column.double{ width: 19em; }
.column.quadruple{ width: 780px; }
.input_holder{ height: 3.5em; margin-bottom: 1.5em; }
label{ display: block; font-size: 1.142857143em; font-family: 'Ropa Sans', sans-serif; line-height: 1; }
.text_field{ padding: 0 1em; width: 100%; height: 2.5em; border: 1px solid #A2BACA; color: #A2BACA; font-size: 0.9em; line-height: 2.5em; box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -webkit-box-sizing: border-box }
textarea{ display: block; width: 100%; height: 10em; margin: 0; padding: 1em; border: 1px solid #A2BACA; color: #A2BACA; font-size: 0.9em; font-family: 'Open Sans', sans-serif; box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -webkit-box-sizing: border-box; resize: none; }

.input_error .text_field{ border: 1px solid #E87B70; }
.input_error textarea{ border: 1px solid #E87B70; }
.input_error label{ color: #E87B70 }

form .btn{ display: block; position: absolute; right: 0; bottom: 1.5em; font-weight: 700; text-transform: uppercase; text-align: center; cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
form .btn:hover{ text-decoration: none; }
form .btn input{ position: absolute; top: 0; left: 0; z-index: 4; margin-right: 10px; padding: 0 2em; height: 3em; background: none; border: none; color: #fff; font-size: 1em; font-weight: 700; text-transform: uppercase; line-height: 3;cursor: pointer; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
form .btn .out, .btn .over{ display: block; padding: 0 2em; width: 10.5em; height: 3em; line-height: 3; box-sizing: border-box; -moz-box-sizing: border-box;-webkit-box-sizing: border-box;}
form .btn .out{ position: relative; z-index: 1;   }
form .btn .over{ position: absolute; z-index: 2; top: 0; left: 0; opacity: 0; filter: alpha(opacity=0);  }
form .btn.blue .out{ background: #004B6A; border: 1px solid #004B6A; color: #fff; }
form .btn.blue .over{ background: #0055B2; border: 1px solid #0055B2; color: #fff;}

.success{ display: block; margin-top: 3em;}
.errors{ color: #E87B70; }

/* Aside elevator */
.elevator_holder{ position: fixed; top: 0; z-index: 300; width: 6em; height: 100%; background: #004B6A; }
.elevator_holder.left{ left: 0; }
.elevator_holder.right{ right: 0; }
.floors{ position: fixed; z-index: 105; top: 13em; left: 1.5em; margin: 0; padding: 0; list-style: none; }
.floors li{ position: relative; display: block; margin: 0 0 1.5em 0; width: 1.5em; height: 1.5em; background-image: url('/public/images/structure/circle.svg'); font-size: 2em;  font-family: 'Ropa Sans', sans-serif; }
.floors li a{ display: block; position: absolute; left: -0.25em; top: -0.25em; width: 2em; height: 2em; color: #fff; text-decoration: none; line-height: 2; text-align: center; }
.elevator{ position: fixed;  top: 11.5em; left: 0.5em; z-index: 101; overflow: hidden; width: 5em; height: 6.5em; }
.elevator .door{ position: absolute; width: 50%; height: 100%; }
.elevator .door.left{ left: 0; background: #D0DFE3; }
.elevator .door.right{ right: 0; background: #A2BACA; }
#elevator_offset{ display: none; }

/* Aside clouds */
.cloud{ position: absolute; top: 0; left: 3em; display: block; padding: 0 1em; height: 2em; background: #E87B70; color: #ffffff; font-size: 0.75em; line-height: 2em; white-space: nowrap; opacity: 0; filter: alpha(opacity=0);  }
.cloud img{ position: absolute; top: 50%; left: -5px; margin-top: -5px; }

/* Sitemap */
#sitemap{ margin: 0; padding: 0; list-style: none; }
#sitemap li{ margin: 1em;}
#sitemap ul{ padding: 0 0 0 2em; }

/* Selection */
::selection{ background:#E4EAEF; color:#004B6A; }
::-moz-selection{ background:#E4EAEF; color:#004B6A; }