@import url("fontawesome-all.min.css");
html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, em, img, strong, i, article, header, nav, section, video 
{
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}

article, figure ,header, nav, section 
{
display: block;
}

body 
{
-webkit-text-size-adjust: none;
}

/* Basic */
html 
{
box-sizing: border-box;
}

*, *:before, *:after 
{
box-sizing: inherit;
}

body 
{
background-color:#2C2834;
overflow-y: scroll;
}

body.is-preload *, body.is-preload *:before, body.is-preload *:after 
{
-moz-animation: none !important;
-webkit-animation: none !important;
-ms-animation: none !important;
animation: none !important;
-moz-transition: none !important;
-webkit-transition: none !important;
-ms-transition: none !important;
transition: none !important;
}

body, input, textarea, select 
{
font-family: 'Liberation', monospace;
font-weight: 300;
color: #ffffff;
font-size: 15pt;
line-height: 1.5em;
}

h1, h2, h3, h4, h5, h6, a, p
{
text-align: justify;
color: #fff;
}

strong, b, h1, h2, h3, h4, h5, h6, a
{
font-weight: 400;
}

h1, a
{
font-size: 2.4em;
letter-spacing: -0.015em;
}

h2 
{
line-height: 1.5em;
font-size: 1.8em;
letter-spacing: -0.015em;
}

h3, h4, h5, h6 
{
font-size: 1.25em;
letter-spacing: -0.015em;
}



p 
{
margin-bottom: 2em;
}

/* Section/Article */

section, article 
{
margin: 0 0 0 0;
}

header 
{
margin: 0 0 1.5em 0;
}

.color-box {
            background-color: #ff5200; /* Yellowish color */
            padding-left: 8px;
            width:100%;
            display: inline-block;
        }
.color-box header {
margin: 0 0 0 0;
        }


header > p 
{
margin: 0 0 0 0;
font-weight: 400;
}

/* Title container */

.section-title
{
width:100vw;
display: flex;
background-color:#FF5200; 
align-items: center;
flex-wrap: nowrap;
height: 3em;
position: relative;
padding-left:2vw ;
}

.section-title.sub {
}

.section-title.posfixed
{
position: fixed;
z-index:100; 
}

.fixed {
position: fixed;
opacity:0;
}

.section-title > a {
    white-space: nowrap;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    height: 1.25em;
    padding-right: 0.3em;
    padding-left: 0.3em;
    transition: background-color 0.3s ease; 
}

.section-title.sub > a:hover {
    background-color: #FF5200; 
}


.section-title > a:hover {
    background-color: #007BFF; 
}


.section-title.sub.one {
}
.section-title.sub.two {
}
.section-title.sub.three {
}
.section-title.sub.four {
}

.section-title.fixed.oone {
z-index:699;
opacity:1;
}
.section-title.fixed.ttwo {
z-index:602;
}
.section-title.fixed.tthree {
z-index:603;
}
.section-title.fixed.ffour {
z-index:604;
}

.sticky {
opacity:1;
}

.stickyIndex {
display:none;
}

/* Image */
.image-container 
{
display: flex;
justify-content: center;
gap:2%;
align-items: center;
flex-wrap: wrap;
/*margin-bottom:-4vh;*/
}

.img-fluid-por
{       
width: 49%;  
height: auto;
/*margin-bottom:4vh;*/
}

.img-fluid
{
width: 100%;  
height: auto;   
/*margin-bottom:4vh;*/
}

.img-fluid-vid-por
{
width: 49%;  
height: auto;   
/*margin-bottom:4vh;*/
}

.img-fluid-vid
{
width: 100%;  
height: auto;   
/*margin-bottom:4vh;*/
}

.image {
display: inline-block;
}

.img-fluid-vid-por video {
  width: 49%;
}

.img-fluid-vid video {
  width: 100%;
}

/* Icons */

.icon:before {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
display: inline-block;
width:1.5em;
font-size: 1.75em;
font-style: normal;
font-variant: normal;
text-rendering: auto;
text-transform: none !important;
font-family: 'Font Awesome 5 Free';
font-weight: 900;
line-height: inherit;
}
.icon2:before {
width:1.75em;
font-size: 1em;
}


/* Nav */
#nav 
{
background-color:#FF5200; 
width:20vw; 
height:100%;
justify-content: flex;
padding-top: 5.5vh;
z-index: 9999;
position: fixed;
/* default 
white-space: wrap;
display: inline;
 */
}

#nav a {
    text-decoration: none;
    display: inline-flex;
text-align: center;
width: 100%;
font-size: 1.25em;
margin-bottom: 2.5em;
opacity: 0.35;
outline: 0;
-moz-transition: opacity .25s ease-in-out;
-webkit-transition: opacity .25s ease-in-out;
-ms-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-in-out;
}



#nav a:hover  
{
opacity: 1.0;
cursor: pointer;
}

#nav a.ref0{
opacity: 1.0;
}
#nav a.ref1{
}
#nav a.ref2{
}
#nav a.ref3{
}

#nav a.ref{
    opacity:1;
}

#nav a.refIndex {
    opacity:0.35;
}

/* Wrapper 
 * */

#wrapper 
{
margin: 0 auto;
margin-left: 20vw;
max-width: 100%;
padding: 0 0;
display: flex;
display: -moz-flex;
display: -webkit-flex;
display: -ms-flex;
-moz-flex-direction: column;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-moz-align-items: center;
-webkit-align-items: center;
-ms-align-items: center;
align-items: center;
-moz-justify-content: center;
-webkit-justify-content: center;
-ms-justify-content: center;
justify-content: center;
-moz-transition: opacity 1s ease-in-out;
-webkit-transition: opacity 1s ease-in-out;
-ms-transition: opacity 1s ease-in-out;
transition: opacity 1s ease-in-out;
}

/* Main 
 * */

#main
{
overflow: hidden;
position: relative;
width: 100%;
-moz-transition: min-height 0.5s ease-in-out, max-height 0.5s ease-in-out;
-webkit-transition: min-height 0.5s ease-in-out, max-height 0.5s ease-in-out;
-ms-transition: min-height 0.5s ease-in-out, max-height 0.5s ease-in-out;
transition: min-height 0.5s ease-in-out, max-height 0.5s ease-in-out;
}

#main > .panel 
{
-moz-transition: opacity 0.25s ease-in-out;
-webkit-transition: opacity 0.25s ease-in-out;
-ms-transition: opacity 0.25s ease-in-out;
transition: opacity 0.25s ease-in-out;
position: relative;
padding: 4vh 2vw 4vh 2vw;
width: 750pt;
}




#main > .panel.intro 
{
display: -moz-flex;
display: -webkit-flex;
display: -ms-flex;
display: flex;
-moz-flex-direction: row;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-moz-align-items: center;
-webkit-align-items: center;
-ms-align-items: center;
align-items: center;
}

#main > .panel.intro .pic 
{
text-decoration: none;
position: relative;
-moz-flex-grow: 0;
-webkit-flex-grow: 0;
-ms-flex-grow: 0;
flex-grow: 0;
-moz-flex-shrink: 0;
-webkit-flex-shrink: 0;
-ms-flex-shrink: 0;
flex-shrink: 0;
width: 20em;
}

#main > .panel.intro .pic:before 
{
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 998;
}

#main > .panel.intro .pic img 
{
position: relative;
display: block;
top: 0;
left: 0;
width: 100%;
-moz-object-fit: cover;
-webkit-object-fit: cover;
-ms-object-fit: cover;
object-fit: cover;
-moz-object-position: center;
-webkit-object-position: center;
-ms-object-position: center;
object-position: center;
}

#main > .panel.intro header
{
vertical-align: top;
-moz-flex-grow: 1;
-webkit-flex-grow: 1;
-ms-flex-grow: 1;
flex-grow: 1;
-moz-flex-shrink: 1;
-webkit-flex-shrink: 1;
-ms-flex-shrink: 1;
flex-shrink: 1;
padding-left: 2.5em ;
width: 100%;
}

#main > .panel.intro header h1 
{
white-space:nowrap;
line-height: 1.5em;
margin-bottom: 0;
}

#main > .panel header p 
{
letter-spacing: -0.02em;
line-height: 1.5em;
font-size: 16pt;
margin: 1.5em 0 0 0;
}

@import url("main_resize_360.css");
@import url("main_resize_736.css");
@import url("main_resize_980.css");
@import url("main_resize_1280.css");
@import url("main_resize_1680.css");