@media only screen {
	/* Favorites button styling for all templates */
	.favorites {
		display: block;
		position: absolute;
		top: 0.5em;
		right: 0.5em;
		z-index: 1;
	}
	.favorites .favorite {
		display: block;
		font-size: 20px;
		cursor: pointer;
	}
	.favorites a {
		text-decoration: none;
	}
	.favorites a .favorite:after {
		content: '\f08a';
		font-size: 1.5625em;
		font-family: FontAwesome;
		color: #e5b966;
	}
	.favorites a[data-tb-add] .favorite:after {
		content: '\f08a';
	}
	.favorites a[data-tb-add]:hover .favorite:after {
		content: '\f004';
	}
	.favorites a[data-tb-remove] .favorite:after {
		content: '\f004';
	}
	.favorites a[data-tb-remove]:hover .favorite:after {
		content: '\f08a';
	}
}

/* TripBuilder header icon */
@media only screen {
	.tripbuilder .tripbuilder-counter {
		position: relative;
		text-align: center;
	}
	.tripbuilder .tripbuilder-counter a.button {
	    position: relative;
		text-decoration: none;
		text-transform: uppercase;
		color: white;
		background-color: transparent;
		border: 0 none;
	}
	.tripbuilder .tripbuilder-counter a.button .button-text {
		display: none;
	}
	.tripbuilder .tripbuilder-counter a.button .favorite {
		position: relative;
	}
	.tripbuilder .tripbuilder-counter a.button .favorite:before {
		position: relative;
		content: '\f08a';
		font-family: FontAwesome;
		color: #e5b966;
	}
	.tripbuilder .tripbuilder-counter a.button .count {
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		margin: 0 auto;
		text-align: center;
		color: #e5b966;
	}
}

@media only screen and (max-width: 64em) {
	.tripbuilder .tripbuilder-counter a.button:hover .favorite:before,
	.tripbuilder .tripbuilder-counter a.button:hover .count {
		color: white;
	}
	.tripbuilder .tripbuilder-counter a.button .favorite:before {
		font-size: 2.6em;
	}
	.tripbuilder .tripbuilder-counter a.button .count {
		font-size: 0.9em;
	}
}

@media only screen and (min-width: 64.063em) {
	.tripbuilder .tripbuilder-counter {
		position: absolute;
		right: 0;
		width: 150px;
		height: 40px;
	}
	.tripbuilder .tripbuilder-counter a.button {
		position: relative;
		display: flex;
		flex-direction: row;
		height: 28px;
		margin: 0;
		padding: 9px 10px;
		text-transform: uppercase;
		font-weight: 600;
		font-size: 1em;
		line-height: 1em;
		color: white;
		background-color: #038595; 
	}
	.tripbuilder .tripbuilder-counter a.button .button-text {
		position: relative;
		display: inline-block;
		top: 2px;
		left: 10px;
		height: 16px;
		padding: 0;
		font-size: 14px;
		color: white;
		border-bottom: 2px solid #f1f2ed;
	}
	.tripbuilder .tripbuilder-counter a.button .favorite {
		flex-basis: 30%;;
		padding-left: 16px;
		overflow: hidden;
	}
	.tripbuilder .tripbuilder-counter a.button .favorite:before {
		content: '\f08a';
		top: 2px;
		font-size: 1.5em;
		color: #e5b966;
	}
	.tripbuilder .tripbuilder-counter a.button .count {
		top: 2px;
		left: 16px;
		font-size: 0.7em;
		color: white;
	}
}

