@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Comfortaa');

@import url('https://fonts.googleapis.com/css?family=Lato');

html, body{
	margin: 0;
	padding: 0;
	width: 100%;
	max-width: 100%;
	height: 100%;
	font-family: 'Lato', sans-serif;
	background-color: #ffffff;
	color: #929292;
	overflow-x: hidden;
}

.preload * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
}

::selection {
  background: #215179; /* WebKit/Blink Browsers */
  color: #fff
}
::-moz-selection {
  background: #215179; /* Gecko Browsers */
  color: #fff
}
 
h1 { 
   font-family: 'Comfortaa', cursive;
   font-size: 0px;
   font-weight: lighter;
   margin: 0;
}

h2 { 
   font-family: 'Comfortaa', cursive;
   font-weight: normal;
   margin: 0;
}

h3 { 
   font-family: 'Comfortaa', cursive;
   font-weight: normal;
   color: #215179;
   font-size: 16px;
   margin: 0px 5px 5px 0px
}

.top{  
   font-size: 13px; 
   padding-bottom: 10px;
   border-bottom: 1px solid #CCC;
   margin-bottom: 10px;
   letter-spacing: 4px;   
}
.bottom{
	color: #215179;
	font-size: 24px;	
}

.mobile{
	display: none;
}

.mobile_booking{
	display: none;
}

p{
	line-height: 2;
	margin: 20px 0px 0px 0px
}

p a:link{
	color: #929292;
	text-decoration: none;
}
p a:visited{
	color: #929292;
	text-decoration: none;
}
p a:hover{
	color: #929292;
	text-decoration: underline;
}
p a:active{
	color: #929292;
	text-decoration: none;
}

.clear{
	clear:both
}

a {
  -o-transition:color .2s ease-out;
  -ms-transition:color .2s ease-out;
  -moz-transition:color .2s ease-out;
  -webkit-transition:color .2s ease-out;
  transition:color .2s ease-out;
}

/* color palette */
.light_grey{
	color: #ffffff
}
.grey{
	color: #D9D3DF;
}
.light_blue{
	color: #91C4E3;
}
.dark_blue{
	color: #215179;
}

.row{
	width: 90%;
	margin: 0px 5%;
}

.desktop_title{
	display: inline;
	width: 100%;
	max-width: 400px;
}
.mobile_title{
	display: none;	
}

/* Animation */
.aos-all {
  width: 1000px;
  max-width: 98%;
  margin: 10vh auto 0 auto;
}

.aos-item {
  display: inline-block;
  float: left;
  width: 33.3333%;
  height: 300px;
  padding: 20px;
}

.aos-item__inner {
  position: relative;
  width: 100%;
  height: 100%;
  float: left;
  background: #1da4e2;
  line-height: 260px;
  text-align: center;
  color: #fff;
}

@media screen and (max-width: 800px) {
  .aos-item {
    width: 50%;
  }
}


/* Preloader */
#preloader {
 	position: fixed;
  	top: 0;
  	left: 0;
  	right: 0;
  	bottom: 0;
  	background-color: #215179;
	z-index: 10000;
}
#status {
  	width: 200px;
  	height: 200px;
  	position: absolute;
  	left: 50%;
  	top: 50%;
  	background-image: url(../immagini/loading_up.png);
	background-size: 100px 100px;
  	background-repeat: no-repeat;
  	background-position: center;
  	margin: -100px 0 0 -100px;
}

/*homepage landing box */ 

#homepage_landing_box{
	width: 100%;
	height: 100%;
	background-image: url(../immagini/home_landing_box/back.jpg);
	background-size: cover;
	background-repeat: no-repeat;
}
#homepage_landing_box_container{
	width: 100%;
	height: calc(100% - 50px);
	position: relative;
}
#homepage_container_logo{
	width: 100%;
	height: 100%;
	position: relative;
}
#homepage_logo_down{
	width: auto;
	height: 100%;
	position: absolute;
}
#homepage_logo_down img{
	width: auto;
	height: 200%;
	margin-left: -50%;
	-webkit-animation: rotate-left 5s linear 1;
}
@-webkit-keyframes rotate-left
{
from { 
	-webkit-transform: rotate(0deg);}
to {
	-webkit-transform: rotate(180deg);
}
}

