html,body{
  /*background:#000;*/
  margin:0;
}


body {
      margin: 0;
  outline: none;
  font-family: "Merriweather Sans", sans-serif;
  padding: 0;
  margin-left: auto;
  margin-right: auto;
    /*background: black;*/
  /*overflow: hidden;*/
}

* {
	padding: 0;
	margin: 0;
	box-sizing: border-box; 
}

.heder{
  min-height: 85vh;
    background-image: linear-gradient(to right, rgba(249, 200, 1, 0.9), rgba(249, 200, 1, 0.7), rgba(249, 200, 1, 0.5), rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)), url('imgs/q.png');
        /*background-image: linear-gradient(to bottom, rgba(0, 0, 0, 1), rgba(208, 158, 60, 0.8)), url('images/lol.jpeg');*/
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.heder2{
  min-height: 40vh;
    background-image: linear-gradient(to right, rgba(249, 200, 1, 0.9), rgba(249, 200, 1, 0.7), rgba(249, 200, 1, 0.5), rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)), url('imgs/foot4.jpg');
        /*background-image: linear-gradient(to bottom, rgba(0, 0, 0, 1), rgba(208, 158, 60, 0.8)), url('images/lol.jpeg');*/
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

nav {
   height: 120px;
   width: 100%;
   padding: 20px 7px;
   background: linear-gradient(to right, white, white, rgb(255, 255, 255), rgba(255, 255, 255, 0));
   display: flex;
   justify-content: center;
   align-items: center;
     margin-left: auto;
     margin-right: auto;
}
nav.puke {
  top: 0;
     position: fixed;
        z-index: 999;
         box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.3);
}
.navall {
  background-color: blue;
}
.aboutnav {
    position: absolute;
      z-index: 99;
     /*padding: 10px 10px;*/
     text-align: left;
     text-transform: none;
     font-size: 14px;
     background-color: white;
     display: none;
}
.aboutnav2 {
   /*background-color: rgba(250,167,50, 0.7);*/
   font-family: kanit;
   font-size: 13px;
   display: none;
}
.butnav1{
     width: 200px;
}
.butnav3{
     width: 200px;
}
.padbot {
      width: 100%;
       padding: 10px 10px;
}
.padbot2 {
    width: 100%;
    /*padding: 10px 10px;*/
    color: red;
}
.padda {
    /*padding: 6px 12px;*/
    cursor: pointer;
}
.npadda{
    /*padding: 6px 12px;*/
    cursor: pointer;
}
.magtop2{
    margin-top: 2px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
    color: black;
}

.logdif {
   width: 100%;
     /*float: right;*/
     /*background-color: red;*/
}
.navbaa{
    /*float: left;*/
    font-size: 30px;
    margin-left: 30px;
    color: black;
    cursor: pointer;
    /*margin-left: auto;*/
}
.navbaa:hover{
     color: grey;
}


.cancelbut {
   color: red;
   cursor: pointer;
   font-size: 30px;
}
.cancelbut:hover{
   color: darkred;

}
.logsize {
   width: 100px;
     float: left;
}
#diful {
     background-color: white;
   width: 100%;
   position: fixed;
  z-index: 9999;
  height: 100vh;
  display: none;
  top: 0;
}
.navdif1 {
   float: left;
   width: 45%;
   /*background-color: green;*/
   margin-top: 15px;
}
.navdif22 {
   width: 55%;
   background-color: rgb(127, 70, 27);
}

.navdif22 a:hover{
  text-decoration: none;
}
.navdif2 {
   float: right;
   width: 55%;
   background-color: rgb(127, 70, 27);
   margin-top: 7px;
}

.navdif2 a:hover{
  text-decoration: none;
}
.clickback a:hover{
  text-decoration: none;
}
.navul {
   display: none;
   justify-content: space-between;
    float: right;
    list-style: none;
    width: 80%;
    color: rgb(127, 70, 27);
    margin-top: 10px;
         /*background-color: green;*/
}
.navul a{
   color: black;
   font-weight: 600;
   text-transform: uppercase;

}

.navul li a{
     text-decoration: none;
}

.navul li a:hover{
     color: grey;
}

