/*********************************************************************************************

x. Basic Setup (Body, Fonts, etc.) 

********************************************************************************************/
@media only screen and (max-width:1200px) {
	.wrapper {
		margin: 0 50px;
	}
}
@media only screen and (max-width:1100px) {
	h1 {
		font-size: 3.125em; /* 50px */
	}
	h2 {
		font-size: 2.8125em; /* 45px */
	}
	h3 {
		font-size: 2.5em; /* 40px */
	}
}
@media only screen and (max-width:900px) {
	h1 {
		font-size: 3.125em; /* 50px */
	}
	h2 {
		font-size: 2.8125em; /* 45px */
	}
	h3 {
		font-size: 2.500em; /* 40px */
	}
	h4 {
		font-size: 2.1875em; /* 35px */
	}
}
@media only screen and (max-width:800px) {
	.wrapper {
		margin: 0 30px;
	}
}
@media only screen and (max-width:500px) {
	h1 {
		font-size: 2.500em; /* 40px */
	}
	h2 {
		font-size: 2.250em; /* 36px */
	}
	h3 {
		font-size: 2.000em; /* 32px */
	}
	h4 {
		font-size: 1.750em; /* 28px */
	}
	h5 {
		font-size: 1.500em; /* 24px */
	}
	h6 {
		font-size: 1.000em;
	}
}



/********************************************************************************************* 

x. Announcement

*********************************************************************************************/
@media only screen and (max-width:1200px) {
	.announcement .columns {
		margin: 0 -25px;
	}
	.announcement .columns .column .inside {
		padding: 0 25px;
	}
}
@media only screen and (max-width:800px) {
	.announcement {
		padding: 60px 0;
	}
	.announcement .columns {
		margin: 0 -15px;
	}
	.announcement .columns .column .inside {
		padding: 0 15px;
	}
}
@media only screen and (max-width:700px) {
	.announcement .columns .column.width-50 {
		width: 100%;
	}
	.announcement .columns .column.width-50:first-child {
		margin: 0 0 30px 0;
	}
}

/********************************************************************************************* 

x. Banner

*********************************************************************************************/
@media only screen and (max-width:800px) {
	.banner .overlay {
		padding: 30px 0;
	}
}

/********************************************************************************************* 

x. Button

*********************************************************************************************/
@media only screen and (max-width:500px) {
	.button {
		font-size: 0.750em;
	}
}


/********************************************************************************************* 

x. bxSlider

*********************************************************************************************/
@media only screen and (max-width:1200px) {
	.slideshow-wrapper .slideshow-pager {
		width: auto;
		-moz-transform: none;
		-webkit-transform: none;
		-o-transform: none;
		-ms-transform: none;
		transform: none;
		left: 50px; right: 50px;
	}
}
@media only screen and (max-width:800px) {
	.slideshow .slider .slide {
		/*padding: 400px 0 0 0;*/
		height: 500px;
	}
	.slideshow .slider .slide .overlay {
		padding: 30px 0 60px 0;
	}
	.slideshow-wrapper .slideshow-pager {
		left: 30px; right: 30px;
	}
}
@media only screen and (max-width:700px) {
	.slideshow-wrapper.history-controls {
		padding: 0 40px;
	}
	.slideshow-wrapper.history-controls .slideshow-prev {
		-moz-transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		-o-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		transform: translateY(-50%);
		left: 0;
	}
}
@media only screen and (max-width:600px) {
	.slideshow .slider .slide {
		/*padding: 300px 0 0 0;*/
	}
}


/********************************************************************************************* 

x. Content

*********************************************************************************************/
@media only screen and (max-width:1000px) {
	.content ol.five-column li, 
	.content ul.five-column li {
		width: calc(25% - 20px);
	}
}
@media only screen and (max-width:900px) {
	.content ol.five-column li,
	.content ol.four-column li, 
	.content ul.five-column li, 
	.content ul.four-column li {
		width: calc(33.33% - 20px);
	}
}
@media only screen and (max-width:600px) {
	.content ol.five-column li,
	.content ol.four-column li, 
	.content ol.three-column li, 
	.content ul.five-column li, 
	.content ul.four-column li, 
	.content ul.three-column li {
		width: calc(50% - 20px);
	}
}
@media only screen and (max-width:500px) {
	.content h1, 
	.content h2, 
	.content h3, 
	.content h4, 
	.content h5, 
	.content h6, 
	.content .image,
	.content p,
	.content ol, 
	.content ul {
		margin-bottom: 20px;
	}
}
@media only screen and (max-width:400px) {
	.content ol.five-column li,
	.content ol.four-column li, 
	.content ol.three-column li, 
	.content ol.two-column li, 
	.content ul.five-column li, 
	.content ul.four-column li, 
	.content ul.three-column li, 
	.content ul.two-column li {
		width: 100%;
	}
}

