/*


░██████╗░███████╗███╗░░██╗███████╗██████╗░░█████╗░██╗░░░░░
██╔════╝░██╔════╝████╗░██║██╔════╝██╔══██╗██╔══██╗██║░░░░░
██║░░██╗░█████╗░░██╔██╗██║█████╗░░██████╔╝███████║██║░░░░░
██║░░╚██╗██╔══╝░░██║╚████║██╔══╝░░██╔══██╗██╔══██║██║░░░░░
╚██████╔╝███████╗██║░╚███║███████╗██║░░██║██║░░██║███████╗
░╚═════╝░╚══════╝╚═╝░░╚══╝╚══════╝╚═╝░░╚═╝╚═╝░░╚═╝╚══════╝


*/



:root {
  --primary: #005151;
  --secondary: #b7d9d9;
  --light: #ffffff;
  --dark: #000000; 
  --hero: #6AB0B0;
  --lilac: #C8A2C8;
}

*,*:before,*:after {box-sizing:inherit;margin:0; padding:0; border:0 none; position: relative;}
html {
  scroll-behavior: smooth;
	background: rgb(255, 255, 255);
	box-sizing:border-box;
  width:100%;
	font-size: 1rem;
	color: #000;
}

.content{
  height:auto !important;
}
/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

        █▀█ ▀█▀ █░█ █▀▀ █▀█
        █▄█ ░█░ █▀█ ██▄ █▀▄

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/



.left-aligned { margin-left: auto; }
.bg-dark { background-color: #005151 !important; }
.bg-light { background-color: #ffffff !important; }
.bg-hero { background-color: #6AB0B0; }
.bg-footer {background-color: var(--teams_dark_original) !important;}


/* CALLOUT */
.bd-callout { padding:1.25rem; margin-top:1.25rem; margin-bottom:1.25rem; border:1px solid #e9ecef; border-left-width:.25rem; border-radius:.25rem }
.bd-callout h4 { margin-bottom:.25rem }
.bd-callout p:last-child { margin-bottom:0 }
.bd-callout code { border-radius:.25rem }
.bd-callout+.bd-callout { margin-top:-.25rem }
.bd-callout-info { border-left-color:#5bc0de }
.bd-callout-warning { border-left-color:#f0ad4e }
.bd-callout-danger { border-left-color:#d9534f }

/* footer */
footer a { color: white; font-weight: bold; text-decoration: none; }
footer a:hover { color: white; text-decoration: underline; }

.sponsor_footer{
  position:absolute;
  top:0;
  left:0;
}


@font-face {
  font-family: Merriweather-Regular;
  src: url(../static/fonts/merriweather/Merriweather-Regular.ttf) format('truetype');
}

@font-face {
font-family: Starbucks;
src: url('../static/fonts/starbucks-font/Freight Sans Black/Freight Sans Black.otf') format('opentype');

}

@font-face {
font-family: Heavitas;
src: url(../static/fonts/Heavitas-Font/Heavitas.ttf) format('truetype');

}

@font-face {
    font-family: Roboto-Black;
    src: url(../static/fonts/Roboto/Roboto-Black.ttf) format('truetype');
}
@font-face {
  font-family: Roboto-BlackItalic;
  src: url(../static/fonts/Roboto/Roboto-BlackItalic.ttf) format('truetype');
}
@font-face {
  font-family: Roboto-Bold;
  src: url(../static/fonts/Roboto/Roboto-Bold.ttf) format('truetype');
}
@font-face {
  font-family: Roboto-BoldItalic;
  src: url(../static/fonts/Roboto/Roboto-BoldItalic.ttf) format('truetype');
}
@font-face {
  font-family: Roboto-Italic;
  src: url(../static/fonts/Roboto/Roboto-Italic.ttf) format('truetype');
}
@font-face {
  font-family: Roboto-ItalicLight;
  src: url(../static/fonts/Roboto/Roboto-Light.ttf) format('truetype');
}
@font-face {
  font-family: Roboto-Medium;
  src: url(../static/fonts/Roboto/Roboto-Medium.ttf) format('truetype');
}
@font-face {
  font-family: Roboto-MediumItalic;
  src: url(../static/fonts/Roboto/Roboto-MediumItalic.ttf) format('truetype');
}
@font-face {
  font-family: Roboto-Regular;
  src: url(../static/fonts/Roboto/Roboto-Regular.ttf) format('truetype');
}
@font-face {
  font-family: Roboto-Thin;
  src: url(../static/fonts/Roboto/Roboto-Thin.ttf) format('truetype');
}
@font-face {
  font-family: Roboto-ThinItalic;
  src: url(../static/fonts/Roboto/Roboto-ThinItalic.ttf) format('truetype');
}



header{
height: 400px;
margin-left: 0px;
margin-right: 0px;
}

body { 
padding-top: 56px; 
width:100%;
}

footer{
color: #b7d9d9;
font-size: 15px;
}
.container {
  size: auto;
}


/*##############################################

      █▀▀ ▄▀█ █▀█ █▀█ █░█ █▀ █▀▀ █░░
      █▄▄ █▀█ █▀▄ █▄█ █▄█ ▄█ ██▄ █▄▄

##############################################*/


  /* Carousel base class */
  .carousel {
    margin-bottom: 0rem;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 0rem;
    size: auto;
    z-index: 1;
    width: 100%;
    height:auto;
    
  }
  /* Since positioning the image, we need to help out the caption */
  .carousel-caption {
    bottom: 3rem;
    z-index: 10;
  }
  
  /* Declare heights because of positioning of img element */
  .carousel-item {
    height: 95vh;
  }

  .cs_video_container{
    display:flex;
    align-items: center;
    justify-content: center;
    width: inherit;
    height: inherit;
  }

  .cs_video_container iframe{
    display:block;
    width: 100vw;
    height:120vh;
  }
  .caption_team{
    width: 100%;
    height:100%;
    z-index: 1000;
  }
  .teamcar{
    width:100%;
    height:auto;
    top:-40%;
  }
  .teamcar2{
    width:100%;
    height:auto;
    top:-30%;
  }
  @media screen and (max-width:991px){
    .cs_video_container iframe{
      position:absolute;
      display:flex; 
      height:100%;
      width:300%;
      flex-direction:column;
    }

  }
  
  @media (min-width: 40em) {
    /* Bump up size of carousel content */
    .carousel-caption p {
      margin-bottom: 1.25rem;
      font-size: 1.25rem;
      line-height: 1.4;
    }
  
    .featurette-heading {
      font-size: 50px;
    }
  }
  
  @media (min-width: 62em) {
    .featurette-heading {
      margin-top: 7rem;
    }
  }

  @media screen and (max-width: 990px){
    .teamcar{
      height: 200vh !important ;
      top:-40%;
    }
    .teamcar2{
      height: 100vh !important ;
      width:200vw !important;
      width:auto;
    }
    .bd-placeholder-img{
      height: 100vh !important;
    }
    .carousel-item{
      overflow: hidden;
    }
    #myCarousel button{
      display: none;
    }
  }


  /*#################END CAROUSEl################*/




/*##############################################
        
    █▄░█ ▄▀█ █░█ █▄▄ ▄▀█ █▀█
    █░▀█ █▀█ ▀▄▀ █▄█ █▀█ █▀▄

##############################################*/

#navbar {
  overflow: visible;
  font-size: 25px;
  background-color: #333333;
  min-height: 48px;
  z-index: 2000 !important;

}

/* email ig fb mail */

#social_media_icons ul {
  display: flex;
  justify-content: space-between;
  margin: 0;
  padding: 0;
  height: 4vh;
  width: 100%;;
  list-style-type: none;
}
#social_media_icons li {
  display: inline;
}
  
.icon{
  height:20px;
  position:auto;
  margin-left:10px;
  margin-right: 10px;
  margin-bottom: -8px;
}

.navbar .navbar-nav i{
  color: black;
}
.sticky .navbar-nav i {
  color: white;
}


.navbar .icon:hover {
  color: #005151;
  transition: 0.2s;
}
.sticky .icon:hover {
  color: #b7d9d9;
  transition: 0.2s;
}
/* email ig fb mail end */

.navbar .logo {
  position:relative;
  left:10px;
  height: 60px;
  margin-left: 0px;
  margin-right: 0px;
}
.nav_logos{
  top:5px;
}
.navbar .logo_white{
  display:none;  
}
.navbar .logo_green{
  display:inline;
}
.sticky .logo_white{
  display:inline;
}
.sticky .logo_green{
  display:none;

}


/*####################################*/
/*NAVBAR ITEMS*/

/*definition of navigation bar and sticky*/

.navbar_layout {
  background-color: inherit;
  position: relative;
  z-index: 10000;

}

.navbar{
  font-size: 17px;  
  border: none;
  outline: none;
  color: #000000;
  background-color: #ffffff;
  display:flex;
  margin:0px;
  padding: 8px 8px;
  text-decoration: none;
  
  /*  blank space from top */
  margin-top: 20px;
  transition:0.6s;
  height:70px;
  z-index: 10000 !important;
  font-family: 'Roboto-Regular';
}

.sticky {
  font-size: 17px;  
  border: none;
  outline: none;
  color: #ffffff;
  background-color: #005151;
  display:flex;
  margin:0px;
  margin-top: 0px;
  text-decoration: none;
  padding: 8px 8px;
  float: none;
  /*  blank space from top */
  transition:0.6s;
  height:70px;
  z-index: 10000 !important;
  font-family: 'Roboto-Regular';

}

/*background  color of navigation bar and dropdown*/
.navbar .navbar-nav{
  background-color: inherit;
  position:relative;
  z-index:10000;
  
}

/* hover og links in the menu bar e.b. home etc difference btw sticky or not and hover*/

.navbar .navbar-nav li a{
    color: #000000;
    font-size: 20px;}
.sticky .navbar-nav li a{
  color: #ffffff;
  font-size: 20px;
}

.navbar .navbar-nav li a:hover{
  color: #005151;
  font-size: 20px;
}
.sticky .navbar-nav li a:hover{
  color: #b7d9d9;
  font-size: 20px;

}

.nav-link {
  margin-left:10px;
  margin-right:10px;
  padding:15px 15px;
}


.navbar-toggler{
  z-index:10000;
  position: absolute;
  margin:0;
  top:10px;
  right: 10px;

}
.navbar .navbar-toggler-icon {
  position:absolute;
  top:10px;
  right:10px;
}
.navbar .navbar-toggler-icon {
  color: rgb(0, 0, 0);
}
.sticky .navbar-toggler-icon {
  color: rgb(255, 255, 255);;
}
.navbar .navbar-toggler-icon:hover {
  color: #005151;
}
.sticky .navbar-toggler-icon:hover {
  color: #b7d9d9;
}


@media screen and (min-width:1320px) {
  
}

@media screen and (min-width:1235px) and (max-width:1320px) {

  .nav-link{
    margin-left: 3px;
    margin-right: 3px;
  }
}

@media screen and (min-width:1080px) and (max-width:1235px) {

  .nav-link{
    margin-left: 3px;
    margin-right: 3px;
    justify-content:center;
    align-self: center;
  }
  .navbar{
    padding:0;
    

  }
  .nav_logos{
    display:none;
  }
  .navbar .logo{
    opacity: 0;
  }

}

@media screen and (min-width:991px) and (max-width:1080px) {

  .nav-link{
    margin-left: 3px;
    margin-right: 3px;
    justify-content:center;
    align-self: center;
  }
  .navbar{
    padding:0;
  }
  .nav-link{
    font-size:1.7vw !important;
  }
  .navbar .logo{
    opacity: 0;
  }
  .nav_logos{
    display:none;
  }

}

@media screen and (max-width:991px){

  .navbar{
    padding:0;
    width:100%;
    display:flex !important;
  }

  .container-fluid{
    padding-right:0px !important;
    padding-left:0px !important;
  }
  .navbar .navbar-nav{
    background-color: white;
    width: 100%;
    padding:0;
    padding-top:20px;
  }
  .sticky .navbar-nav{
    background-color: #005151;
    width: 100%;
    padding:0;
  }
  .nav-link{
    text-align: center;
  }

  /* TO REMOVE DROPDOWN ARROW*/
  .caret-off::before {
    display: none !important;
  }
  .caret-off::after {
      display: none !important;
  }

  #social_media_icons ul{
    margin-top:10px;
    height: 50px;
    justify-content:center;
  }
  
  .icon{
    height:30px;
    
  }
    
}


/*DROPDOWN ITEMS*/

.dropdown-menu-center {
  left: 50% !important;
  right: auto !important;
  text-align: center !important;
  transform: translate(-50%, 0) !important;
}


.navbar .dropdown-menu{
  position: relative;
  top:45px;
  background-color:#ffffff;
  z-index: 1500;
  
}

.sticky .dropdown-menu{
  position: relative;
  background-color: #005151;
  z-index: 500;

}

@media screen and (max-width:990px)
{
  .nav_logos{
    left: calc( 50% - 60px ) !important;
  }
  .navbar{
    justify-content: center;
    align-items: center !important;
  }
  .navbar .logo{
    position: inherit;
    top: 0px;
  }
  .sticky .logo{
    position: inherit;
    top:0px;
    right: 50vw;
  }

  .navbar .navbar-nav .dropdown-menu{
    position:relative !important;
    align-content: center;
    margin:0;
    background-color: #ededed;
  }
  .sticky .navbar-nav .dropdown-menu{
    position:relative !important;
    align-content: center;
    margin:0;
    background-color: #014343;
  }
  .dropdown-item{
    text-align: center !important;

  }
}

.dropdown-item{
  padding:10px 10px;
  width:100%;
}
/* color on click of dropdown*/
.dropdown-item:active{
  color: red;
  background-color: #2d6464;
}
.sticky.dropdown-item:active{
  color: red;
  background-color: 308e8e;
}
.dropdown-item:hover{
  background-color: #f0f9f9;
  background-size: auto;
  padding: auto;
  
}
.sticky .dropdown-item:hover{
  background-color: #004848;
}

.shadow {
  box-shadow: 0px 1px 10px rgb(0, 0, 0);
}


/* Navbar burger iocn */
/* Icon 1 */

.animated-icon1 {
  width: 30px;
  height: 20px;
  position: absolute;
  top:10px;
  right: 10px;
  margin: 0px;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

.animated-icon1 span, .animated-icon2 span, .animated-icon3 span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

.animated-icon1 span {
  background: #005151;
}
.sticky .animated-icon1 span {
  background: #ffffff;
}

.animated-icon1 span:nth-child(1) {
 top: 0px;
}

.animated-icon1 span:nth-child(2) {
  top: 10px;
}

.animated-icon1 span:nth-child(3) {
  top: 20px;
}

.animated-icon1.open span:nth-child(1) {
  top: 11px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}

.animated-icon1.open span:nth-child(2) {
  opacity: 0;
  left: -60px;
}

.animated-icon1.open span:nth-child(3) {
  top: 11px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}


/* Navbar burger iocn back to top */

.btn {
  font-weight: 700;
  transition: .5s;
}

.btn:hover {
  -webkit-box-shadow: 0 8px 6px -6px #555555;
  -moz-box-shadow: 0 8px 6px -6px #555555;
  box-shadow: 0 8px 6px -6px #555555;
}

.btn-primary {
  color: #FFFFFF;
  background-color: var(--primary) !important;
  text-align: center;
}


.btn-square {
  width: 36px;
  height: 36px;
}

.btn-sm-square {
  width: 28px;
  height: 28px;
}

.btn-lg-square {
  width: 46px;
  height: 46px;
}

.btn-square,
.btn-sm-square,
.btn-lg-square {
  padding:0;
  text-align: center;
}

.back-to-top {
  position: fixed;
  display: inline;
  right: 40px;
  bottom: 20px;
  z-index: 99;
}

.back-to-top .fa-arrow-up{
  height: 20px;
}

/*################################

█░█ █▀█ █▀▄▀█ █▀▀   █▀█ ▄▀█ █▀▀ █▀▀
█▀█ █▄█ █░▀░█ ██▄   █▀▀ █▀█ █▄█ ██▄


###########################*/



/* text shatter on carousel */
.text{
  font-size: 7vh!important;
}

/* text box fade in c*/
/*%%%%%%%%%%%%%%%%%%%*/
.wave_content{
  height:100%;
  width:100%;
  position:absolute;
  top:0;
  left:0;
  
}
.wave_textsection{
  top:0px;
  z-index: 2000;
  height:auto;
  width:100%;
}

.title_wave{
  font-size: 10vh;
  font-family: 'Heavitas';
  color: white;
  left:-30px;
}
.p_wave{
  font-size: 4vh;
  font-family: 'Heavitas';
  color: white;
  width: 70vw;
  height: auto;
  text-transform: lowercase;
}
.pwave_t1{
  right:0vw;
  top:10vh
}
.pwave_t2{
  position: relative;
  left:10vw;
  top: 45vh !important;
}
.pwave_t7{
  position: relative;
  left: -5vw;
  top: 55vh !important;
}
.pwave_t3{
  left:0vw;
  top:0vh;
}
.pwave_t4{
  position: relative;
  left:10vw;
  top: 15vh !important;
}
.pwave_t5{
  right:0vw;
  top:0vh;
}
.pwave_t6{
  position: relative;
  left:10vw;
  top: 15vh !important;
}

.wave_text1{
  display:flex;
  height:auto;
  width:100%;
  justify-content: center;
  align-items: center;
  top:35vh;
}

.wave_text1_1{
  display:flex;
  height:auto;
  width:100%;
  justify-content: center;
  align-items: center;
  top:40vh;
}
.wave_text2{
  display:flex;
  height:auto;
  width:100%;
  justify-content: center;
  align-items: center;
  top:-4vh;
}

.wave_text2_1{
  display:flex;
  height:auto;
  width:100%;
  justify-content: center;
  align-items: center;
  top:5vh;
}

.wave_text2_2{
  position:absolute;
  display:flex;
  height:auto;
  width:100%;
  justify-content: center;
  align-items: center;
  top:70vh;
  left:15vw
}


.wave_text2_3{
  position:absolute;
  display:flex;
  height:auto;
  width:100%;
  justify-content: center;
  align-items: center;
  top:120vh;
  right:10vw;
}


.floaty_image1{
  position:absolute;
  width: 100%;
  top: 30vh;
  left:0.5vw;
  z-index:-1;
  rotate: -30deg;
}
.wave-image{
  width:25vw;
  height: 25vw;
  
}
.floaty_image2{
  width: 100%;
  top: 15vh;
  display: flex;
  left:35vw;
}
.wave-image2{
  width:30vw;
  height: 30vw;
  
}

.wave_text3{
  display:flex;
  height:auto;
  width:100%;
  justify-content: center;
  align-items: center;
  top:0vh;
}

.wave_text3_1{
  display:flex;
  height:auto;
  width:100%;
  justify-content: center;
  align-items: center;
  top:10vh;
}


.wave_text4{
  display:flex;
  height:auto;
  width:100%;
  justify-content: center;
  align-items: center;
  top:0vh;
}

.wave_text4_1{
  display:flex;
  height:auto;
  width:100%;
  justify-content: center;
  align-items: center;
  top:10vh;
}


/*%%%%%%%%%%%%%%%%%%%*/


.box{
  height:100vh;
  width:100%
}
.box1{
  background-color:#449696;
  height:180vh;
}
.box2{
  background-color:#042424;
  height:180vh;
}
.box3{
  background-color:#9090B0;
  height:180vh;
}
.box4{
  background-color:#4B3752;
  height:140vh;
}

.wave_container{
  width: 100%;
  height:100%;
  overflow:hidden;
  position:absolute;
  top:0;
  left:0;
}
.wave{
  overflow: show;
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  left:0;
  display:flex;
}

.wave1{
  display:block;
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  color:#f2f2f2;
  z-index:1000;
}
.wave2{
  display:block;
  align-self: end;
  top:20px;
  z-index: 1000;
  width:100%;
}
.wave3{
  display:block;
  align-self: end;
  top:20px;
  z-index: 1000;
  width:100%;
}
.wave4{
  display:block;
  align-self: end;
  top:20px;
  z-index: 1000;
  width:100%;
}
.wave5{
  display:block;
  align-self: end;
  top:20px;
  z-index: 1000;
  width:100%;
}



/* %%%%%%%%%%%%%%%%%%
BUBBLES SECTION 1
%%%%%%%%%%%%%%%%*/

.bubble-section{
  top:-60vh;
}

.bubble-section .bubble{
  background-color:#449696;
  border-radius: 50%;
  border-color: #FFFFFF;
  z-index: 1100;
  box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.2), 0 1em 2em rgba(0, 0, 0, 0.1);
}

.bubble-section .bubble1{
  position:absolute;
  top:40vh;
  left:3vw;
  height:50px;
  width:50px;
}
.bubble-section .bubble2{
  position:absolute;
  top:55vh;
  left:5vw;
  height:120px;
  width:120px;
}
.bubble-section .bubble3{
  position:absolute;
  top:45vh;
  right:1vw;
  height:60px;
  width:60px;
}
.bubble-section .bubble4{
  position:absolute;
  top:30vh;
  right:10vw;
  height:80px;
  width:80px;
}
.bubble-section .bubble5{
  position:absolute;
  top:65vh;
  right:15vw;
  height:100px;
  width:100px;
}

/* %%%%%%%%%%%%%%%%%%
BUBBLES SECTION 2
%%%%%%%%%%%%%%%%*/

.bubble-section2{
  top:40vh;
}
.bubble-section2 .bubble{
  background-color:#042424;
  border-radius: 50%;
  border-color: #FFFFFF;
  z-index: 1100;
  box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.2), 0 1em 2em rgba(0, 0, 0, 0.1);
}

.bubble-section2 .bubble1{
  position:absolute;
  top:40vh;
  left:7vw;
  height:80px;
  width:80px;
}
.bubble-section2 .bubble2{
  position:absolute;
  top:60vh;
  left:1vw;
  height:120px;
  width:120px;
}
.bubble-section2 .bubble3{
  position:absolute;
  top:55vh;
  right:20vw;
  height:100px;
  width:100px;
}
.bubble-section2 .bubble4{
  position:absolute;
  top:55vh;
  left:15vw;
  height:60px;
  width:60px;
}
.bubble-section2 .bubble5{
  position:absolute;
  top:65vh;
  right:5vw;
  height:100px;
  width:100px;
}
/* %%%%%%%%%%%%%%%%%%
BUBBLES SECTION 3
%%%%%%%%%%%%%%%%*/

.bubble-section3{
  top:70vh;
}

.bubble-section3 .bubble{
  background-color:#9090B0;
  border-radius: 50%;
  border-color: #FFFFFF;
  z-index: 1100;
  box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.2), 0 1em 2em rgba(0, 0, 0, 0.1);
}

