/*  Global  */

* {
    margin: 0;
    padding: 0;
    font-family: arial;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
}

body{
  overflow-y:scroll
}

h1,
h2 {
    color: #3a57a7;
    font-weight: 300;
}

/*  Header  ------------------------------------*/

header {
    width: 80vw;
    display: flex;
    margin: 0 auto 0 auto;
    padding-top: 5px;
    align-items: flex-end;
    height: 105px;
    justify-content: space-between;
    background: white;
    margin-bottom: 50px;
}

.space {
    height: 40px;
}

.logo {
    height: 105px;
}

.navbar {
    display: flex;
    width: 800px;
    max-width: calc(100% - 273px);
    justify-content: space-between;
    height: 28px;
    transition-duration: .2s;
    transition-timing-function: ease-in-out;
    background: white;
    z-index: 100000;
    max-height: none;
}

.navbar a {
    text-decoration: none;
    color: #3a57a7;
    font-size: 21px;
    line-height: 28px;
    height: 28px;
    font-weight: 100;
    white-space: nowrap;
}

.navbar a:hover {
    transition-duration: .1s;
    transform: scale(1.02);
}

#active {
    text-decoration: underline;
    /*background-image: linear-gradient(white,white,white,white,white,white,white,white,white,white,white, rgba(58, 87, 167, .2),white);
    border-radius:5px;*/
}

.menubutton {
    display: none;
    transition-duration: .3s;
}

.menubutton div {
    transition-duration: 1s;
}

@media(max-width:1280px) {
    header {
        flex-direction: column;
        align-items: center;
        width: 95vw;
        max-width: none;
    }

    .navbar {
        margin-top: 10px;
        width: 800px;
        max-width: none;
        top: 0px;
    }

    .navbar a {
        font-weight: 300
    }

    #nav {
        opacity: 1;
    }

    .space{
	height:0;
    }
}

@media(max-width:850px) {
    header {
        flex-direction: row;
        align-items: flex-start;
        justify-content: center;
        width: 95vw;
        max-width: none;
        height: calc(40vw * .3846153);
        max-height: 105px;
        margin-bottom: 15px;
    }

    .logo {
        height: auto;
        width: 40vw;
        max-height: 105px;
        max-width: 273px;
        order: 3;
        overflow: hidden;
    }

    .logo img {
        height: auto;
        width: 40vw;
        max-height: 105px;
        max-width: 273px;
    }

    .navbar {
        position: absolute;
        flex-direction: column;
        padding: 0 10px;
	      max-height:0;
	      height:calc(7vw * 6 + 4px * 12 + 6px);
        top: 115px;
        left: 0;
        opacity: 0;
        width: calc(100vw);
        box-sizing: border-box;
        overflow: hidden;
	      transition-duration:.5s;
        transition-delay: 0
    }

    .navbar a {
        font-size: 7vw;
        line-height: 7vw;
        height: 7vw;
        padding: 4px 0;
        border-bottom: 1px #3a57a7 dashed;
        transition-duration: .1s;
    }

    .navbar a:hover {
        transition-duration: .3s;
        transform: scale(1);
        overflow: hidden;
        /*background: linear-gradient(to right, rgba(58, 87, 167, .1), white);*/
	padding-left:10px
    }

    .nabar a:active {
        background: rgba(58, 87, 167, .2);
    }

    #active {
        text-decoration: none;
    }

    .menubutton {
        position: absolute;
        display: flex;
        height: 6vw;
        width: 6vw;
        flex-direction: column;
        justify-content: space-between;
        margin-top: calc(105px * .5 - 15px);
        left: calc(40vw * .3846153 * .5 * .9);
        max-height: 30px;
        max-width: 30px;
        cursor: pointer;
    }

    .menubutton div {
        background: #3a57a7;
        width: 100%;
        height: 6px;
        overflow: hidden;
        border-radius: 100px
    }
}

@media(max-width:680px) {
    .menubutton {
        margin-top: calc(30vw * .3846153 * .5);
        margin-left: calc(30vw * .3846153 * .5 * .9);
    }
}

@media(max-width:693px) {
  .navbar{
    top: calc(40vw * .3846153);
  }
}

/*  Footer  ------------------------------------*/

footer {}

.bottomline {
    text-align: center;
    padding: 10px 10px;
    border-top: 1px #3a57a7 dashed;
    margin: 0 auto;
    width: 100vw;
    position: fixed;
    z-index: 100;
    background: rgba(255,255,255,1);
    bottom: 0;
    font-size: 16px;
    white-space: nowrap;
    display: flex;
    justify-content:center;
    flex-wrap:wrap;
    left:0;

}

.bottomline a{
  padding:0 7px;
  border-left:1px solid black;
}

.bottomline a:nth-child(1){
  border:none
}

.bottomline a:nth-child(2){
  padding:0 2px 0 7px
}

#footmail{
    text-decoration: none;
    color: #3a57a7;
    border:none;
    padding:0 7px 0 0
}

@media(max-width:1280px) {

    .bottomline {
	     padding:10px 2px;
        font-size: calc(1vw + 10px);
        border-top: 1px #3a57a7 dotted;
    	  position: static;
        margin:0;
        left:0
    }
}