@font-face {font-family: "Robota-NonCommercial"; src: url("https://db.onlinewebfonts.com/t/9cb0a357a85bbe0cee9bdf73b57e780f.eot"); src: url("https://db.onlinewebfonts.com/t/9cb0a357a85bbe0cee9bdf73b57e780f.eot?#iefix") format("embedded-opentype"), url("https://db.onlinewebfonts.com/t/9cb0a357a85bbe0cee9bdf73b57e780f.woff2") format("woff2"), url("https://db.onlinewebfonts.com/t/9cb0a357a85bbe0cee9bdf73b57e780f.woff") format("woff"), url("https://db.onlinewebfonts.com/t/9cb0a357a85bbe0cee9bdf73b57e780f.ttf") format("truetype"), url("https://db.onlinewebfonts.com/t/9cb0a357a85bbe0cee9bdf73b57e780f.svg#Robota-NonCommercial") format("svg"); }

body, html {
    background: #fff;
    margin: 0;
    padding: 0;
    min-height:100vh;
    color:#606060;
    font-weight:300;
}
body:before {
        height: 100%;
    width: 400px;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 1;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+26,ffffff+26,ffffff+91&0.81+26,0+96 */
background: -moz-linear-gradient(left,  rgba(255,255,255,0.81) 26%, rgba(255,255,255,0.06) 91%, rgba(255,255,255,0) 96%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(255,255,255,0.81) 26%,rgba(255,255,255,0.06) 91%,rgba(255,255,255,0) 96%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(255,255,255,0.81) 26%,rgba(255,255,255,0.06) 91%,rgba(255,255,255,0) 96%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cfffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */

content:'';
display:block;

.errors {color: red;}

}
.form-control, .btn {border-radius:0;}
.form-control {border-color:#606060;}
.btn-secondary {background:#606060;border-color:#606060; }
.btn-secondary:hover, .btn-secondary:focus {background:#000;border-color:#000; }

.h-100 {min-height:100vh;}
.fixed-top {width:100%; background:#fff;}

#navbarTOP .nav-item .nav-link:after, #navbarTOP .nav-item .nav-link  span{
    -webkit-transition: all 2150ms ease-in-out;
-moz-transition: all 150ms ease-in-out;
-ms-transition: all 150ms ease-in-out;
-o-transition: all 150ms ease-in-out;
transition: all 150ms ease-in-out;
}
#navbarTOP {position:fixed; top:50%; left:30px; margin-top:-100px; width:150px; height:200px; z-index:999;}
#navbarTOP .nav-item {display:block; position:relative; margin:15px 0;}
#navbarTOP .nav-item .nav-link:before {display:block; content:''; position:absolute; left:-16px; top:50%; margin:2px 0 0 0; width:6px; height:6px; background:#606060; z-index:2;} 
#navbarTOP .nav-item .nav-link:after {
	display: block;
    content: '';
    position: absolute;
    left: -20px;
    top: 50%;
    margin: -2px 0 0 0;
    width: 14px;
    height: 14px;
    border: solid 1px #606060;
    z-index: 1;
	
} 

#navbarTOP .nav-item .nav-link span {font-size:16px; display:none; position:absolute; left:0; top:-5px; text-transform:uppercase; padding:5px 10px; min-width:120px; color:#606060;} 

#navbarTOP .nav-item .nav-link:hover:after, #navbarTOP .nav-item .nav-link.active:after {
     left:-22px; top:50%; margin:-4px 0 0 0; width:18px; height:18px;
}
#navbarTOP .nav-item .nav-link:hover span, #navbarTOP .nav-item .nav-link.active span {letter-spacing:3px; display:block !important;}
#navbarTOP .nav-item .nav-link:hover span:before, #navbarTOP .nav-item .nav-link.active span:before {
    
}

#navbarTOP .nav-item .nav-link.active span {color:#f7aa00;   }

.title  p {opacity:.7; text-transform:uppercase;}
.lead {font-size:18px; font-weight:300;}
.title h3, .lead {color:#000;}
.title h3    {font-weight:700; font-family: "Robota-NonCommercial", sans serif;}
.title h3 strong {color:#f7aa00; }

#menu1 .h1 {font-size:3.5rem !important;}
.html5-title {display:none !important; opacity:0 !important;}
#html5-lightbox-box, .html5-elem-box, .html5-elem-data-box, .html5-elem-wrap {background:transparent !important;}

section {position:relative;}
section:nth-child(2n+1) { }
section .row {position:relative; z-index:6;}
 .child-square {
      width: 350px;
      height: 350px;
      margin: -175px 0 0 -175px;
      animation: rotating2 7s linear infinite;
      border: 1px dotted #e5e5e5;
      top:50%;
      left:50%;
      position:absolute;
      z-index:4;
      background:#fff;
      display:none;
    }
     .child-square.nb2 {
      width: 440px;
      height: 440px;
      margin: -220px 0 0 -220px;
      animation: rotating2 9s linear infinite;
      z-index:3;
    }
     .child-square.nb3 {
      width: 540px;
      height: 540px;
      margin: -270px 0 0 -270px;
      animation: rotating2 11s linear infinite;
      z-index:2;
    }
     .child-square.nb4 {
      width: 640px;
      height: 640px;
      margin: -330px 0 0 -330px;
      animation: rotating2 13s linear infinite;
      z-index:1;
    }

    @keyframes rotating2 {
      from {
        transform: rotate(0deg);
      }

      to {
        transform: rotate(360deg);
      }
    }
    
    .bg-img {
        background-position: bottom center !important;
    background-size: cover;
    background-repeat: no-repeat !important;
        
    }
    .blur {
        
        /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+26,ffffff+26,ffffff+91&0.81+26,0+96 */
background: -moz-radial-gradient(center, ellipse cover,  rgba(255,255,255,0.81) 26%, rgba(255,255,255,0.06) 91%, rgba(255,255,255,0) 96%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover,  rgba(255,255,255,0.81) 26%,rgba(255,255,255,0.06) 91%,rgba(255,255,255,0) 96%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center,  rgba(255,255,255,0.81) 26%,rgba(255,255,255,0.06) 91%,rgba(255,255,255,0) 96%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cfffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

        
    }
    
    

 .header-info .container {margin:0 auto;}
 
@media (min-width: 991px) {
        body, html {overflow: hidden;}
        #navbarTOP .nav-item .nav-link span, .child-square  {display:block; }
        #navbarTOP {top:40%; left:50px;}
        .lead {font-size:22px;}
}

@media (max-width: 990px) {
    #navbarTOP .nav-item .nav-link span {min-width:80px;}
    .lead {font-size:16px;}
    .bg-img {
        background:none !important;
    }
	.h3, h3 {
    font-size: 1.35rem;
}
    body:before {display:none;}
        #navbarTOP .nav-item .nav-link span  {font-size:14px !important; top:-2px; padding-left:5px;}
        #navbarTOP .nav-item .nav-link.active {margin-top:50px;}
        #navbarTOP .nav-item .nav-link span, #navbarTOP .nav-item .nav-link:focus span, #navbarTOP .nav-item .nav-link:hover span {display:none;}
        #navbarTOP .nav-item .nav-link.active span {letter-spacing:2px; display:block !important; 
        -webkit-transform:  rotate(-90deg);
-moz-transform:  rotate(-90deg);
-ms-transform:  rotate(-90deg);
-o-transform:  rotate(-90deg);
transform:  rotate(-90deg);
left:-56px;
top:auto;
bottom:33px;
        }
        #navbarTOP .nav-item .nav-link.active:before,  #navbarTOP .nav-item .nav-link.active:after{top:100%;}
      
}