@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Cantata+One');
/* CSS Document */

* { margin: 0; padding: 0; box-sizing: border-box; }
body {
	background-color: #000;
    background-image: url(../images/mainBackground2021.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	font-family: 'ITC Avant Garde Gothic Std', 'Century Gothic', sans-serif; 
}

/* -------------- HEADER -------------- */
 
header h1 { 
	color: #C1B49A;  
	text-transform: uppercase;
	text-align: center;
	font-size: 3em;
	font-weight: bold;
	margin-bottom: 10px;
}
.subHeader {
	background: #AA9964;
	margin: 0px 0px 20px 0px;
    padding: 0px 0px 0px 0px;
}
.subHeader h2 { 
	color: #664F36;
	text-transform: uppercase;
	text-align: center;
	font-weight: bold;
	font-size: 4.2em;
	letter-spacing: 5px;
	margin-bottom: -5px;
}
.subHeader p {
	font-weight: bold;
	color: #664F36;
	text-transform: uppercase;
    text-align: center;
    letter-spacing: 1px;
} 

/* -------------- CONTENT -------------- */ 
.mainContent { padding: 25px 20px 0px 20px; }
.mainContent h3 {
	text-transform: uppercase;
	text-align: center;
	font-weight: bold;
	color: #C1B49A;
	font-size: 2.7em;
	letter-spacing: 3px;
	margin: 5px 0px 10px 0px;
}
.mainContent p {
	color: #C1B49A;
	text-align: center;
	font-size: .9em;
	line-height: 25px;
}
.styleChairman {
	font-weight: bold;
	font-size: 1.4em;
}
.boldMainContent {
	font-weight: bold;
	font-size: 1.2em;
}
.boldMainContent a { color: #C1B49A; }
a.boldMainContent:hover { text-decoration: none; text-transform: uppercase;}

img.visionImg { margin: 0px 0px 5px 0px; }
img.aguaCalienteLogo { margin: 25px 0px 30px 0px; }
ul.footerMenu { list-style: none; text-align: center; margin-bottom: 0px; }
ul.footerMenu li a { color: #C1B49A; }
ul.footerMenu li {
	display: inline-block;
    color: #C1B49A;
    font-weight: bold;
    text-transform: uppercase;
	border-right: 1px solid #C1B494;
    padding: 0px 20px 0px 20px;
	margin-bottom: 10px;
}
ul.footerMenu li:last-child { border-right: none; }

/* -------------- MODAL -------------- */
.rows:after {
	content: "";
	display: table;
	clear: both
}
.column {
	width: 12.5%; 
	float: left;
	padding: 5px;
}
.column img { cursor: pointer; opacity: .8; }
.column img:hover { opacity: 1; }

.slides { display: none; transition: .5s ease-in-out; }
.imgs img { cursor: pointer; opacity: .8; }
.imgs img:hover { opacity: 1; }

@media (max-width: 1200px) {
	.container { max-width: 100%; }
	.mainContent h3 { font-size: 2.4em; }
}
@media (max-width: 1035px) {
	header h1 { font-size: 2em; padding-top: 10px; }
	.subHeader h2 { font-size: 3em; }
	.subHeader p { font-size: .7em; padding: 0px 10px; } 
	.mainContent h3 { font-size: 2em; letter-spacing: 0px; }
	ul.footerMenu li { padding: 0px 10px 0px 10px; }
}
@media (max-width: 755px) { 
	.mainContent h3 { font-size: 1.7em; }
	.column { width: 25%; }
}
@media (max-width: 705px) {
	header h1 { font-size: 1.5em; }
	.subHeader h2 { font-size: 2.4em; }
}
@media (max-width: 705px) {
	header h1 { font-size: 1.2em; } 
}
@media (max-width: 576px) {
	img.headerImg {
		display: block;
		margin: 0 auto;
		margin-bottom: 15px;
	}
}
@media (max-width: 490px) {
	ul.footerMenu li { border-right: none; font-size: .8em; display: block; }
}

















 



