/* #################################################################################################################################
FONTS
################################################################################################################################# */

@font-face {
    font-family:                                MavenPro;
    src:                                        url('fonts/MavenPro.ttf') format('truetype');
    font-weight:                                400 900;
}

@font-face {
    font-family:                                Quicksand;
    src:                                        url('fonts/Quicksand.ttf') format('truetype');
    font-weight:                                300 700;
}

/* #################################################################################################################################
RESET
################################################################################################################################# */

*, *::before, *::after {
  box-sizing: border-box;
}

* {
  margin: 0;
}

body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}

input, button, textarea, select {
  font: inherit;
}

p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
}

/* #################################################################################################################################
BODY ETC.
################################################################################################################################# */

body, p {
    font-family:                                MavenPro;
    color:                                      #1A202C;
    font-weight:                                300;
    font-size:                                  1em;
}

a {
    color:#2f7c86;
    text-decoration: none;
}

a:hover {
    text-decoration:                            underline;
    color:                                      #2f7c86;
}

a.anchor, a.anchor:hover {
    text-decoration:                            none;
    color:                                      inherit;
}

label {
}

input, select { 
  border:1px solid #e8ebf3;
  border-radius:3px;
  height:32px;
  box-sizing:border-box;
  vertical-align:middle;
  font-size:1em;
}

input {
    padding: 0px 8px; 
}

select {
    padding: 0px 4px; 
}

input:focus {
    border:                                     1px solid #b3d6fb;
    outline:                                    2px solid #daeafd;
    outline-offset:                             -2px;
}

input[type=checkbox]
{
    height: auto;
}

input[type="checkbox"]:focus {
    border: 0;
    outline: none;
}

hr {
    padding:                                    0;
    border:                                     none;
    border-top:                                 medium double #808080;
    color:                                      #808080;
    text-align:                                 center;
}

#mobileNav ul li:not(:last-child) {
    border-bottom:1px solid rgba(255,255,255,0.15);
}

.dpbg {
    background-color: #337F87;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 2 1'%3E%3Cdefs%3E%3ClinearGradient id='a' gradientUnits='userSpaceOnUse' x1='0' x2='0' y1='0' y2='1' gradientTransform='rotate(90,0.5,0.5)'%3E%3Cstop offset='0' stop-color='%23337F87'/%3E%3Cstop offset='1' stop-color='%2373A3B0'/%3E%3C/linearGradient%3E%3ClinearGradient id='b' gradientUnits='userSpaceOnUse' x1='0' y1='0' x2='0' y2='1' gradientTransform='rotate(0,0.5,0.5)'%3E%3Cstop offset='0' stop-color='%234C8D97' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%234C8D97' stop-opacity='1'/%3E%3C/linearGradient%3E%3ClinearGradient id='c' gradientUnits='userSpaceOnUse' x1='0' y1='0' x2='2' y2='2' gradientTransform='rotate(0,0.5,0.5)'%3E%3Cstop offset='0' stop-color='%234C8D97' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%234C8D97' stop-opacity='1'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect x='0' y='0' fill='url(%23a)' width='2' height='1'/%3E%3Cg %3E%3Cpolygon fill='url(%23b)' points='0 1 0 0 2 0'/%3E%3Cpolygon fill='url(%23c)' points='2 1 2 0 0 0'/%3E%3C/g%3E%3C/svg%3E");
    background-attachment: fixed;
    background-size: cover;
}

.banner {
    min-height: 150px;
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    
    .banner {
        min-height: 200px;
    }
    
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {}