/* GENERAL STYLES */

/* Note that if Bootstrap row negative margins exceed the body padding, scrollbars will appear (unless you have overflow:hidden) */

main h2 {
	font-size:2.5rem; /* 40px */
	text-align:center;
	border:none;
	margin:0 auto 30px;
	letter-spacing:-.035em;
}
main h2 small {
	display:block;
	font-size:.90625rem; /* 14.5px */
	text-transform:uppercase;
	letter-spacing:.05em;
	font-weight:600;
	color:#b0b0b0;
	padding-left:.2em;
}
@media screen and (max-width: 950px) {
	main h2 {
		font-size:2.25rem; /* 36px */
	}
}
@media screen and (max-width: 800px) {
	main h2 {
		font-size:2.125rem; /* 34px */
		letter-spacing:-.03em;
	}
}
@media screen and (max-width: 600px) {
	main h2 {
		font-size:calc(3vw + 16px);
	}
}
@media screen and (max-width: 400px) {
	main h2 {
		font-size:1.75rem; /* 28px */
		letter-spacing:-.025em;
	}
}

main h2 a:hover {
	text-decoration:none;
}
main h3 {
	text-align:center;
	margin:80px 0 25px;
}
main h2 + h3 {
	margin-top:55px;
}
#pageContent {
	overflow-x:hidden; /* until we can make the slideshow buttons fit */
}
a.btn.subtle {
	font-size:.84375rem; /* 13.5px */
/* Fix some weird bug where clicking on the down arrow in the Feefo box higlights the more button
	 https://stackoverflow.com/questions/21003535/anyway-to-prevent-the-blue-highlighting-of-elements-in-chrome-when-clicking-quic
	 Can be removed here if/when added to general stylesheets */
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-khtml-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
}
/* HERO BOX */
div#heroBox {
	clear:both;
	margin:0;
	padding:0;
	overflow:hidden;
	width:100%;
	position:relative;
	background:#f2f2f2;
}
/* use Flex to force slides to same height using flex: https://stackoverflow.com/questions/49028877/slick-carousel-force-slides-to-have-the-same-height */
div#heroBox.slick-slider .slick-track {
	display:-ms-flexbox; /* IE 10 */
	display:flex;
}
#heroBox .heroBoxSlide {
	position:relative;
	width:100%;
	height:100%;
	/*min-width:1100px;
	min-height:450px; */
	min-height:40.9vw;
	overflow:hidden;
}
@media screen and (max-width: 1000px) {
	#heroBox .heroBoxSlide {
		min-height:50vw;
	}
	#heroBox .slick-next, #heroBox .slick-prev {
		width: 28px !important;
		height: 28px !important;
	}
}
@media screen and (max-width: 800px) {
	#heroBox .heroBoxSlide {
		min-height:57vw;
	}
}
@media screen and (max-width: 600px) {
	#heroBox .heroBoxSlide {
		min-height:54vw;
	}
}
@media screen and (max-width: 500px) {
	#heroBox .slick-next, #heroBox .slick-prev {
		width: 25px !important;
		height: 25px !important;
	}
}
@media screen and (max-width: 400px) {
	#heroBox .heroBoxSlide {
		min-height: 58vw;
	}
}
/* only show first slide until slick loads */
/*body:not(.jsActive)*/ #heroBox .heroBoxSlide:nth-child(n+2) {
	display:none;
}
#heroBox.slick-slider .heroBoxSlide:nth-child(n) {
	display:block;
}
/* note that this is so non-specific that ANY images in the heroSlides will have this applied */
#heroBox .heroBoxSlide img {
	display:block;
	top:50.25%;
	left:50.25%;
	-webkit-transform:translate(-50.25%, -50.25%);
	transform:translate(-50.25%, -50.25%);
	border:none;
	position:absolute;
	min-width:100.5%;
	min-height:100.5%;
	height:100.5%;
	width:auto;
}
#heroBox .slick-next {
	right:10px;
}
#heroBox .slick-prev {
	left:10px;
}
#heroBox .slick-next,
#heroBox .slick-prev {
	background:#fff;
	color:#000;
	opacity:.65;
	width:34px;
	height:34px;
	box-shadow:0 2px 4px rgba(0,0,0,.5);
}
#heroBox .slick-prev:hover,
#heroBox .slick-prev:focus,
#heroBox .slick-next:hover,
#heroBox .slick-next:focus {
	opacity:1;
}

