/*
	Theme Name: Relentless Dragon October 2019 Theme
	Author: Erika Stokes
	Version: 1.0
*/

/*
	This site makes use of the following additional files, in order.
	Do NOT NOT NOT put CSS in this file and expect it to behave normally.
	It  might... or it might screw up all the CSS in the entire site.
	
	* /css/main.css
	* /css/header.css
	* /css/side-menu.css
	* /css/two-thirds-col.css
*/




@media only screen and (min-width: 601px) {
		div.two-col-ul-list {
			display: flex;
			flex-direction: row;
			justify-content: flex-start;
			align-items: stretch;
			max-width: 100%;
		}
}

		div.two-col-ul-list {
			margin-bottom: 15px;
			}

			div.ul-col1,
			div.ul-col2 {
				max-width: 100%;
				min-width: 300px;
				padding: 0px 10px;
				}

				div.ul-col1 ul,
				div.ul-col2 ul {
					margin-left: 20px;
					font-family: 'Sarabun', sans-serif;
					}

@media only screen and (max-width: 600px) {
	div.ul-col1,
	div.ul-col2 {
		display: block;
		}
}



@media only screen and (min-width: 875px) {
	div.tablecontainer {
		clear: both;
		width: 100%;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		align-items: stretch;
		}
}

/*
@media only screen and (min-width: 800px) {
	div.tablecontainer {
		clear: none;
		float: left !important;
		width: 100%;
	}
}
*/

	div.one-third-col {
		width: calc(100% - 12px);
		padding: 10px 2px 10px 10px;
		background-color: white;
		border: 2px solid #5371aa;
		border-radius: 10px; 
		margin-top: 10px;
		height: 400px;
		overflow: auto;
		hyphens: auto;
		}

@media only screen and (max-width: 874px) {
	div.one-third-col {
		display: block;
		clear: both;
		}
}

@media only screen and (min-width: 875px) {
	div.one-third-col {
		width: calc(50% - 31px);
		float: left;
		display: table-cell;
		box-shadow: 2px 2px 2px #226885;
		}

	div.right-col {
		margin-left: 15px;
	}
}

@media only screen and (min-width: 875px) {
	div.one-third-col {
		width: calc(50% - 31px);
		margin-left: 15px;
	}
}


div.front-page-news-article {
	border-bottom: 1px solid gray;
	padding-bottom: 5px;
	}

	div.article2 {
		margin-top: 15px;
		clear: both;
		border-bottom: 1px solid #cccccc;
		padding-bottom: 10px;
		}

		div.article2 h2 {
			margin-bottom: 0;
			font-family: 'Squada One', cursive;
			}

			div.article2 h2 a,
			div.article2 h2 a:link,
			div.article2 h2 a:visited {
				color: mediumblue;
				text-decoration: none;
				}

			div.article2 h2 a:hover,
			div.article2 h2 a:active {
				color: #c8001a;
				}

			div.article2 p {
				font-family: 'Sarabun', sans-serif;
				}

		p.dateline {
			font-style: italic;
			margin-top: 0;
			font-size: 95%;
			margin-bottom: 0;
			}


		div.scrollcontainer {
			width: 100%;
			height: 100%;
			overflow: auto;
			}

			div.scrollcontainer p,
			div.scrollcontainer td {
				line-height: 1;
				}

		div.one-third-col h2 {
			font-family: 'Squada One', cursive;
/*			color: darkorange; */
			color: #ff7700;
			font-size: 160%;
			font-weight: normal;
			margin-top: 0px;
			margin-bottom: .15em;
			}

			div.one-third-col h2 a,
			div.one-third-col h2 a:link,
			div.one-third-col h2 a:visited {
/*				color: darkorange; */
				color: #ff7700;
				text-decoration: none;
				}

			div.one-third-col h2 a:hover,
			div.one-third-col h2 a:active {
				color: #c8001a;
				text-decoration: underline;
				}

		div.one-third-col h3 {
			font-family: 'Sarabun', sans-serif;
			font-weight: bold;
			font-size: 100%;
			margin-top: .5em;
			}

			div.one-third-col h3 a,
			div.one-third-col h3 a:link,
			div.one-third-col h3 a:visited {
				color: black;
				text-decoration: none;
				}

			div.one-third-col h3 a:hover,
			div.one-third-col h3 a:active {
				color: #c8001a;
				text-decoration: underline;
				}


		div.one-third-col p {
			font-family: 'Sarabun', sans-serif;
			}

			div.one-third-col p img {
				max-width: 150px;
				float: right;
				margin: 5px 0px 5px 5px;
				}

			div.one-third-col p a,
			div.one-third-col p a:link,
			div.one-third-col p a:visited,
			div.one-third-col td a,
			div.one-third-col td a:link,
			div.one-third-col td a:visited {
				color: mediumblue;
				text-decoration: underline;
				}

			div.one-third-col p a:hover,
			div.one-third-col p a:active,
			div.one-third-col td a:hover,
			div.one-third-col td a:active {
				color: #c8001a;
				}

			table.indexevents {
				font-family: 'Sarabun', sans-serif;
				border-collapse: collapse;
				border: 0px none transparent;
				width: 100%;
				}

				table.indexevents tr.color {
					background-color: #a3d5ee;
					}

				table.indexevents td {
					padding: 2px;
					display: table-cell;
					vertical-align: top;
					}

				table.indexevents td.col1 {
					width: 85px;
					}

