@import url("https://fonts.googleapis.com/css2?family=Merriweather&family=Merriweather+Sans:wght@300&display=swap");

body {
      margin: 0;
  outline: none;
  font-family: "Merriweather Sans", sans-serif;
  padding: 0;
  margin: 0;
    /*background-color: #ff981e;*/
}

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


html {
scroll-behavior: smooth;
}

a {
	 text-decoration: none;
	 cursor: pointer;
}
nav ul li a {
     font-size: 18px;
}

#video-bg {
  position: relative;
  width: auto;
  min-width: 100%;
  height: auto;
  background: url("imgs/vid.mp4") no-repeat;
  background-size: cover;
}
video {
  display: block;
}
.video-container {
  width: 100%;
  height: 80vh;
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  z-index: -100;
}


.lynks {
    display: inline-block;
    border-radius: 4px;
    border: none;
    outline: none;
    color: white;
    text-align: center;
    font-size: 28px;
    padding: 10px;
    width: 200px;
    transition: all 0.5s;
    cursor: pointer;
    margin: 5px;
  }
  
  .lynks span {
    cursor: pointer;
    display: inline-block;
    position: relative;
    transition: 0.5s;
  }
  
  .lynks span:after {
    content: '??';
    position: absolute;
    opacity: 0;
    top: 0;
    right: -20px;
    transition: 0.5s;
  }
  
  .lynks:hover span {
    padding-right: 25px;
  }
  
  .lynks:hover span:after {
    opacity: 1;
    right: 0;
  }
.backlor {
/*background: linear-gradient(to bottom, rgba(0,109,204, 0.5), rgba(0,109,204, 0.5), rgba(0,109,204, 0.5), rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.95), rgb(0, 0, 0));*/
background-color: red;
}
.navbarr {
  width: 100%;
  background-color: rgba(0,0,0,0.8);
  position: absolute;
  z-index: 9999;
  height: 100vh;
  display: none;
  top: 0;
  /*overflow: hidden;*/
}

.navbarr1{
	  width: 75%;
	  height: 100%;
	  float: left;
	  background-color: rgb(117,147,47);
}

.navbarr2{
	  width: 25%;
	  height: 100%;
	  float: right;
}


.packer{
  /*display: inline-block;*/
}
.typos{
  overflow: hidden;
  border-right: .15em solid orange;
  white-space: nowrap;
  animation: typa 12s steps(50, end) forwards;
  /*font-size: 1.6rem;*/
  width: 0;
}
@keyframes typa {
  from { width: 0; }
  to { width: 100%; border-right: none; }
}





.npadda{
	  /*padding: 20px 30px;*/
	  text-decoration: none;
	  color: white;

}

.lipadda{
 width: 100%;
 padding-top: 15px;
 padding-bottom: 15px;
 padding-left: 30px;
 text-transform: uppercase;
 font-family: kanit;
 font-size: 14px;
 /*background-color: rgb(70,84,107); */
}

.lipadda:hover {
	  background-color: rgb(1,96,58);
}

.magtop2{
	  margin-top: 2px;
	  box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
}

.homm2 {
      background-color: rgb(250,167,50);
}



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

@keyframes bocoro {
          0%, 20%, 50%, 80%, 100% {
              transform: translateY(0);
          }
          40% {
              transform: translateY(-30px);
          }
          60% {
             transform: translateY(-15px);
          }
}

.bocs {
      -moz-animation: bocs 1s;
      -webkit-animation: bocs 1s;
      animation: bocs 1s;
      position: relative;
      /*animation-delay: 6s;*/
      /*animation-direction: alternate-reverse;*/
}

@keyframes bocs {
         from {right: 300px; opacity: 0;}
    to {right: 0px; opacity: 1;}
}

.bocs2 {
      -moz-animation: bocsa 1s;
      -webkit-animation: bocsa 1s;
      animation: bocsa 1s;
      position: relative;
      /*animation-delay: 6s;*/
      /*animation-direction: alternate-reverse;*/
}

@keyframes bocsa {
         from {bottom:  300px; opacity: 0; transition: opacity 10s ease, bottom 10s ease;}
    to {bottom: 0px; opacity: 1;}
}


.bocs3 {
      -moz-animation: bocsb 3s;
      -webkit-animation: bocsb 3s;
      animation: bocsb 3s;
      position: relative;
   }

@keyframes bocsb {
         from {top:  100px; opacity: 0; transition: opacity 10s ease, bottom 10s ease;}
    to {top: 0px; opacity: 1;}
}

