:root{
    --font-size: 18px;
    --font-family: "proxima-nova", sans-serif;
    --font-color: #3f0f17;
    --bg-color: #f6f4f5;
}

*{
    box-sizing: border-box;
    font-family: var(--font-family);
}

.normal-color{
    color: var(--font-color) !important;
}

html, body{
    margin:0px;
    padding:0px;
    width: 100%;
    height: 100%;
   
    font-size: var(--font-size);

    color: var(--font-color);

    background:  var(--bg-color);

}

iframe{
    width: 100%;
    aspect-ratio: 16/10;
    top:0px;
    left:0px;
    border:none;
}


footer nav{
    background: #009641;
}

.nav-wrapper{
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-content: center;
    align-content: center;
    -webkit-align-items: center;
    align-items: center;
}

h1{
    font-size: 3.2rem !important;
}
h2{
    font-size: 2.56rem !important;
}
h3{
    font-size: 1.92rem !important;
}

main{
    padding-top:64px;
    padding-bottom:64px;
}

.header{
    display: block;
    width: 100%;
    height: auto;
    margin: auto auto;
    max-width: 800px;
}

.icon{
    width: 64px;
    height: 64px;
    margin-right:16px;
}


.flexy-center{
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-content: center;
    align-content: center;
    -webkit-align-items: center;
    align-items: center;
}

strong {
    font-weight: 600 !important;
}


.btn, .btn-large, .btn-small{
        background-color: #009641 !important;
}

.btn:hover, .btn-large:hover, .btn-small:hover {
    background-color: #00c957 !important;
}

.btn:focus, .btn-large:focus, .btn-small:focus, .btn-floating:focus {
    background-color: #00642b !important;
}

.container{
     max-width: 800px !important;
     margin-bottom: 16px;
     margin-top: 16px;
}

.biorad{
    height: 40px;
    width: auto;
    display: block;
    margin-top: 16px;
    margin-bottom: 16px;
    margin-left: auto;
}

form, .sheet{
    background:#fff;
    padding:32px;
    border-radius: 3px;

    position: relative;

    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
}

form:before, .sheet:before{
    content: " ";
    pointer-events: none;
    position: absolute;
    left: 0px;
    top: 0px;
    width: calc(100% - 32px);
    height: calc(100% - 32px);
    margin: 16px;
    border:1px solid #ac979b;
}