/********************************************************************************************* 

x. Footer

*********************************************************************************************/
@media only screen and (max-width:1100px) {
	footer .columns .column.width-40 {
		width: 35%;
	}
	footer .columns .column.width-60 {
		width: 65%;
	}
}
@media only screen and (max-width:1000px) {
	footer .columns.bottom {
		flex-direction: column;
	}
	footer .columns.bottom .column.width-50:first-child {
		margin: 0 0 10px 0;
	}
	footer .columns.top {
		flex-direction: column;
		flex-flow: column-reverse;
	}
	footer .columns .column.width-40,
	footer .columns .column.width-50,
	footer .columns .column.width-60 {
		width: 100%;
	}
	footer .columns > .column > .inside > .columns > .column.left {
		width: 50%;
	}
	footer .content.invisible {
		display: none;
	}
	footer .credits.left,
	footer .credits.right {
		text-align: left;
	}
	footer .navigation > li {
		width: 25%;
	}
}
@media only screen and (max-width:900px) {
	footer a[href="#back-to-top"] {
		display: none;
	}
}
@media only screen and (max-width:800px) {
	footer .columns.bottom {
		margin: 30px 0 0 0;
	}
	footer .navigation {
		margin: 0 0 10px 0 !important;
	}
}
@media only screen and (max-width:700px) {
	footer .navigation > li {
		width: 33.33%;
	}
}
@media only screen and (max-width:500px) {
	footer .columns > .column > .inside > .columns > .column.left {
		width: 100%;
	}
	footer .columns > .column > .inside > .columns > .column.left:first-child {
		margin: 0 0 30px 0;
	}
	footer .navigation > li {
		width: 50%;
	}
}
@media only screen and (max-width:400px) {
	footer .navigation > li {
		width: 100%;
	}
}


/********************************************************************************************* 

x. Form

*********************************************************************************************/
@media only screen and (max-width:1024px) {
	form input[type="button"], 
	form input[type="submit"] {
		-webkit-appearance: none;
	}
	form input[type="email"], 
	form input[type="number"], 
	form input[type="password"], 
	form input[type="tel"], 
	form input[type="text"],
	form textarea {
	    border-radius: 0;
	    -webkit-appearance: none;
	}
}
@media only screen and (max-width:700px) {
	form input[type="email"], 
	form input[type="number"], 
	form input[type="password"], 
	form input[type="tel"], 
	form input[type="text"] {
		font-size: 0.875em !important;
		height: 40px;
		padding: 0 15px !important;
	}
}
@media only screen and (max-width:500px) {
	form input[type="button"], 
	form input[type="submit"] {
		font-size: 0.750em !important;
	}
}

/********************************************************************************************* 

x. Header

*********************************************************************************************/
@media only screen and (max-width:1100px) {
	header {
		padding: 40px 0;
	}
	header .desktop,
	header .mobile .navigation.slinky li.icon .icon,
	header .mobile .navigation.slinky li.show {
		display: none;
	}
	header .logo {
		margin: 0;
	}
	header .mobile {
		display: block;
	}
	header .top .columns {
		align-items: flex-start;
	}
	header .mobile .navigation.slinky li.icon h6 {
		font-size: 1rem;
	}
	header .mobile .navigation.slinky li.parent:not(:nth-child(2)) {
		display: none;
	}
	header .wrapper {
		position: static;
	}
}
@media only screen and (max-width:800px) {
	header {
		padding: 30px 0;
	}
}
@media only screen and (max-width:700px) {
	header .mobile .navigation.buttons li:nth-last-child(2) {
		display: none;
	}
}
@media only screen and (max-width:500px) {
	header .logo {
		width: 200px;
	}
	header .mobile .navigation.buttons li:not(:last-child) {
		display: none;
	}
}

/********************************************************************************************* 

x. History

*********************************************************************************************/
@media only screen and (max-width:800px) {
	.history .columns {
		margin: 0 -30px;
	}
	.history .columns .column .inside {
		margin: 0 30px;
	}
	.history .columns .column .inside .content {
		padding: 0;
	}
}
@media only screen and (max-width:700px) {
	.history .columns {
		flex-direction: column;
	}
	.history .columns .column.width-50 {
		width: 100%;
	}
	.history .columns .column.width-50:first-child {
		margin: 0 0 30px 0;
	}
}