.bubble-section3 .bubble1{
  position:absolute;
  top:50vh;
  left:3vw;
  height:50px;
  width:50px;
}
.bubble-section3 .bubble2{
  position:absolute;
  top:70vh;
  left:5vw;
  height:120px;
  width:120px;
}
.bubble-section3 .bubble3{
  position:absolute;
  top:55vh;
  right:1vw;
  height:60px;
  width:60px;
}
.bubble-section3 .bubble4{
  position:absolute;
  top:60vh;
  left:25vw;
  height:80px;
  width:80px;
}
.bubble-section3 .bubble5{
  position:absolute;
  top:40vh;
  right:15vw;
  height:100px;
  width:100px;
}

/* %%%%%%%%%%%%%%%%%%
BUBBLES SECTION 4
%%%%%%%%%%%%%%%%*/

.bubble-section4{
  top:70vh;
}

.bubble-section4 .bubble{
  background-color:#4B3752;
  border-radius: 50%;
  border-color: #FFFFFF;
  z-index: 1100;
  box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.2), 0 1em 2em rgba(0, 0, 0, 0.1);
}

.bubble-section4 .bubble1{
  position:absolute;
  top:40vh;
  left:3vw;
  height:50px;
  width:50px;
}
.bubble-section4 .bubble2{
  position:absolute;
  top:55vh;
  left:5vw;
  height:120px;
  width:120px;
}
.bubble-section4 .bubble3{
  position:absolute;
  top:45vh;
  right:1vw;
  height:60px;
  width:60px;
}
.bubble-section4 .bubble4{
  position:absolute;
  top:30vh;
  right:10vw;
  height:80px;
  width:80px;
}
.bubble-section4 .bubble5{
  position:absolute;
  top:65vh;
  right:15vw;
  height:100px;
  width:100px;
}
/* %%%%%%%%%%%%%%%%%%
BUBBLES SECTION 5
%%%%%%%%%%%%%%%%*/

.bubble-section5{
  top:40vh;
}
.bubble-section5 .bubble{
  background-color:#ffffff;
  border-radius: 50%;
  border-color: #FFFFFF;
  z-index: 1100;
  box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.2), 0 1em 2em rgba(0, 0, 0, 0.1);
}

.bubble-section5 .bubble1{
  position:absolute;
  top:40vh;
  left:7vw;
  height:80px;
  width:80px;
}
.bubble-section5 .bubble2{
  position:absolute;
  top:60vh;
  left:1vw;
  height:120px;
  width:120px;
}
.bubble-section5 .bubble3{
  position:absolute;
  top:55vh;
  right:20vw;
  height:100px;
  width:100px;
}
.bubble-section5 .bubble4{
  position:absolute;
  top:55vh;
  left:15vw;
  height:60px;
  width:60px;
}
.bubble-section5 .bubble5{
  position:absolute;
  top:65vh;
  right:5vw;
  height:100px;
  width:100px;
}

@media screen and (max-width: 990px){

  
  .content_hp #part_selection{
    display: none;
    overflow: show;
  }

  .floaty_image1, .floaty_image2{
    display:none !important;
  }

  .box{
    height:100vh;
    width:100%
  }
  .box1{
    background-color:#449696;
    height:300vw;
  }
  .box2{
    background-color:#042424;
    height:400vw;
  }
  .box3{
    background-color:#9090B0;
    height:180vh;
  }
  .box4{
    background-color:#4B3752;
    height:270vw;
  }

  #eatmain{
    top:-35vw;
    
  }

  #lastitle{
    left:1vw;
  }

  .title_wave{
    top:5vw;
  }
  .pwave_t1{
    top:10vh;
  }
  .pwave_t2{
    top:15vh !important;
  }
  .pwave_t7{
    top:20vh !important;
  }

  .bubble3, .bubble4{
    display:none;
  }
  
  .bubble-section{
    top:-80vh;
    margin-top: 150px;
  }
  .bubble-section2{
    top:120vw;
    margin-top: 150px;
  }
  .bubble-section3{
    top:250vw;
  }
  .bubble-section5{
    top:130vw;
  }

  .wave_text2_2{
    top:160vw;

  }

  .wave_text2_3{
    top:280vw;

  }
}


.floating {  
  animation-name: floating;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;

}
.floating_1 {  
  animation-name: floating;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;

}
.floating2 {  
  animation-name: floating2;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;

}
.floating2_1 {  
  animation-name: floating2;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;

}
.floating3 {  
  animation-name: floating3;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;

}
.floating3_1 {  
  animation-name: floating3;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;

}
.floating4 {  
  animation-name: floating4;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;

}
.floating4_1 {  
  animation-name: floating4;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;

}
.floating5 {  
  animation-name: floating5;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;

}


@keyframes floating {
  from { transform: translate(0,  0px); }
  65%  { transform: translate(0, -15px); }
  to   { transform: translate(0, -0px); }    
}
@keyframes floating2 {
  from { transform: translate(0,  -10px); }
  56%  { transform: translate(0, -0px); }
  to   { transform: translate(0, -10px); }    
}
@keyframes floating3 {
  from { transform: translate(0,  -0px); }
  56%  { transform: translate(0, -15px); }
  to   { transform: translate(0, -0px); }    
}
@keyframes floating4 {
  from { transform: translate(0,  -5px); }
  70%  { transform: translate(0, 15px); }
  to   { transform: translate(0, -5px); }    
}
@keyframes floating5 {
  from { transform: translate(0,  -15px); }
  50%  { transform: translate(0, 0px); }
  to   { transform: translate(0, -15px); }    
}



/*#########################################*/
/********** Team Carousel HP **********/



.fadeInRight {
  -webkit-animation: fadeInRight .6s ease .4s both;
  -moz-animation: fadeInRight .6s ease .4s both;
  -ms-animation: fadeInRight .6s ease .4s both;
  -o-animation: fadeInRight .6s ease .4s both;
  animation: fadeInRight .6s ease .4s both;
}

@media (prefers-reduced-motion) {
  .fadeInRight .animated {
    -webkit-animation: unset !important;
    animation: unset !important;
    -webkit-transition: none !important;
    transition: none !important;
 }
}

.fadeInLeft {
  -webkit-animation: fadeInLeft .5s ease .4s both;
  -moz-animation: fadeInLeft .5s ease .4s both;
  -ms-animation: fadeInLeft .5s ease .4s both;
  -o-animation: fadeInLeft .5s ease .4s both;
  animation: fadeInLeft .5s ease .4s both;
}
@media (prefers-reduced-motion) {
  .fadeInLeft .animated {
    -webkit-animation: unset !important;
    animation: unset !important;
    -webkit-transition: none !important;
    transition: none !important;
 }
}
@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(25%, 0, 0);
    -moz-transform: translate3d(25%, 0, 0);
    -ms-transform: translate3d(25%, 0, 0);
    -o-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0);
 }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
 }
}
@-moz-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(25%, 0, 0);
    -moz-transform: translate3d(25%, 0, 0);
    -ms-transform: translate3d(25%, 0, 0);
    -o-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0);
 }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
 }
}
@-ms-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(25%, 0, 0);
    -moz-transform: translate3d(25%, 0, 0);
    -ms-transform: translate3d(25%, 0, 0);
    -o-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0);
 }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
 }
}
@-o-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(25%, 0, 0);
    -moz-transform: translate3d(25%, 0, 0);
    -ms-transform: translate3d(25%, 0, 0);
    -o-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0);
 }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
 }
}
@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(25%, 0, 0);
    -moz-transform: translate3d(25%, 0, 0);
    -ms-transform: translate3d(25%, 0, 0);
    -o-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0);
 }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
 }
}
@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-25%, 0, 0);
    -moz-transform: translate3d(-25%, 0, 0);
    -ms-transform: translate3d(-25%, 0, 0);
    -o-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0);
 }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
 }
}
@-moz-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-25%, 0, 0);
    -moz-transform: translate3d(-25%, 0, 0);
    -ms-transform: translate3d(-25%, 0, 0);
    -o-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0);
 }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
 }
}
@-ms-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-25%, 0, 0);
    -moz-transform: translate3d(-25%, 0, 0);
    -ms-transform: translate3d(-25%, 0, 0);
    -o-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0);
 }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
 }
}
@-o-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-25%, 0, 0);
    -moz-transform: translate3d(-25%, 0, 0);
    -ms-transform: translate3d(-25%, 0, 0);
    -o-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0);
 }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
 }
}
@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-25%, 0, 0);
    -moz-transform: translate3d(-25%, 0, 0);
    -ms-transform: translate3d(-25%, 0, 0);
    -o-transform: translate3d(-25%, 0, 0);
    transform: translate3d(-25%, 0, 0);
 }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
 }
}















/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/



.service-item {
	position: relative;
	height: 350px;
	padding: 0 30px;
	transition: .5s
}
.service-item .service-icon {
	width: 150px;
	height: 100px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--primary);
	border-radius: 50%;
	transform: rotate(-14deg);
}
.service-item .service-icon i {
	transform: rotate(15deg);
}
.service-item a.btn {
	position: absolute;
	width: 60px;
	bottom: -48px;
	left: 50%;
	margin-left: -30px;
	opacity: 0;
}
.service-item:hover a.btn {
	bottom: -24px;
	opacity: 1;
}

@media (min-width:576px) {
	.team-item .row {
		height: 350px;
	}
}
.team-carousel .owl-nav {
	position: absolute;
	padding: 0 45px;
	width: 100%;
	height: 45px;
	top: calc(50% - 22.5px);
	left: 0;
	display: flex;
	justify-content: space-between;
}
.team-carousel .owl-nav .owl-next, .team-carousel .owl-nav .owl-prev {
	position: relative;
	width: 45px;
	height: 45px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	background: var(--primary);
	border-radius: 45px;
	font-size: 22px;
	transition: .5s;
}
.team-carousel .owl-nav .owl-next:hover, .team-carousel .owl-nav .owl-prev:hover {
	background: var(--dark);
}
.testimonial-carousel .owl-dots {
	margin-top: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.testimonial-carousel .owl-dot {
	position: relative;
	display: inline-block;
	margin: 0 5px;
	width: 20px;
	height: 20px;
	background: var(--light);
	border: 2px solid var(--primary);
	border-radius: 20px;
	transition: .5s;
  border-color: var(--primary);
}
.testimonial-carousel .owl-dot.active {
	width: 40px;
	height: 40px;
	background: var(--primary);
}
.testimonial-carousel .owl-item img {
	width: 150px !important;
	height: 150px;
  display: flex !important;
  width:auto;
}

.team_arrow{
  color: var(--primary);
}
.team_arrow:hover{
  color: white !important;
}
.rounded-circle{
  text-align: center !important;
  justify-content:center;
}
.social_team{
  position:relative;
  right:8px;
  color:rgb(255, 255, 255);
  height:20px !important;
}
/********** End Team Carousel HP **********/
/*#########################################*/

.random_box{
  height: 100vh;
  display: flex;
  justify-content:center;
  align-content: center;
  background-color: var(--primary);
  color:black;
}


/* %%%%%%%%%%%%%% SELECTOR TOPIC %%%%%%%%%% */
#eatmain, #shootmain, #leavemain{
  scroll-margin-top: 200px;
}
#part_selection {
  align-items: center;
  display: flex;
  top: -10vh;
  font-family: "Heavitas";
  font-weight:100;
  flex-wrap: wrap;
  justify-content: center;
  height: 80vh;
  margin: 0 !important;
  width: auto !important;
}
#part_selection .person_ps {
  align-items: center;
  display: flex;
  flex-direction: column;
  width: 30vw !important;
}
#part_selection .container_ps {
  display: flex;
  justify-content: center !important;
  align-items: center !important;
  border-radius: 50%;
  height: 312px;
  -webkit-tap-highlight-color: transparent;
  transform: scale(0.6);
  transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1);
  width: 400px;
  top:0vh;

}

#part_selection .container_ps:hover {
  transform: scale(0.65);
}

#part_selection .circle_ps {
  background-color: #fee7d3;
  border-radius: 50%;
  cursor: pointer;
  height: 380px;
  position: absolute;
  top: 0;
  width: 380px;
  overflow: hidden !important;
}
#part_selection .circleselector{
  border-radius: 50%;
  cursor: pointer;
  height: 380px;
  width: 380px;
  position: absolute;
  top: 210px;
  overflow: hidden !important;

}
#part_selection .img_ps {
  pointer-events: none;
  position: relative;
  transform: translateY(20px) scale(1.15);
  transform-origin: 50% bottom;
  transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);
}
#part_selection .img1_ps {
  left: 60px;
  top: 50px;
  width: 300px;
}
#part_selection .img2_ps {
  left: 40px;
  top: 30px;
  width: 300px;

}
#part_selection .img3_ps {
  left: 60px;
  top: 50px;
  width: 300px;
}
#part_selection .divider_ps {
  background-color: #005151;
  height: 2px;
  border-radius:26%;
  margin-top: 20vh;
  width: 160px;
}
#part_selection .name_ps {
  color: #404245;
  font-size: 36px;
  font-weight: 600;
  margin-top: 16px;
  text-align: center;
}
#part_selection .title_ps {
  color: #6e6e6e;
  font-family: arial;
  font-size: 14px;
  font-style: italic;
  margin-top: 4px;
}

@media screen and (max-width:750px){
  #part_selection .circle_ps{
    height: 50vw;
    width: 50vw;
  }
}
@media screen and (max-device-width:650px){
  #part_selection.person_ps{
    width: auto !important;
  }
  #part_selection .divider_ps{
    margin-top: 5vh;
    width: 20vw;
  }
  #part_selection .name_ps{
    font-size: 7vw;
  }
}

/*%%%%%%%%%%%%%%%%%%

PROJECT SLIDER

%%%%%%%%%%%%%%%%%%%*/


/*%%%%%%%%%%%%%%%%%%

PROJECT SLIDER

%%%%%%%%%%%%%%%%%%%*/


/*%%%%%%%%%%%% CARDS %%%%%%%%%%%%%%%%%%%*/

.content_hp{
  overflow: hidden;
}


#cards {
  justify-content:center;
  align-items: center;
	padding-bottom: 5px;
  margin-top:10vh;
	margin-bottom: 10vh;

  
}


.card {
	position: absolute;
  width: 75vw;
  height:80vh;
	padding:0 !important;;

  box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.1), 0 1em 2em rgba(0, 0, 0, 0.1);
}

@media screen and (max-width: 990px){
  .container{
    margin:0 !important;
    padding:0 !important;
  }
  #cards{
    overflow:hidden;
    margin:0 !important;
    padding:0 !important;
  
  }
  .card{
    width:100vw !important;
  }
  .card__content{
    width: 100vw !important;
    grid-template-areas:"text" !important;
    grid-template-columns: 2.1fr 0fr !important;
    border-radius: 0.5em;
  }
  #card_2 .card__content{
    border-top-left-radius: 0em !important;
    border-top-right-radius: 0em !important;
  }
  .cards{
    height:100%;
    width:100%;
  }
  .card_img{
    display:none !important;
  }
  .p_card{
    font-size: 4vw !important;
    width: 100%;
  }
  .h2_card{
    font-size: 5vw !important;
  }
  .fadeInUp{
    margin-bottom:20px;
  }


  .card__content > figure > img {
    display:none !important;
   
  }

  .card_img{
    display:none;
  }


  .p_wave, .pwave_t1, .pwave_t2, .pwave_t3, .pwave_t4, .pwave_t5, .pwave_t6, .pwave_t7{
    font-size: 5vw;
  }

  
  #myCarousel{
    overflow: hidden;
  }

  .text{
    font-size:10vw !important;
  }

  .logo_ft{
    display:none !important;
  }
}


#mainpage{
  width:100%;
}


#card_1 .card__content {
	box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.1), 0 1em 2em rgba(0, 0, 0, 0.1);
	background: #005151;
	color: white;
	border-radius: 1em;
	overflow: hidden;
  height: auto;
  position: absolute;
  width: 75vw;
  height:80vh;
  
	display: grid;
	grid-template-areas: "img text";
	grid-template-columns: 0.5fr 1.5fr;
	grid-template-rows: auto;
}

#card_1 .card__content > div {
  padding:20px;
	grid-area: text;
	width: 80%;
	place-self: center;
	text-align: left;
	display: grid;
	gap: 1em;
	place-items: start;
}

#card_2 .card__content {
	box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.1), 0 1em 2em rgba(0, 0, 0, 0.1);
	background: #005151;
	color: white;
	border-radius: 1em;
	overflow: hidden;
  
  position: absolute;
  width: 75vw;
  height:80vh;

	display: grid;
	grid-template-areas: "text img";
	grid-template-columns: 1.5fr 0.6fr;
	
}

#card_2 .card__content > div {
  padding:20px;
	grid-area: text;
	width: 80%;
	place-self: center;
	text-align: left;

	display: grid;
	gap: 1em;
	place-items: start;
}

.card__content > figure {
	grid-area: img;
  height:100%;
  width:100%;
  display: block;
  justify-content:start;
  align-items: center;

}
.card__content > figure > img {
	
  display:block;
  position: absolute;
  top:0;
  
}

.card_img1{
  width: 300%;
  height: 80vh;
  left:-95%;
}

.card_img2{
  width: 350%;
  height: 80vh;
  left:-115%;
}

.card_img{
  overflow:hidden;
}



.h2_card {
  font-family: 'Heavitas';
	font-weight: 300;
	font-size: 2.5em;
  font-size: 3vw;
}
.p_card {
  font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
  font-size: 1.5vw;
	font-weight: 300;
	line-height: 1.42;
}

.btn_card {
	background: var(--primary);
	color: rgb(255 255 255);
	text-decoration: none;
	display: inline-block;
	padding: 0.5em;
	border-radius: 0.25em;
  box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.1), 0 1em 2em rgba(0, 0, 0, 0.1);
}
.btn_card:hover{
  color: var(--secondary);
  transform:scale(1.05);
  transition: all 0.1s ;
  box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.2), 0 1em 2em rgba(0, 0, 0, 0.2);
}

/** PAGE STYLING **/



/* fallery picker */


.band_gal {
  width: 90%;
  max-width: 1240px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto;
  grid-gap: 20px;
}
@media (min-width: 30em) {
  .band_gal {
    grid-template-columns: 1fr 1fr;
 }
}
@media (min-width: 60em) {
  .band_gal {
    grid-template-columns: repeat(4, 1fr);
 }
}
.card_gal {
  background: white;
  text-decoration: none;
  color: #444;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
  min-height: 100%;
  position: relative;
  top: 0;
  transition: all 0.1s ease-in;
}
.card_gal:hover {
  top: -2px;
  box-shadow: 0 4px 5px rgba(0, 0, 0, 0.2);
}
.card_gal .content_gal {
  padding: 20px;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.card_gal .h1_gal {
  font-size: 20px;
  margin: 0;
  color: #333;
}
.card_gal .p_gal {
  flex: 1;
  line-height: 1.4;
}
.card_gal .span_gal {
  font-size: 12px;
  font-weight: bold;
  color: #999;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 2em 0 0 0;
}
.card_gal .thumb_gal {
  padding-bottom: 60%;
  background-size: cover;
  background-position: center center;
}
@media (min-width: 60em) {
  .item-1_gal {
    grid-column: 1 / span 2;
 }
  .item-1_gal .h1_gal {
    font-size: 24px;
 }
}

.wow{
  width:50vw;
  margin:5px 0px;
}

.wow .ficon{
  color:#042424;
  transform: scale(2);
  margin-bottom: 3vh;
  padding:10px;
 
}


.wow .counter-section i {
  padding-top:10vh;
  display:block; 
  margin:0 0 10px;
  
}
.counter-section span.counter { 

  font-size:50px; 
  color:#000; 
  line-height:60px; 
  display:inline; 
  font-family: "Heavitas",sans-serif; 
  letter-spacing: 2px
  
}
.counter-section span.ender { 
  font-size:40px; 
  color:rgb(0, 0, 0); 
  line-height:60px; 
  display:inline; 
  font-family: "Heavitas",sans-serif; 
  letter-spacing: 2px
}
.counter-title{ 
  font-size:18px; 
  letter-spacing:2px; 
  text-transform: uppercase;
  
}
.counter-icon {
  top:25px; 
  position:relative
}
.counter-style2 .counter-title {
  letter-spacing: 0.55px; 
  float: left;
}
.counter-style2 span.counter {
  letter-spacing: 0.55px; 
  float: left; 
  margin-right: 10px;
}
.counter-style2 i {
  float: right; 
  line-height: 26px; 
  margin: 0 10px 0 0
}
.counter-subheadline span {
  float: right;
}  

.medium-icon {
    font-size: 40px !important;
    margin-bottom: 15px !important;
} 





/*################################################

█▄░█ █▀█ ▀█▀ █▀▀ █▄▄ █▀█ █▀█ █▄▀
█░▀█ █▄█ ░█░ ██▄ █▄█ █▄█ █▄█ █░█

###################################################*/  


#notebook_box{
  background-color: #ffffff;
  width: 100%;
  
}



#notebook_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#notebook_box h2{
  color:#222
}

#notebook_box p{
color:#444;
}

#notebook_box h1 {
  font-size: 3em;
  margin: 0px;
}

#notebook_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#notebook_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#notebook_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#notebook_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#notebook_box .test{
  display:inline-block;
  float:left;
  padding:20px 15px;
}

#notebook_box section {
  clear: both;
}

#notebook_box .title {
  margin-top: 15px;
  width: 300px;
}

#notebook_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#notebook_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#notebook_box .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#notebook_box .innerContainer {
  padding: 30px 60px;

}

#notebook_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #notebook_box .innerContainer {
    width: 95vw;
  }

  #notebook_box .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #notebook_box .allcontent {
    width: 100vw;
  }
  #notebook_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #notebook_box .innerContainer {
    padding: 10px;
  }
  #notebook_box h1 {
    font-size: 1.3em;
  }
  #notebook_box h2 {
    font-size: 1.1em;
  }
  #notebook_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #notebook_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #notebook_box p{
    font-size: 1em;
  }
  #notebook_box .innerContainer {
    padding: 10px;
  }
  #notebook_box h1 {
    font-size: 1.3em;
  }
  #notebook_box h2 {
    font-size: 1.1em;
  }
}

#notebook_box p{
  font-size: 1.2em;
}

#notebook_box .ad{
  text-decoration: none;
}

#notebook_box a {
  color: blue;
  text-decoration:none;
}

#notebook_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#notebook_box .spacer{
  height:20px;
}

#notebook_box #tiny{
  font-size: 1.1em;
}

#notebook_box #azure {
  color:azure;
}

#notebook_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#notebook_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#notebook_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}