/* TOUR HEROES */
#heroBox .tourHeroText {
	position:absolute;
	bottom:0;
	width:100%;
	padding:20px 60px;
	z-index:2;
	background:rgba(0,0,0,.5);
	text-align:left;
	color:#fff;
}
#heroBox .tourHeroText .pageWidth {
	position:relative;
	padding:0;
	max-width:1100px;
}
#heroBox .tourHeroText .title {

	margin:0 0 .35em;
	padding:0;
	font-size:3.25rem; /* 52px */
	line-height:1.1;
	font-weight:600;
	letter-spacing:-.045em;
	text-shadow:1px 1px 2px #000;
}
#heroBox .tourHeroText .title a,
#heroBox .tourHeroText .title a:hover {
	color:#fff;
	text-decoration:none;
}
#heroBox .tourHeroText .subtitle {
	margin-bottom:.4em;
	font-size:1.25rem; /* 20px */
	line-height:1.3;
	text-shadow:1px 1px 2px #000;
}
#heroBox .tourHeroText .price,
#heroBox .tourHeroText .duration {
	display:inline-block;
	margin:30px 15px 10px 0;
	padding:0 20px 0 0;
	text-align:center;
	font-size:.78125rem; /* 12.5px */
	line-height:17px;
	text-transform:uppercase;
	text-shadow:1px 1px 2px #000;
	color:#ccc;
}
#heroBox .tourHeroText .price {
	border-right:1px solid #bfbfbf;
	text-align:left;
}
#heroBox .tourHeroText .price big,
#heroBox .tourHeroText .duration big {
	display:block;
	margin-bottom:3px;
	min-height:26px;
	font-size:1.625rem; /* 26px */
	line-height:26px;
	font-weight:600;
	letter-spacing:-.03em;
	text-transform:none;
	color:#fff;
}
#heroBox .tourHeroText .price small {
	font-size:inherit;
	display:block;
	margin-top:-17px;
	height:17px;
}
#heroBox .tourHeroText .disclaimer {
	margin:0 0 5px;
	font-size:.75rem; /* 12px */
	line-height:1.2;
	color:#bfbfbf;
	text-align:left;
}
#heroBox .tourHeroText a.cta {
	float:right;
	margin:30px 0 0 50px; /* top padding should match prices */
	min-height:unset;
}
@media screen and (max-width:1350px) {
	#heroBox .tourHeroText .title {
		font-size:2.5rem; /* 40px */
	}
}
@media screen and (max-width: 1000px) {
	#heroBox .heroBoxSlide.tourHero img {
		top:0;
		-webkit-transform:translate(-50.25%, 0);
		transform:translate(-50.25%, 0);
		min-height:unset;
		height:auto;
		width:100.5%;
	}
	#heroBox .tourHeroText {
		background:#d7d7d7 url('https://res.cloudinary.com/friendly-planet/image/fetch/q_auto,f_auto/https://www.friendlyplanet.com/media/gallery/homepage/hero-map-bg.2200x900.bmp') no-repeat bottom/cover;
		color:#1655bc;
		min-height:9.1vw;
	}
	#heroBox .tourHeroText .title {
		margin-bottom:.25em;
		padding-right:5.5em;
		font-size:2.1875rem; /* 35px */
		font-weight:bold;
		text-shadow:none;
	}
	#heroBox .tourHeroText .title a,
	#heroBox .tourHeroText .title a:hover {
		color:#1655bc;
	}
	#heroBox .tourHeroText .subtitle {
		text-shadow:none;
		font-weight:600;
	}
	#heroBox .tourHeroText .price,
	#heroBox .tourHeroText .duration,
	#heroBox .tourHeroText .disclaimer {
		display:none;
	}
	#heroBox .tourHeroText a.cta {
		position:absolute;
		top:.15em; /* to visually align with title */
		right:0;
		float:none;
		margin:0;
		padding:.3em 1.5em .4em;
	}
}
@media screen and (max-width: 875px) {
	#heroBox .tourHeroText .title {
		font-size:1.96875rem; /* 31.5px */
	}
}
@media screen and (max-width: 800px) {
	#heroBox .tourHeroText {
		text-align:center;
		min-height: 14.1vw;
	}
	#heroBox .tourHeroText .title {
		padding-right:0;
		margin-bottom:.7em;
	}
	#heroBox .tourHeroText .subtitle {
		display:none;
	}
	#heroBox .tourHeroText a.cta {
		position:relative;
		top:unset;
		right:unset;
		margin-bottom:.25em;
	}
}
@media screen and (max-width: 650px) {
	#heroBox .tourHeroText .title {
		font-size:1.8125rem; /* 29px */
	}
}
@media screen and (max-width: 600px) {
	#heroBox .tourHeroText {
		padding-top:15px;
		padding-bottom:15px;
		min-height:15vw;
	}
}
@media screen and (max-width: 585px) {
	#heroBox .tourHeroText .title {
		font-size:1.625rem; /* 26px */
	}
}
@media screen and (max-width: 500px) {
	#heroBox .tourHeroText .title {
		margin-bottom:0;
	}
	#heroBox .tourHeroText a.cta {
		display:none;
	}
}
@media screen and (max-width: 450px) {
	#heroBox .tourHeroText .title {
		font-size:1.5625rem; /* 25px */
	}
}
@media screen and (max-width: 400px) {
	#heroBox .tourHeroText {
		min-height:19.1vw;
	}
}
@media screen and (max-width: 380px) {
	#heroBox .tourHeroText .title {
		font-size:1.4375rem; /* 23px */
	}
	 #heroBox .tourHeroText {
		text-align:center;
	}
}

/* TOUR SEARCH BAR */
form#tourSearch {
	width:100%;
	margin:0 auto;
	position:relative;
	background:#f2f2f2;
}
form#tourSearch fieldset {
	margin:0;
	padding:30px 0 40px;
	border:none;
	text-align:center;
}
form#tourSearch fieldset h2 {
	margin-top:-6px;
	margin-bottom:20px;
	color:#1655bc;
	text-shadow:0 0 10px rgba(255,255,255,1);
}
form#tourSearch fieldset select {
	display:inline-block;
	width:37.5%;
	margin:0 1%;
	vertical-align:middle;
	font-size:1.25rem; /* 20px */
	min-height:2.5rem; /* 40px */
}
form#tourSearch input.btn {
	width:8%;
	margin:0 1%;
	vertical-align:middle;
	min-height:2.5rem; /* 40px */
}
.jsActive form#tourSearch fieldset select {
	width:42.5%;
}
.jsActive form#tourSearch input.btn {
	display:none;
}
@media screen and (max-width: 850px) {
	form#tourSearch fieldset select {
		font-size:1.125rem; /* 18px */
	}
}
@media screen and (max-width: 768px) {
	form#tourSearch fieldset {
		padding-bottom:30px;
	}
	form#tourSearch fieldset select,
	.jsActive form#tourSearch fieldset select {
		width:90%;
		margin-bottom:10px;
	}
	form#tourSearch input.btn {
		width:auto;
	}
}
@media screen and (max-width: 500px) {
	form#tourSearch fieldset select {
		font-size:1.03125rem; /* 16.5px */
	}
}

