* {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;}
*:focus {outline:0 !important;}
html, body {text-rendering:optimizeLegibility; min-height:100%; overflow-x: hidden;}
body {position:relative;font-family: 'Yantramanav', sans-serif; font-size:14pt; color:#333;}

/*
    azzurro: #95D13A
             #87C42D
    arancio: #c 
*/

/* GENERAL ATTRIBUTES */
    a, a:focus, a:visited {text-decoration:none!important; color:#333;}
    a:hover {color:#333; -webkit-transition: all .4s;transition: all .4s;}
    iframe {display:block; border: 0;}
    h1, h2, h3, h4, h5, h6 {margin:0; padding:0;}
    .home-visible {display: none;}
    #home .home-visible {display: initial;}
    .page-visible {display: initial;}
    #home .page-visible {display: none;}
    .transition, a {-webkit-transition:all .4s; -moz-transition:all .4s; -ms-transition:all .4s; transition:all .4s;}
    .transition:hover, .transition:focus, .transition:active, a:hover, a:focus, a:active, .button {-webkit-transition:all .4s; -moz-transition:all .4s; -ms-transition:all .4s; transition:all .4s;}
    .transition-slow {-webkit-transition:all 1s; -moz-transition:all 1s; -ms-transition:all 1s; transition:all 1s;}

    .default-button {border-radius: 0; font-size: 13pt; margin: 20px 0; border: 0; padding: 12px 30px; }
    .buttons {margin-top:25px;}
    .button {position:relative; text-transform:uppercase; font-size:9pt; font-weight:500; border-radius:0; padding:15px 35px; border:2px #222 solid; /*color:#222;  background:#fff;*/ color:#fff; background:#9E562C; border-color:#9E562C;}
    .button:hover {background:#aa6b47; border-color:#aa6b47; color:#fff;}

    h1 {font-size:45pt; text-transform:uppercase; color:#9E562C;}
    .filter {position:absolute; top:0; bottom:0; left:0; right:0; background:rgba(0,0,0,0.4);}

    /* ROW FLEX */
        .eq-height {display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; flex: 0 1 auto; align-content: center; justify-content: center;}
        .el-eq-height {display: flex;}
        /* esempio 

                <div class="container">
                    <div class="row eq-height">
                        <div class="col-sm-6 el-eq-height">
                            <div class="v-center">
                                <div>
                                    <h2 class="title">Hotel</h2>
                                    <p>Garn� a conduzione familiare situato in zona tranquilla di fronte al Monte Colodri. Casa ideale per un pubblico sportivo che pratica l'<strong>arrampicata alpina, l'arrampicata sportiva, le vie ferrate, il trekking, la bicicletta</strong> (mountain bike e bici da corsa), torrentismo, nordic walking, vela, wind surf.<br />Giardino con piscina e parcheggio. Tutte le stanze sono con bagno e balcone. Piscina, parcheggio, deposito biciclette e wi-fi sono gratuiti.</p>
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-6 el-eq-height">
                            <a href="/assets/images/hotel.jpg" rel="photobox[g]" data-caption="Hotel Garden - Arco" class="a-img">
                                <img src="/assets/images/hotel-s.jpg" alt="Hotel Garden - Arco" class="img-responsive">
                                <span class="hover transition-slow">
                                    <span class="enlarge">
                                        <i class="far fa-external-link-alt"></i>
                                    </span>
                                </span>
                            </a>
                        </div>
                    </div>
                </div>
        */
        .v-center {display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; flex: 0 1 auto; align-items: center; /*justify-content: center;*/ z-index: 1;}

/* HEADER */
    header {position: relative; height:400px;background:none; padding: 20px;border:0;}
        #hotel header {height:700px;}
        #gallery header {background:url('/assets/images/top/gallery.jpg') no-repeat center center; background-size:cover;}
        #prezzi header {background:url('/assets/images/top/prezzi.jpg') no-repeat center center; background-size:cover;}
        #contatti header {background:url('/assets/images/top/contatti.jpg') no-repeat center bottom; background-size:cover;}
    #top {position:relative;}
    #arrow-down {text-align: center;padding: 0;margin:0 auto;display: inline-block;position: absolute;bottom:-10px;display: none;}
    #home #arrow-down {display: initial;}
    /* navbar */
    #navbar {position: absolute; top:auto; bottom:0; left:0; width:100%; min-height:unset; margin:0; padding:0px; background:#9E562C; border:0; border-radius:0; text-align:center; z-index:20;}
    #navbar #box_menu {padding:0; margin:0;}
    #navbar #menu {background:transparent; float: none!important;}
    #navbar #menu li {float:none; display:inline-block;padding-left:10px;padding-right:10px;}
    #navbar #menu li a {color:#fff;padding:20px 20px; font-size:14pt; text-transform:uppercase; background:none !important; letter-spacing: 2px; font-weight:600;}
    #navbar #menu li a:hover, #navbar #menu li.active a {color:rgb(0, 0, 0);}
	#navbar #menu li a:after {-webkit-transition:all .4s; -moz-transition:all .4s; -ms-transition:all .4s; transition:all .4s;}
	#navbar #menu li a:hover:after, #menu li.active a:after {display: none; content: ''; position: absolute; bottom:0px; left:calc(50% - 35px); width:70px; height:2px; background:#9E562C; z-index:-1}
	
    #navbar #menu li.ico {padding-left:0; padding-right:0;}
	#navbar #menu li.ico a {padding-left:5; padding-right:5; font-size:20pt; position:relative; top:3px;}
	/* language menu */
        #navbar #menu li#language-menu {border-left:1px #fff solid; margin-left:20px;}
        #navbar #menu li#language-menu ul li a {font-size:9pt; padding:9px 0px;}

	/* logo */
    #navbar .navbar-brand {padding: 0 0 0 30px;height: auto;}
    #navbar .navbar-header {margin:0;}
    #navbar .navbar-header .navbar-brand {display:none; margin:0;padding: 0;}
    #navbar #box_menu .navbar-brand img {margin:0 auto;}

    /* jumbotron */
        .jumbotron {height: 100%; background:none; padding:60px 0 0 0; margin: 0; text-align:center; position:relative;}
            #hotel .jumbotron {padding: 200px 0 0 0;}
        .jumbotron a {position:relative; display:inline-block; color:#fff; font-weight:400; font-size:80pt; line-height:80px;}
        .jumbotron a img {max-width:90%; width:450px;}
            #hotel .jumbotron a img {max-width:90%; width:600px;}    
        /*
        .jumbotron a {position:relative; display:inline-block; color:#fff; font-weight:400; font-size:80pt; line-height:80px;}
        .jumbotron a span {font-size:70pt; font-weight:100;}
            
            #hotel .jumbotron a {font-size:90pt; line-height:100px;}
            #hotel .jumbotron a span {font-size:80pt;}
        */
    
    #main-slider {position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: transparent; z-index: -1;}
    #main-slider .owl-stage-outer, #main-slider .owl-stage, #main-slider .owl-item, #main-slider .item {width: 100%; height: 100%; background-size: cover; background-position: center center; background-repeat: no-repeat;}
    #main-slider .item {background-position:center center; background-size:cover;}

/* AFFIX */
@media (min-width: 768px) {
    #navbar.affix {position: fixed; top: 0!important; bottom: auto; background:#333;}

    /* logo affix */
        #navbar.affix .navbar-header {display:inline-block; margin:0; padding:0;}
        #navbar.affix .navbar-header .navbar-brand {margin:0; padding:0; width:auto; display:block; font-size:20pt; color:rgba(255,255,255,0.9);}
        #navbar.affix .navbar-header .navbar-brand img {display: block; height: 50px; margin-top: 5px;}
        #navbar.affix #menu {float: right!important; width:auto;}
        #navbar.affix #menu li a, #navbar.affix #menu li a:focus {color: rgba(255,255,255,0.9);}
        #navbar.affix #menu li a:hover, #navbar.affix #menu li.active a {color:#9E562C;}
	/* language menu */
        #navbar.affix #menu li#language-menu {display:none;}

}
    
/* slider TOP */
    #slider_top {height:100%; z-index:10;display: block;}
    #slider_top .owl-stage-outer,
    #slider_top .owl-stage-outer .owl-stage,
    #slider_top .owl-stage-outer .owl-stage .owl-item,
    #slider_top .owl-stage-outer .owl-stage .owl-item .item {height:100%;}

/* MIDDLE */
    main {padding:80px 0 80px 0; position:relative; z-index:0;}
		#gallery main {padding-bottom:0;}
    section {position:relative;}
    #middle #texture-climb {position:absolute; top:0; left:0; opacity:0.1; height:130%;}
    #gallery #middle #texture-climb {display:none;}
    #contatti #middle #texture-climb {height:100%;}
    main p {margin:0;}
    h1.title {margin:0; padding:0; text-align:center; font-size:70pt; font-weight:700; line-height:40px; color:#9E562C; margin-bottom:100px;}
    h1.title span {color:rgba(158, 86, 44,0.2); text-transform:lowercase; font-size:80pt;}
    h2.title {display:inline-block; color:#bf7f59; font-weight:700; padding:0 0 5px 0; margin-bottom:30px; font-size:45pt; text-transform:uppercase; border-bottom:4px dashed #bf7f59;}
    /* link su immagini*/
        .a-img {display:block; position:relative; overflow:hidden;}
        .a-img .hover {position:absolute; bottom:0; left:0; width: 100%; height: 100%; /*background:rgba(51,74,17,0.8);*/ background:url('/images/texture.png'); text-align:left; opacity:0;}
        .a-img .hover .enlarge {background:transparent; padding:0; line-height: 1; color:#9E562C; font-size:30pt; position:absolute; bottom:30px; left:30px;}
        .a-img:hover .hover {opacity:0.8;}
        /* gallery */
            #sec-gallery .col-gallery {margin-bottom:30px;}
            #sec-gallery .container-fluid {padding:0 30px;}
            #sec-gallery .a-img .hover .enlarge {bottom:20px; left:20px; font-size:25pt;}

       /* contatti */
       #sec-contatti .row {margin-top:20px;}
       #contatti .form-custom {border-radius:0px; box-shadow:none; margin-bottom: 10px;color:#5F5F5F;height: 50px; border-color: #e6e6e6; padding: 0 25px; font-weight: 400; }
       #contatti .form-custom:focus {box-shadow:none;}
       #contatti .form-custom::-webkit-input-placeholder {letter-spacing: 1px;  font-weight: 500;color:rgb(187, 187, 187)}
       #contatti .form-custom::-moz-placeholder {letter-spacing: 1px;  font-weight: 500;color:rgb(187, 187, 187)}
       #contatti .form-custom:-ms-input-placeholder {letter-spacing: 1px;  font-weight: 500;color:rgb(187, 187, 187)}
       #contatti .form-custom:-moz-placeholder {letter-spacing: 1px;  font-weight: 500;color:rgb(187, 187, 187)}
       #contatti textarea.form-custom {height: auto; max-width: 100%; min-width: 100%; padding: 25px;}
       #contatti p {font-size: 11pt; color:#5F5F5F}
       #contatti form a {color: #9E562C;}
       #contatti form a:hover {color: #777;}
       #contatti .invia {padding: 10px 30px;}
       .no-padding-left {padding-left:0;}
    /* prezzi */
        .no-border {border:0!important;}
        #sec-prezzi .content-table {border:2px solid #9E562C;margin-bottom: 20px;padding: 15px;}
        #sec-prezzi .table {margin-top:20px;}
        #sec-prezzi .dida {text-transform: uppercase;color: #58801E;font-size: 15pt;margin-top:20px;}
        #sec-prezzi .table thead th {border-width:1px!important;}
        #sec-prezzi .table tr td,
        #sec-prezzi .table tr th {text-align: center;}
/* FOOTER */
        footer {position:relative; z-index:10;}
        footer section {padding:50px 0; background:url('/images/texture.png');}
        footer .filter {background:rgba(255,255,255,0.5);}
        footer h2 {margin-bottom:20px; font-size:40pt; color:#9E562C;}
        footer p {color:#333;}
        footer a, footer a:visited, footer a:focus {color: #9E562C;line-height: 1.5em;text-decoration: none;font-size: 13pt;}
        footer a:hover {color:#333!important;}
        footer #logo-footer {margin-bottom: 40px; width: 400px; max-width: 100%;}

    /* widget TP */
        #widgetTP {color: #ededee; text-align: right; padding:1px 0; font-family: 'Yantramanav', sans-serif; font-weight: 500!important; font-size: 10pt!important;}
        #newconcept {padding: 20px!important; font-family: 'Yantramanav', sans-serif; font-weight: 500!important; font-size: 10pt!important; color: #fff;text-align: center !important; line-height: 1!important; background:#9E562C;}
        #newconcept a {color: #fff; font-family: 'Yantramanav', sans-serif; font-size:10pt!important;text-align: center;}
        #newconcept a#link_privacy {margin-right: 5px; font-weight: 500!important; border-right:1px #fff solid; padding-right:10px;}
        #newconcept br {display: none;}
        .conceptlink { color:#fff; font-family: 'Yantramanav', sans-serif; font-weight: 500!important; font-size: 8pt!important;}

/* MODAL CENTER */
    #dialog-confirm .modal-dialog {width:40%; display: inline-block; vertical-align: middle;background:none;}
    #dialog-confirm .modal-content {background: rgba(51,51,51,0.9);color: #fff;border:0;padding: 25px;}
    #dialog-confirm .modal-content .modal-title {text-transform: uppercase;letter-spacing: 2px;}
    #dialog-confirm .modal-header {border:0;}
    #dialog-confirm .modal-footer {display: none;}
    #dialog-confirm .close {color: #fff;opacity: 1;}
    #dialog-error .modal-dialog, #dialog-privacy .modal-dialog {width:55%; display: inline-block; vertical-align: middle;}
    #dialog-error .modal-body, #dialog-confirm .modal-body, #dialog-privacy .modal-body { padding: 30px;}
    #dialog-privacy iframe {width:100%; height:500px;}
    #dialog-privacy, #dialog-error, #dialog-confirm {text-align: center; padding: 0!important;}
    #dialog-privacy::before, #dialog-error::before, #dialog-confirm::before {content: ''; display: inline-block; height: 100%; vertical-align: middle; margin-right: -4px;}
    #dialog-privacy .modal-footer .btn, #dialog-error .modal-footer .btn, #dialog-confirm .modal-footer .btn {display: block; margin: 0 auto; width: 30%;}


/* PSWP */
    .pswp__caption__center {text-align: center;color:#fff;text-transform: uppercase;letter-spacing: 2px;}

@media (max-width:1399px) {
    body {border: 3px solid violet;}

    /* HEADER */
    /* MIDDLE */
    /* FOOTER */
    
}
@media (max-width:1299px) {
    body {border: 3px solid orange;}

    /* HEADER */

    /* MIDDLE */
        /* sec-gallery */
            .box-img a span:before, .box-img a span:after {width:60px; height:60px;}
    /* FOOTER */
    
}

@media (max-width:1199px) {
    body {border:3px solid green;}
    
    /* HEADER */

    /* MIDDLE */

    /* FOOTER */
        
}

@media (max-width:991px) {
	body {border:3px solid blue;}
   
    /* HEADER */
		#navbar #menu li a {letter-spacing: 1px; padding:20px 10px;}
    /* MIDDLE */
        main {padding:50px 0;}
        /* sec content */
            .content {margin-bottom:30px;}
            .sec-content .box-txt {padding-top:20px;}
            .sec-content .box-img {margin-top:40px;}
/* FOOTER */
        
}

@media (max-width:767px) {
	body {border:3px solid red;}
    h1 {font-size:50pt;}
    /* HEADER */
    header {height:300px}
    #hotel header {height:500px;}
    #navbar {background: transparent; border-bottom: none; position: fixed; top:0; left:0; bottom:auto; padding: 10px 15px!important; z-index: 20;}
    #navbar .navbar-toggle {background:#9E562C; border-radius:0; margin-right:0; padding:12px 10px;}
    #navbar .navbar-toggle span {background:#fff;}
    #navbar .navbar-brand {padding:0px 0 0 10px!important;}
    #navbar .navbar-header .navbar-brand {display:none;}
    #navbar .navbar-brand img {position:relative; display:inherit; margin-top:0px; height:40px; width:auto; top:0; z-index:20;}
    #navbar #box_menu {margin:0; background:#333; box-shadow:none;}
    #navbar #box_menu .navbar-brand {display:none;}
    #navbar #menu {width:auto; float:none; margin:15px 0; background:transparent;}
    #navbar #menu li {display: block;}
    #navbar #menu li a {font-size:13pt; padding:8px 10px;}
    #navbar #menu li a:hover,  #menu li.active a {color:#9E562C !important;}
    #navbar #box_menu #language {display: none;}
    #navbar #menu li.ico {display:inline-block;}
    
    /* language menu */
        #navbar #menu li#language-menu {border:0; margin:0px; padding:0 30px;}
        #navbar #menu li#language-menu ul {margin:5px 0 0 0; padding:5px 0 0 0; border-top:1px rgba(255,255,255,0.5) solid;}
        #navbar #menu li#language-menu ul li {display:inline-block;}

    /* MIDDLE */
        main .title {margin-bottom:50px;}
        h1.title {font-size: 50pt; line-height: 35px;}
        h1.title span {font-size: 40pt;}
        #hotel .sec-content .a-img {margin-top:40px;}
    /* FOOTER */
       footer i {font-size:30pt; margin:5px 8px;}
       footer iframe {height:350px!important}
}

@media (max-width:600px) {
    body {border:3px solid blue;}
    h1 {font-size:30pt; }
    /* HEADER */
    #hotel header {height:400px;}
    #hotel .jumbotron {padding:40% 0 0 0;}
    .jumbotron #image-top {height: 500px;}
    .jumbotron h1 {font-size: 25pt;letter-spacing: 30px;}

    /* MIDDLE */
        main .title {margin-bottom:30px;}
        h1.title {font-size: 35pt; line-height: 25px;}
        h2.title {font-size:40pt;}
    /* FOOTER */
        
    /* MODAL CENTER */
		#dialog-error .modal-dialog, #dialog-privacy .modal-dialog, #dialog-confirm .modal-dialog {width: 90%;}
        #dialog-privacy iframe {height: 300px;}
        
}

@media (max-width:439px) {
    body {border:3px solid green; font-size:12pt;}
    h1 {font-size:27pt; line-height:22px;}
    /* HEADER */
    .jumbotron #image-top {height: 240px;}
    .jumbotron h1 {font-size: 20pt;letter-spacing: 20px;} 
    /* MIDDLE */
        main p {line-height:22pt;}
        #sec-prezzi .table tr td,
        #sec-prezzi .table tr th {font-size:10pt;}
    /* sec-gallery */
        #sec-gallery .box-img {margin-bottom:20px;}
        #sec-gallery .box-img a {padding:0px;}
        #sec-gallery .box-img a:before,
        #sec-gallery .box-img a span:before {display:none;}

    /* FOOTER */    
        footer iframe {height:300px!important}
}
@media (max-width: 1024px) and (orientation: landscape) {
    header {height:100vh!important;}    
    #hotel .jumbotron {padding: 10% 0 0 0;}
    #hotel .jumbotron a img {width: 400px;}
}
body {border:0!important;}