@charset "utf-8";
/* CSS Document */



@font-face {
    font-family: 'futura_ltregular';
    src: url('../fonts/futuralt-webfont.eot');
    src: url('../fonts/futuralt-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/futuralt-webfont.woff') format('woff'),
         url('../fonts/futuralt-webfont.ttf') format('truetype'),
         url('../fonts/futuralt-webfont.svg#futura_ltregular') format('svg');
    font-weight: normal;
    font-style: normal;

}	

.logo{ width:6%; position:relative; top:0%; margin:0px auto 3% auto; left:0px; text-align:center; }
.logo img{ max-width:100%; height:auto; display:block; }


.toolTipDiv{width:100%;  position:absolute; margin:10% 0% 0% 5% !important;  z-index:9999; overflow:visible;}

#section1{width:100%; margin-top:-1px; background:#000;  display:block; margin-bottom:0px; position:relative; overflow:visible; border-bottom:0px solid #fff;  }
#section1 img{ min-width:100%; top:0px; left:0px; zindex:-999;  }

.section1Inner{ width:80%; position:absolute; left:0%; bottom:13%;  text-align:right; overflow:visible;   }

.section1Inner h1{ width:100%; overflow:hidden; color:#7FADC5; text-align:center; font-size:1.3vw; line-height:normal; letter-spacing:0.6em; font-family: 'futura_ltregular' !important; font-weight:normal; float:right; background:none; width:100%; left:15%;  }

.section1Inner h2{ width:100%; overflow:hidden; color:#7FADC5; text-align:center; font-size:1.3vw; line-height:normal; letter-spacing:0.6em; font-family: 'futura_ltregular' !important; font-weight:normal; float:right; background:none; width:100%; left:0%; margin-top:0%;  }

/********* titles **********************/
.title2{position:absolute; top:0%; padding-top:0%; left:0%; }

.title6{ position:absolute; top:50%; padding-bottom:15%; left:-60%; }
.title7{left:20%; margin-top:10%; padding:1.6%;}
.title8{ position:absolute; padding:0%; margin-top:0%; right:30%; background:#fff; }
.title9{ margin-left:10%; margin-top:0%; padding:0%; }
.title11{ margin-left:10%; margin-top:4%; padding:1.4%;}
.title12{position:absolute; margin-top:4%; margin-left:-20%; padding:-4%;}
.title13{ position:absolute; margin-left:10%; top:0%; padding:1.4%;}
.title14{ position:absolute; margin-left:-20%; top:0%; padding:-1.4%;}
.title15{ position:absolute; margin-left:-20%; margin-top:16%; padding:1.6%;}
.title17{ position:absolute;  float:left; top:0%; margin:0% 0% 0% 20%; color:#fff;}

.titleH1{ position:absolute; padding:0px 0px; left:0%; height:100px; padding-top:2.6%; width:80%; display:block; color:#fff; text-align:center; color:#7FADC5; font-family: 'futura_ltregular' !important; font-size:1.3vw; text-transform:uppercase; z-index:100;   }


.circle{ width:4.5em; height:4.5em; border-radius:50%; border:2px solid #7FADC5; position:absolute; top:0.6%; left:46%; display:block; -moz-animation:circleAni 2s infinite; -webkit-animation:circleAni 2s infinite; z-index:-99;
 box-shadow: 0px 0px 0px red; 
}
.circle:before{
 content: " ";
 position: absolute; width:3.84em; 
 height:3.84em; border-radius:50%; 
 top: 0.2em; left: 0.2em;
 right: 1vw; bottom: 0px;
 border: 5px solid #7FADC5;
}

.circleAdj01{margin-top:1.6%; }
.circleAdj02{margin-top:1.2%; }




.circle2{ width:4.5em; height:4.5em; border-radius:50%; border:2px solid #af4111; opacity:1; position:absolute; top:0.6%; left:46%; display:block; -moz-animation:circleAni 2s infinite; -webkit-animation:circleAni 2s infinite; z-index:-99;
 box-shadow: 0px 0px 0px red;
}
.circle2:before{
 content: " ";
 position: absolute; width:3.84em; 
 height:3.84em; border-radius:50%; 
 top: 0.2em; left: 0.2em;
 right: 1vw; bottom: 0px;
 border: 5px solid #af4111;
 opacity:1;
}


@keyframes circleAni{
	0%{ transform:scale(0.5);}
	50%{ transform:scale(1);}
	75%{ transform:scale(1);}
	100%{ transform:scale(0.5);}
}



#section2{width:100%; background:#000;  display:block; margin-bottom:0px; position:relative; overflow:hidden; border-bottom:0px solid #fff; }
#section2 img{ min-width:100%; top:0px; left:0px; zindex:-999;  }

.section2Inner{ width:80%; position:absolute; left:0%; bottom:50%;  text-align:right;}




.section2Inner h1{ width:100%; overflow:hidden; color:#7FADC5; text-align:center; font-size:1.3vw; line-height:normal; letter-spacing:0.6em; font-family: 'futura_ltregular' !important; font-weight:normal; float:right; background:none; width:100%; text-transform:uppercase;  }

.titleH2{ position:absolute; padding:19px 0px; top:15%; left:20%; height:100px; padding-top:3%; width:80%; display:block; color:#fff; text-align:center; color:#7FADC5; font-family: 'futura_ltregular' !important; font-size:1.3vw; text-transform:uppercase; z-index:100; }



#section3{width:100%; background:#000;  display:block; margin-bottom:0px; position:relative; overflow:hidden; border-bottom:0px solid #fff; }
#section3 img{ min-width:100%; top:0px; left:0px; zindex:-999;  }

.section3Inner{ width:90%; position:absolute; left:0%; bottom:10%;  text-align:left; float:left; }

.section3Inner h1{ color:#7FADC5; text-align:left; font-size:1.3vw; letter-spacing:0.6em; font-family: 'futura_ltregular' !important; font-weight:normal; float:left; margin-left:70%; background:none; width:100%; overflow:hidden; }

#section4{width:100%; background:#000;  display:block; margin-bottom:0px; position:relative; overflow:hidden; border-bottom:0px solid #fff; }
#section4 img{ min-width:100%; top:0px; left:0px; zindex:-999;  }

.section4Inner{ width:90%; position:absolute; left:0%; bottom:10%;  text-align:right;}

.section4Inner h1{ color:#7FADC5; text-align:left; font-size:1.3vw; letter-spacing:0.6em; font-family: 'futura_ltregular' !important; font-weight:normal; float:right; margin-right:80%; background:none; width:100%; overflow:hidden; }



.iconAni{ animation:animateIcon 0.4s; animation-iteration-count:1;   }


@keyframes animateIcon{
	0%{ transform:scale(0); transition:ease-in;  }	
	50%{ transform:scale(0.5); transition:ease-out; }
	75%{ transform:scale(0.6); transform:translateY(85); transition:ease-in-out;}
	100%{ opacity:1; transition:1; transform:scale(1); transition:ease-in;}
	
}

@keyframes portfolio{
	0%{ transform:translateX(0px); transition:ease-in; transform:scale(1); }
	50%{ transform:translateX(30px); transition:ease-out; transform:scale(0.95);}
	75%{ transform:translateX(-10px); transition:ease-in; }
	100%{ transform:translateX(0px); transition:ease-out; transform:scale(1); }
}


.icon1, .icon2, .icon3, .icon4, .icon5,  .icon7, .icon8 { display:none;}

.logoIcon1, .logoIcon2, .logoIcon3, .logoIcon4, .logoIcon5, .logoIcon6 { display:none;}


.astroLeft { position:absolute; left:15%; width:15%; background:none; top:-15%; 
animation: updown01New 6s infinite;  -moz-animation:updown01New 6s infinite;
-webkit-animation-name: updown01New;
    -webkit-animation-duration: 6s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    -webkit-animation-play-state: running;
    /* Standard syntax */
    animation-name: updown01New;
	
	
    animation-duration: 6s;	
    animation-timing-function: linear;
    animation-delay: 1s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-play-state: running;
}
.astroLeft img{ max-width:100%; height:auto; display:block;}


.astroLeftBig { position:absolute; right:70%; width:25%; background:none; top:-10%; 
animation: updown01New 6s infinite;  -moz-animation:updown01New 6s infinite;
-webkit-animation-name: updown01New;
    -webkit-animation-duration: 6s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    -webkit-animation-play-state: running;
    /* Standard syntax */
    animation-name: updown01New;
    animation-duration: 6s;
    animation-timing-function: linear;
    animation-delay: 1s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-play-state: running;
}

.astroLeftBig img{ max-width:100%; height:auto; display:block; }


.astroRight { position:absolute; right:-15%; top:-15%; width:15%; background:none;  
animation: updown01New 6s infinite;  -moz-animation:updown01New 6s infinite;
-webkit-animation-name: updown01New;
    -webkit-animation-duration: 6s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    -webkit-animation-play-state: running;
    /* Standard syntax */
    animation-name: updown01New;
    animation-duration: 6s;
    animation-timing-function: linear;
    animation-delay: 1s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-play-state: running;


}
.astroRight img{ max-width:100%; height:auto; display:block;}

.astroAdj2{ width:12%; margin-top:0%; right:5%;}
.astroAdj5-0{left:0%; width:30%; margin-top:-10%;}
.astroAdj5{ width:33%; right:53%; margin-top:-5%;}
.astroAdj6{ left:80%; width:24%; margin-top:-10%;}
.astroAdj7{right:12%; right:63%; width:12%;  top:0%;}
.astroAdj8{ margin-top:-5%; bottom:13%; left:85%; width:26%; }
.astroAdj10{ width:14%; margin-top:0%; bottom:13%; left:85%; }
.astroAdj10 img{ max-width:100%;}
.astroAdj11{ width:23%; left:20%; margin-top:0%; }
.astroAdj12{margin-top:0%; right:0%; width:12%;}
.astroAdj14{ margin-top:-6%; left:80%; width:20%; }
@-webkit-keyframes updown01 {
    0%   {
  	-ms-transform: translateY(10px); /* IE 9 */
    -webkit-transform: translateY(10px); /* Chrome, Safari, Opera */
    transform: translateY(10px); /* Standard syntax */
	
	-moz-transform: scale(10px);
    -moz-transform: translateY(10px); 
    -moz-transform: translateY(10px); 

}
		
    100%   {
  -ms-transform: translateY(0px); /* IE 9 */
    -webkit-transform: translateY(0px); /* Chrome, Safari, Opera */
    transform: translateY(0px); /* Standard syntax */
	
	-moz-transform: translateY(0px);
    -moz-transform: translateY(0px); 
    -moz-transform: translateY(0px); 
		}
}


@keyframes updown01New{
	0% { transform: translate(0em,0em); -moz-transform: translate(0em,0em); -webkit-transform: translate(0em,0em); }
	50% { transform: translate(0em,1em); -moz-transform: translate(0em,1em); -webkit-transform: translate(0em,1em);}
	100% { transform: translate(0em,0em); -moz-transform: translate(0em,0em); -webkit-transform: translate(0em,0em); }
}

#secion2{width:100%; height:100%; display:block; position:relative; overflow:hidden; }


#section2 span{width:80%; z-index:1000; position:absolute; margin:12% 0% 0% 10% !important;  background:none; float:left; display:block; }

/****** TOOL TIPS *********/


a.tooltips {
 font-family: 'futura_ltregular' !important;	
  position: absolute;
  display:block;
  
  width: 30px;
	height: 30px;
	left: 65%;
	top: 50%;
	margin: -15px 0 0 0px;
	position: absolute;
	border-radius: 50%;
	border: 2px solid #7fadc5;
	-webkit-animation: pulse 0.6s infinite alternate;
	animation-iteration-count:1;
	
	animation: pulse 0.6s infinite alternate;
	text-decoration:none;


 }


a.tooltips:hover { border-color:#fff; }
a.tooltips span {
  position: relative;
  display:block;
  width:150px;
  letter-spacing:0.6em;
  white-space:nowrap;
  color: #FFFFFF;
  background: none;
  height: 30px;
  line-height: 1.6em;
  margin-bottom:15px;
  text-align: center;
  visibility: hidden;
  border-radius: 6px;
  text-decoration:none;
  
}
a.tooltips span:after {
  content: '';
  position: absolute;
  top: 100%;
  left: 34%;
  margin-left: 0%;
  width: 0; height: 0;
/*  border-top: 8px solid #7fadc5;
  border-right: 8px solid transparent;
  border-left: 8px solid transparent;
*/  
}
a:hover.tooltips span {
	position:absolute;
  visibility: visible;
  opacity: 0.8;
  bottom: 30px;
  left: 50%;
  margin-left: -76px;
  z-index: 999; text-transform:uppercase;
  
}

.tooltips:first-child {
	margin-top: 15%;
	left: 32%;




}

.tooltips:nth-child(2) {
	margin-top: 0%;
	left: 10%;

	

}

.tooltips:nth-child(3) {
	margin-top: 10%;
	left: 58%;


}

.tooltips:nth-child(4) {
	top: 10%;
	left: 75%;
}
/* tooltips 2 ********/

.tooltip2 .tooltips span{ letter-spacing:0.2em;}
.tooltip2 .tooltips:first-child {
	top: 36%;
	left: 10%;
}

.tooltip2 .tooltips:nth-child(2) {
	top: 10%;
	left: 10%;
}

.tooltip2 .tooltips:nth-child(3) {
	top: 36%;
	left: 75%;
}

.tooltip2 .tooltips:nth-child(4) {
	top: 10%;
	left: 75%;
}




.floatupdown img{ max-width:100%; height:auto; display:block;}


.floatupdown02 img{ max-width:100%; height:auto; display:block;}


.floatupdown03 img{ max-width:100%; height:auto; display:block;}

.floatupdownMoon{ width:100%; position:absolute; top:25%; left:0%; 
	animation:updown;
	animation-duration:2s;
	-webkit-animation-delay: 1s;
    -webkit-animation-direction: alternate;	
	-moz-animation-name: updown;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: updown;
    -ms-animation-duration: 2s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
	
}
.floatupdownMoon img{ max-width:100%; height:auto; display:block;}

.floatupdown {
     width:10%; position:absolute; top:80%; left:10%;
	 animation: updown01New 6s infinite;  -moz-animation:updown01New 6s infinite;
    -webkit-animation-name: updown01New;
    -webkit-animation-duration: 6s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    -webkit-animation-play-state: running;    
    animation-name: updown01New;
    animation-duration: 6s;
    animation-timing-function: linear;
    animation-delay: 1s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-play-state: running;
	-moz-animation-name: updown 2s infinite;
}

.floatupdown03 {
   width:50%; position:absolute; top:55%; left:10%;
   	 animation: updown01New 6s infinite;  -moz-animation:updown01New 6s infinite;
    -webkit-animation-name: updown01New;
    -webkit-animation-duration: 6s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    -webkit-animation-play-state: running;    
    animation-name: updown01New;
    animation-duration: 6s;
    animation-timing-function: linear;
    animation-delay: 1s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-play-state: running;
}

.floatupdown04 {
   width:50%; position:absolute; top:5%; right:10%;
   	 animation: updown01New 6s infinite;  -moz-animation:updown01New 6s infinite;
    -webkit-animation-name: updown01New;
    -webkit-animation-duration: 6s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    -webkit-animation-play-state: running;    
    animation-name: updown01New;
    animation-duration: 6s;
    animation-timing-function: linear;
    animation-delay: 1s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-play-state: running;
}

.floatupdown02 {
     width:10%; position:absolute; top:5%; left:10%;
  	animation: updown01New 4s infinite;  -moz-animation:updown01New 4s infinite;
    -webkit-animation-name: updown01New;
    -webkit-animation-duration: 4s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    -webkit-animation-play-state: running;
    
    animation-name: updown01New;
    animation-duration: 4s;
    animation-timing-function: linear;
    animation-delay: 1s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-play-state: running;
}

.floatupdown01 {

	animation: updown01New 8s infinite;  -moz-animation:updown01New 8s infinite;
    -webkit-animation-name: updown01New;
    -webkit-animation-duration: 8s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    -webkit-animation-play-state: running;
    animation-name: updown01New;
    animation-duration: 8s;
    animation-timing-function: linear;
    animation-delay: 1s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-play-state: running;
}

@keyframes pulse {
	from { -webkit-transform: scale3d(0.5,0.5,1); transform: scale3d(0.5,0.5,1); }
	to { -webkit-transform: scale3d(1,1,1); transform: scale3d(1,1,1); }
}

/****** portfolio styles *************************/
.coverOfPage{ width:100%; height:200%; display:none; background:rgba(0,0,0,0.8); position:absolute; top:0px; left:0px; z-index:999; letter-spacing:0.1em; }

.dinoHover{width:50%; display:block; position:relative; margin-top:-50%; float:right; right:10%; padding-bottom:3em; text-align:center; 
-webkit-transition: all 200ms;
-moz-transition: all 200ms;
-ms-transition: all 200ms;
-o-transition: all 200ms;
transition: all 200ms;
}
.dinoAni{ margin-top:10%; transition:all 2s; display:block;}



.dinoHover img{ position:relative; margin:0px auto; left:0%; max-width:20%; z-index:9999; margin-top:-70%; }

.iconTest{ animation-name:portfolioAni 1s;}

@keyframes portfolioAni{
	0%{ margin-top:-50%; }	
	100%{ margin-top:100%; }	
}

.ahanasHover{width:50%; display:block; background:none; position:absolute; margin-top:-50%; float:right; right:10%; padding-bottom:3em; 
-webkit-transition: all 200ms;
-moz-transition: all 200ms;
-ms-transition: all 200ms;
-o-transition: all 200ms;
transition: all 200ms;
}
.ahanasAni{ margin-top:10%; transition:all 2s; display:block;}

.ahanasHover img{ position:relative; margin:0px auto; left:0%; max-width:20%; z-index:9999; margin-top:-70%; }

.kbsHover{width:50%; display:block; background:none; position:absolute; margin-top:-70%; float:right; right:10%; padding-bottom:3em;
-webkit-transition: all 200ms;
-moz-transition: all 200ms;
-ms-transition: all 200ms;
-o-transition: all 200ms;
transition: all 200ms;
}

.kbsAni{ margin-top:-20%; transition:all 2s; display:block;}

.kbsHover img{ position:relative; margin:0px auto; left:0%; max-width:20%; z-index:99999; margin-top:0%;  }

.wwideHover{width:50%; display:block; background:none; position:absolute; margin-top:-70%; float:right; right:10%; padding-bottom:3em;  overflow:visible;
-webkit-transition: all 200ms;
-moz-transition: all 200ms;
-ms-transition: all 200ms;
-o-transition: all 200ms;
transition: all 200ms;
 }

.wwideAni{ margin-top:0%; transition:all 2s; display:block;}

.wwideHover img{ position:relative; margin:0px auto; left:0%; max-width:20%;  z-index:999;  margin-top:0%; }

.jkrHover{width:50%; display:block; background:none; position:absolute; margin-top:-70%; float:right; right:10%; padding-bottom:3em;  overflow:visible;
-webkit-transition: all 200ms;
-moz-transition: all 200ms;
-ms-transition: all 200ms;
-o-transition: all 200ms;
transition: all 200ms;
 }

.jkrAni{ margin-top:0%; transition:all 2s; display:block;}

.jkrHover img{ position:relative; margin:0px auto; left:0%; max-width:20%;  z-index:999;  margin-top:0%; }


.sherleysHover{width:50%; display:block; background:none; position:absolute; margin-top:-70%; float:right; right:10%; padding-bottom:3em; 
-webkit-transition: all 200ms;
-moz-transition: all 200ms;
-ms-transition: all 200ms;
-o-transition: all 200ms;
transition: all 200ms;
 }
.sherleysAni{ margin-top:0%; transition:all 2s; display:block;}
.sherleysHover img{ position:relative; margin:0px auto; left:0%; max-width:20%;  z-index:999; margin-top:0%; }

.hoverTxt{ width:50%;  padding:20px 20px;  display:block; background:none; color:#7fadc5; text-align:center; left:15px; border-radius:100%; position:relative; margin:0px auto; margin-bottom:3em; z-index:99;  }

.dinoHover .hoverTxt img{ max-width:100%; height:auto; z-index:-10; position:absolute; top:80%; left:0%;}
.ahanasHover .hoverTxt img{ max-width:100%; height:auto; z-index:-10; position:absolute; top:80%; left:0%;}
.kbsHover .hoverTxt img{ max-width:100%; height:auto; z-index:-10; position:absolute; top:-34%; left:0%;}
.wwideHover .hoverTxt img{ max-width:100%; height:auto; z-index:-10; position:absolute; top:-40%; left:0%;}
.jkrHover .hoverTxt img{ max-width:100%; height:auto; z-index:-10; position:absolute; top:-40%; left:0%;}
.sherleysHover .hoverTxt img{ max-width:100%; height:auto; z-index:-10; position:absolute; top:-40%; left:0%;}

.dinoHover .hoverTxt{padding-top:10%;}
.kbsHover .hoverTxt{padding-top:8%;}
.wwideHover .hoverTxt, .jkrHover .hoverTxt{ padding-top:6%;}

.hoverTxt img{ max-width:100%; height:auto; display:block; z-index:-10; position:absolute; top:-60%; left:0%;}
.hoverTxt a{ color:#fff; margin-top:3em; line-height:3em; letter-spacing:0.3em; text-transform:uppercase;  }
.hoverTxt a:hover{ color:#7fadc5;}
	
.portfolioOuter{width:90%;  position:absolute; left:5%; display:block; margin-top:0px auto; background:#000; color:#fff; }

.portfolioOuter img{ max-width:100%; height:auto; display:block; position:absolute; top:6em; left:0%; clear:both;}

.portfolioInner{ width:90%; position:relative; margin:0px auto; background:none;  display:block;}

.portfolioOuter h1{ color:#7FADC5; text-transform:uppercase; text-align:center; font-size:1.6vw; line-height:2.4em; z-index:9999; font-weight:bold; letter-spacing:0.72em; z-index:9999; height:100px; display:block; width:100%; margin:0px; padding:0px;}

.dino{width:12%; position:absolute; margin:-10% 0% 0% 44%; cursor:pointer; -webkit-transition:all 1s;   }

.dino img{ max-width:100%; height:auto; display:block;}
.dino img:focus + .dinoHover{ margin-top:20%; transition:all 200ms; -webkit-transition:all 200ms; }



.ahanas{width:12%; position:absolute; margin:12% 0% 0% 14%; cursor:pointer; }
.ahanas img{ max-width:100%; height:auto; display:block;}
.ahanas:hover{ animation:portfolio 0.5s;  }

.wwide{ width:12%; position:absolute; margin:42% 0% 0% 22%; cursor:pointer;}
.wwide img{ max-width:100%; height:auto; display:block;}
.wwide:hover{ animation:portfolio 0.5s;  }

.kbs{ width:12%; position:absolute; margin:12% 0% 0% 76%; cursor:pointer;  }
.kbs img{ max-width:100%; height:auto; display:block;}
.kbs:hover{ animation:portfolio 0.5s;  }

.jkr{ width:12%; position:absolute; margin:40% 0% 0% 75%; cursor:pointer; }
.jkr img{ max-width:100%; height:auto; display:block;}
.jkr:hover{ animation:portfolio 0.5s;  }

.sherleys{width:12%; position:absolute; margin:52% 0% 0% 50%; cursor:pointer; }
.sherleys img{ max-width:100%; height:auto; display:block;}
.sherleys:hover{ animation:portfolio 0.5s;  }
/**** portfolio styles end********************/

/******** contact page style *************/

.topwr{width:90%; position:relative; margin:50px auto; display:block; margin-left:10%; }
.topwr ul{ position:relative; margin:0px 0px; padding:0px 0px; list-style:none; font-size:1.4em;   }
.topwr ul li{ position:relative; float:left; margin:0px 10% 0px 0px; letter-spacing:0.1em; color:#7FADC5; }


.contactPageWr{ width:100%; height:900px; position:relative; margin:0px 0px; display:block; color:#fff; overflow:hidden;}
/*
.contactPageWr img{ min-width:100%; height:auto; display:block; position:absolute;   bottom:0px; left:0px; border-top:0px solid #f00;}
*/
.contactPageWr img{ min-width:100%; height:auto; display:block; position:absolute; bottom:0px; left:0px; }

/*
.contactSpider{width:50%; position:absolute; left:75%; margin-top:-70%;
text-align:center;    }
*/

.contactSpider{width:50%; position:relative; margin:0% auto;
text-align:center;    }
 
.address{ color:#FFF; text-align:center; letter-spacing:0.2em; font-size:2em; color:#7FADC5; width:100%; position:relative;   }

 
.contactSpider img{ position:relative; max-width:20%; float:none; clear:both; margin-top:0%; left:1.5%;}
.contactSpider h1{ position:relative; font-size:2em; margin:3% auto; right:35.5%; clear:both; text-align:center; color:#7FADC5; font-family: 'futura_ltregular'; letter-spacing:0.22em; }



.containerOuter{width:100%; border:0px solid #555; height:28em; margin-top:6%; }

.container { position:relative; width:60%; margin:0% auto; z-index:99999;}

.formWrapper{ position:relative; width:80%; margin:0% 0% 0% 10%; float:left; z-index:9999999;}

.formWrapper .inpt{ width:100%; position:relative;line-height:1.2em; background:none; border:none; font-size:2em; color:#7FADC5; border-bottom:1px solid #7FADC5; padding-bottom:0.3em; margin:0em 0em 2em 0em; letter-spacing:0.1em;}

input[type="text"]:focus{ outline:none; }

input[type="submit"]{ 
	padding: 0.6em 1.5em; 	border: 3px solid #7FADC5;
	border-radius: 40px; 	font-weight: 700;
	color: #7FADC5;	font-family: 'futura_ltregular' !important;
	letter-spacing:0.3em;	
	position:relative; 	clear:both;
	z-index:99999;
	margin:0px 40%;
	float:none;	
	text-align:center; 	background:#000;
	font-size: 1.4em;
}
input[type="submit"]:hover{
	color:#fff;
}
/**** contact page style end ***************/

@media only screen and (min-width:320px) and (max-width:414px){
	.topwr ul li{ float:none; clear:both; text-align:center; margin:0px 10% 10% 0px;  }
	.logo{ width:12%; position:relative; top:0%; margin:0px auto 3% auto; left:0px; text-align:center; }
	.containerOuter{width:100%; border:0px solid #555; height:28em; margin-top:3em; }
	.container { position:relative; width:100%; margin:0% auto; z-index:99999;}
	
	.formWrapper .inpt{ width:100%; position:relative;line-height:1.2em; background:none; border:none; font-size:1.2em; color:#7FADC5;  border-bottom:1px solid #7FADC5; padding-bottom:0.3em; margin:0em 0em 2em 0em; letter-spacing:0.1em;}
	
	.contactPageWr{ width:100%; height:225px; position:relative; margin:0px 0px; display:block; color:#fff; overflow:hidden;}
	.contactPageWr img{ min-width:100%; height:auto; display:block; position:absolute; top:0px; left:0px;}
	
	input[type="submit"]{ 
	padding: 0.6em 1.5em; 	border: 3px solid #7FADC5;
	border-radius: 40px; 	font-weight: 700;
	color: #7FADC5;	font-family: 'futura_ltregular' !important;
	letter-spacing:0.3em;	
	position:relative; 	clear:both;
	z-index:99999;
	margin:0px 30%;
	float:none;	
	text-align:center; 	background:#000;
	font-size: 1.4em;
}
	
		
}
@media only screen and (min-width:361px) and (max-width:768px){
	.logo{ width:12%; position:relative; top:0%; margin:0px auto 3% auto; left:0px; text-align:center; }
	.contactPageWr{ width:100%; height:225px; position:relative; margin:0px 0px; display:block; color:#fff; overflow:hidden;}
	body{ max-height:50%;}
	.contactPageWr img{ min-width:100%; height:auto; display:block; position:absolute; top:0px; left:0px;}
	.topwr ul li{ float:none; clear:both; text-align:center; margin:0px 10% 10% 0px;  }
	
	.portfolioOuter h1{  }
	.imgContainer{ margin-top:13%;}	


	.hoverTxt{ width:90%; background:none; z-index:99999; margin:-20px auto; right:20%;}
	.hoverTxt img{ z-index:-999;}
	.dinoHover .hoverTxt img, .ahanasHover .hoverTxt img, .kbsHover .hoverTxt img, .wwideHover .hoverTxt img{ display:none; z-index:-99999; }
	.dinoHover{width:100%; display:block; position:absolute; margin-top:-170%; float:none; right:0%; padding-bottom:3em; text-align:center; 
}
	.dinoAni{ margin-top:50%; transition:all 2s; display:block;}

	.ahanasHover{width:100%; display:block; position:absolute; margin-top:-170%; float:none; right:0%; padding-bottom:3em; text-align:center; 
	}
	.ahanasAni{ margin-top:50%; transition:all 2s; display:block;}
	
	.kbsHover{width:100%; display:block; position:absolute; margin-top:-170%; float:none; right:0%; padding-bottom:3em; text-align:center; 
}
	.kbsAni{ margin-top:0%; transition:all 2s; display:block;}
	
	.wwideHover{width:100%; display:block; position:absolute; margin-top:-170%; float:none; right:0%; padding-bottom:3em; text-align:center; 
}
	.wwideHover img{ margin-top:0%; min-width:25%; }
	.wwideAni{ margin-top:0%; transition:all 2s; display:block;}

	.jkrHover{width:100%; display:block; position:absolute; margin-top:-180%; float:none; right:0%; padding-bottom:3em; text-align:center; 
}
	.jkrHover img { min-width:25%; margin-top:-10%;}
	.jkrAni{ margin-top:10%; transition:all 2s; display:block;}

	.sherleysHover{width:100%; display:block; position:absolute; margin-top:-170%; float:none; right:0%; padding-bottom:3em; text-align:center; 
}
	.sherleysAni{ margin-top:10%; transition:all 2s; display:block;}
	
	.formWrapper .inpt{ width:100%; position:relative;line-height:1.2em; background:none; border:none; font-size:1.6em; color:#7FADC5; text-transform:uppercase; border-bottom:1px solid #7FADC5; padding-bottom:0.3em; margin:0em 0em 2em 0em; letter-spacing:0.1em;}

}


@media only screen and (max-width:768px){
h1{ font-size:70% !important; }	
h2{ font-size:70% !important; }	


.toolTipDiv{ display:none;}

.tooltip2{ display:none;}	
.circle{ display:none;}
.circletext{ display:none; }
/* .titleH1{ position:relative; float:none; clear:both; margin:25% auto; left:-20%; } */

.title1, .title2, .title3, .title4, .title5, .title6, .title7, .title8, .title9, .title10, .title11, .title12, .title13, .title14
{ margin:18% 0% 0% 0%; }
.section1Inner h2{ margin:18% 0% 0% 15%; }



.astroRight{ margin-bottom:25%; margin-top:14%; }
.astroLeft{ margin-bottom:10%;}
.astroLeftBig{ margin-bottom:1%; }

.astroAdj{ margin-top:25%; }
.astroAdj2{ margin-top:-5%; }
.astroAdj3{ margin-bottom:895%; top:-86%;   }
.astroAdj4{ margin-top:-5%; }
.astroAdj5-0{margin-top:-26%;}
.astroAdj5{ margin-top:-14%; }

.astroAdj6{ margin-top:-15%; }
.astroAdj7{margin-top:-10%;}
.astroAdj8{ margin-top:0%; bottom:13%; left:85%; width:26%; }
.astroAdj10{ margin-top:-20%;}
.astroAdj11{ margin-top:-8%; left:10%;}
.astroAdj12{margin-top:-10%;}
.astroAdj14{ margin-top:-10%;}

.title15{ margin-top:-30%; left:5%;}
.title17{ margin:-20% 0% 0% 0%;}
.title18{ bottom:100%; left:10%;  }

.sherleys{ margin-bottom:200px; }


.dino{ margin:22% 0% 0% 40%; clear:both; float:none; width:20%; }
.ahanas{margin:48% 0% 0% 40%; clear:both; float:none; width:20%; }
.kbs{ margin:72% 0% 0% 40%; clear:both; float:none; width:20%; }
.wwide{ margin:95% 0% 0% 40%; clear:both; float:none; width:20%; }
.jkr{ margin:118% 0% 0% 40%; clear:both; float:none; width:20%; }
.sherleys{ margin:142% 0% 0% 40%; clear:both; float:none; width:20%; }

/****** portfolios *************/
/*
.dinoHover, .ahanasHover, .kbsHover, .wwideHover, .jkrHover, .sherleysHover{ right:10%; width:80%; border-radius:100%; background:none; margin-top:-100%; }
*/



.hoverTxt img{ display:none; }

/**** contactpage h1 *****************/
.contactSpider h1{ font-size:80%;}
}



.gototop{display:block; height:100%; width:100%; position:absolute; top:0px; left:0px; background:#fff; z-index:999;}