/* FEEFO RIBBON */
#feefoRibbon {
	position:relative;
	margin:0 auto;
	padding:15px 0;
	text-align:center;
	background:#696969;
	color:#fff;
	font-size:1rem; /* 16px */
	line-height:32px;
}
#feefoRibbon big {
	font-size:1.5625rem; /* 25px */
	font-weight:bold;
	margin-right:25px;
}
#feefoRibbon .stars-outer {
	margin-right:15px;
	font-size:1.875rem; /* 30px */
}
#feefoRibbon .stars-outer:before {
	content:'\e85a \e85a \e85a \e85a \e85a';
	color:#fff;
}
#feefoRibbon .feefoLogo {
	margin-left:25px;
	vertical-align:text-bottom;
	border:none;
}
#feefoRibbon .pageWidth div {
	margin-top:5px;
}
#feefoRibbon a {
	text-transform:uppercase;
	color:#fff;
	font-size:.84375rem; /* 13.5px */
	line-height:16px;
}
@media screen and (max-width: 992px) {
	#feefoRibbon big {
		margin:10px auto;
		display:block;
	}
}
@media screen and (max-width: 768px) {
	#feefoRibbon a {
		display:block;
		margin-top:10px;
	}
}

/* PAGE BLOCKS */
.whiteBlock {
	background:#fff;
	padding:80px 0;
	text-align:center;
	overflow-x:hidden; /* hide anything with negative side margins so it doesn't cause horiz scrolling */
}
.grayBlock {
	background:#f2f2f2;
	padding:80px 0;
	text-align:center;
	overflow-x:hidden; /* hide anything with negative side margins so it doesn't cause horiz scrolling */
}
.topArrow {
	position:relative;
}
.topArrow::before {
	content:"";
	position:absolute;
	top:0;
	left:50%;
	margin-left:-30px;
	width:60px;
	height:25px;
	background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='25' fill='rgb(242,242,242)' stroke='none'><path d='M0,0 L30,25 L60,0 L0,0 Z'></path></svg>") center top no-repeat;
}
.grayBlock.topArrow::before {
	background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='25' fill='white' stroke='none'><path d='M0,0 L30,25 L60,0 L0,0 Z'></path></svg>");
}
div.moreHr {
	margin:45px auto 0;
	border-top:2px solid #d1e9fe;
	max-width:1100px;
	text-align:center;
}
div.moreHr a.btn {
	margin-top:-16px;
	box-shadow:0 0 0 25px #fff;
}
.grayBlock div.moreHr a.btn {
	box-shadow:0 0 0 25px #f2f2f2;
}
@media screen and (max-width: 600px) {
	.whiteBlock,
	.grayBlock {
		padding-top:60px;
		padding-bottom:60px;
	}
}

