/* ================================================================== */

/* Common Styles

/* ================================================================== */

.section-head h2 { font: 30px/42px montserrat-bold, sans-serif; }
.desc { font: 14px/24px opensans-regular, sans-serif; }
.intro { font: 20px/36px opensans-light, sans-serif; }

/* Left clearing for flexible columns - columns that changes width in
different screen sizes. Makes columns with different heights align
properly.
--------------------------------------------------------------------- */
.first { clear: left; }   /* first column in default screen */
.m-first { clear: none; } /* first column in medium size screens */

/* ================================================================== */

/* Header Styles

/* ================================================================== */
	header {
		height: 54px;
		width: 100%;
		z-index: 99999;
		background: url(../images/k-opacity-70.png);
		position: fixed;
		top: 0;
		left: 0;
	}

/* Links */
	ul#nav li a {
	   display: block;
	   padding: 0 14px;
	   line-height: 54px;
		text-decoration: none;
	   text-align: left;
	   color: #fff;

		-webkit-transition: color .2s ease-in-out;
		-moz-transition: color .2s ease-in-out;
		-o-transition: color .2s ease-in-out;
		-ms-transition: color .2s ease-in-out;
		transition: color .2s ease-in-out;
	}

	ul#nav li a:active { background-color: transparent !important; }
	ul#nav li:hover > a,
	ul#nav li.active a { color: #11ABB0; }

/* ================================================================== */

/* Portfolio

/* ================================================================== */

	#portfolio {
	   background: #fff;
	   padding-top: 100px;
	   padding-bottom: 80px;
	}
	#portfolio .section-head h2 { color: #5994f2; }
	#portfolio .section-head p.desc { color: #999999; }
	#portfolio .section-head .intro { color: #A3A3A3; }

	/* Portfolio Content */
	#portfolio-wrapper { margin-top: 36px; }
	#portfolio-wrapper .col {
	   width: 50%;
	   margin-bottom: 36px;
	}

	.portfolio-item .item-wrap {
	   background: #fff;
	   overflow: hidden;

	   -webkit-box-shadow: 0px 1px 1px rgba(50, 50, 50, 0.1);
	   -moz-box-shadow:    0px 1px 1px rgba(50, 50, 50, 0.1);
	   box-shadow:         0px 1px 1px rgba(50, 50, 50, 0.1);

	   -webkit-transition: all 0.3s ease-in-out;
		-moz-transition: all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		-ms-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	.portfolio-item .item-wrap a { display: block; }
	.portfolio-item .portfolio-item-meta { padding: 12px 0; }
	.portfolio-item .portfolio-item-meta h5 a {
	   font: 13px/24px montserrat-bold, sans-serif;
	   color: #5994f2;
	   margin-left: 7%;
	}

/* ================================================================== */

/* Footer

/* ================================================================== */

	footer {
		color: #000;
		font-size: 14px;
		width: 100%;
		height: 50px;
		position: relative;
		bottom: 0;
	}
	footer a, footer a:visited { color: #0B686B; }
	footer a:hover, footer a:focus { color: #fff; }

	/* copyright */
	footer .copyright {
		margin: 0;
		padding: 0;
	 }
	footer .copyright li {
		display: inline-block;
		margin: 0;
		padding: 0;
		line-height: 24px;
	}
	.ie footer .copyright li {
	   display: inline;
	}
	footer .copyright li:before {
		content: "|";
		padding-left: 10px;
		padding-right: 10px;
		color: #095153;
	}
	footer .copyright  li:first-child:before {
		display: none;
	}

   /* contact section
   ----------------------------------------------------------------------- */
	#contact label {
		display: block;
		float: none;
		width: auto;
	}
	#contact input,
	#contact textarea,
	#contact select {
      width: 100%;
      margin-bottom: 30px;
	}
   #contact button.submit {
      margin-left: 0;
   }
   #message-warning,
   #message-success {
      width: 100%;
   }

   /* footer
   ------------------------------------------------------------------------ */
   footer .copyright li:before { content: none; }
   footer .copyright li { margin-right: 10px; }
   footer .copyright, footer .social-links {
      text-align: center;
      float: none;
   }
   footer .social-links { margin-top: 12px; }

}