﻿

.padding-zero 			   {  padding: 0; margin-bottom: -6px;}
.padding-zero-two      {  padding: 0;}
.padding-bottom-zero 	 {  padding-bottom: 0!important;}




 


.to-do 							{ padding-top: 0px; background-color: #fff;}
.todo 							{ position: relative; float: left; overflow: hidden; max-height: 360px;}
.todo img 						{ position: relative; display: block; min-height: 100%;	max-width: 100%;	 	}
.todo figcaption h2 			{ word-spacing: -0.15em; margin-top: -15px; font-size: 18px;  font-family: 'Lato', sans-serif; font-weight: bold; }
.todo figcaption h2 span 		{ font-weight: 800;}
.todo figcaption p 				{ word-spacing: -0.15em; margin-top: 0; font-size: 13px; font-family: 'Lato', sans-serif; }
.todo figcaption		 		{ padding: 2em; color: #fff; text-transform: uppercase;	font-size: 1.25em;	-webkit-backface-visibility: hidden;	backface-visibility: hidden;}
.todo figcaption::before,
.todo figcaption::after 		{ pointer-events: none;}

.todo figcaption,
.todo figcaption > a {	position: absolute;	top: 0;	left: 0; width: 100%; height: 100%;}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.todo figcaption > a 		{ z-index: 1000; text-indent: 200%; white-space: nowrap; font-size: 0; opacity: 0;}
.todo figcaption 			{ text-align: right;}
.todo figcaption > div 		{ position: absolute; bottom: 0; left: 0; padding: 2em;	width: 100%; height: 50%;}

figure.effect-lily figcaption 		{ text-align: right;}
figure.effect-lily figcaption > div { position: absolute; bottom: 0; left: 0; padding: 2em; width: 100%; height: 50%; background-color: red;}
figure.effect-lily figcaption > div:hover { background-color: red;}
.todo  h2,
.todo  p 	{ -webkit-transform: translate3d(0,40px,0); transform: translate3d(0,40px,0);}
.todo  h2 	{ -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s;}
.todo  p 	{ color: rgba(255,255,255,0.8);	opacity: 0;	-webkit-transition: opacity 0.2s, -webkit-transform 0.35s;	transition: opacity 0.2s, transform 0.35s;}

.todo { background: #000;}
.todo img {	max-width: none; width: -webkit-calc(100% + 50px);	width: calc(100% + 50px); opacity:0.9; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s;	-webkit-transform: translate3d(-40px,0, 0);	transform: translate3d(-40px,0,0);}
.todo:hover img    { opacity: 0.2;}
.todo:hover p  		{ opacity: 1;}
.todo:hover img,
.todo:hover h2,
.todo:hover p 		{ -webkit-transform: translate3d(0,0,0);	transform: translate3d(0,0,0);}
.todo:hover p 		{	-webkit-transition-delay: 0.05s; transition-delay: 0.05s; -webkit-transition-duration: 0.35s; transition-duration: 0.35s;}