.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);
          }
}


.boca {
	  -moz-animation: boca 1s infinite;
	  -webkit-animation: boca 1s infinite;
	  animation: boca 1s infinite;
	  animation-delay: 4s;
}

@keyframes boca {
          0%, 20%, 50%, 80%, 100% {
          	  transform: rotate(0);
          }
          40% {
          	  transform: rotate(-20deg);
          }
          60% {
          	 transform: rotate(20deg);
          }
}



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

@keyframes boca2 {
          0%, 20%, 50%, 80%, 100% {
              transform: rotate(0);
          }
          40% {
              transform: rotate(-20deg);
          }
          60% {
             transform: rotate(20deg);
          }
}






#loader {

    height: 100vh; 
    display: flex; 
    justify-content: center; 
    align-items: center;
	 /*  position: absolute;
	   left: 52%;
	   top: 50%;
	   z-index: 1;
	   width: 120px;
	   height: 120px;
	   margin: -76px 0 0 -76px;
	   border-radius: 50%;
	   border-top: 16px solid rgba(0, 0, 0, 0.4);
	   background-color: rgba(255, 255, 255, 0.9);
	   -webkit-animation: spin 2s linear infinite;
	   animation: spin 2s linear infinite;
*/
}

.lodd {
  width: 20px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: rgb(20,137,118);
  clip-path: inset(-220%);
  animation: lod 2s infinite linear;
}

@keyframes lod {
  0%  {box-shadow:0 0 0 0   rgba(20,137,118), 40px 0 rgba(200, 117, 37),-40px 0 rgba(200, 117, 37),0 40px rgba(200, 117, 37),0 -40px rgba(200, 117, 37); transform: rotate(0deg);}
  10% {box-shadow:0 0 0 0   rgba(20,137,118), 12px 0 rgba(200, 117, 37),-40px 0 rgba(200, 117, 37),0 40px rgba(200, 117, 37),0 -40px rgba(200, 117, 37)}
  20% {box-shadow:0 0 0 4px rgba(20,137,118), 0px  0 rgba(20,137,118),-40px 0 rgba(20,137,118),0 40px rgba(20,137,118),0 -40px rgba(20,137,118)}
  30% {box-shadow:0 0 0 4px rgba(20,137,118), 0px  0 rgba(20,137,118),-12px 0 rgba(20,137,118),0 40px rgba(20,137,118),0 -40px rgba(20,137,118)}
  40% {box-shadow:0 0 0 8px rgba(20,137,118), 0px  0 rgba(20,137,118),  0px 0 rgba(20,137,118),0 40px rgba(20,137,118),0 -40px rgba(20,137,118)}
  50% {box-shadow:0 0 0 8px rgba(20,137,118), 0px  0 rgba(20,137,118),  0px 0 rgba(20,137,118),0 12px rgba(20,137,118),0 -40px rgba(20,137,118)}
  60% {box-shadow:0 0 0 12px rgba(20,137,118), 0px  0 rgba(20,137,118),  0px 0 rgba(20,137,118),0  0px rgba(20,137,118),0 -40px rgba(20,137,118)}
  70% {box-shadow:0 0 0 12px rgba(20,137,118), 0px  0 rgba(20,137,118),  0px 0 rgba(20,137,118),0  0px rgba(20,137,118),0 -12px rgba(20,137,118)}
  80% {box-shadow:0 0 0 16px rgba(20,137,118), 0px  0 rgba(200, 117, 37),  0px 0 rgba(200, 117, 37),0  0px rgba(200, 117, 37),0  0px  rgba(200, 117, 37)}
  90%,
  100%{box-shadow:0 0 0 0   rgba(20,137,118), 40px 0 rgba(200, 117, 37),-40px 0 rgba(200, 117, 37),0 40px rgba(200, 117, 37),0 -40px rgba(200, 117, 37); transform: rotateZ(360deg);}
}

#try {
	/*display: none;*/
	margin-left: auto;
	margin-right: auto;
}

.startry {
	 /*background-color: rgb(24,70,121);*/
	 width: 100%;
	 margin-left: auto;
	 margin-right: auto;
	 /*padding-bottom: 10px;*/
}

.posfix {
	 width: 100%;
	 z-index: 9990;
	   position: fixed;
	   margin-left: auto;
	   margin-right: auto;
       /*background: linear-gradient(to bottom, rgba(0,0,0, 0.9), rgba(1,96,58, 0), rgba(1,96,58, 0), rgba(1,96,58, 0));*/
       /*background-color: rgba(1,96,58, 0.5);*/
       padding: 20px 10px;
}