#homepage_logo_up{
	height: 100%;
	width: 100%;
	position: absolute;
	z-index: 10;
}
#homepage_logo_up img{
	height: 100%;
	width: auto;
}

#language_bar{
	display: none;
	width: 100%;
	height: 50px;
	line-height: 50px;		  
	background-color: #ffffff
}

/* menu */
#menu_wrapper{
	height: 50px;
}
#menu{
	width: calc(100% - 30px);
	height: 20px;
	padding: 15px;
	background-color: #ffffff;
	font-family: 'Comfortaa', cursive;
	font-size: 12px;
	letter-spacing: 2px;
	line-height: 20px;
	position: relative;
	z-index: 1000000;
}
#menu img{
	height: auto;
	width: 100%;
	max-width: 307px;
}
#menu_left{
	width: 307px;
	float: left;
	display: none
}
#menu_right{
	width: calc(100% - 307px);
	float: right;
	text-align: right
}
#menu_right ul, li {
    display:inline;
	text-align: center
}
#menu_right li {
	padding-right: 20px
}

#menu_right li a:link {
	color: #215179;
	text-decoration: none
}
#menu_right li a:visited {
	color: #215179;
	text-decoration: none
}
#menu_right li a:hover {
	color: #91C4E3;
	text-decoration: none
}
#menu_right li a:active {
	color: #215179;
	text-decoration: none
}

#cssmenu{
	display: none
}

.language{
	width: 80px;
	float: right;
	color: #929292;
}

.language a:link{
	color: #215179;
	text-decoration: none;
}

.language a:visited{
	color: #215179;
	text-decoration: none;
}

.language a:hover{
	color: #91C4E3;
	text-decoration: none;
}

.language a:active{
	color: #215179;
	text-decoration: none;
}

/* contenuto */
#container{
	width: 100%;
	min-height: 1000px;
	background-color: #ffffff;
	position: relative;
	z-index: 100;
	margin-top: -50px;
	overflow: hidden;
}
#container_box{
	padding-top: 0px
}

/* home presentazione */
#home_presentazione{
	padding: 50px 0px 0px 0px;
	display: table;
	width: 100%; 
	height: 100%;
	min-height: 100%;
}
#home_presentazione_row{
	display:table-row; 
	height:100%; 
}
#home_presentazione_sx{
	width: 50%;
	height: 100%;
	position:relative;
	display:table-cell;
}
#home_presentazione_sx img{
	width: 100%;
	height: auto;
}
#home_presentazione_dx{
	width: calc(50% - 200px);
	padding: 0px 100px;
	height: 100%;
	position:relative;
	display:table-cell;
	vertical-align: middle;
}

#home_booking{
	width: 100%;
	height: auto;
	padding: 100px 0px;
	background-image: url(../immagini/back_booking.png);
	background-size: 10px 100%;
	background-repeat: repeat-x
}

#booking_box{
	font-family: 'Comfortaa', cursive;
	font-size: 12px;
	width: 90%;
	height: 140px;
	background-color: #FFF;
	margin: 0px auto;
	
}
#booking_box_up{
	width: calc(100% - 2px);
	height: 70px;
	padding: 15px 0px;
	border: 1px solid #ccc
}
#booking_box_bottom{
	font-size: 12px;
	width: calc(100% - 22px);
	height: 30px;
	line-height: 30px;
	color: #fff;
	padding: 5px 10px;
	background-color: #215179;
	border: 1px solid #1C4669
}
#booking_box_bottom a:link{
	color: #fff;
	text-decoration: underline 
}
#booking_box_bottom a:visited{
	color: #fff;
	text-decoration: underline
}
#booking_box_bottom a:hover{
	color: #91C4E3;
	text-decoration: underline
}
#booking_box_bottom a:active{
	color: #fff;
	text-decoration: underline
}

.box_single_little{
	font-family: 'Comfortaa', cursive;
	width: calc(20% - 21px);
	height: 60px;
	padding: 5px 10px;
	float: left	;
	border-right: 1px solid #ccc;
	position: relative
}
.box_single_middle{
	font-family: 'Comfortaa', cursive;
	width: calc(15% - 21px);
	height: 60px;
	padding: 5px 10px;
	float: left	;
	border-right: 1px solid #ccc;
	position: relative
}
#box_single_big{
	width: calc(25% - 20px);
	height: 60px;
	padding: 5px 10px;
	float: left;
	position: relative
}