/* TripBuilder layout page */
@media only screen {
	.tripbuilder {
		position: relative;
	}
	.tripbuilder-modal {
		display: none;
		position: absolute;
		top: 0;
		left: 0;
		width: 100vw;
		padding: 3em 2em;
		background-color: #fff;
		border: solid 1px #666;
		border-radius: 3px;
		box-shadow: 0 0 10px rgba(0,0,0,0.4);
		z-index: 100;
	}
	.tripbuilder .fa {
		font-family: FontAwesome;
	}
	.tripbuilder .tripbuilder-section {
		margin: 1em;
	}
	.tripbuilder .tripbuilder-section.section-bottom {
		margin-bottom: 3em;
	}
	.tripbuilder .tripbuilder-section.section-top h5 {
		color: #002252;
	}
	.tripbuilder input {
		width: 100%;
	}
	.tripbuilder .tripbuilder-section ul {
		display: flex;
		flex-direction: column;
		margin: 0;
		padding: 0;
	}
	.tripbuilder .tripbuilder-section.section-top ul {
		display: flex;
		flex-direction: column;
	}
	.tripbuilder ul li {
		position: relative;
		margin: 0 0 0.6em;
		overflow: hidden;
		background-color: white;
		list-style-type: none;
	}
	.tripbuilder .item-top,
	.tripbuilder .item-bottom {
		position: relative;
	}
	.tripbuilder .item-top {
		display: block;
		overflow: hidden;
		font-size: 0;
	}
	.tripbuilder .close {
		position: absolute;
		top: 5px;
		right: 5px;
		z-index: 2;
	}
	.tripbuilder .close a {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 25px;
		height: 25px;
		border: 3px solid #e5b966;
		border-radius: 50%;
		color: #e5b966;
		background-color: #002252;
		text-decoration: none;
	}
	.tripbuilder .close a:hover {
		color: #002252;
		background-color: white;
	}
	.tripbuilder .close a i {
		font-size: 25px;
	}
	.tripbuilder img {
		width: 100%;
	}
	.tripbuilder h3 {
		margin: 12px 0;
		font-size: 1.25em;
		line-height: 1;
		color: #002252;
	}
	.tripbuilder h5 {
		color: #002252;
	}
	.tripbuilder .location a {
		font-size: 1em;
		color: #002252;
	}
	.tripbuilder .location a .fa {
		margin-right: 5px;
	}
	.tripbuilder .button {
		display: block;
		font-weight: 400;
	}
	.tripbuilder .button b {
		font-weight: 700;
	}
	.tripbuilder .expiredWarning {
		display: none;
		margin: 0.6em 0.3em;
		font-family: Lato, sans-serif;
	}

	/* directions form */
	.tripbuilder-modal.reveal-modal {
		min-height: auto;
		padding: 3em 2em;
	}
	.tripbuilder-modal #tb-directionsForm {
		max-width: calc(100% - 1em);
		padding-top: 1em;
	}
	.tripbuilder-modal .fa.fa-times {
		font-size: 30px;
		color: black;
	}
	.tripbuilder-modal #tb-directionsForm .form-row {
		display: flex;
		flex-direction: row;
		justify-content: center;
	}
	.tripbuilder-modal #tb-directionsForm span.prefix {
		flex-basis: 4.4em;
		flex-grow: 0;
		padding-right: 1em;
		text-align: right;
		border: 0 none;
		color: black;
		background-color: transparent;
	}
	.tripbuilder-modal #tb-directionsForm input {
		color: black;
	}
	.tripbuilder-modal #tb-directionsForm .button-directions {
		padding: 5px 15px;
		font-family: Shrikhand;
		font-weight: 100;
		font-size: 16px;
		text-align: center;
		text-transform: uppercase;
		color: white;
		background-color: #002252;
		border-radius: 2px;
	}
	.tripbuilder-modal #tb-directionsForm .button-directions:hover {
		background-color: black;
	}

	/* begin: google maps */
	.tripbuilder .gMapContainer .showGMap {
		margin-bottom: 1em;
		border-top: 1px solid black;
		border-bottom: 1px solid black;
	}
	.tripbuilder .gMapContainer .showGMap .fa {
		color: #002252;
	}
	.tripbuilder .gMapContainer .showGMap span {
		font-weight: 700;
		color: #002252;
	}
	.tripbuilder .gMapContainer .showGMap .isOpen {
		display: none;
	}
	.tripbuilder .gMapContainer .showGMap .isClosed {
		display: block;
	}
	.tripbuilder .gMapContainer.open .showGMap .isOpen {
		display: block;
	}
	.tripbuilder .gMapContainer.open .showGMap .isClosed {
		display: none;
	}
	.tripbuilder .gMapContainer .gMapHolder {
		height: 25em;
		display: none;
	}
	.tripbuilder .gMapContainer.open .gMapHolder {
		display: block;
	}
	.tripbuilder .gMapContainer .showGMap {
		margin: 1em 0 0;
		font-size: 1em;
		font-weight: bold;
		text-align: center;
		color: black;
		cursor: pointer;
	}
	.tripbuilder .gMapContainer .showGMap > div {
		padding: 5px 0;
	}
	.tripbuilder .gMapContainer .gMapHolder img {
		max-width: none; /* foundation overwrite for info window close button */
	}
	.tripbuilder .gMapContainer .infoWindow h5 {
		margin: 10px 0;
		font-size: 1em;
		line-height: 1.1;
		text-align: center;
		color: black;
	}
	.tripbuilder .gMapContainer .infoWindow span {
		font-size: 0.9em;
		line-height: 1.1;
		color: black;
	}

	/* info window overrides */
	.tripbuilder .gMapContainer .gm-style-iw {
		position: absolute;
		left: 0 !important;
		top: 0 !important;
		overflow: visible;
	}

	.tripbuilder .gMapContainer .gm-style-iw,
	.tripbuilder .gMapContainer .gm-style-iw div {
		min-width: 305px !important;
		overflow: visible !important;
		text-align: center;
	}

	.tripbuilder .gMapContainer .gm-style-iw ~ div,
	.tripbuilder .gMapContainer .gm-style-iw ~ div img,
	.tripbuilder .gMapContainer .gm-style-iw ~ img {
		display: none;
		right: -99999px !important;
	}

	.tripbuilder .gMapContainer .gm-style .gm-style-iw-c {
		display: flex;
		justify-content: center;
		padding: 24px 0 12px 0 !important;
		min-width: 320px !important;
	}
	.tripbuilder .gMapContainer .gm-style .gm-style-iw-c,
	.tripbuilder .gMapContainer .gm-style .gm-style-iw-d {
		max-width: none !important;
		max-height: none !important;
	}

	.tripbuilder .gMapContainer .gm-style-iw .shared-action-items {
		min-width: auto !important;
	}

	.tripbuilder .gMapContainer .infoWindow .info-top {
		display: block;
		margin-top: 7px;
	}
	.tripbuilder .gMapContainer button.gm-ui-hover-effect {
		top: 0 !important;
		right: 0 !important;
		z-index: 20;
		font-size: 20px;
		color: #e2c27a;
	}
	.tripbuilder .gMapContainer button.gm-ui-hover-effect:hover {
		color: #ee1c24;
	}
	.tripbuilder .gMapContainer button.gm-ui-hover-effect:after {
		content: '\f00d';
		font-family: FontAwesome;
	}
	.tripbuilder .gMapContainer button.gm-ui-hover-effect img {
		display: none !important;
	}
	/* end: google maps */
}

@media only screen and (min-width: 40.063em) {
	.tripbuilder .tripbuilder-section.section-bottom ul {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: flex-start;
		justify-content: flex-start;
	}
	.tripbuilder .tripbuilder-section.section-bottom ul li {
		flex-basis: 48%;
		margin-right: 10px;
		border: 1px solid #777;
	}
	.tripbuilder .tripbuilder-section.section-bottom .item-bottom {
		padding: 10px;
	}
	.tripbuilder .button {
		margin: 12px 0 0 0;
	}
}

@media only screen and (min-width: 64.063em) {
	.tripbuilder {
		max-width: 73em;
		margin: 0 auto;
	}
	.tripbuilder .tripbuilder-section.section-bottom ul li {
		flex-basis: 32%;
	}
	.tripbuilder ul li .buttons span {
		flex-basis: 50%;
	}
}