.posfix.pun {
	top: 0;
	 z-index: 9990;
            background-color: rgba(0,0,0, 0.7);
	 /*width: 100%;*/
}

.mainlog.pun {
	width: 100px;
	transition: width 1s ease;
	}

.butcall.pun {
	   padding-top: 4px;
	   padding-bottom: 4px;
	   transition: padding 1s ease;
}

.butmail.pun {
	   padding-top: 4px;
	   padding-bottom: 4px;
	   transition: padding 1s ease;
}


header {
    width: 100%;
}

.header {
     /*background: linear-gradient(to bottom, rgba(0,109,204, 0.5), rgba(0,109,204, 0.5), rgba(0,109,204, 0.5), rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.95), rgb(0, 0, 0));*/
       background-repeat: no-repeat;
    background-size: cover;
    /*background-position: top;*/
    /*padding-top: 10px;*/
    /*padding-top: 40px;*/
    /*padding-bottom: 40px;*/
    margin-top: 0;
    height: 80vh;
}


.header2 {
      background-image: linear-gradient(to top, rgba(0,0,0, 0.5), rgba(0,0,0, 0.5)), url('imgs/hed.jpg');
     background-repeat: no-repeat;
     background-size: contain;
     background-position: center;
     width: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      height: 50vh;
      /*margin-top: 7px;*/
      /*color: white;*/
}

.header22 {
	  display: flex;
align-items: center;
justify-content: center;
padding: 10px;
}

h1.bert {
	 margin-top: 210px;
	 /*color: rgb(250,167,50);*/
}

.point {
      padding-left: 10px;
      padding-right: 10px;
      color: rgb(250,167,50);
      /*padding-top: 20px;*/
      clear: both;
      /*line-height: 24px;*/
}

.alincent {
  text-align: center;
}

.faqer {
   padding: 20px 10px;
   box-shadow: 0px 0px 10px rgba(0,0,0,0.3);
   width: 80%;
   margin: auto;
}

.faqersum {

   font-weight: 600;
   color: rgba(0,109,204);
   cursor: pointer;
}

.dcolor {
	  color: rgb(250,167,50);
}

.point1 {
      /*margin-top: -14px;*/
       padding-left: 10px;
      padding-right: 10px;
      /*color: rgb(250,167,50);*/
}

.point2 {
      padding-left: 10px;
      padding-right: 10px;
      margin-top: 40px;
      margin-bottom: 8px;
}

.point3 {
       padding-left: 10px;
      padding-right: 10px;
      font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

#svg {
	font-size: 50px;
  margin-bottom: 10px;
}

.bodd {
    font-weight: 600;
}

.jamb3 {
           padding-left: 10px;
      padding-right: 10px;;
}

.madu {
	  text-decoration: underline;
}

.wrapp {
    width: 100%;
}

table {
     width: 90%;
     font-size: 14px;
}
.tabu1 {
      width: 400px;
}

.tabu {
padding-left: 10px;
padding-right: 10px;
width: 100%;
display: block;
margin: auto;
}

th {
     border: 2px solid rgb(24,70,121);
}
th {
      background-color: rgb(24,70,121);
      color: white;
      padding-top: 10px;
      padding-bottom: 10px;
}
td {
     padding-top: 4px;
      padding-bottom: 4px;
}

th, td {
    text-align: left;
    padding-left: 7px;
    padding-right: 7px;
}



.tridiv {
	 width: 100%;
	 /*clear: both;*/
}

#trileft {
	  width: 0;
	  height: 0;
	  border-bottom: 70px solid white;
	  border-right: 70px solid transparent;
	  float: left;
	  /*position: relative;*/
}

#triright {
	  width: 0;
	  height: 0;
	  border-bottom: 70px solid white;
	  border-left: 70px solid transparent;
	  float: right;
	  /*position: relative;*/
}

.backmage1 {
	  background-image:  linear-gradient(to bottom, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7)),url(imgs/mc22.png);
	  background-repeat: no-repeat;
	  background-position: center;
	  background-size: contain;
}
.upward {
	 clear: both;
	 color: rgb(250,167,50);
	 font-weight: 800;
}




