* {margin: 0;padding: 0;}
.navbar {display: flex;align-items: center;justify-content: space-around;position: sticky;top: 0;font-family: sans-serif;}
.nav-list {width: 100%;display: flex;align-items: center;cursor: pointer;}
.nav-list li {list-style: none;padding: 27px 20px;margin: auto;}
.nav-list li a {text-decoration: none;color: #000000;font-size: 20px; transition: all 0.3s ease;padding: 5px; border-radius: 12px;}
.nav-list li a:hover {color: rgb(112, 40, 1);box-shadow: rgba(113, 2, 2, 0.447) 0px 5px 15px;}
.rightnav {text-align: right;padding: 0 23px;cursor: pointer;}
.logo {width: 20%;display: flex;justify-content: center;}
header{position: sticky;top: 0;}
.blg{margin-top: 20px;}
.logo img {width: 60px;height: 60px;border: 2px solid white;border-radius: 50%;}
.navbar .menu-btn i{color: #fff;font-size: 22px; cursor: pointer;display: none;}
#click{display: none;}
.picture{width: 50%;display: flex;align-items: center;}
.details{display: flex;align-items: center;justify-content: center;top: 0;font-family: sans-serif; width: 80%;margin: auto;margin-bottom: 40px;overflow: hidden;margin-bottom: 100px;}
.text{width: 50%;text-align: left;padding: 0 23px;font-size: 20px;text-align: justify;}
.picture img{width: 100%;border-radius: 40px;}
.blog{font-size: 27px;text-align: center;color: #000000d8;width: 90%;margin: auto;margin-bottom: 30px;}
.leon {background-color: #eee;color: #050000;cursor: pointer;padding: 18px;margin: 10px 0;width: 100%;border: none;text-align: center;outline: none;font-size: 17px;transition: 0.4s;height: auto;}
.leon:hover {background-color: white;border: 1px dashed deepskyblue;}
.try{width: 47%;}
.direct{text-align: center;font-size: 18px;margin: 13px 0px;color: #000000d8;}
.tryit{display: flex;justify-content: space-between;margin-bottom: 100px;}

.fe{font-size: 20px;margin: 50px 0px;}
.users{width: 90%;margin: auto;display: flex;justify-content: space-between;margin: auto;margin-bottom: 20px;}
.usersay{width: 20%;color: #050000;font-size: 20px;font-family: sans-serif;box-shadow: rgba(113, 2, 2, 0.619) 0px 5px 15px;padding: 20px;margin: 5px;border-radius: 20px;}
@media only screen and (max-width: 1083px) {.nav-list {flex-direction: column;text-align: center;padding: 1px;}
.rightnav {width: 20%;}
.fe p{font-size: 18px;width: 80%;margin: auto;}
.users{flex-direction: column-reverse;width: 100%;margin: auto;}
.usersay{width: 80%;margin: auto;margin-bottom: 15px;}
.tryit{flex-direction: column-reverse;}
.try{width: 90%;margin: auto;}
.blog{font-size: 24px;}
.picture {flex-direction: column;text-align: center;padding: 1px;width: 80%;}
.details {flex-direction: column;width: 100%;}
.text{width: 90%;}
.secon{flex-direction: column-reverse;}
.navbar{padding: 10px 0px;}
.buttons {padding: 15px;}

button {height: 40px;width: 90px;}
.btn {padding: 6px 10px;margin: 7px 3px;}
.nav-list{position: fixed;top: 80px;left: -100%;background: #f3efef;height: 100vh;display: block;text-align: center;transition: all 0.3s ease;}
#click:checked ~ ul{left: 0%;}
.navbar .menu-btn i{ display: flex; color: #6B0000; width: 20%;}}

.btn a {text-decoration: none;color: rgb(49, 206, 10);font-size: 15px;}
.background {background:#F2F2F2;background-size: cover;}
.box-main {display: flex;font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;justify-content: center;}
.firstsection {height: 90vh;background-image:url("../Img/new8.webp");background-position: center;background-repeat: no-repeat;background-size: cover;width: 100%;}
.text-big {font-size: 39px;text-align: center;margin: 10px; color: #1c0950;font-weight: 700;font-family: sans-serif;margin-top: 50px;}
.text-small {font-size: 25px;font-family: "Roboto Condensed", sans-serif;padding-left: 20px;padding-right: 20px;text-align: center;line-height: 1cm;}
.btn {padding: 8px 20px;margin: 10px 0px;border: 2px solid rgb(0, 2, 0);border-radius: 8px;color: #1c0950;cursor: pointer;font-size: 15px;box-shadow: rgba(2, 91, 113, 0.447) 0px 5px 15px;}
.buttons a{margin: 0px 8px}
.buttons {text-align: center;padding: 12px;align-items: center;margin-top: 30px;}
button {height: 50px;width: 115px;}
.btn-sm {border-color: black;}
.seanomos{justify-content: center;align-items: center;display: flex;font-size: 25px;}




.knowledg{
  text-align:center;
    font-family:'Roboto';
  font-weight:300;
  font-size:29px;
  width: 90%;
  margin: auto;
  overflow:hidden;

}

.knowledg div {
  display:inline-block;
  overflow:hidden;
  white-space:nowrap;
}
/* .knowledg div:first-of-type {
  animation: showup 7s infinite;
}

.knowledg div:last-of-type {
  width:0px;
  animation: reveal 7s infinite;
}

.knowledg div:last-of-type span {
  margin-left:-300px;
  animation: slidein 7s infinite;
} */

@keyframes showup {
    0% {opacity:0;}
    20% {opacity:1;}
    80% {opacity:1;}
    100% {opacity:0;}
}

@keyframes slidein {
    0% { margin-left:-800px; }
    20% { margin-left:-800px; }
    35% { margin-left:0px; }
    100% { margin-left:0px; }
}

@keyframes reveal {
    0% {opacity:0;width:0px;}
    20% {opacity:1;width:0px;}
    30% {width:300px;}
    80% {opacity:1;}
    100% {opacity:0;width:300px;}
}
.knowledg p {
  font-size:22px;
  width: 80%;
  margin: auto;
}
/* 5 */
.btn-5 {
  width: 130px;
  height: 40px;
  line-height: 42px;
  padding: 0;
  border: none;

background: linear-gradient(0deg, rgba(255,27,0,1) 0%, rgba(251,75,2,1) 100%);
text-decoration: none;
  font-size: 20px;
  color: white;
  margin-top: 10px;
}
.btn-5:hover {
 cursor: pointer;
  background: rgb(201, 0, 0);

}


.frame {
  width: 90%;
  margin: 40px auto;
  text-align: center;
  padding-bottom: 90px;
}