/* VIDEOS */
#featuredVideosSlider {
	list-style:none;
	margin:0 -34px;  /* compensate for padding on slides */
	padding:0;
	overflow:hidden; /* clear floats */
	position:relative;
}
#featuredVideosSlider li {
	list-style:none;
	float:left;
	width:33.33%;
	margin:0;
	padding:0 34px; /* create spacing between slides using padding; also allows space for center slide to grow horizontally */
	outline:none;
}
/* only show first three videos if no JS; might consider limiting to 2 or 1 at breakpoints */
#featuredVideosSlider li:nth-child(n+4) {
	display:none;
}
#featuredVideosSlider li figure.video {
	display:block;
	min-width:0;
	max-width:none;
}
/* Now, if Slick loads... */
/* create masks to hide slides as they slide in and out of stage, above slides but below buttons */
#featuredVideosSlider.slick-slider::before {
	content:'';
	background:#fff;
	width:34px;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	z-index:2;
}
#featuredVideosSlider.slick-slider::after {
	content:'';
	background:#fff;
	width:34px;
	height:100%;
	position:absolute;
	top:0;
	right:0;
	z-index:2;
}
#featuredVideosSlider .slick-list {
	z-index:1;
}
/* show all slides */
#featuredVideosSlider.slick-slider li:nth-child(n) {
	display:block;
}
#featuredVideosSlider .slick-next {
	right:17px;
}
#featuredVideosSlider .slick-prev {
	left:17px;
}
#featuredVideosSlider .slick-next,
#featuredVideosSlider .slick-prev {
	background:#06f;
	background:rgba(0,102,255,.8);
	color:#fff;
	width:34px;
	height:34px;
	z-index:3; /* above side masks */
}
#featuredVideosSlider .slick-prev:hover,
#featuredVideosSlider .slick-prev:focus,
#featuredVideosSlider .slick-next:hover,
#featuredVideosSlider .slick-next:focus {
	background:rgba(0,102,255,1);
	color:rgba(255,255,255,1);
	box-shadow:none;
	text-shadow:1px 1px 2px rgba(0,0,0,.5);
}
/* Slick center mode; match breakpoints in Slick script */
@media screen and (min-width: 900px) {
	#featuredVideosSlider li.slick-slide a {
		margin:5.90625% 0; /* allow space for center slide to grow vertically */
		transition:transform .4s;
	}
	#featuredVideosSlider li.slick-slide.slick-center a {
		transform:scale(1.21);
	}
	#featuredVideosSlider li.slick-slide img.videoPoster {
		/* -webkit-filter:brightness(.75); /* do we need this for Safari? */
		filter:brightness(.75);
		transition:filter .1s;
	}
	#featuredVideosSlider li.slick-slide:hover img.videoPoster,
	#featuredVideosSlider li.slick-slide.slick-center img.videoPoster {
		/* -webkit-filter:brightness(1); */
		filter:brightness(1);
	}
}
@media screen and (max-width: 625px) {
	#featuredVideosSlider .slick-next,
	#featuredVideosSlider .slick-prev {
		width: 25px;
		height: 25px;
	}
	#featuredVideosSlider .slick-next {
		right: 22px;
	}
	#featuredVideosSlider .slick-prev {
		left: 22px;
	}
}
/* NEWSLETTER, HOT DEALS, CATALOG */
#freshBlock {
	text-align:center;
	padding-top:60px; /* compensate for top margins on blocks */
}
#freshBlock > .pageWidth > .row {
}
#freshBlock > .pageWidth > .row > div {
	max-width:600px;
}
#freshBlock h2 {
	margin:20px 0 25px;
	padding:0;
}
#freshBlock #catalogBox {
	margin-bottom:30px;
}
#freshBlock #catalogBox img {
	width:100%;
	height:auto;
	max-width:225px;
}
#freshBlock #hotDealsBox {
	margin-bottom:30px;
}
#freshBlock #hotDealsBox img {
	width:100%;
	height:auto;
	max-width:225px;
}
#freshBlock #hotDealsBox h2 {
	color:#f00;
}
#freshBlock #newsletterBox ul {
	border-top:1px solid #ccc;
	text-align:left;
	list-style:none;
	margin:25px 0;
	padding:0;
}
#freshBlock #newsletterBox ul li {
	border-bottom:1px solid #ccc;
	position:relative;
	list-style:none;
	margin:0;
	padding:18px 35px 18px 0;
	overflow:auto;
	color:#808080;
}
#freshBlock #newsletterBox a.issueImg {
	width:164px;
	height:82px;
	margin-right:20px;
	float:left;
	display:block;
}
#freshBlock #newsletterBox a.issueImg img {
	width:164px;
	height:82px;
}
#freshBlock #newsletterBox .issueTitle a {
	display:block;
	font-weight:bold;
	font-size:1.1875rem; /* 19px */
	line-height:1.3;
	letter-spacing:-.015em;
	text-decoration:none;
	margin-bottom:8px;
}
#freshBlock #newsletterBox a.issueBtn {
	font-size:1.125rem; /* 18px */
	line-height:18px;
	position:absolute;
	right:0;
	top:50%;
	margin-top:-9px;
	color:#1655bc;
}
#freshBlock #newsletterBox a.issueBtn:hover {
	color:#F60;
}
@media screen and (max-width: 576px) {
	#freshBlock h2 {
		text-align:center;
	}
}
@media screen and (max-width: 768px) {
	#freshBlock #newsletterBox a.issueImg {
		display:none;
	}
}
@media screen and (max-width: 576px) {
	#freshBlock h2 {
		text-align:center;
	}
}

/* EXCEPTIONAL JOURNEYS BLOCK */
#introBlock {
	position:relative;
	padding-top:0;
}
#introBlock #introBanner {
	clear:both;
	margin:0;
	padding:80px 0 90px;
	background:linear-gradient(to top, rgba(255,255,255,1) 0, rgba(255,255,255,0) 50%),
						 url("https://res.cloudinary.com/friendly-planet/image/fetch/q_auto,f_auto/https://www.friendlyplanet.com/media/gallery/africa/tanzania/elephants-on-safari.2200x600.bmp") no-repeat top/cover;
}
#introBlock #introBanner .pageWidth {
	margin:0 auto;
}
#introBlock #introBanner h2 {
	margin:0;
	padding:40px 25px 45px;
	border:3px solid #fff;
	color:#fff;
	text-shadow:0 0 15px #000;
}
#introBlock p {
	font-size:1rem; /* 16px */
	line-height:1.75;
}
/*
@media screen and (max-width: 1200px) {
	#introBlock #introBanner {
		padding:80px 35px 90px;
	}
}
*/
@media screen and (max-width: 768px) {
	#introBlock #introBanner h2 {
		border:none !important;
	}
}

