/* Foundation v2.2.1 http://foundation.zurb.com */
/* Artfully masterminded by ZURB  */

/* -------------------------------------------------- 
   Table of Contents
-----------------------------------------------------
:: Shared Styles
:: Page Name 1
:: Page Name 2
*/


/* -----------------------------------------
   Shared Styles
----------------------------------------- */
body { background:#f2f4f5;}

.menu-content {
	text-transform: uppercase;
}
.no-italic {
	font-style: normal;
}

.dotline {
	background:url(../images/common/dotline0.svg) repeat-x;
	padding-top:6px;
}

.dotlinemargin {
	background:url(../images/common/dotline0.svg) repeat-x;
	padding-top:6px;
	margin-top:10px;
}

.dotlinemargin2 {
	background:url(../images/common/dotline0.svg) repeat-x;
	padding-top:6px;
	margin-top:4px;
}

.header { color:black;}
.headerprj { color:black;font-weight:bold; font-size:12px ;font-size:1.2rem ;}
.headerprjm { color:black;font-weight:bold; }
.italic {font-style:italic;}

.header a{ color:black;}
.header a:hover{ color:#bbbdc0;}

li a.active { color:black; }

.projects { font-style:italic; }

.project-selected img{ margin-right:12px; margin-bottom:10px;}

.projects-inside img{ margin-right:12px;}

.boxleft {width:361px; margin-right:12px;}
.box {width:361px;}
.top12 { margin-top:12px;}
.bottom12 { margin-bottom:12px;}
.shadow {
-moz-box-shadow: 2px 2px 5px #888;
-webkit-box-shadow: 2px 2px 5px #888;
box-shadow: 2px 2px 5px #888;
/* For IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=180, Color='#888')";
/* For IE 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=180, Color='#888');
}
.clear{ clear:both;}

.aboutlinks a{ color:#ec008b}
.aboutlinks a:hover { color: #bbbdc0; }
.aboutlinks	a:focus { color: #bbbdc0;; outline: none; }

.margin1row { margin-top:24px;}
.margin2row { margin-top:8px;}

/* -----------------------------------------
   HOVER EFFECTS
----------------------------------------- */


.view {
   width: 174px;
   height: 174px; 
   margin-right:13px;
   float: left;
   overflow: hidden;
   position: relative;
   text-align: left;
   cursor:pointer;
   margin-bottom:13px;
}
.mask1{ background:url(../images/common/backwhite.jpg) no-repeat}

.view .mask1,.view .content {
   width: 174px;
   height: 174px;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
   color:#000;
}
.view img {
   display: block;
   position: relative;
}
.view p {
   position: relative;
   color: #fff;
   text-align: left;
}
.view a.info {
   display: inline-block;
   text-decoration: none;
   padding: 7px 14px;
   background: #000;
   color: #fff;
   text-transform: uppercase;
}
.view-tenth .mask1 {
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.view-tenth h6 {
   background: transparent;
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.view-tenth p {
   color: #333;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.view-tenth a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.view-tenth:hover img {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.view-tenth:hover .mask1 {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   background:url(../images/common/backwhite.jpg) no-repeat
}
.view-tenth:hover h6,.view-tenth:hover p,.view-tenth:hover a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}


/* -----------------------------------------
   About
----------------------------------------- */
.about { background:url(../images/img/aboutcontact/about_pg_1.jpg) no-repeat; padding:40px 20px}
.about h2 { color:black; font-size:20px; font-weight:normal;}
.about p { margin-bottom:20px;}

/* -----------------------------------------
   FORM
----------------------------------------- */
.form { position:absolute; z-index:99; background:black; padding:30px 30px 30px 30px; width:290px; margin-left:190px; margin-top:120px; display:none; color:white;}
.ifvimput {float:right;}

.form-ifv {margin-top:10px;}
.buttonifw {
		background: #ec008c;
		display: inline-block;
		text-align: center;
		padding: 5px 5px 7px;
		color: #fff;
		text-decoration: none;
		font-size: 12px; font-size: 1.2rem;
		line-height: 1;
		font-family: 'Bitter', serif;
		position: relative;
		cursor: pointer;
		border: none;
		outline: none;
		margin: 10px 0 0 0;
		float:right;
		-moz-border-radius: 0px;
		-webkit-border-radius: 0px;
		border-radius: 0px;
	}
	
	@media only screen and (max-width: 767px) {	
.form { position:inherit; z-index:99; background:black; padding:30px 30px 50px 30px; width:auto !important;   margin-left:0px; margin-top:0px; display:none; color:white; margin-bottom:20px;}
.buttonifw {	background: #ec008c;
		display: inline-block;
		text-align: center;
		padding: 5px 5px 7px;
		color: #fff;
		text-decoration: none;
		font-size: 12px; font-size: 1.2rem;
		line-height: 1;
		font-family: 'Bitter', serif;
		position: relative;
		cursor: pointer;
		border: none;
		outline: none;
		margin: 10px 0 0 0;
		float:left; 
		-moz-border-radius: 0px;
		-webkit-border-radius: 0px;
		border-radius: 0px;}
		input[type=submit].buttonifw { -webkit-appearance: none; }
.ifvimput {float:left;}
.form-ifv {margin-top:0px;}
}