/*
Theme Name: Hotel San Marco
Theme URI: http://www.pixelbiteweb.com
Description: This theme is developed for Hotel Rex Florence.
Author: PixelbiteWT
Author URI: http://www.pixelbiteweb.com
Version: 1.0
Tags: responsive, white, gridbase 

License: Attribution-ShareAlike 3.0 Unported (CC BY-SA 3.0)
License URI: http://creativecommons.org/licenses/by-sa/3.0/

*/
@import url('inc/css/base.css'); 
@import url('inc/css/grid.css');
@import url('inc/nav/demo.css');
@import url('inc/css/polyglot-language-switcher-2.css');


#nav-wrap { background:#37342f; height:50px; width:100%; position:relative; z-index:2000;}
#navigation { height:50px;}
#banner-wrap { position:relative;}
#language { padding-top:10px;}
#form-wrap { position:absolute; top:5%; left:6%; z-index:1000; background: rgba(0,0,0,0.5); width:210px;}
#logo { background:#2f2c27; padding:15px; text-align:center; margin-bottom:10px;}

#sp-wrap { background:#444035; padding:60px 0; text-align:center;}
#sp-wrap h1 { color:#fff; text-align:left;}
.sp-wrap-img {
	padding: 100px 0; 
	background-size:cover;
	-webkit-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-repeat:no-repeat;
	background-position:0 0;
	text-align:center;
	margin-bottom:20px;
}
#sp-wrap p { text-align:left; color:#fff; margin-bottom:0px;}
#sp-wrap a { text-decoration:underline; color:#fff;}

#about-wrap { 
	padding: 130px 0; 
	background-size:cover;
	-webkit-background-size:cover;
	-ms-background-size:cover;
	-o-background-size:cover;
	background-repeat:no-repeat;
	background-position:0 0;
	background-attachment:fixed;
	text-align:center;
	position:relative;
}
#about-wrap h1 { padding:1% 0; text-align:center; color:#fff; font-size:28px;}
#about-wrap p { color: #fff; font-size:16px; line-height:24px; text-align:center; padding:0 20%;}

#feature-wrap { padding:60px 0;}
#feature-wrap p { text-align:justify; padding:0 5%;}
#feature-wrap p a { text-decoration:underline;}
#feature-wrap h1 { text-align:center; padding:1% 0;}
.f-img { width:170px; height:170px; margin:10px auto; text-align:center; -webkit-border-radius:50%; -moz-border-radius:50%; -o-border-radius:50%; border-radius:50%; overflow:hidden;}

#footer-wrap { background:#5a5349; padding:30px 0; color:#fff; border-bottom:10px solid #37342f;}
#footer-wrap h1 { color:#fff; font-size:20px;}
#footer-wrap a { color:#fff; display:block; padding:3px 0;}
#footer-wrap a i {width:24px;}

#inner-wrap { padding:50px 0; border-top:10px solid #37342f;}
#inner-wrap h1 { color:#A08D6A; font-size:24px; margin-bottom:15px;}
#inner-wrap h1 i { margin-right:5px;}
#inner-wrap p { text-align:justify;}
#inner-wrap p a { text-decoration:underline;}


#distance-wrap { background:#5a5349; padding:30px 0; text-align:left;}
#distance-wrap h1 { color:#fff; text-align:left; line-height:normal}
#distance-wrap p { text-align:left; color:#fff; padding:0 0%; margin-bottom:0px;}
#location { margin-bottom:50px;}
.location-block { text-align:left;}
.location-block h2 { font-size:18px; line-height:normal; margin-bottom:10px; color:#A08D6A;}
.location-block p { text-align:left !important;}

.gallery { }
.gthumb { height:190px; margin-bottom:8%; overflow:hidden; width:100%;}

.list ul li { list-style-type: none; padding:3px 0; background: url(inc/images/point.jpg) 0 11px no-repeat; padding-left:12px; }



#booking { width:90%; margin:0 auto;}
#booking p { display:block; text-align:center; font-size:24px; font-weight:600; color: #fff;}

#breadcrumb { text-transform:uppercase; padding:0; margin-bottom:20px; font-size:12px;}
#breadcrumb a:hover { text-decoration:underline; }
#breadcrumb a::after {
	content: "\00bb";
	padding:0 8px;
	display: inline-block;
	text-decoration: none;
}

#booking input[type=text] { padding: 5%; width:90%; font-size:14px; color:#222; background:#fff; border:0px; -webkit-border-radius:3px; -moz-border-radius:3px; -o-border-radius:3px; border-radius:3px; margin-bottom:8px;}
#booking select { padding: 5%; width:100%; font-size:14px; color:#222; background:#fff; border:0px; -webkit-border-radius:3px; -moz-border-radius:3px; -o-border-radius:3px; border-radius:3px; margin-bottom:8px;}

#booking input[type=submit] { padding: 5%; width:100%; font-size:14px; color:#000; background:#c7b18a; border:0px; -webkit-border-radius:3px; -moz-border-radius:3px; -o-border-radius:3px; border-radius:3px; cursor:pointer; margin-bottom:15px;}
#booking input[type=submit]:hover { color:#c7b18a; background:#000;}

.date_picker {
	position:relative;
}
.ui-datepicker-trigger {
	position: absolute;
	right: 8px;
	top: 30%;
	cursor:pointer;
}

.google-maps {
	position: relative;
	padding-bottom: 30%; /*This is the aspect ratio*/
	height: 0;
	overflow: hidden;
}
.google-maps iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}
.grid_2.omega img {
  max-width: 100%;
  height: auto;
}

/* Larger than standard 1024 (devices and browsers) */
@media only screen and (min-width: 1280px) {


}

