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

body{
	font-family: "Calibri", Rockwell, Trebuchet MS;
	}

*/	
body {
  font-family: "helvetica", sans-serif;
}	
/*	
tables {
  border-collapse: collapse;
}

tables, th, td {
  border: 1px solid #fff;
}
.noBorder {
    border:none !important;
}	

*/

.wraper{
	width:100%; 
	height:auto; 
	margin:0 auto;	
	}
	


.space{height:155px}

.page{
	border:1px solid #ccc; 
	width:85%; 
	margin:0 auto; 
	box-shadow: 0px 0px 5px 0px rgba(66,66,66,1);
	}
	
.header{
	text-align:center; 	
	width:100%;	
	margin:0 auto;
	height:100px;
	}	

.content_frame{
	float:left; 
	width:100%; 
	margin-top:10px; 
	margin-left:10px;
		}	
		
	
.header_frame{
	float:left; 
	width:55%; 
	margin-top:40px; 
	margin-left:70px;
	}	
	
	
.logo{
	width:160px; 
	height:125px; 
	float:left; 
	margin:10px;
	margin-top:20px;
	}	
	
.title{
	height:125px; 
	width:400px; 
	float:left;
	margin-top:20px;
	margin-left:10%;
	text-align:center;
	}	
	
.title-box{
	height:90px; 
	width:400px;
	background-color:#29abe2;
	border-radius:10px;
	color:#fff;
	font-size:36px;
	font-weight:bold;
	line-height:50px;			
	}
	
.sub-title{	
	color:#29abe2;
	font-size:13px;
	font-weight:800;
	line-height:30px;
	font-style:italic;			
	}	
		
.details{
	width:250px;
	height:120px;
	float:right;
	margin-top:20px;
	color:#268099;
	font-size:13px;
	text-align:left;
	line-height:30px;
	}
	
.details_row1{width:100%; height:30px}	
.details_row2{width:100%; height:30px}	
.details_row3{width:100%; height:30px}	
.details_row4{width:100%; height:30px}	

.details_icon{width:15%; float:left}	

.details_txt{width:85%; float:left; line-height:24px}	
	
.top_nav{
	height:40px; 	
	/*background-color:#29abe2; */
	padding-left:30px;
	text-align:left; 
	width:100%;
	margin-left:30px;		
	}	
	
.top_nav a{	
	color:#0c0c0c;
	line-height:50px;	
	width:15%;
	text-align:center;
	float:left;
	text-decoration: none;
    /*color: red !important;
    border-bottom: 1px solid red !important;
    background-image: none !important;*/
	}	
	
.m_nav{
	display:none;	
	}	
	
.top_nav_line{
		float:left; margin-top:20px; margin-left:-90px; border-bottom:2px solid; width:70px; color:#00a359;
		}	
	
.sub_nav{
	height:40px; 		
	padding-left:30px;
	text-align:center; 
	margin-left:40%;
	}	
	
.sub_nav a{	
	color:#0c0c0c;
	line-height:50px;	
	width:18%;
	text-align:center;
	float:left;
	text-decoration: none;
    }
	
.mobile_nav{
	z-index:100; 
	position:absolute; 
	right:0; top:10px; 
	width:150px; 
	height:50px; 
	display:none;
	}	
	
.leftnav {
  overflow: hidden;
  height:200px;  
  position: relative;
}

/* Hide the links inside the navigation menu (except for logo/home) */
.leftnav #myLinks {
  display: none;
}

/* Style navigation menu links */
.leftnav a {
  color: white;
  padding: 5px 6px;
  text-decoration: none;
  font-size: 17px;
  display: block;
  height:20px;
  width:160px;
}

/* Style the hamburger menu */
.leftnav a.icon {
  background: #00a359;
  display: block;
  position: absolute;
  height:50px;
  width:50px;
  right: 0;
  top: 0;
}

/* Add a grey background color on mouse-over */
.leftnav a:hover {
  /*background-color:#00a359;*/
  color:#fff;
  height:10px;
  width:40px;
}

/* Style the active link (or home/logo) */
.active {
  background-color: #04AA6D;
  color: white;
  display:none;
}

	
	
.profile_bg{
	position:absolute; 
	z-index:-1; 
	top:100px; 
	left:0;
	background-image:url(../images/profile_bg.png);
	background-repeat:none;
	height:330px;
	width:292px;
	}
	
.profile_pic{
	position:absolute; 
	z-index:1; 
	top:0px; 
	right:0px;
	background-image:url(../images/profile_img.png);
	background-repeat:none;
	height:576px;
	width:481px;
	}	
	
