/*!
Theme Name: Country Club Auto Group
Theme URI: http://underscores.me/
Author: Bob Dennett
Author URI: http://underscores.me/
Description: New Wordpress Theme for Country Club Auto Group
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: country-club-auto-group
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Country Club Auto Group is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
*/

:root {
	--red: #B81037;
	--blue: #027BC5;
	--yellow: #f6be15;
}

body {
	margin: 0;
	padding: 0;
	font-family: sans-serif;
	font-size: 20px;
}

header {
	width: 100%;
	height: auto;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
	gap: 1em;
	padding: 1% 0;
}

.header-section {
	width: 100%;
	height: auto;
	background: white;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.header-section:nth-of-type(2) {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 1em;
	text-align: center;
}

#blue {
	color: var(--blue);
}

#red {
	color: var(--red);
}

.soc-icons {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2em;
}

.soc-icons a {
	color: #000;
}

.soc-icons a i {
	font-size: 1.75em;
}

@media screen and (max-width:1100px) {

	.header-section:nth-of-type(1),
	.header-section:nth-of-type(3) {
		display: none;
	}

	.soc-icons {
		padding: 2.5% 0;
	}
}

.main-internal {
	width: 100%;
	height: auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.internal-section {
	width: 100%;
	height: auto;
}

.internal-section:nth-of-type(1) {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1em;
	position: relative;
}

.main-logo {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	height: auto;
	z-index: 999;
	/* padding: 25px 5px; */
	background: #fff;
	border-radius: 25px;
}

.main-logo img {
	width: 300px !important;
	height: auto;
	padding: 20px;
}

@media screen and (max-width:900px) {
	.internal-section:nth-of-type(1) {
		grid-template-columns: 1fr;
	}

	.main-logo img {
		display: none;
	}
}

.image-item {
	width: 100%;
	height: auto;
	min-height: 50vh;
	background-size: cover;
	background-repeat: no-repeat;
	display: flex;
	align-items: center;
}

.image-item a {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
}

#left {
	justify-content: flex-start;
}

#right {
	justify-content: flex-end;
}

.image-item img {
	width: 250px;
	padding: 20px;
	background: #fff;
}

.image-item:nth-of-type(1) {
	background-image: url('/wp-content/uploads/2025/10/CCAUTO_AG-landing-pg-left.jpg');
	background-position: right;
	justify-content: flex-start;
	border-bottom: 10px solid var(--blue);
}

.image-item:nth-of-type(2) {
	background-image: url('/wp-content/uploads/2025/10/CCAUTO_AG-landing-pg-right.jpg');
	background-position: left;
	justify-content: flex-end;
	border-bottom: 10px solid var(--red);
}

.image-item:nth-of-type(3) {
	background-image: url('/wp-content/uploads/2025/10/Hyundai_1.png');
	background-position: left;
	justify-content: flex-end;
	border-bottom: 10px solid var(--yellow);
}

.image-item:nth-of-type(4) {
	background-image: url('/wp-content/uploads/2025/10/CDJR.png');
	background-position: left;
	justify-content: flex-end;
	border-bottom: 10px solid var(--yellow);
}

#motors {
	border-top-right-radius: 100px;
	border-bottom-right-radius: 100px;
	padding-right: 10%;
}

#nissan {
	border-top-left-radius: 100px;
	border-bottom-left-radius: 100px;
	padding-left: 10%;
}

@media screen and (max-width:900px) {
	.image-item {
		min-height: 50vh;

	}

	#motors {
		padding-right: 15%;
	}

	#nissan {
		padding-left: 15%;
	}
}

.logo-item:nth-of-type(1) {
	display: grid;
	grid-template-columns: repeat(8, 1fr);
	gap: 1em;
	padding: 5% 0;
}

@media screen and (max-width:1100px) {
	.logo-item:nth-of-type(1) {
		gap: 3em;
		grid-template-columns: repeat(4, 1fr);
	}
}

@media screen and (max-width:900px) {
	.logo-item:nth-of-type(1) {
		gap: 3em;
		grid-template-columns: repeat(2, 1fr);
	}
}

.logo-section {
	width: 100%;
	height: auto;
	display: flex;
	align-items: center;
	justify-content: center;
}

.logo-section img {
	width: 125px;
	height: auto;
}

.logo-item:nth-of-type(2) {
	padding: 0 10% 2.5% 10%;
	text-align: center;
}

.logo-item:nth-of-type(3) {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2em;
}

@media screen and (max-width:990px) {
	.logo-item:nth-of-type(3) {
		flex-direction: column;
		gap: 0;
	}
}

.logo-item:nth-of-type(3) img {
	width: 300px;
	height: auto;
}