#home_camere{
	width: 100%;
	padding: 0px 0px 100px 0px;
	background-color: #eaf3fa;
}
#home_camere_sx{
	width: calc(50% - 100px);
	height: auto;
	float: left;
	z-index: 10000;
	background-color: #FFF;
	padding: 50px;	
}
#home_camere_dx{
	width: 50%;
	float: right;
	margin-top: 50px;
	height: auto;
	position: relative;
	z-index: 10;
}
#home_camere_dx_blue{
	width: calc(100% - 52px);
	border: 1px solid #1C4669;
	margin-left: 50px;
	margin-top: 20px;
	padding: 30px 0px;
	background-color: #215179;
}


.home_singola_camera{
	width: calc(100% - 20px);
	height: 120px;
	padding: 10px;
}

.home_singola_camera:hover{
	color: #929292;
	background-color: #eaf3fa;
	-moz-transition: background 1s;
    -webkit-transition: background 1s;
    -o-transition: background 1s;
    -ms-transition: background 1s;
    transition: background 1s;
}
.home_singola_camera a:link{
	color: #929292;
	text-decoration: none;
}
.home_singola_camera a:visited{
	color: #929292;
	text-decoration: none
}
.home_singola_camera a:hover{
	color: #929292;
	text-decoration: none
}
.home_singola_camera a:active{
	color: #929292;
	text-decoration: none
}
.home_singola_camera_sx{
	width: 180px;
	height: 120px;
	float: left;
}
.home_singola_camera_sx img{
	width: 180px;
	height: 120px;
}
.home_singola_camera_dx{
	width: calc(100% - 200px);
	margin-left: 20px;
	height: 109px;
	padding-top: 10px;
	float: left;
	border-bottom: 1px solid #ccc;
	font-size: 14px;	
}
#home_camere_servizi_sx{
	width: calc(50% - 30px);
	padding: 0px 10px 0px 20px;
	float: left;
}
#home_camere_servizi_dx{
	width: calc(50% - 30px);
	padding: 0px 20px 0px 10px;
	float: left;

}
#home_camere_servizi_sx ul li, #home_camere_servizi_dx ul li{
	display: list-item;
	text-align: left;
	line-height: 2;	
	color: #fff
}

#intro_monterosso{
	padding: 100px 0px;
}

#intro_monterosso img{
	width: calc(25% - 3px);
	height: auto
}

#home_meteo{
	padding: 100px 0px
}

#footer{
	width: 100%;
	height: 300px;
	background-image: url(../immagini/footer_back.png);
	background-size: 10px 100%;
	background-repeat: repeat-x;
	font-family: 'Comfortaa', cursive;
	font-size: 14px;
}
.footer_box{
	width: 33.333%;
	margin-top: 30px;
	height: 240px;
	float: left;	
}
.footer_box p{
	line-height: normal
}
.footer_box_lateral{
	color: #215179;
	border-top: 1px solid #3A79AC;
	border-bottom: 1px solid #3A79AC;
	height: 178px;
	padding: 30px;
}

.footer_box_lateral img{
	width: 30px;
	height: auto;
	border: 1px solid #ccc;
	margin: 5px 3px 5px 0px;
}
.footer_box_central{
	margin: 20px 10px;
	font-size: 12px
}

.footer_box_central a:link{
	color: #fff;
	text-decoration: none
}

.footer_box_central a:visited{
	color: #fff;
	text-decoration: none
}

.footer_box_central a:hover{
	color: #91C4E3;
	text-decoration: none
}

.footer_box_central a:active{
	color: #fff;
	text-decoration: none
}

.footer_button{
	width: 160px;
	margin: 20px auto;
	font-size: 14px;
	padding: 5px 10px;
	background-color: #eaf3fa;
	color: #215179
}



#footer_bottom{
	width: 100%;
	color: #929292;
	font-size: 12px;
	padding-bottom:10px;
}
#footer_bottom a:link{
	color: #929292;
	text-decoration: underline
}
#footer_bottom a:visited{
	color: #929292;
	text-decoration: none
}
#footer_bottom a:hover{
	color: #91C4E3;
	text-decoration: none
}
#footer_bottom a:active{
	color: #929292;
	text-decoration: none
}