footer {
	clear: both;
	width: calc(100% - 24px);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	background-color: #5371aa;
	border: 2px solid white;
	border-radius: 10px;
	margin: 10px 5px 15px 5px;
	padding: 4px 5px; 
	text-align: center;
	font-family: 'Sarabun', sans-serif;
	color: white;
	}

@media only screen and (min-width: 800px) {
	footer {
		width: calc(100% - 44px);
		margin: 15px;
		box-shadow: 2px 2px 2px #226885;
		}

		footer p {
			width: 80%;
			margin: 5px auto;
			}
}

@media only screen and (min-width: 1030px) {
	footer {
		max-width: 990px;
		margin: 15px auto;
		}
}

@media only screen and (min-width: 728px) {
	.rightimage {
		float: right !important;
		}
}

p.news-excerpt2 {
	font-family: 'Sarabun', sans-serif;
	}

p.news-excerpt3 {
	margin-top: 6px;
	font-family: 'Sarabun', sans-serif;
	}

div.news-excerpt-container {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	/*align-items: stretch; */
	width: 100%;
	padding: 0px !important;
	clear: both;
	}

div.news-medium-image {
	text-align: center;
	display: table-cell;
	vertical-align: top !important;
	padding: 0px !important;
	margin-top: 0px !important;
	}

	div.news-medium-image img {
		padding: 0px !important;
		margin: 0px !important;
		}


div.news-excerpt-text {
	font-family: 'Sarabun', sans-serif;
	width: calc(100% - 350px);
	min-width: 100px;
	}

@media screen and (max-width: 700px) {
	div.news-medium-image {
		display: none;
	}

	div.news-excerpt-text {
		width: 100%;
		}
}

@media screen and (min-width: 701px) {
	div.news-medium-image {
		width: 300px !important;
		min-width: 300px;
	}
	
	div.news-excerpt-text {
		width: calc(100% - 350px);
		margin-left: 15px;
		}
}

@media screen and (min-width: 801px) {
	div.news-medium-image {
		width: 33% !important;
		min-width: 33%;
	}
	
	div.news-excerpt-text {
		width: calc(67% - 15px);
		margin-left: 15px;
		}
}



@media screen and (min-width: 900px) {
	div.news-medium-image {
		width: 50% !important;
		min-width: 50%;
	}
	
	div.news-excerpt-text {
		width: calc(50% - 15px);
		margin-left: 15px;
		}
}


	div.news-excerpt-text p {
		margin-top: 6px;
		}


div.news-excerpt-text-no-image {
	width: calc(100% - 0px);
	}

