* {
    box-sizing: border-box;
}

body {
    background-color: white;
    max-width: 100%;
    margin: 0;
    color: black;
    
  

}


img {
    max-width: 100%;
    object-fit: cover;
    contain: content;
}

.title-header {
    background-color: #ccd4da;
    border-bottom: 2px solid #002849;
    padding: 15px 40px 15px;
    margin: 0;

    display: flexbox;

}


.clear {
    clear: both;
}


.content-title h2 {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: 30px;
    font-weight: bold;
    color: black;
}






.content-title {
    line-height: 60px;
    width: 100%;
    display: block;
    text-align: center;
}




.content {
    line-height: 1.6em;
    font-size: 18px;
    font-family: Georgia, 'Times New Roman', Times, serif !important;
    color: #333
}



.header {
    position: sticky;
    top: 0;
    display: flexbox;
    
    z-index: 99;
}

.title {
    font-size: 28px;
    font-family: Georgia, 'Times New Roman', Times, serif;
    color: black;
    line-height: initial;

}


.subtitle {
    font-size: 20px;
    color: #002849;
    
    font-family: Georgia, 'Times New Roman', Times, serif;
    line-height: 30px;
}


[class*="col-"] {
    width: 100%;

}

.section {
    width: 100%;
    padding: 20px;
    border-bottom: 2px solid #002849;



}




div.section:nth-of-type(even) {
    background-color: gainsboro;
    border-bottom: 2px solid #404040;
}



.flex-container {
    display: flex;
    flex-direction: row;
}

.col-1-3 {
    flex: 33%;
    padding: 10%
}

img.me {
    width: 80%;
    object-fit: contain;
    margin: auto;
    display: block;
    max-height: 250px;


}


ul.navigation {
    padding: 0px;
    text-align: left;
    margin: 0;
    background-color: whitesmoke;

}


.navigation li {
    list-style: none;
    color: black;
   text-align: center;
    height: 30px;
    display: block;
    letter-spacing: 1.5px;
    box-shadow: 0px 2px 5px 0px rgba(204, 212, 218, .5);

 }


 .menu-content{
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition: visibility 1s linear 0.2s, opacity 0.2s ease-in-out;
 }



 

.collapsible-menu label{

    letter-spacing: 1.2px;

    font-size: 18px;

    cursor: pointer;

    text-align: center;

    height: 30px;

    line-height: 30px;

display: block;

    z-index: 400;

    background-color: whitesmoke;

    font-weight: bold;



 

}



input#menu{

    display: none;


}



 input:checked + label .fa-bars {

display: none;
opacity: 0;

 }



 input:checked + label .fa-times{
     display: inline;
     width: 40px;

 }



 input + label .fa-times{

     display: none;

 }



 input + label .fa-bars{
     display: inline;
     width: 40px;

 }


    

    input:checked ~ .menu-content {
    max-height: 100%;
        transition-delay: 0s;
        transition-duration: .2s;
             opacity: 1;
        visibility: visible;
}



.dropdown-content1{
    display: none;
    position: absolute;
    margin: auto;
    background-color: whitesmoke;
    min-width: 60%;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    left: 20%;
    text-align: center;
    
}

.dropdown1:hover .dropdown-content1{
    display: block ;

  }


  

  


.top-nav {
    border-bottom: thin solid grey;
     font-size: inherit;
}

