* {box-sizing: border-box}
body {font-family: Century Gothic,CenturyGothic,AppleGothic,sans-serif;    color: #0000cc;}



.header {
    width: 100%; 
    overflow: auto; 
    font-size: 200%;
    text-align: right;
    color: #a6a6a6;
    padding-top: 1em;
    padding-right: 2.5em;
    border-bottom: 1px solid #a6a6a6;
}

.normal {
    font-size: 17px;
}

.navbar {
  padding-top: 0.5em;
  width: 100%;
  /*background-color: #555;*/
  overflow: auto;
  color: #0000cc;
}

.navbar span {
    float: left;
    padding-top: 1em;
    color: #0000cc;
    text-decoration: none;
    font-size: 17px;
    /* width: 20%; /* Four links of equal widths */
    text-align: center;
  }

.navbar span a:hover {
  /*background-color: #000;*/
  font-weight: bolder;
  color: #0000ff;
  text-decoration: underline;
}
/*
.navbar a.active {
  background-color: #04AA6D; 
}
*/
.navbar span.text-align-right {
    /* text-align: right; */
    width: 3%; 
}
.navbar span.text-align-left {
    /* text-align: left; */
    width: 3%; 
}

.navbar span.last {
    text-align: right;
    padding-right: 5em;
    width: 44%; 
}

.navbar span.first {
    width: 44%; 
    text-align: left;
    padding-left: 5em;

}

.navbar span.first a {
    display: block;
    float: left;
}

.navbar span.first a.blog-link {
    margin-right : 25%;
}

.navbar span.first  a{
    margin-right: 1em;
}

.navbar span.middle1 {
    width: 3%; 
}

.navbar span.middle2 {
    width: 3%; 
}

.content {
    padding: 4em;
    padding-top: 2em;
    width: 100%; 
    overflow: auto; 
    text-align: center;
    color: #0000cc;
}

.myFont{
    font-family: Century Gothic,CenturyGothic,AppleGothic,sans-serif;
}

span.title1 {
    font-size: 200%;
    text-align: right;
}

span.grey {
    color: #a6a6a6;
}

.bold-italic {
    font-weight: bold;
    font-style: italic;
}

.not-bold {
    font-weight: normal;
}

#video {
    display: block; 
    margin-left: auto;
    margin-right: auto;
    width: 600px;
    height: 350px ;
}

.statement {
    /* display: none; */
    margin-left:auto;
    margin-top: 5em;
    margin-right:auto; 
    width: 80%; 
    height: auto;
}

.statement figure {
    display: block; 
    float: left; 
    width: 40%;
}

.statement figure img {
    width: 100%;
}

footer {
    padding:0.5rem 1rem;
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    text-align: left;
    font-size: x-small;
}

#overlay {
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.938);
  z-index: 2;
  cursor: pointer;
  overflow-x: scroll;
}

.vertical-center {
  margin: 0;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

a.closebtn {
  text-align: right;
  position: absolute;
  top: 20px;
  right: 45px;
  font-size: 60px;
  text-decoration: none;
}

.statement-content{
    display: block; 
    float: right;
    background-color: white;
    padding: 1em;
    max-width: 30em;
}

/* Create two equal columns that floats next to each other */
.column {
    float: left;
    width: 50%;
    padding: 10px;
}

  /* Clear floats after the columns */
.row:after {
    content: "";
    display: table;
    clear: both;
}

.text-align-center {
    text-align: center;
}

.slider-element{
	display: block;
    margin-left: auto;
    margin-right: auto
}	

img.long {
    width: 300px;
    height: 450px;
}

img.square {
    width: 300px;
    height: 300px;
}


@media (max-width:60rem), (hover: none) {
    .navbar span {
        display: block;
        width: 100%;
        text-align: center;
        padding: 0.5em;
    }

    .navbar span.first a{
        display: block;
        width: 45% ;
        text-align: center;
        font-size: smaller;
    }


    .navbar span.first a.blog-link {
        margin : 0;
    }

    .navbar span.first a.prowax-link {
        float: right;
    }

    .navbar span.social {
        display: block;
        width: 25% ;
        text-align: center;
    }

    .navbar span.last {
        text-align: center;
        width: 100%;
        padding: 0.5em;
    }

    .navbar span.first {
        width: 100%;
        padding: 0.5em;
        text-align: center;
    }

    .header {
        width: 100%; 
        overflow: auto; 
        font-size: 200%;
        text-align: center;
        color: #a6a6a6;
        padding-top: 0;
        padding-right: 0;
        border-bottom: 1px solid #a6a6a6;
    }  
    
    .content {
        padding: 0.5em;
        width: 100%; 
        overflow: auto; 
        text-align: center;
        color: #0000cc;
    }

    #video {
        width: 300px;
        height: 200px;
    }

    .statement{
        clear: both;
        text-align: center;
        width: 90%; 
    }

    .statement figure {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 60%;
        float: none; 
    }

    .content {
        padding: 0.5em;
    }

    body{
        padding-bottom: 100px;
    }
    
    footer {
        margin-bottom: 5em;
        position: inherit;
    }
    
    a.closebtn {
        font-size: 40px;
    }

    .statement-content{
        float: none;
    }

    .column {
        float: none;
        width: 100%;
        padding: 10px;
    }

    .lang a{
        font-size: 20px;
    }

    
}