#footer_bottom_sx{
	width: 48%;
	padding: 0px 1%;
	float: left	;
	text-align: left
}
#footer_bottom_dx{
	width: 48%;
	padding: 0px 1%;
	float: left	;
	text-align: right
}


#intro_pag_secondaria{
	width: 100%;
	height: 1000px;
}

#menu_pag_secondaria{
	width: calc(100% - 30px);
	height: 20px;
	padding: 15px;
	background-color: #ffffff;
	font-family: 'Comfortaa', cursive;
	font-size: 12px;
	letter-spacing: 2px;
	line-height: 20px;
	position: fixed;
	z-index: 100;
}
#menu_pag_secondaria img{
	height: auto;
	width: 100%;
	max-width: 307px;
}

#logo_pag_secondaria{
	display: none;
}


#menu_right{
	width: calc(100% - 307px);
	float: right;
	text-align: right
}
#menu_right ul, li {
    display:inline;
	text-align: center
}
#menu_right li {
	padding-right: 20px
}

#menu_right li a:link {
	color: #215179;
	text-decoration: none
}
#menu_right li a:visited {
	color: #215179;
	text-decoration: none
}
#menu_right li a:hover {
	color: #91C4E3;
	text-decoration: none
}
#menu_right li a:active {
	color: #215179;
	text-decoration: none
}

/* PAGINE SECONDARIE */
#intro_pag_secondaria{
	width: 100%;
	height: 100%;
}
#intro_ps_sx{
	width: calc(29% - 1px);
	height: calc(100% - 200px);
	padding: 100px 3%;
	border-right: 1px solid #ccc;
	float: left;
	background-color: #fff;
	background-image: url(../immagini/camere/rosa%20dei%20venti.png);
	background-position: bottom right;
	background-size: 100% auto;
	background-repeat: no-repeat
}
#intro_ps_dx{
	width: calc(65% - 2px);
	height: 100%;
	padding: 0px 0px 0px 2px;
	float: left;
}
#intro_cs_dx{
	width: calc(65% - 2px);
	height: 100%;
	padding: 0px 0px 0px 2px;
	float: left;
}
#intro_cs_dx img{
	width: auto;
	height: 100%
}
.slider {
  width: 100%;
  height: 100%;
  position: relative;
}
.slide1,.slide2,.slide3,.slide4,.slide5 {
  position: absolute;
  width: 100%;
  height: 100%;
}
.slide1 {
	background-image: url(../immagini/camere/Libeccio.jpg);
	background-size: cover;
    animation:fade 40s infinite;
-webkit-animation:fade 40s infinite;

} 
.slide2 {
		background-image: url(../immagini/camere/Scirocco.jpg);
	background-size: cover;
    animation:fade2 40s infinite;
-webkit-animation:fade2 40s infinite;
}
.slide3 {
		background-image: url(../immagini/camere/Tramontana.jpg);
	background-size: cover;
    animation:fade3 40s infinite;
-webkit-animation:fade3 40s infinite;
}
@keyframes fade
{
  0%   {opacity:1}
  33.333% { opacity: 0}
  66.666% { opacity: 0}
  100% { opacity: 1}
}
@keyframes fade2
{
  0%   {opacity:0}
  33.333% { opacity: 1}
  66.666% { opacity: 0 }
  100% { opacity: 0}
}
@keyframes fade3
{
  0%   {opacity:0}
  33.333% { opacity: 0}
  66.666% { opacity: 1}
  100% { opacity: 0}
}

#presentazione_camere_ps{
	width: calc(100% - 200px);
	background-color: #eaf3fa;
	padding: 100px;
}
#servizi_box_ps{
	width: calc(100% - 100px);
	background-color: #fff;
	padding: 50px;
}
#servizi_ps{
	width: calc(33.333% - 50px);
	margin: 0px 25px;
	height: auto;
	float: left
}
#servizi_ps p{
	margin-bottom: 40px;
}
#servizi_ps img{
	width: 30px;
	height: auto;
	float: left;
	margin-right: 20px;
}

#presentazione_camere_singole_ps{
	width: calc(100% - 200px);
	background-color: #fff;
	padding: 100px;
}