nav {
    /*background-color: rgb(33,102,162);*/
    /*padding-top: 6px;*/
    /*padding-bottom: 6px;*/
    padding-right: 20px;
    padding-left: 20px;
    margin-left: auto;
    margin-right: auto;
     margin-top: 0px;
     /*border-top: 0.1px solid rgb(0,109,204);*/
     /*border-bottom: 0.1px solid rgb(0,109,204);*/
    /*overflow: hidden;*/
}
.displayul {
	  display: none;
      text-align: center;
      width: 100%;
}

.aboutnav {
	 	position: absolute;
	    z-index: 4000;
		 /*padding: 10px 10px;*/
		 text-align: left;
		 text-transform: none;
		 font-size: 14px;
		 background-color: rgb(33,102,162);
		 display: none;
}

.butnav1{
		 width: 100px;
}

.butnav3{
		 width: 200px;
}

.aboutnav2 {
	 background-color: rgb(24,70,121);
	 font-family: kanit;
	 font-size: 13px;
	 display: none;
}

.padbot {
	 	  width: 100%;
	 	   padding: 10px 7px;
}

.padbot:hover {
	 	 background-color: rgb(24,70,121);
}


.padbot2 {
	  width: 100%;
	  padding: 10px 10px;
	  color: white;
}

.padbot2:hover{
	  background-color: rgb(25,44,74);
}

.caleft {
	  padding-left: 7px;
}

li.homm {
      /*border-bottom: 3px solid rgb(200, 117, 37);*/
  background-color: rgb(250,167,50);
      /*background-color: rgb(24,70,121);*/
       /*padding: 4px 20px;*/
}
li a.homma {
     /*color: rgb(200, 117, 37);*/
}

li a.homma.pun {
     /*color: rgb(200, 117, 37);*/
}


a.padda:hover {
background-color: rgb(1,96,58);
     border-top-right-radius: 10px;
      border-bottom-left-radius: 10px;
transition: background-color 0.5s ease;
}

.teamlib {
	   color: white;
    font-family: kanit;
    /*font-weight: 800;*/
    font-size: 20px;
    text-decoration: none;
    /*word-spacing: 14px;*/
}

.teamlib a{
	   color: white;
	  }

#fontcolor1 {
	   color: white;
}

#fontcolor1:hover {
	   color: rgb(25,44,74);
	   transition: color 1s ease;
}
#fontcolor2 {
	   color: white;
}

#fontcolor2:hover {
	   color: lightgreen;
	   transition: color 1s ease;
}
#fontcolor3 {
	   color: white;
}

#fontcolor3:hover {
	   color: silver;
	   transition: color 1s ease;
}
#fontcolor4 {
	   color: white;
}

#fontcolor4:hover {
	   color: purple;
	   transition: color 1s ease;
}

.conta {
	 margin-left: 2px;
}

.padda {
	  padding: 6px 12px;
}



#main {
      width: 100%;
     display: block;
     margin-left: auto;
     margin-right: auto;
       top: 0;
     margin-top: 0;
     margin-bottom: 10px;
     padding: 0;
     background: white;
     box-shadow: 0 0 30px rgba(0, 0, 0, 0.9);
     padding-bottom: 4px;
       /*border: 3px solid rgb(48, 76, 222);*/
         /*border-top: 3px solid rgb(48, 76, 222);*/
            /*border-bottom: 3px solid rgb(48, 76, 222);*/
      /*background: linear-gradient(to right, rgba(48, 76, 222, 0.5), white, white, rgba(48, 76, 222, 0.5));*/

}

.mainlog {
     width: 120px;
     display: block;
     margin-left: auto;
     margin-right: auto;
     transition: width 1s ease;
     margin-top: 0;
     /*margin-bottom: 0;*/
     /*top: 0;*/
     /*bottom: 0;*/
     /*padding: 0;*/
     cursor: pointer;
     /*float: left;*/
}

.ijmbmage {
	   width: 120px;
	   margin: auto;
	   display: block;
	   margin-top: 4px;
}

.ijmbmage2 {
	   width: 120px;
	   padding: 0px 10px;

}

.ijmbmage22 {
	   width: 100px;
	   /*padding: 0px 10px;*/
	   height: 100px;
	   margin: auto;
	   display: block;

}

.startbut {
	  word-spacing: 1px;
	 margin-left: auto;
	 margin-right: auto;
	 margin-top: 20px;
	 margin-bottom: 10px;
}

