/* ----------------------------------------------------------------------------------------------------

CSSGrid is a Responsive CSS Grid designed to work on web and mobile devices. (www.cssgrid.co)
Please don't steal. Support this grid and buy a license from: http://codecanyon.net/item/responsive-css-grid/4928861

---------------------------------------------------------------------------------------------------- */

.animate { /* Move the content off screen while loading */
	-webkit-transform: translateX(400px);
	transform: translateX(400px);
}
.padding-bottom {
	padding-bottom:20px;
}

.linetop {
	width:302px;
}

.iosSlider {
	width:302px;
	height:164px;
}
.iosSlider .slider .slide {
	width:302px;
	height:164px;
}

.mapbottom {
	width:100%;
	height:150px;
}
.maps-google {
	width:100%;
	height:300px;
	background-color:#444;
	margin-bottom:30px;
}

.social-right {
	color:#595959;
	float:none;
	padding-bottom:15px;
}
.recent a span {
	line-height:22px;
}
.title {
	font-size:15px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #000;
	height:26px;
	margin:0 auto;
	padding-top:10px;
	padding-bottom:10px;
}

.contact-form li input {
	color:#000 !important;
	font-size:14px;
	font-weight:normal;
	list-style:none;
	background-color: #e7e8e8;
	border: 1px solid #e7e8e8;
	padding-top:10px;
	padding-bottom:6px;
	padding-left:4px;
}
.contact-form li input {
	width:294px;
}

li textarea {
	font-size:14px;
	color:#000;
	height:110px;
	margin-bottom:5px;
	list-style:none;
	color:#000 !important;
	font-size:15px;
	font-weight:normal;
	list-style:none;
	background-color: #e7e8e8;
	border: 1px solid #e7e8e8;
	padding-top:10px;
	padding-bottom:8px;
	padding-left:4px;
	width:96%;
}


.contact-form li .error-message {
	display:none;
	font-size:13px;
	color:#ff4040;
	font-weight:normal;
	margin-left:0px;
	padding-top:5px;
	line-height:18px;
	background-color:#fff;
}

.contact-form .submitbutlogin {
	background-color:#e7e8e8;
	color:#000;
	float:none;
	font-size:14px;
	padding-top:8px;
	padding-bottom:8px;
	padding-left:10px;
	padding-right:10px;
	margin-top:0px;
	line-height:38px;
	border:0px;
	transition: background-color .20s ease;
	-moz-transition: background-color .20s ease;
	-webkit-transition: background-color .20s ease;
	opacity: 1.0;
}
.contact-form .submitbutlogin:hover {
	background-color:#111;
	color:#fff;
}

.contact-form li .field-newsletter {
	width:290px;
}
.contact-form li .field-contact {
	width:290px;
}
.contact-form li .field-contact-right {
	width:290px;
}
li textarea {
	height:101px;
}


.keyline a img {
	border: 1px solid #000;
	width:300px;
	height:auto;
	margin-bottom:1px;
}


h1 {
	font-size:20px;
	line-height:26px;
	margin-bottom:20px;
}
h2 {
	font-size:18px;
	line-height:24px;
}
h2 span {
	border-bottom-width: 0px;
	border-bottom-style: solid;
	border-bottom-color: #fff;
}
.box-black {
	width:272px;
	padding-top:15px;
	padding-bottom:15px;
	padding-left:15px;
	padding-right:15px;
	margin-bottom:10px;
}
ul.nav-sub {
	float:none;
	margin-bottom:20px;
}
.text-rightside {
	margin-left:0px;
	padding:0px;
	font-size:15px;
}
.text-rightside p {
	font-size:15px;
	padding:0px;
	padding-right:10px;
	margin-top:0px;
	margin-bottom:10px;
	color:#000;
}

/* Portfolio Items */

.portfolio-list {
	margin:0px;
	padding:0px;
	list-style:none;
}
.products .heading-2nd {
	font-size:14px;
	margin-top:0px;
	margin-bottom:10px;
	font-family:"archivo_narrowbold", Arial, Helvetica, sans-serif;
	font-weight:normal;
}
.project-space {
	height:30px;
}

