@charset "utf-8";
/* CSS Document */
/************* GENERIC *******************/
body{ margin:0px; font-size:13px; padding:0px; background-image:url(../images/loading.gif); background-repeat:no-repeat; background-position:center;}
body, div, span, a{font-family: 'Poppins', sans-serif;}
a{ cursor:pointer;}
img{ border:0px;}
[clear]{clear:both !important; float:none !important;}
[preloader]{ background-image:url(../images/loading.gif); background-repeat:no-repeat; background-position:center; height:100px;}





/************* TOP_BAR *******************/
[top_bar]{ height:60px; width:100%; background-color:rgba(0,0,0,.30); position:fixed; top:0px; overflow:hidden; z-index:100; min-width:385px; display:none;}
[top_bar] a{ position:relative; overflow:hidden;}
[top_bar] [logo_holder]{ height:100%; width:164px; display:block; float:left;border-right:1px solid #666;-webkit-transition:width .5s; /* For Safari 3.1 to 6.0 */transition:width .5s;*/}
[top_bar] [logo_holder] [img]{background-image:url(../images/am_logo.png);  background-position:center 17px; background-repeat:no-repeat; width:100%; height:100%; position:absolute; z-index:1; background-size: 30%;}
[top_bar] [link]{ height:100%; padding:20px 25px; float:left; display:block;  border-right:1px solid #666;-webkit-transition:width .5s; /* For Safari 3.1 to 6.0 */transition:width .5s;*/; display:none; color:white; }
[top_bar] [link] [txt]{ position:relative; z-index:1; font-size: 14px;}
[top_bar] a [active]{ width:0px; height:100%; background-color:#042c58; z-index:0; position:absolute; bottom:0px; left:0px;}
[top_bar] a.folio [active]{ background-color:#d36647;}
[top_bar] a.xperience [active]{ background-color:#809b10;}
@media screen and (max-width:400px){
	[top_bar] [logo_holder]{width:120px;}
	[top_bar] [logo_holder] [img]{background-size: 38%;}
}



/************* FOLIO and XPERIENCE *******************/
[folio],[xperience],[footer]{ display:none; border-top:1px solid #2a4384; padding-top: 100px; background:#0f2c56; color:white}
[header]{border-top:0px solid #cccccc; padding:50px 20px 30px 20px; font-size:45px; text-transform:uppercase; font-weight: 500;}
@media screen and (max-width: 500px){
	[header]{font-size: 30px;}
}
[header] span{ color:white; padding: 0 10px; display: inline-block; font-weight: 200; border-radius: 15px; margin-left: 0px;font-family: 'Rock Salt', cursive; text-transform: none; font-size: 18px; text-decoration: ;}
@media screen and (max-width: 800px){
	[header] span{font-size: 15px; padding: 0px 0px; margin: 0; top: -5px; position: relative; margin-left: 10px;}
}
/************* FOLIO GRID *******************/
[folio_grid]{width:100%; position:relative; overflow:hidden; position:relative; }
[folio_grid] [item]{height:290px; float:left; position:absolute; max-width:400px;overflow:hidden; text-align:center; cursor:pointer; }
[folio_grid] [item]{
/*
-webkit-transition:width 0s;  For Safari 3.1 to 6.0 
transition:width 0s;*/
}
[folio_grid] [item] [inner]{ width:100%; height:100%;overflow:hidden; position:relative; border:0px  solid #EFEFEF;}
[folio_grid] [item] img{ position:absolute; left:0px; transition: opacity .5s;}
[folio_grid] [item]:hover img{opacity: .5}
[folio_grid] [item]:hover [fh1]{bottom:60px; background: rgba(0,0,0,1);}
[folio_grid] [item]:hover [fh2]{bottom:33px;background: rgba(0,0,0,.5); opacity: 1;}
[folio_grid] [item] [fh1]{ position:absolute; bottom:20px; left:0p;font-size:13px; border-radius:2px; font-weight: 600; border-radius: 3px; color:white; background-color:rgba(0,0,0,.3); padding: 2px 5px;transition: bottom .3s, background .5s; border-radius: 5px;}
[folio_grid] [item] [fh2]{ position:absolute; bottom:13px; left:3px; background-color:rgba(0,0,0,.1);padding:2px 3px;font-size:12px; border-radius:2px; color:white; transition: bottom .6s, background .5s; border-radius: 5px; opacity: 0;}
/************* XPERIENCE *******************/
[xperience] [skills_holder]{ padding:40px 10px 140px 10px;}
[xperience] [skill]{ float:left; margin:20px; text-align:left;}
[xperience] [skill] [skill_name]{ font-size:12px; text-align:right; color:white; text-align:left;}
[xperience] [skill] [bar]{height:1px; width:290px; background-color:rgb(84, 84, 84); margin-top:10px;}
[xperience] [skill] [bar] [inside]{ height:1px; width:50%; background-color:white !important;}
/************* XPERIENCE *******************/
[footer]{font-size:11px; padding:30px 20px;}
[footer] a{ text-decoration:none; padding:5px 10px; background-color:#F1F0D1; border-radius:2px; color:#000000; display:inline-block;}
/************* POPUP *******************/
[folio_popup_holder_bg]{position:fixed; right:0px; top:0px; left:0px; bottom:0px; display:none; height:100%; width:100%; background-color:black; opacity:.6; z-index:101;}
[folio_popup_holder_outer]{position:fixed; right:0px; top:0px; left:0px; bottom:0px; display:none; height:100%; width:100%;text-align:center; overflow:hidden;overflow-y:scroll; z-index:102; text-align:center;}
[folio_popup_holder]{ width:100%; height:100%; overflow:hidden; display:table; table-layout:fixed;}
[folio_popup_holder] [inner_holder]{ display:table-cell; vertical-align:middle; padding:50px 0px 0px 0px;text-align:center; overflow:hidden; table-layout:fixed;}
[folio_popup_holder] [folio_popup]{ position:relative; background-color:white;text-align:center; min-height:10px; display:inline-block; width:900px; max-width:100%;}
[folio_popup_holder] [folio_popup] img{ max-width:100%;}
/************* POPUP_CONTENT *******************/
[folio_popup_holder] [cont_holder]{ overflow:hidden;}
[folio_popup_holder] [cont_holder] [content]{ display:none;}
/************* POPUP Header *******************/
[folio_popup] [h1]{padding:13px 30px; text-align:left; border-bottom:1px solid #E9E9E9; overflow:hidden;font-size:28px; margin-top:10px;}
[folio_popup] [summery]{padding:0px 30px 13px 30px;  text-align:left;padding-bottom:30px;}
[folio_popup] [summery] div{float:left;}
[folio_popup] [summery] [desc]{width:70%;font-size:14px;  margin-top:13px;}
[folio_popup] [summery] [keywords]{width:30%; font-size:11px; margin-top:13px;}
[folio_popup] [summery] [keywords] div{ padding-left:50px;}
[folio_popup] [summery] [keywords] [h4]{ font-size:14px; float:none; margin-bottom:5px; }
/************* POPUP NAV *******************/
[popup_nav]{ height:50px; width:100%; position:fixed; top:0px;margin:auto; text-align:center; z-index:102; position:fixed; display:none;}
[popup_nav] [inner]{ width:900px; max-width:100%; height:100%; background-color:#EBEBEB; position:relative; display:inline-block; min-width:200px; text-align:right;
background-color: rgba(235, 235, 235, 0.5);
/* For IE 5.5 - 7*/
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
/* For IE 8*/
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
}
[popup_nav] [inner] a{ width:50px; height:50px; background-color:white; border-right:1px solid #F5F5F5; display:inline-block; background-position:center; background-repeat:no-repeat;}
[popup_nav] [inner] a:hover{ background-color:#F5F5F5}
[popup_nav] [inner] a[prev]{ background-image:url(../images/prev.png);}
[popup_nav] [inner] a[next]{ background-image:url(../images/next.png);}
[popup_nav] [inner] a[close]{ background-image:url(../images/close.png);}

/************* ANI *******************/
[ani]{ overflow:hidden; width:100%; display:none; position: relative;}
[ani] [inner] {background-image:url(../images/space_bg.jpg); background-position:1500px 40%;width:100%; background-size:auto 140%; background-repeat: repeat-x; height: 100%;}



[ani] [preload_me],[ani] [preload_bg]{ display:none;}
[ani] [solar]{ height:100%; width: 900px;  position:absolute; text-align:center; min-height:550px; max-width:100%; top: 0px;}
[ani] [solar]>div{ border-radius:100%; position:absolute;}
[solar] [sun]{ background-color:#ffc000; height:0px; width:0px; top:500px; background-image: url(../images/sun.jpg); background-size: 100%;}
[solar] [mercury]{ background-color:#b8b8b8; height:0px; width:0px; top:500px; background-image: url(../images/venus.jpg); background-size: 100%;}
[solar] [venus]{ background-color:#cfba7a; width:0px; height:0px; top:500px; background-image: url(../images/mercury.jpg); background-size: 100%;}
[solar] [earth]{ background-color:#6da9cc; text-align:center; width:7000px; height:7000px; left:-3000px; display:none; background-image: url(../images/earth.jpg); background-size: 100%;}
[solar] [earth] [me]{position:relative; width:300px; height:300px; display:inline-block; background-image:url(../images/yoga_.png); background-repeat:no-repeat; background-position:center; background-size:80%; z-index:1000;}
/************* ME ARMS *******************/
[solar] [earth] [me] img{ display:none; position:absolute;}
[solar] [earth] [me] [a1]{ display:block;left:-2px; top:40%; height:auto; width:36%;}
[solar] [earth] [me] [a2]{ left:0px; top:80px;}
[solar] [earth] [me] [a3]{left:0px; top:0px;}


/************* SOLAR COPY *******************/
[ani] [copy]{ z-index:1; margin:0 auto; text-align: center; top:44%; position: absolute; left: 0; right: 0;}

[ani] [h1],[ani] [h2]{}
[ani] [h1][highlight]{background:rgba(0,0,0,.5); padding: 0 15px; border-radius: 20px;}
[ani] [h1] div{ display:inline-block;}
[ani] [h1],[ani] [h2],[ani] [h3]{ color:white; border-radius:2px;}
[ani] [h1]{ padding:0px; font-size:60px; color:white; display: inline-block; background-color: rgba(255,255,255,0); margin:2px 4px; font-weight: 500; opacity: .3}
[ani] [h2]{ padding:3px 8px 5px 8px; font-size:15px; margin-top:3px; display:inline-block;border-radius: 3px; color:white;opacity:0; letter-spacing: 3px;}
[ani] [h3]{background-color:rgba(0,0,0,.1); font-size:13px; margin-top:5px; display:inline-block; background-image:url(../images/am_em.png); width:170px;height:30px; display: nonee; background-repeat:no-repeat; background-position:center; background-size: 90%; border-radius: 3px;opacity:0;}
[skip_intro]{ position:absolute; bottom:15px; right:15px; padding:35px 35px; font-size:15px; font-weight: bold; background-color:rgba(0,0,0,.5);-webkit-transition:background .5s; color:white; cursor:pointer;  z-index:2; border-radius:100px; width: 70px; height: 20px; text-align: center;}
[skip_intro]:hover{ background-color:black}
@media screen and (max-width: 1200px){
	[ani] [h1]{font-size: 35px; line-height:30px;}
	[ani] [h2]{ font-size: 12px; margin-top: 20px; padding: 3px 4px 5px 4px;}
}
@media screen and (max-width: 500px){
	[ani] [copy]{ margin:0 50px;top:38%;}
}

/* SIZES */
@media screen and (min-width:2000px) {[folio_grid] [item]{width:14%;}}
@media screen and (max-width:2500px) and (min-width:1600px) {[folio_grid] [item]{width:20%;}}
@media screen and (max-width:1600px) and (min-width:1001px) {[folio_grid] [item]{width:25%;}}
@media screen and (max-width:1200px) and (min-width:801px) {[folio_grid] [item]{width:33.3333%;}}
@media screen and (max-width:800px) and (min-width:601px) {[folio_grid] [item]{width:50%;}}
@media screen and (max-width:600px){[folio_grid] [item]{width:100%;}}
@media screen and (max-width:700px){
	[folio_popup] [summery] [desc]{width:100%;}
	[folio_popup] [summery] [keywords]{width:100%; margin-top:15px;}
	[folio_popup] [summery] [keywords] div{ padding:0px;}
}

@media screen and (max-width:900px){
	[popup_nav] [inner]{ left:auto !important;}
}

