
/* -------------------------- Responsive --------------------------- */

nav#rwdnav {
	display: none;
}

a.navi_toggle {
	display: none;
    width: 38px;
    height: 32px;
    position: absolute;
    right: 20px;
    top: 33px;
	-webkit-transition: all 0.25s ease-out;
	   -moz-transition: all 0.25s ease-out;
	     -o-transition: all 0.25s ease-out;
		 	transition: all 0.25s ease-out;
    background: url(../img/navi_toggle.png);
    z-index: 100;
}

nav#rwdnav_inner {
	height: 100% !important;
	position: relative;
}

/* ---------- width < 990px ---------- */

@media screen and (max-width: 990px) {
	
	div#page_wrap {
		width: auto;
	}
	
	div#subnavigation,
	div#navigation,
	div#metanavigation {
		display: none;
	}
	
	div#page_wrap {
		margin: 0 0 20px 0;
		padding: 0;
	}
	
	header {
		padding: 20px 20px 15px;
		margin: 0;
	}
	
	div#header_image img {
		width: 100%;
		height: auto;
	}
	
	div#page {
		border: none;
		box-shadow: none;
	}
	
	div#siteframe {
		padding: 37px 20px 0 20px;
	}
	
	div.listing_entry_detail div#listing_entry_content {
		overflow: hidden;
	}
	
	footer {
		padding: 36px 20px 55px 20px;
	}

	
	a.navi_toggle {
		display: block;
	}
		
	nav#rwdnav {
		display: block !important;
		visibility: hidden;
		position: fixed;
		top: 0;
		right: 0;
		z-index: 90;
		margin: 0;
		padding: 0;
		width: 60%;
		height: 100%;
		opacity: 1;
		background: #333 none;
		box-shadow: inset 10px 0 10px -8px #000;
		-webkit-box-shadow: inset 10px 0 10px -8px #000;
		overflow: hidden;
		transform: translate3d(100%,0,0);
		-webkit-transform: translate3d(100%,0,0);
		-moz-transform: translate3d(100%,0,0);
		-ms-transform: translate3d(100%,0,0);
		-o-transform: translate3d(100%,0,0);
		transition: all 0.25s ease-out;
		-webkit-transition: all 0.25s ease-out;
		-moz-transition: all 0.25s ease-out;
		-o-transition: all 0.25s ease-out;
	}
	
	div#page_wrap {
		position: relative;
		z-index: 30;
		transition: all 0.25s ease-out;
		-webkit-transition: all 0.25s ease-out;
		-moz-transition: all 0.25s ease-out;
		-o-transition: all 0.25s ease-out;
	}
	
	.navi_open nav#rwdnav {
		visibility: visible;
		opacity: 1;
		-webkit-transform: translate3d(0,0,0);
		   -moz-transform: translate3d(0,0,0);
		   	-ms-transform: translate3d(0,0,0);
		   	 -o-transform: translate3d(0,0,0);
		   	 	transform: translate3d(0,0,0);
	}
	
	nav#rwdnav .rwdnav_inner {
		min-height: 100%;
		position: relative;
	}
		
	.navi_open div#page_wrap {
		-webkit-transform: translate3d(-60%,0,0);
		   -moz-transform: translate3d(-60%,0,0);
		   	-ms-transform: translate3d(-60%,0,0);
		   	 -o-transform: translate3d(-60%,0,0);
		   	 	transform: translate3d(-60%,0,0);
	}
	
	nav#rwdnav ul ul,
	nav#rwdnav ul ul ul,
	nav#rwdnav ul ul ul ul {
		display: none !important;
	}
	
	nav#rwdnav ul,
	nav#rwdnav ul .current > ul,
	nav#rwdnav ul .current > ul .current > ul {
		display: block !important;
	}
	
	nav#rwdnav ul,
	nav#rwdnav ul li,
	nav#rwdnav ul li ul {
		margin: 0;
		padding: 0;
		list-style: none;
		display: block;
		border: none;
	}
	
	nav#rwdnav ul li a {
		color: #fff;
		padding: 5px 15px;
		margin: 0;
		display: block;
		text-decoration: none;
		font: normal 18px/34px Arial, sans-serif;
		border-top: 1px solid #454545;
	}
	
	nav#rwdnav ul li:last-child {
		display: none;
	}
	
	nav#rwdnav ul li.current ul li a:hover,
	nav#rwdnav ul li ul li a:hover,
	nav#rwdnav ul li a:hover {
		color: #7680d5;
	}
		
	nav#rwdnav ul li.current a {
		font-weight: normal;
		font-family: Arial, sans-serif;
		background: #6670C5 none;
		border-color: #6670C5;
	}
	
	nav#rwdnav ul li.current a:hover {
		color: #fff;
	}
	
	nav#rwdnav ul li.current ul li a {
		font-size: 16px;
		color: #ccc;
		line-height: 24px;
		padding: 5px 20px;
		font-weight: normal;
		background: #444 none; 
		border-top: 1px solid #565656;
	}
	
	nav#rwdnav ul li.current ul li.current a {
		font-weight: normal;
		font-family: Arial, sans-serif;
		color: #7680d5 !important;
	}

	nav#rwdnav ul li.current ul li.current ul li a {
		font-size: 15px;
		font-family: Arial, sans-serif;
		position: relative;
		padding-left: 30px;
		opacity: 0.7;
	}
	
	nav#rwdnav ul li.current ul li.current ul li.current a {
		opacity: 1;
	}
}

