html, body {background-color: rgba(255,255,255,1); }
body {overflow-x: hidden; overflow-y: scroll;} 

#topnav-page { background-color: rgba(0,0,0,.9); width:100%; text-align:center; font-family:'faricy_newlight'; font-size:12px; height:37px; line-height:37px; overflow:hidden}
#topnav-page ul { margin:0px; padding:0px}
#topnav-page ul li { display:inline; margin-left:24px; margin-left:24px}
	#topnav { background-color: rgba(0,0,0,.9); position:fixed; top:0px; left:0px; z-index:1099; width:100%; text-align:center; font-family:'faricy_newlight'; font-size:15px; height:37px; line-height:37px; overflow:hidden}
	#topnav ul { margin:0px; padding:0px ;width: 660px; margin-left:auto; margin-right:auto}
	#topnav ul li { display:inline; margin-left:22px; margin-right:22px}
	
/* ---- home----- */

	
#view-project{  position: absolute;  left: 50%;  bottom:0px;   margin-left: -111px;   z-index:998;  }
#view-project object{display:block}
	

#footer-text-project {z-index:810; width:100%;   text-align:center;  font-family: 'faricy_newlight'; padding-top:25px}


#bottom-overlay-project{height:140px; z-index:800; width:100%;  background-color: rgba(130,130,130,1)}


	


/* ---- end home----- */
/* ---project--*/


.projectbox{ width:32.5%; width:calc(33%-12px);  margin-right:12px; margin-bottom:12px; background-color:rgba(204,204,204,1); overflow:hidden; position:relative; float:left}
.projectbox:nth-child(3n) {margin-right:0px !important;  }
.projectbox img { display:block}
#projectarea{ width:1280px; margin-left:auto; margin-right:auto} 
#projectcontainer{ width:103%;padding-top:12px; background-color:rgba(255,255,255,1); margin-left:auto; margin-right:auto}
.whiteover{  width:100%; background-color:rgba(255,255,255,.9); height:100%; position:absolute; display:none; }  
.grayover{ width:100%;  height:100%; position:absolute;pointer-events:none;}


.projectbox:hover .whiteover {display:block; }
.projecttitle{ font-size:22px;  text-transform:uppercase;line-height: 1.3;  font-family:'faricy_new_rgregular';
margin-bottom: 5px;
margin-top: 4px;}
.projectst{ font-size:14px} 
.line{ margin-top:10px; margin-bottom:10px; border-bottom:2px #414042 solid; width:90px}
.projimg img{ width:100%; }
.inwhiteover{margin-left:80px; color:rgba(51,51,51,1);  margin-right:100px;display: table;
position: absolute;
height: 100%;
width: 80%;}

.ingrayover{margin-left:30px; color:rgba(51,51,51,1);  margin-right:100px;display: table;
position: absolute;
height: 100%;
width: 80%;
 font-size:24px;
 font-family:'faricy_newlight';
}


.viewpro{ border-bottom:2px solid rgba(51,51,51,1); display:none; font-size:16px; width:45px;line-height: 1.4;}  

@media (max-width: 880px) {

	.inwhiteover{width: 80%; margin-left:10px; margin-right:10px}
#projectcontainer{ width:100%} 
	#moico{ height:37px;}
	.viewpro{ display:block; margin-top:30px}
	.projecttitle { width: 300px;} 
	#projectdescription {
    font-size: 17px;
    margin-left: 30px;
    min-width: 100px;
    width: 80%;
    float: left;
    margin-right: 30px;
}
#linktowww {

    display: none;
}
#contentzone {

    padding-top: 30px;
}
}
@media (max-width: 1100px) { .ingrayover{ font-size:18px}}

@media (min-width: 1920px) {

	.ingrayover{ font-size:26px}
	#bottom-overlay-project { width:1920px; margin:auto}
	}