/*
.navul2 {

}*/
.navul3{
   padding-left: 10px;
}
.ulmob li a{
   list-style: none;
   color: white;
   padding: 10px 20px;
   background-color: rgb(127, 70, 27);
   line-height: 50px;
   width: 95%;
   text-decoration: none;
}
.ulmob li a:hover{
  opacity: 0.5;
}


.abotin {
   display: flex;
   align-items: center;
   justify-content: center;
}

.abotin2 {
   display: none;
   align-items: center;
   justify-content: center;
}

.divdif {
  min-height: 70vh;
   padding-left: 40px;
   /*padding-top: 40px;*/
   display: flex;
   align-items: center;
}

.alfy{
    min-height: 20vh;
   padding-left: 40px;
   /*padding-top: 40px;*/
   display: flex;
   align-items: center;
}
.alfy2{
float: right;
padding: 0px 10px;
 padding-right: 40px;
 margin-top: 20px;
}
.banox {
  animation-timing-function: linear;
   animation: lat 3s;
   animation-delay: 0s;
   position: relative;

}

@keyframes lat {
    from {right: 100px; opacity: 0;}
    to {right: 0px; opacity: 1;}
}

.banox2 {
  animation-timing-function: linear;
   animation: lat2 3s;
   animation-delay: 0s;
   position: relative;

}

@keyframes lat2 {
    from {left: 100px; opacity: 0;}
    to {left: 0px; opacity: 1;}
}


.divdifh1 {
   color: rgb(127, 70, 27);
}
.allbut button{
    padding: 20px 15px;
    background-color: white;
    color: rgb(127, 70, 27);
    box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.5);
    transition: box-shadow 1s ease;
    outline: none;
    border: none;
    font-weight: 600;
}
.allbut button:hover{
      box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0);
}

.butwit button{
    width: 150px;
    display: block;
    margin: auto;
}

.clickback {
   width: 98%;
    background-color: rgb(127, 70, 27);
}

.boc {
    -moz-animation: boc 3s infinite;
    -webkit-animation: boc 3s infinite;
    animation: boc 3s infinite;
    animation-delay: 4s;
}

@keyframes boc {
          0%, 20%, 50%, 80%, 100% {
              transform: translateX(0);
          }
          40% {
              transform: translateX(10px);
          }
          60% {
             transform: translateX(5px);
          }
}
.difone{
   width: 80%;
   height: 600px;
   display: block;
   margin: auto;
   /*margin-top: -100px;*/
   /*z-index: 9;*/
   background-color: white;
}
.difcircle{
   height: 170px;
  width: 170px;
  background-color: rgb(249, 200, 1);
  border-radius: 50%;
      box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.3);
      display: block;
      margin: auto;
      margin-top: -120px;
}
#start {
        /*display: grid;*/
        /*grid-gap: 20px;*/
        /*grid-template-columns: repeat(auto-fill, minmax(480px, 1fr));*/
        /*background-color: rgb(48, 76, 222)white;*/
        padding-top: 20px;
        margin-left: auto;
        margin-right: auto;
        /*padding-bottom: 40px;*/
        /*line-height: 20px;*/
        /*margin-top: 20px;*/
      /*margin-top: 2px;*/
}
#start1 {
    margin: 7px 30px;
      margin-left: auto;
      margin-right: auto;

}

.svg0 {
     display: flex;
     justify-content: center;
     margin: auto;
     padding-right: 4px;
}

.svg1 {
      width: 10%;
      display: flex;
      align-items: center;
      justify-content: center;
}
.svg2 {
      width: 90%;
      padding-left: 4px;
      padding-right: 10px;
      font-family: kanit;
      line-height: 17px;
      color: rgb(127, 70, 27);
}
.svgaa a{
  color: black;
  text-decoration: underline;
}

.svgaa a:hover{
  color: grey;
}

.fontor {
 /*font-family: quantico;*/
      color: rgb(127, 70, 27);
      text-transform: uppercase;
}