/********************************************************************************************* 

x. Links

*********************************************************************************************/
@media only screen and (max-width:1200px) {
	.links.two-columns .grid {
		margin: -25px;
	}
	.links.two-columns .grid .item .inside {
		padding: 25px;
	}
}
@media only screen and (max-width:1000px) {
	.links .grid .item .image .overlay {
		background: black;
		display: block;
		position: relative;
	}
}
@media only screen and (max-width:800px) {
	.links.three-columns .grid,
	.links.two-columns .grid {
		margin: -15px;
	}
	.links.three-columns .grid .item .inside,
	.links.two-columns .grid .item .insidee {
		padding: 15px;
	}
}
@media only screen and (max-width:700px) {
	.links .grid .item {
		width: 100%;
	}
	.links .grid .item .image .overlay {
		background: rgba(0, 0, 0, 0.7);
		position: absolute;
	}
}


/********************************************************************************************* 

x. Main

*********************************************************************************************/
@media only screen and (max-width:1200px) {
	main section.spacing {
		margin-bottom: 50px;
	}
	main section.spacing.border {
		margin-bottom: 50px !important;
		padding-bottom: 50px;
	}
	main section.spacing.border:first-child {
		padding-top: 25px;
	}
	main section.spacing.border:last-child {
		margin-bottom: 50px;
	}
	section.full-width + section.full-width {
		margin-top: -50px;
	}
}
@media only screen and (max-width:800px) {
	main section.spacing {
		margin-bottom: 30px;
	}
	main section.spacing.border {
		margin-bottom: 30px !important;
		padding-bottom: 30px;
	}
	main section.spacing.border:first-child {
		padding-top: 15px;
	}
	main section.spacing.border:last-child {
		margin-bottom: 30px;
	}
	section.full-width + section.full-width {
		margin-top: -30px;
	}
}

/********************************************************************************************* 

x. Promotion

*********************************************************************************************/
@media only screen and (max-width:1200px) {
	.promotion .content.bottom {
		margin: 0 -50px;
		padding: 100px 50px;
	}
	.promotion .content.bottom .columns {
		margin: 0 -25px;
	}
	.promotion .content.bottom .columns .column .inside {
		padding: 0 25px;
	}
}
@media only screen and (max-width:800px) {
	.promotion .content.bottom {
		margin: 0 -30px;
	}
	.promotion .content.bottom .columns {
		margin: 0 -15px;
	}
	.promotion .content.bottom {
		padding: 60px 30px;
	}
	.promotion .content.bottom .columns .column .inside {
		padding: 0 15px;
	}
}
@media only screen and (max-width:700px) {
	.promotion .content.bottom .columns .column.width-50 {
		width: 100%;
	}
	.promotion .content.bottom .columns .column.width-50:first-child {
		margin: 0 0 30px 0;
	}
}

/********************************************************************************************* 

x. Search Results

*********************************************************************************************/
@media only screen and (max-width:800px) {
	.search-results .pagination {
		margin: 30px 0 0 0;
	}
	.search-results .search-result {
		margin: 0 0 30px 0;
		padding: 0 0 30px 0;
	}
	.search-results .search-result .columns {
		margin: 0 -15px;
	}
	.search-results .search-result .columns .column .inside {
		padding: 0 15px;
	}
}
@media only screen and (max-width:600px) {
	.search-results .search-result .columns .column.width-25 {
		display: none;
	}
	.search-results .search-result .columns .column.width-75 {
		width: 100%;
	}
}



