@charset "UTF-8";

/************************************************************************************

DPROJECT, Year:2014

Media-queries stylesheet of Iresoni: Media-queries.css

*************************************************************************************/



/************************************************************************************

DESKTOP/TABLET LAYOUT 900px - 1100px

*************************************************************************************/

@media screen and (max-width: 1400px) {
.text p, .text ul{
  padding: 5px;
}
    main .main-content{

        position: relative;

        bottom:110px;

    }

    main .teasers-content{

        position: relative;

        bottom: 70px;

        margin: 0;

    }

    main .map{

        margin-top: 0;

        position: relative;

        bottom: 25px;

    }

    main .map-button{

        position: relative;

        bottom: 25px;

    }

}

@media (max-width: 1300px) {
    #menu-bok1 {
        display: none;
    }
}

@media screen and (max-width: 1100px) {
  main ul li:before{
    display: none;
  }
  .modal-footer .btn-default{
    width: 85%;
  }
main{
        margin-top: 150px;
    margin-bottom: 50px;
}
.activities .text,.events .text{
  text-align: center;
}
    main .teasers-content{

        position: relative;

        bottom:0px;

    }

    form[name^=contact_form] div img{

      width: 100px;

      height: 32px;

      position: absolute;

      top: 215px;

    }

  #scroll_btn{

    display:none;

  }

        header .content .weather-block{

          

        }

        header .content #dropdown{

          top: -40px;
          left: 25px;

          position: relative;

        }

        .header-bg{

          height:100px;

        }

        header .content .header-links-block{

          position: relative;

          top: -25px;
          right: 25px;

        }

        header .content .header-links-block .contact p{

            display:none;

        }

        header .content #logo{

            background: url('../img/logo_small.png')no-repeat 0px;

            position: relative;

            top: 5px;

            width: 50px;

            height: 50px;

            margin: 0 auto;

        }

.bx-wrapper{

  max-height: auto!important;

  height:auto!important;

}

main .map{

      margin-top:25px;

          position: relative;

        bottom: 0px;

}

main .map-button{

          position: relative;

        bottom: 0px;

}

body.photo main .main-content{

   bottom:50px;

}

main.photos{
  margin-top: 60px;
}

.bx-wrapper img{

  max-width:100%!important;

  width:100%!important;

}

.photo-item.style1 { width: 285px;}

.photo-item.style2 { width: 285px;}

.photo-item.style3 { width: 285px;height:325px;}

.photo-item.style3 img{ height:325px;}

.photo-item.style4 { width: 285px;}



