/**
RED: 9c1f2b
The blue is #879ebd
footer dark blue 222030
**/

html{
  height: 100%;
}

body {
height: 100%;
width:100%;
color: #000;
/*font-family:Arial, Helvetica, sans-serif;*/
font-family:verdana, geneva, sans-serif;
font-size:17px;
line-height:24px;
background-color:white;
}

.padding {
padding:12px;
}

[class*="col-"]:not(:last-child){ margin-bottom: 25px; }


.wrapper {
margin:0 auto;
max-width:1300px;
border:0px solid red;
}

#header {
background-color:#2D2E2E;
margin:0 auto;
padding:0 ;
}

#header-top {
background-color:#9c1f2B;
margin:0 auto;
padding: 10px 3px;
text-align:right;
color:white;
}

#header #header-top ul{
margin:0 20px ;
padding:0;
}

#header #header-top a:link {
  color: #fff;
font-size:16px;
}

#header #header-top a:visited {
  color: #fff;
}

#header #header-top a:hover {
  color:#ccc; 
}

#header #header-top a:active {
  color: #fff;
}

#header #header-links {
margin:0 auto;
min-height:80px;
padding:20px 10px;
background-color:white;
}

#header #header-links #logo {
max-height:50px;
float:left;
padding:0;
margin-bottom:40px;
display:block;
}

#header #header-links #top-nav{
float:right;
border:0px solid blue;
margin-top:13px;
}

#header #header-links #top-nav .nav li{
margin-right:25px;
}

#header #header-links a:link {
  color: #333;
font-size:95%;
}

#header #header-links a:visited {
  color: #333;
}

#header #header-links a:hover {
  color:#ccc;
text-decoration: underline;
}

#header #header-links a:active {
  color: #333;
}

#header .nav .dropdown-menu {
padding:10px;
min-width:200px;
}

#content {
margin:20px auto;
padding:20px;
max-width:100%;
background-color:white;
border:0px solid red;
}

#content .red{
color:#9c1f2b;
}
#content .flex-container{
  display: flex; /* Establishes a flex container */
  flex-direction: row; /* Default: items arranged horizontally */
  justify-content: center; /* Default: items aligned to the start of the main axis */
align-items: center; /* Default: items stretch to fill the container along the cross axis */
  align-items: flex-start;
align-items: stretch;
flex-wrap: wrap; /* Default: items stay on a single line */
align-content: center;
}

#content .flex-item{
width:30%;
margin:10px auto;
text-align:center;
}

#content .flex-item img{
margin:10px auto 20px auto;
max-height:120px;
max-width:300px;
width:90%;
}

#content a:link {
  color: #000;
font-size:17px;
text-decoration: underline;
}

#content a:visited {
  color: #000;
}

#content a:hover {
color:#666;
}

#content a:active {
  color: #000;
}


#content h1{
color:#aa0026;
color:#fff;
font-size:30px;
background-color:#879ebd;
padding:10px;
margin:0 auto 30px auto;
}

body#home #content h1{
text-align:center;
color:#aa0026;
font-size:34px;
}

#content h2{
color:#222030;
color:#9c1f2b;
font-size:28px;
text-transform: capitalize;
margin:20px 0; 
}

#content h3{
color:#666;
color:#9c1f2b;
font-size:24px;
text-transform: capitalize;
}

body#home #content #home-sports{
margin:40px auto;
} 

body#home #content #home-sports img{
display:block;
margin:10px auto 20px auto;
box-shadow: 5px 5px 3px #ccc;
    border-radius: 3px;
}

body#sponsorship #content img#platinum-sponsorship{
float:right;
padding:0 0 20px 20px;
max-width:500px;
}

body#sponsors #content .flex-container{
margin: 0 auto 40px auto;
border:1px solid #ccc;
padding:10px;
}

body#sponsors #content #all-sponsors h2,
body#home #content #sponsors h2{
text-transform: capitalize;
margin:30px auto 10px auto;
background-color:#ccc;
color:#222030;
}


body#home #content #home-sports{
margin:40px auto;
} 

body#home #content #home-sports img{
display:block;
margin:10px auto ;
box-shadow: 5px 5px 3px #ccc;
    border-radius: 3px;
width:95%;
}

body#sponsorship #content img#platinum-sponsorship{
float:right;
padding:0 0 20px 20px;
max-width:500px;
}

body#sponsors #content .flex-container{
margin: 0 auto 40px auto;
border:1px solid #ccc;
padding:10px;
}

body#sponsors #content #all-sponsors h2,
body#home #content #sponsors h2{
text-transform: capitalize;
margin:20px auto;
background-color:#ccc;
color:#222030;
padding:12px;
text-align:center
}

body#home #content #sponsors .flex-container{
margin: 0 auto 40px auto;
border:1px solid #ccc;
padding:10px 0;
}

body#home #content #sponsors .flex-container img{
width:90%;
}

body#sponsors #content #all-sponsors .flex-container{
margin: 0 auto 40px auto;
border:0px solid #ccc;
padding:10px 0;
}

body#sponsors #content #all-sponsors .flex-container .flex-item{
margin:20px 10px;
padding:20px;
border:1px solid #ccc;
min-width:200px;
}

body#sponsors #content #all-sponsors b,
body#home #content #sponsors b{
font-size:120%;
}

#content #myAllForm label{
font-weight:bold;
}

body#sponsorship-form #myAllForm{
margin:30px 10px;
background-color:#f1f1f1;
padding:15px;
}

body#leadership #content .flex-container{
margin: 0 auto 40px auto;
border:0px solid #ccc;
padding:10px;
}

body#leadership #content #leadership h2{
text-transform: capitalize;
margin:30px auto 10px auto;
background-color:#ccc;
color:#222030;
padding:10px;
}

body#leadership #content #leadership .flex-item {
border:1px solid #ccc;
padding:15px;
background-color:#f9f9f9;
}

body#leadership #content #leadership .flex-item .position{
font-size:110%;
margin-bottom:25px;
}

body#leadership #content #leadership .flex-item .staff_email{
font-style: italic;
}
#content a.btn-blue{
background-color:#222030;
padding:10px 30px;
color:white;
}

#content a:link.btn-blue{
color:white;
font-size:125%;
}



#footer{
margin:20px auto 0 auto;
background-color:#222030;
padding:40px 20px;
color:#ccc;
font-size:16px;
}

#footer b{
color:white;
}

#footer a:link {
  color: #ccc;
font-size:16px;
text-decoration: underline;
}

#footer a:visited {
  color: #ccc;
}

#footer a:hover {
color:#fff;
}

#footer a:active {
  color: #ccc
}

#footer #footer-logo {
max-height:150px;
}

#footer ul#footer-links{
list-style-type:none;
margin:0;
padding: 0px 40px 5px 0px;
}

#copyright{
color:white;
background-color:#9c1f2b;
margin:0 auto;
padding:20px;
text-align:center;
}

@media (max-width: 1000px) {

}

@media (max-width: 992px) {

}

@media (max-width: 768px) {

	body#home #content #sponsors .flex-container .flex-item,
	body#sponsors #content #all-sponsors .flex-container .flex-item{
	width:45%;
	}
}


@media (max-width: 480px) {

	body#home #content #sponsors .flex-container .flex-item,
	body#sponsors #content #all-sponsors .flex-container .flex-item{
        width:90%;
        }
}