/*********** POP-OUTS ********************/
.popout{
  width: 100%;
  margin: 1.5em auto;
  position: relative;
  -webkit-transition: all 0s;
  -o-transition: all 0s;
  transition: all 0s;
  scroll-margin-top: 79px;
  max-width: 1000px;
  padding-top: 1em;
  
  }
  
  .collapsible {
    display: block;
    font-size: 2em;
    padding: 0.8em 1.5em;
    position: relative;
    color: #ffffff;
    background-color: #005151;
    cursor: pointer;
    border-radius: 15px;
  }
  
  .text_pp{
    z-index:1000;
  }
  
  .popout:first-child {
    padding-top: 2em;
  }
  .collapsible::before {
    position: absolute;
    content: '';
    bottom: 0;
    left: 15px;
    height: 5px;
    width: 15%;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    background-color: var(--lilac);
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    border-radius:15px;
  
  }
  .collapsible:hover::before{
    left:0;
    height: 100%;
    width: 100%;
    opacity: 1;
    background-color: var(--lilac);
  }
  
  .collapsible {
    outline : none !important;
  }

  .collapsible:hover {
    color: var(--primary);
    font-weight: bold;
    transition: all 0.7s;
    
  }
  
  .collapsible-content {
      max-height: 0;
      position: relative;
      overflow-y: hidden;
      width:95%;
      -webkit-transition: all 0s;
      -webkit-transition: all 0.3s;
      -o-transition: all 0.3s;
      transition: all 0.3s;
  }
  
  .collapsible-content-wrapper {
    margin: auto;
    text-align: justify;
    width: 80%;
    padding: 1em  0;
  } 
  .collapsible-content-wrapper h2 {
    font-size: 1.5em;
  
  }
  
  
  .collapsible::after {
    content:'';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background-color: #212832;
    border-radius: 3px;
    width: 95%;
    z-index: -1;
  }
  
  .closed {
    max-height: 0;
    -webkit-box-shadow: 0;
            box-shadow: 0;
  }

/*
*

/*
####################################

▀█▀ █▀▀ ▄▀█ █▀▄▀█ █▀   █▀█ ▄▀█ █▀▀ █▀▀
░█░ ██▄ █▀█ █░▀░█ ▄█   █▀▀ █▀█ █▄█ ██▄

######################################
Notes:
  - add group images in between

/*


@import url("https://fonts.googleapis.com/css2?family=Baloo+2&display=swap");
/* This pen */
:root{
  --teams_dark_original: #18151f;
  --teams_dark_new: #032424;
}

.circletainer_team{
  border-radius: 50%;
  height: 175px;
  width: 175px;
  overflow:hidden
}

.herotainer{
  position:absolute;
  top:0;
  left:0;
  height:inherit;
  width:100%;
}

.cover_image {
  top:-50vh;
  height:auto;
  width:100%;
}

.mask_tm{
  position:absolute;
  top:0;
  left:0;
  background-color: black;
  opacity:0.3;
  width:100%;
  height:100%;
}

 body {
	 font-family: "Baloo 2", cursive;
	 font-size: 16px;
	 color: #fff;
	 text-rendering: optimizeLegibility;
	 font-weight: initial;
}
 .dark {
  background: #011414;
	 /*background: #110f16;*/
}
 .light {
	 background: #f3f5f7;
}
 a, a:hover {
	 text-decoration: none;
	 transition: color 0.3s ease-in-out;
}
 #pageHeaderTitle {
	 margin: 2rem 0;
	 text-transform: uppercase;
	 text-align: center;
	 font-size: 3rem;
   color: white;
}
/* Cards */
 .postcard {
	 flex-wrap: wrap;
	 display: flex;
	 box-shadow: 0 4px 21px -12px rgba(0, 0, 0, 0.66);
	 border-radius: 10px;
	 margin: 0 0 2rem 0;
	 overflow: hidden;
	 position: relative;
	 color: #fff;
}
 .postcard.dark {
  /*18151f*/
	 background-color: var(--teams_dark_new);
}
 .postcard.light {
	 background-color: #e1e5ea;
}
 .postcard .t-dark {
  /*18151f*/
	 color: var(--teams_dark_new);
}
 .postcard a {
	 color: inherit;
}
 .postcard h1, .postcard .h1 {
	 margin-bottom: 0.5rem;
	 font-weight: 500;
	 line-height: 1.2;
}
 .postcard .small {
	 font-size: 80%;
}
 .postcard .postcard__title {
	 font-size: 1.75rem;
}
 .postcard .postcard__img {
	 max-height: 180px;
	 width: 100%;
	 object-fit: cover;
	 position: relative;
}
 .postcard .postcard__img_link {
	 display: contents;
}
 .postcard .postcard__bar {
	 width: 50px;
	 height: 10px;
	 margin: 10px 0;
	 border-radius: 5px;
	 background-color: #424242;
	 transition: width 0.2s ease;
}
 .postcard .postcard__text {
	 padding: 1.5rem;
	 position: relative;
	 display: flex;
	 flex-direction: column;
}
 .postcard .postcard__preview-txt {
	 overflow: hidden;
	 text-overflow: ellipsis;
	 text-align: justify;
	 height: 100%;
}
 .postcard .postcard__tagbox {
	 display: flex;
	 flex-flow: row wrap;
	 font-size: 14px;
	 margin: 20px 0 0 0;
	 padding: 0;
	 justify-content: center;
}
 .postcard .postcard__tagbox .tag__item {
	 display: inline-block;
	 background: rgba(83, 83, 83, 0.4);
	 border-radius: 3px;
	 padding: 2.5px 10px;
	 margin: 0 5px 5px 0;
	 cursor: default;
	 user-select: none;
	 transition: background-color 0.3s;
}
 .postcard .postcard__tagbox .tag__item:hover {
	 background: rgba(83, 83, 83, 0.8);
}
 .postcard:before {
	 content: "";
	 position: absolute;
	 top: 0;
	 right: 0;
	 bottom: 0;
	 left: 0;
	 background-image: linear-gradient(-70deg, #424242, transparent 50%);
	 opacity: 1;
	 border-radius: 10px;
}
 .postcard:hover .postcard__bar {
	 width: 100px;
}
 @media screen and (min-width: 769px) {
	 .postcard {
		 flex-wrap: inherit;
	}
	 .postcard .postcard__title {
		 font-size: 2rem;
	}
	 .postcard .postcard__tagbox {
		 justify-content: start;
	}
	 .postcard .postcard__img {
		 max-width: 300px;
		 max-height: 100%;
		 transition: transform 0.3s ease;
	}
	 .postcard .postcard__text {
		 padding: 3rem;
		 width: 100%;
	}
	 .postcard .media.postcard__text:before {
		 content: "";
		 position: absolute;
		 display: block;
     
		 background: #032424;
		 top: -20%;
		 height: 130%;
		 width: 55px;
	}
	 .postcard:hover .postcard__img {
		 transform: scale(1.1);
	}
	 .postcard:nth-child(2n+1) {
		 flex-direction: row;
	}
	 .postcard:nth-child(2n+0) {
		 flex-direction: row-reverse;
	}
  /* this is the angle of the cutout of the image */
	 .postcard:nth-child(2n+1) .postcard__text::before {
		 left: -12px !important;
		 transform: rotate(0deg);
	}
	 .postcard:nth-child(2n+0) .postcard__text::before {
		 right: -12px !important;
		 transform: rotate(0deg);
	}
}
 @media screen and (min-width: 1024px) {
	 .postcard__text {
		 padding: 2rem 3.5rem;
	}
	 .postcard__text:before {
		 content: "";
		 position: absolute;
		 display: block;
		 top: -20%;
		 height: 130%;
		 width: 55px;
	}
	 .postcard.dark .postcard__text:before {
    /*#18151f*/
		 background: var(--teams_dark_new);
	}
	 .postcard.light .postcard__text:before {
		 background: #e1e5ea;
	}
}
/* COLORS */
 .postcard .postcard__tagbox .green.play:hover {
	 background: #79dd09;
	 color: black;
}
 .green .postcard__title:hover {
	 color: #79dd09;
}
 .green .postcard__bar {
	 background-color: #79dd09;
}
 .green::before {
	 background-image: linear-gradient(-30deg, rgba(121, 221, 9, 0.1), transparent 50%);
}
 .green:nth-child(2n)::before {
	 background-image: linear-gradient(30deg, rgba(121, 221, 9, 0.1), transparent 50%);
}
 .postcard .postcard__tagbox .blue.play:hover {
	 background: #0076bd;
}
 .blue .postcard__title:hover {
	 color: #0076bd;
}
 .blue .postcard__bar {
	 background-color: #0076bd;
}
 .blue::before {
	 background-image: linear-gradient(-30deg, rgba(0, 118, 189, 0.3), transparent 50%);
}
 .blue:nth-child(2n)::before {
	 background-image: linear-gradient(30deg, rgba(0, 118, 189, 0.3), transparent 50%);
}
 .postcard .postcard__tagbox .red.play:hover {
	 background: #bd150b;
}
 .red .postcard__title:hover {
	 color: #bd150b;
}
 .red .postcard__bar {
	 background-color: #bd150b;
}
 .red::before {
	 background-image: linear-gradient(-30deg, rgba(189, 21, 11, 0.8), transparent 50%);
}
 .red:nth-child(2n)::before {
	 background-image: linear-gradient(30deg, rgba(189, 21, 11, 0.8), transparent 50%);
}
 .postcard .postcard__tagbox .yellow.play:hover {
	 background: #bdbb49;
	 color: black;
}
 .yellow .postcard__title:hover {
	 color: #bdbb49;
}
 .yellow .postcard__bar {
	 background-color: #bdbb49;
}
 .yellow::before {
	 background-image: linear-gradient(-30deg, rgba(189, 187, 73, 0.1), transparent 50%);
}
 .yellow:nth-child(2n)::before {
	 background-image: linear-gradient(30deg, rgba(189, 187, 73, 0.1), transparent 50%);
}
 @media screen and (min-width: 769px) {
	 .green::before {
		 background-image: linear-gradient(-80deg, rgba(121, 221, 9, 0.1), transparent 50%);
	}
	 .green:nth-child(2n)::before {
		 background-image: linear-gradient(80deg, rgba(121, 221, 9, 0.1), transparent 50%);
	}
	 .blue::before {
		 background-image: linear-gradient(-80deg, rgba(0, 118, 189, 0.1), transparent 50%);
	}
	 .blue:nth-child(2n)::before {
		 background-image: linear-gradient(80deg, rgba(0, 118, 189, 0.1), transparent 50%);
	}
	 .red::before {
		 background-image: linear-gradient(-80deg, rgba(189, 21, 11, 0.1), transparent 50%);
	}
	 .red:nth-child(2n)::before {
		 background-image: linear-gradient(80deg, rgba(189, 21, 11, 0.1), transparent 50%);
	}
	 .yellow::before {
		 background-image: linear-gradient(-80deg, rgba(189, 187, 73, 0.1), transparent 50%);
	}
	 .yellow:nth-child(2n)::before {
		 background-image: linear-gradient(80deg, rgba(189, 187, 73, 0.1), transparent 50%);
	}
}

/*
HOVER OF GROUP IMAGE
*/

.hover {
  overflow: hidden;
  position: relative;
  padding-bottom: 60%;
}

.hover-overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 90;
  transition: all 0.4s;
}

.hover img {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  transition: all 0.3s;
}

.hover-content {
  position: relative;
  z-index: 99;
}


/* DEMO 1 ============================== */
.hover-1 img {
  width: 105%;
  position: absolute;
  top: 0;
  left: -5%;
  transition: all 0.3s;
}

.hover-1-content {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 99;
  transition: all 0.4s;
}

.hover-1 .hover-overlay {
  background: rgba(0, 0, 0, 0.5);
}

.hover-1-description {
  transform: translateY(0.5rem);
  transition: all 0.4s;
  opacity: 0;
}

.hover-1:hover .hover-1-content {
  bottom: 2rem;
}

.hover-1:hover .hover-1-description {
  opacity: 1;
  transform: none;
}

.hover-1:hover img {
  left: 0;
}

.hover-1:hover .hover-overlay {
  opacity: 0;
}




/*  
###############################################################
#############################################################
*/

/*   honorable mentions  */

.social-link {
  width: 30px;
  height: 30px;
  border: 1px solid #ddd;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #666;
  border-radius: 50%;
  transition: all 0.3s;
  font-size: 0.9rem;
}

.social-link:hover, .social-link:focus {
  background: #ddd;
  text-decoration: none;
  color: #555;
}



/*################################################

█▀▀ █▀█ █░░ █░░ ▄▀█ █▄▄   █▀█ ▄▀█ █▀▀ █▀▀
█▄▄ █▄█ █▄▄ █▄▄ █▀█ █▄█   █▀▀ █▀█ █▄█ ██▄

###################################################*/ 

/*scrollspy collab */

/* SIDEBAR BABY  */
#body_collab{
  overflow: auto;
  position: relative;
  height:auto;
}
#collab1,#collab2,#collab3,#collab4,#collab5,#collab6,#collab7,#collab8,#collab9,#collab10,#collab11{
  scroll-margin-top: 200px;
}

#myScrollspy2  {
  top: 10vh !important; 
  color: white;
  overflow: auto !important;
  position: sticky;
  z-index:1000;
  float: left !important;
  margin-left: 25px;
  width:200px;
}

#myScrollspy2 .nav-item{
  text-align: left;
  display:flex;
  justify-content:center;
  
}

#myScrollspy2 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy2 .jump{
  background-color:white;
  font-family: 'Roboto-Bold' !important;
  font-size: 15px;
  
  
}

#myScrollspy2 .nav-link { 

  color: rgb(0, 0, 0); 
  height: auto;
  width:190px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
  
}


#myScrollspy2 ul.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff !important;
  background-color: #005151 !important; 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}

@media screen and (max-device-width:1200px){
  #myScrollspy2 .nav-pills{
    display:none;
  }
  #myScrollspy2{
    float:none;
    position:absolute;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy2{
    left:0;
    margin:0;
  }
}

/* top box   */

#colla_section{
  display: flex;
  justify-self: center;
  align-self: center !important;
  width:auto;
  overflow:auto;
  left: -105px;


}

#colla_box{
  background-color: #ffffff;
  width: 100%;
}


#colla_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#colla_box h2{
  color:#222
}

#colla_box p{
color:#444;
}

#colla_box h1 {
  font-size: 3em;
  margin: 0px;
}

#colla_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#colla_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#colla_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#colla_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#colla_box .test{
  display:inline-block;
  padding:20px 15px;
}

#colla_box section {
  clear: both;
}

#colla_box .title {
  margin-top: 15px;
  width: 300px;
}

#colla_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#colla_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#colla_box .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#colla_box .innerContainer {
  padding: 30px 60px;

}

#colla_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #colla_box .innerContainer {
    width: 95vw;
  }

  #colla_box .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #colla_box .allcontent {
    width: 100vw;
  }
  #colla_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #colla_box .innerContainer {
    padding: 10px;
  }
  #colla_box h1 {
    font-size: 1.3em;
  }
  #colla_box h2 {
    font-size: 1.1em;
  }
  #colla_box p{
    font-size: 1em;
  }
}

@media screen and (max-width:676px) {
  #colla_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #colla_box p{
    font-size: 1em;
  }
  #colla_box .innerContainer {
    padding: 10px;
  }
  #colla_box h1 {
    font-size: 1.3em;
  }
  #colla_box h2 {
    font-size: 1.1em;
  }
}

#colla_box p{
  font-size: 1.2em;
}

#colla_box .ad{
  text-decoration: none;
}

#colla_box a {
  color: blue;
  text-decoration:none;
}

#colla_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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



/* rest boxes */


#collaboration_box{
  background-color: #ffffff;
  width: 100%;
  overflow: inline;
  position:auto;
  overflow-y:visible;
  z-index: 100;
}

#collaboration_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#collaboration_box h2{
  color:#222
}

#collaboration_box p{
color:#444;
}

#collaboration_box h1 {
  font-size: 3em;
  margin: 0px;
}

#collaboration_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#collaboration_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#collaboration_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#collaboration_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#collaboration_box .test{
  display:inline-block;
  padding:20px 15px;
}


#collaboration_box .title {
  margin-top: 15px;
  width: 300px;
}

#collaboration_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#collaboration_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#collaboration_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#collaboration_box .innerContainer {
  padding: 30px 60px;

}

#collaboration_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #collaboration_box .innerContainer {
    width: 95vw;
  }

  #collaboration_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #collaboration_box .allcontent {
    width: 100vw;
  }
  #collaboration_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #collaboration_box .innerContainer {
    padding: 10px;
  }
  #collaboration_box h1 {
    font-size: 1.3em;
  }
  #collaboration_box h2 {
    font-size: 1.1em;
  }
  #collaboration_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #collaboration_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #collaboration_box p{
    font-size: 1em;
  }
  #collaboration_box .innerContainer {
    padding: 10px;
  }
  #collaboration_box h1 {
    font-size: 1.3em;
  }
  #collaboration_box h2 {
    font-size: 1.1em;
  }
}

#collaboration_box p{
  font-size: 1.2em;
}

#collaboration_box .ad{
  text-decoration: none;
}

#collaboration_box a {
  color: blue;
  color: blue;
  text-decoration:none;
}

#collaboration_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#collaboration_box .spacer{
  height:20px;
}

#collaboration_box #tiny{
  font-size: 1.1em;
}

#collaboration_box #azure {
  color:azure;
}

#collaboration_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#collaboration_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#collaboration_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}




/*################################################

▄▀█ █▄░█ █ █▀▄▀█ ▄▀█ ▀█▀ █ █▀█ █▄░█ █▀
█▀█ █░▀█ █ █░▀░█ █▀█ ░█░ █ █▄█ █░▀█ ▄█

###################################################*/  

@-webkit-keyframes slideUp {
	0% {
		top: 100vh;
		right: 0
	}
	to {
		top: 0vh;
		right: 0
	}
}
@keyframes slideUp {
	0% {
		top: 100vh;
		right: 0
	}
	to {
		top: 0vh;
		right: 0vw
	}
}
@-webkit-keyframes slideDown {
	0% {
		top: 70vh;
		right: 10vw
	}
	to {
		top: 0;
		right: 0
	}
}
@keyframes slideDown {
	0% {
		top: 70vh;
		right: 10vw
	}
	to {
		top: 0;
		right: 0
	}
}
@-webkit-keyframes fadein {
	0% {
		opacity: .5
	}
	to {
		opacity: 1
	}
}
@keyframes fadein {
	0% {
		opacity: .5
	}
	to {
		opacity: 1
	}
}
@-webkit-keyframes movein {
	0% {
		-webkit-transform: translateY(75pt);
		transform: translateY(75pt);
		opacity: 0
	}
	to {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
}
@keyframes movein {
	0% {
		-webkit-transform: translateY(75pt);
		transform: translateY(75pt);
		opacity: 0
	}
	to {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
}
@-webkit-keyframes moveout {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
	to {
		-webkit-transform: translateY(75pt);
		transform: translateY(75pt);
		opacity: 0
	}
}
@keyframes moveout {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1
	}
	to {
		-webkit-transform: translateY(75pt);
		transform: translateY(75pt);
		opacity: 0
	}
}


/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

    █▀ █▀█ █▀█ █▄░█ █▀ █▀█ █▀█ █▀
    ▄█ █▀▀ █▄█ █░▀█ ▄█ █▄█ █▀▄ ▄█

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/







/*PEN STYLES*/

#sponsor_cards{
  width:100%;
  overflow: hidden;

}


#sponsor_cards .blog-card {
  display: flex;
  flex-direction: column;
  margin: 1rem auto;
  box-shadow: 0 3px 7px -1px rgba(0, 0, 0, .1);
  margin-bottom: 1.6%;
  background: #fff;
  line-height: 1.4;
  font-family: sans-serif;
  border-radius: 5px;
  overflow: hidden;
  z-index: 0;
  width: 100vw !important;
}
#sponsor_cards .blog-card a {
  color: inherit;
}
#sponsor_cards .blog-card a:hover {
  color: #5ad67d;
}
#sponsor_cards .blog-card:hover .photo {
  transform: scale(1.3);
}
#sponsor_cards .blog-card .meta {
  position: relative;
  z-index: 0;
  height: 200px;
}
#sponsor_cards .blog-card .photo {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-size:contain;
  background-position: center;
  background-repeat: no-repeat;
  transition: transform 0.2s;
  background-position: ;
}
#sponsor_cards .blog-card .details, .blog-card .details ul {
  margin: auto;
  padding: 0;
  list-style: none;
}
#sponsor_cards .blog-card .details {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -100%;
  margin: auto;
  transition: left 0.2s;
  background: rgba(0, 0, 0, .6);
  color: #fff;
  padding: 10px;
  width: 100%;
  font-size: 0.9rem;
}
#sponsor_cards .blog-card .details a {
  text-decoration: dotted underline;
}
#sponsor_cards .blog-card .details ul li {
  display: inline-block;
}
#sponsor_cards .blog-card .details .author:before {
  font-family: FontAwesome;
  margin-right: 10px;
  content: "\f007";
}
#sponsor_cards .blog-card .details .date:before {
  font-family: FontAwesome;
  margin-right: 10px;
  content: "\f133";
}
#sponsor_cards .blog-card .details .tags ul:before {
  font-family: FontAwesome;
  content: "\f02b";
  margin-right: 10px;
}
#sponsor_cards .blog-card .details .tags li {
  margin-right: 2px;
}
#sponsor_cards .blog-card .details .tags li:first-child {
  margin-left: -4px;
}
#sponsor_cards .blog-card .description {
  padding: 1rem;
  background: #fff;
  position: relative;
  z-index: 1;
}
#sponsor_cards .blog-card .description h1, .blog-card .description h2 {
  font-family: Poppins, sans-serif;
}
#sponsor_cards .blog-card .description h1 {
  line-height: 1;
  margin: 0;
  font-size: 1.7rem;
}
#sponsor_cards .blog-card .description h2 {
  font-size: 1rem;
  font-weight: 300;
  text-transform: uppercase;
  color: #a2a2a2;
  margin-top: 5px;
}
#sponsor_cards .blog-card .description .read-more {
  text-align: right;
}
#sponsor_cards .blog-card .description .read-more a {
  color: #5ad67d;
  display: inline-block;
  position: relative;
}
#sponsor_cards .blog-card .description .read-more a:after {
  content: "\f061";
  font-family: FontAwesome;
  margin-left: -10px;
  opacity: 0;
  vertical-align: middle;
  transition: margin 0.3s, opacity 0.3s;
}
#sponsor_cards .blog-card .description .read-more a:hover:after {
  margin-left: 5px;
  opacity: 1;
}
#sponsor_cards .blog-card p {
  position: relative;
  margin: 1rem 0 0;
}
#sponsor_cards .blog-card p:first-of-type {
  margin-top: 1.25rem;
}
#sponsor_cards .blog-card p:first-of-type:before {
  content: "";
  position: absolute;
  height: 5px;
  background: #5ad67d;
  width: 35px;
  top: -0.75rem;
  border-radius: 3px;
}
#sponsor_cards .blog-card:hover .details {
  left: 0%;
}
@media (min-width: 640px) {
  #sponsor_cards .blog-card {
    flex-direction: row;
    max-width: 1000px;
 }
 #sponsor_cards .blog-card .meta {
    flex-basis: 40%;
    height: auto;
 }
 #sponsor_cards .blog-card .description {
    flex-basis: 60%;
 }
 #sponsor_cards .blog-card .description:before {
    transform: skewX(-0deg);
    content: "";
    background: #fff;
    width: 30px;
    position: absolute;
    left: -10px;
    top: 0;
    bottom: 0;
    z-index: -1;
 }
 #sponsor_cards .blog-card.alt {
    flex-direction: row-reverse;
 }
 #sponsor_cards .blog-card.alt .description:before {
    left: inherit;
    right: -10px;
    transform: skew(0deg);
 }
 #sponsor_cards .blog-card.alt .details {
    padding-left: 25px;
 }
}

