/* Layout 
@import url('http://fonts.cdnfonts.com/css/gotham');
	*/
/*@font-face{font-family:gotham;font-style:normal;font-weight:400;src:local('Gotham'),url(GothamBook.woff) format('woff')}*/

@font-face{font-family:gotham;font-style:normal;font-weight:300;src:local('Gotham'),url(GothamBook.woff) format('woff')}
			
 /*  font-family: 'Gotham Black', sans-serif;
                                                                  */                                                                  
                                                                  
body{
background-color:#000; 
background-image:url('soon-page-ajmal.jpg');
background-size: cover;
background-repeat: no-repeat;
  position: relative;
 text-transform: uppercase;
font-family: 'gotham', sans-serif;
overflow:hidden;
color:#646464;
}  

.video-background {
  position: fixed;
  right: 0; 
  bottom: 0;
  min-width: 100%; 
  min-height: 100%;
  width: auto; 
  height: auto; 
  z-index: -100;
  background-size: cover;
}

.video-background video {
  position: fixed;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -100;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

.icons {
      width: 1em;
      height: 1em;
     
	  color:#fff;
    }
	
.vl {
  background-color: #ffffff33;
  height: 100vh;
  position: absolute;
  left: 50%;
  margin-left: 0px;
  top: 0;
  width:1.5px;
}
.hl {
	background-color: #ffffff33;
  height: 1.5px;
  position: absolute;
  top: 50%;
  margin-top: -5px;
  left: 0;
  width:120%;
  margin-left:-30px;
}
.social{
	z-index:100000;
	position:absolute;
	color:#febf99;
	bottom:10%;
	left:7%;
}
.social a {color:#febf99; width:18px;height:18px;display:inline-block;margin-bottom:0px;margin-left:10px;}

.contact{
	z-index:100000;
	position:absolute;
	color:#646464;
	bottom:10%;
	right:7%;
	font-family:'gotham','Myriad Arabic';
	font-size:16px;
	
	text-transform:uppercase;
}
.contact a{color:#646464;text-transform: uppercase;text-decoration:none;}

.main {
    position: relative;
    padding: 0em;
    height: 100vh;
    justify-content: center;
    align-items: middle;
	width:auto;
	top:0%;
}

div.logo{
	position:relative;
	width:100%;
	zoom:100%;
}
.logo img {height:150px;}

.clockbox {
    width: 100%;
	margin-top:-10px;
	position:relative;
}


/* Clock styles */
.circle {
    fill: none;
    stroke: #fff;
    stroke-width: 0;
    stroke-miterlimit: 10;
}

.mid-circle {
    fill: #fff;
}
.hour-marks {
    fill: none;
    stroke: #fff;
    stroke-width: 2;
    stroke-miterlimit: 10;
}

.hour-arm {
    fill: none;
    stroke: #fff;
    stroke-width: 3.5;
    stroke-miterlimit: 10;
}

.minute-arm {
    fill: none;
    stroke: #fff;
    stroke-width: 2;
    stroke-miterlimit: 10;
}

.second-arm {
    fill: none;
    stroke: #fff;
    stroke-width: 1.5;
    stroke-miterlimit: 10;
}

/* Transparent box ensuring arms center properly. */
.sizing-box {
    fill: none;
}

/* Make all arms rotate around the same center point. */
/* Optional: Use transition for animation. */
#hour,
#minute,
#second {
    transform-origin: 300px 300px;
    transition: transform .5s ease-in-out;
}
.mytext{
	display:block;
	position:absolute;
	top:12%;
	text-align:center;
	margin:auto;
	width:100%;
}
.mytext span{display:block;text-align:center;text-align:center;}
.flight {
			  font-family: gotham;
			  font-size: 20px ;
			  color:#ffffffd4;
			  z-index:100000;
			  margin-top:40px;
			}
		.flight img{width:250px;}
			.fbold {
				font-family: gotham;
			  font-size: 35px ;
			  font-weight:bold;
			  
			  color:#ffffffd4;
			  z-index:100000;
			}
@media (max-width: 767px) {
	
	.mytext{top:10%;}
	.flight {
			  
			  font-size: 12px ;
			 
			  
			}
			.fbold {
				
			  font-size: 20px ;
			  font-weight:bold;
			  
			 
			}
			
	div.logo{
		width:100%;
		/*text-align:center;*/
		position:relative;
		/*top:4%;*/
	}
	div.logo img{zoom:80%!important;}
	.vl{margin-top:auto!important;/*margin-left:-1em*/}
	.hl{margin-top:auto!important;}
	.main{height:100vh;margin:auto!important;padding:0em;overflow:hidden;}
	.clockbox, #clock{margin-top:auto!important;/*margin-left:-0.5em*/}
	
	.social{bottom:10%!important; margin:auto;width:100%}
	.social a{display:inline-block!important;margin-left: 5px;}
	
	.flight {
			  font-family: gotham;
			  font-size: 20px ;
			  color:#ffffffd4;
			  z-index:100000;
			  margin-top:50px;
			}
		.flight img{width:200px;}
		
		.contact a{color:#646464;font-size:12px;text-transform: uppercase;text-decoration:none;}
}