nav ul li i {

margin-right: 10px;

}



/* Overlay colors */

.color1 {

	background: rgba(0,0,0,0.9);

}



.color2 {

	background: rgba(26,188,156,0.9);

}



.color3 {

	background: rgba(44,62,80,0.9);

}



.color4 {

	background: rgba(47,50,56,0.9);

}



/* Overlay style */

.overlay {

position: fixed;

width: 100%;

height: 100%;

top: 0;

left: 0;

background: rgba(0,0,0,1);

}



/* Overlay closing cross */

.overlay .overlay-close {

width: 30px;

height: 30px;

position: absolute;

margin:0;

padding:0;

right: 0px;

top: 0px;

overflow: hidden;

border: none;

background: url(cross.png) no-repeat center center;

text-indent: 200%;

color: transparent;

outline: none;

z-index: 1000;

-webkit-transition: all 0.2s;

transition: all 0.2s;

     

}



.overlay .overlay-close:hover {

-webkit-transform: scale(0.6);

-moz-transition: scale(0.6);

-o-transition: scale(0.6);

transition: scale(0.6);

}



/* Menu style */

.overlay nav {

width: 50%;

top: 20%;

text-align: left;

position: relative;

line-height: 3em;

-webkit-transform: translateY(30%);

transform: translateY(30%);

float: left;

}



/* Block styles */

.overlay .your_blocks {

width:50%;

right: 0%;

position: relative;

line-height: 2em;

-webkit-transform: translateY(60%);

transform: translateY(60%);

float: right;

top: 50%;

}



.overlay .your_block {

border-radius:10px;

display: inline-block;

text-align: left;

margin: 10px 10px;

color: #fff;

-webkit-backface-visibility: hidden;

backface-visibility: hidden;

-webkit-transition: -webkit-transform 0.7s, opacity 0.1s 0.7s;

transition: transform 0.7s, opacity 0.1s, visibility 0s 0.7s;

-webkit-transform: translate3d( 300% ,0 ,0);

transform: translate3d( 300% ,0 ,0);

}



.overlay-slidedown.open .your_block {

border-radius:10px;

visibility: visible;

opacity: 1;

-webkit-transition: -webkit-transform 0.7s, opacity 0.1s 0.7s;

transition: transform 0.7s, opacity 1s;

-webkit-transform: translate3d(0,0,0);

transform: translate3d(0,0,0);

}



.block_link {

color: #fff;

font-size: 15px;

text-decoration: underline;

}





.overlay .your_block img {

width: 720px;

border-radius: 10px;

}



.overlay .your_block span {

position: absolute;

bottom: 10px;

left: 0;

margin-bottom: 0;

text-align: left;

z-index: 1000;

color: #fff;

font-size: 22px;

text-decoration: none;

padding: 20px;

font-weight: 300;

}



.overlay ul {

width:25%; float:left;

list-style: none;

padding: 0;

margin: 0 auto;

display: inline-block;

height: 100%;

position: relative;

}



.overlay ul li {

display: block;

height: calc(100% / 5);

min-height: 22px;

-webkit-backface-visibility: hidden;

backface-visibility: hidden;

-webkit-transition: -webkit-transform 0.3s, opacity 0.1s, visibility 0s 0.2s;

transition: transform 0.3s, opacity 0.1s, visibility 0s 0.2s;

-webkit-transform: translate3d( 300%, 0 ,0);

transform: translate3d( 300%,0,0);

}

.overlay ul li  strong {

color: #f9a03d;

font-size: 18px;

}









.overlay-slidedown.open ul li:first-child {

-webkit-transition-delay: 0.05s;

transition-delay: 0.05s;

}



.overlay-slidedown.open ul li:nth-child(2) {

-webkit-transition-delay: 0.1s;

transition-delay: 0.1s;

}



.overlay-slidedown.open ul li:nth-child(3) {

-webkit-transition-delay: 0.15s;

transition-delay: 0.15s;

}



.overlay-slidedown.open ul li:nth-child(4) {

-webkit-transition-delay: 0.2s;

transition-delay: 0.2s;

}



.overlay-slidedown.open ul li:last-child {

-webkit-transition-delay: 0.25s;

transition-delay: 0.25s;

}



.overlay-slidedown.open ul li {

visibility: visible;

opacity: 1;

-webkit-transition: -webkit-transform 0.7s, opacity 0.1s 0.7s;

transition: transform 0.7s, opacity 1s;

-webkit-transform: translate3d(0,0,0);

transform: translate3d(0,0,0); float:none;

}





.overlay ul li a {

font-size:14px;

display: block;

color: #f9a03d;

-webkit-transition: opacity 0.2s;

transition: opacity 0.2s; background:url(icon.png) left center no-repeat; text-indent:15px;

}



.overlay ul li a:hover, 

.overlay ul li a:focus {

}



/* Effects */

.overlay-slidedown {

	visibility: hidden;

	-webkit-transform: translateX(100%);

	transform: translateX(100%);

	-webkit-transition: -webkit-transform 0.4s ease-in-out, visibility 0s 0.4s;

	transition: transform 0.4s ease-in-out, visibility 0s 0.4s;

}



.overlay-slidedown.open {

	visibility: visible;

	-webkit-transform: translateX(0%);

	transform: translateX(0%);

	-webkit-transition: -webkit-transform 0.4s ease-in-out;

	transition: transform 0.4s ease-in-out;

}







@media screen and (max-height: 30.5em) {

.overlay nav {

line-height: 1.6em;

}

}

	

@media screen and (max-width: 1430px) {

.overlay .your_blocks {

width: 48.6%;

}



.overlay nav {

left: 10%;

}



}



@media screen and (max-width: 960px) {

.overlay .your_blocks {

display:none;

}



.overlay nav {


left: 0;

width: 100%;

}



}