html,body {
    color:mintcream;
    margin:1rem;
    padding:0
}
html {
    font-family:Montserrat,"Helvetica Neue","Segoe UI",Helvetica,Arial,sans-serif;
    font-size:16px;
    overflow-y:auto
}
body {
    background-color:#6FCDBD
}
a {
    -o-transition:color 0.2s ease-out;
    -webkit-transition:color 0.2s ease-out;
    -moz-transition:color 0.2s ease-out;
    transition:color 0.2s ease-out;
    color:#fff
}
a:hover {
    color:#333
}
h1 {
    font-size:9rem
}
h2 {
    font-size:3rem;
    font-weight:normal
}
@media screen and (max-width: 992px) {
    h1 {
        font-size:15vw
    }
    h2 {
        font-size:2.5rem
    }
}
img.portrait {
    box-sizing:border-box;
    border-radius:50%;
    border:10px solid mintcream;
    margin:2em 3em;
    width:100%;
    height:auto;
    max-width:300px;
    max-height:300px
}
img.qrcode {
    margin-right: 1rem;
    float: left;
    max-width:110px;
    max-height:110px;
}
.column {
    flex:1
}
header {
    display:flex;
    margin-top:8vh
}

header .column.left {
    text-align:end
}
header .column.left .links {
    margin:-1rem 8.8rem;
    font-size:1.5rem;
}
header .column.left .links a {
    margin-right:0.5rem;
    text-decoration:none;
}
header .column.left p {
    text-align: left;
    margin: 3rem 3rem 0 0;
    float: right;
}

header .column.right h1 {
    margin: 2rem 0 1rem -1rem;
}
header .column.right h2 {
    margin-left:-4px;
    margin-top:0
}
header .column.right .links {
    margin-top:2.5rem;
    font-size:1.5rem;
}
header .column.right .links a {
    margin-right:0.5rem;
    text-decoration:none
}
header .column.right p {
    width: 65%;
    text-align: justify;
}

@media screen and (max-width: 992px) {
    header .column.left p {
        margin-top: 1rem;
    }
    header {
        flex-direction:column;
        margin-top:0
    }
    header .column.left {
        text-align:center
    }
    header .column.right h1,h2 {
        text-align:center
    }
    header .column.right p {
        text-align:center
    }
    header img.portrait {
        margin:0
    }
    header .column.left .links {
        margin:0
    }
    header .column.right p {
        width: 100%;
    }
}

menu {
    text-align: left;
    margin-right: 22%;
    margin-top: 5%;
    padding-top: 2rem;
    border-top-color: #5050501c;
    border-top-style: groove;
    border-top-width: thin;
    margin-bottom: 0.5rem;
    width: 45%;
    float: right;
}

menu span {
    float: initial;
}
menu p {
    line-height: 1.6;
}

menu img.qrcode {
    padding-top: 0.5rem;
    padding-bottom: 1.5rem;
}

@media screen and (max-width: 992px)  {
   menu {
    margin-left: unset;
    margin-right: unset;
    width: unset;
    float: unset;
   }
}
@media screen and (max-width: 700px)  {
   menu img.qrcode {
       padding-bottom: unset;
       margin-right: unset;
       margin-left: -0.5rem;
   }
}