.title_type{
}

.title_type h2 {
  font: 33px sans-serif;
  margin-top: 30px;
  text-align: center;
  text-transform: uppercase;
}

.gold h2{
  color: #005151;
}
.silver h2{
  color: #005151;
}
.bronze h2{
  color: #005151;
}
.title_type h2.no-span {
  display: table;
  white-space: nowrap;
  font-family: 'Heavitas';
  font-size:3vw;
} 
.title_type h2.no-span:before, .title_type h2.no-span:after {
  border-top: 3px solid #005151;
  content: '';
  display: table-cell;
  position: relative;
  top: 0.5em;
  width: 45%;
}
.title_type h2.no-span:before {
  right: 1.5%;
}
.title_type h2.no-span:after {
  left: 1.5%;
}


/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

  ▄▀█ ▀█▀ ▀█▀ █▀█ █ █▄▄ █░█ ▀█▀ █ █▀█ █▄░█ █▀
  █▀█ ░█░ ░█░ █▀▄ █ █▄█ █▄█ ░█░ █ █▄█ █░▀█ ▄█

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/


/* top box   */

#attry_section{
  display: flex;
  justify-self: center;
  align-self: center !important;
  width:auto;
  overflow:auto;


}

#attry_box{
  background-color: #ffffff;
  width: 100%;
}


#attry_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#attry_box h2{
  color:#222
}

#attry_box p{
color:#444;
}

#attry_box h1 {
  font-size: 3em;
  margin: 0px;
}

#attry_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#attry_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#attry_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#attry_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#attry_box .test{
  display:inline-block;
  padding:20px 15px;
}

#attry_box section {
  clear: both;
}

#attry_box .title {
  margin-top: 15px;
  width: 300px;
}

#attry_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#attry_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#attry_box .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#attry_box .innerContainer {
  padding: 30px 60px;

}

#attry_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #attry_box .innerContainer {
    width: 95vw;
  }

  #attry_box .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #attry_box .allcontent {
    width: 100vw;
  }
  #attry_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #attry_box .innerContainer {
    padding: 10px;
  }
  #attry_box h1 {
    font-size: 1.3em;
  }
  #attry_box h2 {
    font-size: 1.1em;
  }
  #attry_box p{
    font-size: 1em;
  }
}

@media screen and (max-width:676px) {
  #attry_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #attry_box p{
    font-size: 1em;
  }
  #attry_box .innerContainer {
    padding: 10px;
  }
  #attry_box h1 {
    font-size: 1.3em;
  }
  #attry_box h2 {
    font-size: 1.1em;
  }
}

#attry_box p{
  font-size: 1.2em;
}

#attry_box .ad{
  text-decoration: none;
}

#attry_box a {
  color: blue;
  text-decoration:none;
}

#attry_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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





#attributions_table h2{
  text-align: center;
  font-size: 25px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: white;
  padding: 30px 0;
}

.attributions_table thead{
  padding-left:10px;
  padding-right:10px;
}

/* Table Styles */

#attributions_table .table-wrapper{
  margin: 10px 70px 70px;
  box-shadow: 0px 35px 50px rgba( 0, 0, 0, 0.2 );
}

#attributions_table .fl-table {
  border-radius: 5px;
  font-size: 20px;
  font-size: 20px;
  font-weight: normal;
  border: none;
  border-collapse: collapse;
  width: 100vw;
  max-width: 100%;
  white-space: wrap;
  background-color: white;
}

#attributions_table .fl-table td, .fl-table th {
  text-align: center;
  padding: 8px;
}

#attributions_table .fl-table td {
  border-right: 1px solid #f8f8f8;
  font-size: 15px;
  
}

#attributions_table .fl-table thead th {
  color: #ffffff;
  background: #616176;
  height: 60px;
}


#attributions_table .fl-table thead th:nth-child(odd) {
  color: #ffffff;
  background: #9090B0;
}

#attributions_table .fl-table tr:nth-child(even) {
  background: #ffffff;
}

/* Responsive */

@media (max-width: 767px) {
  #attributions_table .fl-table {
      display: block;
      width: 100%;
  }
  #attributions_table .table-wrapper:before{
      content: "Scroll horizontally >";
      display: block;
      text-align: right;
      font-size: 11px;
      color: white;
      padding: 0 0 10px;
  }
  #attributions_table .fl-table thead, .fl-table tbody, .fl-table thead th {
      display: block;
  }
  #attributions_table .fl-table thead th:last-child{
      border-bottom: none;
  }
  #attributions_table .fl-table thead {
      float: left;
  }
  #attributions_table .fl-table tbody {
      width: auto;
      position: relative;
      overflow-x: auto;
  }
  #attributions_table .fl-table td, .fl-table th {
      padding: 20px .625em .625em .625em;
      height: 60px;
      vertical-align: middle;
      box-sizing: border-box;
      overflow-x: hidden;
      overflow-y: auto;
      width: 120px;
      font-size: 13px;
      text-overflow: ellipsis;
  }
  #attributions_table .fl-table thead th {
      text-align: left;
      border-bottom: 1px solid #f7f7f9;
  }
  #attributions_table .fl-table tbody tr {
      display: table-cell;
  }
  #attributions_table .fl-table tbody tr:nth-child(odd) {
      background: none;
  }
  #attributions_table .fl-table tr:nth-child(even) {
      background: transparent;
  }
  #attributions_table .fl-table tr td:nth-child(odd) {
      background: #F8F8F8;
      border-right: 1px solid #E6E4E4;
  }
  #attributions_table .fl-table tr td:nth-child(even) {
      border-right: 1px solid #E6E4E4;
  }
  #attributions_table .fl-table tbody td {
      display: block;
      text-align: center;
  }
}

/*   cards attributions  */

#card_attribution  {
	padding-bottom: calc(var(--card-top-offset)); /* Make place at bottom, as items will slide to that position*/
	margin-bottom: 0; /* Don't include the --card-margin in padding, as that will affect the scroll-timeline*/
}


#card_attribution .card {
	position: sticky;
	top: 20vh;
	padding:0;
}

#card_attribution {
	list-style: none;
	outline: calc(var(--outline-width) * 10) solid blue;
  display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: repeat(var(--numcards), var(--card-height));
	gap: 100vh;
  padding-left: 6vw;
  padding-right: 6vw;
}

#card_1_attribution {
	--index: 1;
  margin-top: 3vw;
  height: var(--card-height);
}


#card_attribution .card {
	outline: var(--outline-width) solid hotpink;
  box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.1), 0 1em 2em rgba(0, 0, 0, 0.1);
}


#card_1_attribution .card__content {
	box-shadow: 0 0.2em 1em rgba(0, 0, 0, 0.1), 0 1em 2em rgba(0, 0, 0, 0.1);
	background: rgb(255, 255, 255);
	color: rgb(10, 5, 7);
	border-radius: 1em;
	overflow: hidden;
  height: var(--card-height);
	display: grid;
	grid-template-areas: "img text";
	grid-template-columns: 0.1fr 1.5fr;
	grid-template-rows: auto;

	align-items: stretch;
	outline: var(--outline-width) solid lime;
}
#card_1_attribution .card__content > div {
	grid-area: text;
	width: 80%;
	place-self: center;
	text-align: left;

	display: grid;
	gap: 1em;
	place-items: start;
}

#card_attribution .h2_card {
	font-weight: 300;
	font-size: 2.5em;
  font-size: 3vw;
}

#card_attribution .p_card {
	font-family: sans-serif;
  font-size: 1.5vw;
	font-weight: 300;
	line-height: 1.42;
}

/*  extra attributions  */


#attribution_box{
  background-color: #ffffff;
  width: 100%;
}


#attribution_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#attribution_box h2{
  color:#222
}

#attribution_box p{
color:#444;
}

#attribution_box h1 {
  font-size: 3em;
  margin: 0px;
}

#attribution_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#attribution_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#attribution_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#attribution_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#attribution_box .test{
  display:inline-block;
  float:left;
  padding:20px 15px;
}

#attribution_box section {
  clear: both;
}

#attribution_box .title {
  margin-top: 15px;
  width: 300px;
}

#attribution_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#attribution_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#attribution_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#attribution_box .innerContainer {
  padding: 30px 60px;

}

#attribution_box .date {
  color: gray;
  font-weight: 400px;
}



@media screen and (max-width:991px){
  #collaboration_box .innerContainer {
    width: 95vw;
  }

  #collaboration_box .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #attribution_box .allcontent {
    width: 100vw;
  }
  #attribution_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #attribution_box .innerContainer {
    padding: 10px;
  }
  #attribution_box h1 {
    font-size: 1.3em;
  }
  #attribution_box h2 {
    font-size: 1.1em;
  }
  #attribution_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #attribution_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #attribution_box p{
    font-size: 1em;
  }
  #attribution_box .innerContainer {
    padding: 10px;
  }
  #attribution_box h1 {
    font-size: 1.3em;
  }
  #attribution_box h2 {
    font-size: 1.1em;
  }
}



#attribution_box p{
  font-size: 1.2em;
}

#attribution_box .ad{
  text-decoration: none;
}

#attribution_box a {
  color: blue;
  text-decoration:none;
}

#attribution_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#attribution_box .spacer{
  height:20px;
}

#attribution_box #tiny{
  font-size: 1.1em;
}

#attribution_box #azure {
  color:azure;
}

#attribution_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#attribution_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#attribution_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}



/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

█▀▄▀█ █▀█ █▀▄ █▀▀ █░░   █▀▀ █▀█ █░░ █▀▄
█░▀░█ █▄█ █▄▀ ██▄ █▄▄   █▄█ █▄█ █▄▄ █▄▀

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/


#body_model{
  overflow: auto;
  position: relative;
  height:auto;
}

#myScrollspy6  {
  top: 30vh !important; 
  color: white;
  overflow: auto !important;
  position: sticky;
  z-index:1000;
  float: left !important;
  margin-left: 25px;
  width: 200px;
}

#myScrollspy6 .nav-item{
  text-align: left;
  display:flex;
  justify-content:center;
  
}

#myScrollspy6 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy6 .jump{
  background-color:white;
  font-family: 'Roboto-Bold' !important;
  font-size: 15px;
  
  
}

#myScrollspy6 .nav-link { 

  color: rgb(0, 0, 0); 
  height: 30px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
  width:190px;
}


#myScrollspy6 ul.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff !important;
  background-color: #005151 !important; 
  height: 30px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
  width:190px;
}

@media screen and (max-device-width:1200px){
  #myScrollspy6 .nav-pills{
    display:none;
  }
  #myScrollspy5{
    float:none;
    position:absolute;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy6{
    left:0;
    margin:0;
  }
}


/* top box   */

#mod_section{
  display: flex;
  justify-self: center;
  align-self: center !important;
  width:auto;
  overflow:auto;
  left: -110px;


}

#mod_box{
  background-color: #ffffff;
  width: 100%;
}


#mod_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#mod_box h2{
  color:#222
}

#mod_box p{
color:#444;
}

#mod_box h1 {
  font-size: 3em;
  margin: 0px;
}

#mod_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#mod_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#mod_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#mod_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#mod_box .test{
  display:inline-block;
  float:left;
  padding:20px 15px;
}

#mod_box section {
  clear: both;
}

#mod_box .title {
  margin-top: 15px;
  width: 300px;
}

#mod_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#mod_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#mod_box .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#mod_box .innerContainer {
  padding: 30px 60px;

}

#mod_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #mod_box .innerContainer {
    width: 95vw;
  }

  #mod_box .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #mod_box .allcontent {
    width: 100vw;
  }
  #mod_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #mod_box .innerContainer {
    padding: 10px;
  }
  #mod_box h1 {
    font-size: 1.3em;
  }
  #mod_box h2 {
    font-size: 1.1em;
  }
  #mod_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #mod_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #mod_box p{
    font-size: 1em;
  }
  #mod_box .innerContainer {
    padding: 10px;
  }
  #mod_box h1 {
    font-size: 1.3em;
  }
  #mod_box h2 {
    font-size: 1.1em;
  }
}

#mod_box p{
  font-size: 1.2em;
}

#mod_box .ad{
  text-decoration: none;
}

#mod_box a {
  color: blue;
  text-decoration:none;
}

#mod_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#mod_box .spacer{
  height:20px;
}

#mod_box #tiny{
  font-size: 1.1em;
}

#mod_box #azure {
  color:azure;
}

#mod_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#mod_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#mod_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/* rest boxes */


#model_box{
  background-color: #ffffff;
  width: 100%;
  overflow: inline;
  position:auto;
  overflow-y:visible;
  z-index: 100;
}


#model_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#model_box h2{
  color:#222
}

#model_box p{
color:#444;
}

#model_box h1 {
  font-size: 3em;
  margin: 0px;
}

#model_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#model_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#model_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#model_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#model_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#model_box section {
  clear: both;
}

#model_box .title {
  margin-top: 15px;
  width: 300px;
}

#model_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#model_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#model_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#model_box .innerContainer {
  padding: 30px 60px;

}

#model_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #model_box .innerContainer {
    width: 95vw;
  }

  #model_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #model_box .allcontent {
    width: 100vw;
  }
  #model_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #model_box .innerContainer {
    padding: 10px;
  }
  #model_box h1 {
    font-size: 1.3em;
  }
  #model_box h2 {
    font-size: 1.1em;
  }
  #model_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #model_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #model_box p{
    font-size: 1em;
  }
  #model_box .innerContainer {
    padding: 10px;
  }
  #model_box h1 {
    font-size: 1.3em;
  }
  #model_box h2 {
    font-size: 1.1em;
  }
}

#model_box p{
  font-size: 1.2em;
}

#model_box .ad{
  text-decoration: none;
}

#model_box a {
  color: blue;
  text-decoration:none;
}

#model_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#model_box .spacer{
  height:20px;
}

#model_box #tiny{
  font-size: 1.1em;
}

#model_box #azure {
  color:azure;
}

#model_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#model_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#model_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/*################################################

█▀█ ▄▀█ █▀█ ▀█▀ █▀
█▀▀ █▀█ █▀▄ ░█░ ▄█

###################################################*/ 

/*scrollspy collab */

#body_part{
  overflow: auto;
  position: relative;
  height:auto;
}

#part_section{
  width:100%;
  display:block;
  align-items: center;
}

#part_box{
  background-color: #ffffff;
  width: 100%;
}


#part_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#part_box h2{
  color:#222
}

#part_box p{
color:#444;
}

#part_box h1 {
  font-size: 3em;
  margin: 0px;
}

#part_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#part_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#part_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#part_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#part_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#part_box section {
  clear: both;
}

#part_box .title {
  margin-top: 15px;
  width: 300px;
}

#part_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#part_box .allcontent {
  
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#part_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#part_box .innerContainer {
  padding: 30px 60px;

}

#part_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #part_box .innerContainer {
    width: 95vw;
  }

  #part_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #part_box .allcontent {
    width: 100vw;
  }
  #part_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #part_box .innerContainer {
    padding: 10px;
  }
  #part_box h1 {
    font-size: 1.3em;
  }
  #part_box h2 {
    font-size: 1.1em;
  }
  #part_box p{
    font-size: 1em;
  }
}

@media screen and (max-width:676px) {
  #part_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #part_box p{
    font-size: 1em;
  }
  #part_box .innerContainer {
    padding: 0;
  }
  #part_box h1 {
    font-size: 1.3em;
  }
  #part_box h2 {
    font-size: 1.1em;
  }
}

#part_box p{
  font-size: 1.2em;
}

#part_box .ad{
  text-decoration: none;
}

#part_box a {
  color: blue;
  text-decoration:none;
}

#part_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#part_box .spacer{
  height:20px;
}

#part_box #tiny{
  font-size: 1.1em;
}

#part_box #azure {
  color:azure;
}

#part_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#part_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#part_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


#myScrollspy  {
  top: 30vh !important; 
  color: white;
  overflow-y: auto;
  position: sticky;
  z-index:1000;
  float:left;
}


#myScrollspy .nav-item{
  text-align: left;
  display:flex;
  justify-content:center;
  
}

#myScrollspy .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy .jump{
  background-color:white;
  font-family: 'Roboto-Bold' !important;
  font-size: 15px;
  
  
}

#myScrollspy .nav-link { 

  color: rgb(0, 0, 0); 
  height:auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}


#myScrollspy ul.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff !important;
  background-color: #005151 !important; 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}

@media screen and (max-device-width:1200px){
  #myScrollspy .nav-pills{
    display:none;
  }
  #myScrollspy{
    float:none;
    position:absolute;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy5{
    left:0;
    margin:0;
  }
}


@media screen and (max-width: 810px) {
  #section1, #section2, #section3  {
      margin-left: 150px;
  }
}

#part_collection{
  scroll-margin-top:100px;
}

/*
####################################################

      █▀▀ █▀▄ █░█ █▀▀ ▄▀█ ▀█▀ █ █▀█ █▄░█
      ██▄ █▄▀ █▄█ █▄▄ █▀█ ░█░ █ █▄█ █░▀█

######################################################
*/

/* Scrollspy collab */

/* SIDEBAR BABY  */
#body_education{
  overflow: auto;
  position: relative;
  height:auto;
}

.animated-btn {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  line-height: 80px;
  display: inline-block;
  text-align: center;
  background: #3A3A46;
  position: relative;
  z-index: 1000;
  transition: 1s;
  
}

.animated-btn a{
   display: flex;
   justify-content: center;
   align-items: center;
   text-align: center;
   margin-top:auto;
}
.animated-btn .fa-comments{

  top:10px;
  text-align: center;
  vertical-align: middle;
}

.animated-btn::before, .animated-btn::after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: 50%;
  background: #9090B0;
  opacity: 0.8;
  animation: ripple_1 2s infinite ease-in-out;
  z-index: -1;
  transition: 1s;
}

.animated-btn::after {
  background: #9090B0;
  opacity:0.6;
  animation: ripple_2 2s infinite ease-in-out;
  animation-delay: 0.5s;
  z-index:-1;
  transition: 1s;
}

@keyframes ripple_1 {
  0% {
      transform: scale(1);
      opacity: 1;
  }

  100% {
      transform: scale(1.5);
      opacity: 0;
  }
}

@keyframes ripple_2 {
  0% {
      transform: scale(1);
      opacity: 1;
  }

  100% {
      transform: scale(1.7);
      opacity: 0;
  }
}


#myScrollspy3  {
  top: 15vh !important; 
  color: white;
  overflow: auto !important;
  position: sticky;
  z-index:1000;
  float: left !important;
  margin-left: 25px;
  width: auto;
}

#myScrollspy3 .nav-item{
  text-align: left;
  display:flex;
  
  
}

#myScrollspy3 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy3 .jump{
  background-color:white;
  font-size:15px;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy3 .subli{
  width:170px;
  font-size: 13px;
}

#myScrollspy3 .mainli{
  width:220px;
  font-weight: bold;
}




#myScrollspy3 .nav-link { 

  color: rgb(0, 0, 0); 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}


#myScrollspy3 ul.nav-pills .mainli.active,
.nav-pills .show > .mainli {
  color: #fff !important;
  background-color: #005151 !important; 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}

#myScrollspy3 ul.nav-pills .subli.active,
.nav-pills .show > .subli {
  color: #fff !important;
  background-color: var(--lilac) !important; 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}



@media screen and (max-device-width:1375px){
  #myScrollspy3 .nav-pills{
    display:none;
  }
  #myScrollspy3{
    float:none;
    position:absolute;
  }
  #edu_section{
    left:0px !important;
  }


}

@media screen and (max-device-width:1430px){
  #myScrollspy3{
    left:0;
    margin:0;
  }
}

/* %%%%%%%%%%%%%%%%%%% */


/* top box   */

#edu_section{
  background-color: #ffffff;
  width: 100%;
  display: flex;
  justify-self: center;
  align-self: center !important;
  width:auto;
  overflow:auto;
  left: -125px;
  margin:auto;


}


#edu_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#edu_box h2{
  color:#222
}

#edu_box p{
color:#444;
}

#edu_box h1 {
  font-size: 3em;
  margin: 0px;
}

#edu_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#edu_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#edu_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#edu_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#edu_box .test{
  display:inline-block;
  float:left;
  padding:20px 15px;
}

#edu_box section {
  clear: both;
}

#edu_box .title {
  margin-top: 15px;
  width: 300px;
}

#edu_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#edu_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#edu_box .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#edu_box .innerContainer {
  padding: 30px 60px;

}

#edu_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #edu_box .innerContainer {
    width: 95vw;
  }

  #edu_box .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #edu_box .allcontent {
    width: 100vw;
  }
  #edu_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #edu_box .innerContainer {
    padding: 10px;
  }
  #edu_box h1 {
    font-size: 1.3em;
  }
  #edu_box h2 {
    font-size: 1.1em;
  }
  #edu_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #edu_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #edu_box p{
    font-size: 1em;
  }
  #edu_box .innerContainer {
    padding: 10px;
  }
  #edu_box h1 {
    font-size: 1.3em;
  }
  #edu_box h2 {
    font-size: 1.1em;
  }
}

#edu_box p{
  font-size: 1.2em;
}

#edu_box .ad{
  text-decoration: none;
}

#edu_box a {
  color: blue;
  text-decoration:none;
}

#edu_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#edu_box .spacer{
  height:20px;
}

#edu_box #tiny{
  font-size: 1.1em;
}

#edu_box #azure {
  color:azure;
}

#edu_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#edu_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#edu_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/* rest boxes */


