@import url('https://fonts.googleapis.com/css?family=Cormorant+Garamond:400,500,600,700');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800');

body, html {
  height: 100%;
  margin: 0;
}

body{
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  line-height: 1.5em;
  color: #fff;
  background-color: #828282;
}

main{
  margin-top: 120px;
}

p{
  font-family: 'Open Sans', sans-serif;
  color: #FFF;
  font-size: 15px;
  font-weight: 300;
  margin-top: 30px;
}

a:focus, a:hover{
  text-decoration: none;
}

h1,h2,h3,h4,h5,h6{
  margin: 0;
  padding: 0;
  font-weight: 500;
}

h1{
  font-size: 32px;
  color: #fff;
}

@media (max-width: 767px){
  h1{
    font-size: 38px;
    line-height: 1.1em;
  }
}

h2{
  font-size: 40px;
}

h3{
  font-size: 24px;
  color: #fff;
}

h4{
  font-size: 30px;
  font-family: 'Open Sans', sans-serif;
  color: #FFF;
  font-weight: 300;
}

@media (max-width: 767px){
  h4{
    margin-top: 20px;
  }
}

h5{
  font-size: 20px;
  font-family: 'Open Sans', sans-serif;
  color: #9B9B9B;
  font-weight: 300;
  margin-bottom: 20px;
}

h6{
  font-size: 16px;
  font-family: 'Open Sans', sans-serif;
  color: #9B9B9B;
  font-weight: 400;
  margin-top: 20px;
}

h6.dida{
  font-size: 14px;
  font-family: 'Open Sans', sans-serif;
  color: #9B9B9B;
  font-weight: 400;
  margin-top: 20px;
}

header{
  z-index: 1001;
  height: 130px;
  padding: 20px;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
/*
  background: -moz-linear-gradient(top, rgba(51,51,51,1) 0%, rgba(51,51,51,0) 100%);
  background: -webkit-linear-gradient(top, rgba(51,51,51,1) 0%,rgba(51,51,51,0) 100%);
  background: linear-gradient(to bottom, rgba(51,51,51,1) 0%,rgba(51,51,51,0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333', endColorstr='#00333333',GradientType=0 );
*/
}

/* LOGO */

.logo-vago {
  display: inline-block;
  width: 120px;
  height: 90px;
  text-align: left;
  text-indent: -5000px;
  overflow: hidden;
  background: transparent url(../../img/Site/logo_vago_white.png) 0 0 no-repeat;;
  background-size: 100% 100%;
}

a.close-detail{
  line-height: 80px;
  font-weight: 300;
  font-size: 30px;
  color: #fff;

  float: right;

}

.gallery-detail{
  width: 100%;
  height: 700px;
  overflow: hidden;
}

.gallery-item{
  height: 700px;
  background-color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

@media(max-width:767px){
  .gallery-detail{
    height: 400px;
  }

  .gallery-item{
    height: 400px;
  }
}

img.gallery-detail-item{
  width: auto;
  display: block;
  margin: 0 auto;
  height: 100%;
  /*max-width: 100%;*/
}

.share-social{
  margin: 10px 0;
}

.share-social p{
  font-family: 'Open Sans', sans-serif;
  color: #fff;
  font-size: 14px;
  display: inline-block;
  margin-right: 10px;
}

a .shi-icon{
  display: inline-block;
  color: #fff;
  font-size: 14px;
  margin: 0 10px;
}


.detail-works{
  margin: 60px 0;
  padding-bottom: 50px;
  border-bottom: 1px solid #fff;
}


@media (max-width: 767px){
  .detail-works{
	  margin: 50px 0;
	  padding-bottom: 25px;
	  border-bottom: 1px solid #fff;
	}
}



a.box-works{
  width: 100%;
  height: 100%;
  display: block;

  margin: 30px 0;

  -webkit-animation: fadein 3s; /* Safari, Chrome and Opera > 12.1 */
  -moz-animation: fadein 3s; /* Firefox < 16 */
  -ms-animation: fadein 3s; /* Internet Explorer */
  -o-animation: fadein 3s; /* Opera < 12.1 */
  animation: fadein 3s;
}

@keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.img-box-works{
  width: 100%;
  height: auto;
}

.info-works{
  padding: 20px 0 40px 0;
}

a .info-works h3{
  color: #fff;
}

a.box-works:hover{

  -moz-transition: .5s;
  -webkit-transition: .5s;
  transition: .5s;
}


/* Zoom In #1 */
.hover01 figure img {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.hover01 figure:hover img {
	-webkit-transform: scale(1.05);
	transform: scale(1.05);
}

@media (max-width: 991px){
  .hover01 figure img {
  	-webkit-transform: scale(1);
  	transform: scale(1);
  	-webkit-transition: none;
  	transition: none;
  }
  .hover01 figure:hover img {
  	-webkit-transform: scale(1);
  	transform: scale(1);
  }
  }