
/* ///////////////////////scroll-logo//////////////// */



.darkMenu .logoHistory .container{
    position:relative;
    display:inline-block;
    width: 100%;
    overflow: hidden;
    padding-top: 20px;
}

#holder img{
    position:absolute;
    /* margin-left: -15px; */
    transition: 0.5s all;
    /* left: 10px;
    top: 10px; */
    max-width: none;
}

.darkMenu .logoHistory .buttons{
    position: relative;

}

#lbtn, #rbtn{
    position: absolute;
    top: 101px;
    background-color: transparent;
    cursor: pointer;
    border:none;
    user-select: none;
    width:45px;
    height:45px;
    background-repeat: no-repeat;
    background-position: center center;
}

#lbtn{
   left: -75px;
   background-image: url(../img/left.png);
}

#rbtn{
    right: -75px;
    background-image: url(../img/right.png);
}

.div-left{
    position: absolute;
    background-color: rgba(47, 41, 231, 0.426);
    width: 140px;
    height: 100%;
    z-index: 1;
}



/* ///////////////////////Hamburger-Menu//////////////// */

.darkMenu .master-container
.master-container{
    display: none;
    z-index:2;
}

.menu{
    display: none;
    z-index: 2;
}

/* ///////////Video */

/* ///////////Arrow */

/* White main  */

.arrows1 {
	width: 60px;
	height: 72px;
}

.arrows1 path {
	stroke: white;
	fill: transparent;
	stroke-width: 1px;
	animation: arrow 2s infinite;
	-webkit-animation: arrow 2s infinite;
}

@keyframes arrow
{
0% {opacity:0}
40% {opacity:1}
80% {opacity:0}
100% {opacity:0}
}

@-webkit-keyframes arrow /*Safari and Chrome*/
{
0% {opacity:0}
40% {opacity:1}
80% {opacity:0}
100% {opacity:0}
}

.arrows1 path.a1,
.arrows2 path.a1
 {
	animation-delay:-1s;
	-webkit-animation-delay:-1s; /* Safari 和 Chrome */
}

.arrows1 path.a2,
.arrows2 path.a2 {
	animation-delay:-0.5s;
	-webkit-animation-delay:-0.5s; /* Safari 和 Chrome */
}

.arrows1 path.a3,
.arrows2 path.a3
 {
	animation-delay:0s;
	-webkit-animation-delay:0s; /* Safari 和 Chrome */
}

 /* arrow-blue */

 .arrows2 {
	width: 60px;
	height: 72px;
     margin:0 auto;
     display: block;
}

.arrows2 path {
	stroke:#0B274C;
	fill: transparent;
	stroke-width: 1px;
	animation: arrow 2s infinite;
	-webkit-animation: arrow 2s infinite;
}

@media (max-width: 1200px) {

    .map800{
      padding-left: 28px;
        padding-right: 28px;
    }
}

@media (max-width: 900px) {

    #rbtn{
        right: 5px;
    }

    #lbtn{
        left: 5px;
    }

    #rbtn, #lbtn{
        z-index: 2;
    }

    #holder{
        padding-left:50px;
        background: linear-gradient(270deg, rgba(11,39,76,1) 0%, rgba(225,195,221,0) 12%, rgba(72,167,89,0) 89%, rgba(11,39,76,1) 100%);
    }

    #holder_overlay{
        left:0px;
        position: absolute;
        background: linear-gradient(270deg, rgba(11,39,76,1) 0%, rgba(225,195,221,0) 15%, rgba(72,167,89,0) 85%, rgba(11,39,76,1) 100%);
        height:213px;
        width: 100%;
        z-index: 1;
    }

}

@media (max-width: 800px) {

    #headerFiller{
        display:none;
    }


  .menu {
    width: 100%;
    left: 0px;
    z-index: 10;
    text-align: center;
    position: absolute;
    top:130px;
      background: rgba(255,255,255,0.7);
  }

  .menu ul{
      padding:0px;
      margin:0px;
  }

.darkMenu .menu li,
.menu li  {
      padding-top:1em;
      padding-bottom:1em;
      text-decoration:none;
      list-style-type: none;
  }



  .menu li  a {
    padding-top:20px;
      padding-bottom:20px;
    text-decoration:none;
    color:#0B274C;
      width: 100%;
  }

    .darkMenu .menu li a{
        color: white;

    }

 .master-container {
    display: flex;
    width: 66px;
    height: 80px;
    justify-content: center;
     align-items: center;
  }

    .bar.change{
        padding-left:3px;
    }


  .burger-menu {
    cursor:pointer;
    border: 1px solid #0B274C;
    padding: 12px 12px 8px 12px;
    border-radius: 11px;
      width: 40px;
      height: 35px;
   }


    .darkMenu .burger-menu {
        border: 1px solid white;
    }



  .bar {

     transition:0.4s;

  }

  .darkMenu .bar-1 {

    width:5em;
    display: block;
    width: 40px;
    border-top: 6px solid white;
    padding-top:6px;
    cursor:pointer;
    transition:0.4s;
  }

  .bar-1 {
    width:5em;
    display: block;
    width: 40px;
    border-top: 6px solid #0B274C;
    padding-top:6px;
    cursor:pointer;
    transition:0.4s;

   }


  .darkMenu .bar-2 {
    width:5em;
    display: block;
    width: 40px;
    border-top: 6px solid white;
    padding-top:5px;
    display:fixed;
    transition:0.4s;
    }

    .bar-2 {
        width:5em;
        display: block;
        width: 40px;
        border-top: 6px solid #0B274C;
        padding-top:5px;
        display:fixed;
        transition:0.4s;
        }





    .darkMenu .bar-3 {

    width:5em;
    display: block;
    width: 40px;
    border-top: 6px solid white;
    padding-top:5px;
    transition:0.4s;

    }

    .bar-3 {

        width:5em;
        display: block;
        width: 40px;
        border-top: 6px solid #0B274C;
        padding-top:5px;
        transition:0.4s;

        }


  .change .bar-1 {

  -webkit-transform: rotate(-45deg) translate(-10px, 5px);
      transform: rotate(-45deg) translate(-9px, 8px);
  }

  .change .bar-2 {opacity:0;}

  .change .bar-3 {
      -webkit-transform: rotate(45deg) translate(-10px, 5px);
      transform: rotate(45deg) translate(-10px, -5px);
  }

/* -----------------end------------Style the navigation menu */
}