.singola_camera_box{
	margin: 2px;
	width: calc(33.333% - 4px);
	float: left;
	text-align: center
}
.singola_camera_box a:link{
	color: #929292;
	text-decoration: none;
}
.singola_camera_box a:visited{
	color: #929292;
	text-decoration: none;
}
.singola_camera_box:hover{
	color: #929292;
	text-decoration: none;
	background-color: #eaf3fa;
	-moz-transition: background 1s;
    -webkit-transition: background 1s;
    -o-transition: background 1s;
    -ms-transition: background 1s;
    transition: background 1s;
}
.singola_camera_box a:active{
	color: #929292;
	text-decoration: none;
}
.singola_camera_box img{
	width: 100%;
	height: auto;
	padding-bottom: 2px;
	margin-bottom: 10px;
	border-bottom: 1px solid #215179
}

.singola_camera_rientro{
	width: 94%;
	padding: 0px 3% 15px 3%
}

#presentazione_camere_cs{
	width: calc(100% - 100px);
	background-color: #eaf3fa;
	padding: 100px 50px;
}
#servizi_box_cs{
	width: calc(40% - 100px);
	height: calc(auto + 1px);
	background-color: #fff;
	padding: 65px 50px;
	float: left
}
#slide_box_cs{
	width: calc(60% - 50px);
	background-color: #fff;
	float: left;
	padding: 50px 0px 50px 50px;
}
#servizi_cs{
	width: 100%;
	margin: 0px;
	height: auto;
	float: none
}
#servizi_cs p{
	margin-bottom: -10px;
}
#servizi_cs img{
	width: 25px;
	height: auto;
	float: left;
	margin-right: 20px;
}

#form_prenotazione{
	width: calc(100% - 200px);
	margin: 100px 100px 0px 100px;
}

#form_prenotazione_sx{
	width: 40%;
	float: left;
	margin-bottom: 100px;
}

#form_prenotazione_dx{
	width: calc(50% - 50px);
	padding: 25px;
	margin-left: 10%;
	float: left;
	margin-bottom: 100px;
	text-align: left;
	background-color: #215179;
	color: #fff
}

.box_single_full{
	width: calc(100% - 20px);
	height: 50px;
	padding: 10px;
	float: none	;
	position: relative
}
#box_single_full_text{
	width: calc(100% - 20px);
	height: 50px;
	padding: 10px;
	float: none;
	position: relative
}
#box_single_bottom{
	font-family: 'Lato', sans-serif;
	font-size: 12px;
	width: calc(100% - 20px);
	height: 30px;
	line-height: 30px;
	color: #fff;
	padding: 10px;
	margin-top: 20px
}
#box_single_bottom a:link{
	color: #fff;
	text-decoration: underline 
}
#box_single_bottom a:visited{
	color: #fff;
	text-decoration: underline
}
#box_single_bottom a:hover{
	color: #D9D3DF;
	text-decoration: underline
}
#box_single_bottom a:active{
	color: #fff;
	text-decoration: underline
}

#contatti_rientro{
	width: calc(100% - 100px);
	padding: 50px;
	background-color: #FFFFFF
}

#container-map{
	width: 100%; 
	height:100%;
	position: relative;
}

#map-canvas{
	width: 100%; 
	height:100%; 
	position:relative;
	z-index:10;
}

#language_bar_mobile{
	display: none;
}

#tariffe{
}

#tariffe_prezzi{
	width: 100%;
}

#tariffe_disclaimer{
	width: calc(100% - 40px);
	background-color: #215179;
	color: #fff;
	padding: 20px;
	margin-top: 50px
}
#tariffe_disclaimer p{
	line-height: 1.4;
	font-size: 14px;
	margin: 20px 0px;
}

.datagrid table { border-collapse: collapse; text-align: left; width: 100%; } .datagrid {background: #fff; overflow: hidden;}.datagrid table td, .datagrid table th { padding: 15px 10px; }.datagrid table tbody td {border-bottom: 1px solid #ccc;font-weight: normal; }.datagrid table tbody td:first-child { border-left: none; }.datagrid table tbody tr:last-child td { border-bottom: none; }

#contacts_map{
	width: 130px;
	background-color: #215179;
	padding: 10px;
	color: #fff;
	margin: 50px 0px;
	text-align: center
}
#contacts_map:link{
	color: #fff;
	text-decoration: none
}
#contacts_map:visited{
	color: #fff;
	text-decoration: none
}
#contacts_map:hover{
	color: #fff;
	text-decoration: none
}
#contacts_map:active{
	color: #fff;
	text-decoration: none
}