/*****************************************
	  
	  CSS AGGIUNTO

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

p a{
	font-weight: bold;
}

@font-face { 
	font-family: tangerine; 
	src: url("fonts/Tangerine_Regular.ttf"); 	
}

@font-face { 
	font-family: tangerine; 
	src: url("fonts/Tangerine_Bold.ttf");
	font-weight: bold; 	
}


.title_elegant{
	font-family: tangerine;
	font-size: 5.3em;
}

@media (max-width: 991px){
	.title_elegant{
		font-family: tangerine;
		font-size: 3.3em;
	}
}

.title_elegant a:hover{
	text-decoration: none;
}
	
/* Ombra testo titoli su foto */
.ombra_testo{
	text-shadow: 2px 2px 2px rgba(0, 0, 0, 1);
}

/* background sezioni con parallax */

/* sezione home citazione in homepage */

#section_sfondo_chiaro {
	background: url(../struttura/sfondi/sfondo-chiaro.png) no-repeat center center fixed; 
	display: table;
	height: 70%;
	position: relative;
	width: 100%;
	background-repeat: repeat;
}

#section_sfondo_foto {
	display: table;
	height: 70%;
	position: relative;
	width: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	color: #FFF;
}


/* correggere la larghezza impostata nella media query */
/* questa regola imposta la giusta dimensione delle fotone per vista smartphone */
@media (max-width: 500px) {
	#section_sfondo_chiaro, #section_sfondo_foto{
        background-attachment: scroll;
	}
}





/* body{
	background: url('../struttura/sfondi/sfondo-chiaro.png');
} */

/* immagine top delle varie pagine */

.pagine_interne .pagineImage {
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    position: relative;
    min-height: 650px;
}


/* bottone prenotazioni */

.header_menu .navbar-nav li.bookatable a, .header-inner.fix .header_menu .navbar-nav li.bookatable a{border:1px solid #3e3e40; display:inline; line-height:100px; 
padding:8px 22px; transition: all 0.3s;}

