/* CSS Document */
@font-face{
	font-family:'Toxia';
	src:url("fonts/Toxia-OwOA.ttf") format("opentype");
  }
  
  .web{
	  display: block;
  }
  .mob{
	  display: none;
  }
  a img{border:none}
  img
  {  border-style: none;
  }
  textarea { resize:none; }
  textarea:focus, input:focus{
	  /*outline: 2px solid #000;*/
	  outline: 0;
  }
  
  *:focus {
	  outline: 0;
  }
  img.a{
	  position:absolute;
	  cursor: pointer;
	  left:0px;
	  top: 0px;
  }
  
  ::-webkit-input-placeholder { /* WebKit browsers */
	  color:    #000;
  }
  :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	 color:    #000;
	 opacity:  1;
  }
  ::-moz-placeholder { /* Mozilla Firefox 19+ */
	 color:    #000;
	 opacity:  1;
  }
  :-ms-input-placeholder { /* Internet Explorer 10+ */
	 color:    #000;
  }
  .bl{
	  color: #000;
  }
  .wh{
	  color: #fff;
  }
  body, html {
	  margin: 0;
	  padding: 0;
	  width:100%;
	  height:100%;
	  background: url(images/bg.jpg) no-repeat center center fixed; 
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
	  font-family: 'Assistant',Arial, Helvetica, sans-serif;
	  /*background-color: #349d79;*/
	  background-color: #000;
  }
  
  #MainDiv{
	  position:absolute;
	  width:1920px;
	  height:auto;
	  top:0px;
	  left:0px;
	  z-index:2;
  }
  nav{
	  position: fixed;
	  width: 1920px;
	  height: 90px;
	  left: 0px;
	  top: 0px;
	  z-index: 25;
	  background-color: #000;
  }
  #logo{
	  position: absolute;
	  width: 213px;
	  height: 62px;
	  left: 853.5px;
	  top: 14px;
	  background-image: url("images/logo_sm.png");
	  background-repeat: no-repeat;
	  background-position: center top;
	  background-size: auto 100%;	
  
  }
  /* menu */
  social{
	  position: fixed;
	  width: 1920px;
	  height: 70px;
	  left: 0px;
	  bottom: 0px;
	  z-index: 50;
	  background-color: #000;
	  text-align: center;
	  padding: 13px 0px 13px 0px;
	  
  }
  .socHolder{
	  position: relative;
	  width: 450px;
	  height: auto;
	  margin: 0;
	  margin-right: 760px;
	  float: right;
  }
  .scIcon{
	  position: relative;
	  width: 70px;
	  height: 70px;
	  float: right;
	  margin: 0 15px;
  }
  #hamburger{
	  position: absolute;
	  width: 52px;
	  height: 44px;
	  right: 30px;
	  top: 14px;
	  z-index: 15;
	  background-image: url("images/hamburger.png.html");
	  background-repeat: no-repeat;
	  background-position: center top;
	  background-size: 100% auto;	
  }
  
  #close{
	  position: absolute;
	  width: 30px;
	  height: 30px;
	  right: 35px;
	  top: 21px;
	  z-index: 15;
	  background-image: url("images/close.png");
	  background-repeat: no-repeat;
	  background-position: center top;
	  background-size: 100% auto;	
  }
  
  
  #menuHolder{
	  position: absolute;
	  width: 1920px;
	  height: 390px;
	  left: 0px;
	  top: 0px;
	  background-color: #00364f;
	  display: none;
	  z-index: 20;
  }
  .menuOff{
	  position: relative;
	  width: 100%;
	  height: 50px;
	  margin: 0 auto;
	  float: right;
	  color: #fff;
	  text-align: right;
	  text-indent: 45px;
	  line-height: 50px;
	  font-size: 24px;
	  text-decoration: none;
	  z-index: 5;
  }
  .menuOff a{
	  color: #fff;
	  text-decoration: none;
  }
  .menuOn{
	  position: relative;
	  width: 100%;
	  height: 50px;
	  margin: 0 auto;
	  float: right;
	  color: #349d79;
	  line-height: 60px;
	  font-size: 24px;
	  text-decoration: none;
	  text-indent: 45px;
	  z-index: 5;
  }
  .menuOn a{
	  color: #349d79;
	  text-decoration: none;
  }
  .menuSpacer{
	  position: relative;
	  margin: 0 auto;
	  height: 60px;
	  color: #fff;
	  line-height: 60px;
	  font-size: 24px;
	  text-decoration: none;
	  padding: 0;
	  
  }
  #mn1{
	  margin-top: 100px;
  }
  /* menu end */
  
  
  
  .wrapper{
	  position: relative;
	  width: 100%;
	  height: auto;
	  margin: 0;
	  float: left;
  }
  
  .hadmaya{
	  position: absolute;
	  width: auto;
	  height: auto;
	  white-space: nowrap;
	  z-index:5;
	  font-size: 24px;
	  line-height: 1;
	  font-weight: 400;
	  text-align: right;
	  direction: rtl;
	  color: #FFF;
	  text-shadow: 0px 0px 33.48px rgba(0, 0, 0, 0.85);
  }
  
  
  /* page 1 */
  #page0{
	  margin-top: 90px;
  }
  #page1{
	  background-color: #000;
  }
  #page2{
	  background-color: #fff;
  }
  .spacer{
	  margin-bottom: 96px;
  }
  header{
	  position: relative;
	  width: 1920px;
	  height: 930px;
	  float: left;
	  margin: 0;
	  z-index: 2;
  }
  
  h1{
	  position: relative;
	  width: 1920px;
	  height: 128px;
	  float: right;
	  font-size: 0;
	  line-height: 1;
	  font-weight: 400;
	  text-align: center;
	  color: transparent;
	  direction: rtl;
	  margin: 690px auto 0px auto;
	  padding: 0;
	  background-image: url("images/logo.png");
	  background-repeat: no-repeat;
	  background-position: center top;
	  background-size: auto 100%;	
  }
  
  h2{
	  position: relative;
	  width: 100%;
	  height: auto;
	  float: right;
	  font-size: 62px;
	  font-family: 'Toxia',Arial, Helvetica, sans-serif;
	  line-height: 1;
	  font-weight: 700;
	  text-align: center;
	  direction: rtl;
	  margin: 60px 0;
	  padding: 0;
  }
  
  h3{
	  position: relative;
	  width: 100%;
	  height: auto;
	  float: right;
	  font-size: 40px;
	  line-height: 1;
	  font-weight: 700;
	  text-align: center;
	  direction: rtl;
	  margin: 0px 0px 20px 0px;
	  padding: 0;
  }
  
  .banner{
	  position: relative;
	  width: 930px;
	  height: 930px;
	  float: left;
	  margin: 0px 495px 40px 495px;
  }
  .membersHolder{
	  position: relative;
	  width: 1920px;
	  height: auto;
	  float: left;
	  margin: 0px 0px 30px 240px;
	  z-index: 6;
  }
  
  .member{
	  position: relative;
	  width: 480px;
	  height: 380px;
	  float: left;
	  margin: 0;
	  z-index: 1;
  }
  .memberPic{
	  position: relative;
	  width: 233px;
	  height: 225px;
	  float: left;
	  margin: 0 123.5px;
	  z-index: 1;
	  background-repeat: no-repeat;
	  background-position: center top;
	  background-size: 100% auto;	
  }
  #m1{
	  background-image: url("images/vocal.jpg");	
  }
  #m2{
	  background-image: url("images/piano.jpg");	
  }
  #m3{
	  background-image: url("images/guitar.jpg");	
  }
  #m4{
	  background-image: url("images/drums.jpg");	
  }
  .memberText{
	  position: relative;
	  width: 100%;
	  height: auto;
	  text-align: center;
	  float: left;
	  margin: 0;
	  margin-top: 25px;
	  color: #000;
	  font-size: 34px;
	  line-height: 1;
	  font-weight: 400;
	  z-index: 2;
  }
  
  footer{
	  position: fixed;
	  width: 1920px;
	  height: 60px;
	  left: 0px;
	  bottom: 0px;
	  z-index: 35;
	  text-align: center;
	  background-color: #00364f;
	  box-shadow: 0px 6px 32.9px 2.1px rgba(0, 0, 0, 0.77);
	  border-top: 5px solid #fff;
  
  }
  
  .footerText{
	  position: absolute;
	  width: 1920px;
	  height: 60px;
	  right: 0px;
	  top: 0px;
	  z-index: 1;
	  font-size: 36px;
	  line-height: 60px;
	  font-weight: 700;
	  color: #fff;
	  text-align: center;
	  direction: rtl;
	  text-decoration: none;
  }
  #footerText a{
	  text-decoration: none;
	  color: #fff;
  }
  
  
  
  
  .visuallyhidden {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
  }
  
  
  .noText{
	  color: transparent;
	  overflow:hidden;
	  -moz-user-select: none; 
	  -webkit-user-select: none; 
	  -ms-user-select:none; 
	  user-select:none;
	  -o-user-select:none;
  }
  
  /* video */
  #vidHolder{
	  position: relative;
	  width: 1920px;
	  height: 1080px;
	  /*width: 1056px;
	  height: 594px;*/
	  float: left;
	  /*margin: 60px 432px 60px 432px;*/
	  margin: 0;
  }
  #vid{
	  position: absolute;
	  /*width: 1056px;
	  height: 594px;*/
	  width: 1920px;
	  height: 1080px;
	  left: 0px;
	  top: 0px;
	  z-index: 1;
	  display: block;
  }
  #vidClick{
	  position: absolute;
	  width: 1056px;
	  height: 594px;
	  left: 0px;
	  top: 0px;
	  z-index: 5;
	  display: block;
	  background-repeat: no-repeat;
	  background-size: 100% auto;
	  background-position:center center;
	  background-image: url("images/vid.jpg.html");
  }
  #mute{
	  position: absolute;
	  width: 50px;
	  height: 50px;
	  left: 20px;
	  top: 20px;
  }
  
  @media only screen and (max-width: 576px) {
  /* CSS Document */
  .accessibility_component {
	visibility: hidden;
  }
  		body, html {
		  margin: 0;
		  padding: 0;
		  width:100%;
		  height:100%;
		  /*background: url(images/bg.jpg) no-repeat center center fixed; 
		  -webkit-background-size: cover;
		  -moz-background-size: cover;
		  -o-background-size: cover;
		  background-size: cover;*/
		  font-family: 'Assistant',Arial, Helvetica, sans-serif;
		  /*background-color: #349d79;*/
		  background-color: #000;
	  }
	  
	  #page0 {
		  margin-top: 70px;
	  }

	  #MainDiv{
		  position:absolute;
		  width:100%;
		  height:auto;
		  top:0px;
		  left:0px;
		  right: 0px;
		  z-index: 2;
	  }
	  nav{
		  position: fixed;
		  width: 100%;
		  height: 70px;
		  left: 0px;
		  top: 0px;
		  right: 0px;
		  z-index: 25;
		  background-color: #000;
	  }
	  #logo{
		  position: absolute;
		  width: 213px;
		  height: 62px;
		  left: auto;
		  top: 0;
		  right: 30px;
		  background-image: url("images/logo_sm.png");
		  background-repeat: no-repeat;
		  background-position: center top;
		  background-size: auto 100%;	
	  
	  }
	  /* menu */
	  social{
		  position: fixed;
		  width: 100%;
		  height: 70px;
		  left: 0px;
		  bottom: 0px;
		  right: 0px;
		  z-index: 50;
		  background-color: #000;
		  text-align: center;
		  padding: 13px 0px 13px 0px;
		  
	  }
	  
	  .socHolder{
		  position: relative;
		  width: 100%;
		  height: auto;
		  margin: 0;
		  /* margin-right: 120px; */
		  float: none;
		  text-align: center;
	  }
	  .scIcon{
		  position: relative;
		  width: 70px;
		  height: 70px;
		  float: none;
		  display: inline-block;
		  margin: 0 15px;
	  }
	  #hamburger{
		  position: absolute;
		  width: 52px;
		  height: 44px;
		  right: 30px;
		  top: 14px;
		  z-index: 15;
		  background-image: url("images/hamburger.png");
		  background-repeat: no-repeat;
		  background-position: center top;
		  background-size: 100% auto;	
	  }
	  
	  #close{
		  position: absolute;
		  width: 30px;
		  height: 30px;
		  right: 35px;
		  top: 21px;
		  z-index: 15;
		  background-image: url("images/close.png");
		  background-repeat: no-repeat;
		  background-position: center top;
		  background-size: 100% auto;	
	  }
	  
	  
	  #menuHolder{
		  position: absolute;
		  width: 640px;
		  height: 390px;
		  left: 0px;
		  top: 0px;
		  background-color: #00364f;
		  display: none;
		  z-index: 20;
	  }
	  .menuOff{
		  position: relative;
		  width: 100%;
		  height: 50px;
		  margin: 0 auto;
		  float: right;
		  color: #fff;
		  text-align: right;
		  text-indent: 45px;
		  line-height: 50px;
		  font-size: 24px;
		  text-decoration: none;
		  z-index: 5;
	  }
	  .menuOff a{
		  color: #fff;
		  text-decoration: none;
	  }
	  .menuOn{
		  position: relative;
		  width: 100%;
		  height: 50px;
		  margin: 0 auto;
		  float: right;
		  color: #349d79;
		  line-height: 60px;
		  font-size: 24px;
		  text-decoration: none;
		  text-indent: 45px;
		  z-index: 5;
	  }
	  .menuOn a{
		  color: #349d79;
		  text-decoration: none;
	  }
	  .menuSpacer{
		  position: relative;
		  margin: 0 auto;
		  height: 60px;
		  color: #fff;
		  line-height: 60px;
		  font-size: 24px;
		  text-decoration: none;
		  padding: 0;
		  
	  }
	  #mn1{
		  margin-top: 100px;
	  }
	  /* menu end */
	  
	  
	  .vid{
		  position: relative;
		  width: 1100px;
		  height: 619px;
		  margin: 0 auto;
		  margin-top: 75px;
		  z-index: 8;
		  box-shadow: 0px 10px 22.56px 1.44px rgba(0, 0, 0, 0.26);
	  }
	  
	  .wrapper{
		  position: relative;
		  width: 100%;
		  height: auto;
		  margin: 0;
		  float: left;
	  }
	  
	  .hadmaya{
		  position: absolute;
		  width: auto;
		  height: auto;
		  white-space: nowrap;
		  z-index:5;
		  font-size: 24px;
		  line-height: 1;
		  font-weight: 400;
		  text-align: right;
		  direction: rtl;
		  color: #FFF;
		  text-shadow: 0px 0px 33.48px rgba(0, 0, 0, 0.85);
	  }
	  
	  /* page 1 */
	  #page1{
		  background-color: #000;
	  }
	  #page2{
		  background-color: #fff;
	  }
	  .spacer{
		  margin-bottom: 96px;
	  }
	  header{
		  position: relative;
		  width: 640px;
		  height: 900px;
		  float: left;
		  margin: 0;
		  z-index: 2;
		  background-image: url("images/mb_bg.jpg");
		  background-repeat: no-repeat;
		  background-position: center top;
		  background-size: 100% auto;
	  
	  }
	  
	  h1{
		  position: relative;
		  width: 640px;
		  height: 128px;
		  float: right;
		  font-size: 0;
		  line-height: 1;
		  font-weight: 400;
		  text-align: center;
		  color: transparent;
		  direction: rtl;
		  margin: 10px auto 0px auto;
		  padding: 0;
		  background-image: url("images/logo.png");
		  background-repeat: no-repeat;
		  background-position: center top;
		  background-size: auto 100%;	
	  }
	  
	  h2{
		  position: relative;
		  width: 100%;
		  height: auto;
		  float: right;
		  font-size: 62px;
		  font-family: 'Toxia',Arial, Helvetica, sans-serif;
		  line-height: 1;
		  font-weight: 700;
		  text-align: center;
		  direction: rtl;
		  margin: 60px 0;
		  padding: 0;
	  }
	  
	  h3{
		  position: relative;
		  width: 100%;
		  height: auto;
		  float: right;
		  font-size: 40px;
		  line-height: 1;
		  font-weight: 700;
		  text-align: center;
		  direction: rtl;
		  margin: 0px 0px 20px 0px;
		  padding: 0;
	  }
	  
	  .banner{
		  position: relative;
		  width: 100%;
		  height: auto;
		  float: left;
		  margin: 0px 0px 40px 0px;
	  }
	  .membersHolder{
		  position: relative;
		  width: 100%;
		  height: auto;
		  float: left;
		  margin: 0px auto 30px;
		  z-index: 6;
	  }
	  
	  .member{
		  position: relative;
		  width: 100%;
		  height: 380px;
		  margin: 0;
		  z-index: 1;
		  text-align: center;
	  }
	  .memberPic{
		  position: relative;
		  width: 233px;
		  height: 225px;
		  margin: 0 auto;
		  z-index: 1;
		  background-repeat: no-repeat;
		  background-position: center top;
		  background-size: 100% auto;	
		  display: inline-block;
		  float: none;
	  }
	  #m1{
		  background-image: url("images/vocal.jpg");	
	  }
	  #m2{
		  background-image: url("images/piano.jpg");	
	  }
	  #m3{
		  background-image: url("images/guitar.jpg");	
	  }
	  #m4{
		  background-image: url("images/drums.jpg");	
	  }
	  .memberText{
		  position: relative;
		  width: 100%;
		  height: auto;
		  text-align: center;
		  float: left;
		  margin: 0;
		  margin-top: 25px;
		  color: #000;
		  font-size: 34px;
		  line-height: 1;
		  font-weight: 400;
		  z-index: 2;
	  }
	  
	  footer{
		  position: fixed;
		  width: 640px;
		  height: 60px;
		  left: 0px;
		  bottom: 0px;
		  z-index: 35;
		  text-align: center;
		  background-color: #00364f;
		  box-shadow: 0px 6px 32.9px 2.1px rgba(0, 0, 0, 0.77);
		  border-top: 5px solid #fff;
	  
	  }
	  
	  .footerText{
		  position: absolute;
		  width: 640px;
		  height: 60px;
		  right: 0px;
		  top: 0px;
		  z-index: 1;
		  font-size: 36px;
		  line-height: 60px;
		  font-weight: 700;
		  color: #fff;
		  text-align: center;
		  direction: rtl;
		  text-decoration: none;
	  }
	  #footerText a{
		  text-decoration: none;
		  color: #fff;
	  }
	  
	  
	  
	  
	  .visuallyhidden {
		  border: 0;
		  clip: rect(0 0 0 0);
		  height: 1px;
		  margin: -1px;
		  overflow: hidden;
		  padding: 0;
		  position: absolute;
		  width: 1px;
	  }
	  
	  
	  .noText{
		  color: transparent;
		  overflow:hidden;
		  -moz-user-select: none; 
		  -webkit-user-select: none; 
		  -ms-user-select:none; 
		  user-select:none;
		  -o-user-select:none;
	  }
	  
	  
	  #vidHolder{
		  position: relative;
		  width: 100%;
		  height: 360px;
		  float: left;
		  margin: 0px;
	  }
	  #vid{
		  position: absolute;
		  width: 100%;
		  height: 360px;
		  left: 0px;
		  top: 0px;
		  right: 0px;
		  z-index: 1;
		  display: block;
	  }
	  
	  #mute{
		  position: absolute;
		  width: 50px;
		  height: 50px;
		  left: 20px;
		  top: 10px;
	  }
  }