/* Foglio di stile associato a Schede Hotel */
/* == Stili di base - Mobile first ===== */

body {
 font-size: 62,5%;
 font-family:Segoe UI Light, Segoe UI!important; 
 font-weight: 300; 
 margin:0; 
 padding:0
}

.Header_menu_main { vertical-align: top; text-align: right}
.Header_menu_rel{position: relative; width: 100%; height:35px }
#Header_menu_ico {max-width: 35px;}
.Header_menu_list {position: absolute; right: 0; width: 100%; display:none;background-color:#e7e6e5}
.Header_menu_list span   { display:none; margin-right:0.313em /*5px*/}


.HTL_Header_LogoHtl_img { width:20%; margin-right:3px; max-width:116px}
.HTL_Header_txtHtlName{color:#6c401c; font-size:0.8em; }
.HTL_Header_txtHtlStar { display:none}
.HTL_Header_txtHtlSlogan { color:#9b8f6c; font-style:oblique; font-size:0.7em;}
.HTL_Header_Booking { display:none}
.HTL_Header_imgBanner> img { width:100%}
.HTL_Header_spaceBottom{ height:0.6em}
.HTL_Header_spaceBottom_Descr{ height:0.6em}
.HTL_Header_spaceApp{ height:0.4em}

.HTL_Header_Booking { display:none}
.HTL_FirstClm {display:block; width:100%; } 
.HTL_FirstClm>div {margin-right:0px} 
.HTL_FirstClm_Descr { color:#000; font-size:0.8em;}

.HTL_FirstClm_Tab { display:block;} 
.HTL_FirstClm_Tab_ico, .HTL_SecondClm_ico {/*width:13%; margin : 5px 0px 0 5px*/max-width:100%; max-height:100%;}
.HTL_FirstClm_Tab_Title { background-color:#494949;  height:2em; line-height:1.8em }
.HTL_FirstClm_Tab_Title span{ color:White; font-size:1.5em;  }
/*.HTL_FirstClm_Tab_Title img { display:block}*/

#div_Fotogallery, #div_Video, #div_InfoHotel { display:none}
#span_Fotogallery, #span_Video { display:none}
.HTL_SecondClm { display:block; padding-left:0} 
/*.HTL_SecondClm_ico { width:13%; margin : 5px 0px 0 5px}*/
.HTL_SecondClm_Title { background-color:#494949;  height:2em; line-height:1.8em }
.HTL_SecondClm_Title span{ color:White; font-size:1.3em;  }
.HTL_SecondClm_Title img { display:block}
.HTL_spaceBottom{ height:1.1em; }
#div_InfoHotel{color:#5a5a5a}
#div_InfoHotel a{color:#5a5a5a}
#div_InfoHotel> img{float:left; margin:2px 10px 0 0}
#map-canvas{ width:100%; height:100%; max-height:200px; border:1px solid #bebebe; max-width:200px; }
.div_InfoHotel_FirstClmInfo { margin-right:25px}

/* =================================================================================*/
/*Sovrascrittura css ImageLib*/
.IMG_DivFoto { margin-right:5px!important}
/*Sovrascrittura css Dotazioni*/
.SuppOPT_FieldElem_etichette{ color:#000!important; font-size:0.9em!important;}
#div_Dotazioni_data>div { margin-right:0; width:260px!important;}
/*Sovrascrittura css News*/
.ENews_BoxMain { width:280px!important; margin-right:0!important}



/* == Media queries (breakpoint) ===== */

 @media only screen and (min-width: 320px) {
    .HTL_Header_LogoHtl_img { width:20%;}
    .HTL_Header_txtHtlName{font-size:1em;}
    .HTL_Header_txtHtlSlogan {font-size:0.8em;}
    .HTL_Header_txtHtlStar {display:inline-block;vertical-align:top;  width:55px; margin-top:5px}
    .HTL_Header_txtHtlStar img { width:88%;}
    
    .HTL_SecondClm_ico, .HTL_FirstClm_Tab_ico {  margin : 0px 0px 0 5px}
    
    /*Sovrascrittura css News*/
    .ENews_BoxMain { width:300px!important; }
}
 
 
 @media only screen and (min-width: 480px) {
    .HTL_Header_LogoHtl_img { width:15%; margin-right:5px}
    .HTL_Header_txtHtlName{font-size:1.35em;}
    .HTL_Header_txtHtlSlogan{font-size:1.125em;line-height:1.1em}
    .HTL_Header_txtHtlStar {width:auto;margin-top:10px }
    .HTL_Header_txtHtlStar img { width:30%;}
    .HTL_Header_spaceBottom{ height:1.0em}
    
    .HTL_FirstClm_Descr {font-size:1.125em;}
    

    
    .HTL_SecondClm_Title, .HTL_FirstClm_Tab_Title {height:2.5em; line-height:2.2em}
    .HTL_SecondClm_Title span, .HTL_FirstClm_Tab_Title span {font-size:1.9em; }  
    /*.HTL_SecondClm_ico, .HTL_FirstClm_Tab_ico { width:10%; margin-top:4px}  */
    #div_InfoHotel{font-size:1.3em; margin:5px 10px 0 0}
    
    /*Sovrascrittura css News*/
    .ENews_BoxMain { width:320px!important; margin-right:10px!important; }
}
 
/* -----------------------------------
IPAD PORTRAIT
------------------------------------ */
@media only screen and (min-width: 768px) 
{
    .Header_menu_rel{position: relative; width: 100%; height:45px }
    #Header_menu_ico {max-width: 45px;}

    .HTL_Header_LogoHtl_img { width:auto;}
    .HTL_Header_txtHtlName{font-size:2.813em;  }
    .HTL_Header_txtHtlSlogan {font-size:1.625em;line-height:1em}
    .HTL_Header_txtHtlStar {margin-top:15px}
    .HTL_Header_txtHtlStar img { width:auto}
    .HTL_Header_spaceBottom{ height:1.4em}
    
    .HTL_FirstClm_Tab_Title_Dotazioni{ display:none}
    
   
    .HTL_SecondClm_Title, .HTL_FirstClm_Tab_Title {height:2.8em; line-height:2.8em}
    .HTL_SecondClm_ico, .HTL_FirstClm_Tab_ico { width:auto; margin-top:2px} 
    
}
 
 
/* -----------------------------------
IPAD LANDSCAPE + NETBOOK
------------------------------------ */
@media only screen and (min-width: 1024px)
{
    #Header_menu_ico {display:none}  
    .Header_menu_list {display:block; }
    .Header_menu_list span   { display:inline-block}
    .Header_menu_list>div { display:inline-block;}
    .HTL_Header_spaceBottom{ height:3.3em}
    .HTL_Header_Booking { display:block}
    .HTL_Header_Booking { width:250px; background-color:#5e5e5e; height:130px; float:right; color:#fff;  }

    .HTL_FirstClm {width:42.188em/*675px*/; display:inline-block;/* border-right-style:dotted; border-color:#aeadad; padding-right:5px;*/}
    .HTL_FirstClm>div {margin-right:10px} 
    
    .HTL_FirstClm_Tab {width:42.188em/*675px*/; display:inline-block} 
    .HTL_FirstClm_Tab_Title { background-color:#fff; }
    .HTL_FirstClm_Tab_Title span{ color:#9b8f6c; font-size:2.188em }
    .HTL_FirstClm_Tab_Title img { display:none}

    #div_Fotogallery, #div_Video, #div_InfoHotel { display:block!important}
    #span_Fotogallery, #span_Video { display:block}
    #span_Fotogallery-Video{ display:none}
    
    .HTL_SecondClm {border-left-style:dotted; border-color:#aeadad; padding-left:15px; vertical-align:top; display:inline-block; width:18.438em/*295px;*/  }
    .HTL_SecondClm_Title  { background-color:#fff;  }
    .HTL_SecondClm_Title span{color:#9b8f6c; font-size:2.188em}
    .HTL_SecondClm_Title img { display:none}

    
}
 
/* -----------------------------------
DESKTOP
------------------------------------ */
@media only screen and (min-width: 1200px)
{
    
    
    .HTL_FirstClm, .HTL_FirstClm_Tab {width:42.813em/*685px*/;}
    .HTL_SecondClm { padding-left:10px; width:18.438em/*295px;*/  }
}