/********************************************************************************************* 

x. Shows

*********************************************************************************************/
@media only screen and (max-width:1200px) {
	.shows form .columns {
		margin: 0 0 30px 0;
		flex-direction: column;
	}
	.shows form .columns .column.width-25,
	.shows form .columns .column.width-75 {
		width: 100%;
	}
	.shows form .columns .column:first-child {
		margin: 0 0 30px 0;
	}
	.shows form .columns .column .inside {
		padding: 0;
	}
}
@media only screen and (max-width:800px) {
	.shows .grid {
		margin: -15px;
	}
	.shows .grid .item .inside {
		padding: 15px;
	}
	.shows .show .columns {
		margin: 0 -15px;
	}
	.shows .show .columns .column .inside {
		margin: 0 15px;
	}
}
@media only screen and (max-width:700px) {
	.shows .grid .item.width-33 {
		width: 50%;
	}
	.shows .show {
		margin: 30px 0 0 0;
	}
}
@media only screen and (max-width:600px) {
	.shows form {
		padding: 0;
	}
	.shows .show .columns .column.width-40,
	.shows .show .columns .column.width-60 {
		width: 100%;
	}
	.shows .show .columns .column.width-40 {
		margin: 0 0 30px 0;
	}
}
@media only screen and (max-width:500px) {
	.shows form .view-full-calendar {
		border: none;
		padding: 0;
	}
	.shows form .columns .column .filters li {
		width: 100%;
	}
	.shows .grid .item.width-33 {
		width: 100%;
	}
}

/********************************************************************************************* 

x. Slick

*********************************************************************************************/
@media only screen and (max-width:800px) {
	.slick-slider.pager {
		padding: 0 20px;
	}
}

/********************************************************************************************* 

x. Sponsors

*********************************************************************************************/
@media only screen and (max-width:900px) {
	.sponsors .grid .item.width-33 {
		width: 100%;
	}
}


/********************************************************************************************* 

x. Sub-Navigation

*********************************************************************************************/
@media only screen and (max-width:600px) {
	.sub-navigation {
		height: 0;
		padding: 0;
		overflow: hidden;
	}
}

/********************************************************************************************* 

x. Support Links

*********************************************************************************************/
@media only screen and (max-width:500px) {
	.support .links .columns .column.width-15 {
		width: 25%;
		margin: 0 0 30px 0;
	}
	.support .links .columns .column.width-85 {
		width: 100%;
	}
}


/********************************************************************************************* 

x. Stay Connected

*********************************************************************************************/
@media only screen and (max-width:900px) {
	.stay-connected .columns .column.width-33 {
		width: 50%;
	}
	.stay-connected .columns .column.width-33:last-child {
		width: 100%;
		margin: 50px 0 0 0;
	}
	.stay-connected .social-media li a svg {
		width: 40px; height: 40px;
	}
}
@media only screen and (max-width:800px) {
	.stay-connected .columns .column.width-33:last-child {
		margin: 30px 0 0 0;
	}
}
@media only screen and (max-width:600px) {
	.stay-connected .columns .column.width-33 {
		width: 100%;
		margin: 0 0 30px 0;
	}
	.stay-connected .columns .column.width-33:last-child {
		margin: 0;
	}
}


/********************************************************************************************* 

x. Team

*********************************************************************************************/
@media only screen and (max-width:1200px) {
	.team + .text {
		margin-top: 0;
	}
	.team + .text .wrapper {
		padding: 25px 0 0 0;
	}
}
@media only screen and (max-width:800px) {
	.team + .text .wrapper {
		padding: 15px 0 0 0;
	}
}
@media only screen and (max-width:500px) {
	.team .columns .column.width-25 {
		width: 35%;
		margin: 0 0 30px 0;
	}
	.team .columns .column.width-75 {
		width: 100%;
	}
}


/********************************************************************************************* 

x. Text + Image
x. Text + video

*********************************************************************************************/
@media only screen and (max-width:800px) {
	.text-image .columns, 
	.text-video .columns {
		margin: 0 -15px;
	}
	.text-image .columns .column .inside, 
	.text-video .columns .column .inside {
		margin: 0 15px;
	}
}
@media only screen and (max-width:700px) {
	.text-image.text-position-left .columns, 
	.text-video.text-position-left .columns,
	.text-image.text-position-right .columns, 
	.text-video.text-position-right .columns {
		flex-direction: column;
	}
	.text-image .columns .column, 
	.text-video .columns .column {
		width: 100% !important;
	}
	.text-image .columns .column:first-child, 
	.text-video .columns .column:first-child {
		margin: 0 0 30px 0;
	}
	.text-image .columns .column .image img {
		width: auto; height: auto;
		max-width: 100%;
		margin: 0 auto;
	}
}