#education_box{
  background-color: #ffffff;
  width: 100%;
  overflow: inline;
  position:auto;
  overflow-y:visible;
  z-index: 100;
}


#education_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#education_box h2{
  color:#222
}

#collaboration_box p{
color:#444;
}

#education_box h1 {
  font-size: 3em;
  margin: 0px;
}

#education_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#education_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#education_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#education_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#education_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#education_box section {
  clear: both;
}

#education_box .title {
  margin-top: 15px;
  width: 300px;
}

#education_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#education_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#education_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#education_box .innerContainer {
  padding: 30px 60px;

}

#education_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #education_box .innerContainer {
    width: 95vw;
  }

  #education_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #education_box .allcontent {
    width: 100vw;
  }
  #education_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #education_box .innerContainer {
    padding: 10px;
  }
  #education_box h1 {
    font-size: 1.3em;
  }
  #education_box h2 {
    font-size: 1.1em;
  }
  #education_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #education_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #education_box p{
    font-size: 1em;
  }
  #education_box .innerContainer {
    padding: 10px;
  }
  #education_box h1 {
    font-size: 1.3em;
  }
  #education_box h2 {
    font-size: 1.1em;
  }
}

#education_box p{
  font-size: 1.2em;
}

#education_box .ad{
  text-decoration: none;
}

#education_box a {
  color: blue;
  text-decoration:none;
}

#education_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#education_box .spacer{
  height:20px;
}

#education_box #tiny{
  font-size: 1.1em;
}

#education_box #azure {
  color:azure;
}

#education_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#education_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#education_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/*
####################################################


█▀▀ █▄░█ ▀█▀ █▀█ █▀▀ █▀█ █▀█ █▀▀ █▄░█ █▀▀ █░█ █▀█ █▀ █░█ █ █▀█
██▄ █░▀█ ░█░ █▀▄ ██▄ █▀▀ █▀▄ ██▄ █░▀█ ██▄ █▄█ █▀▄ ▄█ █▀█ █ █▀▀

######################################################
*/

/* Scrollspy collab */

/* SIDEBAR BABY  */
#body_entrepreneurship{
  overflow: auto;
  position: relative;
  height:auto;
}


/* %%%%%%%%%%%%%% SELECTOR TOPIC %%%%%%%%%% */

#entrepreneurship_selector  {
  position:relative;
  top:0;
  left:0;
  width:100%;
  height:auto;
}


/*ZoomIn Hover-Mask Effect*/
#entrepreneurship_selector .hover-mask a {
  display: flex;
  position: relative;
  overflow: hidden;
  border-radius:50%;
  height:200px;
  width:200px;

}
#entrepreneurship_selector .hover-mask img {
  width: 100%;
  height: auto;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
#entrepreneurship_selector .hover-mask:hover img {
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -o-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
}
#entrepreneurship_selector .hover-mask a h2 {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  margin-top: 0px;
  margin-bottom: 0px;
  height: 100%;
  width: 100%;
  padding: 45% 20px;
  text-align: center;
  background-color: rgba(0,0,0,0.4);
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  transition: all 0.5s linear;
  -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  opacity: 0;
}
#entrepreneurship_selector .hover-mask:hover a h2 {
  -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  opacity: 1;
}





/* this is the nav and rest */


#myScrollspy4  {
  top: 15vh !important; 
  color: white;
  overflow: auto !important;
  position: sticky;
  z-index:1000;
  float: left !important;
  margin-left: 25px;
  width: auto;
}

#myScrollspy4 .nav-item{
  text-align: left;
  display:flex;
  
  
}

#myScrollspy4 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy4 .jump{
  background-color:white;
  font-size:15px;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy4 .subli{
  width:170px;
  font-size: 13px;
}

#myScrollspy4 .mainli{
  width:220px;
  font-weight: bold;
}




#myScrollspy4 .nav-link { 

  color: rgb(0, 0, 0); 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}


#myScrollspy4 ul.nav-pills .mainli.active,
.nav-pills .show > .mainli {
  color: #fff !important;
  background-color: #005151 !important; 
  height: 30px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}

#myScrollspy4 ul.nav-pills .subli.active,
.nav-pills .show > .subli {
  color: #fff !important;
  background-color: var(--lilac) !important; 
  height: 30px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}



@media screen and (max-device-width:1375px){
  #myScrollspy4 .nav-pills{
    display:none;
  }
  #myScrollspy4{
    float:none;
    position:absolute;
  }
  #entrep_section{
    left:0px !important;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy4{
    left:0;
    margin:0;
  }
}

/* top box   */

#entrep_section{
  background-color: #ffffff;
  width: 100%;
  display: flex;
  justify-self: center;
  align-self: center !important;
  width:auto;
  overflow:auto;
  left: -130px;


}

#entrep_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#entrep_box h2{
  color:#222
}

#entrep_box p{
color:#444;
}

#entrep_box h1 {
  font-size: 3em;
  margin: 0px;
}

#entrep_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#entrep_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#entrep_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#entrep_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#entrep_box .test{
  display:inline-block;
  float:left;
  padding:20px 15px;
}

#entrep_box section {
  clear: both;
}

#entrep_box .title {
  margin-top: 15px;
  width: 300px;
}

#entrep_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#entrep_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#entrep_box .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#entrep_box .innerContainer {
  padding: 30px 60px;

}

#entrep_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #entrep_box .innerContainer {
    width: 95vw;
  }

  #entrep_box .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #entrep_box .allcontent {
    width: 100vw;
  }
  #entrep_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #entrep_box .innerContainer {
    padding: 10px;
  }
  #entrep_box h1 {
    font-size: 1.3em;
  }
  #entrep_box h2 {
    font-size: 1.1em;
  }
  #entrep_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #entrep_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #entrep_box p{
    font-size: 1em;
  }
  #entrep_box .innerContainer {
    padding: 10px;
  }
  #entrep_box h1 {
    font-size: 1.3em;
  }
  #entrep_box h2 {
    font-size: 1.1em;
  }
}

#entrep_box p{
  font-size: 1.2em;
}

#entrep_box .ad{
  text-decoration: none;
}

#entrep_box a {
  color: blue;
  text-decoration:none;
}

#entrep_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#entrep_box .spacer{
  height:20px;
}

#entrep_box #tiny{
  font-size: 1.1em;
}

#entrep_box #azure {
  color:azure;
}

#entrep_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#entrep_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#entrep_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/* rest boxes */


#entrepreneurship_box{
  background-color: #ffffff;
  width: 100%;
  overflow: inline;
  position:auto;
  overflow-y:visible;
  z-index: 100;
}


#entrepreneurship_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#entrepreneurship_box h2{
  color:#222
}

#entrepreneurship_box p{
color:#444;
}

#entrepreneurship_box h1 {
  font-size: 3em;
  margin: 0px;
}

#entrepreneurship_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#entrepreneurship_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#entrepreneurship_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#entrepreneurship_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#entrepreneurship_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#entrepreneurship_box section {
  clear: both;
}

#entrepreneurship_box .title {
  margin-top: 15px;
  width: 300px;
}

#entrepreneurship_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#entrepreneurship_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#entrepreneurship_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#entry1, #entry2, #entry3, #entry4, #entry5, #entry6 {
scroll-margin-top: 200px;
}

#entrepreneurship_box .innerContainer {
  
  padding: 30px 60px;

}

#entrepreneurship_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #entrepreneurship_box .innerContainer {
    width: 95vw;
  }

  #entrepreneurship_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #entrepreneurship_box .allcontent {
    width: 100vw;
  }
  #entrepreneurship_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #entrepreneurship_box .innerContainer {
    padding: 10px;
  }
  #entrepreneurship_box h1 {
    font-size: 1.3em;
  }
  #entrepreneurship_box h2 {
    font-size: 1.1em;
  }
  #entrepreneurship_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #entrepreneurship_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #entrepreneurship_box p{
    font-size: 1em;
  }
  #entrepreneurship_box .innerContainer {
    padding: 10px;
  }
  #entrepreneurship_box h1 {
    font-size: 1.3em;
  }
  #entrepreneurship_box h2 {
    font-size: 1.1em;
  }
}

#entrepreneurship_box p{
  font-size: 1.2em;
}

#entrepreneurship_box .ad{
  text-decoration: none;
}

#entrepreneurship_box a {
  color: blue;
  text-decoration:none;
}

#entrepreneurship_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#entrepreneurship_box .spacer{
  height:20px;
}

#entrepreneurship_box #tiny{
  font-size: 1.1em;
}

#entrepreneurship_box #azure {
  color:azure;
}

#entrepreneurship_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#entrepreneurship_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#entrepreneurship_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}

/*
####################################################

        █ █▄░█ █▀▀ █░░ █░█ █▀ █ █░█ █ ▀█▀ █▄█
        █ █░▀█ █▄▄ █▄▄ █▄█ ▄█ █ ▀▄▀ █ ░█░ ░█░

######################################################
*/

/* Scrollspy collab */

/* SIDEBAR BABY  */
#body_inclusivity{
  overflow: auto;
  position: relative;
  height:auto;
}

#myScrollspy5  {
  top: 30vh !important; 
  color: white;
  overflow: auto !important;
  position: sticky;
  z-index:1000;
  float: left !important;
  margin-left: 25px;
  width: 200px;
}

#myScrollspy5 .nav-item{
  text-align: left;
  display:flex;
  justify-content:center;
  
}

#myScrollspy5 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy5 .jump{
  background-color:white;
  font-size:15px;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy5 .nav-link { 

  color: rgb(0, 0, 0); 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
  width:190px;
}


#myScrollspy5 ul.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff !important;
  background-color: #005151 !important; 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
  width:190px;
}

@media screen and (max-device-width:1200px){
  #myScrollspy5 .nav-pills{
    display:none;
  }
  #myScrollspy5{
    float:none;
    position:absolute;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy5{
    left:0;
    margin:0;
  }
}

/* top box   */

#inclu_section{
  background-color: #ffffff;
  width: 100%;
  display: flex;
  justify-self: center;
  align-self: center !important;
  width:auto;
  overflow:auto;
  left: -110px;


}


#inclu_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#inclu_box h2{
  color:#222
}

#inclu_box p{
color:#444;
}

#inclu_box h1 {
  font-size: 3em;
  margin: 0px;
}

#inclu_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#inclu_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#inclu_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#inclu_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#inclu_box .test{
  display:inline-block;
  float:left;
  padding:20px 15px;
}

#inclu_box section {
  clear: both;
}

#inclu_box .title {
  margin-top: 15px;
  width: 300px;
}

#inclu_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#inclu_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#inclu_box .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#inclu_box .innerContainer {
  padding: 30px 60px;

}

#inclu_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #inclu_box .innerContainer {
    width: 95vw;
  }

  #inclu_box .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #inclu_box .allcontent {
    width: 100vw;
  }
  #inclu_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #inclu_box .innerContainer {
    padding: 10px;
  }
  #inclu_box h1 {
    font-size: 1.3em;
  }
  #inclu_box h2 {
    font-size: 1.1em;
  }
  #inclu_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #inclu_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #inclu_box p{
    font-size: 1em;
  }
  #inclu_box .innerContainer {
    padding: 10px;
  }
  #inclu_box h1 {
    font-size: 1.3em;
  }
  #inclu_box h2 {
    font-size: 1.1em;
  }
}

#inclu_box p{
  font-size: 1.2em;
}

#inclu_box .ad{
  text-decoration: none;
}

#inclu_box a {
  color: blue;
  text-decoration:none;
}

#inclu_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#inclu_box .spacer{
  height:20px;
}

#inclu_box #tiny{
  font-size: 1.1em;
}

#inclu_box #azure {
  color:azure;
}

#inclu_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#inclu_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#inclu_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/* rest boxes */


#inclusivity_box{
  background-color: #ffffff;
  width: 100%;
  overflow: inline;
  position:auto;
  overflow-y:visible;
  z-index: 100;
}


#inclusivity_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#inclusivity_box h2{
  color:#222
}

#inclusivity_box p{
color:#444;
}

#inclusivity_box h1 {
  font-size: 3em;
  margin: 0px;
}

#inclusivity_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#inclusivity_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#inclusivity_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#inclusivity_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#inclusivity_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#inclusivity_box section {
  clear: both;
}

#inclusivity_box .title {
  margin-top: 15px;
  width: 300px;
}

#inclusivity_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#inclusivity_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#inclusivity_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#inclusivity_box .innerContainer {
  padding: 30px 60px;

}

#inclusivity_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #inclusivity_box .innerContainer {
    width: 95vw;
  }

  #inclusivity_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #inclusivity_box .allcontent {
    width: 100vw;
  }
  #inclusivity_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #inclusivity_box .innerContainer {
    padding: 10px;
  }
  #inclusivity_box h1 {
    font-size: 1.3em;
  }
  #inclusivity_box h2 {
    font-size: 1.1em;
  }
  #inclusivity_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #inclusivity_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #inclusivity_box p{
    font-size: 1em;
  }
  #inclusivity_box .innerContainer {
    padding: 10px;
  }
  #inclusivity_box h1 {
    font-size: 1.3em;
  }
  #inclusivity_box h2 {
    font-size: 1.1em;
  }
}

#inclusivity_box p{
  font-size: 1.2em;
}

#inclusivity_box .ad{
  text-decoration: none;
}

#inclusivity_box a {
  color: blue;
  text-decoration:none;
}

#inclusivity_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#inclusivity_box .spacer{
  height:20px;
}

#inclusivity_box #tiny{
  font-size: 1.1em;
}

#inclusivity_box #azure {
  color:azure;
}

#inclusivity_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#inclusivity_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#inclusivity_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%


█▀▄▀█ █▀▀ ▄▀█ █▀ █░█ █▀█ █▀▀ █▀▄▀█ █▀▀ █▄░█ ▀█▀   ▄▀█ █░█░█ ▄▀█ █▀█ █▀▄
█░▀░█ ██▄ █▀█ ▄█ █▄█ █▀▄ ██▄ █░▀░█ ██▄ █░▀█ ░█░   █▀█ ▀▄▀▄▀ █▀█ █▀▄ █▄▀

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/


#body_measurement{
  overflow: auto;
  position: relative;
  height:auto;
}

#myScrollspy7  {
  top: 30vh !important; 
  color: white;
  overflow: auto !important;
  position: sticky;
  z-index:1000;
  float: left !important;
  margin-left: 25px;
  width: 200px;
}

#myScrollspy7 .nav-item{
  text-align: left;
  display:flex;
  justify-content:center;
  
}

#myScrollspy7 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy7 .jump{
  background-color:white;
  font-size:15px;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy7 .nav-link { 

  color: rgb(0, 0, 0); 
  height: 30px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}


#myScrollspy7 ul.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff !important;
  background-color: #005151 !important; 
  height: 30px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}

@media screen and (max-device-width:1200px){
  #myScrollspy7 .nav-pills{
    display:none;
  }
  #myScrollspy7{
    float:none;
    position:absolute;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy7{
    left:0;
    margin:0;
  }
}

/* top box   */

#meas_section{
  background-color: #ffffff;
  width: 100%;
  display: flex;
  justify-self: center;
  align-self: center !important;
  width:auto;
  overflow:auto;
  left: -110px;


}



#meas_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#meas_box h2{
  color:#222
}

#meas_box p{
color:#444;
}

#meas_box h1 {
  font-size: 3em;
  margin: 0px;
}

#meas_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#meas_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#meas_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#meas_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#meas_box .test{
  display:inline-block;
  float:left;
  padding:20px 15px;
}

#meas_box section {
  clear: both;
}

#meas_box .title {
  margin-top: 15px;
  width: 300px;
}

#meas_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#meas_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#meas_box .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#meas_box .innerContainer {
  padding: 30px 60px;

}

#meas_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #meas_box .innerContainer {
    width: 95vw;
  }

  #meas_box .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #meas_box .allcontent {
    width: 100vw;
  }
  #meas_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #meas_box .innerContainer {
    padding: 10px;
  }
  #meas_box h1 {
    font-size: 1.3em;
  }
  #meas_box h2 {
    font-size: 1.1em;
  }
  #meas_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #meas_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #meas_box p{
    font-size: 1em;
  }
  #meas_box .innerContainer {
    padding: 10px;
  }
  #meas_box h1 {
    font-size: 1.3em;
  }
  #meas_box h2 {
    font-size: 1.1em;
  }
}

#meas_box p{
  font-size: 1.2em;
}

#meas_box .ad{
  text-decoration: none;
}

#meas_box a {
  color: blue;
  text-decoration:none;
}

#meas_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#meas_box .spacer{
  height:20px;
}

#meas_box #tiny{
  font-size: 1.1em;
}

#meas_box #azure {
  color:azure;
}

#meas_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#meas_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#meas_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/* rest boxes */


#measurement_box{
  background-color: #ffffff;
  width: 100%;
  overflow: inline;
  position:auto;
  overflow-y:visible;
  z-index: 100;
}


#measurement_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#measurement_box h2{
  color:#222
}

#measurement_box p{
color:#444;
}

#measurement_box h1 {
  font-size: 3em;
  margin: 0px;
}

#measurement_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#measurement_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#measurement_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#measurement_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#measurement_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#measurement_box section {
  clear: both;
}

#measurement_box .title {
  margin-top: 15px;
  width: 300px;
}

#measurement_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#measurement_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#measurement_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#measurement_box .innerContainer {
  padding: 30px 60px;

}

#measurement_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #measurement_box .innerContainer {
    width: 95vw;
  }

  #measurement_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #measurement_box .allcontent {
    width: 100vw;
  }
  #measurement_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #measurement_box .innerContainer {
    padding: 10px;
  }
  #measurement_box h1 {
    font-size: 1.3em;
  }
  #measurement_box h2 {
    font-size: 1.1em;
  }
  #measurement_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #measurement_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #measurement_box p{
    font-size: 1em;
  }
  #measurement_box .innerContainer {
    padding: 10px;
  }
  #measurement_box h1 {
    font-size: 1.3em;
  }
  #measurement_box h2 {
    font-size: 1.1em;
  }
}

#measurement_box p{
  font-size: 1.2em;
}

#measurement_box .ad{
  text-decoration: none;
}

#measurement_box a {
  color: blue;
  text-decoration:none;
}

#measurement_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#measurement_box .spacer{
  height:20px;
}

#measurement_box #tiny{
  font-size: 1.1em;
}

#measurement_box #azure {
  color:azure;
}

#measurement_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#measurement_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#measurement_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}

/*
####################################################

      █▀ █░█ █▀ ▀█▀ ▄▀█ █ █▄░█ ▄▀█ █▄▄ █░░ █▀▀
      ▄█ █▄█ ▄█ ░█░ █▀█ █ █░▀█ █▀█ █▄█ █▄▄ ██▄

######################################################
*/


#body_sustainability{
  overflow: auto;
  position: relative;
  height:auto;
}

#myScrollspy8  {
  top: 30vh !important; 
  color: white;
  overflow: auto !important;
  position: sticky;
  z-index:1000;
  float: left !important;
  margin-left: 25px;
  width: 200px;
}

#myScrollspy8 .nav-item{
  text-align: left;
  display:flex;
  justify-content:center;
  
}

#myScrollspy8 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy8 .jump{
  background-color:white;
  font-size:15px;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy8 .nav-link { 

  color: rgb(0, 0, 0); 
  height: auto;
  width:150px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}


#myScrollspy8 ul.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff !important;
  background-color: #005151 !important; 
  height: auto;
  width: 150px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}

#susty1, #susty2, #susty3, #susty4  {
  scroll-margin-top:100px;
}


@media screen and (max-device-width:1200px){
  #myScrollspy8 .nav-pills{
    display:none;
  }
  #myScrollspy8{
    float:none;
    position:absolute;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy8{
    left:0;
    margin:0;
  }
}

/* top box   */

#sus_section{
  background-color: #ffffff;
  width: 100%;
  display: flex;
  justify-self: center;
  align-self: center !important;
  width:auto;
  overflow:auto;
  left: -110px;


}
#sus_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#sus_box h2{
  color:#222
}

#meas_box p{
color:#444;
}

#sus_box h1 {
  font-size: 3em;
  margin: 0px;
}

#sus_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#sus_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#sus_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#sus_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#sus_box .test{
  display:inline-block;
  float:left;
  padding:20px 15px;
}

#sus_box section {
  clear: both;
}

#sus_box .title {
  margin-top: 15px;
  width: 300px;
}

#sus_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#sus_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#sus_box .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#sus_box .innerContainer {
  padding: 30px 60px;

}

#sus_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #sus_box .innerContainer {
    width: 95vw;
  }

  #sus_box .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #sus_box .allcontent {
    width: 100vw;
  }
  #sus_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #sus_box .innerContainer {
    padding: 10px;
  }
  #sus_box h1 {
    font-size: 1.3em;
  }
  #sus_box h2 {
    font-size: 1.1em;
  }
  #sus_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #sus_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #sus_box p{
    font-size: 1em;
  }
  #sus_box .innerContainer {
    padding: 10px;
  }
  #sus_box h1 {
    font-size: 1.3em;
  }
  #sus_box h2 {
    font-size: 1.1em;
  }
}

#sus_box p{
  font-size: 1.2em;
}

#sus_box .ad{
  text-decoration: none;
}

#sus_box a {
  color: blue;
  text-decoration:none;
}

#sus_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#sus_box .spacer{
  height:20px;
}

#sus_box #tiny{
  font-size: 1.1em;
}

#sus_box #azure {
  color:azure;
}

#sus_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#sus_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#sus_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/* rest boxes */


#sustainability_box{
  background-color: #ffffff;
  width: 100%;
  overflow: inline;
  position:auto;
  overflow-y:visible;
  z-index: 100;
}


#sustainability_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#sustainability_box h2{
  color:#222
}

#sustainability_box p{
color:#444;
}

#sustainability_box h1 {
  font-size: 3em;
  margin: 0px;
}

#sustainability_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#sustainability_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#sustainability_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#sustainability_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#sustainability_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#sustainability_box section {
  clear: both;
}

#sustainability_box .title {
  margin-top: 15px;
  width: 300px;
}

#sustainability_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#sustainability_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#sustainability_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#sustainability_box .innerContainer {
  padding: 30px 60px;

}

#sustainability_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #sustainability_box .innerContainer {
    width: 95vw;
  }

  #sustainability_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #sustainability_box .allcontent {
    width: 100vw;
  }
  #sustainability_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #sustainability_box .innerContainer {
    padding: 10px;
  }
  #sustainability_box h1 {
    font-size: 1.3em;
  }
  #sustainability_box h2 {
    font-size: 1.1em;
  }
  #sustainability_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #sustainability_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #sustainability_box p{
    font-size: 1em;
  }
  #sustainability_box .innerContainer {
    padding: 10px;
  }
  #sustainability_box h1 {
    font-size: 1.3em;
  }
  #sustainability_box h2 {
    font-size: 1.1em;
  }
}

