/*  #Mobile (Portrait)
================================================== */
/* Note: Design for a width of 320px */

@media only screen and (max-width: 767px) {

.container{
	width: 300px!important;
	margin: 0 auto
}
html, body, #main, #footer {
  min-width: 300px;
}

/* Header
---------------------------------------- */
#top-header {
	height:140px;
	}
#header{
	width:300px
}	
.socials {
  position: absolute;
  right: 112px;
  top: 90px;
}
.socials a {
  width: 20%;
}
	
/* Navigations
---------------------------------------- */

/* Primary navigation */
nav.primary {
  margin: 42px 0 0 0;
  padding: 23px 0 0;
  text-align: center;
  width: 100%;
  height: 43px;
}

nav.primary .responds{
	display: block;
	height: 43px;
	text-align: center;
	font-size: 26px;
	cursor:pointer;
	color: #325A83;
	font-family: 'TrajanProRegular';
	}
	.sf-menu {
	  line-height: 1;
	  width: 100%;
	  margin-top: 0px;
	  padding: 10px;
	  background: none;
	  background: #fff;
	  margin-left: -10px
	}
	#topnav{
		display: none;
		position: absolute;
		height: 305px;
		z-index: 9999
	}
	.sf-menu > li {
	  margin: 0;
	  text-align: center;
	  width: 100%;
	  padding-left: 0;
	  background: none
	}
	.sf-menu > li > a {
	  margin-left: 0;
	  text-align: center;
	  padding-left: 0;
	  margin-bottom: 3px
	}
	.sf-menu > li > a:hover {
	}
	.sf-menu ul {
	  background: #000;
	  min-width: 113px
	}
	.sf-menu ul li li {
	  min-width: 113px
	}
	.sf-menu ul li a{
		text-align: center;
		min-width: 113px;
		font-size: 16px;
		padding: 5px 15px
	}
	.sf-menu li:hover ul,
	.sf-menu li.sfHover ul {
		left:			18%;
		top:			43px; /* match top ul list item height */
		z-index:		99;
	}
	.sf-menu > li > a:hover,
		.sf-menu > li.sfHover > a,
		.sf-menu > li.current-menu-item > a{
			margin-top: 0px;
			height: 27px;
			}
	.sf-menu > li > span {
	  bottom: 10px;
	  display: block;
	  height: 2px;
	  left: 0;
	  position: absolute;
	  width: 100%;
	}
	
/* Logo */
.logo {
	width:100%;
	text-align:center;
	margin:25px 0 0 0;
	}
	.logo img{
		width:100px;
		height:auto;
		}
	.logo h1,
	.logo h2 {
		font-size:30px;
		}
		.logo .tagline {
			display:none;
			}
	
	/* Navigation select styling */
	select.mnav {
		width:80%;
		clear:both;
		margin:15px 0;
		}
		
	
	/* Top search */
	#top-search {
		margin-top:12px;
		}
	#top-search .input-search {
		width:130px;
		margin-right:0;
		}
	#top-search #submit {
		width:20px;
		height:20px;
		padding:0;
		background:url(../images/search-icon.gif) 0 0 no-repeat;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
		position:absolute;
		right:0;
		top:8px;
		}
	
	
	/* Header widget */
	#widget-header {
		padding:15px 0 15px 0;
		font-size:10px;
		text-align:center;
		}
		.widget-header li {
			padding:0 0 0 2px;
			}
	
	
	/* Slider
	---------------------------------------- */
	.flexslider-holder {
		}
		.flexslider-container {
		  height: 103px;
		}
/* Under Slider */
.under_slider {
  padding: 25px 0;
}
/* Under Slider */
.under-slider-holder .textwidget p,
.under-slider-holder h3 {
  width: 70%;
}

/* Carousel */	
.es-carousel-wrapper {
  position: relative;
  width: 270px;
}
.es-carousel {
  float: right;
  overflow: hidden;
  width: 270px;
}
.es-carousel ul li{
	width: 116px!important;
	margin-left: 13px
}
.es-carousel ul li a img {
  height: auto;
}
.overlay h2 {
  font-size: 14px;
  margin: 40px 0 0 14px!important
}
.text-styled {
  width: 100%;
  clear: both;
  padding-top: 20px
}
.text-styled p.moretext {
  margin-top: 0px;
}