#svg {
      color: rgb(200, 117, 37);
      padding-right: 10px;
      font-size: 30px;
}
.laterban2one {
  height: 400px;
background-image: url(imgs/1.jpg);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
.laterban2two {
  height: 400px;
background-image: url(imgs/2.jpg);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
.laterban2three {
  height: 400px;
background-image: url(imgs/3.jpg);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
.laterban2four {
  height: 400px;
background-image: url(imgs/log1.jpg);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
/*padding: 30px 210px;*/
}
.laterban2fiv {
  height: 400px;
background-image: url(imgs/lif3.jpg);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
/*padding: 30px 210px;*/
}
.laterban2sixx {
  height: 400px;
background-image: url(imgs/now1.png);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
/*padding: 30px 210px;*/
}

.laterban2sixx1 {
  height: 400px;
background-image: url(imgs/now3.png);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
/*padding: 30px 210px;*/
}

.laterban2sixx2 {
  height: 400px;
background-image: url(imgs/lor3.png);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
/*padding: 30px 210px;*/
}

.laterban2sixx3 {
  height: 400px;
background-image: url(imgs/lif.jpg);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
/*padding: 30px 210px;*/
}
.laterban2sixx4 {
  height: 400px;
background-image: url(imgs/real1.jpg);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
/*padding: 30px 210px;*/
}
.laterban2sixx5 {
  height: 400px;
background-image: url(imgs/now4.jpg);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
/*padding: 30px 210px;*/
}

.automove {
   display: block;
   margin: auto;
}
.automove button{
   display: block;
   margin: auto;
}

.difsche{
  text-align: center;
  padding: 20px 10px;
}
.scheh1 {
   /*text-transform: uppercase;*/
   color: rgba(0, 0, 0, 0.8);
}
.scheh5 {
   text-transform: uppercase;
}



@property --num {
  syntax: "<integer>";
  initial-value: 0;
  inherits: false;
}


.scrolla {
    transition: --num 5s;
  counter-set: num var(--num); 
}


.scrolla.scroll1 {
  --num: 20;
}


.scrolla.scroll2 {
  --num: 5;
}

.scrolla.scroll3 {
  --num: 90;
}

.scrolla::after {
  content: counter(num);
}
/*.numcount{
  font-family: quantico;
}*/

.temp {
        /*padding-top: 90px;*/
         /*margin-top: -90px;*/
        margin-left: auto;
        margin-right: auto;
        padding-left: 10px;
        padding-right: 10px;
}
.temp3 {
  margin: 14px 30px;
      width: 97%;
      /*display: block;*/
      margin-left: auto;
      margin-right: auto;
}
.whiteback{
   text-align: center;
   color: rgb(249, 200, 1);
   font-weight: 600;
    font-family: quantico;
}
#icam1{
   font-size: 50px;
}

.whiteback a{
  color: black;
}
.whiteback a:hover{
  color: black;
}
.bodbum{
   padding: 50px 10px;
}

.bodbum2{
   padding: 50px 5px;
   background-image: url(imgs/lor.png);
   background-repeat: no-repeat;
   background-size: 200px;
   background-position: right bottom;
   /*background-attachment: fixed;*/
   /*height: 300px;*/
}

.bodbum3{
   padding: 50px 5px;
   background-image: url(imgs/lor2.svg);
   background-repeat: no-repeat;
   background-size: 300px;
   background-position: left bottom;
   /*background-attachment: fixed;*/
   /*height: 300px;*/
}
.bodbum4{
   padding: 50px 5px;
   background-image: linear-gradient(to right, rgba(249, 200, 1, 0.5), rgba(249, 200, 1, 0.5)),url(imgs/lor5.jpg);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: right bottom;
   background-attachment: fixed;
   height: 500px;
}
.bodbum5{
   padding: 50px 5px;
   background-image: linear-gradient(to right, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5)),url(imgs/foot.jpg);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: bottom;
   /*background-attachment: fixed;*/
   height: 200px;
}
.bodbum6{
   padding: 0px 5px;
   background-image: linear-gradient(to right, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.2)),url(imgs/lif2.jpg);
   background-repeat: no-repeat;
   background-size: 200px;
   background-position: right bottom;
   /*background-attachment: fixed;*/
   /*height: 300px;*/
}
.bodbum7{
   padding: 0px 5px;
   background-image: linear-gradient(to right, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.2)),url(imgs/now2.png);
   background-repeat: no-repeat;
   background-size: 200px;
   background-position: right bottom;
   /*background-attachment: fixed;*/
   /*height: 300px;*/
}
.dif1 h3 {
  color: rgb(249, 200, 1);
  margin-top: 10px;
  margin-bottom: 10px;
  line-height: 25px;
}
.ulsty {
    list-style: none;
    line-height: 25px;
}
#laterban2font {
          color: rgb(249, 200, 1);
          font-size: 20px;
          margin-right: 15px;
}
.paddo {
   padding: 0px 10px;
}
#enrolteam {
      margin: 20px 20px;
       margin-left: auto;
       margin-right: auto;

}