/* ---------- width < 780px ---------- */

@media screen and (max-width: 780px) {
	
	footer div#contact,
	footer div#indual {
		width: 50%;
	}
	
	footer div#contact ul li {
		width: 100%;
	}
	
	.tour iframe {
		height: 400px;
	}
		
}

/* ---------- width < 770px ---------- */

@media screen and (max-width: 770px) {
	
	div#siteframe {
		padding-bottom: 0;
	}
	
	div#content_left {
		float: none;
		width: auto;
		margin: 0;
		padding: 0;
	}
	
	div#content_left #portlets_left {
		margin: 10px 0 0 0;
		padding: 20px 0 0 0;
		border-top: 1px solid #ddd;
	}
	
	div#content_left div.portlet {
		width: 48%;
		margin: 0 3% 15px 0;
		float: left;
	}
		
	div#content_left div.portlet_index_10,
	div#content_left div.portlet_index_8,
	div#content_left div.portlet_index_6,
	div#content_left div.portlet_index_4,
	div#content_left div.portlet_index_2 {
		margin: 0 0 15px 0;
	}
	
	div#portlets div.portlet + div.portlet {
		margin-top: 0;
	}
	
	div#content_left div.portlet div.pictures {
		margin-bottom: 15px;
	}
	div#content_left div.portlet div.picture {
		margin: 10px 0 0 0;
	}
	
	div#content_left div.portlet div.picture,
	div#content_left div.portlet div.picture img {
		width: 100%;
		height: auto;
	}
	div#content div.resource_container.standard div.picture,
	div#content div.resource_container.gallery div.picture {
		width: 50%;
	}
}


/* ---------- width < 840px ---------- */

@media screen and (max-width: 840px) {
	
	div#module_mailform div.mailform_element textarea, 
	div#module_mailform div.mailform_element input {
		width: 70%;
		box-sizing: border-box;
	}
	
	div#mailform_submit_button label,
	div#module_mailform div.mailform_element label {
		width: 28%;
	}
	div#module_mailform .mailform_element.checkbox_field p {
		width: 70%;
		box-sizing: border-box;
	}
	
}


/* ---------- width < 550px ---------- */

@media screen and (max-width: 550px) {
	
	div#content_left div.portlet {
		width: 100%;
		margin: 0 0 30px 0;
	}
	
	div.gmap-map div#module_map,
	div.gmap-map {
		height: 250px !important;
		-webkit-transition: all 0.25s ease-out;
		   -moz-transition: all 0.25s ease-out;
		     -o-transition: all 0.25s ease-out;
			 	transition: all 0.25s ease-out;
	}	
	
	div#mailform_submit_button label,
	div#module_mailform div.mailform_element label,	
	div#module_mailform div.mailform_element textarea, 
	div#module_mailform div.mailform_element input {
		width: 98%;
	}
	div#module_mailform .mailform_element.checkbox_field p {
		width: 100%;
	}
	
	div#mailform_submit_button label {
		display: none;
	}	
	
	div.listing_entry_detail_pictures div.resource_container,
	div.module-listing div.listing_entry div.resource_container,
	div#module_overview div.overview_item div.resource_container {
		width: 100%;
		float: none;
		clear: both;
		margin: 20px 0 10px 0;
	}
	
	div#content div.module-listing div.listing_entry div.resource_container div.picture img,
	div#module_overview div.overview_item_with_picture div.resource_container div.picture img {
		width: 100% !important;
		height: auto !important;
	}
		
	div#content div.module-listing div.listing_entry div.resource_container {
		margin: 5px 0 0 0;
	}
	
	div#content div.listing_entry_detail_pictures div.resource_container {
		margin: 0;
	}
	
	div#content div.listing_entry_detail_pictures div.resource_container div.picture,
	div#content div.listing_entry_detail_pictures div.resource_container img,
	div.module-listing div.listing_entry div.resource_container div.picture,
	div.module-listing div.listing_entry div.resource_container img,
	div#module_overview div.overview_item div.resource_container div.picture,
	div#module_overview div.overview_item div.resource_container img {
		width: 100%; 
		height: auto;
	}	
	
	.tour iframe {
		height: 300px;
	}
	
	#privacy_banner #privacy_banner_inner #privacy_description {
		padding-right: 0;
	}
	#privacy_banner #privacy_banner_inner .button {
		position: relative;
		top: auto;
		margin-top: 15px;
		right: auto;
		float: none;
		display: block;
		text-align: center;
	}
	
}

/* ---------- width < 430px ---------- */

@media screen and (max-width: 430px) {
	
	footer {
		padding: 36px 20px 20px 20px;
	}
	
	footer div#contact,
	footer div#indual {
		width: auto;
		float: none;
	}
	
	footer div#contact {
		margin: 20px 0 0 0;
	}
	
	div#content div.resource_container.standard div.picture,
	div#content div.resource_container.gallery div.picture {
		width: 100%;
		padding: 0 0 10px 0;
	}
	div#content div.resource_container.gallery,
	div#content div.resource_container.standard {
		margin: 30px 0 5px 0;
	}
	
	.tour iframe {
		height: 250px;
	}
}


/* ---------- width < 390px ---------- */

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

	a.navi_toggle {
		top: 29px;
	}

	header div#logo img {
		width: 220px;
		height: auto;
	}
}
