@charset "utf-8";

#travels {
	width:100%;
	max-width:900px;
	margin:0 auto;
	list-style:none;
}
#travels ul {
	list-style:none;
}
#travels li {
	text-align:left;
}
#travels .travelLi {
	width:33.3333%;
	float:left;
	padding:1px;
	box-sizing:border-box;
}
.travelsSub li {
	width:100%;
	padding:1px;
	box-sizing:border-box;
}
#travels .imgDiv,
#travels .subImgDiv {
	display:table;
	width:100%;
	height:100px;
	cursor:pointer;
	padding:1em;
	box-sizing:border-box;
	background-size:cover;
	/* background-size:115% auto; */
	background-position:center center;
	border-radius:5px;
}
#travels .subImgDiv {
	height:50px;
	border-radius:5px;
}
#travels a {
	display:table-cell;
	vertical-align:middle;
	text-align:center;
}
#travels a:hover {
	text-decoration:none;
}
#travels span {
	font-weight:bold;
	color:white;
	text-shadow:1px 1px 1px rgba(0, 0, 0, 1), 0px 0px 2px rgba(0, 0, 0, 1);
	padding:5px 10px;
	box-sizing:border-box;
	border-radius:5px;
	display:block;
	line-height:70%;
	cursor:pointer;
}
#travels span.travelTitle {
	font-size:1.3em;
}
#travels span.travelPeriod {
	font-size:1em;
}
#travels .subImgDiv span {
	font-size:1em;
}
#travels ul.travelsSub {
	display:none;
}
.focusIn > div {
	box-shadow:0px 3px 5px rgba(0, 0, 0, 0.7);
}
.focusOut {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
	filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=30);
	opacity:0.3;
}
#subCategory {
	display:none;
	width:100% !important;
	float:left;
}
#subCategory li {
	width:33.3333%;
	float:left;
	padding:1px;
	box-sizing:border-box;
}
#subCategory li > div {
	/* box-shadow:2px 2px 3px rgba(0, 0, 0, 0.7); */
}
.listDiv {
	width:100% !important;
}

@media all and (min-width:769px) and (max-width:1024px) {

}
@media all and (min-width:568px) and (max-width:768px) {
	#travels .travelLi {
		width:50%;
	}
	#subCategory li {
		width:50%;
	}
	#travels span.travelTitle {
		font-size:1.5em;
	}
	#travels .subImgDiv span {
		font-size:1.2em;
	}
	.listHeader {
	    border-radius:0px;
	}
}
@media all and (max-width:567px) {
	#travels .travelLi {
		width:100%;
	}
	#subCategory li {
		width:100%;
	}
	#travels span.travelTitle {
		font-size:1.5em;
	}
	#travels .subImgDiv span {
		font-size:1.2em;
	}
	.listHeader {
	    border-radius:0px;
	}
}