/*===============================================*/
/* 09. PHOTO ITEM								 */
/*===============================================*/
.photo-item {
	position:relative;
	overflow:hidden;
}

.photo-item.frame-border {
	/* background-color:#d0a9cf33;  */
	/* background-color:#fdf6f1; 
	border:18px solid #fdf6f1; */
}

/* ----------------------------------------------*/
/* 09.1 Image 									 */
/* ----------------------------------------------*/
.photo-item img {
	width:100%;
}

/* ----------------------------------------------*/
/* 09.2 Layer 								 	 */
/* ----------------------------------------------*/
.photo-item .layer {
	position: absolute; 
	margin: auto;
	top: 0; 
	right: 0; 
	bottom: 0;
	left: 0;
	width:100%;
	height:100%;
}

.photo-item .layer.wh100{
	width:100%;
	height:100%; 
}

.photo-item .layer.wh95{
	width:95%;
	height:95%; 
}


/* 09.2.1 Layer : Second Image   				 */
/* ----------------------------------------------*/
.photo-item .layer.second-image{
	opacity: 0; 
}


/* 09.2.2 Layer : Black Overlay  				 */
/* ----------------------------------------------*/
.photo-item .layer.opacity-black-overlay{
	background-color: rgba(0, 0, 0, 0.4);
	opacity: 0.3; 
}

.photo-item .layer.hidden-black-overlay{
	background-color: rgba(0, 0, 0, 0.4);
	opacity: 0; 
}

/* 09.2.3 Layer : Photo Caption  				 */
/* ----------------------------------------------*/
.photo-item .layer.photo-caption{
	opacity: 1; 
}

.photo-item .layer.hidden-photo-caption{
	opacity: 0; 
}

.photo-item .layer.border-photo-caption{
	opacity: 1;
	/* border:1px solid #FFF;  */
}

.photo-item .layer.hidden-border-photo-caption{
	opacity: 0;
	/* border:1px solid #FFF;  */
}

/* 09.2.4 Layer : Icon / Button Link		 	 */
/* ----------------------------------------------*/
.photo-item .layer.link{
	opacity: 1;
}

.photo-item .layer.hidden-link{
	opacity: 0;
}

.photo-item:hover .layer.hover-animation.fade-in{
	opacity: 0; 
}

.photo-item:hover .layer.hover-animation.half-fade-in{
	opacity: 0.3; 
}

.photo-item:hover .layer.hover-animation.fade-out{
	opacity: 0; 
}

/* ----------------------------------------------*/
/* 09.3 on Hover Animation					 	*/
/* ----------------------------------------------*/
.photo-item img.hover-animation, .photo-item:hover img.hover-animation{
	-webkit-transition: all 0.5s; 
		-ms-transition: all 0.5s;
		 -o-transition: all 0.5s;
			transition: all 0.5s;
	/*The transition will be disabled on script.js for tablet/mobile*/		
}

.photo-item .layer.hover-animation, .photo-item:hover .layer.hover-animation {
	-webkit-transition: all 0.5s; 
		-ms-transition: all 0.5s;
		 -o-transition: all 0.5s;
			transition: all 0.5s;
	/*The transition will be disabled on script.js for tablet/mobile*/	
}

/* 09.3.1 on Hover Animation Duration		 	 */
/* ----------------------------------------------*/
.photo-item:hover .layer.hover-animation.duration1,
.photo-item:hover img.hover-animation.duration1{
	transition-duration:0.5s;
}

.photo-item:hover .layer.hover-animation.duration2,
.photo-item:hover img.hover-animation.duration12{
	transition-duration:1s;
}

.photo-item:hover .layer.hover-animation.duration3,
.photo-item:hover img.hover-animation.duration3{
	transition-duration:1.5s;
}

.photo-item:hover .layer.hover-animation.duration4,
.photo-item:hover img.hover-animation.duration4{
	transition-duration:2s;
}

.photo-item:hover .layer.hover-animation.duration5,
.photo-item:hover img.hover-animation.duration5{
	transition-duration:2.5s;
}

/* 09.3.2 on Hover Animation Delay		 	 	 */
/* ----------------------------------------------*/
.photo-item:hover .layer.hover-animation.delay1,
.photo-item:hover img.hover-animation.delay1{
	transition-delay:0.5s;
}

.photo-item:hover .layer.hover-animation.delay2,
.photo-item:hover img.hover-animation.delay2{
	transition-delay:1s;
}

.photo-item:hover .layer.hover-animation.delay3,
.photo-item:hover img.hover-animation.delay3{
	transition-delay:1.5s;
}

.photo-item:hover .layer.hover-animation.delay4,
.photo-item:hover img.hover-animation.delay4{
	transition-delay:2s;
}

.photo-item:hover .layer.hover-animation.delay5,
.photo-item:hover img.hover-animation.delay5{
	transition-delay:2.5s;
}


/* 09.3.3 on Hover Zoom In					 	 */
/* ----------------------------------------------*/
.photo-item:hover img.hover-animation.image-zoom-in {
	-webkit-transform: scale(1.1); 
		-ms-transform: scale(1.1);
		 -o-transform: scale(1.1);  
			transform: scale(1.1);		
}

/* 09.3.4 on Hover Zoom In and Rotate	 	 	*/
/* ----------------------------------------------*/
.photo-item:hover img.hover-animation.image-zoom-rotate {
	-webkit-transform: scale(1.1);
		-ms-transform: scale(1.1);
		 -o-transform: scale(1.1);  
			transform: scale(1.1);			
}

/* 09.3.5 on Hover Fade Out				 		 */
/* ----------------------------------------------*/
.photo-item:hover img.hover-animation.image-fade-out {
	opacity:0;
}


/* ----------------------------------------------*/
/* 14.5 Gallery Section							 */
/* ----------------------------------------------*/
#gallery-section{
	/* padding: 140px 0; */
	padding: 50px 0;
}

#gallery-section .photo-item{
	margin-bottom:30px;
}


/* ----------------------------------------------*/
/* 14.5 Gallery Section	WALL INSTAGRAM						 */
/* ----------------------------------------------*/
#gallery-section-wall{
	/* padding: 140px 0; */
	padding: 50px 0;
}

#gallery-section-wall .photo-item{
	margin-bottom:30px;
}



/*****************************************
	  
	  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:50px;
}

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: 25px;
}

/*****************************************
	  
	  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: 12px 15px;
}


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

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

.testo-bianco{
	color: #FFF;
}

a.testo-bianco: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 #d2d2d2;
		background: #2B2E31 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 #d2d2d2;
		background: #2B2E31 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;
}




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

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

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

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





/* 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: "";    
    }
}