.dropdown-content1 a {
    color: black !important;
    text-decoration: none;
    display: block;
    text-align: center;
   
  
    
  }

  .dropdown-content1 a:hover {background-color: #ccd4da;}

.navigation a {
    height: 30px;
    color: black;
    text-decoration: none;
    font-size: 16px;
    font-family: Georgia, 'Times New Roman', Times, serif !important;
      line-height: 30px;
    display: block;

        
  
    
}


.navigation a:active, .navigation a:hover{
    color: #333;
}


.navigation li:hover{
    background-color: #ccd4da;
   
}


.row::after {
    content: "";
    clear: both;
    display: table;
}



.flex-container {
    flex-direction: column;
}



p.quote {
    font-size: 18px;
    color: #002849;
    text-align: left;
    margin: 0 auto;
    max-width: 75%;
    line-height: 1.5em;

}


p.quote-author {

    margin-left: 60%;
    font-style: italic;
    font-size: 16px;
    color: #002849;
}


span.quote {
    font-size: 75px;
    line-height: 15px;
    color: #002849;
    display: block;


}

.begin-quote {

    padding-top: 40px;

}

.end-quote {
    margin-left: 90%;




}

.education-block {
    display: block;
    max-width: 100%;
    margin-top: 35px;


}

div.edu-top-row {
    border-bottom: thin solid grey;
    padding-bottom: 5px;
}

.edu-title {
    padding-left: 5px;
    padding-right: 10px;
    padding-bottom: 2px;
    font-weight: bold;
    font-size: 25px;

}

.edu-dates {

    padding-top: 3px;
    padding-right: 5px;
    text-align: right;
    font-size: 18px;
    float: right;
}

img.edu-logo {
    max-width: 125px;
    margin: 25px auto;
    text-align: center;
    display: block;
    padding-bottom: 10px;
    
}

.edu-content {
    padding-top: 5px;
    line-height: 1.3em;
    font-size: 18px;
    overflow: hidden;
}


ul.edu-list {
    list-style: none;
    


}

.edu-list li {
    padding-bottom: 22px;

}

a.uo-edu-link {
    text-decoration: none;
    color: black;

}


a.uo-edu-link:hover {
    color: #036631;
}

a.osu-edu-link {
    text-decoration: none;
    color: black;

}


a.osu-edu-link:hover {
    color: #d73f09;
}

a.av-edu-link {
    text-decoration: none;
    color: black;

}


a.av-edu-link:hover {
    color: #254a5d;
}


div.hide-small {
    display: none;
}

div.hide-large {
    display: block;
}


a.named:target {
    display: inline-block;
    height: 125px;
    margin-top: -125;

}


.interest-boxes {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 20px;
    flex-direction: row;
    height: auto;




}

.interest,
.item {

    margin: 15px 10px;
    background-color: rgba(22, 22, 22, .05);
    padding: 15px;
    border: thin solid black;
    box-shadow: 2px 5px #888888;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    text-align: center;
   





}

.item {
    color: black;
    width: 90%;
    text-decoration: none;

}

.artist-info a {
    font-size: 15px;
   text-decoration: none;
    color: maroon;
   

}

.disc-type {font-size: 15px;
color: darkslategrey;
padding-top: 3px;}


.artist-info{
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 6px;
    padding-right: auto;

}



.artist-info a:hover,
.artist-info a:active {
    color: purple;
    text-decoration: underline;

}

.interest:hover,
.item:hover {
    background-color: rgba(22, 22, 22, .15);
}

h3.interest-title {
    text-align: center;
    font-size: 22px;
    margin-top: 5px;
    margin-bottom: 5px;;
    padding-bottom: 5px;

}


.interest-details {
    line-height: 25px;
    text-decoration-line: none;
    padding: 10px;
    text-align: left;

}



a.inline-link {
    display: auto;
}

img.project-image {
    border-radius: 50%;
    max-width: 400px;
    width: 100%;
    height: auto;
    margin: 25px auto 10px;
    display: block;
    padding: 15px auto;
    border: solid 2px whitesmoke;

}

div.lens-hover{
    border-radius: 50%;
    max-width: 400px;
    width: 100%;
    margin: 25px auto 10px;
    display: block;
    padding: 15px auto;
    border: solid 2px whitesmoke;
    min-height: 25px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
   

}

div.lens-hover:after{
    content: "";
    display: block;
    padding-bottom: 100%;
}


#nikon-18-300mm-lens{
    background-image: url("photography/nikkor-18-300-lens.png");
 
}



#nikon-18-300mm-lens:hover{
    background-image: url("photography/nikkor-18-300-lens-zoom.png") 
}


#nikon-35mm-lens{
    background-image: url("photography/nikkor-35mm-lens.png");
 
}



#nikon-35mm-lens:hover{
    background-image: url("photography/nikkor-35mm-lens-hood.png") 
}

img.disc-image {
    border-radius: 50%;
    max-width: 200px;
    width: 100%;
    height: auto;
    margin: 25px auto 10px;
    display: block;
    padding: 15px auto;
    border: solid 2px whitesmoke;

}


.bottom {
    height: 400px;
    background-color: #ccd4da;
    padding-top: 45px;
    vertical-align: middle;

}

.back-to-top a{
float: left;
font-size: 22;
color: #002849;
margin-left: 45px;
text-decoration: none;

}


.back-to-top a:hover{
text-decoration: underline;
}
.copyright{
    text-align: center;
}

.connect-icon {
    display: block !important;
    margin: auto;
    text-align: center;
    padding: 25px;
    font-size: 60px !important;
}

.book-title {
    text-decoration: underline;
}



.coffee-image {
    max-width: 100%;
    border-radius: 10px;
    margin: 10px auto;
    text-align: center;
    display: block;
    position: relative;
    float: none;
    z-index: 10;
}

.caption {
    text-align: center;
    font-style: italic;
    font-size: 18px;
}


.coffee-bean-image {
    max-width: 50%;
}

.festival-list {
    text-align: left;
}




table.flight-ratings{
    margin: auto;
    font-size: 28px;
    border: thin solid black;
    text-align: center;
   max-width: 95%;
   min-width: 50%;


}

.flight-ratings tr, .flight-ratings td{
    border: thin solid black;
    padding: 6px 35px;



}