.enrolteam2 {
            width: 94%;
            height: 100%;
            padding: 10px;
            border-radius: 10px;
            display: block;
            margin-left: auto;
            margin-right: auto;
             /*padding-bottom: 70px;*/

}
.aligner{
  text-align: center;
}
.backlage1 {
  height: 300px;
background-image: url(imgs/now1.png);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
.backlage2 {
  height: 300px;
background-image: url(imgs/lor3.png);
background-position: center;
background-size: cover;
background-repeat: no-repeat;
}
.backlage3 {
  height: 300px;
background-image: url(imgs/now3.png);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
.backlage4 {
  height: 300px;
background-image: url(imgs/now4.jpg);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
.backlage11 {
  height: 300px;
background-image: url(imgs/do1.png);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
.backlage21 {
  height: 300px;
background-image: url(imgs/do2.png);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
.backlage31 {
  height: 300px;
background-image: url(imgs/do5.png);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
.backlage41 {
  height: 300px;
background-image: url(imgs/do4.png);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}


.backshad {
  padding: 40px 10px;
           box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
           text-align: center;
}

.backshad2 {
  padding: 40px 40px;
           box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
}
.aligncen{
  text-align: center;
}

.footapp{
    text-decoration: none;
    list-style: none;
}
.footapp a{
color: black;
}
.footapp a:hover{
color: grey;
}

.footemper a{
  color: black;
}
.footemper a:hover{
color: grey;
}

.footdev {
       color: white;
       font-family: kanit;
       /*margin-left: 20px;*/
       line-height: 30px;
}
.theofoot {
        text-decoration: none;
        background-color: rgba(48, 76, 222);
        padding: 5px 10px;
        color: white;
        transition: color 1s ease, background-color 1s ease;
}

.theofoot:hover {
  color: rgba(48, 76, 222);
         background-color: white;
}

.theofooths2 {
  display: none;
}
.blackah {
   background-color: rgb(127,70,27);
   padding: 20px 10px;
   padding-bottom: 1px;
   /*position: relative;*/
}
.caneight1 {
      color: white;
      text-align: center;

}
.coloorc {
   color: rgb(249, 200, 1);
}
.caneight1 a{
   color: rgb(249, 200, 1);
}
.caneight1 a:hover{
   color: grey;
}
.clera{
  clear: both;
}
.widtha{
  width: 100%;
}
.widtha2{
  width: 80%;
}
.widtha3{
  width: 100%;
  display: block;
  margin: auto;
}
.hss2 a{
      text-decoration: underline;
      color: rgb(127,70,27);
}
.hss2 a:hover{
      color: grey;
}
.hss24 a{
      /*text-decoration: underline;*/
      color: rgb(127,70,27);
}
.hss24 a:hover{
      color: grey;
}
.haya{
   color: rgb(127,70,27);
}
.abtimg {
   width: 150px;
}
.abtimg2 {
   width: 100px;
}


#canfive {
    padding: 10px;
    padding-bottom: 0px;
    margin-left: auto;
    margin-right: auto;

}

#canfive2 {
    /*display: block;*/
    margin: 4px 7px;
    margin-left: auto;
    margin-right: auto;
}

#canfive4 {
    /*display: block;*/
    margin: 4px 7px;
    margin-left: auto;
    margin-right: auto;
}
.widman{
  width: 80%;
  display: block;
  margin: auto;
}
.backol{
  background-color: rgb(249, 200, 1);
}

.bron{
  color: rgb(127,70,27);
}
.cansix1 {
  text-transform: uppercase;
  margin-top: 40px;
}
.margdon {
   margin-bottom: 50px;
}
.svgso {
    width: 30px;
}