
body{
    background-color: #730e20;

    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    margin:1em 3em;
    
}
header{
    display:flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    border: 3px solid #f2cf8d;
    border:#f2cf8d 3px ridge;
}




.logo{
    width:5em;
}

h1{
    color:#febf35;
    
    
    text-align: left;
    padding:0.5em;
    margin:0;
    font-family:'Times New Roman', Times, serif;
    font-weight: 300;
    font-size: 2.5rem;
   
}

h2, h3{
    font-weight: 200;
    /*color:#febf35;*/
    font-family:'Times New Roman', Times, serif;
    
}
nav{
    display:flex;
    flex-direction: row;
    float: right;
    /*background-color:#f2cf8d;*/
    margin:1em 2em;
    padding:0.35em;
}



nav a{
    background-color:#025273;
    background-color: #f2cf8d;
    color: #730e20;
    text-decoration: none;
    font-size:1.25rem;
    font-weight: 200;
    padding:0.35em 1.7em;
    margin:0.25em 0.5em;
    border: white 2px outset;
}

a:hover {
    background-color: rgb(242, 235, 235);
    background-color:#FFEDC0;
    color:#febf35;
    color: #730e20;
}

.lower-panel{
    background-color: #f2cf8d;
    background-color:#FFEDC0;

    color:#730e20;
    text-transform:uppercase;
    
   /* background-color:#730e20;*/
   
   /* color:#f2cf8d;*/
    border:#f2cf8d 3px ridge;
    border:#a67d03 3px ridge;
    text-align: center;
    padding:0.5em;
    margin-top: 1.5em;
    text-shadow: 5px 5px 15px rgb(210, 210, 194);
}

.bottom-panel{
    background-color: #f2cf8d;
    background-color:#FFEDC0;
    color:#730e20;
    border:#f2cf8d 3px ridge;
    border:#a67d03 3px ridge;
    text-align: center;
    padding:0.5em;
    margin-top: 1.5em;
}


main{
    display:flex;
    align-items:baseline;
    background-color: #f2cf8d;
    background-color: #a67d03;
    background-color: #febf35;
    background-color: #FFEDC0;
    background-color: none;
    margin-top:1.5em;
    padding: 1.5em;
    border:#f2cf8d 3px ridge;
    border:#a67d03 3px ridge;
}




section {
    background-color: #f2cf8d;
    background-color: #febf35;
    

    color:#730e20;
    padding:2em;
    max-width: 30%;
    margin: 1em 5em;
    display:flex;
    flex-direction: column;
    font-size: 1.25rem;
    align-items:center;
    
   
}


.text{
    text-align:left;
    padding:1em;
    display: inline-block;
}

.text > li{
    padding:0.25em;
}

.contacts{
    width:55%;
    margin:1em;
    padding:0.2em;
    padding-bottom: 2em;
    background-color: #730e20;
   /* background-color: #f2cf8d;*/
    border: 3px solid #730e20;
    border:#f2cf8d 3px ridge;
   
}

.contacts>h2{
    
    color:#febf35;
    /*color:#730e20;*/
}

.contacts > a{
    padding:1em 2.5em;
    font-size:1.1rem;
    background-color: #f2cf8d;
    color:#730e20;
    width:7em;
    margin: 0.5em;
    font-weight: 200;
    border:white 3px outset;
    box-shadow: -1px -1px 15px #a67d03;
    box-shadow: -1px -1px 5px #e6e4de;
    text-align:center;
    padding:0.5em 1.7em;
    margin:0.35em 0.5em;
    text-decoration: none;
    

}

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

.column{
    margin:1em;
    border:#f2cf8d 3px ridge;
    border:#730e20 3px ridge;
    color:#730e20;
    max-width:22%;
    display:flex;
    flex-direction:column;
    align-items:center;
}

.column > p {
    padding: 0.75em;
    
}

#card-payments-note{
    margin-top:0;
}

p, h2, h3, h4 {
    text-shadow: 2px 2px 8px rgb(231, 220, 220);
}

.column h2,h3{
    padding-left:0.5em;
    text-align: center;
}

.column a {
    border:#f2cf8d 3px ridge;
    padding:1em 2.5em;
    font-size:1.1rem;
    background-color: #f2cf8d;
    background-color:#730e20;
    color:#730e20;
    color:#f2cf8d;
    
   
    font-weight: 400;
    border:white 2px outset;
    box-shadow: -1px -1px 15px #a67d03;
    box-shadow: -1px -1px 5px #e6e4de;
    box-shadow: 3px 3px 10px rgb(203, 192, 192);
    text-align:center;
    padding:0.5em 1.7em;
    margin:0.35em 1.8em;
    
    text-decoration: none;
}

.column a:hover{
    border:#025273 3px ridge;
}

@keyframes modalOpen {
    from {opacity: 0;}
    to {opacity: 1;}
}


.modal{
    animation: modalOpen 2s ease-in-out;
    display:none;
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.9); /* Black w/ opacity */  
}

iframe {
    position: absolute;
    left:12em;
    right:12em;
    width:70%; 
    height:70%;
    border:2px ridge #f2cf8d;
    border-radius: 0.5em;
}

#openModal{
    font-size: 1rem;
    min-width: 50%;
}

.modal button{
    position: absolute;
    top: 3em;
    right:7em;
    font-size: 1rem;
    padding:0.5em 1em;
    border-radius:0.5em;
}


@keyframes modalClose {
    from {opacity: 1;}
    to {opacity: 0;}
}

@media screen and (max-width:2400px) {
    body {margin: 1em 5em;
        font-size: 0.95rem;
        viewport-fit: cover;
        }
    .row {
        max-height: 26em;
    }
    main {
        padding:0.5em;
    }
   
}
 

