﻿.MainTourFeatureContainer, .MainTourSubContainer { width: 50%; float:left;}
.BoxItem { background-color: #ffffff; border: 1px solid #dddddd; margin-bottom: 30px; float: left; }
.BoxItem:hover { border:1px solid #69b532; cursor:pointer;}
.MainTourFeatureContainer, .BoxItem, .ItemText { -webkit-transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; transition: all 1s; }
.BoxItem > .ItemImage > img { width: 100%; height: auto; }
.BoxItem > .ItemText > H2 { margin: 0px; padding: 0px; color: #999999; font-family: sans-serif; font-weight: normal !important; font-size: 12px; transition: background-color ease-in 200ms; -moz-transition: background-color ease-in 200ms; -webkit-transition: background-color ease-in 200ms; -o-transition: background-color ease-in 200ms; -ms-transition: background-color ease-in 200ms; text-transform: uppercase; color: #373a41; }
.BoxItem:hover > .ItemText, .BoxItem:hover > .ItemText > H2 {color:#ffffff;}
.BoxItem:hover > .ItemText a {color:#000000}
.ItemImage { position: relative; filter: alpha(opacity=80); margin: -1px -1px -0px; }
.Image-dim { transition: background-color ease-in 200ms; -moz-transition: background-color ease-in 200ms; -webkit-transition: background-color ease-in 200ms; -o-transition: background-color ease-in 200ms; -ms-transition: background-color ease-in 200ms; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
.BoxItem:hover .Image-dim { background: url(images/ico.png) no-repeat center center; background-color: rgba(0,0,0,0.5); }
.BoxItem:hover > .ItemText { background-color: #69b532 !important; }
.ItemText { margin: 0px; padding: 12px 18px; color: #999999; transition: background-color ease-in 200ms; -moz-transition: background-color ease-in 200ms; -webkit-transition: background-color ease-in 200ms; -o-transition: background-color ease-in 200ms; -ms-transition: background-color ease-in 200ms; font-family: sans-serif; font-weight: normal !important; font-size: 12px; text-transform: none; }
@media (min-width: 960px) {
    .BoxItem { width: 548px; margin-right:30px; }
}

@media only screen and (min-width:960px) and (max-width:1199px) {
    .BoxItem { width: 453px; margin-right:30px; }
    .MainTourFeatureContainer > .BoxItem:nth-of-type(2n) { margin-right: 0px; }
}

@media only screen and (min-width: 768px) and (max-width: 959px) {
    .BoxItem { width: 333px; margin-right:26px;}
    .MainTourFeatureContainer > .BoxItem:nth-of-type(2n) { margin-right: 0px; }
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
    .MainTourFeatureContainer, .MainTourSubContainer  {width: 100%;}
    .BoxItem { width: 321px; margin-right:32px;}
    .MainTourFeatureContainer > .BoxItem:nth-of-type(2n) { margin-right: 0px; }
}

@media only screen and (max-width: 479px) {
    .MainTourFeatureContainer, .MainTourSubContainer  {width: 100%;}
    .BoxItem { width: 300px; }
}

@media only screen and (max-width: 320px) {
    .MainTourFeatureContainer, .MainTourSubContainer  {width: 100%;}
    .BoxItem { width: 280px; }
}