.header_menu .navbar-nav li.bookatable a{border:1px solid #3e3e40;}

.header_menu .navbar-nav li.bookatable a:after{display:none;}

.header_menu .navbar-nav li.bookatable a:hover, .header_menu .navbar-nav li.bookatable a.active{
background-color:#3e3e40; color:#ffffff;}




.bookatable a, .bookatable a{border:1px solid #3e3e40; display:inline; line-height:100px; 
padding:8px 22px; transition: all 0.3s; color: #3e3e40;}

.bookatable a{border:1px solid #3e3e40;}

.bookatable a:after{display:none;}

.bookatable a:hover{
background-color:#3e3e40; color:#ffffff; text-decoration:none;}


.bookatable_footer a, .bookatable_footer a{border:1px solid #f2e9da; display:inline; line-height:100px; 
padding:8px 22px; transition: all 0.3s; color: #f2e9da;}

.bookatable_footer a{border:1px solid #f2e9da;}

.bookatable_footer a:after{display:none;}

.bookatable_footer a:hover{
background-color:#f2e9da; color:#3e3e40; text-decoration:none;}




/* foto homepage */
.HomeImage {
    background-repeat: no-repeat;
    background-size: 100%;
    /* background-size: cover; */
    /*background-attachment: fixed;*/
    position: relative;
    min-height: calc(100vh - 97px);
    background-position: center center;
}

.HomeImage2 {
    background-repeat: no-repeat;
    background-size: 100%;
    /* background-size: cover; */
    /*background-attachment: fixed;*/
    position: relative;
    min-height: calc(100vh - 97px);
    background-position: center center;
}

.HomeImage_static {
    background-repeat: no-repeat;
    background-size: 100%;
    background-size: cover;
    background-attachment: fixed;
    min-height: 650px;
	position: relative;
    background-position: center center;
}

.HomeImageMobile {
    background-repeat: no-repeat;
    background-size: 100%;
    /* background-size: cover; */
    /*background-attachment: fixed;*/
    position: relative;
    min-height: 300px;
    background-position: center center;
}

.page-header {
    text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    color:#fff;
    padding:200px 0;
	border-bottom: none;
}

/* menu */




/* Questa regola rende il menu scrollabile quando il menu è fixed-top su mobile */
.scrollable-menu {
    height: auto;
    max-height: 450px;
    overflow-x:hidden;
}

@media (min-width: 1200px){

	/* barre grafiche sotto le voci di menu */
	
	.header_menu .navbar-collapse .navbar-nav li a:after, .header_menu .navbar-nav li a:after{background-color:#3e3e40; bottom:25px; content:""; height:2px; left:50%; 
	position:absolute; right:50%; z-index:1; transform:translate3d(0px, 0px, 0px); -webkit-transform:translate3d(0px, 0px, 0px); -moz-transform:translate3d(0px, 0px, 0px);
	-o-transform:translate3d(0px, 0px, 0px); -ms-transform:translate3d(0px, 0px, 0px); transition:all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s; 
	-webkit-transition:all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s; -moz-transition:all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s; 
	-o-transition:all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s; -ms-transition:all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;}

	.header_menu .navbar-nav li a:hover:after{left:10px;right:10px;}
	.header_menu .navbar-nav li a:active:after{left:10px;right:10px;}
	
	.header_menu .navbar-nav li a.active:after{left:10px;right:10px;}

	.dropdown-menu li a:after{display:none;}


	/* apri menu dropdown al passaggio mouse*/
	/* ul.nav li.dropdown:hover ul.dropdown-menu{ display: block; } */

	
	/*****************************************
	  
	DROPDOWN PERSONALIZZATO PER IL MENU

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


	.dropdown ul.dropdown-menu {
		border-radius:4px;
		box-shadow:none;
		margin-top:0;
		min-width:250px;
	}
	.dropdown ul.dropdown-menu:before {
		content: "";
		border-bottom: 10px solid #FFF;
		border-right: 10px solid transparent;
		border-left: 10px solid transparent;
		position: absolute;
		top: -10px;
		left: 16px;
		z-index: 10;
	}
	.dropdown ul.dropdown-menu:after {
		content: "";
		border-bottom: 12px solid #3e3e40;
		border-right: 12px solid transparent;
		border-left: 12px solid transparent;
		position: absolute;
		top: -12px;
		left: 14px;
		z-index: 9;
	}


}






/*****************************************
	  
	  CSS

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



html, body {
	height: 100%;
	width: 100%;
}

hr.grigio{
	border-color: #cdcdcd;
}

.nascondi{
	display:none;
}


/*  img.lazy {
        max-width: 100%;
        display: block;
        
       
        background-image: url('../struttura/loader.gif');
        background-repeat: no-repeat;
        background-position: 50% 50%;
    } */
	


/* .lazyload {
    opacity: 0;
	transition: opacity 300ms;
	-webkit-transition: opacity 300ms;
} */

.lazyloading {
    opacity: 1;
    transition: opacity 300ms;
	-webkit-transition: opacity 300ms;
    background: #f7f7f7 url(../struttura/loader.gif) no-repeat center;
}


.titolo-home{
	font-size: 4.5em;
    font-weight: 700;
    margin: 0;
    padding: 0;
}


/* testo centrato verticalmente ed orizzontalmente*/
.text-vcenter {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}
.text-vcenter h1 {
	font-size: 4.5em;
	font-weight: 700;
	margin: 0;
	padding: 0;
}


.pad-section {
	padding: 50px 0;
}


  .vertical-align {
  display: flex;
  flex-direction: row;
}

.vertical-align > [class^="col-"],
.vertical-align > [class*=" col-"] {
  display: flex;
  align-items: center;
  /* justify-content: center;  Optional, to align inner items 
                              horizontally inside the column */
}

.well{
	min-height: 189.83px;
}


body{
	padding-top:100px;
}

p>img{
    max-width: 100%;
    height: auto;
	}

/* Questa regola gestisce le immagini nei div contenuto che sono div che racchiudono i contenuti dinamici degli articoli */
.contenuto img{
    max-width: 100%;
    height: auto;
	}
/*****************************************
	  
	  TESTATA

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

/* logo brand */
.navbar-brand>img {
    max-height: 50px;
}

/*****************************************
	  
	  CONTENUTI

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


/*****************************************
	  
	  COLONNA 

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

/*****************************************
	  
	  MENU

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

@media (min-width: 768px) {
    .navbar .navbar-nav {
        display: inline-block;
        float: none;
        vertical-align: top;
    }

    .navbar .navbar-collapse {
        text-align: center;
    }
}


.affix {
	top:0;
	width: 100%;
	z-index: 9999 !important;
	-webkit-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
	/*     background-color: #337ab7;
	border-color: #337ab7; */
}
.affix a {
	/* color: #fff !important; */
	padding: 15px !important;
	-webkit-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
}
.affix-top a {
	padding: 25px !important;
}

.affix ~ .container{
	position: relative;
	top: 50px;
}

/* Small devices (tablets, 768px and up) */
@media (max-width: 767px){ 

a.navbar-brand {
    padding: 15px !important;
}
}


.navbar {
	margin-bottom: 0px;
}



.dropdown-menu>li>a{
	padding: 5px 20px !important;
}

.dropdown-menu>li.logo>a:before{
	/* content: url(../struttura/fotografo_napoli_W20X20.png); */
	padding-right: 3px;
}

.dropdown-menu>li.logo>a:hover:before{
	/* content: url(../struttura/fotografo_napoli_20X20.png); */
	padding-right: 3px;
}

.navbar-brand {
    padding: 25px 15px;
}


/*****************************************
	  
	  FOOTER

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

.testo-bianco{
	color: #FFF;
}

a.testo-bianco:hover{
	text-decoration: none;
}


.testo-ocra{
	color: #f2e9da;
}

a.testo-ocra:hover{
	text-decoration: none;
}

/*****************************************
	  
	  FORM CONTATTI

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


/*****************************************
	  
	  MENU A DISCESA

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

/****************************
*
*	MARGINI utilizzabili (possono essere implementati aggiungendo regole ad hoc)
*
****************************/

/* Vertical Offset Top */

.vert-offset-top-4{
    margin-top: 4em;
}
.vert-offset-top-3{
    margin-top: 3em;   
}
.vert-offset-top-2{
    margin-top: 2em;
}
.vert-offset-top-1{
    margin-top: 1em;
}
.vert-offset-top-0{
    margin-top: 0em;
}
/* Vertical Offset Bottom */

.vert-offset-bottom-4{
    margin-bottom: 4em;
}
.vert-offset-bottom-3{
    margin-bottom: 3em;
}
.vert-offset-bottom-2{
    margin-bottom: 2em;
}
.vert-offset-bottom-1{
    margin-bottom: 1em;
}
.vert-offset-bottom-0{
    margin-bottom: 0em;
}



/*********************************
*
*	EFFETTO FADE carousel
*
*********************************/   

.carousel-fade .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
  opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}

.carousel-fade .carousel-control {
  z-index: 2;
}


@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}


/*****************************************
	  
	BOTTONE TORNA SU

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

#top{
    width:100px;
        border:1px solid #f2e9da;
		background: #3e3e40 url(../struttura/to-top.svg) no-repeat center 50%;
        text-align:center;
        padding:5px;
        position:fixed;

        cursor:pointer;
        display:none;
        color:#FFF;
        font-family:verdana;
        font-size:12px;
		    height: 40px;
    width: 40px;
    right: 30px;
    bottom: 30px;
}

/* Small devices (tablets, 768px and up) */
@media (max-width: 767px){ 
	#top{
    width:100px;
        border:1px solid #f2e9da;
		background: #3e3e40 url(../struttura/to-top.svg) no-repeat center 50%;
        text-align:center;
        padding:5px;
        position:fixed;
		opacity: 0.65;

        cursor:pointer;
        display:none;
        color:#FFF;
        font-family:verdana;
        font-size:12px;
		    height: 40px;
    width: 40px;
    right: 10px;
    bottom: 10px;
}
}

a:hover{
	text-decoration: underline;
}

/*****************************************
	  
	 FINE CSS

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



/*****************************************
	  
	Img google recaptcha

******************************************/
	.grecaptcha-badge{
		display:none;
	}

	

/* effetto immagine Bianco e nero su hover mouse */
.bw {
  -webkit-transition: all 1s ease;
     -moz-transition: all 1s ease;
       -o-transition: all 1s ease;
      -ms-transition: all 1s ease;
          transition: all 1s ease;
}

.bw:hover {
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-o-filter: grayscale(100%);
}


/****************************
*
*	FIX per IOS (spunta-sottomenu)
*
****************************/
.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px solid;
    border-top: 4px solid \9;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}


.has-feedback label~.form-control-feedback {
    right: 10px;
}

/****************************
*
*	FIX per STAMPA
*
****************************/
@media print {
    a:link:after, a:visited:after {  
      display: none;
      content: "";    
    }
}