.contact-form div img{

  left: 130px;

  top: 150px;

}

    .contact-form div button{

      width: 360px;

      margin: 0 58%;

      right: 0;

      left: 0;

    }

  header .content .header-nav ul li.last{

    padding-right: 0;

    margin-right: 0;

  }

  header .content{

      padding-top: 15px;

    padding-bottom: 0px;

  }

    main #gallery{

    margin: 0 auto;

  }

   header .content .title{

       font-size: 18px;

    line-height: 18px;

   }

     input , select, textarea{

        float:none;

        display:block;

        margin: 5px auto;

    }

    .wireless form input{

      float: left;

      margin: 0 5px;

    }

    form button, form .button{

        margin: 10px auto;

        width: 142px;

        height: 42px;

        font-size: 15px;

    }

    .click-box{

    bottom: 145px;

    }

    button, .button {

        width: 180px;

        height: 46px;

        position: relative;

        top: -2px;

        left: 0px;

        float:none;

        display:block;

        margin: 5px auto;

    }

    h2.heading-underline{

        background-position: center 75%;

    }



        h2{

           font-size: 17px;

            line-height: 24px;

    }

    main{

      position: relative;

      background: none;



    }

    main .main-content{

        padding: 15px 5px;

    }

    .content-padding{

        padding: 0px 7px;

    }



    main .main-content .dropdown{

        display:inline-block;

    }

    .header-bg{

            background: url('../img/header_bg.png');

            background-position:top center;

    }

    header .content .weather-block{

        position: relative;

        top: 0px;
        width: 290px;
        margin-left: 70px;

    }

    header .content .header-links-block .contact,header .content .header-links-block .language {

        display: block;

        border:none;

        width: 120px;

        height: 55px;

        padding-top: 10px;

        padding-left: 25px;

        margin-left: 25px;

        text-align: right;

        float:none;

    }

    header .content .language select {

        background: url('../img/icons/drop.png') no-repeat;

        background-position: center right;

        color: #a69e95;

        font-size: 14px;

        width: 110px;

        height: 25px;

        padding: 0;

        padding-left: 25px;

        margin: 0;

  }

    header .content #dropdown, header .content #logo{

        display:block;

    }

    header .content .header-nav{

        display: none;

        background: url('../img/header_bg.png');

        position: relative;

        top: -43px;

        right: 0;

        padding-right: 25px;

        padding-left: 25px;

        padding-bottom:25px;

    }

    header .content .header-nav .nav-menu1, header .content .header-nav .nav-menu2{

        width: 100%;

        padding: 0px;

        font-weight: 500;

        font-size: 17px;

        line-height: 17px;

        height: 135px;

    }

    header .content .header-nav .nav-menu1 li, header .content .header-nav .nav-menu2 li{

        display: block;
        padding-left: 0px;
        background: none;
        padding: 0;
        text-align: center;
        margin: 0 auto;
    }

    header .content .header-nav .nav-menu1 li a , header .content .header-nav .nav-menu2 li a,header .content .header-nav .nav-menu1 a.active,header .content .header-nav .nav-menu2 a.active, header .content .header-nav .nav-menu1 a:link,header .content .header-nav .nav-menu2 a:link, header .header-nav .nav-menu a:visited{

            display: block;

            width: 100%;

            padding: 8px;

    }

    header .content .header-nav .nav-menu1 a.active, header .content .header-nav .nav-menu2 a.active{

            font-weight:700;

    }

    header .content .header-nav .nav-menu1 a:hover, header .content .header-nav .nav-menu2 a:hover, header .content .header-nav .nav-menu1 a:focus, header .content .header-nav .nav-menu2 a:focus {

            text-decoration: none;

            text-shadow:none;

    }

    main .main-content{

        position: relative;

        bottom:50px;

    }

    main .teasers-content{

        position: relative;

        bottom: 0px;

        padding: 15px 0;

        margin: 15px 0;

    }

    main .main-content .first-col{

      text-align: center;

      float: left;

      width: 100%;

      padding-right: 0;
      padding-bottom: 35px;

    }

    main .main-content .second-col{

      float: left;

      width: 100%;

      text-align: center;

    }

    main .main-content .gallery .gallery-thumb{

      width: 22%;

      display: inline-block;

      padding-right: 4%;

      padding-bottom: 4%;

    }

    main .main-content .gallery .gallery-thumb:nth-child(4n){

      padding-right: 0px;

    }

    main .main-content .gallery .gallery-thumb.last{

	  padding-right: 4%;

    }

     main .teasers-content .col {

    width: 30%;

    padding-right: 5%;

    display: inline-block;

    float: left;

    }

    main .main-content .book-online{

        background: none;

        display:none;

        padding-left: 16px;

        padding-bottom:20px;

    }

     #book-mobile{

      display:inline;

     }

      #book-mobile button{

        width:80%;

        position: relative;

        top: -5px;

      }

    main .clickable-teasers .col   {

          width: 32%;

          margin-right: 2%;

          display: inline-block;

    }

    .accommodation main .clickable-teasers{

            position: absolute;

        bottom: 102%;

    }

        main .clickable-teasers {

        padding: 25px 30px;

        width: auto;

        right: -30px;

        left: -30px;

        bottom:25px;

        position: absolute;

        }

    main .clickable-teasers-button{

        position: absolute;

        top: 20px;

        margin-left: 0;

        left: 47%;

    }

    main .main-content{

        position: relative;

        bottom:0px;

        padding: 0 7px;
position: relative;
    bottom: 0px;
    margin-bottom: -18px;
    }
    
    .slider-wrapper img[src*="views/themes/xenonas-iresioni/espa02.jpg"],
    .slider-wrapper img[src*="views/themes/xenonas-iresioni/e-banner-eng.png"],
    .slider-wrapper img[src*="views/themes/xenonas-iresioni/perigrafi.pdf"],
    .slider-wrapper img[src*="views/themes/xenonas-iresioni/poster eng.pdf"] {
    display: none;
    } 

}

/************************************************************************************

DESKTOP/TABLET LAYOUT 600px - 900px

*************************************************************************************/

@media screen and (max-width: 900px) {
  h1{
    margin: 10px;
  }
  main .main-content{
    padding: 0 10px;
  }

     #book-mobile{
      display: inline;
      z-index: 9;
      position: fixed;
      top: 62vh;
      left: 0;
      right: 0;
      margin: 0 auto;

     }

      #book-mobile button{
        width: 145px;
        position: relative;
        top: 0;
        margin: 0 auto;
        left: 0;
        right: 0;
        background: #63521c;

      }
  main .title-menu li{
      display: block;
    padding-right: 0;
    cursor: pointer;
    text-align: center;
    margin: 5px auto;
  }
  main .main-content .second-col ul li{
    width: 100%;
    margin: 0 auto;
    text-align: center;
  }