a li.item {
	float:left;
	margin-top:0px;
	margin-left:5px;
	margin-right:5px;
	width:147px;
	height:229px;
}
.itemimg {
	width:147px;
	height:147px;
	overflow:hidden;
	position:absolute;
	background-size: cover;
	-webkit-background-size: cover;
	-o-background-size: cover;
	-moz-background-size: cover;
	background-color:#ccc;
}
a:hover .thumb-under {
	border-top-width: 3px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #999;
	border-bottom-color: #999;
}
a .thumb-under {
	-o-transition:.2s;
	-ms-transition:.2s;
	-moz-transition:.2s;
	-webkit-transition:.2s;
	transition:.2s;
	opacity: 1.0;
	text-decoration:none;
	width:147px;
	height:63px;
	margin-top:154px;
	position:absolute;
	border-top-width: 3px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #000;
	border-bottom-color: #000;
}
.thumb-under-heading {
	font-family:"archivo_narrowbold", Arial, Helvetica, sans-serif;
	font-weight:normal;
	line-height:18px;
	color:#000;
	font-size:14px;
	padding-top:5px;
}
.thumb-under-details {
	font-family:"archivo_narrowbold", Arial, Helvetica, sans-serif;
	font-weight:normal;
	line-height:17px;
	color:#888;
	font-size:12px;
	padding-top:0px;
}

li.keyline {
	float:left;
	padding-top:0px;
	padding-left:4px;
	padding-right:4px;
	padding-bottom:3px;
	width:147px;
}
li.keyline a img {
	width:145px;
	height:145px;
	border: 1px solid #000;
}


.menu-products li {
	color:#666;
	font-size:13px;
	border:0px;
	list-style:none;
	line-height:16px;
	padding:0px;
	margin:0px;
	margin-bottom:6px;
}
.menu-products li a {
	color:#595959;
	font-size:11px;
	list-style:none;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #fff;
}
.menu-products li a.current {
	color:#000;
	font-size:11px;
	border:0px;
	list-style:none;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #999;
}

.project-description {
	padding-right:0px;
}
.two-images {
	margin-bottom:0px;
	margin-top:10px;
}
.two-images-left {
	width:146px;
	float:left;
}
.two-images-right {
	width:146px;
	margin-left:156px;
}
.two-images-left.keyline img {
	width:144px;
	border: 1px solid #000 !important;
}
.two-images-right.keyline img {
	width:144px;
	border: 1px solid #000 !important;
}

.next,
.previous {
	padding-top:13px;
	padding-bottom:15px;
}


/* Contact Submit Form */

.specialkey {
	width:99%;
}



/*
	Columns Fixed (f)
*/

.f1
{
	padding-bottom:0px;
}
.f2,
.f3
{
	padding-bottom:0px;
}
.f4
{
	padding-bottom:0px;
}
.f5 {
	padding-bottom:3px;
}
.f6 {
	padding-bottom:4px;
}
.f7 {
	padding-bottom:6px;
}
.f8 {
	padding-bottom:2px;
}


.f1, /* wrapper width */
.f2,
.f3,
.f4,
.f5,
.f6,
.f7,
.f8 {
	width:302px;
}


.f1 .one {
	width:100%;
}


.f2 .one {
	width:146px;
	float:left;
}
.f2 .two {
	width:146px;
	/*
	To set the correct position for the last column, add up all columns to the left and add on the padding.
	In this case: 146 + 10 = 156
	*/
	margin-left:156px;
}


.f3 .one {
	width:96px;
	float:left;
}
.f3 .one-two {
	width:199px;
	margin-left:0px;
	float:left;
}
.f3 .two {
	width:96px;
	margin-left:7px;
	float:left;
}
.f3 .two-three {
	width:199px;
	margin-left:103px;
}
.f3 .three {
	width:96px;
	/*
	To set the correct position for the last column, add up all columns to the left and add on the padding.
	In this case: 96 x 2 + 7 + 7 = 206
	*/
	margin-left:206px;
}

/* Custom grid for work section */
.f3 .one-project {
	width:100%;
	height:auto;
	float:none;
	margin-top:15px;
	margin-bottom:20px;
}
.f3 .two-three-project {
	width:auto;
	height:auto;
	margin-left:0px;
	margin-top:0px;
}
.f3 .one-news {
	width:100%;
	height:auto;
	float:none;
	margin-top:15px;
	margin-bottom:10px;
}
.space37 {
	height:15px;
}


