/* .wrapper {


    background-color: #ffffff;


    padding: 20px;


} */











.card .menu-content {


	margin: 0;


	padding: 0;


	list-style-type: none;


}


.card .menu-content::before, .card .menu-content::after {


	content: '';


	display: table;


}


.card .menu-content::after {


	clear: both;


}


.card .menu-content li {


	display: inline-block;


}


.card .menu-content a {


	color: #fff;


}


.card .menu-content span {


	position: absolute;


	left: 50%;


	top: 0;


	font-size: 10px;


	font-weight: 700;


	font-family: 'Open Sans';


	-webkit-transform: translate(-50%, 0);


	transform: translate(-50%, 0);


}


.card .wrapper {


	background-color: #fff;


	min-height: 230px;


	position: relative;


	overflow: hidden;


	/* /box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.2);/ */


	box-shadow: 0 0px 2px rgba(0, 0, 0, 0.3), 0 0px 0px rgba(0, 0, 0, 0.2);


	    border: 4px solid #fff;


		    margin-bottom: 20px;


}


.card .wrapper:hover .data {


	-webkit-transform: translateY(0);


	transform: translateY(0);


}


.card .data {


	position: absolute;


	bottom: 0;


	width: 100%;


	-webkit-transform: translateY(calc(100px + 1em));


	transform: translateY(calc(100px + 1em));


	transition: -webkit-transform 0.3s;


	transition: transform 0.3s;


	transition: transform 0.3s, -webkit-transform 0.3s;


}


.card .data .content {


	padding: 1em;


	position: relative;


	z-index: 1;


}


.card .author {


	font-size: 12px;


}


.card .title {


	margin-top:0px;


	text-align: center;


   color: #fff;


}


.card .text {


	height: 90px;


	margin: 0;


	    color: #fff;


}


.card input[type='checkbox'] {


	display: none;


}


.card input[type='checkbox']:checked + .menu-content {


	-webkit-transform: translateY(-60px);


	transform: translateY(-60px);


}


/* .example-1 .wrapper { */


/* /background: url(https://images.unsplash.com/photo-1496979551903-46e46589a88b?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=cda12b505afa1beb06e49d89014cbd65&auto=format&fit=crop&w=634&q=80) 20% 1%/cover no-repeat;/ */


/* } */





.example-1 .content {


	/* /background-color: #fff; box-shadow: 0 5px 30px 10px rgba(0, 0, 0, 0.3);/ */


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


}


.example-1 .title a {


	color: #fff;


    font-family: 'Roboto Condensed', sans-serif;


}


.example-1 .title h3 a  {


	color: #333;


    font-family: 'Roboto Condensed', sans-serif;


}


.example-1 .menu-button {


	position: absolute;


	z-index: 999;


	top: 16px;


	right: 16px;


	width: 25px;


	text-align: center;


	cursor: pointer;


}


.example-1 .menu-button span {


	width: 5px;


	height: 5px;


	background-color: gray;


	color: gray;


	position: relative;


	display: inline-block;


	border-radius: 50%;


}


.example-1 .menu-button span::after, .example-1 .menu-button span::before {


	content: '';


	display: block;


	width: 5px;


	height: 5px;


	background-color: currentColor;


	position: absolute;


	border-radius: 50%;


}


.example-1 .menu-button span::before {


	left: -10px;


}


.example-1 .menu-button span::after {


	right: -10px;


}


.example-1 .menu-content {


	text-align: center;


	position: absolute;


	top: 0;


	left: 0;


	width: 100%;


	z-index: -1;


	transition: -webkit-transform 0.3s;


	transition: transform 0.3s;


	transition: transform 0.3s, -webkit-transform 0.3s;


	-webkit-transform: translateY(0);


	transform: translateY(0);


}


.example-1 .menu-content li {


	width: 33.333333%;


	float: left;


	background-color: #77d7b9;


	height: 60px;


	position: relative;


}


.example-1 .menu-content a {


	position: absolute;


	top: 50%;


	left: 50%;


	-webkit-transform: translate(-50%, -50%);


	transform: translate(-50%, -50%);


	font-size: 24px;


}


.example-1 .menu-content span {


	top: -10px;


	 


}





@media only screen and (max-width: 1530px) and (min-width:1024px){


	.card .wrapper {


    min-height: 154px !important;


}


}