.flight-ratings span {
font-size: 18px;
font-variant-caps: small-caps;
}


.flight-rating-speed{
    background-color: #ccdad2;

}


.flight-rating-glide{
    background-color: #dad2cc;

}


.flight-rating-turn{
    background-color: #ccd4da;

}


.flight-rating-fade{
    background-color: #daccd4;

}

.plastic-preference {
color: darkslategray;
text-align: left;
font-size: 16px;
padding-left: 45px;
}

.plastic-preference li{
    line-height: 20px;
}
.plastic-preference h5{
    margin-bottom: 4px;
    margin-left: 0;
    font-size: initial;
    margin-left: -35px;
    
}


.press-release{
    font-size: 14px;
    text-align: center;
    width: 100%;
}


.press-release a{
    padding: 15px;
}

.photo-para{
    margin-top: 22px;
}



@media screen and (min-width: 400px) {

    .interest,
    .item {
        max-width: 100%;

    }
}

@media screen and (min-width: 801px) {

    .navigation li {
        list-style: none;
        color: black;
        align-items: left;
        height: 40px;
        display: inline-block;
        letter-spacing: 1.15px;
            
    
        }



        .navigation a {
            height: 40px;
            font-size: 15px;
            line-height: 40px;
            padding: 0px 20px;
        }


.collapsible-menu input#menu, .collapsible-menu label {
    display: none;
}


        .dropdown-content1{
                min-width: auto;
                left: auto;

        }

        .menu-content{
            max-height: 40px !important;
            height: 40px;
            visibility: visible;
            opacity: 1;
        }
        

.dropdown-content1 a{
    left: auto;
    text-align: left;
    min-width: 180px;
  
    
   

}







}
@media screen and (min-width: 825px) {


    div.hide-small {
        display: block;
    }

    div.hide-large {
        display: none;
    }



    .title {
        font-size: 35px;
    }


    .subtitle {
        font-size: 30px;

    }


    .section {
        margin-bottom: 40px;
    }


    .content-title h2 {

        font-family: Verdana, Geneva, Tahoma, sans-serif;
        font-size: 30px;
        font-weight: bold;
        line-height: initial;




    }


    .content-title {
        line-height: 70px;
        width: 100%;
        display: block;
        text-align: left;
    }


    img.me {

        max-height: 175px;
        object-fit: contain;
        margin: auto;



    }

    .content {
        display: block;
        color: #333;
        max-width: 1600px;



    }

 
    .container{
        width: 100%;
    }
    /*COLUMN CSS */

    .col-1 {
        width: 8.33%;
    }

    .col-2 {
        width: 16.66%;
    }

    .col-3 {
        width: 25%;
    }

    .col-4 {
        width: 33.33%;
    }

    .col-5 {
        width: 41.66%;
    }

    .col-6 {
        width: 50%;
    }

    .col-7 {
        width: 58.33%;
    }

    .col-8 {
        width: 66.66%;
    }

    .col-9 {
        width: 75%;
    }

    .col-10 {
        width: 83.33%;
    }

    .col-11 {
        width: 91.66%;
    }

    .col-12 {
        width: 100%;
    }






    [class*="col-"] {
        float: left;
        padding: 10px 20px;
        margin: 0;
        box-sizing: border-box;
        min-height: 300px
    }

    .section {
        display: table;
        padding: 0;
        margin: 0
    }

    .education-block {
        display: block;
        max-width: 700px;
        margin-top: 35px;

        overflow: auto;

    }

    .education-block::after {

        content: "";
        clear: both;
        display: table;
    }

    img.edu-logo {

        float: left;
        padding-right: 5px;
        width: 185px;
        padding-top: 20px;


    }

    
    div.edu-logo {
        margin-top: 20px;
    }

    ul.edu-list {
        margin-left: 10px;
    }










    a.named:target {
        display: inline-block;
        height: 175px;
        margin-top: -175px;

    }

    img.project-image {
        max-width: 300px;
    }


    div.lens-hover{
max-width: 300px;


    }


    
    img.disc-image {
        max-width: 200px;
        box-shadow:rgba(22, 22, 22, .05)
    }


    .interest,
    .item {

       
        min-height: 100%;

        min-width: 45%;

    }






    .coffee-image {
        max-width: 500px;
        border-radius: 10px;

    }


    .coffee-bean-image {
        max-width: 275px;
    }


    .float-right-image {
        float: right;
    }

    .float-left-image {
        float: left;
        margin: 0 45px 0 0;
    }


   h3.interest-title{
       height: 44px;
   }


}

@media screen and (min-width: 1140px) {
    .content-title {
        line-height: auto;

    }


    .content-title h2 {
        font-size: 40px;
    }

}

@media screen and (min-width: 1265px) {

    .interest,
    .item {

       
        
        width: 30%;

    }



}