section{
  padding-top:3.75rem;
  padding-bottom:3.75rem;
  display:block;
  position:relative;
}

section.small-padding{
  padding-top:1.75rem;
  padding-bottom:1.75rem;
  padding-left:1.75rem;
  padding-right:1.75rem;
}

h1{
    font-size: 5vw;
    font-weight:100;
    line-height: 0.87;
}

h2 {
    font-weight: 10;
    font-size:2vw;
    line-height: 1.1;
}

h3 {
  font-size:3vw;
  line-height: 1.1;
  font-weight:100;
}

h4 {
    font-size:2vw;
    line-height: 1.1;
    font-weight:100;
    font-family: "Cardo", serif;
    font-weight: 400;
    font-style: normal;
    margin:1px;
}

h1,h2,h3 {
  font-family: Cako;
  color:#FFFD99;
  margin: 1px;
}

.pw{
    height: 3rem;
    font-size: 2rem;
    text-align: center;
    background-color:#FBEE7D;
    color:#3BA55F;
    padding:1rem;
    width:auto;
    border:none;
}

.pw:focus-visible{
    border:none;
    outline:#3BA55F auto 1px;
}

 ::placeholder{
    height: 3rem;
    font-size: 2rem;
    text-align: center;
    background-color:#FBEE7D;
    color:#3BA55F;
    font-family: Cako;
 }

 .ok{
    font-size: 2rem;
    text-align: center;
    color:#FBEE7D;
    background-color:#3BA55F;
    padding:1rem;
    width:auto;
    border:none;
    font-family: Cako;
 }

.mobile-only{
    visibility: hidden;
    display: none;
}

.column {
    display:inline-block;
    width: 49%;
    vertical-align: top;
}

a:hover{
    background-color: #FCCF84;
    transition: 1s;
}

.no-hover:hover{
  background-color: transparent !import;
}
/*WOOD SECTION*/
#wood{
    background: url("wood.png");
    background-size: cover;
    height:350px;
    width:auto;
    font-size:  4vw;
    font-weight:100;
    font-family: Cako;
    color:#3BA55F;
}

.text{
  margin-top:90px;
  font-size:4vw;
}
.rsvp-flower{
  margin-top:46px;
}





/* MOBILE STYLES */
@media only screen and (max-width: 700px) {
    body{
        margin: 0px;
        width:100%;
        max-width: 700px;
        min-width: 300px;
        position: relative;
    }
    html, body {
      overflow-x: hidden;
    }

    h1,h2,h3,h4 {
        font-family: Cako;
        margin: 2px;
    }
    h1,h2,h3,h4 a{
        font-family: Cako;

        margin: 1px;
        text-decoration: none;
    }

    h1 {
        font-size: 2.5rem;
        font-weight:100;
        line-height: 0.87;
        letter-spacing: ;
    }
    h2 {
        font-weight: 10;
        font-size:1.125rem;
        line-height: 1.1;
    }
    h3 {
        font-size:1.75rem;
        line-height: 1.1;
        font-weight:100;
    }
    h4 {
        font-size:1rem;
        line-height: 1.1;
        font-weight:100;    
        line-height: 1.1;
        font-family: "Cardo", serif;
        font-weight: 400;
        font-style: normal;
      }
    #banner-section{
        margin-top: 65px;
        padding-top: 1.5em;
        padding-bottom: 1.5em;
    }
    .flower2{
        width:20%;
        position:absolute;
        top: 62%;
        right: 8%;
    }

    #bird{
        animation-duration: 10s;
        transition:1s;
        z-index:7;
        top:120px;
        transform: rotate(-19deg);
        position:absolute;q
        animation-duration: 16s;
        animation-delay: 1s;
        height:225px;
        width:auto
    }
    #wood{
        background-size:cover;
        height:100px;
        text-align: center;
    }
    .rsvp-flower img{
        height:80px;
    }
    .rsvp-flower{
        margin-top:10px;
    }
    #pad{
        height:13px;
    }

    .details{
        width:100%;
    }
    #details{
        padding-top:1.5em;
        padding-bottom:1.5em;
    }
    .three-row.text{
        width: 0px;
        visibility: hidden;
        display: none;
    }

    .column {
        display:block;
        width: 100%;
        vertical-align: top;
    }

    section{
        display:block;
        padding-top:2rem;
        padding-bottom:2rem;
        padding-left:2rem;
        padding-right:2rem;
    }

    .mobile-hide{
        visibility: hidden;
        display: none;
    }

    .mobile-only{
        visibility: visible;
        display: block;
        text-align: center;
    }
    .details-button{
        padding-top: 1.5em;
        padding-bottom: 1.5em;
    }

    .column {
        display:block;
        width: 100%;
        vertical-align: top;
    }

    .pw{
    height: 2rem;
    font-size: 1rem;
    text-align: center;
    background-color:#FBEE7D;
    color:#3BA55F;
    padding:1rem;
    width:auto;
    border:none;
}

.pw:focus-visible{
    border:none;
    outline:#3BA55F auto 1px;
}

 ::placeholder{
    height: 2rem;
    font-size: 1rem;
    text-align: center;
    background-color:#FBEE7D;
    color:#3BA55F;
    font-family: Cako;
 }

 .ok{
    font-size: 1rem;
    text-align: center;
    color:#FBEE7D;
    background-color:#3BA55F;
    padding:1rem;
    width:auto;
    border:none;
    font-family: Cako;
 }

}