.profile_icon{
	float:left;
	background-image:url(../images/rs_icon.png);
	height:40px;
	width:40px;
	background-repeat:no-repeat;
	}
	
.about_pic{
	position:absolute; 
	z-index:1; 
	top:110px; 
	left:0px;
	background-image:url(../images/aboutme_bg.png);
	background-repeat:none;
	height:721px;
	width:480px;
	}		
	
.my_profile{
	position:absolute; 
	z-index:1; 
	top:115px; 
	right:0px;
	background-image:url(../images/myprofile_bg.png);
	background-repeat:none;
	height:778px;
	width:484px;
	}	
	
.exp_pic{
	position:absolute; 
	z-index:1; 
	top:145px; 
	left:0px;
	background-image:url(../images/expereince.png);
	background-repeat:none;
	height:778px;
	width:468px;
	}	
	
.contact_pic{
	position:absolute; 
	z-index:1; 
	top:145px; 
	right:0px;
	background-image:url(../images/contact.png);
	background-repeat:none;
	height:686px;
	width:402px;
	}						
	
.certificates{
	float:left;
	margin-left:30px;
	}		 
  	
.index_contentwrap{
	width:65%; 
	height:500px; 	
	margin-left:70px;
	margin-top:10px; 
	text-align:left; 	
	}
	
.home_caption{ position:absolute; z-index:1;left:70px; top:510px; width:80%; font-style:italic; }	
	
.profile_contentwrap{
	width:60%; 
	height:500px; 	
	margin-left:70px;
	margin-top:10px; 
	text-align:left; 	
	}	
	
.contact_contentwrap{
	width:60%; 
	height:200px; 	
	margin-left:70px;
	margin-top:10px; 
	text-align:left; 	
	}	
	
	
.about_contentwrap{
	width:55%; 
	height:500px; 
	float:left;	
	margin-left:600px;
	margin-top:10px; 
	text-align:left; 	
	}	
	
.exp_contentwrap{
	width:55%; 
	height:810px; 
	float:left;	
	margin-left:500px;
	margin-top:10px; 
	text-align:left; 	
	}		
	
.index_contentrow1{
	width:65%; 
	padding-right:30px; 
	padding-top:30px;
	}
	
.index_contentrow2{
	width:70%; 
	color:#333; 
	padding-top:10px;
	}	
	
.index_contentrow3{
	width:61%; 
	color:#333; 
	padding-top:10px;
	}	
	
.index_contentimg{
	width:40%; 
	position:absolute; 
	right:0px; 
	top:0px;
	background-image:url(../images/subhash_1.png);
	background-repeat:no-repeat;
	height:555px;
	}	
	
.project{
	height:400px;
	width:40%;
	margin:30px;
	float:left;
	border:1px solid #999999;
	}	
	
.frame{
	height: 95vh; 
	width:100%; 		
	border: none;
	}	
	