#sustainability_box p{
  font-size: 1.2em;
}

#sustainability_box .ad{
  text-decoration: none;
}

#sustainability_box a {
  color: blue;
  text-decoration:none;
}

#sustainability_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#sustainability_box .spacer{
  height:20px;
}

#sustainability_box #tiny{
  font-size: 1.1em;
}

#sustainability_box #azure {
  color:azure;
}

#sustainability_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#sustainability_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#sustainability_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/*
#####################################

█▀▀ █▀█ █▀▄▀█ █▀▄▀█ █░█ █▄░█ █ █▀▀ ▄▀█ ▀█▀ █ █▀█ █▄░█
█▄▄ █▄█ █░▀░█ █░▀░█ █▄█ █░▀█ █ █▄▄ █▀█ ░█░ █ █▄█ █░▀█

###################################
*/

#body_communication{
  overflow: auto;
  position: relative;
  height:auto;
}


#myScrollspy9  {
  top: 30vh !important; 
  color: white;
  overflow: auto !important;
  position: sticky;
  z-index:1000;
  float: left !important;
  margin-left: 25px;
  width: 200px;
}

#myScrollspy9 .nav-item{
  text-align: left;
  display:flex;
  justify-content:center;
  
}

#myScrollspy9 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy9 .jump{
  background-color:white;
  font-size:15px;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy9 .nav-link { 

  color: rgb(0, 0, 0); 
  height: auto;
  width:190px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}


#myScrollspy9 ul.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff !important;
  background-color: #005151 !important; 
  height: auto;
  width:190px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}

@media screen and (max-device-width:1200px){
  #myScrollspy9 .nav-pills{
    display:none;
  }
  #myScrollspy9{
    float:none;
    position:absolute;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy9{
    left:0;
    margin:0;
  }
}

/* top box   */

#com_section{
  background-color: #ffffff;
  width: 100%;
  display: flex;
  justify-self: center;
  align-self: center !important;
  width:auto;
  overflow:auto;
  left: -110px;
}


#com_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#com_box h2{
  color:#222
}

#com_box p{
color:#444;
}

#com_box h1 {
  font-size: 3em;
  margin: 0px;
}

#com_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#com_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#com_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#com_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#com_box .test{
  display:inline-block;
  float:left;
  padding:20px 15px;
}

#com_box section {
  clear: both;
}

#com_box .title {
  margin-top: 15px;
  width: 300px;
}

#com_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#com_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#com_box .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#com_box .innerContainer {
  padding: 30px 60px;

}

#com_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #com_box .innerContainer {
    width: 95vw;
  }

  #com_box .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #com_box .allcontent {
    width: 100vw;
  }
  #com_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #com_box .innerContainer {
    padding: 10px;
  }
  #com_box h1 {
    font-size: 1.3em;
  }
  #com_box h2 {
    font-size: 1.1em;
  }
  #com_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #com_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #com_box p{
    font-size: 1em;
  }
  #com_box .innerContainer {
    padding: 10px;
  }
  #com_box h1 {
    font-size: 1.3em;
  }
  #com_box h2 {
    font-size: 1.1em;
  }
}

#com_box p{
  font-size: 1.2em;
}

#com_box .ad{
  text-decoration: none;
}

#com_box a {
  color: blue;
  text-decoration:none;
}

#com_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#com_box .spacer{
  height:20px;
}

#com_box #tiny{
  font-size: 1.1em;
}

#com_box #azure {
  color:azure;
}

#com_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#com_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#com_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/* rest boxes */

#commy1, #commy2, #commy3, #commy4, #commy5, #commy6, #commy7{
  scroll-margin-top:100px;
}

#communication_box{
  background-color: #ffffff;
  width: 100%;
  overflow: inline;
  position:auto;
  overflow-y:visible;
  z-index: 100;
}


#communication_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#communication_box h2{
  color:#222
}

#communication_box p{
color:#444;
}

#communication_box h1 {
  font-size: 3em;
  margin: 0px;
}

#communication_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#communication_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#communication_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#communication_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#communication_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#communication_box section {
  clear: both;
}

#communication_box .title {
  margin-top: 15px;
  width: 300px;
}

#communication_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#communication_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#communication_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#communication_box .innerContainer {
  padding: 30px 60px;

}

#communication_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #communication_box .innerContainer {
    width: 95vw;
  }

  #communication_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #communication_box .allcontent {
    width: 100vw;
  }
  #communication_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #communication_box .innerContainer {
    padding: 10px;
  }
  #communication_box h1 {
    font-size: 1.3em;
  }
  #communication_box h2 {
    font-size: 1.1em;
  }
  #communication_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #communication_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #communication_box p{
    font-size: 1em;
  }
  #communication_box .innerContainer {
    padding: 10px;
  }
  #communication_box h1 {
    font-size: 1.3em;
  }
  #communication_box h2 {
    font-size: 1.1em;
  }
}

#communication_box p{
  font-size: 1.2em;
}

#communication_box .ad{
  text-decoration: none;
}

#communication_box a {
  color: blue;
  text-decoration:none;
}

#communication_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#communication_box .spacer{
  height:20px;
}

#communication_box #tiny{
  font-size: 1.1em;
}

#communication_box #azure {
  color:azure;
}

#communication_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#communication_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#communication_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/*################################################

      █▀█ ▄▀█ █▀█ ▀█▀ █▄░█ █▀▀ █▀█ █▀ █░█ █ █▀█
      █▀▀ █▀█ █▀▄ ░█░ █░▀█ ██▄ █▀▄ ▄█ █▀█ █ █▀▀

###################################################*/ 
#body_partnership{
  overflow: auto;
  position: relative;
  height:auto;
}

#party1, #party1_1, #party1_2, #party1_3, #party2, #party2_1, #party2_2, #party2_3{
  scroll-margin-top: 200px;
}
/* %%%%%%%%%%%%%% SELECTOR TOPIC %%%%%%%%%% */

#partnership_selector {
  align-items: center;
  display: flex;
  top: -10vh;
  font-family: "Heavitas";
  font-weight:100;
  flex-wrap: wrap;
  justify-content: center;
  height: 80vh;
  margin: auto !important;
  width: auto !important;
  left:-150px;
  
}
#partnership_selector .person_ps {
  align-items: center;
  display: flex;
  flex-direction: column;
  width: 30vw !important;
}
#partnership_selector .container_ps {
  display: flex;
  justify-content: center !important;
  align-items: center !important;
  border-radius: 50%;
  height: 312px;
  -webkit-tap-highlight-color: transparent;
  transform: scale(0.6);
  transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1);
  width: 400px;
  top:0vh;

}

#partnership_selector .container_ps:hover {
  transform: scale(0.65);
}

#partnership_selector .circle_ps {
  background-color: #fee7d3;
  border-radius: 50%;
  cursor: pointer;
  height: 380px;
  position: absolute;
  top: 0;
  width: 380px;
  overflow: hidden !important;
}
#partnership_selector .circleselector{
  border-radius: 50%;
  cursor: pointer;
  height: 380px;
  width: 380px;
  position: absolute;
  top: 210px;
  overflow: hidden !important;

}
#partnership_selector .img_ps {
  pointer-events: none;
  position: relative;
  transform: translateY(20px) scale(1.15);
  transform-origin: 50% bottom;
  transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);
}
#partnership_selector .img1_ps {
  left: -290px;
  top: 30px;
  width: 1000px;
  height:350px;
}
#partnership_selector .img2_ps {
  left: 25px;
  top: 31px;
  width: 335px;

}
#partnership_selector .img3_ps {
  left: 60px;
  top: 50px;
  width: 300px;
}
#partnership_selector .divider_ps {
  background-color: #005151;
  height: 2px;
  border-radius:26%;
  margin-top: 20vh;
  width: 160px;
}
#partnership_selector .name_ps {
  color: #404245;
  font-size: 36px;
  font-weight: 600;
  margin-top: 16px;
  text-align: center;
}
#partnership_selector .title_ps {
  color: #6e6e6e;
  font-family: arial;
  font-size: 14px;
  font-style: italic;
  margin-top: 4px;
}

@media screen and (max-width:750px){
  #partnership_selector .circle_ps{
    height: 50vw;
    width: 50vw;
  }
}
@media screen and (max-device-width:650px){
  #partnership_selector .person_ps{
    width: auto !important;
  }
  #partnership_selector .divider_ps{
    margin-top: 5vh;
    width: 20vw;
  }
  #partnership_selector .name_ps{
    font-size: 7vw;
  }
}



/* this is the nav and rest */


#myScrollspy10  {
  top: 15vh !important; 
  color: white;
  overflow: auto !important;
  position: sticky;
  z-index:1000;
  float: left !important;
  margin-left: 25px;
  width: auto;
}

#myScrollspy10 .nav-item{
  text-align: left;
  display:flex;
  
  
}

#myScrollspy10 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy10 .jump{
  background-color:white;
  font-size:15px;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy10 .subli{
  width:170px;
  font-size: 13px;
}

#myScrollspy10 .mainli{
  width:220px;
  font-weight: bold;
}




#myScrollspy10 .nav-link { 

  color: rgb(0, 0, 0); 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}


#myScrollspy10 ul.nav-pills .mainli.active,
.nav-pills .show > .mainli {
  color: #fff !important;
  background-color: #005151 !important; 
  height: 30px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}

#myScrollspy10 ul.nav-pills .subli.active,
.nav-pills .show > .subli {
  color: #fff !important;
  background-color: var(--lilac) !important; 
  height: 30px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}



@media screen and (max-device-width:1375px){
  #myScrollspy10 .nav-pills{
    display:none;
  }
  #myScrollspy10{
    float:none;
    position:absolute;
  }
  #par_section{
    left:0px !important;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy10{
    left:0;
    margin:0;
  }
}

/* top box   */

#par_section{
  background-color: #ffffff;
  width: 100%;
  display: flex;
  justify-self: center;
  align-self: center !important;
  width:auto;
  overflow:auto;
}


#par_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#par_box h2{
  color:#222
}

#par_box p{
color:#444;
}

#par_box h1 {
  font-size: 3em;
  margin: 0px;
}

#par_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#par_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#par_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#par_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#par_box .test{
  display:inline-block;
  float:left;
  padding:20px 15px;
}

#par_box section {
  clear: both;
}

#par_box .title {
  margin-top: 15px;
  width: 300px;
}

#par_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#par_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#par_box .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#par_box .innerContainer {
  padding: 30px 60px;

}

#par_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #par_box .innerContainer {
    width: 95vw;
  }

  #par_box .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #par_box .allcontent {
    width: 100vw;
  }
  #par_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #par_box .innerContainer {
    padding: 10px;
  }
  #par_box h1 {
    font-size: 1.3em;
  }
  #par_box h2 {
    font-size: 1.1em;
  }
  #par_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #par_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #par_box p{
    font-size: 1em;
  }
  #par_box .innerContainer {
    padding: 10px;
  }
  #par_box h1 {
    font-size: 1.3em;
  }
  #par_box h2 {
    font-size: 1.1em;
  }
}

#par_box p{
  font-size: 1.2em;
}

#par_box .ad{
  text-decoration: none;
}

#par_box a {
  color: blue;
  text-decoration:none;
}

#par_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#par_box .spacer{
  height:20px;
}

#par_box #tiny{
  font-size: 1.1em;
}

#par_box #azure {
  color:azure;
}

#par_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#par_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#par_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/* rest boxes */


#partnership_box{
  background-color: #ffffff;
  width: 100%;
  overflow: inline;
  position:auto;
  overflow-y:visible;
  z-index: 100;
}


#partnership_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#partnership_box h2{
  color:#222
}

#partnership_box p{
color:#444;
}

#partnership_box h1 {
  font-size: 3em;
  margin: 0px;
}

#partnership_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#partnership_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#partnership_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#partnership_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#partnership_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#partnership_box section {
  clear: both;
}

#partnership_box .title {
  margin-top: 15px;
  width: 300px;
}

#partnership_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#partnership_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#partnership_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}


#partnership_box .innerContainer {
  
  padding: 30px 60px;

}

#partnership_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #partnership_box .innerContainer {
    width: 95vw;
  }

  #partnership_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #partnership_box .allcontent {
    width: 100vw;
  }
  #partnership_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #partnership_box .innerContainer {
    padding: 10px;
  }
  #partnership_box h1 {
    font-size: 1.3em;
  }
  #partnership_box h2 {
    font-size: 1.1em;
  }
  #partnership_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #partnership_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #partnership_box p{
    font-size: 1em;
  }
  #partnership_box .innerContainer {
    padding: 10px;
  }
  #partnership_box h1 {
    font-size: 1.3em;
  }
  #partnership_box h2 {
    font-size: 1.1em;
  }
}

#partnership_box p{
  font-size: 1.2em;
}

#partnership_box .ad{
  text-decoration: none;
}

#partnership_box a {
  color: blue;
  text-decoration:none;
}

#partnership_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#partnership_box .spacer{
  height:20px;
}

#partnership_box #tiny{
  font-size: 1.1em;
}

#partnership_box #azure {
  color:azure;
}

#partnership_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#partnership_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#partnership_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}

/*
####################################

█▀ ▄▀█ █▀▀ █▀▀ ▀█▀ █▄█
▄█ █▀█ █▀░ ██▄ ░█░ ░█░

####################################3
/*

/* SIDEBAR BABY  */
#body_safety{
  overflow: auto;
  position: relative;
  height:auto;
}


/* %%%%%%%%%%%%%% SELECTOR TOPIC %%%%%%%%%% */
#safety_selector {
  align-items: center;
  display: flex;
  top: -10vh;
  font-family: "Heavitas";
  font-weight:100;
  flex-wrap: wrap;
  justify-content: center;
  height: 80vh;
  margin: auto !important;
  width: auto !important;
  left: -150px;
}
#safety_selector .person_ps {
  align-items: center;
  display: flex;
  flex-direction: column;
  width: 30vw !important;
}
#safety_selector .container_ps {
  display: flex;
  justify-content: center !important;
  align-items: center !important;
  border-radius: 50%;
  height: 312px;
  -webkit-tap-highlight-color: transparent;
  transform: scale(0.6);
  transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1);
  width: 400px;
  top:0vh;

}

#safety_selector .container_ps:hover {
  transform: scale(0.65);
  transition: 0.5s;
}

#safety_selector .circle_ps {
  background-color: #fee7d3;
  border-radius: 50%;
  cursor: pointer;
  height: 380px;
  position: absolute;
  top: 0;
  width: 380px;
  overflow: hidden !important;
}
#safety_selector .circleselector{
  border-radius: 50%;
  cursor: pointer;
  height: 380px;
  width: 380px;
  position: absolute;
  top: 210px;
  overflow: hidden !important;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
  transition: 1s;

}
#safety_selector .container_ps:hover .circleselector{
  box-shadow: 0 30px 10px rgba(0, 0, 0, 0.1);
  transition: 1s;
}

#safety_selector .img_ps {
  pointer-events: none;
  position: relative;
  transform: translateY(20px) scale(1.15);
  transform-origin: 50% bottom;
  transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);
}
#safety_selector .img1_ps {
  left: -20px;
  top: 25px;
  width: 420px;
}
#safety_selector .img2_ps {
  left: 20px;
  top: 30px;
  width: 350px;

}

#safety_selector .divider_ps {
  background-color: #005151;
  height: 2px;
  border-radius:26%;
  margin-top: 20vh;
  width: 160px;
}
#safety_selector .name_ps {
  color: #404245;
  font-size: 36px;
  font-weight: 600;
  margin-top: 16px;
  text-align: center;
}
#safety_selector .title_ps {
  color: #6e6e6e;
  font-family: arial;
  font-size: 14px;
  font-style: italic;
  margin-top: 4px;
}

@media screen and (max-width:750px){
  #safety_selector .circle_ps{
    height: 50vw;
    width: 50vw;
  }
}
@media screen and (max-device-width:650px){
  #safety_selector.person_ps{
    width: auto !important;
  }
  #safety_selector .divider_ps{
    margin-top: 5vh;
    width: 20vw;
  }
  #safety_selector .name_ps{
    font-size: 7vw;
  }
}



/* this is the nav and rest */


#myScrollspy11  {
  top: 15vh !important; 
  color: white;
  overflow: auto !important;
  position: sticky;
  z-index:1000;
  float: left !important;
  margin-left: 25px;
  width: auto;
}

#myScrollspy11 .nav-item{
  text-align: left;
  display:flex;
  
  
}

#myScrollspy11 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy11 .jump{
  background-color:white;
  font-size:15px;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy11 .subli{
  width:170px;
  font-size: 13px;
}

#myScrollspy11 .mainli{
  width:220px;
  font-weight: bold;
}




#myScrollspy11 .nav-link { 

  color: rgb(0, 0, 0); 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}


#myScrollspy11 ul.nav-pills .mainli.active,
.nav-pills .show > .mainli {
  color: #fff !important;
  background-color: #005151 !important; 
  height: 30px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}

#myScrollspy11 ul.nav-pills .subli.active,
.nav-pills .show > .subli {
  color: #fff !important;
  background-color: var(--lilac) !important; 
  height: 30px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}



@media screen and (max-device-width:1375px){
  #myScrollspy11 .nav-pills{
    display:none;
  }
  #myScrollspy11{
    float:none;
    position:absolute;
  }
  #safe_section{
    left:0px !important;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy11{
    left:0;
    margin:0;
  }
}

/* top box   */


#safe_section{
  background-color: #ffffff;
  width: 100%;
  display: flex;
  justify-self: center;
  align-self: center !important;
  width:auto;
  overflow:auto;

}


#safe_section p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#safe_section h2{
  color:#222
}

#safe_section p{
color:#444;
}

#safe_section h1 {
  font-size: 3em;
  margin: 0px;
}

#safe_section h2 {
  font-size: 1.5em;
  margin: 0px;
}

#safe_section .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#safe_section .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#safe_section .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#safe_section .test{
  display:inline-block;
  float:left;
  padding:20px 15px;
}

#safe_section section {
  clear: both;
}

#safe_section .title {
  margin-top: 15px;
  width: 300px;
}

#safe_section .homeLink {
  margin: 0px;
  padding: 0px;
}

#safe_section .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#safe_section .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#safe_section .innerContainer {
  padding: 30px 60px;

}

#safe_section .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #safe_section .innerContainer {
    width: 95vw;
  }

  #safe_section .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #safe_section .allcontent {
    width: 100vw;
  }
  #safe_section .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #safe_section .innerContainer {
    padding: 10px;
  }
  #safe_section h1 {
    font-size: 1.3em;
  }
  #safe_section h2 {
    font-size: 1.1em;
  }
  #safe_section p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #safe_section .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #safe_section p{
    font-size: 1em;
  }
  #safe_section .innerContainer {
    padding: 10px;
  }
  #safe_section h1 {
    font-size: 1.3em;
  }
  #safe_section h2 {
    font-size: 1.1em;
  }
}

#safe_section p{
  font-size: 1.2em;
}

#safe_section .ad{
  text-decoration: none;
}

#safe_section a {
  color: blue;
  text-decoration:none;
}

#safe_section img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#safe_section .spacer{
  height:20px;
}

#safe_section #tiny{
  font-size: 1.1em;
}

#safe_section #azure {
  color:azure;
}

#safe_section .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#safe_section .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#safe_section .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/* rest boxes */


#safety_box{
  background-color: #ffffff;
  width: 100%;
  overflow: inline;
  position:auto;
  overflow-y:visible;
  z-index: 100;
}


#safety_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#safety_box h2{
  color:#222
}

#safety_box p{
color:#444;
}

#safety_box h1 {
  font-size: 3em;
  margin: 0px;
}

#safety_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#safety_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#safety_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#safety_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#safety_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#safety_box section {
  clear: both;
}

#safety_box .title {
  margin-top: 15px;
  width: 300px;
}

#safety_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#safety_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#safety_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#safy1, #safy1_1, #safy1_2, #safy1_3, #safy1_4, #safy2, #safy2_1, #safy2_2, #safy2_3, #safy2_4{
  scroll-margin-top: 100px;
}

#safety_box .innerContainer {
  
  padding: 30px 60px;

}

#safety_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #safety_box .innerContainer {
    width: 95vw;
  }

  #safety_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #safety_box .allcontent {
    width: 100vw;
  }
  #safety_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #safety_box .innerContainer {
    padding: 10px;
  }
  #safety_box h1 {
    font-size: 1.3em;
  }
  #safety_box h2 {
    font-size: 1.1em;
  }
  #safety_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #safety_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #safety_box p{
    font-size: 1em;
  }
  #safety_box .innerContainer {
    padding: 10px;
  }
  #safety_box h1 {
    font-size: 1.3em;
  }
  #safety_box h2 {
    font-size: 1.1em;
  }
}

#safety_box p{
  font-size: 1.2em;
}

#safety_box .ad{
  text-decoration: none;
}

#safety_box a {
  color: blue;
  text-decoration:none;
}

#safety_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#safety_box .spacer{
  height:20px;
}

#safety_box #tiny{
  font-size: 1.1em;
}

#safety_box #azure {
  color:azure;
}

#safety_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#safety_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#safety_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}

/*
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

█░█ █░█ █▀▄▀█ ▄▀█ █▄░█   █▀█ █▀█ ▄▀█ █▀▀ ▀█▀ █ █▀▀ █▀▀ █▀
█▀█ █▄█ █░▀░█ █▀█ █░▀█   █▀▀ █▀▄ █▀█ █▄▄ ░█░ █ █▄▄ ██▄ ▄█

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/



/* SIDEBAR BABY  */
#body_humanp{
  overflow: auto;
  position: relative;
  height:auto;
  z-index: 100;
}


/*$$$$$$$$$$$$$$$$$$$$$$$*/
/* %%%%%%%%%%%%%% SELECTOR TOPIC %%%%%%%%%% */

#humanp_selector {
  position:relative;
  top:0;
  left:0;
  width:100%;
  height:auto;
}


/*ZoomIn Hover-Mask Effect*/
#humanp_selector .hover-mask a {
  display: flex;
  position: relative;
  overflow: hidden;
  border-radius:50%;
  height:200px;
  width:200px;

}
#humanp_selector .hover-mask img {
  width: 100%;
  height: auto;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