.butcal {
      /*width: 45%;*/
      padding: 10px 15px;
      /*text-align: center;*/
      clear: both;
      word-spacing: 14px;
      float: right;
      background-color: rgb(117,147,47);
      border-top-right-radius: 10px;
      border-bottom-left-radius: 10px;
}

.butcall {
	  /*width: 45%;*/
	  padding: 4px 8px;
	  text-align: center;
	  background-color: rgb(250,167,50);
	  color: white;
	  text-decoration: none;
	  font-family: quantico;
	  word-spacing: 0;
	   box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
	   transition: padding 1s ease, background-color 1s ease;
}

.butcall:hover {
	background-color: rgba(250,167,50,0.8);
}

.butmail {
	  /*width: 45%;*/
	   padding: 4px 8px;
	  text-align: center;
	  background-color: rgb(0,109,204);
	  color: white;
	  text-decoration: none;
	  font-family: quantico;
	  word-spacing: 0;
	   box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
	   transition: padding 1s ease, background-color 1s ease;
}

.butmail:hover {
	background-color: rgba(0,109,204,0.8);
}

#berty {
         float: right;
       margin-right: 0;
       margin-top: 1px;
       /*line-height: 4px;*/
       /*margin-top: 15px;*/
}

.teamlibinsta {
	   margin-right: 0;
}

#fontawee {
       margin-left: auto;
       margin-right: auto;
       display: block;
       text-align: center;
}


.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;*/
}



.temp {
        /*background-color: rgb(48, 76, 222)white;*/
        padding-top: 20px;
        margin-left: auto;
        margin-right: auto;
        padding-left: 10px;
        padding-right: 10px;
}

.posrel {
     position: relative;
     /*top: 500px;*/
}

.tempor {
        /*background-color: rgb(48, 76, 222)white;*/
        padding-top: 20px;
        margin-left: auto;
        margin-right: auto;
}

.start1 {
     padding-top: 0;
     padding-bottom: 3px;
      width: 100%;
      /*display: block;*/
      margin-left: auto;
      margin-right: auto;
}

.start11 {
     padding-top: 3px;
     padding-bottom: 0;
      width: 100%;
      /*background-color: red;*/
      /*display: block;*/
      margin-left: auto;
      margin-right: auto;
}


.temp2 {
    margin: 40px 4px;
       width: 100%;
      /*display: block;*/
      margin-left: auto;
      margin-right: auto;
  }

  .footemp4 {
    margin: 20px 4px;
       width: 100%;
      /*display: block;*/
      margin-left: auto;
      margin-right: auto;
      padding-top: 20px;
      padding-bottom: 20px;
      /*text-align: center;*/
  }

  .footemp {
    margin: 20px 4px;
       width: 100%;
      /*display: block;*/
      margin-left: auto;
      margin-right: auto;
      padding-top: 20px;
      padding-bottom: 20px;
      /*text-align: center;*/
  }

  footer a {
  	  font-size: 14px;
  }

   .backtemp {
    margin: 0 0;
    /*padding: 0 0;*/
       width: 100%;
      /*display: block;*/
      margin-left: auto;
      margin-right: auto;
      /*padding-top: 20px;*/
      /*padding-bottom: 20px;*/
      /*text-align: center;*/
  }
  .senta {
          text-align: center;
  }

  .bodbumm{
   padding: 50px 5px;
   background-image: linear-gradient(to right, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8)),url(imgs/lor.svg);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: center;
   /*background-attachment: fixed;*/
}

.bertmage {

   padding: 10px 10px;
   background-image: url(imgs/lorr6.svg);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: center;
   height: 300px;
   /*background-attachment: fixed;*/
}


 .footempt {
    margin: 20px 4px;
       width: 100%;
      /*display: block;*/
      margin-left: auto;
      margin-right: auto;
      padding-top: 20px;
      padding-bottom: 20px;
      /*text-align: center;*/
  }

   .backorder6 {
  	/*order: 1;*/
  }


  .textunder{
text-decoration: underline;
  }


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


.temp3 {
  margin: 14px 30px;
      width: 97%;
      /*display: block;*/
      margin-left: auto;
      margin-right: auto;
}

.svg0 {
padding: 30px 10px;
/*box-shadow: 0px 0px 30px rgba(0,0,0,0.5);*/

}