div.news-medium-image img {
	box-shadow: 2px 2px 3px #cccccc;
	padding: 0 !important;
	margin: 0 !important;
	}


div.two-thirds-col a:not([href*='relentlessdragon.com']):not([href^='#']):not([href^='/']):not([href^='tel']):not([href*='relentlessdragon.com/store/']):after {
	content: url('images/external-link.png');
}

div.two-thirds-col ul,
div.two-thirds-col ol {
	margin-left: 30px;
	font-family: 'Sarabun', sans-serif !important;
	}

hr.half {
	width: 50%;
	}

.center, .centered, .aligncenter {
	text-align: center !important;
	}

p.center {
	font-family: 'Sarabun', sans-serif !important;
	}

.u	{
	text-decoration: underline;
	}

.b	{
	font-weight: bold;
	}

.red {
	color: red;
	}

.right {
	text-align: right;
	}

div.clear {
	clear: both;
	height: 0px;
	font-size: 0px;
	}

.aligncenter, div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
.alignleft {
float: left;
}
.alignright {
float: right;
}

img {
	max-width: 100%;
	height: auto;
	}

h3 {
	font-family: 'Sarabun', sans-serif;
	font-size: 115%;
	font-weight: bold;
	}


div.speech-bubble-ds {
	background: #bbdefb;
	background-image: url(images/ldquo-orange.png), url(images/rdquo-orange.png);
	background-position: left top, right bottom;
	background-repeat: no-repeat, no-repeat;
	border: 1px solid #a7a7a7;
	-webkit-border-radius: 8px;
			border-radius: 8px;
	-webkit-box-shadow: 8px 4px 0 rgba(0, 0, 0, 0.2);
			box-shadow: 8px 4px 0 rgba(0, 0, 0, 0.2);
	font-size: 1.2rem;
	line-height: 1.3;
	margin: 0 auto 20px;
	max-width: 400px;
	padding: 12px 15px 16px 15px;
	position: relative;
	font-family: 'Sarabun', sans-serif;
	min-height: 75px;
}

blockquote {
	width: calc(100% - 40px);
	margin: 0 auto;
	font-size: 130%;
	line-height: 130%;
	font-style: italic;
}

div.speech-bubble-ds p {
	margin-bottom: 10px;
}

div.speech-bubble-ds p:last-of-type {
	margin-bottom: 0;
}

.speech-bubble-ds-arrow {
	border-left: 21px solid transparent;
	border-top: 20px solid rgba(0, 0, 0, 0.2);
	bottom: -25px;
	position: absolute;
	right: 15px;
}
.speech-bubble-ds-arrow::before {
	border-left: 23px solid transparent;
	border-top: 23px solid #a7a7a7;
	bottom: 2px;
	content: "";
	position: absolute;
	right: 5px;
}
.speech-bubble-ds-arrow::after {
	border-left: 21px solid transparent;
	border-top: 21px solid #bbdefb;
	bottom: 4px;
	content: "";
	position: absolute;
	right: 6px;
}

div.speech-bubble-ds-citation {
	margin: 2px auto;
	max-width: 411px;
	padding-right: 21px;
	text-align: right;
	font-size: 120%;
	}

div.gallery {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: stretch;
	max-width: 680px;
	flex-wrap: wrap;
	}

	div.gallery-photo {
		width: 330px;
		margin-left: 10px;
		}

		div.gallery-photo img {
			width: 320px;
			height: auto;
			box-shadow: 2px 2px 2px #226885;
			margin: 0px auto;
			border-radius: 8px;
			}

		div.gallery-photo p {
			margin-top: 3px !important;
			text-align: center;
			}