.es-nav {
  left: 257px;
  position: absolute;
  top: 149px;
}
.read {
	white-space: nowrap; }
	
.divider_pos_right,
.divider_pos_left,
.divider{
	background: none
}	
	
	
	#content .indent {
		padding:0;
		}
	
	#before_content_area {
		margin:0;
		}
		#before_content h1 {
		  width: 290px;
		  margin-bottom: 20px
		}
	#home_content_area .indent {
		padding:0;
		}

	/* Content Home */
	.content_home {
	  padding: 10px 0 40px;
	  background: none;
	}
	.content_home .widget-area{
	}
	/* Flickr widget */
	.flickrImages a {
		width:49px;
		height:49px;
		}
	
	/* Request a quote */
	.box-text {
		width:100%;
		float:none;
		}
	.box-button {
		width:100%;
		float:none;
		text-align:center;
		padding-left:0;
		padding-right:0;
		}
		.box-button .button {
			float:none;
			}
	
	/* Post */
	.featured-thumbnail {
		float:none;
		margin:0 0 20px 0;
		}
		.featured-thumbnail img {
			width:94%;
			height:auto;
			margin-bottom: 20px
			}
	.featured-thumbnail .fright {
		float:none;
		clear:left;
		}
	.featured-thumbnail.large {
		width:auto;
		height:auto;
		margin:0 0 10px 0;
		}
	
	
	/* Single Team */
	.single-team .img-wrap img {
		width:auto;
		height:auto;
		float:left;
		margin:0 10px 5px 0;
		}
	.single-team .extra-wrap {
		display:inline;
		}
	
	
	/* Comments */
	.comment-meta {
		position:static;
		padding-bottom:1em;
		}
	.comment-author {
		padding-bottom:0;
		}
	
	#commentform input[type="text"],
	#commentform textarea {
		width:240px;
		max-width:240px;
		min-width:240px;
		}
	
	

	/* Latest Post */
				
	ul.latestpost li {
	}
/* Portfolio
---------------------------------------- */

/* Default layout 3 columns */
#gallery .portfolio li {
	width:-moz-min-content;
	float:none;
	margin-right:0;
	margin-bottom: 75px!important
	}
	#gallery .portfolio li a.image-wrap {
		width:275px;
		height:184px;
		}
	.zoom-icon {
		width:275px;
		height:184px;
		}
		#gallery .portfolio li img {
			width:100%;
			height:auto;
			}
			.line {
			  display: none
			}
			
/* 4 columns portfolio*/
#gallery.four_columns .portfolio li {
	width:100%;
	margin:0 0 30px 0;
	float:none;
	}
	#gallery.four_columns .portfolio li a.image-wrap {
		width:100%;
		height:255px;
		}
		#gallery.four_columns .portfolio li a img {
			width:100%;
			height:auto;
			}
	#gallery.four_columns .zoom-icon {
		width:100%;
		height:255px;
		}

/* 2 columns portfolio*/
#gallery.two_columns .portfolio li {
	width:100%;
	margin-right:0;
	}
	#gallery.two_columns .portfolio li a.image-wrap {
		width:290px;
		height:157px;
		}
	#gallery.two_columns .zoom-icon {
		width:290px;
		height:157px;
		}

/* Carousel */
.es-carousel ul li h4 {
	display:none;
	}
.es-carousel ul li .excerpt {
	display:none;
	}
.es-carousel ul li .link {
	display:none;
	}	
.extra-wrap {
  display: inline;
}
.latestpost li div.extra-wrap {
  display: block;
  margin-bottom: 8px;
}
	
/* Google map */
#map {
	width:265px;
	height:265px;
	}
	
/* Contact form */
.wpcf7-form p.field input {
	width:245px;
	}
.wpcf7-form textarea {
	float:left;
	width:246px;
	max-width:246px;
	min-width:246px;
	}
.wpcf7-not-valid-tip {
	width:255px !important;
	position:absolute;
	left:0 !important;
	top:0 !important;
	padding:4px 0 4px 10px !important;
	background:#f3b7b7 !important;
	color:red !important;
	border:1px solid red !important;
	}
		
	
/* Footer
---------------------------------------- */
#widget-footer h4{
	margin-top: 20px!important
}
.logo-foot{
	height: 100px
}
}