.nav_bar{
	display:none
}
.nav_bar{
	font-size: 14px;
	color: #eed09f;
    font-family: tahoma,arial,sans-serif;
	padding-left: 10px;
	line-height: 29px;
	text-transform:uppercase;
}
#mcallus,#mlogo{
	display:none
}
#banner_container{
  border-top: 1px solid #5a5141;
  border-bottom: 1px solid #221a10;
  background: #e4d5bd url('images/banner_bg.jpg') 0 0 repeat-x;
  padding: 4px 0 2px 0px;
}
.metaslider{
	max-width: 99%!important
}
@media only screen and (max-width: 979px) {
	img{
		max-width:100%;
		height:auto
	}
	iframe{
		width:100%!important
	}
	.banner_slide,.topnav{
		width:100%
	}
	.banner_slideshow{
		width:33.333%;
		height:auto
	}
	#contact .input_wrapper,#contact .text_wrapper{
		width: 100%;
	}
	#contact .input_wrapper input[type="text"], #contact .input_wrapper input[type="email"]{
		width: 99%;
	}
	#contact .text_wrapper textarea{
		width: 99%;
	}
	#contact .submit{
		margin-right:0
	}
	.ourservices {
    	width: 50%;
	}
	.colour_chart {
		width: 45%;
		float: right;
	}
	#mcallus,#mlogo{
		display:block
	}
	#mlogo a:hover img{
		background:none;
		filter: alpha(opacity=100);
		-moz-opacity: 1;
		opacity: 1;
	}
	#callus,#logo{
		display:none
	}
	#mcallus{
	  font-size: 22px;
	  color: #f0debf;
	  font-family: Arial, Helvetica, sans-serif;
	  margin-top: 35px;
	  margin-right: 24px;
	  text-indent: 0;
	  text-align:right;
	  line-height: 30px;
	}
	#mcallus a{
		text-decoration:none;
		color: #f0debf;
		font-size: 22px;
	}
	#mcallus img{
		vertical-align:middle;
		margin-right:10px

	}
	.header_container{
		height:auto;
	}
	.sidebargallery .ngg-gallery-thumbnail img {
		margin: 4px 0 4px 1px !important;
	}

	.ngg-gallery-thumbnail img{
		width: 90% !important;
		margin: 4px 5% 4px 5% !important;
	}
}
@media only screen and (max-width: 767px) {
	#copyright {
		width: 100%;
		float: none;
		text-align: center;
	}
	#footer{
		height:auto
	}
	#footer #fmenu{
		float:none;
		width:100%
	}
	#fmenu ul{
		text-align:center;
		margin:0
	}
	#fmenu ul li{
		float:none;
		display:inline
	}
	#sidebar {
		width: 100%;
		float:none
	}
	.sidebargallery {
		width: 90%;
		padding: 2%;
		margin: 16px 3%;
		background: url("images/icon_enlarge.gif") no-repeat scroll 98% 10px #70644C;
		text-align: center;
	}
	.sidebargallery h2{
		background: url("images/title_gallery.gif") no-repeat scroll center 0px transparent;
		width:100%
	}
	.why {
		width: 90%;
		padding: 2%;
		margin: 16px 3%;
	}
	.why h2,#sidebar ul {
		text-align:center
	}
	#container  {
		padding: 12px 2.5% 8px 2.5% !important;
		width: 95%;
		float:none
	}
	.ngg-gallery-thumbnail-box {
		width: 45% !important;
		float: left;
		margin: 0px 2.5%;
	}
		.ngg-gallery-thumbnail {
		width: 100%;
		text-align: left;
		float: none;
	}
	#sidebar .ngg-gallery-thumbnail a {
		float:none
	}
	.sidebargallery .ngg-gallery-thumbnail img {
		width: 98% !important;
		margin: 4px 1% 4px 1% !important;
	}
	.ngg-galleryoverview {
		margin-left: 0px !important;
	}
	
}
@media only screen and (max-width: 979px) {
/* Navigation Button
-------------------------------------------------------- */
#menu-main-menu{
	display:none!important
}
.nav_bar{
	display:block
}
.nav-button {
	display: block;
	position: absolute;
	top: -4px;
	right: 0px;
	width: 50px;
	height: 35px;
	background: url(images/nav_img.png);
	background-position: center center;
	background-repeat: no-repeat;
	cursor: pointer;
	border: 0 none;
	border-radius: 5px;
	z-index: 999;
	text-indent: -9999px;
	margin:0;
	padding:0
}
.nav-button:hover {
	background:none;
	background: url(images/nav_img.png);
	background-position: center center;
	background-repeat: no-repeat;
	
}
.nav-button.open {
	background: url(images/close-icon-large.png);
	background: url(images/close-icon-large.png);
	background: url(images/close-icon-large.png);
	background: url(images/close-icon-large.png);
	background-position: center center;
	background-repeat: no-repeat;
}