/* INCLUSIONS BOX */
#inclusionsBlock {
	padding-bottom:50px; /* compensate for item bottom margins */
}
#inclusionsBlock .row {
	margin-top:45px;
	justify-content:center;
}
#inclusionsBlock .row > div {
	margin-bottom:30px;
	text-align:center;
}
#inclusionsBlock i {
	display:block;
	margin:0 auto .625rem;
	font-size:50px;
	line-height:1;
	color:#8c8c8c;
	transition:color .1s /*, transform .1s Cameron: this is jittery */;
}
#inclusionsBlock a:hover i {
	color:#f60;
	transform:scale(1.1);
}
#inclusionsBlock .row a {
	text-decoration:none;
}
#inclusionsBlock .row strong {
	display:block;
	margin-bottom:.625rem;
	font-size:1.1875rem; /* 19px */
	line-height:1.25;
	letter-spacing:-.015em;
}
@media screen and (max-width: 600px) {
	#inclusionsBlock {
		padding-bottom:30px; /* compensate for item bottom margins */
	}
}
@media screen and (max-width: 575px) {
	#inclusionsBlock .row > div {
		padding-left:85px; /* including Bootstrap padding */
		text-align:left;
	}
	#inclusionsBlock i {
		float:left;
		margin-left:-70px;
	}
}
@media screen and (max-width: 500px) {
	#inclusionsBlock .row > div {
		padding-left:80px; /* including Bootstrap padding */
		text-align:left;
	}
	#inclusionsBlock i {
		margin-left:-65px;
		font-size:45px;
	}
	#inclusionsBlock .row strong {
		font-size:1.09375rem; /* 17.5px */
		line-height:1.35;
		letter-spacing:-.005em;
	}
}

/* CATEGORIGES BLOCK */
#categoriesBlock {
	padding-bottom:30px; /* compensate for item bottom margins */
}
#categoriesBlock a.catTitle {
	text-decoration:none;
	display:block;
	padding-top:35.4%; /* a little less to prevent sub-pixel feathering on bottom edge */
	position:relative;
}
#categoriesBlock a.catTitle img {
	position:absolute;
	top:0;
	left:0;
	background-color:#eee;
	background-image:radial-gradient(#f4f4f4, #d6d6d6);
}
#categoriesBlock .row {
	text-align:center;
	justify-content:center;
	margin-top:40px;
}
#categoriesBlock .row > .col-md-6 {
	margin-bottom:50px;
}
#categoriesBlock .row > div > div {
	height:100%; /* force to same height as flex cells, so they're always the same height */
	position:relative;
	background:#f2f2f2;
}
/* use borders so that these show up when printing */
#categoriesBlock .smallGroups {
	border-top:5px solid #5278c4;
	border-bottom:5px solid #5278c4;
}
#categoriesBlock .valueVacations {
	border-top:5px solid #8ab354;
	border-bottom:5px solid #8ab354;
}
#categoriesBlock .independent {
	border-top:5px solid #5ea9e7;
	border-bottom:5px solid #5ea9e7;
}
#categoriesBlock .customGroups {
	border-top:5px solid #757575;
	border-bottom:5px solid #757575;
}
#categoriesBlock h3 {
	margin:0;
	padding:18px 1em;
	color:#fff;
	font-weight:bold;
	font-size:1.875rem; /* 30px */
	line-height:1.15;
	text-transform:uppercase;
	text-shadow:1px 1px 5px rgba(0,0,0,.4);
}
#categoriesBlock .smallGroups h3 {
	background:#5278c4;
}
#categoriesBlock .valueVacations h3 {
	background:#8ab354;
}
#categoriesBlock .independent h3 {
	background:#5ea9e7;
}
#categoriesBlock .customGroups h3 {
	background:#757575;
}
#categoriesBlock .catContent {
	padding:10px 20px 65px;
}
#categoriesBlock .catContent ul.row {
	margin:0 -15px;
	padding:0;
	list-style:none;
	text-align:center;
}
#categoriesBlock .catContent ul.row > li {
	margin-bottom:1.25rem;
}
#categoriesBlock .catContent i {
	display:block;
	width:3.125rem; /* 50px */
	height:3.125rem; /* 50px */
	font-size:3.125rem; /* 50px */
	line-height:1;
	vertical-align:middle;
	text-align:center;
	color:#8c8c8c;
	margin:0 auto 10px;
	transition:color .1s /* Cameron: animating transform is jittery */;
}
#categoriesBlock .catBtn {
	position:absolute;
	bottom:20px;
	left:0;
	right:0;
	text-align:center;
}
@media screen and (max-width: 768px) {
	#categoriesBlock .row > .col-md-6 {
		margin-bottom:50px;
		max-width:550px;
	}
}
@media screen and (max-width: 600px) {
	#categoriesBlock {
		padding-bottom:10px;
	}
}
@media screen and (min-width: 768px) and (max-width: 900px),
			 screen and (max-width: 500px) {
	#categoriesBlock h3 {
		font-size:1.6rem;
	}
}
@media screen and (max-width: 400px) {
	#categoriesBlock h3 {
		font-size:1.5rem;
	}
}
@media screen and (min-width: 768px) and (max-width: 1000px),
			 screen and (max-width: 500px) {
	#categoriesBlock .catContent ul.row {
		display:table;
		margin-left:auto;
		margin-right:auto;
	}
	#categoriesBlock .catContent ul.row > li {
		max-width:none;
		margin-bottom:1.25rem;
		padding-top:.3125rem;
		padding-left:4.0625rem;
		text-align:left;
	}
	#categoriesBlock .catContent i {
		font-size:2.1875rem; /* 35px */
		position:absolute;
		margin-left:-4.0625rem;
		margin-top:-.3125rem;
	}
}