/********************************************************************************************* 

x. Tribe

*********************************************************************************************/
@media only screen and (max-width:1200px) {
	#tribe_events_filter_item_show-categories,
	#tribe_events_filter_item_show-venues {
		width: 100% !important;
		margin: 0 0 30px 0 !important;
	}
	#tribe_events_filters_form > fieldset > div {
		padding: 0 !important;
	}
}
@media only screen and (max-width:768px) {
	#tribe-mobile-container {
		margin: 30px 0 0 0 !important;
	}
	#tribe-events-content .tribe-events-calendar td.tribe-events-present:hover, 
	.tribe-events-calendar td.tribe-events-present {
		background-color: #005266 !important;
	}
	.tribe-events-calendar td.tribe-events-present div[id*="tribe-events-daynum-"], 
	.tribe-events-calendar td.tribe-events-present div[id*="tribe-events-daynum-"] > a {
		background: none !important;
	}
	#tribe-events-content .tribe-events-calendar .mobile-active:hover, 
	#tribe-events-content .tribe-events-calendar td.tribe-events-othermonth.mobile-active, 
	#tribe-events-content .tribe-events-calendar td.tribe-events-othermonth.mobile-active div[id*="tribe-events-daynum-"], 
	#tribe-events-content .tribe-events-calendar td.tribe-events-othermonth.mobile-active div[id*="tribe-events-daynum-"] a, 
	.tribe-events-calendar .mobile-active div[id*="tribe-events-daynum-"], 
	.tribe-events-calendar .mobile-active div[id*="tribe-events-daynum-"] a, 
	.tribe-events-calendar td.mobile-active {
		background-color: #008fb3 !important;
	}
	.tribe-filters-open #tribe_events_filters_wrapper, 
	.tribe-filters-open #tribe_events_filters_wrapper.tribe-events-filters-horizontal, 
	.tribe-filters-open #tribe_events_filters_wrapper.tribe-events-filters-vertical {
		position: relative !important;
	}
	#tribe_events_filters_wrapper .tribe-events-filters-group-heading {
		background: none !important;
		border: none !important;
	}
}
@media only screen and (max-width:600px) {
	.tribe-events-filters-horizontal #tribe_events_filters_form {
		padding: 0 !important;
	}
}
@media only screen and (max-width:500px) {
	#tribe_events_filter_item_show-categories ul li {
		width: 100% !important;
	}
}


/********************************************************************************************* 

x. Two Columns

*********************************************************************************************/
@media only screen and (max-width:1000px) {
	.two-columns > .wrapper > .columns {
		margin: 0 -50px;
		flex-direction: column;
	}
	.two-columns > .wrapper > .columns > .column.width-30,
	.two-columns > .wrapper > .columns > .column.width-70 {
		width: 100%;
	}
	.two-columns > .wrapper > .columns > .column:last-child:before {
		width: 100%; height: 1px;
		bottom: auto;
		right: 0;
	}
	.two-columns > .wrapper > .columns > .column > .inside {
		padding: 50px;
	}
	.two-columns > .wrapper > .columns > .column .expandable-content .area .people .grid .item.width-20 {
		width: 25%;
	}
}
@media only screen and (max-width:800px) {
	.two-columns > .wrapper > .columns {
		margin: 0 -30px;
	}
	.two-columns > .wrapper > .columns > .column > .inside {
		padding: 30px;
	}
	.two-columns > .wrapper > .columns > .column .spacing {
		margin: 0 0 30px 0;
	}
	.two-columns > .wrapper > .columns > .column:last-child .spacing {
		padding: 0 0 30px 0;	
	}
	.two-columns > .wrapper > .columns > .column .expandable-content .area .people .content {
		margin: 30px 0 0 0;
	}
}
@media only screen and (max-width:600px) {
	.two-columns > .wrapper > .columns > .column .expandable-content .area .people .grid .item.width-20 {
		width: 33.33%;
	}
}
@media only screen and (max-width:400px) {
	.two-columns > .wrapper > .columns > .column .expandable-content .area {
		margin: 0 0 20px 0;
		padding: 20px 0 0 0;
	}
	.two-columns > .wrapper > .columns > .column .expandable-content .area .link a:after {
		border-width: 0 4px 8px 4px;
	}
	.two-columns > .wrapper > .columns > .column .expandable-content .area .people .grid .item.width-20 {
		width: 50%;
	}
}

/********************************************************************************************* 

x. Upcoming Events

*********************************************************************************************/
@media only screen and (max-width:800px) {
	.upcoming-events .slider .slide .inside {
		padding: 0 15px;
	}
}

/********************************************************************************************* 

x. Smaller than 1024px

*********************************************************************************************/
@media only screen and (max-width:1024px) {
	/*
	input,
	textarea {
	    border-radius: 0;
	    -webkit-appearance: none;
	}
	*/
	
}