#humanp_selector .hover-mask:hover img {
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -o-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
}
#humanp_selector .hover-mask a h2 {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  margin-top: 0px;
  margin-bottom: 0px;
  height: 100%;
  width: 100%;
  padding: 45% 20px;
  text-align: center;
  background-color: rgba(0,0,0,0.4);
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  transition: all 0.5s linear;
  -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  opacity: 0;
}
#humanp_selector .hover-mask:hover a h2 {
  -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  opacity: 1;
}
#humanp_selector .hover-mask .fa-magnifying-glass {
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -o-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
  color: #fff;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  transition: all 0.5s linear;
  -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  opacity: 0;
}
#humanp_selector .hover-mask:hover .fa-magnifying-glass {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -o-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  transition: all 0.5s linear;
  -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=1)";
  filter: alpha(opacity=1);
  opacity: 1;
}





/* this is the nav and rest */


#myScrollspy12  {
  top: 15vh !important; 
  color: white;
  overflow: auto;
  position: sticky;
  z-index:1000;
  float: left !important;
  margin-left: 25px;
  width: auto;
}

#myScrollspy12 .nav-item{
  text-align: left;
  display:flex;
  
  
}

#myScrollspy12 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy12 .jump{
  background-color:white;
  font-size:15px;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy12 .subli{
  width:170px;
  font-size: 13px;
}

#myScrollspy12 .mainli{
  width:220px;
  font-weight: bold;
}




#myScrollspy12 .nav-link { 

  color: rgb(0, 0, 0); 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}


#myScrollspy12 ul.nav-pills .mainli.active,
.nav-pills .show > .mainli {
  color: #fff !important;
  background-color: #005151 !important; 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}

#myScrollspy12 ul.nav-pills .subli.active,
.nav-pills .show > .subli {
  color: #fff !important;
  background-color: var(--lilac) !important; 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}



@media screen and (max-device-width:1375px){
  #myScrollspy12 .nav-pills{
    display:none;
  }
  #myScrollspy12{
    float:none;
    position:absolute;
  }
  #hp_section{
    left:0px !important;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy12{
    left:0;
    margin:0;
  }
}

/* top box   */


#hp_section{
  background-color: #ffffff;
  width: 100%;
  justify-self: center;
  align-self: center !important;
  width: auto;
  left: -125px;
  overflow: auto;
  margin:auto;

}



#hp_section p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#hp_section h2{
  color:#222
}

#hp_section p{
color:#444;
}

#hp_section h1 {
  font-size: 3em;
  margin: 0px;
}

#hp_section h2 {
  font-size: 1.5em;
  margin: 0px;
}

#hp_section .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#hp_section .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#hp_section .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#hp_section .test{
  display:inline-block;

  padding:20px 15px;
}

#hp_section section {
  clear: both;
}

#hp_section .title {
  margin-top: 15px;
  width: 300px;
}

#hp_section .homeLink {
  margin: 0px;
  padding: 0px;
}

#hp_section .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#hp_section .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#hp_section .innerContainer {
  padding: 30px 60px;

}

#hp_section .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #hp_section .innerContainer {
    width: 95vw;
  }

  #hp_section .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #hp_section .allcontent {
    width: 100vw;
  }
  #hp_section .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #hp_section .innerContainer {
    padding: 10px;
  }
  #hp_section h1 {
    font-size: 1.3em;
  }
  #hp_section h2 {
    font-size: 1.1em;
  }
  #hp_section p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #hp_section .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #hp_section p{
    font-size: 1em;
  }
  #hp_section .innerContainer {
    padding: 10px;
  }
  #hp_section h1 {
    font-size: 1.3em;
  }
  #hp_section h2 {
    font-size: 1.1em;
  }
}

#hp_section p{
  font-size: 1.2em;
}

#hp_section .ad{
  text-decoration: none;
}

#hp_section a {
  color: blue;
  text-decoration:none;
}

#hp_section img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#hp_section .spacer{
  height:20px;
}

#hp_section #tiny{
  font-size: 1.1em;
}

#hp_section #azure {
  color:azure;
}

#hp_section .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#hp_section .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#hp_section .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/* rest boxes */


#humanp_box{
  background-color: #ffffff;
  width: 100%;
  overflow: inline;
  position:auto;
  overflow-y:visible;
  z-index: 100;
}


#humanp_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#humanp_box h2{
  color:#222
}

#humanp_box p{
color:#444;
}

#humanp_box h1 {
  font-size: 3em;
  margin: 0px;
}

#humanp_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#humanp_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#humanp_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#humanp_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#humanp_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#humanp_box section {
  clear: both;
}

#humanp_box .title {
  margin-top: 15px;
  width: 300px;
}

#humanp_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#humanp_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#humanp_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#hppy1, #hppy2, #hppy3, #hppy4, #hppy5, #hppy6{
  scroll-margin-top: 200px;
}

#humanp_box .innerContainer {
  
  padding: 30px 60px;

}

#humanp_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #humanp_box .innerContainer {
    width: 95vw;
  }

  #humanp_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #humanp_box .allcontent {
    width: 100vw;
  }
  #humanp_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #humanp_box .innerContainer {
    padding: 10px;
  }
  #humanp_box h1 {
    font-size: 1.3em;
  }
  #humanp_box h2 {
    font-size: 1.1em;
  }
  #humanp_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #humanp_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #humanp_box p{
    font-size: 1em;
  }
  #humanp_box .innerContainer {
    padding: 10px;
  }
  #humanp_box h1 {
    font-size: 1.3em;
  }
  #humanp_box h2 {
    font-size: 1.1em;
  }
}

#humanp_box p{
  font-size: 1.2em;
}

#humanp_box .ad{
  text-decoration: none;
}

#humanp_box a {
  color: blue;
  text-decoration:none;
}

#humanp_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#humanp_box .spacer{
  height:20px;
}

#humanp_box #tiny{
  font-size: 1.1em;
}

#humanp_box #azure {
  color:azure;
}

#humanp_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#humanp_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#humanp_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}

/*
########################################


█▀▄ █▀▀ █▀ █▀▀ █▀█ █ █▀█ ▀█▀ █ █▀█ █▄░█
█▄▀ ██▄ ▄█ █▄▄ █▀▄ █ █▀▀ ░█░ █ █▄█ █░▀█


#########################################
*/



/* SIDEBAR BABY  */
#body_description{
  overflow: auto;
  position: relative;
  height:auto;
  z-index:100;
}

#desc1, #desc2, #desc3, #desc4, #desc5, #desc6{
  scroll-margin-top: 200px;
}


/* %%%%%%%%%%%%%% SELECTOR TOPIC %%%%%%%%%% */

#desc_selector {
  align-items: center;
  display: flex;
  top: -10vh;
  font-family: "Heavitas";
  font-weight:100;
  flex-wrap: wrap;
  justify-content: center;
  height: 80vh;
  margin: 0 !important;
  width: auto !important;
}
#desc_selector .person_ps {
  align-items: center;
  display: flex;
  flex-direction: column;
  width: 30vw !important;
}
#desc_selector .container_ps {
  display: flex;
  justify-content: center !important;
  align-items: center !important;
  border-radius: 50%;
  height: 312px;
  -webkit-tap-highlight-color: transparent;
  transform: scale(0.6);
  transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1);
  width: 400px;
  top:0vh;

}

#desc_selector .container_ps:hover {
  transform: scale(0.65);
}

#desc_selector .circle_ps {
  background-color: #fee7d3;
  border-radius: 50%;
  cursor: pointer;
  height: 380px;
  position: absolute;
  top: 0;
  width: 380px;
  overflow: hidden !important;
}
#desc_selector .circleselector{
  border-radius: 50%;
  cursor: pointer;
  height: 380px;
  width: 380px;
  position: absolute;
  top: 210px;
  overflow: hidden !important;

}
#desc_selector .img_ps {
  pointer-events: none;
  position: relative;
  transform: translateY(20px) scale(1.15);
  transform-origin: 50% bottom;
  transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);
}
#desc_selector .img1_ps {
  left: 60px;
  top: 50px;
  width: 300px;
}
#desc_selector .img2_ps {
  left: 40px;
  top: 30px;
  width: 300px;

}
#desc_selector .img3_ps {
  left: 60px;
  top: 50px;
  width: 300px;
}
#desc_selector .divider_ps {
  background-color: #005151;
  height: 2px;
  border-radius:26%;
  margin-top: 20vh;
  width: 160px;
}
#desc_selector .name_ps {
  color: #404245;
  font-size: 36px;
  font-weight: 600;
  margin-top: 16px;
  text-align: center;
}
#desc_selector .title_ps {
  color: #6e6e6e;
  font-family: arial;
  font-size: 14px;
  font-style: italic;
  margin-top: 4px;
}

@media screen and (max-width:750px){
  #desc_selector .circle_ps{
    height: 50vw;
    width: 50vw;
  }
}
@media screen and (max-device-width:650px){
  #desc_selector .person_ps{
    width: auto !important;
  }
  #desc_selector .divider_ps{
    margin-top: 5vh;
    width: 20vw;
  }
  #desc_selector .name_ps{
    font-size: 7vw;
  }
}


/* this is the nav and rest */


#myScrollspy13  {
  top: 15vh !important; 
  color: white;
  overflow: auto;
  position: sticky;
  z-index:1000;
  float: left !important;
  margin-left: 25px;
  width: auto;
}

#myScrollspy13 .nav-item{
  text-align: left;
  display:flex;
  
  
}

#myScrollspy13 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy13 .jump{
  background-color:white;
  font-size:15px;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy13 .subli{
  width:170px;
  font-size: 13px;
}

#myScrollspy13 .mainli{
  width:220px;
  font-weight: bold;
}




#myScrollspy13 .nav-link { 

  color: rgb(0, 0, 0); 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}


#myScrollspy13 ul.nav-pills .mainli.active,
.nav-pills .show > .mainli {
  color: #fff !important;
  background-color: #005151 !important; 
  height: 30px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}

#myScrollspy13 ul.nav-pills .subli.active,
.nav-pills .show > .subli {
  color: #fff !important;
  background-color: var(--lilac) !important; 
  height: 30px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}



@media screen and (max-device-width:1375px){
  #myScrollspy13 .nav-pills{
    display:none;
  }
  #myScrollspy13{
    float:none;
    position:absolute;
  }
  #desc_section{
    left:0px !important;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy13{
    left:0;
    margin:0;
  }
}

/* top box   */


#desc_section{
  background-color: #ffffff;
  width: 100%;
  justify-self: center;
  align-self: center !important;
  width: auto;
  
  overflow: auto;

}

#desc_iframe{
  left: -150px;
}

#desc_section p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#desc_section h2{
  color:#222
}

#desc_section p{
color:#444;
}

#desc_section h1 {
  font-size: 3em;
  margin: 0px;
}

#desc_section h2 {
  font-size: 1.5em;
  margin: 0px;
}

#desc_section .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#desc_section .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#desc_section .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#desc_section .test{
  display:inline-block;

  padding:20px 15px;
}

#desc_section section {
  clear: both;
}

#desc_section .title {
  margin-top: 15px;
  width: 300px;
}

#desc_section .homeLink {
  margin: 0px;
  padding: 0px;
}

#desc_section .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#desc_section .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#desc_section .innerContainer {
  padding: 30px 60px;

}

#desc_section .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #desc_section .innerContainer {
    width: 95vw;
  }

  #desc_section .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #desc_section .allcontent {
    width: 100vw;
  }
  #desc_section .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #desc_section .innerContainer {
    padding: 10px;
  }
  #desc_section h1 {
    font-size: 1.3em;
  }
  #desc_section h2 {
    font-size: 1.1em;
  }
  #desc_section p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #desc_section .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #desc_section p{
    font-size: 1em;
  }
  #desc_section .innerContainer {
    padding: 10px;
  }
  #desc_section h1 {
    font-size: 1.3em;
  }
  #desc_section h2 {
    font-size: 1.1em;
  }
}

#desc_section p{
  font-size: 1.2em;
}

#desc_section .ad{
  text-decoration: none;
}

#desc_section a {
  color: blue;
  text-decoration:none;
}

#desc_section img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#desc_section .spacer{
  height:20px;
}

#desc_section #tiny{
  font-size: 1.1em;
}

#desc_section #azure {
  color:azure;
}

#desc_section .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#desc_section .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#desc_section .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


.videocontainer_desription{
  position:absolute;
  
}

/* rest boxes */


#description_box{
  background-color: #ffffff;
  width: 100%;
  overflow: inline;
  position:auto;
  overflow-y:visible;
  z-index: 100;
}


#description_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#description_box h2{
  color:#222
}

#description_box p{
color:#444;
}

#description_box h1 {
  font-size: 3em;
  margin: 0px;
}

#description_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#description_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#description_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#description_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#description_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#description_box section {
  clear: both;
}

#description_box .title {
  margin-top: 15px;
  width: 300px;
}

#description_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#description_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#description_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}



#description_box .innerContainer {
  
  padding: 30px 60px;

}

#description_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #description_box .innerContainer {
    width: 95vw;
  }

  #description_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #description_box .allcontent {
    width: 100vw;
  }
  #description_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #description_box .innerContainer {
    padding: 10px;
  }
  #description_box h1 {
    font-size: 1.3em;
  }
  #description_box h2 {
    font-size: 1.1em;
  }
  #description_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #description_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #description_box p{
    font-size: 1em;
  }
  #description_box .innerContainer {
    padding: 10px;
  }
  #description_box h1 {
    font-size: 1.3em;
  }
  #description_box h2 {
    font-size: 1.1em;
  }
}

#description_box p{
  font-size: 1.2em;
}

#description_box .ad{
  text-decoration: none;
}

#description_box a {
  color: blue;
  text-decoration:none;
}

#description_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#description_box .spacer{
  height:20px;
}

#description_box #tiny{
  font-size: 1.1em;
}

#description_box #azure {
  color:azure;
}

#description_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#description_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#description_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/* %%%%%%%%%%%%%% 

█▀▀ █▀█ █▄░█ ▀█▀ █▀█ █ █▄▄ █░█ ▀█▀ █ █▀█ █▄░█
█▄▄ █▄█ █░▀█ ░█░ █▀▄ █ █▄█ █▄█ ░█░ █ █▄█ █░▀█

%%%%%%%%%% */

/* SIDEBAR BABY  */
#body_contribution{
  overflow: auto;
  position: absolute;
  height:auto;
  z-index:100;
}

#contr1, #contr2, #contr3{
  scroll-margin-top: 200px;
}



#myScrollspy14  {
  top: 15vh !important; 
  color: white;
  overflow: auto;
  position: sticky;
  z-index:1000;
  float: left !important;
  margin-left: 25px;
  width: auto;
}

#myScrollspy14 .nav-item{
  text-align: left;
  display:flex;
  
  
}

#myScrollspy14 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy14 .jump{
  background-color:white;
  font-size:15px;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy14 .subli{
  width:170px;
  font-size: 13px;
}

#myScrollspy14 .mainli{
  width:220px;
  font-weight: bold;
}




#myScrollspy14 .nav-link { 

  color: rgb(0, 0, 0); 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}


#myScrollspy14 ul.nav-pills .mainli.active,
.nav-pills .show > .mainli {
  color: #fff !important;
  background-color: #005151 !important; 
  height: 30px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}




@media screen and (max-device-width:1375px){
  #myScrollspy14 .nav-pills{
    display:none;
  }
  #myScrollspy14{
    float:none;
    position:absolute;
  }
  #cont_section{
    left:0px !important;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy14{
    left:0;
    margin:0;
  }
}

/* top box   */


#cont_section{
  background-color: #ffffff;
  width: 100%;
  justify-self: center;
  align-self: center !important;
  width: auto;
  left: -125px;
  overflow: auto;

}



#cont_section p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#cont_section h2{
  color:#222
}

#cont_section p{
color:#444;
}

#cont_section h1 {
  font-size: 3em;
  margin: 0px;
}

#cont_section h2 {
  font-size: 1.5em;
  margin: 0px;
}

#cont_section .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#cont_section .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#cont_section .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#cont_section .test{
  display:inline-block;

  padding:20px 15px;
}

#cont_section section {
  clear: both;
}

#cont_section .title {
  margin-top: 15px;
  width: 300px;
}

#cont_section .homeLink {
  margin: 0px;
  padding: 0px;
}

#cont_section .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#cont_section .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#cont_section .innerContainer {
  padding: 30px 60px;

}

#cont_section .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #cont_section .innerContainer {
    width: 95vw;
  }

  #cont_section .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #cont_section .allcontent {
    width: 100vw;
  }
  #cont_section .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #cont_section .innerContainer {
    padding: 10px;
  }
  #cont_section h1 {
    font-size: 1.3em;
  }
  #cont_section h2 {
    font-size: 1.1em;
  }
  #cont_section p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #cont_section .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #cont_section p{
    font-size: 1em;
  }
  #cont_section .innerContainer {
    padding: 10px;
  }
  #cont_section h1 {
    font-size: 1.3em;
  }
  #cont_section h2 {
    font-size: 1.1em;
  }
}

#cont_section p{
  font-size: 1.2em;
}

#cont_section .ad{
  text-decoration: none;
}

#cont_section a {
  color: blue;
  text-decoration:none;
}

#cont_section img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#cont_section .spacer{
  height:20px;
}

#cont_section #tiny{
  font-size: 1.1em;
}

#cont_section #azure {
  color:azure;
}

#cont_section .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#cont_section .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#cont_section .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/* rest boxes */


#contribution_box{
  background-color: #ffffff;
  width: 100%;
  overflow: inline;
  position:auto;
  overflow-y:visible;
  z-index: 100;
}


#contribution_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#contribution_box h2{
  color:#222
}

#contribution_box p{
color:#444;
}

#contribution_box h1 {
  font-size: 3em;
  margin: 0px;
}

#contribution_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#contribution_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#contribution_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#contribution_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#contribution_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#contribution_box section {
  clear: both;
}

#contribution_box .title {
  margin-top: 15px;
  width: 300px;
}

#contribution_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#contribution_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#contribution_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}



#contribution_box .innerContainer {
  
  padding: 30px 60px;

}

#contribution_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #contribution_box .innerContainer {
    width: 95vw;
  }

  #contribution_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #contribution_box .allcontent {
    width: 100vw;
  }
  #contribution_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #contribution_box .innerContainer {
    padding: 10px;
  }
  #contribution_box h1 {
    font-size: 1.3em;
  }
  #contribution_box  h2 {
    font-size: 1.1em;
  }
  #contribution_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #contribution_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #contribution_box p{
    font-size: 1em;
  }
  #contribution_box .innerContainer {
    padding: 10px;
  }
  #contribution_box h1 {
    font-size: 1.3em;
  }
  #description_box h2 {
    font-size: 1.1em;
  }
}

#contribution_box p{
  font-size: 1.2em;
}

#contribution_box .ad{
  text-decoration: none;
}

#description_box a {
  color: blue;
  text-decoration:none;
}

#contribution_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#contribution_box .spacer{
  height:20px;
}

#contribution_box #tiny{
  font-size: 1.1em;
}

#contribution_box #azure {
  color:azure;
}

#description_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#contribution_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#contribution_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}




/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

█▀█ █▀▀ █▀ █░█ █░░ ▀█▀ █▀
█▀▄ ██▄ ▄█ █▄█ █▄▄ ░█░ ▄█

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/


#body_reults{
  overflow: auto;
  position: relative;
  height:auto;
  justify-content:center;
  align-items: center;
}
#resulty1, #resulty2, #resulty3,#resulty4, #resulty5  {
  scroll-margin-top: 200px;
}
#results_section{
  width:80%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin:auto;
  
}

#results_box{
  background-color: #ffffff;
  width: 100%;
}


#results_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#results_box h2{
  color:#222
}

#results_box p{
color:#444;
}

#results_box h1 {
  font-size: 3em;
  margin: 0px;
}

#results_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#results_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#results_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#results_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#results_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#results_box section {
  clear: both;
}

#results_box .title {
  margin-top: 15px;
  width: 300px;
}

#results_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#results_box .allcontent {
  
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#results_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#results_box .innerContainer {
  padding: 30px 60px;

}

#results_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #results_box .innerContainer {
    width: 95vw;
  }

  #results_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #results_box .allcontent {
    width: 100vw;
  }
  #results_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #results_box .innerContainer {
    padding: 10px;
  }
  #results_box h1 {
    font-size: 1.3em;
  }
  #results_box h2 {
    font-size: 1.1em;
  }
  #results_box p{
    font-size: 1em;
  }
}

@media screen and (max-width:676px) {
  #results_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #results_box p{
    font-size: 1em;
  }
  #results_box .innerContainer {
    padding: 0;
  }
  #results_box h1 {
    font-size: 1.3em;
  }
  #results_box h2 {
    font-size: 1.1em;
  }
}

#results_box p{
  font-size: 1.2em;
}

#results_box .ad{
  text-decoration: none;
}

#results_box a {
  color: blue;
  text-decoration:none;
}

#results_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#results_box .spacer{
  height:20px;
}

#results_box #tiny{
  font-size: 1.1em;
}

#results_box #azure {
  color:azure;
}

#results_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#results_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#results_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


#myScrollspy15  {
  top: 30vh !important; 
  color: white;
  overflow: auto;
  position: sticky;
  z-index:1000;
  float:left;
  width:auto;
  margin-left:15px !important;
}


#myScrollspy15 .nav-item{
  text-align: left;
  display:flex;
  justify-content:center;
  width:auto;
}

#myScrollspy15 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy15 .jump{
  background-color:white;
  font-size:15px;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy15 .nav-link { 

  color: rgb(0, 0, 0); 
  height:auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
  width:150px;
  height:auto;
}


#myScrollspy15 ul.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff !important;
  background-color: #005151 !important; 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
  height:auto;
  width:150px;
}

@media screen and (max-device-width:1200px){
  #myScrollspy15 .nav-pills{
    display:none;
  }
  #myScrollspy15{
    float:none;
    position:absolute;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy15{
    left:0;
    margin:0;
  }
}


@media screen and (max-width: 810px) {
  #resulty1, #resulty2, #resulty3  {
      margin-left: 150px;
  }
}


/*&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&


█▀█ █▀█ █▀█ █▀█ █▀▀   █▀█ █▀▀   █▀▀ █▀█ █▄░█ █▀▀ █▀▀ █▀█ ▀█▀
█▀▀ █▀▄ █▄█ █▄█ █▀░   █▄█ █▀░   █▄▄ █▄█ █░▀█ █▄▄ ██▄ █▀▀ ░█░

&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&*/

#body_proofoc{
  overflow: auto;
  position: relative;
  
  height:auto;
}

#proofy1, #proofy2, #proofy3  {
  scroll-margin-top: 100px;
}

#proofoc_section{
  width:80%;
  display: flex;
  justify-content: center;
  align-items: center;
}

#proofoc_box{
  background-color: #ffffff;
  width: 100%;
}


#proofoc_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#proofoc_box h2{
  color:#222
}

#proofoc_box p{
color:#444;
}

#proofoc_box h1 {
  font-size: 3em;
  margin: 0px;
}

