/* Styles for my final project */
*{
    padding: 0;
    margin:0;
    box-sizing: border-box;
}
/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on March 20, 2024 */

@font-face {
    font-family: 'alex_brushregular';
    src: url('../fonts/alexbrush-regular-webfont.woff2') format('woff2'),
         url('../fonts/alexbrush-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
body{
    background: #F25E7A;
    font-family: cursive;
}
header{
    height: 80px;
    margin-bottom: 10px;
    text-align: center;
}
#primary{
    height: 50px;
    background: rgb(5, 196, 196);
    border-radius: 10px;
}
#primary li{
    line-height: 50px;
    float: left;
    list-style-type: none;
    width:20%;
    text-align: center;
}
#primary a{
    text-decoration: none;
    display: block;
    color:#020659;
}
#primary a:hover{
    background:rgb(6, 155, 155);
    border-radius: 10px;
}
.home #primary li:nth-child(1) a,
.about #primary li:nth-child(2) a,
.events #primary li:nth-child(3) a,
.locations #primary li:nth-child(4) a,
.contact #primary li:nth-child(5) a{
    background:rgb(6, 155, 155);
    border-radius: 10px;
}
#secondary li{
    list-style-type: none;
    margin-bottom:30px;
}
#third li{
    list-style-type: none;
    margin-bottom: 20px;
}
#secondary a{
    text-decoration: none;
    color:#020659;
    padding:15px;
    display: block;
    font-size: 1.2em;
}
#third a{
    text-decoration: none;
    color:#020659;
    display: block;
    padding:10px;
    padding-left:20px;
    font-weight: bold;
}
#secondary a:hover, #third a:hover{
    background:#cc6b8f;
}
#wrapper{
    width: 940px;
    margin:10px auto;
}
#hero{
    margin-bottom: -5px;
}
main{
    width:580px;
    float: left;
    padding:10px;
}
.thx h1, .thx p{
    text-align: center;
    margin-bottom: 30px;
}
h1, h2{
    font-family: 'alex_brushregular';
}
.home h2{
    font-family: cursive;
}
.thx p{
    margin-bottom: 30px;
}
.thx p a{
    text-align: center;
    font-size: 1.5em;
    color:#020659;
}
h1{
    font-size: 3.5em;
    margin-bottom: 0px;
    line-height: 1.3;
}
.contact h1{
    margin-bottom: 25px;
}
h2{
    font-size: 2.8em;
    margin-bottom: 15px;
}
.about img{
    margin-top: 10px;
    margin-bottom: 15px;
}
.about main p{
    margin-bottom: 30px;
}
.events .column img{
    float:left;
    margin-right: 20px;
}
.events h2{
    font-size: 2.5em;
}
.events .third{
    margin-bottom: 30px;  
}
p{
    margin-bottom: 20px;
    line-height: 1.4em;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}
.events img+p{
    margin-right:20px;
}
/* .record-donations h2{
    font-size: 2.5em;
} */
.record-donations main img,
.seventy-night main img,
.lady-eighty main img,
.disney-week main img,
.karaoke-night main img{
    width: 100%;
    margin-bottom: 20px;
    margin-top: 10px;
}
.record-donations aside a,
.seventy-night aside a,
.lady-eighty aside a,
.disney-week aside a,
.karaoke-night aside a{
    color:#020659;  
}
h3{
    font-size: 2em;
    margin-bottom: 10px;
}
.events h3{
    margin-bottom: 25px;
}
aside{
    width:340px;
    float: right;
    background: rgb(5, 196, 196);
    padding:10px 30px 10px 30px;
}
aside p{
    margin-top: 15px;
}
.events aside, .locations aside, 
.record-donations aside,
.seventy-night aside,
.lady-eighty aside,
.disney-week aside,
.karaoke-night aside{
    background: #BF4B75;
    border:2px #020659 solid;
}
.record-donations #secondary li:nth-child(1) a,
.seventy-night #secondary li:nth-child(2) a,
.lady-eighty #secondary li:nth-child(3) a,
.disney-week #secondary li:nth-child(4) a,
.karaoke-night #secondary li:nth-child(5) a{
    background:#cc6b8f;
}
/* .contact aside{
    margin-top:110px;
} */
.locations h2{
    margin-bottom: 25px;
    /* margin-top: 5px; */
}
.locations aside li{
    color:#020659;
    font-size: 1.1em;
}
.locations p{
    margin-bottom: 30px;
}
.locations main img{
    margin-bottom: -5px;
    width: 100%;
}
.locations a{
    color:black;
}
h4{
    font-size: 1.6em;
    margin-bottom: 25px;
    padding-top:15px;
    text-decoration: underline;
}
.home h4{
    text-align: center;
}
.center{
display: block;
margin: 0 auto;
}
footer{
    height:50px;
    line-height: 50px;
    background: #BF4B75;
    clear: both;
    /* border-radius: 10px; */
}
footer li{
    list-style-type: none;
    float: left;
    width:20%;
    text-align: center;
}
footer a{
    color:black;
    text-decoration: none;
}
form{
    max-width: 580px;
    margin-bottom: 20px;
}
fieldset{
    padding:10px;
    border-radius:5px;
    border: 1.5px solid rgb(104, 1, 39);
    background: rgb(5, 196, 196);
}
legend{
    font-size: 1.3em;
    font-style: italic;
    padding:0 5px;
}
label{
    display: block;
    margin-bottom: 5px;
    font-weight:bold;
    font-size: 1.1em;
}
input{
    margin-bottom: 10px;
    height:30px;
    width:100%;
}
input[type=radio],
input[type=checkbox] {
    height:auto;
    width:auto;
    margin-right: 3px;
    margin-bottom: 3px;
}
form ul{
    margin-left: 15px;
    margin-bottom: 10px;
}
form li{
    list-style-type: none;
}
select{
    margin-bottom: 10px;
    font-family: cursive;
    font-weight:600;
    padding: 2px;
}
input[type="submit"] {
    width:auto;
}
textarea{
    width:100%;
    height:110px;
    margin-bottom: 10px;
}
form a{
    color:#020659; 
}
input[type=submit]{
    font-family: cursive;
    font-weight:600;
    /* background: rgb(5, 196, 196); */
    padding: 3px;
}