.f4 .one {
	width:71px;
	float:left;
}
.f4 .one-two {
	width:148px;
	float:left;
}
.f4 .one-three {
	width:225px;
	float:left;
}
.f4 .two {
	width:71px;
	margin-left:6px;
	float:left;
}
.f4 .two-three {
	width:148px;
	margin-left:6px;
	float:left;
}
.f4 .two-four {
	width:225px;
	margin-left:77px;
}
.f4 .three {
	width:71px;
	margin-left:6px;
	float:left;
}
.f4 .three-four {
	width:148px;
	margin-left:154px;
}
.f4 .four {
	width:71px;
	margin-left:231px;
}

/* Custom grid for work section */
.f4-products {
	width:310px;
	margin:0 auto;
}
.f4-products .one {
	width:100%;
	float:none;
	margin-left:4px;
	margin-bottom:0px;
	padding:0px;
}
.f4-products .two-four {
	width:314px;
	margin-left:0px;
}

.column-first {
	float:left;
	width:48%;
}
.column-second {
	margin-left:50%;
}


.f5 .one {
	width:58px;
	float:left;
}
.f5 .one-two {
	width:119px;
	float:left;
}
.f5 .one-three {
	width:180px;
	float:left;
}
.f5 .one-four {
	width:241px;
	float:left;
}
.f5 .two {
	width:58px;
	float:left;
	margin-left:3px;
}
.f5 .two-three {
	width:119px;
	float:left;
	margin-left:3px;
}
.f5 .two-four {
	width:180px;
	margin-left:3px;
	float:left;
}
.f5 .two-five {
	width:241px;
	margin-left:61px;
}
.f5 .three {
	width:58px;
	float:left;
	margin-left:3px;
}
.f5 .three-five {
	width:180px;
	margin-left:122px;
}
.f5 .four {
	width:58px;
	float:left;
	margin-left:3px;
}
.f5 .four-five {
	width:119px;
	margin-left:183px;
}
.f5 .five {
	width:58px;
	margin-left:244px;
}


.f6 .one {
	width:47px;
	float:left;
}
.f6 .one-two {
	width:98px;
	float:left;
}
.f6 .one-three {
	width:149px;
	float:left;
}
.f6 .one-four {
	width:200px;
	float:left;
}
.f6 .one-five {
	width:251px;
	float:left;
}
.f6 .two {
	width:47px;
	float:left;
	margin-left:4px;
}
.f6 .two-three {
	width:98px;
	float:left;
	margin-left:4px;
}
.f6 .two-four {
	width:149px;
	float:left;
	margin-left:4px;
}
.f6 .two-five {
	width:200px;
	float:left;
	margin-left:4px;
}
.f6 .two-six {
	width:251px;
	margin-left:51px;
}
.f6 .three {
	width:47px;
	float:left;
	margin-left:4px;
}
.f6 .three-four {
	width:98px;
	float:left;
	margin-left:4px;
}
.f6 .three-five {
	width:149px;
	float:left;
	margin-left:4px;
}
.f6 .three-six {
	width:200px;
	margin-left:102px;
}
.f6 .four {
	width:47px;
	float:left;
	margin-left:4px;
}
.f6 .four-five {
	width:98px;
	float:left;
	margin-left:4px;
}
.f6 .four-six {
	width:149px;
	margin-left:153px;
}
.f6 .five {
	width:47px;
	float:left;
	margin-left:4px;
}
.f6 .five-six {
	width:98px;
	margin-left:204px;
}
.f6 .six {
	width:47px;
	margin-left:255px;
}