div.page-event-container {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: stretch;
	min-width: calc(100% - 25px);
	flex-wrap: wrap;
	margin-left: 10px;
	margin-top: 7px;
	padding-bottom: 10px;
	}

	div.page-event-day-col {
		width: 100px;
		padding-bottom: 5px;
		}

		div.weeklydayabbr,
		div.dayabbr {
			width: 75px;
			height: 75px;
			display: table-cell;
			text-align: center;
			vertical-align: middle;
			color: white;
			background-color: darkorange;
			border-radius: 50px;
			margin: 0 auto;
			}

		div.dayabbr {
			line-height: .9;
			}

		div.dayabbr p {
			margin: 0px !important;
			text-align: center;
			}

		div.weeklydayabbr,
		div.dayabbr span.day {
			font-family: 'Squada One', cursive;
			font-size: 200%;
			}

		div.dayabbr span.month {
			text-transform: uppercase;
			}


	div.page-event-description-col {
		max-width: 481px;
		min-width: calc(100% - 100px);
		}

@media screen and (max-width: 799px) {
	div.page-event-description-col {
		max-width: calc(100% - 100px);
		}
}

		div.page-event-description-col p.event-data {
			margin: 0px 0px 6px 0px !important;
			}

div.eventbrite {
	float: right;
	width: 195px;
	margin-left: 15px;
	}

@media screen and (max-width: 600px) {
	div.eventbrite {
		display: none;
		}
}

p.google-event {
	margin-top: 2px !important;
	}

p.google-event img {
	display: inline !important;
	vertical-align: -12px;
	}

p.google-event a:after {
	content: none !important;
}


div.google-map-embed {
	width: 300px;
	max-width: 100%;
	height: 200px;
	margin-bottom: 15px;
	}

@media screen and (min-width: 601px) {
	div.google-map-embed {
		margin-left: 15px;
		float: right;
		}
}

p.center {
	text-align: center !important;
	}

.floatleft {
	float: left;
	}

.floatright {
	float: right;
	}

@media screen and (max-width: 600px) {
	div.block-in-small {
		display: block !important;
		float: none !important;
	}
	
	div.shrink {
		width: 50%;
		max-width: 50% !important;
		}
}

.shadow {
	box-shadow: 2px 2px 3px #cccccc;
	}

.wp-caption-text {
	background: #bbdefb;
	}

div.wp-caption {
	margin-top: 0px !important;
	padding-top: 0px !important;
	}

div.pagination {
	text-align: center;
	font-family: 'Sarabun', sans-serif;
	font-size: 120%;
	}

.space-above {
	margin-top: 12px;
	}

/* This has to come really late in the game! */
.no-shadow {
	box-shadow: none !important;
	}
	

.no-space-above {
	margin-top: 0px !important;
	padding-top: 0px !important;
	}
	

.spaceright {
	margin-right: 15px;
	}

.spaceleft {
	margin-left: 15px;
	}

.larger {
	font-size: 120%;
	}

.bold {
	font-weight: bold;
	}

.strike {
	text-decoration: line-through;
	}

div.search-form {
	max-width: calc(100% - 24px);
	margin: 12px;
	font-family: 'Sarabun', sans-serif;
	}

	div.search-form p {
		margin: 0px !important;
		text-align: center !important;
		}

	div.search-form input {
		border-radius: 6px;
		padding: 4px 6px;
		margin: 10px auto 0px auto;
		font-size: 120%;
		}

	div.search-form input[type=text] {
		background-image: url('images/magnifying-glass-16px.jpg');
		background-repeat: no-repeat;
		background-position: 6px 50%;
		padding-left: 28px;
		width: calc(100% - 44px);
		max-width: 500px !important;
		}


	div.search-form input[type=submit] {
		width: calc(100% - 4px) !important;
		max-width: 500px !important;
		text-align: center;
		margin-left: 4px;
		}

.visually-hidden { 
    position: absolute !important;
    height: 1px; 
    width: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px); /* IE6, IE7 */
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap; /* added line */
}


div.photo-single {
	width: 681px;
	max-width: calc(100% - 15px);
	margin: 15px auto;
	}
	
	div.photo-single img {
		border: 0px none transparent;
		max-width: 100%;
		height: auto;
		}

.spaceabove {
	margin-top: 12px;
	}
	
