/*
Theme Name: John T. Fleming
Author: Ktisis Web, LLC.
Author URI: https://ktisisweb.com
Description: A custom classic theme built for JohnTFleming.info.
Version: 1.0
Text Domain: john-t-fleming
*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}

body {
	font-family: 'Open Sans', sans-serif;
	font-size: 16px;
	line-height: 1.5;
	background-color: #002e5d;
	margin: 0;
	padding: 0;
	font-family: "Futura LT W01 Medium";
	color: #fff;

	a {
		color: inherit;
	}
}

.primary-header {
	background-color: #3e9be9;
	font-size: 14px;
	font-weight: 300;
	text-transform: uppercase;
	font-family: "DIN Next Rounded LT W01 Light";

	.main-navigation {
		width: 980px;
		margin: 0 auto;
	
		.menu {
			display: flex;
	
			a {
				display: block;
				text-decoration: none;
				transition: color 0.3s ease;
				padding: 16px 18px;
				color: rgba(255, 255, 255, 0.9);

				&:hover {
					color: #dcc8a4;
				}
			}
			li {
				&:first-child {
					a {
						padding-left: 0;
					}
				}
			}
			.current-menu-item {

				a {
					color: rgb(0, 46, 93);
				}
			}
		}
	}
}

.primary-content,
.primary-footer {
	max-width: 980px;
	margin: 0 auto;
}

.primary-content {

	.page-title {
		margin: 40px 0 20px;
		font-family: "Cinzel", serif;
		font-optical-sizing: auto;
		font-size: 60px;
		text-transform: uppercase;
		color: #fff;
	}

	.container {
		background-color: rgba(5, 5, 5, 0.6);
	}
}

.home {
	
	.page-title {
		font-size: 83px;
		margin-bottom: 10px;
	}
	.row {
		display: flex;
		column-gap: 20px;
		row-gap: 20px;
	}
	.col {
		flex: 1;

		&:last-child {
			max-width: 420px;
		}
	}
	.quote {
		font-size: 17px;
		font-weight: 700;
		text-align: center;
		padding: 20px;
		margin-bottom: 20px;
		background-color: rgba(255, 255, 255, 0.9);
		color: #000;

		span {
			display: block;

			&:first-child {
				font-family: "Cinzel", serif;
				font-size: 42px;
				font-weight: 400;
			}
		}
	}
	video {
		width: 100%;
		height: auto;
		max-width: 100%;
		aspect-ratio: 16 / 9;
	}
	img {
		max-width: 100%;
	}
}

.awards {
	color: #fff;

	h2 {
		font-size: 20px;
		font-weight: 700;
	}
	span {
		color: #3D9BE9;
	}
	p {
		font-size: 15px;
	}

	.row {
		margin-bottom: 20px;
		padding: 30px;
		background-color: rgba(5, 5, 5, 0.7);

		&:last-child {
			margin-bottom: 0;
		}
	}
}

.about {

	.container {
		padding: 35px;

		.row {
			display: flex;
			justify-content: space-between;
			margin-bottom: 40px;

			img {
				width: 100%;
				max-width: 240px;
			}
			.col {
				text-align: right;

				h2 {
					font-family: "Cinzel", serif;
					font-size: 33px;
				}
				p {
					font-size: 15px;
				}
			}
		}
		p {
			margin-bottom: 20px;

			&:last-child {
				margin-bottom: 0;
			}
		}
	}
}

.serves {
	span {
		color: #3D9BE9;
	}

	.row {
		margin-bottom: 20px;
		padding: 30px;
		background-color: rgba(5, 5, 5, 0.6);
		font-size: 19px;

		&:nth-child(2n+3) {
			background-color: #fff;
			color: #000;
		}
		&:last-child {
			margin-bottom: 0;
		}
	}
}

.story {

	.container {

		background-color: rgba(255, 255, 255, 0.9);

		.row {
			display: flex;
			column-gap: 40px;
			padding: 33px 37px;

			.col {

				h2, p, figcaption {
					color: #000;
				}
				h2, .quote {
					font-family: "Cinzel", serif;
				}
				p, figcaption {
					font-size: 15px;
				}
				h2 {
					font-size: 24px;
				}
				h3 {
					font-size: 20px;
					color: rgb(39, 107, 165);
				}
				p {
					margin-bottom: 20px;
				}

				figcaption {
					font-style: italic;
				}

				img {
					max-width: 100%;
				}

				.blue {
					color: #045184;
				}
				.quote {
					font-size: 45px;
					color: rgb(39, 107, 165);
				}
				.attribution {
					margin-bottom: 40px;
				}

                &:first-child {
                    flex: 2;
                }
                &:last-child {
                    flex: 1;
					display: flex;
					flex-direction: column;
					justify-content: space-between;
                }
			}
		}
	}
}

.contact {

	.row {
		display: flex;
		column-gap: 20px;
		row-gap: 20px;

		.col {
			flex: 1;

			&:first-child {
				padding: 20px 40px;
				color: rgb(5, 5, 5);
				background-color: rgba(255, 255, 255, 0.9);
			}

			&:last-child {
				
				img {
					display: block;
					width: 322px;
				}
			}

			hr {
				margin: 20px 0;
				width: 37px;
				height: 2px;
				border: 0;
				background-color: rgb(5, 5, 5);
			}

			h2 {
				font-weight: 800;
			}

			p {
				margin-bottom: 20px;
			}
		}
	}
}

.primary-footer {
	padding: 30px 0;

	p {
		color: #fff;
		font-size: 14px;
		font-family: "DIN Next Rounded LT W01 Light";
	}
}