.f7 .one {
	width:38px;
	float:left;
}
.f7 .one-two {
	width:82px;
	float:left;
}
.f7 .one-three {
	width:126px;
	float:left;
}
.f7 .one-four {
	width:170px;
	float:left;
}
.f7 .one-five {
	width:214px;
	float:left;
}
.f7 .one-six {
	width:258px;
	float:left;
}
.f7 .two {
	width:38px;
	float:left;
	margin-left:6px;
}
.f7 .two-three {
	width:82px;
	float:left;
	margin-left:6px;
}
.f7 .two-four {
	width:126px;
	float:left;
	margin-left:6px;
}
.f7 .two-five {
	width:170px;
	float:left;
	margin-left:6px;
}
.f7 .two-six {
	width:214px;
	float:left;
	margin-left:6px;
}
.f7 .two-seven {
	width:258px;
	margin-left:44px;
}
.f7 .three {
	width:38px;
	float:left;
	margin-left:6px;
}
.f7 .three-four {
	width:82px;
	float:left;
	margin-left:6px;
}
.f7 .three-five {
	width:126px;
	float:left;
	margin-left:6px;
}
.f7 .three-six {
	width:170px;
	float:left;
	margin-left:6px;
}
.f7 .three-seven {
	width:214px;
	margin-left:88px;
}
.f7 .four {
	width:38px;
	float:left;
	margin-left:6px;
}
.f7 .four-five {
	width:82px;
	float:left;
	margin-left:6px;
}
.f7 .four-seven {
	width:170px;
	margin-left:132px;
}
.f7 .five {
	width:38px;
	float:left;
	margin-left:6px;
}
.f7 .five-seven {
	width:126px;
	margin-left:176px;
}
.f7 .six {
	width:38px;
	float:left;
	margin-left:6px;
}
.f7 .six-seven {
	width:82px;
	margin-left:220px;
}
.f7 .seven {
	width:38px;
	margin-left:264px;
}


.f8 .one {
	width:36px;
	float:left;
}
.f8 .one-two {
	width:74px;
	float:left;
}
.f8 .one-three {
	width:112px;
	float:left;
}
.f8 .one-four {
	width:150px;
	float:left;
}
.f8 .one-five {
	width:188px;
	float:left;
}
.f8 .one-six {
	width:226px;
	float:left;
}
.f8 .one-seven {
	width:264px;
	float:left;
}
.f8 .two {
	width:36px;
	float:left;
	margin-left:2px;
}
.f8 .two-three {
	width:74px;
	float:left;
	margin-left:2px;
}
.f8 .two-four {
	width:112px;
	float:left;
	margin-left:2px;
}
.f8 .two-five {
	width:150px;
	float:left;
	margin-left:2px;
}
.f8 .two-six {
	width:188px;
	float:left;
	margin-left:2px;
}
.f8 .two-seven {
	width:226px;
	float:left;
	margin-left:2px;
}
.f8 .two-eight {
	width:264px;
	margin-left:38px;
}
.f8 .three {
	width:36px;
	float:left;
	margin-left:2px;
}
.f8 .three-four {
	width:74px;
	float:left;
	margin-left:2px;
}
.f8 .three-five {
	width:112px;
	float:left;
	margin-left:2px;
}
.f8 .three-six {
	width:150px;
	float:left;
	margin-left:2px;
}
.f8 .three-seven {
	width:188px;
	float:left;
	margin-left:2px;
}
.f8 .three-eight {
	width:226px;
	margin-left:76px;
}
.f8 .four {
	width:36px;
	float:left;
	margin-left:2px;
}
.f8 .four-five {
	width:74px;
	float:left;
	margin-left:2px;
}
.f8 .four-six {
	width:112px;
	float:left;
	margin-left:2px;
}
.f8 .four-seven {
	width:150px;
	float:left;
	margin-left:2px;
}
.f8 .four-eight {
	width:188px;
	margin-left:114px;
}
.f8 .five {
	width:36px;
	float:left;
	margin-left:2px;
}
.f8 .five-six {
	width:74px;
	float:left;
	margin-left:2px;
}
.f8 .five-seven {
	width:112px;
	float:left;
	margin-left:2px;
}
.f8 .five-eight {
	width:150px;
	margin-left:152px;
}
.f8 .six {
	width:36px;
	float:left;
	margin-left:2px;
}
.f8 .six-seven {
	width:74px;
	float:left;
	margin-left:2px;
}
.f8 .six-eight {
	width:112px;
	margin-left:190px;
}
.f8 .seven {
	width:36px;
	float:left;
	margin-left:2px;
}
.f8 .seven-eight {
	width:74px;
	margin-left:228px;
}
.f8 .eight {
	width:36px;
	margin-left:266px;
}