@import 'https://fonts.googleapis.com/css?family=Open+Sans:400,400i,600,600i,700';

/* CSS Document */

/* 
	preloader
	container
	reset
	sound
	frame-page
	overlay background
	wraper text and logo
*/

/* reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, button, output, ruby, section, summary, time, mark, audio, video {
font-family: 'Open Sans', sans-serif;
margin: 0;
padding: 0;
border: 0;
font: inherit;
color:#fff;
text-decoration:none;
}

body {
    font-family: 'Open Sans', sans-serif;
  	overflow:hidden;
	background:#000b14;
}

/* preloader */
.preloaderintro
	{
		position: fixed;
  		top: 0;
  		left: 0;
  		width: 100%;
  		height: 100%;
  		z-index: 99999;
  		display: -webkit-box;
  		display: -webkit-flex;
  		display: -ms-flexbox;
  		display: flex;
  		-webkit-flex-flow: row nowrap;
  		    -ms-flex-flow: row nowrap;
  		        flex-flow: row nowrap;
  		-webkit-box-pack: center;
  		-webkit-justify-content: center;
  		    -ms-flex-pack: center;
  		        justify-content: center;
  		-webkit-box-align: center;
  		-webkit-align-items: center;
  		    -ms-flex-align: center;
  		        align-items: center;
  		background: none ;
	}
.ax-spinner-wave.ax-spinner 
	{
  		width: 50px;
  		height: 30px;
  		text-align: center;
  		font-size: 10px; 
  	}
.ax-spinner-wave div 
	{
  		background-color: #e7f0ed;
  		height: 100%;
  		width: 6px;
  		display: inline-block;
         -webkit-animation: barpre 1.2s infinite ease-in-out;
                 animation: barpre 1.2s infinite ease-in-out;
         
    }
.ax-spinner-wave .ax2 
	{
          -webkit-animation-delay: -1.1s;
                  animation-delay: -1.1s; 
      }
.ax-spinner-wave .ax3 
	{
          -webkit-animation-delay: -1s;
                  animation-delay: -1s; 
     }
.ax-spinner-wave .ax4 
	{
          -webkit-animation-delay: -0.9s;
                  animation-delay: -0.9s;
     }
.ax-spinner-wave .ax5 
	{
          -webkit-animation-delay: -0.8s;
                  animation-delay: -0.8s; 
     }

@-webkit-keyframes barpre {
  0%, 40%, 100% {
            -webkit-transform: scaleY(0.4);
                    transform: scaleY(0.4); }

  20% {
            -webkit-transform: scaleY(1);
                    transform: scaleY(1); } }

@keyframes barpre {
  0%, 40%, 100% {
            -webkit-transform: scaleY(0.4);
                    transform: scaleY(0.4); }

  20% {
            -webkit-transform: scaleY(1);
                    transform: scaleY(1); } }
/* end preloader */


/* all element begin here */

/* container */
#boxintro{ 
width:100%; 
height:100%; 
position:fixed; 
top: 0;
left: 0;
right: 0;
bottom: 0; 
background:#000b14;
display:none;
}
#boxopening{ 
width:100%; 
height:100%; 
position:fixed; 
top: 0;
left: 0;
right: 0;
bottom: 0; 
background:#000;
}

/* sound */
#soundintro{
  position: absolute;
  right: 0px;
  top: 0px;
  width: 52px;
  height: 46px;
  z-index: 999;
  cursor: pointer;
  opacity:0.8;
   -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
#soundintro:hover{
	opacity:1;
 -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.soundOnintro{ background:url("../img/soundon.png");  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;}
.soundOffintro{ background:url("../img/soundoff.png");  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;}

/* frame-page */
#frame1, #frame2, #frame3, #frame4, #frame5{
  display:none;
  position: fixed;
  width: 100%;
  height:100%;
  overflow: hidden;
  background:rgba(0, 0, 0, 0);
}

.bgintro{
  position: absolute;
  width: 100%;
  height:100%;
}
.bgintro img{
  min-height: auto;
  min-width: auto;
  width: auto;
  height: auto;
  position: absolute;
  top: 0;
  left: 0;
}

/* wraper text and logo */
.contentintro{ 
width: 100%;
text-align:center;
margin: 0;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index:999;
}

.logointro{font-size:36pt; font-weight:bold; opacity:0;}
.headingintro{ font-size:36pt; font-weight:bold; opacity:0;}
.subheadingintro{ font-size:24pt; font-weight:300; opacity:0;}

/* overlay background */
.overlayintro {
  position: fixed;
  width: 100%;
  height:100%;
  overflow: hidden;
  background:rgba(0, 21, 38, 0.5);
}

#particle-intro {
	position:absolute;
    z-index:0;
	width:100%;
	height:100%;
   
}