#proofoc_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#proofoc_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#proofoc_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#proofoc_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#proofoc_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#proofoc_box section {
  clear: both;
}

#proofoc_box .title {
  margin-top: 15px;
  width: 300px;
}

#proofoc_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#proofoc_box .allcontent {
  
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#proofoc_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#proofoc_box .innerContainer {
  padding: 30px 60px;

}

#proofoc_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #proofoc_box .innerContainer {
    width: 95vw;
  }

  #proofoc_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #proofoc_box .allcontent {
    width: 100vw;
  }
  #proofoc_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #proofoc_box .innerContainer {
    padding: 10px;
  }
  #proofoc_box h1 {
    font-size: 1.3em;
  }
  #proofoc_box h2 {
    font-size: 1.1em;
  }
  #proofoc_box p{
    font-size: 1em;
  }
}

@media screen and (max-width:676px) {
  #proofoc_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #proofoc_box p{
    font-size: 1em;
  }
  #proofoc_box .innerContainer {
    padding: 0;
  }
  #proofoc_box h1 {
    font-size: 1.3em;
  }
  #proofoc_box h2 {
    font-size: 1.1em;
  }
}

#proofoc_box p{
  font-size: 1.2em;
}

#proofoc_box .ad{
  text-decoration: none;
}

#proofoc_box a {
  color: blue;
  text-decoration:none;
}

#proofoc_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#proofoc_box .spacer{
  height:20px;
}

#proofoc_box #tiny{
  font-size: 1.1em;
}

#proofoc_box #azure {
  color:azure;
}

#proofoc_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#proofoc_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#proofoc_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


#myScrollspy16  {
  top: 30vh !important; 
  color: white;
  overflow: auto;
  position: sticky;
  z-index:1000;
  float:left;
  width:10%;
}


#myScrollspy16 .nav-item{
  text-align: left;
  display:flex;
  justify-content:center;
  width:auto;
}

#myScrollspy16 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy16 .jump{
  background-color:white;
  font-size:15px;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy16 .nav-link { 

  color: rgb(0, 0, 0); 
  height:auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
  width:130px;
}


#myScrollspy16 ul.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff !important;
  background-color: #005151 !important; 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}


@media screen and (max-device-width:1200px){
  #myScrollspy16 .nav-pills{
    display:none;
  }
  #myScrollspy16{
    float:none;
    position:absolute;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy16{
    left:0;
    margin:0;
  }
}


@media screen and (max-width: 810px) {
  #proofy1, #proofy2, #proofy3  {
      margin-left: 150px;
  }
}


/* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%


█ █▀▄▀█ █▀█ █░░ █▀▀ █▀▄▀█ █▀▀ █▄░█ ▀█▀ ▄▀█ ▀█▀ █ █▀█ █▄░█
█ █░▀░█ █▀▀ █▄▄ ██▄ █░▀░█ ██▄ █░▀█ ░█░ █▀█ ░█░ █ █▄█ █░▀█


%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

#body_implementation{
  overflow: auto;
  position: relative;
  height:auto;
}

#imply1, #imply2, #imply3, #imply4, #imply5   {
  scroll-margin-top: 150px;
}

#implementation_section{
  width:70%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto;
  left: -7vw;
}

#implementation_box{
  background-color: #ffffff;
  width: 100%;
}


#implementation_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#implementation_box h2{
  color:#222
}

#implementation_box p{
color:#444;
}

#implementation_box h1 {
  font-size: 3em;
  margin: 0px;
}

#implementation_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#implementation_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#implementation_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#implementation_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#implementation_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#implementation_box section {
  clear: both;
}

#implementation_box .title {
  margin-top: 15px;
  width: 300px;
}

#implementation_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#implementation_box .allcontent {
  
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#implementation_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#implementation_box .innerContainer {
  padding: 30px 60px;

}

#implementation_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #implementation_box .innerContainer {
    width: 95vw;
  }

  #implementation_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #implementation_box .allcontent {
    width: 100vw;
  }
  #implementation_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #implementation_box .innerContainer {
    padding: 10px;
  }
  #implementation_box h1 {
    font-size: 1.3em;
  }
  #implementation_box h2 {
    font-size: 1.1em;
  }
  #implementation_box p{
    font-size: 1em;
  }
}

@media screen and (max-width:676px) {
  #implementation_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #implementation_box p{
    font-size: 1em;
  }
  #implementation_box .innerContainer {
    padding: 0;
  }
  #implementation_box h1 {
    font-size: 1.3em;
  }
  #implementation_box h2 {
    font-size: 1.1em;
  }
}

#implementation_box p{
  font-size: 1.2em;
}

#implementation_box .ad{
  text-decoration: none;
}

#implementation_box a {
  color: blue;
  text-decoration:none;
}

#implementation_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#implementation_box .spacer{
  height:20px;
}

#implementation_box #tiny{
  font-size: 1.1em;
}

#implementation_box #azure {
  color:azure;
}

#implementation_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#implementation_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#implementation_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


#myScrollspy17  {
  top: 30vh !important; 
  color: white;
  overflow: auto;
  position: sticky;
  z-index:1000;
  float:left;
  width:auto;
  margin-left:15px;
}


#myScrollspy17 .nav-item{
  text-align: left;
  display:flex;
  justify-content:center;
  width:auto;
}

#myScrollspy17 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy17 .jump{
  background-color:white;
  font-size:15px;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy17 .nav-link { 

  color: rgb(0, 0, 0); 
  height:auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
  width:200px;
}


#myScrollspy17 ul.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff !important;
  background-color: #005151 !important; 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
  width:200px;
}

@media screen and (max-device-width:1200px){
  #myScrollspy17 .nav-pills{
    display:none;
  }
  #myScrollspy17{
    float:none;
    position:absolute;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy17{
    left:0;
    margin:0;
  }
}


@media screen and (max-width: 810px) {
  #imply1, #imply2, #imply3  {
      margin-left: 150px;
  }
}



/* %%%%%%%%%%%%%%%%%%%%%%%%%%%%% 


█▀▀ █▄░█ █▀▀ █ █▄░█ █▀▀ █▀▀ █▀█ █ █▄░█ █▀▀
██▄ █░▀█ █▄█ █ █░▀█ ██▄ ██▄ █▀▄ █ █░▀█ █▄█


%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */

#body_engineering{
  overflow: auto;
  position: absolute;
  top:0;
  left:0;
  height:auto;
}


#eng_section{
  background-color: #ffffff;
  width: 100%;
  justify-self: center;
  align-self: center !important;
  width: auto;
  left: -60px;
  overflow: auto;

}



#eng_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#eng_box h2{
  color:#222
}

#eng_box p{
color:#444;
}

#eng_box h1 {
  font-size: 3em;
  margin: 0px;
}

#eng_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#eng_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#eng_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#eng_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#eng_box .test{
  display:inline-block;

  padding:20px 15px;
}

#eng_box section {
  clear: both;
}

#eng_box .title {
  margin-top: 15px;
  width: 300px;
}

#eng_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#eng_box .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#eng_box .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#eng_box .innerContainer {
  padding: 30px 60px;

}

#eng_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #eng_box .innerContainer {
    width: 95vw;
  }

  #eng_box .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #eng_box .allcontent {
    width: 100vw;
  }
  #eng_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #eng_box .innerContainer {
    padding: 10px;
  }
  #eng_box h1 {
    font-size: 1.3em;
  }
  #eng_box h2 {
    font-size: 1.1em;
  }
  #eng_box p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #eng_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #eng_box p{
    font-size: 1em;
  }
  #eng_box .innerContainer {
    padding: 10px;
  }
  #eng_box h1 {
    font-size: 1.3em;
  }
  #eng_box h2 {
    font-size: 1.1em;
  }
}

#eng_box p{
  font-size: 1.2em;
}

#eng_box .ad{
  text-decoration: none;
}

#eng_box a {
  color: blue;
  text-decoration:none;
}

#eng_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#eng_box .spacer{
  height:20px;
}

#eng_box #tiny{
  font-size: 1.1em;
}

#eng_box #azure {
  color:azure;
}

#eng_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#eng_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#eng_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}





.container_eng {
  min-height: auto;
  padding: 10px 0;
  display: flex;
  align-items: center;
  justify-content: center
}

.card_eng {
  width: 280px;
  height: 520px;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
  background: #fff;
  transition: all 0.5s ease;
  cursor: pointer;
  user-select: none;
  z-index: 10;
  overflow: hidden
}

.card_eng .backgroundEffect {
  bottom: 0;
  height: 0px;
  width: 100%
}

.card_eng:hover {
  color: #fff;
  transform: scale(1.025);
  box-shadow: rgba(0, 0, 0, 0.24) 0px 5px 10px

}

.card_eng:hover .backgroundEffect {
  bottom: 0;
  height: 320px;
  width: 100%;
  position: absolute;
  z-index: -1;
  background-color: #005151;
  animation: popBackground 0.2s ease-in;
}

@keyframes popBackground {
  0% {
      height: 20px;
      border-top-left-radius: 50%;
      border-top-right-radius: 50%
  }

  50% {
      height: 80px;
      border-top-left-radius: 75%;
      border-top-right-radius: 75%
  }

  75% {
      height: 160px;
      border-top-left-radius: 85%;
      border-top-right-radius: 85%
  }

  100% {
      height: 320px;
      border-top-left-radius: 100%;
      border-top-right-radius: 100%
  }
}

.card_eng .pic_eng {
  position: relative
}

.card_eng .pic_eng img {
  width: 100%;
  height: 280px;
  object-fit: cover
}

.card_eng .text-muted {
  font-size: 12px
}

.card_eng:hover .text-muted {
  color: #fff !important;
  transition: 1s;
}
.card_eng:hover .titeng {
  color: #fff !important;
  transition: 1s;
}

.card_eng .content_eng {
  padding: 0 20px
}

.card_eng .content_eng .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px 10px;
  background-color: #1b9ce3;
  border-radius: 25px;
  font-size: 12px;
  border: none
}

.card_eng:hover .content_eng .btn {
  background: #fff;
  color: #1b9ce3;
  box-shadow: #0000001a 0px 3px 5px
}

.card_eng .content_eng .btn .fas {
  font-size: 10px;
  padding-left: 5px
}

.card_eng .content_eng .foot .admin {
  color: #1b9ce3;
  font-size: 12px
}

.card_eng:hover .content_eng .foot .admin {
  color: #fff
}

.card_eng .content_eng .foot .icon {
  font-size: 12px
}



#engineering_section{
  display: flex;
  justify-content: center;
  align-items: center;
  width:80vw;
  margin:auto;
}

#engineering_box{
  background-color: #ffffff;
  width: 100%;
}


#engineering_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#engineering_box h2{
  color:#222
}

#engineering_box p{
color:#444;
}

#engineering_box h1 {
  font-size: 3em;
  margin: 0px;
}

#engineering_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#engineering_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#engineering_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#engineering_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#engineering_box .test{
  display:inline-block;
  padding:20px 15px;
}

#engineering_box section {
  clear: both;
}

#engineering_box .title {
  margin-top: 15px;
  width: 300px;
}

#engineering_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#engineering_box .allcontent {
  
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#engineering_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#engineering_box .innerContainer {
  padding: 30px 60px;

}

#engineering_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #engineering_box .innerContainer {
    width: 95vw;
  }

  #engineering_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #engineering_box .allcontent {
    width: 100vw;
  }
  #engineering_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #engineering_box .innerContainer {
    padding: 10px;
  }
  #engineering_box h1 {
    font-size: 1.3em;
  }
  #engineering_box h2 {
    font-size: 1.1em;
  }
  #engineering_box p{
    font-size: 1em;
  }
}

@media screen and (max-width:676px) {
  #engineering_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #engineering_box p{
    font-size: 1em;
  }
  #engineering_box .innerContainer {
    padding: 0;
  }
  #engineering_box h1 {
    font-size: 1.3em;
  }
  #engineering_box h2 {
    font-size: 1.1em;
  }
}

#engineering_box p{
  font-size: 1.2em;
}

#engineering_box .ad{
  text-decoration: none;
}

#engineering_box a {
  color: blue;
  text-decoration:none;
}

#engineering_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#engineering_box .spacer{
  height:20px;
}

#engineering_box #tiny{
  font-size: 1.1em;
}

#engineering_box #azure {
  color:azure;
}

#engineering_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#engineering_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#engineering_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


#myScrollspy18  {
  top: 30vh !important; 
  color: white;
  overflow: auto;
  position: sticky;
  z-index:1000;
  float:left;
  width:auto;
}


#myScrollspy18 .nav-item{
  text-align: left;
  display:flex;
  justify-content:center;
  width:auto;
}

#myScrollspy18 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy18 .jump{
  background-color:white;
  font-size:15px;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy18 .nav-link { 

  color: rgb(0, 0, 0); 
  height:auto;
  width:150px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
  
}


#myScrollspy18 ul.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff !important;
  background-color: #005151 !important; 
  height: auto;
  width:150px;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}

@media screen and (max-device-width:1200px){
  #myScrollspy18 .nav-pills{
    display:none;
  }
  #myScrollspy18{
    float:none;
    position:absolute;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy18{
    left:0;
    margin:0;
  }
}


@media screen and (max-width: 810px) {
  #engy1, #engy2, #engy3, #engy4, #engy5, #engy6{
      margin-left: 150px;
  }
}

#engy1, #engy2, #engy3, #engy4, #engy5, #engy6 {
  scroll-margin-top:100px;
}



/* %%%%%%%%%%%%%%%%%%%%%%%%%%%


█▀▀ ▀▄▀ █▀█ █▀▀ █▀█ █ █▀▄▀█ █▀▀ █▄░█ ▀█▀
██▄ █░█ █▀▀ ██▄ █▀▄ █ █░▀░█ ██▄ █░▀█ ░█░

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/



/* SIDEBAR BABY  */
#body_experiments{
  overflow: auto;
  position: relative;
  height:auto;
  z-index:100;
}

#expy1, #expy2, #expy3, #expy4, #expy5, #expy5,#expy6,#expy7,#expy8, #expy9{
  scroll-margin-top: 200px;
}

/* this is the nav and rest */


#myScrollspy19  {
  top: 15vh !important; 
  color: white;
  overflow: auto;
  position: sticky;
  z-index:1000;
  float: left !important;
  margin-left: 25px;
  width: auto;
}

#myScrollspy19 .nav-item{
  text-align: left;
  display:flex;
  
  
}

#myScrollspy19 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy19 .jump{
  background-color:white;
  font-size:15px !important;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy19 .subli{
  width:170px;
}

#myScrollspy19 .mainli{
  width:220px;
  font-weight: bold;
}




#myScrollspy19 .nav-link { 

  color: rgb(0, 0, 0); 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}


#myScrollspy19 ul.nav-pills .mainli.active,
.nav-pills .show > .mainli {
  color: #fff !important;
  background-color: #005151 !important; 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}

#myScrollspy19 ul.nav-pills .subli.active,
.nav-pills .show > .subli {
  color: #fff !important;
  background-color: var(--lilac) !important; 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}



@media screen and (max-device-width:1375px){
  #myScrollspy19 .nav-pills{
    display:none;
  }
  #myScrollspy19{
    float:none;
    position:absolute;
  }
  #exp_section{
    left:0px !important;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy19{
    left:0;
    margin:0;
  }
}


#exp_section{
  background-color: #ffffff;
  width: 100%;
  justify-self: center;
  align-self: center !important;
  width: auto;
  left: -100px;
  overflow: auto;

}


#exp_section p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#exp_section h2{
  color:#222
}

#exp_section p{
color:#444;
}

#exp_section h1 {
  font-size: 3em;
  margin: 0px;
}

#exp_section h2 {
  font-size: 1.5em;
  margin: 0px;
}

#exp_section .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#exp_section .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#exp_section .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#exp_section .test{
  display:inline-block;

  padding:20px 15px;
}

#exp_section section {
  clear: both;
}

#exp_section .title {
  margin-top: 15px;
  width: 300px;
}

#exp_section .homeLink {
  margin: 0px;
  padding: 0px;
}

#exp_section .allcontent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#exp_section .articleContainer {
  margin-top: 20px;
  border-radius: 15px;
  width: 1000px;
  background: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#exp_section .innerContainer {
  padding: 30px 60px;

}

#exp_section .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #exp_section .innerContainer {
    width: 95vw;
  }

  #exp_section .articleContainer {
    width: auto !important;
  
  }
}

@media only screen and (max-device-width:676px) {
  #exp_section .allcontent {
    width: 100vw;
  }
  #exp_section .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #exp_section .innerContainer {
    padding: 10px;
  }
  #exp_section h1 {
    font-size: 1.3em;
  }
  #exp_section h2 {
    font-size: 1.1em;
  }
  #exp_section p{
    font-size: 1em;
  }
}

@media (max-width:676px) {
  #exp_section .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #exp_section p{
    font-size: 1em;
  }
  #exp_section .innerContainer {
    padding: 10px;
  }
  #exp_section h1 {
    font-size: 1.3em;
  }
  #exp_section h2 {
    font-size: 1.1em;
  }
}

#exp_section p{
  font-size: 1.2em;
}

#exp_section .ad{
  text-decoration: none;
}

#exp_section a {
  color: blue;
  text-decoration:none;
}

#exp_section img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#exp_section .spacer{
  height:20px;
}

#exp_section #tiny{
  font-size: 1.1em;
}

#exp_section #azure {
  color:azure;
}

#exp_section .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#exp_section .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#exp_section .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


/* rest boxes */




/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%


█▀█ ▄▀█ █▀█ ▀█▀   █▀▀ █▀█ █░░ █░░ █▀▀ █▀▀ ▀█▀ █ █▀█ █▄░█
█▀▀ █▀█ █▀▄ ░█░   █▄▄ █▄█ █▄▄ █▄▄ ██▄ █▄▄ ░█░ █ █▄█ █░▀█


%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/


#body_partcollection{
  overflow: auto;
  position: relative;
  
  height:1200vh;
}

#partcollection_section{
  width:80%;
  display: flex;
  justify-content: center;
  align-items: center;
}

#partcollection_box{
  background-color: #ffffff;
  width: 100%;
}


#partcollection_box p, h1, h2, h3 {
  padding-top: 10px;
  font-weight: 400;
}

#partcollection_box h2{
  color:#222
}

#partcollection_box p{
color:#444;
}

#partcollection_box h1 {
  font-size: 3em;
  margin: 0px;
}

#partcollection_box h2 {
  font-size: 1.5em;
  margin: 0px;
}

#partcollection_box .hdrBacking {
  width: 100vw;
  overflow-x: hidden;
  background: #FF4444;
  height: 180px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#partcollection_box .link-container2{
  width: 100%;
  max-width: 800px;
  display: flex;
  align-items: center;
  margin:0px auto;
  justify-content:center;
  background-color:#CC0000;
}

#partcollection_box .link-container{
  overflow: hidden;
  background-color:#CC0000;
}

#partcollection_box .test{
  display:inline-block;
  float: left;
  padding:20px 15px;
}

#partcollection_box section {
  clear: both;
}

#partcollection_box .title {
  margin-top: 15px;
  width: 300px;
}

#partcollection_box .homeLink {
  margin: 0px;
  padding: 0px;
}

#partcollection_box .allcontent {
  
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#partcollection_box .articleContainer {
  margin-top: 20px;
  width: 1000px;
  background: rgb(255, 255, 255);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  animation: slideUp 1s;
}

#partcollection_box .innerContainer {
  padding: 30px 60px;

}

#partcollection_box .date {
  color: gray;
  font-weight: 400px;
}

@media screen and (max-width:991px){
  #partcollection_box .innerContainer {
    width: 95vw;
  }

  #partcollection_box .articleContainer {
    width: auto !important;
  
  }
}


@media only screen and (max-device-width:676px) {
  #partcollection_box .allcontent {
    width: 100vw;
  }
  #partcollection_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #partcollection_box .innerContainer {
    padding: 10px;
  }
  #partcollection_box h1 {
    font-size: 1.3em;
  }
  #partcollection_box h2 {
    font-size: 1.1em;
  }
  #partcollection_box p{
    font-size: 1em;
  }
}

@media screen and (max-width:676px) {
  #partcollection_box .articleContainer {
    margin-top: 20px;
    width: 98vw;
    background: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  }
  #partcollection_box p{
    font-size: 1em;
  }
  #partcollection_box .innerContainer {
    padding: 0;
  }
  #partcollection_box h1 {
    font-size: 1.3em;
  }
  #partcollection_box h2 {
    font-size: 1.1em;
  }
}

#partcollection_box p{
  font-size: 1.2em;
}

#partcollection_box .ad{
  text-decoration: none;
}

#partcollection_box a {
  color: blue;
  text-decoration:none;
}

#partcollection_box img {
  max-width:100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

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

#partcollection_box .spacer{
  height:20px;
}

#partcollection_box #tiny{
  font-size: 1.1em;
}

#partcollection_box #azure {
  color:azure;
}

#partcollection_box .linecontainer {
  padding-bottom: 40px;
  padding-top:0px;
}

#partcollection_box .longline {
  border-bottom: 1px solid lightgray;
  width: 100%;
}

#partcollection_box .shortline {
  width: 50%;
  border-top: 1px solid gray;
  position: relative;
  top: -1px;
}


#myScrollspy21  {
  top: 30vh !important; 
  color: white;
  overflow: auto;
  position: sticky;
  z-index:1000;
  float:left;
  width:10%;
}


#myScrollspy21 .nav-item{
  text-align: left;
  display:flex;
  justify-content:center;
  width:auto;
}

#myScrollspy21 .nav-item h5{
  margin: 4% 0%;
  position: fixed;
}

#myScrollspy21 .jump{
  background-color:white;
  font-size:15px;
  font-family: 'Roboto-Bold' !important;
  
}

#myScrollspy21 .nav-link { 

  color: rgb(0, 0, 0); 
  height:auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
  width:130px;
}


#myScrollspy21 ul.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff !important;
  background-color: #005151 !important; 
  height: auto;
  max-width: 400px;
  padding: 2px 8px;
  display: inline-block;
  align-self: center;
  line-height: 22px;
  border: 1px solid;
  border-radius: 12px;
  text-align: center;
  align-self: center;
}

@media screen and (max-device-width:1200px){
  #myScrollspy21 .nav-pills{
    display:none;
  }
  #myScrollspy21{
    float:none;
    position:absolute;
  }

}

@media screen and (max-device-width:1430px){
  #myScrollspy21{
    left:0;
    margin:0;
  }
}


@media screen and (max-width: 810px) {
  #colparty1, #colparty2, #colparty3  {
      margin-left: 150px;
  }
}

#colparty1, #colparty2, #colparty3  {
  scroll-margin-top:100px;
}