/* EXPERTS BLOCK */
#expertsBlock {
	padding-bottom:50px; /* compensate for item bottom margins */
}
#expertsBlock .row {
	text-align:center;
	justify-content:center;
	margin-right:-60px;
	margin-left:-60px;
	margin-top:40px;
}
#expertsBlock .row > div {
	margin-bottom:0;
	padding-left:60px;
	padding-right:60px;
}
#expertsBlock .row .row {
	margin-right:-20px;
	margin-left:-20px;
	margin-top:0;
}
#expertsBlock .row .row > div {
	margin-bottom:30px;
	padding-left:20px;
	padding-right:20px;
	min-width:200px;
}
#expertsBlock .col h3 {
	margin-top:0;
	text-align:left;
}
#expertsBlock .col p {
	margin:0 0 10px;
	text-align:left;
}
#expertsBlock img {
	border-radius:50%;
	display:block;
}
#expertsBlock small {
	margin-top:10px;
	display:block;
}
@media screen and (max-width: 946px) {
	#expertsBlock .col h3,
	#expertsBlock .col p {
		text-align:center;
	}
}
@media screen and (max-width: 768px) {
	#expertsBlock .row .row > div {
		max-width:500px;
	}
	#expertsBlock img {
		margin-right:auto;
		margin-left:auto;
	}
}
@media screen and (max-width: 600px) {
	#expertsBlock {
		padding-bottom:30px; /* compensate for item bottom margins */
	}
}


@media screen and (max-width: 768px) {
	#proofBlock p:first-of-type {
	 display:none;
	}
}