/* Navigation Bar
-------------------------------------------------------- */
#menu-mobile-menu{
	float: none;
	display: block;
	height: 50px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	position: absolute;
	right: 0px;
	top: 30px;
	width: 100%;
	z-index: 998;
	clear: both;
}
div#wrapper_menu li {
	background:none;
}
#menu-mobile-menu li {
	padding: 0;
	margin: 0;
	display: none;
	width: 100%;
	border-bottom: 1px solid #ae9059;
	background:#282013;
}
#menu-mobile-menu li a,#menu-mobile-menu li.current-menu-item ul li a,#menu-mobile-menu li.current_page_parent ul li a,#menu-mobile-menu li.current-menu-ancestor ul li  a {
	display: block;
	width: 99%;
	font-size: 14px;
	text-decoration: none;
	padding-left:10px;
	font-size: 14px;
	color: #eed09f;
    font-family: tahoma,arial,sans-serif;
	text-transform: uppercase;
	font-weight:normal;
	background:none;
	text-indent: inherit;
	line-height: 30px;
}
#menu-mobile-menu li a:hover,#menu-mobile-menu li.current-menu-item a,#menu-mobile-menu li.current_page_parent a,#menu-mobile-menu li.current-menu-ancestor a,#menu-mobile-menu li.current-menu-item ul li.current-menu-item a,#menu-mobile-menu li.current_page_parent ul li.current-menu-item a,#menu-mobile-menu li.current-menu-ancestor ul li.current-menu-item a,#menu-mobile-menu li a.active {
	background:#382e1e;
	color:#d5ba8e
	
}
#menu-mobile-menu li.current_page_parent ul li a{
	/*background: #c4c4c4;	*/
}

#menu-mobile-menu > li:first-child {
	border-top: 1px solid #ae9059;
}

/* Toggle the navigation bar open  */

#menu-mobile-menu.open { 
	height: auto; 
	padding-top: 0px;
}
#menu-mobile-menu.open li { 
	display: block; 
}

/* Submenus – optional .parent class indicates dropdowns */

#menu-mobile-menu > li:hover > a {
	border-bottom-color: transparent;
}
#menu-mobile-menu li.parent > a:hover {
	background-color:#382e1e;
}
#menu-mobile-menu li ul {
	display: none;
	background: rgba(0,0,0,.5);
	border-top: 0 none;
	padding: 0;
}
#menu-mobile-menu li ul a {
	border: 0 none;
	font-size: 12px;
	padding: 0px 4%!important;
}
#menu-mobile-menu li ul li:last-child{
	border-bottom:none
}
#menu-mobile-menu li ul a:hover {
	border-bottom:none
}
#menu-mobile-menu li:hover ul {
	display: block;
	border-top: 0 none;
}
}
@media (min-width: 980px) and (max-width: 1024px) {

}
@media (min-width: 768px) and (max-width: 979px) {
.header_container, #nav_container,.wrapper_container{ 
	width:96%;
	position:relative;
}
#banner_container{
	width:96%;
}
#logo h1 a{
	width:50%
}
#callus{
	width:50%
}
#sidebar {
    width: 30%;
}
.why {
    width: 90%;
}
.sidebargallery {
    width: 88%;
}
#container {
    padding: 12px 2% 8px !important;
    width: 62%;
}
.contact_details{
	width:150px;
}
#contact_map{
	width:55%
}
#mlogo{
	float:left;
}
#mcallus{
	float:right;
}
}

@media (min-width: 600px) and (max-width: 767px) {
.header_container, #nav_container,#banner_container,.wrapper_container{ 
	width:96%;
	position:relative;
}
#contact_map {
    width: 68%;
}
.contact_details {
    width: 25%;
}
#mlogo{
	float:left;
}
#mcallus{
	float:right;
}

}



 @media (min-width:480px) and (max-width: 599px) {
.header_container, #nav_container,#banner_container,.wrapper_container{ 
	width:96%;
	position:relative;
}
#contact_map{
	width:100%
}
.contact_details{
	width:100%
}
#mlogo{
	float:none;
	text-align:center
}
#mcallus{
	float:none;
	text-align:center;
	margin-bottom:10px;
	margin-top:0
}

}
@media (min-width:320px) and (max-width: 479px) {
.header_container, #nav_container,#banner_container,.wrapper_container{ 
	width:92%;
	position:relative;
}
#container h2{
	line-height:22px
}
.ourservices {
	width: 100%;
	float:none
}
.colour_chart {
	width: 100%;
	float:none
}
#contact .input_wrapper input[type="text"], #contact .input_wrapper input[type="email"]{
	width: 97%;
}
#contact .text_wrapper textarea{
	width: 97%;
}
#contact_map{
	width:100%
}
.contact_details{
	width:100%
}
h2.welcome{
	width:100%;
	background-size: auto;
	background-size: contain;	
}
#mlogo{
	float:none;
	text-align:center
}
#mcallus{
	float:none;
	text-align:center;
	margin-bottom:10px;
	margin-top:0
}

}
@media (min-width:240px) and (max-width: 321px) {
.header_container, #nav_container,#banner_container,.wrapper_container{ 
	width:90%;
	position:relative;
}
#container h2{
	line-height:22px
}
.ourservices {
	width: 100%;
	float:none
}
.colour_chart {
	width: 100%;
	float:none
}
#contact .input_wrapper input[type="text"], #contact .input_wrapper input[type="email"]{
	width: 97%;
}
#contact .text_wrapper textarea{
	width: 97%;
}
#contact_map{
	width:100%
}
.contact_details{
	width:100%
}
h2.welcome{
	width:100%;
	background-size: auto;
	background-size: contain;	
}
#mlogo{
	float:none;
	text-align:center
}
#mcallus{
	float:none;
	text-align:center;
	margin-bottom:10px;
	margin-top:0
}
.sidebargallery .ngg-gallery-thumbnail img {
    width: 90% !important;
}
}