form >div{
    float: left;
    display: block;
    width: 100%;
}
    main .clickable-teasers-button{

        position: absolute;

        top: 20px;

        margin-left: 0;

        left: 46%;

    }

    main .teasers-content .col {

    width: 100%;

    padding-right: 0;

    display: inline-block;
    float: none;
    margin: 0 auto;
    margin-bottom: 0px;
    padding: 0 7px;

    }
    main .teasers-content .col.last{
      padding: 0 7px;
    }
    main .teasers-content .col .text{
         display: inline-block;
    width: 100%;
    height: 85px;
    margin: 20px 0;
    border-top: 2px solid #c1940c;
    border-bottom: 2px solid #c1940c;
    }

    main .teasers-content .col .text h3 {

    width: 100%;

    word-break: break-word;

    position: relative;

    top: 15px;

    left:0px;
        padding: 0 30px;

    }

    main .main-content .contact-form input[type="submit"]{

      position: relative;

      top: 0px;

      right: 0px;

      float:left;

      margin:10px 0;

    }

    main .main-content .contact-form textarea{

      position: relative;

      float:left;

      top: 0px;

      right: -5px;

    }

    .contact-form div button{

    position: relative;

    top: 35px;

    float: left;

    left: 0;

    margin: 15px 5px;

    width: 375px;

    }

    main .main-content{

        position: relative;

        bottom:0px;
position: relative;
    bottom: 0px;
    margin-bottom: -18px;
    }
    
     #menu-bok1 {
        display: none;
    }
    
     header .content .weather-block{
        position: relative;
        top: 8px;
        width: 200px;
        margin-left: 70px;

    }

}

/************************************************************************************

SMALL MOBILE LAYOUT 300px - 600px

*************************************************************************************/

@media screen and (max-width: 600px) {
header .content .header-links-block .contact{
display: block;
    right: -10px;
    position: relative;

}
        header .content #logo{

            background: url('../img/logo_medium.png')no-repeat 0px;

            position: relative;

            top: 15px;

            width: 80px;

            height: 80px;

            margin: 0 auto;

        }

    header .content #dropdown{

      top:-25px;
      left: 25px;

      position:relative;

    }

            header .content .header-links-block .contact p{

            display:inline-block;

        }

        header .content .header-links-block{

        position: relative;

        top: -10px;

    }

    .contact-form div button{

width: 95%;
    text-align: center;
    margin: 20px auto;
    display: inline-block;
    float: none;

    }

    .contact-form div img{

        position: absolute;

        right: 0;

        left: 64%;

        top: 135px;

    }

    form[name^=contact_form] div img{

        top: 187px;

    }

    main .clickable-teasers-button{

        position: absolute;

        top: 20px;

        margin-left: 0;

        left: 43%;

    }
header{
  height: 150px;
}
    .header-bg{

          height:150px;

    }

    header .content .header-nav{

     background: url('../img/bg.png') repeat;

             top: 3px;
            padding-top: 25px;
             position:relative;

     }

    .body-text table{

      display:none;

    }

    #check-rates{

      display:none;

    }

    #book-mobile span{

      display:none;

    }

        #scroll_btn{

      display:none;

    }

 .bx-wrapper{

      padding-top:150px!important;

 }

 .bx-wrapper .bx-controls-direction a{

      top: 70%!important;

 }

  h2{

      font-size: 18px;

    line-height: 18px;

  }

  h4{

      font-size: 16px;

    line-height: 16px;

  }

  h5{

      font-size: 14px;

    line-height: 14px;

  }

    main .main-content .contact-form input{

    width: 95%;
    margin: 0px auto;

    }

    main .main-content .contact-form textarea,main .main-content .contact-form input[type="submit"]{

    width: 95%;
    margin: 0 auto;
    right: 0;
    /* text-align: center; */
    float: none;


    }

    header .content .header-nav .nav-menu1, header .content .header-nav .nav-menu2{

            width: 100%;

            padding: 0px;

            font-weight: 500;

            height: 135px;

    }

    .click-box{

    width: auto;

    padding: 25px;

    bottom: 145px;

    left: 0;

    }

    .content-padding{

        padding: 0px 7px;

    }

    header .content .weather-block .hum, header .content .weather-block .txt{

        /* display:none; */

    }

    header .content .weather-block{

       /* position: relative;
        top: 5px;
        left: 20px;
        display:inline-block; */
        top: 6px;
        width: 190px;
        margin-left: 2px;
        
    }

    main .main-content .second-col ul{

    margin: 0px;

    float: left;

    width: 100%;

   }

    main .main-content .gallery .gallery-thumb{

    float: left;

    width: 100%;

    display: inline-block;

    padding: 10px 5px;

   }

   main .main-content .gallery .gallery-thumb img{

      width:100%;

   }
   
    #menu-bok1 {
        display: none;
    }

    /************************************************************************************

    PHOTO GALLERY

    *************************************************************************************/



}

