/* 
	Theme Name: Danny Cardozo
	Theme URI: http://agutcode.com
	Description: Personal wordpress theme
	Author: Andrés Gutiérrez (@aagutman)
	Author URI: http://agutcode.com
	Tags: Portfolio, Services, Contact
 */

*,
*:after,
*:before {
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}
html{
	margin-top:0 !important;
}
html, body{
	margin: 0;
	padding: 0;
}
html {
	font-size:62.5%;
}
body {
	font:300 16px/1.8 'Futura', sans-serif;
	color:#000;
	letter-spacing: 1px;
	background: #fff;
}
video{
	max-width:100%;
}
.clear:before,.clear:after {
    content:' ';
    display:table;
}
.clear:after {
    clear:both;
}
.clear {
    *zoom:1;
}
img {
	max-width:100%;
	vertical-align:middle;
	height: auto !important;
}
b, strong{
	font-weight:700;
}
h1{
	font-size:2em;
}
h2{
	font-size:1.8em;
}
h3{
	font-size:1.6em;
}
h4{
	font-size:1.4em;
}
h5{
	font-size:1.2em;
}
h6{
	font-size:1em;
}
p{
	font-size: 20px;
	margin: 0 0 22px;
	letter-spacing: .3px;
}
a {
	color:#000;
	text-decoration:none !important;
}
a:hover {
	color:#fedb60;
}
a:focus {
	outline:0;
}
a:hover,
a:active {
	outline:0;
}
ul{
	padding:0;
	margin: 0;
}
input:focus {
	outline:0;
	border:1px solid #04A4CC;
}
.ls-5{
	letter-spacing: 5px;
}
header{
	line-height: 90px;
	background: #ffffff;
}
header h2{
	text-transform: uppercase;
	line-height: 90px;
	font-size: 1.3em;
	letter-spacing: 3px;
	margin: 0;
}
.container{
	margin: 0 auto !important;
}
.logo img{
	max-height: 50px;
}
#mbutton{ 
	width: 20px;
	height: 14px;
	display: inline-block;
	position: relative;
	background: transparent;
	border: none;
	outline:none;
	cursor: pointer;
}
#mbutton .line{ 
	background: #000;
	 width: 100%;
	 height: 2px;
	 position: absolute;
	 display: inline-block; 
	 top: 6px; 
	 left: 0; 
}
#mbutton:before, #mbutton:after{ 
	content: ''; 
	display: inline-block; 
	width: 100%; 
	height: 2px; 
	position: absolute; 
	left: 0; 
	background: #000; 
	transition:0.3s; 
	-ms-transition:0.3s; 
}
#mbutton:before{ 
	top: 0; 
}
#mbutton:after{ 
	bottom: 0px; 
}
.menu-opened #mbutton{ 
	height: 16.26px; 
}
.menu-opened #mbutton:before{ 
	transform: rotate(45deg); 
	transform-origin: top left; 
}
.menu-opened #mbutton:after{ 
	transform: rotate(-45deg); 
	transform-origin: bottom left; 
}
.menu-opened #mbutton .line{ 
	opacity: 0; 
}
header .menu-icon{
	list-style: none;
	padding: 0;
	margin: 0;
}
header .menu-icon li{
	display: inline-block;
	margin-left: 10px;
}
header .menu-icon li a{
	display: inline-block;
	color: #000;
	vertical-align: middle;
}
header .menu-icon li a.icon-mail{
	-webkit-text-stroke: 0.2px #fff;
    font-size: 18px;
}
header nav.main-menu{
	text-align: center;
	position: fixed;
    top: 90px;
    left: 0;
    width: 100%;
    height: calc(100% - 90px);
    background: rgba(0,0,0,0.8);
    z-index: 9999;
    -moz-transform: scale(1.4);
    -ms-transform: scale(1.4);
    -webkit-transform: scale(1.4);
    transform: scale(1.4);
    opacity: 0;
    transition: 0.3s;
    pointer-events: none;
}
.menu-opened header nav.main-menu{
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    pointer-events: all;
}
header nav.main-menu li{
	font-size: 70px;
	line-height: 1.1em;
	margin:15px 0;
}
header nav.main-menu li a{
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 5px;
}
header nav.main-menu li a:hover{
	border-bottom: 1px solid #fff;
}
header nav.main-menu li .sub-menu{
	height: 0;
	overflow: hidden;
	transition: 0.3s;
}
header nav.main-menu li:hover .sub-menu{
	height:75px;
	line-height:55px;
}
header nav.main-menu li .sub-menu li{
	font-size: 22px;
	margin:0 15px;
	display: inline-block;
}
.vc_row{
	margin-left:auto !important;
	margin-right:auto !important;
}
#main{
	position: relative;
    display: block;
    width: 100%;
    padding: 0 7px;
    height: auto;
    overflow: hidden;
}
.single-portfolio main ul{
	text-align: center;
}
.single-portfolio main ul li{
	display: inline-block;
    padding: 5px;
}
.portfolio-item .item-container{
	position: relative;
	padding:7px;
	font-size: 0;
	display: inline-block;
}
.portfolio-item .item-container video{
	max-width: 100%;
}
.portfolio-item .item-container .thumbnail{
	display: inline-block;
}
.portfolio-item img{
	transition: 0.5s;
}
.portfolio-item .entry-header{
	position: absolute;
	color: #fff;
	top: 7px;
	left:7px;
	width: calc(100% - 14px);
	height: calc(100% - 14px);
	background: rgba(0,0,0,0.7);
	opacity: 0;
	transition: .6s;
}
.portfolio-item .entry-header .entry-meta{
	font-weight: normal;
    font-size: 11px;
    margin: 0 0 10px;
    text-transform: uppercase;
}
.portfolio-item .entry-header .entry-title{
	position: absolute;
	top: 50%;
	left:0;
	width: 100%;
	transform: translateY(-50%);
	padding: 0 15px;
	font-weight: normal;
    font-size: 16px;
    margin: 0;
    text-align: center;
} 
.portfolio-item:hover img{
	opacity: 0.3;
}
.portfolio-item:hover .entry-header{
	opacity: 1;
}
#main .loading {
    position: relative;
    display: block;
    width: 100%;
    height: 70px;
    text-align: center;
}
#main .loading img {
    display: inline;
    text-align: center;
    margin-top: 20px;
}
#content {
	position: relative;
	height: auto;
	overflow: hidden;
	padding: 0;
	margin: 0 auto;
	opacity: 0;
	display: block;
	right:0!important;
}
#content.grid {
	height: auto !important;
	font-size: 0;
}
#content.grid .item {
	position: relative !important;
	top:0 !important;
	left:0 !important;
	height: auto;
	margin-right: 0.5%;
	margin-left: 0.5%;
	margin-bottom: 1%;
	float: none;
	overflow: hidden;
	display: inline-block;
	vertical-align: middle;
}
#content.grid .item .inner {
	position: relative;
	width: 100%;
	height: auto;
	overflow: hidden;
}
#content.grid .item .overlay {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	visibility: hidden;
	background: rgba(0, 0, 0, 0.8);
	color: #FFF;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 30px;
	line-height: 36px;
}
#content.grid .item:hover .overlay {
	visibility: visible;
}
#content.grid .item .overlay p {
	margin: 0 20px;
	font-size: 28px;
	line-height: 32px;
	font-family: Arial, sans-serif;
	color: #FFF;position:relative; z-index:9999999;
}
#content.grid .item .overlay p span.subtitle {
	text-transform: none;
}
#content.grid .item img {
	float: left;
	width: 100%;
	height: auto;
	display: block;
}
#content.slider {
	min-height: 500px;
	height: calc(100vh - 91px);
	margin:0 auto;
	right: 0 !important;
	position: relative;
}
#content.slider #toggle{
	right: 0 !important;
}
#content.slider .slide {
	width: 100%;
	height: 100%;
	display: block;
	text-align: center;
}
#content.slider .slide video {
	display: inline;
	max-height: 88%;
	width: auto;
	height: auto;
}
#content.slider .slide img {
	display: inline;
	margin: 0 10px;
	max-height: 88%;
	width: auto;
	height: auto;
	max-width: 90%;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%,-54%);
	-moz-transform: translate(-50%,-54%);
	-ms-transform: translate(-50%,-54%);
	transform: translate(-50%,-54%);
}
#content.slider .slide.multiple img {
	margin: 0 10px;
	max-width: 45%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
