@font-face {
  font-family: 'icomoon';
  src:  url('icons/fonts/icomoon.eot?sclxd4');
  src:  url('icons/fonts/icomoon.eot?sclxd4#iefix') format('embedded-opentype'),
    url('icons/fonts/icomoon.ttf?sclxd4') format('truetype'),
    url('icons/fonts/icomoon.woff?sclxd4') format('woff'),
    url('icons/fonts/icomoon.svg?sclxd4#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-whatsapp:before {
  content: "\e902";
}
.icon-chat_facebook:before {
  content: "\e903";
}
.icon-facebook:before {
  content: "\e904";
}
.icon-gplus:before {
  content: "\e905";
}
.icon-heart:before {
  content: "\e906";
}
.icon-instagram:before {
  content: "\e907";
}
.icon-linkedin:before {
  content: "\e908";
}
.icon-twitter:before {
  content: "\e909";
}
.icon-youtube:before {
  content: "\e90a";
}
.icon-play:before {
  content: "\e900";
}
.icon-telefone:before {
  content: "\e901";
}

/* Style the Image Used to Trigger the Modal */
.foto {
    cursor: pointer;
    transition: 0.2s;
}



/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 9999; /* Sit on top */
    padding: 30px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

/* Modal Content (Image) */
.modal-content {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
}

/* Caption of Modal Image (Image Text) - Same Width as the Image */
#caption {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

/* Add Animation - Zoom in the Modal */
.modal-content, #caption {
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}
/*
@-webkit-keyframes zoom {
    from {-webkit-transform:opacity(0)}
    to {-webkit-transform:opacity(1)}
}

@keyframes zoom {
    from {transform:opacity(0)}
    to {transform:opacity(1)}
}*/

/* The Close Button */
.close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
}

.close:hover,
.close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
    .modal-content {
        width: 100%;
    }
}
/* Overlay style */
.overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 77777;
  background-color: rgba(0,0,0,0.9);
}

/* Overlay closing cross */
.overlay .overlay-close {
	width: 24px;
	height: 24px;
	position: absolute;
	right: 20px;
	top: 20px;
	overflow: hidden;
	border: none;
	background: url(libs/menu/img/cross.png) no-repeat center center;
	text-indent: 200%;
	color: transparent;
	outline: none;
	z-index: 100;
}

/* Menu style */
.overlay nav {
	width: 90%;
	text-align: left;
	position: relative;
	top: 50%;
	height: 60%;
	font-size: 18px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	padding: 30px;
	margin: 0 auto;
}

.overlay ul {
	list-style: none;
	padding: 0;
	margin: 0 auto;
	display: inline-block;
	height: 100%;
	position: relative;
	color: #fff;
}

.overlay ul li {
	display: block;
	height: 10%;
	height: calc(100% / 8);
	min-height: 34px;
	margin-bottom: 10px;
	padding-bottom: 20px;
	color: #fff;
}

.overlay ul a {
	display: block;
	color: #fff;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
}

.overlay ul li a:hover,
.overlay ul li a:focus {
	color: #fff;
}

/* Effects */
.overlay-hugeinc {
	opacity: 0;
	visibility: hidden;
	-webkit-transition: opacity 0.5s, visibility 0s 0.5s;
	transition: opacity 0.5s, visibility 0s 0.5s;
}

.overlay-hugeinc.open {
	opacity: 1;
	visibility: visible;
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
}

.overlay-hugeinc nav {
	-webkit-perspective: 1200px;
	perspective: 1200px;
}

.overlay-hugeinc nav ul {
	opacity: 0.4;
	-webkit-transform: translateY(-25%) rotateX(35deg);
	transform: translateY(-25%) rotateX(35deg);
	-webkit-transition: -webkit-transform 0.5s, opacity 0.5s;
	transition: transform 0.5s, opacity 0.5s;
}

.overlay-hugeinc.open nav ul {
	opacity: 1;
	-webkit-transform: rotateX(0deg);
	transform: rotateX(0deg);
}

.overlay-hugeinc.close nav ul {
	-webkit-transform: translateY(25%) rotateX(-35deg);
	transform: translateY(25%) rotateX(-35deg);
}

@media screen and (max-height: 30.5em) {
	.overlay nav {
		height: 70%;
		font-size: 34px;
	}
	.overlay ul li {
		min-height: 34px;
	}
}

.is-active{
	opacity: 0;
}