/* REVIEWS & PHOTOSLURP */
#reviewsSlider {
	margin:30px 40px 40px;
}
#reviewsSlider.loading {
	min-height:75px;
	text-align:center;
	padding:15px 0;
	background:url(../media/gallery/icons/loading.gif) center center no-repeat;
	border-top:none;
}
#reviewsSlider .slick-prev {
	left:-40px;
	background:none;
	color:#1655bc;
}
#reviewsSlider .slick-next {
	right:-40px;
	background:none;
	color:#1655bc;
}
#reviewsSlider .slick-prev:hover,
#reviewsSlider .slick-prev:focus,
#reviewsSlider .slick-next:hover,
#reviewsSlider .slick-next:focus {
	color:#f60;
	box-shadow:none;
}
#reviewsSlider .slick-slide {
	transition:all ease-in-out .3s;
	outline:none;
}
#reviewsSlider .slick-slide.slick-active {
	outline:none;
}
#reviewsSlider .review {
	margin:0 25px;
	font-size:.90625rem; /* 14.5px */
	line-height:1.65;
	text-align:center;
}
#reviewsSlider .review .stars-outer {
	margin-bottom:10px;
	font-size:1.375rem; /* 22px */
	vertical-align:absmiddle;
}
#reviewsSlider .review strong {
	display:block;
	margin-bottom:10px;
	line-height:1.55;
}
#reviewsSlider .review blockquote {
	margin-bottom:15px;
	padding:0;
	line-height:inherit;
}
#reviewsSlider .review .review-name {
	font-weight:600;
}
#reviewsSlider .review .review-date {
	color:#808080;
	margin-left:.5em;
}
.ps-container {
	margin-top:35px;
}
.ps-container .ps-gallery.ps-theme-modern .ps-spinner-gallery {
	background:url(../media/gallery/icons/loading.gif) center center no-repeat;
	width:100%;
	height:90%;
	-webkit-animation:none;
	animation:none;
	border-radius:0;
	position:absolute;
	top:0;
	left:0;
}
.ps-container .ps-gallery.ps-theme-modern {
	margin-left:-6px;
	margin-right:-6px;
	font-family:'Open Sans',sans-serif !important;
	position:relative;
}
.ps-gallery.ps-theme-modern .ps-load-more-container {
	margin:50px auto 0 !important;
	padding:0 !important;
	border-top:2px solid #d1e9fe !important;
	width:auto;
}
.ps-gallery.ps-theme-modern .ps-load-more-button {
	font-size:.84375rem !important; /* 13.5px */
	line-height:1.25rem !important;
	font-weight:600 !important;
	font-family:'Open Sans',sans-serif !important;
	background:linear-gradient(to bottom,#fff 0,#eee 100%) !important;
	border-color:rgba(131,184,254,1);
	color:#06F;
	text-shadow:0 0 1px rgba(255,255,255,1);
	border-radius:.4em !important;
	border:1px solid #83B8FE !important;
	text-transform:uppercase;
	letter-spacing:.05em;
	padding:5px 1.5em 6px !important;
	margin-top:-16px;
	display:inline-block !important;
	outline:none;
	-webkit-box-shadow:0 0 0 25px #fff;
	box-shadow:        0 0 0 25px #fff;
}
.ps-gallery.ps-theme-modern .ps-load-more-button:hover {
	background:-moz-linear-gradient(top, #fff 0%, #fff2e5 100%) !important; /* FF3.6+ */
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#fff2e5)) !important; /* Chrome,Safari4+ */
	background:-webkit-linear-gradient(top, #fff 0%,#fff2e5 100%) !important; /* Chrome10+,Safari5.1+ */
	background:-o-linear-gradient(top, #fff 0%,#fff2e5 100%) !important; /* Opera 11.10+ */
	background:-ms-linear-gradient(top, #fff 0%,#fff2e5 100%) !important; /* IE10+ */
	background:linear-gradient(to bottom, #fff 0%,#fff2e5 100%) !important; /* W3C */
	border-color:#ff9326 #e55c00 #e55c00 #ff9326 !important;
	/* gradients in all versions of IE & MS Edge have aliasing problems at edges; this seems to fix it */
	border-color:rgba(255,147,38,1) rgba(229,92,0,1) rgba(229,92,0,1) rgba(255,147,38,1);
	color:#f60;
}
.ps-theme-modern .ps-hover-overlay {
	background:rgba(62,62,62,.7) !important;
}
.ps-theme-modern .ps-hover-overlay .ps-share {
	background:rgba(62,62,62,.8) !important;
}

/* THEMES & FEATURED TOURS */
#themesSlider {
	height:270px;
	margin:35px -3px 50px;
	padding:0;
	list-style:none;
}
#themesSlider li {
	list-style:none;
	float:left;
	width:20%;
	height:270px;
	margin:0;
	padding:0;
	text-align:center;
	outline:none;
}
#themesSlider figure {
	display:block;
	width:100%;
	max-width:244px; /* keep aspect ratio: 239px + 6px border - 1px cropping to prevent aliased edges */
	overflow:hidden;
	margin:0 auto;
	padding:0;
	border-left:3px solid #f2f2f2; /* simulate 6px spacing with border */
	border-right:3px solid #f2f2f2;
	color:#fff;
	position:relative;
	outline:none;
}
/* Trying to force the images to stretch to fill both the width and height of a variable-size container while also all while keeping aspect ratio is tricky.
	 Could use the new-fangled object-fit:cover, but it only works in cutting-edget browsers. Instead, just keep the images the exact height of the container
	 and crop them from the sides as necessary. And don't allow containers to ever stretch bigger than the image aspect ratio, even though this may result in
	 spacing between the tiles. Lastly, instead of using a CSS transform to center the images in the container, which often results in subpixel placement
	 and aliasing, instead use a wrapper with a negative margin and center the image inside, which seems to snap the image to the nearest pixel. The result
	 is much sharper images. */
#themesSlider figure div {
	z-index:1;
	margin:0 -50%;
}

#themesSlider figure div img { /* actual aspect ratio is 840:950 = 238.7:270 */
	display:inline-block;
	border:none;
	height:270px;
	width:auto;
}
/* create pseudo element so it stays behind everything else */
#themesSlider figure:before {
	z-index:2;
	content:'';
	background:#3695b9;
	background:-webkit-linear-gradient(top, rgba(48,133,165,0) 0%, rgba(48,133,165,0.5) 25%, rgba(48,133,165,0.8) 50%, rgba(48,133,165,1) 100%);
	background:linear-gradient(to bottom, rgba(48,133,165,0) 0%, rgba(48,133,165,0.5) 25%, rgba(48,133,165,0.8) 50%, rgba(48,133,165,1) 100%);
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	opacity:0;
	/* starts 50% below top */
	-webkit-transform:translateY(50%);
	transform:translateY(50%);
	-webkit-transition:opacity .35s, -webkit-transform .35s;
	transition:opacity .35s, transform .35s;
}
#themesSlider figure b {
	z-index:3;
	position:absolute;
	top:8%;
	left:0;
	width:100%;
	height:50%;
	padding:0 8%;
	text-align:center;
	color:#fff;
	font-size:1.875rem; /* 30px */
	line-height:2rem;
	font-weight:700;
	text-shadow:1px 1px 5px rgba(0,0,0,.6);
	letter-spacing:-.025em;
	-webkit-transition:bottom .35s, top .35s;
	transition:bottom .35s, top .35s;
	-webkit-transition:-webkit-transform .35s;
	transition:transform .35s;
}
#themesSlider figure figcaption {
	z-index:3;
	padding:0 8%;
	text-align:center;
	position:absolute;
	top:50%;
	left:0;
	width:100%;
	height:50%;
	opacity:0;
	/* starts at 100% below top */
	-webkit-transform:translateY(50%);
	transform:translateY(50%);
	-webkit-transition:opacity .35s, -webkit-transform .35s;
	transition:opacity .35s, transform .35s;
}
#themesSlider figure p {
	margin:0 0 20px;
	padding:0;
	font-size:.9375rem; /* 15px */
	line-height:18px;
}
#themesSlider figure a.btn {
	min-height:0;
	font-size:.75rem; /* 12px */
	visibility:hidden;
	opacity:0;
	transition:opacity .3s 0s, visibility 0s .3s;
}
#themesSlider figure:hover:before {
	opacity:1;
	/* slides up to top */
	-webkit-transform:translateY(0);
	transform:translateY(0);
}
#themesSlider figure:hover b {
	-webkit-transform:translateY(15%);
	transform:translateY(15%);
}
#themesSlider figure:hover figcaption {
	opacity:1;
	-webkit-transform:translateY(0);
	transform:translateY(0);
}
#themesSlider figure:hover a.btn {
	visibility:visible;
	opacity:1;
	transition:visibility 0s .3s, opacity .5s .3s;
}
/* only show first 5 slides until slick loads */
/*html:not(.jsActive)*/ #themesSlider figure:nth-child(n+6) {
	display:none;
}
#themesSlider.slick-slider figure:nth-child(n) {
	display:block;
}
#themesSlider .slick-next {
	right:-15px;
}
#themesSlider .slick-prev {
	left:-15px;
}
#themesSlider .slick-next,
#themesSlider .slick-prev {
	background:#06f;
	background:rgba(0,102,255,.8);
	color:#fff;
	width:34px;
	height:34px;
}
#themesSlider .slick-prev:hover,
#themesSlider .slick-prev:focus,
#themesSlider .slick-next:hover,
#themesSlider .slick-next:focus {
	background:rgba(0,102,255,1);
	color:rgba(255,255,255,1);
	box-shadow:none;
	text-shadow:1px 1px 2px rgba(0,0,0,.5);
}
#themesSlider .slick-prev.slick-disabled,
#themesSlider .slick-next.slick-disabled,
#themesSlider .slick-prev.slick-disabled:hover,
#themesSlider .slick-next.slick-disabled:hover {
	background:rgba(128,128,128,.8);
	text-shadow:none;
	cursor:default;
}