/*.svg0 {
     display: flex;
     justify-content: center;
     margin: auto;
     padding-right: 4px;
}
*/
.fourthban {
        /*display: grid;*/
        /*grid-gap: 5px;*/
        /*grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));*/
        padding: 60px 0px;
        /*margin-bottom: 10px;*/
        /*padding-bottom: 15px;*/
        /*padding-left: 4px;*/
        /*padding-right: 4px;*/
        /*opacity: 0;*/
        /*transition: opacity .2s .6s ease-in;*/
        margin-right: auto;
        margin-left: auto;
         /*background-image: linear-gradient(to bottom, rgb(250,167,50, 0.5), white, white, rgb(250,167,50, 0.5));*/
         background-position: center;
         background-repeat: no-repeat;
         background-size: contain;

}

#mag2 {
    margin: 2px 2px;
    margin-left: auto;
    margin-right: auto;



}

.widther{
     width: 90%;
     /*box-shadow: 0px 15px 15px 0px rgba(0, 0, 0, 0.5);*/
         padding: 50px 10px;
}

.widther p, h3{
text-align: center;
}

.widther2{
     width: 90%;
     display: block;
     margin: auto;
}

.widther3{
padding: 20px 10px;
}

.temp2img {
	  width: 100%; 
	  display: block;
	  margin: auto;
}

.temp2div {
	  width: 90%; 
	  display: block;
	  margin: auto;
       box-shadow: 0px 15px 15px 0px rgba(0, 0, 0, 0.5);
       padding: 40px;
       border-radius: 20px;
}

.ijmbe{
	  font-size: 15px;
	  /*font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;*/
	  line-height: 20px;
	  margin-top: 7px;
}

.stylar {
     list-style: none;
          font-family: quantico;
}

.fontquantico {
	  font-family: quantico;
	  padding-left: 20px;
      list-style-type: square;
}

.fontkanit {
	  font-family: kanit;
}

.magauto {
	display: block;
	margin: auto;
}

.fontsans {
	font-family: "Merriweather Sans", sans-serif;
}

.ijmbeh {
	  /*color: rgba(0,109,204);*/
}

.ijmbeh2 {
	 color: rgb(250,167,50);
}

.centerline {
	 text-align: center;
}

.fontor {
	  margin-top: 8px;
}

.paddo {
	padding-left: 10px;
	padding-right: 10px;
}

.tempmore {
	   padding: 10px;
	   color: rgba(0,0,0,0.8);
	   background-color: silver;
	   font-size: 15px;
	         border-top-right-radius: 10px;
      border-bottom-left-radius: 10px;
	   font-family: "Merriweather Sans", sans-serif;
}

.tempback {
	  background-color: rgb(1,96,58);
	  padding-top: 100px;
	  padding-bottom: 100px;
}

.tempback2 {
	  background-color: rgb(33,102,162);
	  padding-top: 50px;
	  padding-bottom: 50px;
}

.linahit{
	line-height: 24px;
}


.colorwyt2 {
	  color: white;
}
.colorwyt {
	  color: white;
            /*padding: 12px 15px;*/
            transition: background-color 0.5s ease;
}

.colorange {
	  /*color: rgb(250,167,50);*/
}

.fotlink {
     color: white;
     /*text-align: left;*/
     font-weight: 800;
     background-color: rgb(1,96,58);
     padding: 12px 10px;
}

.colorwyt:hover {
background-color: rgb(1,96,58);
     border-top-right-radius: 10px;
      border-bottom-left-radius: 10px;

}

.h1font {
	  line-height: 30px;
}

ol {
	  padding-left: 20px;
}

.pada {
	 padding-top: 30px;
	 padding-left: 10px;
	 padding-right: 10px;
	 text-align: center;
}

.startbut1 {
float: right;
width: 70%;
}

.startbut2 {
float: left;
width: 25%;
}

.margtop {
	 margin-top: 0px;
}


.margtopp {
	 margin-top: 8px;
}

.margbot {
	 margin-bottom: 8px;
}

.bertydif {
     position: relative;
         /*top: 400px;*/
         margin-top: -370px;
             padding-left: 10px;
     padding-right: 10px;
     width: 100%;
     /*background-color: rgba(255, 255, 255, 0.7);*/
}

.bertydif2 {
     /*position: relative;*/
         /*top: 400px;*/
         margin-top: -200px;
             padding-left: 10px;
     padding-right: 10px;
     width: 100%;
     /*background-color: rgba(255, 255, 255, 0.7);*/
}
.bertdifa{
     width: 95%;
     display: block;
     margin: auto;
     background: linear-gradient(to bottom, rgba(255,255,255, 0.5), rgba(255,255,255, 0.5), rgba(255,255,255, 0.8), rgb(255,255,255));
     padding-top: 20px;
     padding-bottom: 20px;
     border-top-left-radius: 20px;
     border-top-right-radius: 20px;
          background-color: rgba(255, 255, 255, 0.7);
}

