@import url('https://fonts.googleapis.com/css2?family=Boogaloo&family=Catamaran:wght@100..900&family=Caveat+Brush&family=Merriweather:ital,opsz,wght@0,18..144,300..900;1,18..144,300..900&family=Winky+Sans:ital,wght@0,300..900;1,300..900&display=swap');

body{
     background-color: #fcfbfa;
     margin: auto;
}

header{
    display: flex;
    justify-content: space-between;
    position: sticky; 
    top: 0;
    background-color: #faefe3;
    align-items: center;
    padding:1rem;
    margin-bottom: 1.8rem;
}

.dark-bg{
    background-color: #302d2b;
}

footer{
text-align: center;
background-color: #faefe3;
padding:1.5rem;
padding-bottom:3rem;
padding-left: 3rem;
margin-top:1.8rem;
}

.dark{
    margin-top:0;
}

footer a{
    color:#e37b20;
    font-weight:600;
    
}

footer a:hover{
    
    color:#c25b00;

}

.footericons{
    display: flex;
    margin: auto;
    align-items: center;
    justify-content: center;
}

.footericons img{
    max-width: 50px;
    padding:.3rem;
    padding-top:.6rem;
}

.footercredits p{
    text-align: left;
    margin:0;

    
}

img
{
    max-width: 100%;
    height: auto;
    display: block;  
    margin: auto; 
}

.logo img{
max-width: 70px;
padding:0;
}









.indexflex{
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 1000px;
    margin: auto;
}

.indexflex img{
    max-width: 450px;
    margin: 0;
    
}

.indexinfo a{
    text-decoration: none;
    color:#e37b20;
    font-weight: 700;
}

.indexinfo a:hover{
    color:#c25b00;
    transition-duration: .2s;
}




.about img{
    max-width: 400px;
}

.about{
    display: flex;
    
    padding:0 2rem;
    max-width: 900px;
    margin: .5rem auto;
    
    align-items: center;
    
}

.mission{
   background-color: #302d2b;
    padding:2rem 0;
   
    
    
    
}

.mission h2{
    color:#fcfbfa;
}

.mission p{
    margin: auto;
    color:#fcfbfa;
}










.artwork-artistname a{
    padding: .3rem .5rem .3rem .5rem;
    border:none;
    font-family:'Catamaran', sans-serif; 
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing:.08rem;
    background-color:#e37b20;
    color:#fcfbfa;
    border-radius:6px;
    text-decoration: none;
    font-size:.8rem;
    text-align: center;
}

.artwork-artistname a:hover{
    transition-duration:.5s;
    background-color:#c25b00;
}

.artwork-artistname h4{
    text-align: center;
    margin-top:0;
}


.artwork h3{
    text-align: center;
    margin-bottom: 0;
    margin-top:1.5rem;
}

.exhibit{
    display: grid;
    gap:1.5rem;
    grid-template-columns: 1fr 1fr 1fr;
    padding:1rem;
    padding-top:0;
    max-width: 1000px;
    margin: auto;
}




.exhibit-artwork img{
    width: 100%;
  height: 350px; 
    transition: transform .8s ease;
    cursor: url('images/plus.png'), auto;
    object-fit: cover;

    
}

.exhibit-artwork img:hover{
    transform: scale(1.03);
}

.artwork-artistname{
    margin-bottom:1.5rem;
}

.exhibit-artwork h4{
    font-size: .9rem;
    font-weight: 700;
    margin:0rem;
    padding:0;
}

.fullsize h4{
    
    color:#e37b20;
    text-decoration: underline #e37b20;
    padding-bottom: .5rem;

}

.fullsize h4:hover{
    color:#c25b00;
    transition-duration: .3s;
}

input[type=checkbox]{
    display:none;
    
}

input[type=checkbox]:checked ~ label > img{
    transform:scale(1.3);
    cursor: url('images/minus.png'), auto;
    height: auto;             
    object-fit: contain;
   

}








.logo{
    display: flex;
    align-items:center;
    
}

.logo img{
    padding-bottom:0;
}




a{
    font-family:'Catamaran', sans-serif; 
}



.artwork-button{
    padding: 1.2rem;
}

.artists-button{
    padding: 1.2rem;
}

.index-buttons{
    background-color: #302d2b;
    text-align: center;
    padding:2rem;
}

.index-buttons a{
     padding: .8rem 1.2rem .8rem 1.2rem;
    border:none;
    font-family:'Catamaran', sans-serif; 
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing:.08rem;
    background-color:#e37b20;
    color:#fcfbfa;
    border-radius:6px;
    text-decoration: none;
    font-size:1.3rem;
}

.index-buttons a:hover{
    transition-duration:.5s;
    background-color:#c25b00;
}

.indexinfo p{
    margin: auto;
    padding-bottom:2rem;
    padding-top:.5rem;
}




.artist-info{
    display: flex;
    background-color: #faefe3;
    padding:2rem;
    max-width: 800px;
    margin: 2rem auto;
    border-radius: 15px;
    
}

.artist-info-text2{
    order: 2;
    text-align: left;
    padding-left:2rem;
}

.artist-info-text{
    text-align: right;
    padding-right:2rem;
}

.artist-info a{
    padding: .3rem .5rem .3rem .5rem;
    border:none;
    font-family:'Catamaran', sans-serif; 
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing:.08rem;
    background-color:#e37b20;
    color:#fcfbfa;
    border-radius:6px;
    text-decoration: none;
    font-size:.8rem;
}

.artist-info a:hover{
    transition-duration:.5s;
    background-color:#c25b00;
}


.artist-info img{
    max-width: 350px;
    max-height: 350px;
    border-radius: 15px;
}

.artist-info h4{
    margin:0;
}

.artist-info h3{
    margin:0.5rem;
}














 h1{
    text-align: left;
    font-size:2rem;
    margin:0;
    padding:.5rem;
    font-family: 'Winky Sans', sans-serif;
    
}
         
h1 a{
    text-decoration:none;
    text-align: left;
    color: #e37b20;
    font-family: 'Winky Sans', sans-serif;
}



h2{
    font-family: 'Winky Sans', sans-serif;
    font-size: 2.4rem;
    color:#e37b20;
    text-align: center;
    margin: 1rem 0;
}

h3{
    font-family:'Catamaran', sans-serif; 
    font-size: 2rem;
    font-weight: 800;
    margin: 1rem 0;
    color:#302d2b;
}

h4{
    font-family:'Catamaran', sans-serif; 
    font-size: 1.2rem;
    font-weight: 500;
    margin: 1rem 0;
    color:#302d2b;
}

p{
   font-family:'Catamaran', sans-serif;  
   max-width: 550px;
   color:#302d2b;
}

nav ul{
    list-style-type: none;
    margin:0;
    text-align: right;
    display: flex;
    padding: 1rem;
    
}
    
nav a{ 
    padding: .3rem .5rem .3rem .5rem;
    border:none;
    font-family:'Catamaran', sans-serif; 
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing:.08rem;
    background-color:#e37b20;
    color:#fcfbfa;
    border-radius:6px;
    text-decoration: none;
    font-size:.8rem;
    
}

nav a:hover{
    transition-duration:.5s;
    background-color:#c25b00;
}
    
nav li{
    padding:0.7rem;
    
}