* {box-sizing: border-box}
body {
  font-family: 'Roboto', sans-serif;
  background: #FFFFFF; 
}

  /* Center website */
  .main {
    max-width: 1000px;
    margin: auto;
  }

p {
  padding-left: 0%;
  font-size: 15px; 
  line-height: 27px;
  color: rgb(0, 0, 0);
}

h1 {
  font-size: 45px;
  text-decoration: none;
  color: rgb(0, 0, 0);
  word-break: break-all;
  font-weight: normal;
}

H2 
{ 
  /* text-align: center; */
  font-size: 18px; 
  color: #000000;
  font-weight: normal;
  line-height: 27px;
}
H3 
{ 
  font-size: 12px; 
  color: #000000;
  font-weight: normal;
  line-height: 17px;
}

H4 
{ 
  /* text-align: center; */
  padding-left: 0%;
  font-size: 15px; 
    color: #080808;
  font-weight: normal;
  line-height: 23px;
}

H5 
{ 
  /* text-align: center; */
  font-size: 12px; 
    color: #080808;
  font-weight: normal;
  line-height: 0px;
}




  /* Center website */
  .main {
    max-width: 1000px;
    margin: auto;
  }

  /*---Links in the body ---*/
  a:link {
    color: #D15900;
    text-decoration: none;
  }
  
  a:visited {
    color: #D15900;
    text-decoration: none;
  }
  
  a:hover {
    color: #C53639;
    text-decoration: none;
   
  }
  
  a:active {
    color: #F16700;
    text-decoration: none;
  
  }
 /*---Links in the body END---*/


/* [STYLE HEADER] */
.header {
  background: transparent;
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px; 
  text-align: center;
  font-size: 30px;
}

  /* NAVIGATION START.............................*/

  .topnav {
    overflow: hidden;
    background-color: #D15900;
  }
  
  .topnav a {
    float: left;
    display: block;
    color: #f2f2f2;
    text-align: center;
    padding: 12px 16px;
    text-decoration: none;
    font-size: 17px;
  }
  
  .active {
    background-color: #C53639;
    color: white;
  }
  
  .topnav .icon {
    display: none;
  }
  
  .dropdown {
    float: left;
    overflow: hidden;
  }
  
  .dropdown .dropbtn {
    font-size: 17px;    
    border: none;
    outline: none;
    color: white;
    padding: 12px 16px;
    background-color: inherit;
    font-family: inherit;
    margin: 0;
  }
  
  .dropdown-content {
    display: none;
    position: absolute;
    background-color: #D15900;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
  }
  
  .dropdown-content a {
    float: none;
    color: white;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
  }
  
  .topnav a:hover, .dropdown:hover .dropbtn {
    background-color: #C53639;
    color: white;
  }
  
  .dropdown-content a:hover {
    background-color: #C53639;
    color: white;
  }
  
  .dropdown:hover .dropdown-content {
    display: block;
  }
  
  @media screen and (max-width: 600px) {
    .topnav a:not(:first-child), .dropdown .dropbtn {
      display: none;
    }
    .topnav a.icon {
      float: right;
      display: block;
    }
  }
  
  @media screen and (max-width: 600px) {
    .topnav.responsive {position: relative;}
    .topnav.responsive .icon {
      position: absolute;
      right: 0;
      top: 0;
    }
    .topnav.responsive a {
      float: none;
      display: block;
      text-align: left;
    }
    .topnav.responsive .dropdown {float: none;}
    .topnav.responsive .dropdown-content {position: relative;}
    .topnav.responsive .dropdown .dropbtn {
      display: block;
      width: 100%;
      text-align: left;
    }
  }
  


 /* NAVIGATION STOP.............................*/
 
/* [FLEX-BOX] */

.flex-container {
  display: flex;
  padding: 0px;
  justify-content: center;
  background: transparent;
}

.flex-container > div {
  background: transparent;
  color: white;
  width: auto;
  margin-right: 8px;
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  text-align: left;
  line-height: 25px;
  font-size: 15px; 
}

 /*  TWEAKS */

 /* center text -5% margin
div.a {
  text-align: center;
  padding-bottom: -5%;
  margin-bottom: -5%;
} */

/* text till höger bredvid bild*/
div.b {
  text-align: left;
  
  margin-top: -5%;
  
}

/* center text 0% margin*/
div.c {
  text-align: center;
  padding-top: 0%;
  margin-top: 0%;
  
}

/* Padding till vänster om rubrik start */
p.padding3 {
  padding-left: 40%;
  font-size: 18px; 
  line-height: 27px;
  color:#8FC9FE;
}

.TextwrapRight{
  float:right;
  margin: 10px;
}

.TextwrapLeft{
  float:left;
  margin: 10px;
}
/* center text*/
div.a {
  text-align: center;
}

/* left text*/
div.b {
  text-align: left;
}


/* Padding till vänster om rubrik start */
p.padding3 {
  padding-left: 40%;
  font-size: 18px; 
  line-height: 27px;
  color:#8FC9FE;
}

.TextwrapRight{
  float:right;
  margin: 10px;
}

.TextwrapLeft{
  float:left;
  margin: 10px;
}

/* Dotted black border */
hr.line {
  border-top: 4px solid rgb(0, 0, 0);
}

img {
  width: 100%;
  height: auto;
}

/* [FOOTER] */
.footer {
  width: 100%;
  text-align: center;
  font-family:'Courier New', Courier, monospace, Arial, Helvetica, sans-serif;
  font-size: 14px;
  color:rgb(167, 167, 167);
  background: transparent;
  padding-top: 0px;
  padding: 25px;
}

/* [ RESPONSIVE HEADER] */
@media screen and (max-width: 900px) {
  .responsive {  
  padding-left: 0px; 
   max-width: 100%;
   height: auto; 
   } 
 } 

 /* [ RESPONSIVE IMAGE] */
@media screen and (max-width: 900px) {
  .responsive2 {   
   max-width: 100%;
   height: auto; 
   float: left;
   } 
 } 

  /* [ RESPONSIVE IMAGE] */
@media screen and (max-width: 900px) {
  .img {   
   max-width: 100%;
   height: auto; 
   float: left;
   } 
 } 

 /* [ RESPONSIVE WRAPLEFT] */
 @media screen and (max-width: 900px) {
  .TextwrapLeft {   
   max-width: 100%;
   height: auto; 
   float: left;
   margin: 0px;
   } 
 }
 /* [ RESPONSIVE WRAPRIGHT] */
 @media screen and (max-width: 900px) {
  .TextwrapRight {   
   max-width: 100%;
   height: auto; 
   float: right;
   margin: 0px;
   } 
 }

/* [RESPONSIVE FLEX-BOX] */
@media screen and (max-width:500px) {
  .flex-container {
   width: auto;
   padding-left: 10px;
   display: flex;
   flex-wrap: wrap;
   /* font-size: 12px; */
   font-family: 'Roboto', sans-serif;

  }
}

video {
  max-width: 100%;
  margin: 0px;
  display: flex;
  justify-content: center;
  height: auto;
}



/* [RESPONSIVE FOOTER] */
@media (max-width: 600px) {
  .footer {  
    font-size: 14px;
    padding: 15px; 

  }
} 