#content.slider .slide.multiple img:nth-child(odd) {
	left: auto;
	right:calc(50% + 10px);
}
#content.slider .slide.multiple img:nth-child(even) {
	left:calc(50% + 10px);
}
#content.slider .cycle-prev {
	cursor: pointer;
	position: absolute;
	font-size: 25px;
	top: calc(50% - 50px);
	left: 0;
	z-index: 9999;
}
#content.slider .cycle-prev:before, .prev-portfolio:before {
	content: '\e906';
	color: #888;
	font-family: 'icomoon';
}
#content.slider .cycle-prev:hover:before, .prev-portfolio:hover:before {
	color:#000;
}
#content.slider .cycle-next {
	cursor: pointer;
	position: absolute;
	font-size: 25px;
	top: calc(50% - 50px);
	right: 0;
	z-index: 9999;
}
#content.slider .cycle-next:before, .next-portfolio:before {
	content: '\e900';
	color: #888;
	font-family: 'icomoon';
}
#content.slider .cycle-next:hover:before, .next-portfolio:hover:before {
	color:#000;
}
#content.slider #toggle img{
	padding: 5px;
}
#content.video-container {
	position: relative;
}
#content.video-container .item {
	position: relative;
	display: block;
	float: left;
	width: 224px;
	height: 126px;
	overflow: hidden;
	margin: 0 10px 10px 0;
}
#content.video-container .item .inner {
	position: relative;
	display: block;
	float: left;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