#featuredToursSlider {
	margin:35px 0;
	text-align:left;
}
#featuredToursSlider .tile {
	background:#fff;
	box-shadow:0 0 8px rgba(0,0,0,.1);
}
/* only show first three slides if no JS; might consider limiting to 2 or 1 at breakpoints */
#featuredToursSlider .tile:nth-child(n+4) {
	display:none;
}
/* add wider side padding to make room for slick buttons */
#featuredToursSlider .tileFlag {
	padding-right:25px;
}
#featuredToursSlider .tileCategory {
	padding-left:25px;
}
#featuredToursSlider .tileText {
	padding-left:25px;
	padding-right:25px;
}
#featuredToursSlider .tileBtns {
	left:25px;
	right:25px;
}
#featuredToursSlider.slick-slider {
	display:block;     /* not grid */
	margin:35px -15px; /* compensate for gutters */
}
/* use Flex to force slides to same height using flex: https://stackoverflow.com/questions/49028877/slick-carousel-force-slides-to-have-the-same-height */
#featuredToursSlider.slick-slider .slick-track {
	display:-ms-flexbox; /* IE 10 */
	display:flex;
}
/* note that when we load Slick, we wrap each tile in a container */
#featuredToursSlider.slick-slider .slick-slide {
	height:inherit !important;
	outline:none;
	padding:0 15px 8px; /* gutters + room for drop shadow */
}
/* show all slides */
#featuredToursSlider.slick-slider .tile:nth-child(n) {
	display:block;
}
#featuredToursSlider.slick-slider .tile {
	height:100%;
	display:inline-block; /* center in the slides, if wider */
	margin:0 auto;
}
/* create masks to hide slides as they slide in and out of stage, above slides but below buttons */
#featuredToursSlider.slick-slider::before {
	content:'';
	background:#f2f2f2;
	width:11px; /* room for tile drop shadows */
	height:100%;
	position:absolute;
	top:0;
	left:0;
	z-index:2;
}
#featuredToursSlider.slick-slider::after {
	content:'';
	background:#f2f2f2;
	width:11px; /* room for tile drop shadows */
	height:100%;
	position:absolute;
	top:0;
	right:0;
	z-index:2;
}
#featuredToursSlider .slick-next,
#featuredToursSlider .slick-prev {
	background:#06f;
	background:rgba(0,102,255,.8);
	color:#fff;
	width:34px;
	height:34px;
	z-index:3; /* above side masks */
}
#featuredToursSlider .slick-next {
	right:-2px;
}
#featuredToursSlider .slick-prev {
	left:-2px;
}
#featuredToursSlider .slick-prev:hover,
#featuredToursSlider .slick-prev:focus,
#featuredToursSlider .slick-next:hover,
#featuredToursSlider .slick-next:focus {
	background:rgba(0,102,255,1);
	color:rgba(255,255,255,1);
	box-shadow:none;
	text-shadow:1px 1px 2px rgba(0,0,0,.5);
}
@media screen and (max-width: 625px) {
	#themesSlider .slick-next,
	#themesSlider .slick-prev,
	#featuredToursSlider .slick-next,
	#featuredToursSlider .slick-prev {
		width: 25px;
		height: 25px;
	}
	#themesSlider .slick-next {
		right: -10px;
	 }
	#themesSlider .slick-prev {
		left: -10px;
	 }
	 #featuredToursSlider .slick-next {
		 right: 3px;
	}
	#featuredToursSlider .slick-prev {
		left: 3px;
	}
}
/* BIBLICAL JOURNEYS */
#biblicalJourneysBlock .row {
	text-align:center;
}
#biblicalJourneysBlock .row > .col-sm {
}
#biblicalJourneysBlock img {
	max-width:100%;
}
#biblicalJourneysFeatureImg {
	overflow:hidden;
}
#biblicalJourneysFeatureImg a {
	display:block;
	height:100%;
	margin:0 -200px;
	text-align:center;
}
#biblicalJourneysFeatureImg img {
	max-width:525px;
	max-height:263px;
	width:auto;
	height:100%;
}
#biblicalJourneysBlock p {
	margin:35px 0 30px;
}
@media screen and (max-width: 576px) {
	#biblicalJourneysFeatureImg a {
		margin:0;
	}
	#biblicalJourneysFeatureImg img {
		width:100%;
		height:auto;
	}
}

@media print {
	body * {
		text-shadow:none !important;
	}
	div#heroBox {
		width:100%;
		box-shadow:none;
	}
	body footer {
		padding-top:0;
	}
	form#tourSearch fieldset {
		background:#fff !important;
	}
	#categoriesBlock h3 {
		background:none !important;
		color:#333;
	}
	#themesSlider figure b {
		color:#333;
	}
}