.bertdifa2{
     width: 95%;
     display: block;
     margin: auto;
     padding-top: 20px;
     padding-bottom: 20px;
     border-top-left-radius: 20px;
     border-top-right-radius: 20px;
          background-color: rgba(255, 255, 255, 1.0);
}

.bertdifa p{
font-size: 20px;
padding: 50px 50px;
color: black;
font-weight: bolder;
}


.berty1 {
	 color: white;
	 text-align: center;
	 /*font-family: Pattaya;*/
     /*font-style: italic;*/
	 font-size: 40px;
     font-weight: bolder;
	 /*clear: both;*/
	 /*text-shadow: 0 0 30px rgb(0, 0, 0);*/
	 text-shadow: 3px 3px 3px black;

}
.berty2 {
	  text-align: center;
	  color: white;
	  font-size: 18px;
	  /*font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;*/
	   padding-left: 8px;
	 padding-right: 8px;
	 line-height: 24px;
	 /*text-shadow: 0 0 30px rgb(0, 0, 0);*/
	  text-shadow: 7px 7px 7px black;
}

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

}

#enroltop4 {
          /*background-image: url(images/nag.jpg);*/
           /*background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(images/nag.jpg);*/
          background-repeat: no-repeat;
          background-size: cover;
          background-position: center;
          /*background-attachment: fixed;*/
          /*background-color: rgba(0, 0, 0, 0.9);*/
          /*padding: 40px;*/
          /*padding-top: 70px;*/
          /*padding-bottom: 20px;*/
           /*animation: pop 2s;*/
           /*position: relative;*/
           /*margin-top: -70px;*/
           /*margin-bottom: 10px;*/
           margin-left: auto;
           margin-right: auto;
}
#enrolteam {
      margin: 20px 20px;
       margin-left: auto;
       margin-right: auto;
       /*background-color: red;*/

}

.magecent {
    display: block;
    margin: auto;
}
.hss {
text-align: center;
color: rgb(1,96,58);
}


.whiteback{
	  background-color: white;
	  border-radius: 4px;
	  font-family: kanit;
}

.fontpat{
	  font-family: pattaya;
}

.areg {
	  width: 100%;
	  /*background-color: rgb(137,199,100);*/
	  color: white;
	  text-decoration: none;
	  text-align: center;
	  padding-top: 20px;
	  padding-bottom: 20px;
	  font-size: 18px;
}

.areg2 {
	  width: 200px;
	  /*background-color: rgb(137,199,100);*/
	  color: white;
	  text-decoration: none;
	  text-align: center;
	  padding-top: 20px;
	  padding-bottom: 20px;
	  font-size: 18px;
	  margin: auto;
	 border-top-right-radius: 10px;
      border-bottom-left-radius: 10px;
	  padding-left: 10px;
	  padding-right: 10px;
}
.magar {
     display: block;
     margin: auto;
     /*background-color: darkred;*/
}
.pada1{
	  font-size: 15px;
	  font-family: sans-serif;
	  /*height: 80px;*/
}

.pada2 {
	   color: rgba(0,0,0,0.8);
	   font-family: kanit;
	   line-height: 20px;
}
#fontpad {
width: 100%;
}

#fontpad2 {
font-size: 30px;
text-align: center;
margin-left: 15px;
/*float: right;*/
color: red;
margin-top: 10px;
}

#fontpad3 {
	  color: white;
	  font-size: 30px;
	  /*display: none;*/
	  margin-top: 1px;
}

.navbarr3{
	/*background-color: red;*/
    float: right;
    margin-top: -13px;
}

.kolor1{
	color: rgb(117,147,47);
}

.kolor1 a{
    color: rgb(117,147,47);
}

.kolor2{
	color: rgb(0,109,204);
}


.kolor3{
	 color: rgb(137,199,100);
}

.backolor1 {
	background-color: rgb(117,147,47);
}

.backolor2 {
	background-color: rgb(0,109,204);
}

.backolor3 {
	background-color: rgb(137,199,100);
}


.backolor1:hover {
	background-color: darkgreen;
}
.tolor {
     color: rgb(1,96,58);
     text-align: left;
}

