

html,body {
	margin:0 auto;	
	overflow:hidden;
	font-family:"robotolight";
}

body {
	max-width:1024px;
	height:auto;
	max-height:900px;
	//min-height:500px;
}



.fullscreen-menu {
	//max-width:275px;
	//max-height:768px;
	width:20%;
	min-height:500px;
	height:100%;
	background-color:#0a2433;
	//background-color:#171c20;
	float:left;	
}

.fullscreen-content {
	width:80%;
	min-height:500px;
	height:100%;		
	background-color:#e8edf0;	
	float:right;
	color:#000;	
	overflow-y:auto;
	overflow-x:hidden;
}

.fullscreen-profilephoto {
	width:65%;
	display: block;
    margin: 0 auto ;	
	margin-top:10px;
	border:#00a5ff solid 3px;
	border-radius:3px;
	-webkit-box-shadow: -4px 10px 34px -6px rgba(0,0,0,1);
	-moz-box-shadow: -4px 10px 34px -6px rgba(0,0,0,1);
	box-shadow: -4px 10px 34px -6px rgba(0,0,0,1);
}



.fullscreen-name {
	color:#FFF;	
	width:auto;
	height:auto;
	font-size:2em;
	display: block;
	margin: 0 auto ;
	margin-top:10px;
	text-align:center;
	font-family:"futura_oblique";
}

.fullscreen-desgn {
	color:#FFF;	
	width:auto;
	height:auto;
	font-size:1em;
	display: block;
	margin: 0 auto ;
	margin-top:10px;
	text-align:center;
	font-family:"futura_oblique";
}


.name-divider-line {
	display: block;
	width:100%;
	height:3px;
	background-color:#0b435b;
}

.nav-menu-main {
	display:block;
	list-style-type:none;
	margin:0 auto;
	padding:0;	
	width:100%;	
	margin-top:5px;
	transition: .3s linear;	
}

.nav-menu-main li {
	display:block;
	margin:0 auto;	
	height:45px;
	padding: 0;	
	margin-top:3px;
	font-family:"futura_oblique";
	color:#c1d6df;
	//text-align:center;	
	transition: .4s linear;
}

.nav-menu-main li:hover {
	background-color:#053f61;
	color: #FFF !important;	
	transition: .4s linear;
}

.nav-menu-main li a{
	display:block;
	text-decoration: none;		
	//color: #c1d6df;
	padding-left:10px;
	padding-top:5%;
	font-size:1.3em;	
}

a, a:visited, a:hover, a:active {
  color: inherit;
}

.mob-menu-main .active, .nav-menu-main .active {	
	background-color:#36abe0 !important;
	transition: .3s linear;
	color:#FFF;	
	border-right: 3px solid #FFF;
}

.mob-menu-main .active a, .nav-menu-main .active a{		
	color:#FFF;
}


.mob-menu-main {
	display:none;
	list-style-type:none;
	margin:0;
	padding:0;
	color:#c1d6df;
	width:100%;	
	margin-top:-5px;
	transition: .2s linear;	
	background-color:#0a2433;
}

.mob-menu-main li {
	display:block;
	margin:0 auto;	
	height:45px;
	padding: 0;	
	margin-top:3px;
	font-family:"futura_oblique";
	//text-align:center;	
	transition: .2s linear;
}

.mob-menu-main .active {
	border-right:none !important;	
	border-bottom: 3px solid #FFF !important;
}

.mob-menu-main li a{
	display:block;
	text-decoration: none;		
	color: #c1d6df;
	padding-left:10px;
	padding-top:2%;
	font-size:1.3em;	
	text-align:center;	
}


.mob-tab-menu {	
	display:none;
	position:relative;
	margin:0;
}


.mob-tab-profilephoto {
	height:80%;
	display: block;
	position:relative;
	vertical-align:middle;	
	margin-left:10px;
	top:10%;
	float:left;		
	border:#00a5ff solid 1px;
	border-radius:3px;
	-webkit-box-shadow: -4px 10px 34px -6px rgba(0,0,0,1);
	-moz-box-shadow: -4px 10px 34px -6px rgba(0,0,0,1);
	box-shadow: -4px 10px 34px -6px rgba(0,0,0,1);
	
}

.mob-tab-name {
	display:block;
	position:relative;
	color:#FFF;	
	width:80%;
	height:auto;
	font-size:1.5em;
	display: block;
	margin: 0 auto ;		
	text-align:center;
	top:12%;
	font-family:"futura_oblique";
}

.mob-tab-bar {
	display:block;
	position:absolute;
	width:auto;
	height:60%;	
	float:right;	
	right:5px;
	margin:0;
	top:16%;	
}

.mob-tab-name > span {	
	font-size:.6em;
}





.nav-project-menu {
	display:block;
	list-style-type:none;
	margin:0 auto;
	padding:0;
	//color:#c1d6df;
	width:100%;	
	margin-top:5px;	
}


.nav-project-menu li {
	display:block;
	margin:0 auto;	
	height:auto;
	padding: 0;	
	margin-top:3px;
	color: #c1d6df;	
	transition: .4s linear;
}

.nav-project-menu li:hover {
	background-color:#1379b4 !important;
	color: #FFF !important;	
	transition: .4s linear;
}

.nav-project-menu li:nth-child(odd) {
	background-color:#1a628c;
}

.nav-project-menu li a{
	display:block;
	text-decoration: none;		
	
	padding-left:10px;
	//padding-top:5%;
	//font-size:16px;	
}

.nav-project-menu .active {	
	background-color:#0f8dd5 !important;
	color:#FFF !important;	
	//border-right: 2px solid #FFF	;
	transition: .3s linear;	
}

.nav-project-menu .active a{	
	color:#FFF;
}

.demo-item{
	cursor:pointer;
}
.demo-item:hover>img{
	transform: scale(1.3, 1.3);
	-ms-transform: scale(1.3, 1.3);
	-webkit-transform: scale(1.3, 1.3);	
	transition: .2s linear;
}

.demo-item>img{
	transform: scale(1, 1);
	-ms-transform: scale(1, 1);
	-webkit-transform: scale(1, 1);
	transition: .2s linear;
}

#projlist {
		width:130px;
}




@media only screen and (max-device-width: 600px), only screen and (max-width: 600px) { 
	.mob-tab-menu {
		display:block;
		width:100%;
		height:10%;
		background-color:#0a2433;
	}
	
	.mob-menu-main {
		display:block;	
	}

	
	.fullscreen-menu {
		display:none;
	}
	
	.fullscreen-content {
		width:100%;
		height:90%;
	}
	
	#projlist {
		width:90px;
		font-size:11px;
	}
	
	.ng-hide-add {
		display:block !important;
	}
	
	.ng-hide-remove {
		display:none !important;
	}

	
	
}