#content.video-container .item:hover .videoPreview {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#main #toggle {
	position: absolute;
	right: 0%;
	top: 0;
	display: block;
	width: 42px;
	height: 64px;
	z-index: 999;
	font-size: 10px;
	line-height: 10px;
	text-transform: uppercase;
	text-align: center;
	cursor: pointer;
}
#main #toggle img {
	max-width: 100%;
	width: auto;
	height: auto;
}
#main #toggle span {
	margin-top: 5px;
	display: block;
	font-size: 10px;
}
#toggle .layout-icon {
	background: url(img/layout-icon.png) no-repeat;
	width: 64px;
	height: 43px;
	-webkit-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	max-width: 100%;
}
#main #toggle {
	position: absolute;
	right: 0%;
	top: 0;
	display: block;
	width: 42px;
	height: 64px;
	z-index: 999;
	font-size: 10px;
	line-height: 10px;
	text-transform: uppercase;
	text-align: center;
	cursor: pointer;
}
#change-view{
	position: absolute;
	right: 0%;
	top: 90px;
	display: block;
	width: 42px;
	height: 64px;
	z-index: 999;
	font-size: 10px;
	line-height: 10px;
	text-transform: uppercase;
	text-align: center;
	cursor: pointer;
}
#change-view a{
	color:#000 !important;
}
#isotope #change-view{
	position: fixed;
	background: #fff;
	top:150px;
	height: auto;
	padding:10px;
	width: 52px;
	box-sizing: border-box;
}
.book-icon{
	display: inline-block;
	background: url(img/book-icon.png) no-repeat;
	width: 40px;
	height: 33px;
	-webkit-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	max-width: 100%;
}
.grid-icon {
	background: url(img/grid-icon.png) no-repeat;
	display: inline-block;
	width: 35px;
	height: 35px;
	-webkit-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	max-width: 100%;
}
.gallery-title {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 10vh;
	line-height: 10vh;
	display: block;
	text-align: center;
	background: rgba(255, 255, 255, 0.8);
	z-index: 1000;
}
.gallery-title h1 {
  text-transform: uppercase;
  color: #000;
  text-align: center;
  vertical-align: middle;
  font-size: 12px;
  margin: 0;
  display: inline-block;
}
.gallery-title .prev-portfolio, .gallery-title .next-portfolio{
	font-size: 12px;
	display: inline-block;
	vertical-align: middle;
	margin: 0 10px;
}
.gallery-title span{
	color: #888;
	vertical-align: middle;
	font-size: 16px;
	display: inline-block;
}
#content.album-page {
	overflow: visible;
}
.item .album-image, .item .album-video {
 	cursor: pointer;
}
.protected-post-form{
    text-align: center;
    width: 100%;
    height: calc(100vh - 91px);
    position: absolute;
    left: 0;
    top: 91px;
    background: url(http://dannycardozo.com/wp-content/uploads/2016/08/20160701_HB_LOOK01_0048fff.jpg);
    background-size: cover;
}
.protected-post-form:before {
    width: 100%;
    height: 100%;
    left: 0;
    content: '';
    background: rgba(0,0,0,0.9);
    position: absolute;
}
form.post-password-form{
	position: absolute;
	top:50%;
	left: 50%;
	max-width:90%;
	width: 550px;
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
}
form.post-password-form input[type=password]{
    padding: 0 10px;
    height: 50px;
    width: 100%;
    font-size: 40px;
    line-height: 1;
    font-weight: lighter;
    border: none;
    color: #FFF;
    border-bottom: 1px solid #fff;
    background: transparent;
}
form.post-password-form input[type=password]::placeholder{
    color: #fff;
}
form.post-password-form input[type=submit]{
    color: #fff;
    background: #000;
    border: 3px solid #000;
    padding: 0 20px;
    display: none;
}
#portfolio-list .thumbnail{
	display: inline-block;
	vertical-align: middle;
	width: 30%;
}
#portfolio-list > div{
	padding-bottom: 20px;
}
#portfolio-list .thumbnail img{
	width: 110px;
	max-width: 100%;
}
#portfolio-list summary{
	display: inline-block;
	vertical-align: middle;
	width: 70%;
}
#portfolio-list summary h2{
	margin: 0;
	font-size: 1.2em;
}
#portfolio-list summary p{
	margin: 0;
	font-size: 1em;
}
.page-template-coming-soon header{
	display: none;
}
.page-template-coming-soon {
	background-image: url('http://dannycardozo.com/wp-content/uploads/2016/08/20160701_HB_LOOK01_0048fff.jpg');
	background-size: cover; 
}
.page-template-coming-soon main{
	background-color: rgba(0,0,0,0.8);
	height: 100vh;
	width: 100%;
	position: relative;
}
.page-template-coming-soon main section{
	display: inline-block;
	text-align: center;
	position: absolute;
	top: 50%;
	left:50%;
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
}
.page-template-coming-soon main img{
	width: 500px;
}
.page-template-coming-soon main h1{
	color: #fff;
	text-transform: uppercase;
	margin-top: 35px;
	font-size: 30px;
    font-weight: lighter;
	letter-spacing: 2px;
	font-weight: 300;
}
.video > a{
	display: inline-block;
	font-size: 0;
}
.video a figure{
	display: inline-block;
	position: relative;
	overflow: hidden;
	margin:0 !important;
}
.video a figure video{
	display: inline-block;
	position: absolute;
	top:0;
	left: 0;
	z-index: -1;
	width: 100%;
}
.video a figure img{
	opacity:1;
	transition: 0.3s;
}
.video a figure:hover img{
	opacity:0;
}
.video h2 {
	padding: 0 0 2rem;
	margin:0;
	font-size: 1.2em;
}
.video h2 a {
	margin:0;
}
.video h2 a:hover{
	color: #444;
}
#video-section{
	width:100%;
	height:calc(100vh - 200px);
}
#video-section video{
	width:100%;
	max-height:100%;
}
#title-section {
	text-align: center;
	padding:25px 0 0;
}
#title-section h1{
	font-weight: 100 !important;
	margin:0 !important;
}
#share-section {
	text-align:left;
}
#nav-section {
	text-align:right;
}
#nav-section a, #share-section a{
	padding: 11px;
    border-radius: 15px;
    font-size: 12px;
    font-weight:400;
    line-height:1;
    display: inline-block;
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.08), 0 2px 5px 0 rgba(0, 0, 0, 0.08);
    text-transform: uppercase;
}
#nav-section a:hover, #share-section a:hover{
	color:#000;
    box-shadow: 0 2px 11px 0 rgba(0, 0, 0, 0.18), 0 2px 15px 0 rgba(0, 0, 0, 0.15);
}
#nav-section .prev-video:before{
	content: '\e906';
    font-family: 'icomoon';
    font-size: 10px;
    margin-right: 5px;
}
#nav-section .next-video:after{
	content: '\e900';
    font-family: 'icomoon';
    font-size: 10px;
    margin-left: 5px;
}
/*------------------------------------*\
    Icons
\*------------------------------------*/
[class^="icon-"], [class*=" icon-"] {
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon-facebook:before { content: "\ea90"; }
.icon-instagram:before { content: "\ea92"; }
.icon-twitter:before { content: "\ea96"; }
.icon-youtube:before { content: "\ea9d"; }
.icon-behance:before { content: "\eaa8"; }
.icon-tumblr:before { content: "\eab9"; }
.icon-linkedin:before { content: "\eaca"; }
.icon-whatsapp:before { content: "\ea93"; }
.icon-search:before { content: "\e986"; }
.icon-quotes:before { content: "\e978"; }
.icon-arrow:before { content: "\e901"; }
.icon-services:before { content: "\ea80"; }
.icon-about:before { content: "\e955"; }
.icon-portfolio:before { content: "\e956"; }
.icon-alies:before { content: "\e9bc"; }
.icon-prices:before { content: "\e902"; }
.icon-mobile:before { content: "\e903"; }
.icon-mail:before { content: "\e904"; }
/*------------------------------------*\
    RESPONSIVE
\*------------------------------------*/
@media only screen and (max-width:479px) {
	#content.grid .item, #content.grid .item.double {
		width: 98%;
	}
	header .menu-icon{
		margin-left: -15px;
	}
}
@media only screen and (min-width:480px) {
	
}
@media only screen and (max-width:767px) {	
	header nav.main-menu li{
		font-size: 42px;
	}
	#main{
		padding: 0;
	}
	#content.grid .item {   
		margin: 0 1% 2% 1%;
	}
	#main #toggle {
	    display: none;
	}
	#content.grid .item {
		width: 98%;    
	}
	#content.grid .item.double {
		width: 98%;    
	}
	#video-section {
		height: 56%;
	}
	#share-section, #nav-section {
		text-align:center;
		padding:35px 0 0;
	}
}
@media only screen and (min-width:768px) {	
	#content.grid .item {
		width: 24%;
	}
	#content.grid .item.double {
		width: 48.9%;
	}
	.pl-0 .vc_column-inner {
		padding-left: 0 !important;
	}
	.pr-0 .vc_column-inner {
		padding-right: 0 !important;
	}
}
@media only screen and (max-width:1024px) {
	.vertical-slideshow-container .vert {
	    width: 50%;
	}
}
@media only screen and (min-width:1024px) {
	#content.grid .item {
		width: 24%;
	}
	#content.grid .item.double {
		width: 48.9%;
	}
	#main #toggle, #main .grid #change-view {
	    right: -50px !important;
	}	
}
@media only screen and (min-width:1280px) {
	#content.grid .item {
		width: 15.6%;
	}
	#content.grid .item.double {
		width: 32.2%;
	}	
	#content{
		width: 90% !important;
		max-width: 1420px;
	}
}
@media only screen and (min-width:2000px) {
	#content{
		max-width: 1800px;
	}
	.container{
		max-width: 1960px;
	}
}
@media only screen and (-webkit-min-device-pixel-ratio:1.5),
	   only screen and (min-resolution:144dpi) {

}
@font-face {
    font-family: 'Bal10';
    src: url('fonts/bal10/Bal10-Light.woff2') format('woff2'),
        url('fonts/bal10/Bal10-Light.woff') format('woff'),
        url('fonts/bal10/Bal10-Light.ttf') format('truetype'),
        url('fonts/bal10/Bal10-Light.svg#Bal10-Light') format('svg');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'Futura';
    src: url('fonts/futura/FuturaStd-Light.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'Futura';
    src: url('fonts/futura/FuturaStd-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'Hanskendrick';
    src: url('fonts/hanskendrick/hanskendrick-light.ttf') format('truetype'),
        url('fonts/hanskendrick/hanskendrick-light.svg#Hanskendrick-Light') format('svg');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'Hanskendrick';
    src: url('fonts/hanskendrick/hanskendrick-medium.ttf') format('truetype'),
        url('fonts/hanskendrick/hanskendrick-medium.svg#Hanskendrick-Light') format('svg');
    font-weight: 500;
    font-style: normal;
}
@font-face {
  font-family: 'icomoon';
  src:url('fonts/icomoon/icomoon.eot');
  src:url('fonts/icomoon/icomoon.eot') format('embedded-opentype'),
    url('fonts/icomoon/icomoon.ttf') format('truetype'),
    url('fonts/icomoon/icomoon.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
::selection {
	background:#ac2966;
	color:#FFF;
	text-shadow:none;
}
::-webkit-selection {
	background:#ac2966;
	color:#FFF;
	text-shadow:none;
}
::-moz-selection {
	background:#ac2966;
	color:#FFF;
	text-shadow:none;
}