.tolor2 {
     color: rgb(1,96,58);
}
.backolor2:hover {
	background-color: rgba(0,109,204, 0.8);
}

.backolor3:hover {
	background-color: rgba(137,199,100, 0.8);
}

.backmager1 {
	  width: 100%;
	  height: 250px;
	  background: url('imgs/ar2.png');
	  /*background-color: red;*/
	  background-repeat: no-repeat;
	  background-size: contain;
	  background-position: center;
	  padding: 20px;
	  /*height: 200px;*/
}

.backmager2 {
	  width: 100%;
	  height: 250px;
	  background: url('imgs/io.svg');
	  /*background-color: red;*/
	  background-repeat: no-repeat;
	  background-size: contain;
	  background-position: center;
	  padding: 20px;
	  /*height: 200px;*/
}

.backmager3 {
	  width: 100%;
	  height: 250px;
	  background: url('imgs/po0.jpeg');
	  /*background-color: red;*/
	  background-repeat: no-repeat;
	  background-size: contain;
	  background-position: center;
	  padding: 20px;
	  /*height: 200px;*/
}


.backmager4 {
	  width: 100%;
	  height: 250px;
	  background: url('imgs/po9.png');
	  /*background-color: red;*/
	  background-repeat: no-repeat;
	  background-size: contain;
	  background-position: center;
	  padding: 20px;
	  /*height: 200px;*/
}



.backer1 {
	  display: flex;
	  justify-content: center;
	  align-items: center;
	  /*background-color: rgba(0,109,204);*/
	  width: 100%;
	  padding: 20px;
	  height: 250px;
	  color: rgb(1,96,58);
}


.backer2 {
	  display: flex;
	  justify-content: center;
	  align-items: center;
	  /*background-color: rgba(250,167,50);*/
	  width: 100%;
	  padding: 20px;
	  height: 250px;
	  color: rgb(1,96,58);
}

.backer1 h1, .backer2 h1, .backer3 h1, .backer4 h1 {

	  font-family: kanit;
	  font-size: 49px;
}

.backer1 a h2, .backer2 a h2, .backer3 a h2, .backer4 a h2 {

font-weight: bolder;
color: black;
/*font-family: "Merriweather", serif;*/
}

.backer1 a h2:hover, .backer2 a h2:hover, .backer3 a h2:hover, .backer4 a h2:hover {

	text-decoration: underline;
}

.backer3 {
	  display: flex;
	  justify-content: center;
	  align-items: center;
	  /*background-color: rgba(137,199,100);*/
	  width: 100%;
	  padding: 20px;
	  height: 250px;
	  color: rgb(1,96,58);
}

.backer4 {
	  display: flex;
	  justify-content: center;
	  align-items: center;
	  /*background-color: rgba(25,44,74);*/
	  width: 100%;
	  padding: 20px;
	  height: 250px;
	  color: rgb(1,96,58);
}




footer{
	      background-image: linear-gradient(to right, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),url(imgs/lorr2.png);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: bottom;
   /*background-attachment: fixed;*/
	   padding: 20px 10px;
	   padding-bottom: 10px;
}
.lastmage{
     width: 95%;
}
.footerdiv	{
	  background-color: rgb(1,96,58);
	  padding: 20px 10px;
}

.footdev {
       color: white;
       font-family: kanit;
       margin-left: 14px;
       line-height: 30px;
       margin-bottom: 7px;
        /*padding: 5px 10px;*/

}

.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;
}

.footliner {
        border-bottom: 1px solid rgb(250,167,50);
        width: 97%;
        margin-left: auto;
        margin-right: auto;
}

.caneight1 {
      margin-top: 14px;
      color: white;
       /*text-shadow: 4px 4px 4px black;*/
       line-height: 13px;
       font-size: 13px;
       font-family: kanit;
       text-align: center;
}


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


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


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


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

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

.scrolla.scroll4 {
  --num: 95;
}


.scrolla::after {
  content: counter(num);
}

.contactdif {

  text-align: center;
  padding: 20px;
}

.contactdif a{
  color: black;
}


#contactfont {

  font-size: 100px;
}

.colorgreen {

  color: green;
}

.colorblack {

  color: black;
}

.colordarkblue {

  color: darkblue;
}

.colorlightgreen {

   color: lightgreen;
}

.colorpurple {

  color: purple;
}

.colorlightblue {

   color: lightblue;
}
.magelastt {
      width: 120px;
      display: block;
      margin: auto;
}
.magelastt2 {
      width: 120px;
}