.hues{
	height:250px;
	width:250px;
	margin:20px;
	float:left;
	background-image:url(../images/hues.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
	
.category{
	height:250px;
	width:250px;
	margin:20px;
	float:left;
	background-image:url(../images/category.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}	
	
.smartworks{
	height:250px;
	width:250px;
	margin:20px;
	float:left;
	background-image:url(../images/smartworks.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}			
	
.pitExpansion{
	height:250px;
	width:250px;
	margin:20px;
	float:left;
	background-image:url(../images/Pitexpansion.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
	
.plan{
	height:250px;
	width:250px;
	margin:20px;
	float:left;
	background-image: url(../images/Plancomaprison.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
	
.nps{
	height:250px;
	width:250px;
	margin:20px;
	float:left;
	background-image: url(../images/nps.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
		
/* UI Projects */

.erm{
	height:370px;
	width:370px;
	margin:30px;
	float:left;
	background-image: url(../images/ui/erm_icon.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
	
.bridge{
	height:370px;
	width:370px;
	margin:30px;
	float:left;
	background-image: url(../images/ui/bridge_icon.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
	
.cap{
	height:370px;
	width:370px;
	margin:30px;
	float:left;
	background-image: url(../images/ui/cap_icon.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}	
	
.ges{
	height:370px;
	width:370px;
	margin:30px;
	float:left;
	background-image: url(../images/ui/ges_icon.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}	
	
.mlp{
	height:370px;
	width:370px;
	margin:30px;
	float:left;
	background-image: url(../images/ui/mlp_icon.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
	
.next{
	height:370px;
	width:370px;
	margin:30px;
	float:left;
	background-image: url(../images/ui/next_icon.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}		
	
.nps1{
	height:370px;
	width:370px;
	margin:30px;
	float:left;
	background-image: url(../images/ui/nps_icon.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}	
/* End of UI8*/

/*GD8*/
.new-way{
	height:420px;
	width:420px;
	margin:20px;
	float:left;
	background-image: url(../images/gd/new-way.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}	
	
.ax{
	height:420px;
	width:420px;
	margin:20px;
	float:left;
	background-image: url(../images/gd/ax.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}	
	
.simple{
	height:420px;
	width:420px;
	margin:20px;
	float:left;
	background-image: url(../images/gd/simple.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
	
.dt{
	height:420px;
	width:420px;
	margin:20px;
	float:left;
	background-image: url(../images/gd/dt.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
	
.elevate{
	height:420px;
	width:420px;
	margin:20px;
	float:left;
	background-image: url(../images/gd/elevate.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
	
.spring{
	height:420px;
	width:420px;
	margin:20px;
	float:left;
	background-image: url(../images/gd/spring.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
	
.inspire{
	height:420px;
	width:420px;
	margin:20px;
	float:left;
	background-image: url(../images/gd/inspire.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
	
.creators{
	height:420px;
	width:420px;
	margin:20px;
	float:left;
	background-image: url(../images/gd/creators.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
	
.rainbow{
	height:420px;
	width:420px;
	margin:20px;
	float:left;
	background-image: url(../images/gd/rainbow.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
	
.jouir{
	height:420px;
	width:420px;
	margin:20px;
	float:left;
	background-image: url(../images/gd/jouir.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
	
.flyer{
	height:420px;
	width:420px;
	margin:20px;
	float:left;
	background-image: url(../images/gd/flyer.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
	
.tin{
	height:420px;
	width:420px;
	margin:20px;
	float:left;
	background-image: url(../images/gd/tin.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}		
	
.pamplet{
	height:420px;
	width:420px;
	margin:20px;
	float:left;
	background-image: url(../images/gd/pamplet.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}	
	
.tentcard{
	height:420px;
	width:420px;
	margin:20px;
	float:left;
	background-image: url(../images/gd/Tentcard.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}	
	
.choc-box{
	height:420px;
	width:420px;
	margin:20px;
	float:left;
	background-image: url(../images/gd/Chocolate_box.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}
	
.mango{
	height:420px;
	width:420px;
	margin:20px;
	float:left;
	background-image: url(../images/gd/Mango_chocolate.png);
	background-repeat: no-repeat;
  	background-size: cover;
	border:1px solid #999999;
	vertical-align:middle;
	border-radius:5px;
	}												
/*End of GD*/
	
				

.profile{
	font-size:75px; 
	font-family:"Arial";
	font-weight:bold; 
	line-height:85px; 
	color:#00a359;
	margin-left:-4px;
	}	
	
.about{
	font-size:45px; 
	font-family:"Arial";
	font-weight:bold; 
	line-height:55px; 
	color:#00a359;
	}		
	
.sub-profile{
		font-size:20px; 
		line-height:25px; 
		color:#4c4c4c;
		font-weight:bold;
		font-family:Arial; 
		}	
	
.heading{
	font-family:"Arial";
	font-size:24px;
	line-height:30px;
	font-weight:bold;
	margin-top:15px;
	}		
	
.context{
	font-family:"Arial";
	font-size:30px;
	line-height:36px;
	font-weight:bold;
	margin-top:50px;
	text-align: center;
	}	
	
.content{
	font-family:"Arial";
	font-size:16px;
	line-height:20px;
	}	
	
.catgory_heading{
	font-family:"Trebuchet MS";
	font-size:30px;
	line-height:30px;
	font-weight:bold;
	margin-top:15px;
	}
	
.catgory_content1{
	font-family:"Arial";
	font-size:18px;
	line-height:20px;
	color:#232323;
	}			
	
.catgory_content2{
	font-family:"Arial";
	font-size:20px;
	line-height:24px;
	color:#535353;
	}			
		
.info{
	background-color:#333333; 
	margin:10px; 
	color:#fff; 
	padding:15px;
	margin-left:2%;
	}	
	
.tools{
	float:left; 
	width:48%; 
	height:auto;
	text-align:center;
	}
	
.tools-img{
		text-align:center;
		background-image:url(../images/tools.png);
		height:410px;
		width:408px;
		background-repeat:no-repeat;
		margin:0 auto;
		padding-top:5px;
		}		
	
.skills{
	float:left; 
	width:48%; 
	height:auto;
	text-align:center;
	}
	
.skills-img{
		text-align:center;
		background-image:url(../images/skills.png);
		height:410px;
		width:408px;
		background-repeat:no-repeat;
		margin:0 auto;
		}
		
.content_holder{width:90%; 
				margin:0 auto; 
				border-top:1px solid #999999; 
				margin-top:10px;
				}			
	
.toolskill_holder{
	padding-top:70px; 
	width:95%; 
	margin:0 auto;
	}	
	
.ux_holder{
	width:84%;
	margin:0 auto; 
	text-align:center;
	height:auto;	
	}	
	
.ui_holder{
	width:84%; 
	text-align:center; 
	float:left;
	}	
	
.gd_holder{
	width:80%; 
	margin:0 auto;	
	text-align:center;
	height:auto;	
	}	
	
p{ margin:5px 0}	
	


/* Popup box*/
.popup{
    background:rgba(0,0,0,.4);    
    display:none;
    height:100%;
    position:fixed;
    text-align:center;
    top:0;
    width:100%;
    z-index:1;
}
.popup .helper{
    display:inline-block;
    height:100%;
    vertical-align:middle;
}

.popup > div {
    background-color: #fff;
    box-shadow: 10px 10px 60px #555;
    display: inline-block;
    height:95%;
    width:95%;
    min-height:600px;
    vertical-align: middle;    
    position: relative;   
    padding:10px;
	z-index:2;	
	margin-top:13px;
	margin-left:0%;
	overflow:auto;
	border-radius: 10px;
}


.popupCloseButton {
    background-color: #fff;
    border: 3px solid #999;
    border-radius: 50px;
    cursor: pointer;
    display: inline-block;
    font-family: arial;
    font-weight: bold;
    position: fixed;
    top: 16px;
    right:2%;
    font-size: 25px;
    line-height: 30px;
    width: 30px;
    height: 30px;
    text-align: center;
	z-index:3;
}

.popupTopButton {
    background-color: #fff;
    border: 3px solid #999;
    border-radius: 5px;
    cursor: pointer;
    display: inline-block;
    font-family: arial;
    font-weight: bold;
    position: fixed;
    bottom: 12px;
    left:4%;
    font-size: 25px;
    line-height: 30px;
    width: 60px;
    height: 30px;
    text-align: center;
	z-index:4;
}

.popupCloseButton:hover {
    background-color: #ccc;
}

.popupTopButton:hover {
    background-color: #ccc;
}

.popupHeader {
    background-color:#fff;
    display: inline-block;
    font-family: arial;
    font-weight:Bold;
	color:#268099;
    position: fixed;
    top:15px;
    left:30px;
    font-size: 25px;
    line-height: 45px;
    width:96%;
    height:45px;
    text-align:center;
	border-bottom:1px solid #999;
	border-radius:10px 10px 0 0 ;	 
	z-index:2;
}

.trigger_popup_fricc {
    cursor: pointer;
    font-size: 20px;
    margin: 20px;
    display: inline-block;
    font-weight: bold;
}
/* End of Popup box*/
	
.footer-index{
	   position:relative;
	  left:0px;
	  bottom: 0px;  
	  background-color:#00a359;
	  height:40px;
	  line-height:40px;
	  color: white;
	  margin-top:45%;
	  text-align:center;
  }
  
  .footer-gd{
	  position:relative;
	  left:0px;
	  bottom:0px;  
	  background-color:#00a359;
	  height:40px;
	  line-height:40px;
	  color: white;
	  margin-top:275%;
	  text-align:center;
  }
  
  .footer-about{
	   position:relative;
	  left:0px;
	  bottom: 0px;  
	  background-color:#00a359;
	  height:40px;
	  line-height:40px;
	  color: white;
	  margin-top:55%;
	  text-align:center;
  }
  
  .footer-profile{
	   position:relative;
	  left:0px;
	  bottom: 0px;  
	  background-color:#00a359;
	  height:40px;
	  line-height:40px;
	  color: white;
	  margin-top:44%;
	  text-align:center;
  }
  
  .footer-exp{
	   position:relative;
	  left:0px;
	  bottom: 0px;  
	  background-color:#00a359;
	  height:40px;
	  line-height:40px;
	  color: white;
	  margin-top:62%;
	  text-align:center;
  }
  
  .footer-contact{
	   position:relative;
	  left:0px;
	  bottom: 0px;  
	  background-color:#00a359;
	  height:40px;
	  line-height:40px;
	  color: white;
	  margin-top:44%;
	  text-align:center;
  }