/* Larger than standard 1024 (devices and browsers) */
@media only screen and (min-width: 1024px) and (max-width: 1279px) {
	
		
}

/* Smaller than standard 1024 (devices and browsers) */
@media only screen and (max-width: 1024px) {
	
	
	
	#nav-wrap { position:relative;}
	#navigation { position:absolute; top:0; left:0;}
	#navigation .grid_10 { width:100%;}
	#banner-wrap { position:relative;}
	#language { padding-top:10px;}

	#banner-wrap { position:relative;}
	#form-wrap { position:inherit; left:0; bottom:0; width:90%; padding:0 5%; background: #2f2c27; overflow:hidden;}
	#logo { width:21%; float:left; margin:0;}
	#booking { width:70%; float:right; padding: 2.5%; margin:0;}
	#booking .one-third { float:left; width:32%; margin: 0 1.3% 0 0; display: block;}
	#booking select { padding: 4.5% 5%; }
	
	#sp-wrap { background:#c7b18a;}
	#sp-wrap .grid_4 { width:32%;}
	#about-wrap p { padding:0 10%;}
	#feature-wrap .grid_4 { width:32%;}
	
	.gallery .grid_3 { width:23.5%;}
	#rooms .grid_3 { width:23.5%;}
	.list .grid_6 { width:49%;}
	
	#distance-wrap .grid_4 { width:32%;}
	#location .grid_6 { width:49%;}
	.location-block.grid_3 { width:23.5%;}
	
	#footer-wrap .grid_4 { width:23.5%;} 
	#footer-wrap .grid_2 { width:23.5%;} 
	
}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 1023px) {
	
	.mobile-alpha { margin-left:0;}
	.mobile-omega { margin-right:0;}
	
	#logo { width:30%; float:left; margin:0; padding-top:25px;}
	#booking { width:65%; float:right; padding: 2.5% 0; margin:0;}
	#booking .one-third { float:left; width:46%; margin: 0 2% 0 0; display: block;}
	#booking select { padding: 4.8% 5%; }
	
	#sp-wrap .grid_4 { width:100%; margin-bottom:20px;}
	#sp-wrap .grid_4 .sp-wrap-img { float:left; margin-right:20px; width:40%;}
	#sp-wrap .grid_4 h1 { text-align:left;}
	#sp-wrap .grid_4 p { text-align:justify;}
	
	.gallery .grid_3 { width:49%;}
	.gthumb { height:180px; margin-bottom:4%;}
	#rooms .grid_3 { width:49%;}
	
	.location-block.grid_3 { width:49%;}
	
	#footer-wrap .grid_4 { width:49%;} 
	#footer-wrap .grid_2 { width:49%;} 

}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
	
	.mobile-alpha { margin-left:0;}
	.mobile-omega { margin-right:0;}
	
	#logo { width:100%; float:none; padding:0; text-align:center; margin:0; }
	#booking { width:100%; float:none; padding: 1.5% 0; margin:0;}
	#booking .one-third { float:left; width:48%; margin: 0 2% 0 0; display: block;}
	#booking select { padding: 4.8% 5%; }	
	
	#sp-wrap .grid_4 { width:100%; margin-bottom:20px;}
	#sp-wrap .grid_4 .sp-wrap-img { float:left; margin-right:20px; width:40%;}
	#sp-wrap .grid_4 h1 { text-align:left;}
	#sp-wrap .grid_4 p { text-align:justify;}
	
	#about-wrap p { padding:0;}
	#feature-wrap .grid_4 { width:100%; margin-bottom:30px;}
	
	.gallery .grid_3 { width:49%;}
	.gthumb { height:180px; margin-bottom:4%;}
	#rooms .grid_3 { width:49%;}
	
	#footer-wrap .grid_4 { width:49%;} 
	#footer-wrap .grid_2 { width:49%;} 
	
	.location-block.grid_3 { width:49%;}

} 		


/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {

	#sp-wrap .grid_4 { width:100%; margin-bottom:20px;}
	#sp-wrap .grid_4 img { float:left; margin-right:20px; margin-bottom:100px; padding:10px;}
	#sp-wrap .grid_4 h1 { text-align:left;}
	#sp-wrap .grid_4 p { text-align:justify;}
	
	.list .grid_6 { width:100%; margin-bottom:30px;}
	
	#location .grid_6 { width:100%; margin-bottom:30px;}
	.location-block.grid_3 { width:49%;}

}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
	
	#logo { width:100%; float:none; padding:0; margin:0; text-align:center;}
	#booking { width:100%; float:none; padding: 1.5% 0; margin:0;}
	#booking .one-third { float:none; width:100%; margin: 0; display: block;}
	#booking select { padding: 4.8% 5%; }	
	
	#sp-wrap .grid_4 { width:100%; margin-bottom:30px;}
	#sp-wrap .grid_4 .sp-wrap-img { float:none; margin-right:0; margin-bottom:0; padding:0; height:200px; width:100%;}
	#sp-wrap .grid_4 h1 { text-align:center;}
	#sp-wrap .grid_4 p { text-align:center;}
	
	.gallery .grid_3 { width:100%;}
	.gthumb { height:180px; margin-bottom:4%;}
	#rooms .grid_3 { width:100%;}
	
	#distance-wrap .grid_4 { width:100%; margin-bottom:30px;}
	#location .grid_6 { width:100%; margin-bottom:30px;}
	#location .grid_6 h1 { line-height:normal;}
	
	.list .grid_6 { width:100%; margin-bottom:30px;}
	.location-block.grid_3 { width:100%; margin-bottom:20px;}
	
	#footer-wrap .grid_4 { width:100%;} 
	#footer-wrap .grid_2 { width:100%;} 
		
}