*{
   margin:0px;
   padding:0px;
}
body{
  background-color: #016855;
}
.main{
  background-color: #016855;
}
html,
body {
    height: 100%;
    font-family: 'Poppins', sans-serif !important;
    -webkit-font-smoothing: antialiased;
    /* background: #0088cce6; */
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Poppins', sans-serif !important;
    margin: 0;
    color: #111111;
    font-weight: 400;
    font-weight: 800 !important;
}

h1 {
    font-size: 70px;
}

h2 {
    font-size: 36px;
}

h3 {
    font-size: 30px;
}

h4 {
    font-size: 24px;
    padding-top:10px;
}

h5 {
    font-size: 18px;
}

h6 {
    font-size: 16px;
}

img {
    max-width: 100%;
}

input:focus,
select:focus,
button:focus,
textarea:focus {
    outline: none;
}

a:hover,
a:focus {
    text-decoration: none;
    outline: none;
    color: #ffffff;
}

ul,
ol {
    padding: 0;
    margin: 0;
}

/*---------------------
  Helper CSS
-----------------------*/

.section-title {
    margin-bottom: 20px;
margin-left: 134px;
}

.section-title h4,
.section-title h5 {
    color: #ffffff;
    font-weight: 600;
    text-transform: uppercase;
    padding-left: 20px;
    position: relative;
}

.section-title h4:after,
.section-title h5:after {
    position: absolute;
    left: 0;
    top: -6px;
    height: 32px;
    width: 4px;
    background: #e53637;
    content: "";
}

.text-white h1,
.text-white h2,
.text-white h3,
.text-white h4,
.text-white h5,
.text-white h6,
.text-white p,
.text-white span,
.text-white li,
.text-white a {
    color: #fff;
}



/* buttons */

.primary-btn {
    display: inline-block;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    color: #ffffff;
    letter-spacing: 2px;
}


.float{
	position:fixed;
	width:60px;
	height:60px;
	bottom:40px;
	right:40px;
	background-color:#25d366;
	color:#FFF;
	border-radius:50px;
	text-align:center;
  font-size:30px;
	box-shadow: 2px 2px 3px #999;
  z-index:100;
}

.my-float{
	margin-top:16px;
}

.primary-btn span {
    font-size: 18px;
    margin-left: 5px;
    position: relative;
    top: 3px;
}

.site-btn {
    font-size: 15px;
    color: #fff;
    background: #167abf;
    border-radius: 5px;
    border: 1px solid #fff;
    text-transform: uppercase;
    padding: 15px 30px;
    margin: 0 auto;
    display: block;
    transition: 0.9s;
    width: 100%;
    font-weight: 900;
}

.all-providers{
    margin-bottom: 40px;
}
.all-providers .col-6{
    padding: 0 4px;
}
.all-providers img {
    box-shadow: inset 0 0 4px 0 #1f407f;
    height: 100px;
    object-fit: contain;
    padding: 15px;
    margin-bottom: 10px;
    width: 100% !important;
}
.all-providers img:hover{
    box-shadow: inset 0px 0px 4px 0px #0097ff;
}
.content-text{
    background: #222121;
}
.content-text h1{
    color: #167abf;
    font-weight: 900;
    font-size: 6vh;
}
.content-text p{
    color: #fff;
    font-size: 16px;
    text-align: justify;
}
.content-text li{
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    text-align: center;
    list-style: none;
}
.spacial-controls {
    position: fixed;
    width: 111px;
    height: 91px;
    top: 0;
    right: 0;
    z-index: 999;
}

.spacial-controls .search-switch {
    display: block;
    height: 100%;
    padding-top: 30px;
    background: #323232;
    text-align: center;
    cursor: pointer;
}
/*---------------------
  Header
-----------------------*/

.header {
    
        background:#137e4c;
}

.header__logo {
    padding: 14px 0 17px;
}
.header__logo img {
    width: 130px;
}
.header__logo a {
    display: inline-block;
}

.header__menu {
    text-align: center;
}

.header__menu ul li {
    list-style: none;
    display: inline-block;
    position: relative;
    margin-right: 0;
}

.header__menu ul li.active a {
     background:#035b32
    color: #ffffff;
}

.header__menu ul li:hover a {
   background:#035b32 ;
    color: #ffffff;
}

.header__menu ul li:last-child {
    margin-right: 0;
}
.header__menu ul li a {
    font-size: 14px;
    color: white;
    text-transform: uppercase;
    display: block;
    font-weight: 700;
    -webkit-transition: all, 0.5s;
    -o-transition: all, 0.5s;
    transition: all, 0.5s;
    padding: 20px;
}

.header__menu ul li a span {
    position: relative;
    font-size: 17px;
    top: 2px;
}

.header__right {
    text-align: right;
    padding: 20px 0 15px;
}

.header__right a:hover{
    background: #1a315d;
    color: #fff;
}



.swiper-slide img {
    border-radius: 25px;
border: 1px solid #fff;
    
border-radius: 25px;

  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero {
    padding-top: 50px;
}
.sst {
    padding: 20px 0;
}

.sst-page {
    padding-top: 60px;
}
.sst__item {
    margin-bottom: 30px;
}

.sst__item__pic {
    position: relative;
    border-radius: 5px;
}
.sst-casinos img{
    border-radius: 25px;
    border:1px solid #fff ;
}
.sst__item__pic .ep {
    font-size: 18px;
    color: #ffffff;
    background: #ff0000;
    display: inline-block;
    padding: 2px 12px;
    border-radius: 4px;
    position: absolute;
    left: 15px;
    top: 25px;
    text-transform: uppercase;
    font-weight: 700;
}
.sst__page__title {
    border-bottom: 2px solid rgba(255, 255, 255, 0.2);
    padding-bottom: 10px;
    margin-bottom: 30px;
}

.sst__page__title .section-title {
    margin-bottom: 0;
}

.sst__page__title .sst__page__filter {
    text-align: right;
}

.sst__page__title .sst__page__filter p {
    color: #ffffff;
    display: inline-block;
    margin-bottom: 0;
    margin-right: 16px;
}
.main-content{
     background: #1a6e98e6 !important;
     
}
.banner-content{
        background-image: url(img/bg5.webp) !important;
}

   .form{
    background-color: #067fbc;
    height:80%;
    background-size: cover;
    background-repeat: no-repeat;
    text-align: center;
     
}

.loginInner1{
    padding:50px;
      width: 280px; 
        
}


 .login-form{
    background-color: #fff;
    padding:10px;
    text-align: center;
}




 .featured-box-login h4 {
    display: block;
    margin-block-start: 1.33em;
    margin-block-end: 1.33em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
    color:#067fbc;
}

.btn{
    display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0.25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.btn-submit {
    background-color: var(--theme1-bg);
    border-color: var(--theme1-bg);
    color: var(--primary-color);
    background-color: #067fbc;
    width:100%;
    color:#fff;
}



/*---------------------
  Login
-----------------------*/
#LoginModal .modal-content{
    border: 1px solid #167abf;
    background: url('www.shutterstock.com/image-illustration/cricket-stadium-3d-illustration-night-260nw-751509253.html');
}
#LoginModal .modal-header{
    background: #f6f6f6;
    color: #fff;
    border-bottom: none;
    padding-bottom: 0;
}
#LoginModal .modal-header h5{
    color: #000;
    display: none;
}
#LoginModal .modal-header .close{
    color: #000;
    box-shadow: none;
    opacity: 1;
    position: absolute;
    right: 5px;
    top: 0;
    z-index: 9;
}
#LoginModal .modal-body{
    background: #f6f6f6!important;
}
.login__form img{
    width: 200px;
    margin: 0 auto;
    display: block;
    margin-bottom: 10px;
}
.login__form form {
    background: #fff;
    padding: 15px;
    box-sizing: border-box;
    /* box-shadow: 0 15px 25px rgb(0 0 0 / 60%); */
    border-radius: 10px;
}
.login {
    padding: 0;
}

.login__form {
    position: relative;
    background-color: #167abf;
}
.login__form p{
    margin: 5px 0;
    text-align: center;
    font-size: 13px;
    color: red !important;
}
.login__form form .input__item {
    position: relative;
    margin-bottom: 20px;
}

.login__form form .input__item input {
    height: 50px;
    width: 100%;
    font-size: 14px;
    color: #000;
    background: #f6f6f6;
    border: 1px solid #d9d9d9 !important;
    padding: 0 10px;
    border-radius: 5px;
    text-align: center;
}
.login__form form .input__item input::-webkit-input-placeholder,
.login__form form .input__item input::-moz-placeholder,
.login__form form .input__item input:-ms-input-placeholder,
.login__form form .input__item input::-ms-input-placeholder,
.login__form form .input__item input::placeholder,
input:placeholder{
    color: #fff !important;
}

.login__form form button:hover{
    opacity: 0.8;
    border-color: #167abf;
}


.login__register .primary-btn {
    background: #e53637;
    padding: 12px 42px;
}

.login__social {
    padding-top: 52px;
}

.login__social__links {
    text-align: center;
}

.login__social__links span {
    color: #ffffff;
    display: block;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.login__social__links ul li {
    list-style: none;
    margin-bottom: 15px;
}

.login__social__links ul li:last-child {
    margin-bottom: 0;
}
.in{
    width: 24%;
  }
  .header__logo img{
    margin-top: 12px;
  }
.login__social__links ul li a {
    color: #ffffff;
    display: block;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    width: 460px;
    padding: 14px 0;
    position: relative;
    margin: 0 auto;
}

.login__social__links ul li a.facebook {
    background: #4267b2;
}

.login__social__links ul li a.google {
    background: #ff4343;
}

.login__social__links ul li a.twitter {
    background: #1da1f2;
}

.login__social__links ul li a i {
    font-size: 20px;
    position: absolute;
    left: 32px;
    top: 14px;
}
.swiper {
  background-color: #016855;

    width: 100%;
    /* height: 100%; */
  }
  .feat{
    /* background:linear-gradient(#098c53, #013c16); */
    background-color: #016855;
  }
  .providers{
    display: grid;
row-gap: 4px;
column-gap: 10px;
place-items: center;
grid-template-columns: repeat(6,auto);
padding: 12px 80px 60px !important;
  }
  .providers-img img{
    box-shadow: inset 0 0 4px 0 #fff;
height: 100px;
object-fit: contain;
padding: 0px 24px;
margin-bottom: 10px;
width: 100% !important;
background-color: black;
  }

  .providers-img img:hover{

    box-shadow: inset 0px 0px 4px 0px #093553;
  }



  .swiper-slide {
      border-radius: 25px;
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'Poppins', sans-serif;
  }
.marqueee {
    width: 100%;
    background-color: #324559 !important;
    padding: 5px;
     margin: -5px 0; 
  }

.ep{
    font-size: 18px;
color: #ffffff;
background: #ff0000;
display: inline-block;
padding: 2px 12px;
border-radius: 4px;
position: absolute;
left: 15px;
top: 25px;
text-transform: uppercase;
font-weight: 700;
}
/*---------------------
  Footer
-----------------------*/

.footer {
  background: #222121;
    /* padding: 40px 0 10px 0; */
    position: relative;
    margin-top: -50px !important;

}
.footer p{
    font-family: 'Poppins', sans-serif;
    margin-bottom: 0;
    color: white;
    text-align: center;
}
.footer p a{
    color: white;
    font-weight: 700;
    font-size: 14px;
}
.footer h2{
    position: relative;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 20px;
    text-transform: uppercase;
    color: white;
}
.footer h2:after{
    content: '';
    background: #ddd;
    height: 1px;
    width: 50%;
    position: absolute;
    left: 0;
    bottom: -8px;
}
.footer__nav ul{
    display: inline-block;
    margin-top: 10px;
}
.footer__nav ul li {
    list-style: none;
}

.footer__nav ul li a {
    font-size: 14px;
    color: white;
    display: block;
    font-weight: 700;
    margin-bottom: 10px;
}
.footer__nav ul li a:hover{
    color: #1a315d;
    /*text-decoration: underline;*/
}
.footer__copyright__text {
    color: #000;
    margin-bottom: 0;
    text-align: right;
}
.securitylogo{
    margin-top: 20px;
}
.securitylogo img{
    height: 40px;
}
.footer__copyright__text a {
    color: #e53637;
}
.bottom-links{
    text-align: center;
    border-top: 1px solid #ddd;
}
.footer img{
    cursor: pointer;
}
.footer .bottom-links a{
    margin: 0 5px;
    position: relative;
    font-size: 12px;
    font-weight: 500;
}
.footer .bottom-links a:hover{
    color: #167abf;
    /*text-decoration: underline;*/
}
.bottom-links a:after{
    content: '';
    background: #167abf;
    position: absolute;
    right: -7px;
    width: 1px;
    height: 100%;
    top: 1px;
    height: 100%;
}
.bottom-links a:last-child:after{
    display: none;
}


 
    
    .my-float{
        margin-top:16px;
    }
   
.social-buttons {
  display: flex;
  justify-content: center;
  align-items: center;
  /* background-color: #f2f2f2; */
  box-shadow: 0px 0px 15px #00000027;
  padding: 9px 0px;
  border-radius: 5em;
}

.social-button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  margin: 0 10px;
  background-color: #fff;
  box-shadow: 0px 0px 4px #00000027;
  transition: 0.3s;
}

.social-button:hover {
  background-color: #f2f2f2;
  box-shadow: 0px 0px 6px 3px #00000027;
}

.social-buttons svg {
  transition: 0.3s;
  height: 20px;
}

.facebook {
  background-color: #00a783;
}

.facebook svg {
  fill: #f2f2f2;
}

.facebook:hover svg {
  fill: #3b5998;
}

.github {
  background-color: #1f9dd4;
}

.github svg {
  width: 68px !important;
  height: 25px;
  fill: #f2f2f2;
}

.github:hover svg {
  fill: #1f9dd4;
}

.linkedin {
  background-color: #0077b5;
}

.linkedin svg {
  fill: #f2f2f2;
}

.linkedin:hover svg {
  fill: #0077b5;
}

.instagram {
  background-color: #c13584;
}

.instagram svg {
  fill: #f2f2f2;
}

.instagram:hover svg {
  fill: #c13584;
}


/*--------------------------------- Responsive Media Quaries -----------------------------*/


@media only screen and (max-width: 767px) {
    
    .swiper{
        
    padding: 1px 10px;
    }
    
 /*.footer h2{*/
 /*    text-align:center !important;*/
 /*}*/
    
    .bottom-links a:after{
        display: none;
    }
    .footer h2:after{
        /*right: 0;*/
        /*margin: 0 auto;*/
    }
    .section-title h4:after, .section-title h5:after{
        top: 3px;
    }
    .footer p{
        margin-top: 0 !important;
    }
    .securitylogo img {
        height: 40px;
        margin: 0 auto;
        margin-bottom: 15px;
    }
    .sst__item__pic .ep {
        font-size: 14px;
        padding: 2px 8px;
        left: 5px;
        top: 10px;
    }
    .sst {
        padding-bottom: 20px;
        padding-top: 40px;
    }
    .footer__nav ul li a{
        padding: 3px 8px;
    }
    .footer__nav ul li{
        margin-right: 3px;
    }
    .trending__sst .row{
        margin: 0;
    }
    .trending__sst .row .col-6{
        padding: 0 5px;
    }
    .sst__item{
        margin-bottom: 10px;
    }
    .hero {
        overflow: hidden;
        padding-top: 10px;
    }
    .header {
        position: relative;
    }
    .header .container {
        position: relative;
    }
    .sst__sidebar {
        padding-top: 50px;
    }
    .footer__logo {
        text-align: center;
        margin-bottom: 20px;
    }
    .footer__nav {
        margin-bottom: 15px;
    }
    .footer__copyright__text {
        text-align: center;
    }
    .sst__page__title .section-title {
        margin-bottom: 30px;
    }
    .sst__page__title .sst__page__filter {
        text-align: left;
    }
    /*.footer{*/
    /*    text-align: center;*/
    /*}*/
    .login{
        padding: 0;
    }
    .login__form {
        padding-left: 0;
        margin-bottom: 15px;
    }
}

.bu{
    margin-left: -37px;
    margin-top: 5px;
  }
  .S{
    margin-left: 12PX;
  }
  button {
font-size: 12px !important;
padding: 0.5em 2em;
border: transparent;
box-shadow: 2px 2px 4px rgba(0,0,0,0.4);
background: #038e6b;
color: white;
border-radius: 4px;
font-weight: 800 !important;
}

button:hover {
background: rgb(2,0,36);
background: linear-gradient(90deg, rgb(14, 175, 154) 0%, rgb(6, 150, 46) 100%);
}

button:active {
transform: translate(0em, 0.2em);
}

.content{
  background-color: #016855;
    /* background-image: linear-gradient(165deg, #15a368e6 0%, #463e3e 100%); */
    padding-top: 30px;
}


    .live{
      background-color: #137e4c;
        text-align: center;
        font-family: 'Poppins', sans-serif;
        font-size: 30px;
color: white;
font-weight: 600;
padding: 10px;
    }



    .content .heading h1 {
        font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
        text-align: center;
        font-size: 40px;
        font-weight: bold;
        color: #feb200;
      }


      .content p {
        color: white;
        font-size: 16px;
        line-height: 28px;
        text-align: justify;
        font-weight: 700;
      }



.marqueee span {
color: white;
text-align: center;
        font-weight: 400;
        margin-left:122px;
      }


.swiper-slide img {
border-radius: 25px;
border: 1px solid #fff;
border-radius: 25px;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}

  .content .heading h1{
      font-family: 'Poppins', sans-serif;
      text-align: center;
      font-size: 40px;
      font-weight: 800;
      color: #ced120;
  }
  .content .para {
      padding: 10px;

  }
  .content .heading h2{
      text-align: center;
      font-size: 40px;
      font-weight: 500;
      color: #ced120;
      font-family: 'Poppins', sans-serif;
  }
  p{
      text-align: justify;
      font-family: 'Poppins', sans-serif;
  }

a,
a:hover,
a:focus,
a:active {
  text-decoration: none;
  outline: none;
}

a,
a:active,
a:focus {
  color: #333;
  text-decoration: none;
  transition-timing-function: ease-in-out;
  -ms-transition-timing-function: ease-in-out;
  -moz-transition-timing-function: ease-in-out;
  -webkit-transition-timing-function: ease-in-out;
  -o-transition-timing-function: ease-in-out;
  transition-duration: .2s;
  -ms-transition-duration: .2s;
  -moz-transition-duration: .2s;
  -webkit-transition-duration: .2s;
  -o-transition-duration: .2s;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
img {
max-width: 100%;
height: auto;
}
span, a, a:hover {
/*display: inline-block;*/
text-decoration: none;
color: inherit;
}
.section-head {
margin-bottom: 60px;
}
.section-head h4 {
font-family: 'Poppins', sans-serif;
position: relative;
padding:0;
color:white;
line-height: 1;
letter-spacing:0.3px;
font-size: 34px;
font-weight: 700;  
text-align:center;
text-transform:none;
margin-bottom:30px;
}
.section-head h4:before {
content: '';
width: 60px;
height: 3px;
background: #0088cce6;
position: absolute;
left: 0px;
bottom: -10px;
right:0;  
margin:0 auto;
}
.section-head h4 span {
font-weight: 700;
padding-bottom: 5px;
color:white;
font-family: 'Poppins', sans-serif;
}
p.service_text{
color:#cccccc !important;
font-size:16px;
line-height:28px;
text-align:center;    
}
.section-head p, p.awesome_line{
color:white;
font-family: 'Poppins', sans-serif;
font-size:16px;
line-height:28px;
text-align:center;  
}
.agency{
  background:#222121;
}
.extra-text {
font-size:34px;
font-weight: 700;
color:#2f2f2f;
margin-bottom: 25px;
position:relative;
text-transform: none;
}
.extra-text::before {
content: '';
width: 60px;
height: 3px;
background: #0088cce6;
position: absolute;
left: 0px;
bottom: -10px;
right: 0;
margin: 0 auto;
}
.extra-text span {
font-weight: 700;
color:white;
}
.item {
background: #fff;
text-align: center;
padding: 30px 25px;
-webkit-box-shadow:0 0px 25px rgba(0, 0, 0, 0.07);
box-shadow:0 0px 25px rgba(0, 0, 0, 0.07);
border-radius: 20px;
border:5px solid rgba(0, 0, 0, 0.07);
margin-bottom: 30px;
-webkit-transition: all .5s ease 0;
transition: all .5s ease 0;
transition: all 0.5s ease 0s;
}
.item:hover{
background:#00ab61e6;
box-shadow:0 8px 20px 0px rgba(0, 0, 0, 0.2);
-webkit-transition: all .5s ease 0;
transition: all .5s ease 0;
transition: all 0.5s ease 0s;
}
.item:hover .item, .item:hover span.icon{
background:#fff;
border-radius:10px;
-webkit-transition: all .5s ease 0;
transition: all .5s ease 0;
transition: all 0.5s ease 0s;
}
.item:hover h6, .item:hover p{
color:#fff;
-webkit-transition: all .5s ease 0;
transition: all .5s ease 0;
transition: all 0.5s ease 0s;
}
.item .icon {
font-size: 40px;
margin-bottom:25px;
color: #00cc41e6;   
width: 90px;
height: 90px;
line-height: 96px;
border-radius: 50px;
}
.item .feature_box_col_one{
background:rgba(247, 198, 5, 0.20);
color:#00cc7ae6;
}
.item .feature_box_col_two{
background:rgba(255, 77, 28, 0.15);
color:#00cc7ae6;
}
.item .feature_box_col_three{
background:rgba(0, 147, 38, 0.15);
color:#00cc7ae6;
}
.item .feature_box_col_four{
background:rgba(0, 108, 255, 0.15);
color:#00cc7ae6;
}
.item .feature_box_col_five{
background:rgba(146, 39, 255, 0.15);
color:#00cc7ae6;
}
.item .feature_box_col_six{
background:rgba(23, 39, 246, 0.15);
color:#00cc7ae6;
}
.item p{
font-size:15px;
line-height:26px;
color: black;
}
.item h6 {
margin-bottom:20px;
color:#2f2f2f;
}
.mission p {
font-family: 'Poppins', sans-serif;
margin-bottom: 10px;
font-size: 15px;
line-height: 28px;
font-weight: 500;
}
.mission i {
display: inline-block;
width: 50px;
height: 50px;
line-height: 50px;
text-align: center;
background: #0088cce6;
border-radius: 50%;
color: #fff;
font-size: 25px;
}
.mission .small-text {
margin-left: 10px;
font-size: 13px;
color: #666;
}
.skills {
padding-top:0px;
}
.skills .prog-item {
margin-bottom: 25px;
}
.skills .prog-item:last-child {
margin-bottom: 0;
}
.skills .prog-item p {
font-weight: 500;
font-size: 15px;
margin-bottom: 10px;
}
.skills .prog-item .skills-progress {
width: 100%;
height: 10px;
background: #e0e0e0;
border-radius:20px;
position: relative;
}
.skills .prog-item .skills-progress span {
position: absolute;
left: 0;
top: 0;
height: 100%;


a,
a:active,
a:focus {
  color: #333;
  text-decoration: none;
  transition-timing-function: ease-in-out;
  -ms-transition-timing-function: ease-in-out;
  -moz-transition-timing-function: ease-in-out;
  -webkit-transition-timing-function: ease-in-out;
  -o-transition-timing-function: ease-in-out;
  transition-duration: .2s;
  -ms-transition-duration: .2s;
  -moz-transition-duration: .2s;
  -webkit-transition-duration: .2s;
  -o-transition-duration: .2s;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
img {
max-width: 100%;
height: auto;
}
span, a, a:hover {
display: inline-block;
text-decoration: none;
color: inherit;
}
.section-head {
margin-bottom: 60px;
}
.section-head h4 {
position: relative;
padding:0;
color:#0088cce6;
line-height: 1;
letter-spacing:0.3px;
font-size: 34px;
font-weight: 700;  
text-align:center;
text-transform:none;
margin-bottom:30px;
font-family: 'Poppins', sans-serif;
}
.section-head h4:before {
content: '';
width: 60px;
height: 3px;
background: #01ad4be6;
position: absolute;
left: 0px;
bottom: -10px;
right:0;  
margin:0 auto;
}
.section-head h4 span {
font-weight: 700;
padding-bottom: 5px;
color:#2f2f2f
}
p.service_text{
font-family: 'Poppins', sans-serif;
color:#cccccc !important;
font-size:16px;
line-height:28px;
text-align:center;    
}
.section-head p, p.awesome_line{
font-family: 'Poppins', sans-serif;
color:#818181;
font-size:16px;
line-height:28px;
text-align:center;  
}

.extra-text {
font-size:34px;
font-weight: 700;
color:#2f2f2f;
margin-bottom: 25px;
position:relative;
text-transform: none;
font-family: 'Poppins', sans-serif;
}
.extra-text::before {
content: '';
width: 60px;
height: 3px;
background: #0088cce6;
position: absolute;
left: 0px;
bottom: -10px;
right: 0;
margin: 0 auto;
}
.extra-text span {
font-weight: 700;
color:#0088cce6;
}
.item {
background: #fff;
text-align: center;
padding: 30px 25px;
-webkit-box-shadow:0 0px 25px rgba(0, 0, 0, 0.07);
box-shadow:0 0px 25px rgba(0, 0, 0, 0.07);
border-radius: 20px;
border:5px solid rgba(0, 0, 0, 0.07);
margin-bottom: 30px;
-webkit-transition: all .5s ease 0;
transition: all .5s ease 0;
transition: all 0.5s ease 0s;
}
.item:hover{
background:#00ab61e6;
box-shadow:0 8px 20px 0px rgba(0, 0, 0, 0.2);
-webkit-transition: all .5s ease 0;
transition: all .5s ease 0;
transition: all 0.5s ease 0s;
}
.item:hover .item, .item:hover span.icon{
background:#fff;
border-radius:10px;
-webkit-transition: all .5s ease 0;
transition: all .5s ease 0;
transition: all 0.5s ease 0s;
}
.item:hover h6, .item:hover p{
color:#fff;
-webkit-transition: all .5s ease 0;
transition: all .5s ease 0;
transition: all 0.5s ease 0s;
}
.item .icon {
font-size: 40px;
margin-bottom:25px;
color:#00cc7ae6;   
width: 90px;
height: 90px;
line-height: 96px;
border-radius: 50px;
}
.item .feature_box_col_one{
background:rgba(247, 198, 5, 0.20);
color:#00cc7ae6;
}
.item .feature_box_col_two{
background:rgba(255, 77, 28, 0.15);
color:#00cc7ae6;
}
.item .feature_box_col_three{
background:rgba(0, 147, 38, 0.15);
color:#00cc7ae6;
}
.item .feature_box_col_four{
background:rgba(0, 108, 255, 0.15);
color:#00cc7ae6
}
.item .feature_box_col_five{
background:rgba(146, 39, 255, 0.15);
color:#00cc7ae6;
}
.item .feature_box_col_six{
background:rgba(23, 39, 246, 0.15);
color:#00cc7ae6;
}
.item p{
font-size:15px;
line-height:26px;
}
.item h6 {
margin-bottom:20px;
color:#2f2f2f;
}
.mission p {
margin-bottom: 10px;
font-size: 15px;
line-height: 28px;
font-weight: 500;
}
.mission i {
display: inline-block;
width: 50px;
height: 50px;
line-height: 50px;
text-align: center;
background: #0088cce6;
border-radius: 50%;
color: #fff;
font-size: 25px;
}
.mission .small-text {
margin-left: 10px;
font-size: 13px;
color: #666;
}
.skills {
padding-top:0px;
}
.skills .prog-item {
margin-bottom: 25px;
}
.skills .prog-item:last-child {
margin-bottom: 0;
}
.skills .prog-item p {
font-weight: 500;
font-size: 15px;
margin-bottom: 10px;
}
.skills .prog-item .skills-progress {
width: 100%;
height: 10px;
background: #e0e0e0;
border-radius:20px;
position: relative;
}
.skills .prog-item .skills-progress span {
position: absolute;
left: 0;
top: 0;
height: 100%;


a,
a:active,
a:focus {
  color: #333;
  text-decoration: none;
  transition-timing-function: ease-in-out;
  -ms-transition-timing-function: ease-in-out;
  -moz-transition-timing-function: ease-in-out;
  -webkit-transition-timing-function: ease-in-out;
  -o-transition-timing-function: ease-in-out;
  transition-duration: .2s;
  -ms-transition-duration: .2s;
  -moz-transition-duration: .2s;
  -webkit-transition-duration: .2s;
  -o-transition-duration: .2s;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
img {
max-width: 100%;
height: auto;
}
span, a, a:hover {
display: inline-block;
text-decoration: none;
color: inherit;
}
.section-head {
margin-bottom: 60px;
}
.section-head h4 {
position: relative;
padding:0;
color:#0088cce6;
line-height: 1;
letter-spacing:0.3px;
font-size: 34px;
font-weight: 700;  
text-align:center;
text-transform:none;
margin-bottom:30px;
}
.section-head h4:before {
content: '';
width: 60px;
height: 3px;
background: #0088cce6;
position: absolute;
left: 0px;
bottom: -10px;
right:0;  
margin:0 auto;
}
.section-head h4 span {
font-weight: 700;
padding-bottom: 5px;
color:#2f2f2f
}
p.service_text{
color:#cccccc !important;
font-size:16px;
line-height:28px;
text-align:center;    
}
.section-head p, p.awesome_line{
color:#818181;
font-size:16px;
line-height:28px;
text-align:center;  
}

.extra-text {
font-size:34px;
font-weight: 700;
color:#2f2f2f;
margin-bottom: 25px;
position:relative;
text-transform: none;
}
.extra-text::before {
content: '';
width: 60px;
height: 3px;
background: #0088cce6;
position: absolute;
left: 0px;
bottom: -10px;
right: 0;
margin: 0 auto;
}
.extra-text span {
font-weight: 700;
color:#0088cce6;
}
.item {
background: #0088cce6;
text-align: center;
padding: 30px 25px;
-webkit-box-shadow:0 0px 25px rgba(0, 0, 0, 0.07);
box-shadow:0 0px 25px rgba(0, 0, 0, 0.07);
border-radius: 20px;
border:5px solid rgba(0, 0, 0, 0.07);
margin-bottom: 30px;
-webkit-transition: all .5s ease 0;
transition: all .5s ease 0;
transition: all 0.5s ease 0s;
}
.item:hover{
background:#0088cce6;
box-shadow:0 8px 20px 0px rgba(0, 0, 0, 0.2);
-webkit-transition: all .5s ease 0;
transition: all .5s ease 0;
transition: all 0.5s ease 0s;
}
.item:hover .item, .item:hover span.icon{
background:#0088cce6;
border-radius:10px;
-webkit-transition: all .5s ease 0;
transition: all .5s ease 0;
transition: all 0.5s ease 0s;
}
.item:hover h6, .item:hover p{
color:#fff;
-webkit-transition: all .5s ease 0;
transition: all .5s ease 0;
transition: all 0.5s ease 0s;
}
.item .icon {
font-size: 40px;
margin-bottom:25px;
color: #0088cce6;   
width: 90px;
height: 90px;
line-height: 96px;
border-radius: 50px;
}
.item .feature_box_col_one{
background:rgba(247, 198, 5, 0.20);
color:#0088cce6
}
.item .feature_box_col_two{
background:rgba(255, 77, 28, 0.15);
color:#0088cce6
}
.item .feature_box_col_three{
background:rgba(0, 147, 38, 0.15);
color:#0088cce6
}
.item .feature_box_col_four{
background:rgba(0, 108, 255, 0.15);
color:#0088cce6
}
.item .feature_box_col_five{
background:rgba(146, 39, 255, 0.15);
color:#0088cce6
}
.item .feature_box_col_six{
background:rgba(23, 39, 246, 0.15);
color:#0088cce6
}
.item p{
font-size:15px;
line-height:26px;
}
.item h6 {
margin-bottom:20px;
color:#2f2f2f;
}
.mission p {
margin-bottom: 10px;
font-size: 15px;
line-height: 28px;
font-weight: 500;
}
.mission i {
display: inline-block;
width: 50px;
height: 50px;
line-height: 50px;
text-align: center;
background: #212529;
border-radius: 50%;
color: #fff;
font-size: 25px;
}
.mission .small-text {
margin-left: 10px;
font-size: 13px;
color: #666;
}
.skills {
padding-top:0px;
}
.skills .prog-item {
margin-bottom: 25px;
}
.skills .prog-item:last-child {
margin-bottom: 0;
}
.skills .prog-item p {
font-weight: 500;
font-size: 15px;
margin-bottom: 10px;
}
.skills .prog-item .skills-progress {
width: 100%;
height: 10px;
background: #212529;
border-radius:20px;
position: relative;
}
.skills .prog-item .skills-progress span {
position: absolute;
left: 0;
top: 0;
height: 100%;
background: #0088cce6;
width: 10%;
border-radius: 10px;
-webkit-transition: all 1s;
transition: all 1s;
}
.skills .prog-item .skills-progress span:after {
content: attr(data-value);
position: absolute;
top: -5px;
right: 0;
font-size: 10px;
font-weight:600;    
color: #fff;
background:rgba(0, 0, 0, 0.9);
padding: 3px 7px;
border-radius: 30px;
};
width: 10%;
border-radius: 10px;
-webkit-transition: all 1s;
transition: all 1s;
}
.skills .prog-item .skills-progress span:after {
content: attr(data-value);
position: absolute;
top: -5px;
right: 0;
font-size: 10px;
font-weight:600;    
color: #fff;
background:rgba(0, 0, 0, 0.9);
padding: 3px 7px;
border-radius: 30px;
};
width: 10%;
border-radius: 10px;
-webkit-transition: all 1s;
transition: all 1s;
}
.skills .prog-item .skills-progress span:after {
content: attr(data-value);
position: absolute;
top: -5px;
right: 0;
font-size: 10px;
font-weight:600;    
color: #fff;
background:rgba(0, 0, 0, 0.9);
padding: 3px 7px;
border-radius: 30px;
}


.content h2{
    font-size: 30px;
    text-align: center;
    color: white;
    font-weight: 600;


}
.content p{
    color: white;
font-size: 16px;
line-height: 28px;
text-align: justify;
font-weight: 700;

}




    @import url("https://fonts.googleapis.com/css2?family=Kumbh+Sans:wght@400;700&disPlay=swap");

    /* CSS reset */



    input,
    button,
    textarea,
    select {
      font: inherit;
    }


    /* general styling */

    #faq {
   
      font-family: "Kumbh Sans", sans-serif;
      font-size: 0.75rem;
      /* background: linear-gradient(180deg, hsl(273, 75%, 75%), hsl(240, 73%, 65%)); */
      /* background-image: url(img/greenbg.jpg); */
      background-color:  #017b40;
      padding: 20px 0px;

    }

    


    /* seperate styling */

    .faq-card {
        /* background-image: url(img/ngreen.jpg); */
      
    background-repeat: no-repeat;
        background-size: cover;

    position: relative;
    disPlay: flex;
    justify-content: center;

    width: 88%;
    margin: 36px auto;
    padding: 20px;
    border-radius: 2em;
    color: white;
    background-color: #016855;
    /*background-color: #1e1e1e;*/
    box-shadow: -1px 0px 3px grey;
    transition: transform 200ms ease-in;

    }

    .faq-card:hover {
      transform: scale(1.015);
    }

    .faq__content {
      width: 100%;
    }

    .faq__title {
      margin-bottom: 1em;
      text-align: center;
      font-size: 2rem;
      color: white;
    }

    .faq__item {
      width: 100%;
      margin-bottom: 1.5em;
      border-bottom: 1px solid hsl(240, 5%, 91%);
    }

    .faq__question {
        color: white;
      cursor: pointer;
      position: relative;
      margin-bottom: 1em;
      font-size: 0.9rem;
      font-weight: 400;
    }

    .faq__question:hover {
      color: var(--Soft-red);
    }

    .faq__answer {
      disPlay: none;
      padding-bottom: 1.5em;
      color: white;
      line-height: 1.5em;
    }

.imgs__container{
        width: 50%;
    overflow: hidden;
    position: relative;
    border-radius: 32px;
    margin: 46px 0px 36px;

}

.img-woman{
    width: 100%;
    height: 100%;
}
    .arrow-icon {
      disPlay: inline-block;
      position: absolute;
      top: 35%;
      right: 0;
      transform: rotate(0deg);
      transition: transform 300ms ease;
    }

    .img-bg {
      position: absolute;
      top: 0;
      left: 65px;
      width: 200px;
    }

   
    /* attribution styling */

    .attribution {
      font-size: 1rem;
      position: absolute;
      top: 0;
      color: var(---Very-dark-blue);
      opacity: 0.75;
    }

    .attribution a {
      color: white;
      text-decoration: underline;
    }

    .attribution a:hover {
      color: rgba(255 255 255/0.5);
    }


    /* media queries */

    @media (min-width: 900px) {
      body {
        align-items: center;
        min-height: 100vh;
      }

    

      .faq__content {
       
     width: 50%;
    padding: 2em;
      }

      .faq__title {
        text-align: center;
      }

     
   
      .img-bg {
        position: absolute;
        top: 120px;
        left: -100px;
        transform: scale(400%);
      }


      .img-box {
        position: absolute;
        top: 190px;
        left: -90px;
        width: 13%;
        transition: transform 1s ease-in;
      }

      body:hover .img-box,
      body:focus .img-box {
        animation: up-and-down 1.25s linear infinite alternate;
      }

      @keyframes up-and-down {
        0% {
          transform: translateY(0%);
        }

        100% {
          transform: translateY(-20%);
        }
      }
    }
    
    
        @media (max-width: 700px) {
      .faq-card {
          flex-direction: column;
         
      }
      .imgs__container{
      width:100% !important;
        }}

  .swiper-wrapper{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
  }
  .celeb{
    color: #fff;
    text-align: center;
    font-size: 36px;
    padding: 15px;

  }


    .our-games{
        background-image: url(img/greenbg.jpg) !important;
        background-attachment: fixed;
        background-position: 50%;
        background-size: cover;
    }
    #our-games {
       
        background-attachment: fixed;
        background-position: 50%;
        background-size: cover;
    }

    #our-games .our-games {
        place-items: center;
        display: grid;
        grid-template-columns: repeat(4, auto);
        row-gap: 25px;
        column-gap: 25px;
        padding: 60px;
    }

    #our-games .our-games img {
        width: 200px;
        box-shadow: 0px 0px 10px white;
        background-image: linear-gradient(0deg, #cec5b4, #636054, #ceccc0, #eceae4, #f5f2ee);
        padding: 5px;
        border-radius: 130px;

    }

    #our-games .our-games h2 {
        color: white;
        margin-top: 10px;
        /* text-shadow: 0px 0px 10px black; */
        text-align: center;
        text-transform: capitalize;
    }

    #our-games .our-games a img:hover {
        transform: scale(0.9);
        transition: all .5s ease;
    }

    #our-games h1 {
        font-size: 37px;
        text-align: center;
        color: white;
        padding-top: 20px;
        text-shadow: 10px 10px 10px black;
        text-transform: uppercase;
        letter-spacing: 2px;
    }
    footer{
        background-color: #111111;
    }

    @media (max-width:700px) {
        html,body{
    width:100%;
    height:100%;
    margin:0;
    padding:0;
    overflow-x:hidden;
}
.content .heading h2{
    font-size:17px !important;
    padding-top:20px;
}
      .bu{
            margin-left: -37px;
            margin-top: 5px;
          }
        #our-games .our-games {

            grid-template-columns: repeat(2, auto);
        }

        #our-games .our-games img {
            width: 156px;
        }

        #our-games .our-games {


            padding: 10px 10px;
        }
    }


.trust{
    color: white;
text-align: center;
margin-left: -99px;
}
    
  .FixedHeightContainer
{
     background-image: linear-gradient(165deg, #15a368e6 0%, #463e3e 100%);
  /* float:right; */
  /* height: 250px; */
  /* width:250px;  */
  padding:30px; 
    /* background:#f00; */
}
.Content
{
  height:224px;
   overflow:auto;
    /* background:#fff; */
    color: white;
    padding: 10px 10px 12px 12px;
}

.FixedHeightContainer h2{
  font-size: 22px;
text-align: center;
color: white;
font-weight: 600;
}
.games3{
    display: grid;
    row-gap: 25px;
    column-gap: 25px;
    place-items: center;
    grid-template-columns: repeat(3,auto);
    padding: 1px 132px;
  }
  .games-images img{
   width: 100%;
  }
  


  .social-buttons {
  display: flex;
  justify-content: center;
  align-items: center;
  /* background-color: #f2f2f2; */
  box-shadow: 0px 0px 15px #00000027;
  padding: 9px 0px;
  border-radius: 5em;
}

.social-button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  margin: 0 10px;
  background-color: #fff;
  box-shadow: 0px 0px 4px #00000027;
  transition: 0.3s;
}

.social-button:hover {
  background-color: #f2f2f2;
  box-shadow: 0px 0px 6px 3px #00000027;
}

.social-buttons svg {
  transition: 0.3s;
  height: 20px;
}

.facebook {
  background-color: #00a783;
}

.facebook svg {
  fill: #f2f2f2;
}

.facebook:hover svg {
  fill: #3b5998;
}

.github {
  background-color: #1f9dd4;
}

.github svg {
  width: 68px!important;
  height: 25px;
  fill: #f2f2f2;
}

.github:hover svg {
  fill: #1f9dd4;
}

.linkedin {
  background-color: #0077b5;
}

.linkedin svg {
  fill: #f2f2f2;
}

.linkedin:hover svg {
  fill: #0077b5;
}

.instagram {
  background-color: #c13584;
}

.instagram svg {
  fill: #f2f2f2;
}

.instagram:hover svg {
  fill: #c13584;
}



  .games2{
    display: grid;
    row-gap: 25px;
    column-gap: 25px;
    place-items: center;
    grid-template-columns: repeat(4,auto);
    /* padding: 1px 132px; */
    padding: 0px 126px;
  }
  .games2-images img{
    border-radius: 25px;
    border: 1px solid #fff;
  }


  .our-games1{
    /* background-image: url(img/greenbg.jpg) !important; */
    background-color: #016855;
    background-attachment: fixed;
    background-position: 50%;
    background-size: cover;
    padding: 50px 0px 50px 0px;
}

.content-box-section{
  background-color: white;
  padding: 20px;
  border-radius:5px;
}

.content-box h3{
 color: rgb(228, 153, 3);
 font-weight: 700;
}
.content-box  p ,li{
  color: rgb(24, 24, 24);
  text-align: justify;
}

.content-img{
  text-align: center;
  justify-content: center;

}
.content-img img{
  width: 600px;
  height:380px;
  border-radius: 10px;
}


  .login-box {
    position: absolute;
  left: 75%;
  width: 400px;
  padding: 40px;
  transform: translate(-50%, -50%);
  background: rgba(0,0,0,.5);
  box-sizing: border-box;
  box-shadow: 0 15px 25px rgba(0,0,0,.6);
  border-radius: 10px;

  top: \\;
  margin-top: 210px;
  }
  
  .login-box h2 {
    margin: 0 0 30px;
    padding: 0;
    color: #fff;
    text-align: center;
  }
  
  .login-box .user-box {
    position: relative;
  }
  
  .login-box .user-box input {
    width: 100%;
    padding: 10px 0;
    font-size: 16px;
    color: #fff;
    margin-bottom: 30px;
    border: none;
    border-bottom: 1px solid #fff;
    outline: none;
    background: transparent;
  }
  .login-box .user-box label {
    position: absolute;
    top:0;
    left: 0;
    padding: 10px 0;
    font-size: 16px;
    color: #fff;
    pointer-events: none;
    transition: .5s;
  }
  
  .login-box .user-box input:focus ~ label,
  .login-box .user-box input:valid ~ label {
    top: -28px;
    left: 0;
    color: #03e9f4;
    font-size: 12px;
  }
  
  .login-box form a {
    position: relative;
    display: inline-block;
    padding: 10px 20px;
    color: #03e9f4;
    font-size: 16px;
    text-decoration: none;
    text-transform: uppercase;
    overflow: hidden;
    transition: .5s;
    margin-top: 40px;
    letter-spacing: 4px
  }
  
  .login-box a:hover {
    background: #03e9f4;
    color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 5px #03e9f4,
                0 0 25px #03e9f4,
                0 0 50px #03e9f4,
                0 0 100px #03e9f4;
  }
  
  .login-box a span {
    position: absolute;
    display: block;
  }
  
  .login-box a span:nth-child(1) {
    top: 0;
    left: -100%;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, transparent, #03e9f4);
    animation: btn-anim1 1s linear infinite;
  }
  
  @keyframes btn-anim1 {
    0% {
      left: -100%;
    }
    50%,100% {
      left: 100%;
    }
  }
  
  .login-box a span:nth-child(2) {
    top: -100%;
    right: 0;
    width: 2px;
    height: 100%;
    background: linear-gradient(180deg, transparent, #03e9f4);
    animation: btn-anim2 1s linear infinite;
    animation-delay: .25s
  }
  
  @keyframes btn-anim2 {
    0% {
      top: -100%;
    }
    50%,100% {
      top: 100%;
    }
  }
  
  .login-box a span:nth-child(3) {
    bottom: 0;
    right: -100%;
    width: 100%;
    height: 2px;
    background: linear-gradient(270deg, transparent, #03e9f4);
    animation: btn-anim3 1s linear infinite;
    animation-delay: .5s
  }
  
  @keyframes btn-anim3 {
    0% {
      right: -100%;
    }
    50%,100% {
      right: 100%;
    }
  }
  
  .login-box a span:nth-child(4) {
    /* bottom: -100%; */
    left: 0;
    width: 2px;
    height: 100%;
    background: linear-gradient(360deg, transparent, #03e9f4);
    animation: btn-anim4 1s linear infinite;
    animation-delay: .75s
  }
  
  @keyframes btn-anim4 {
    0% {
      bottom: -100%;
    }
    50%,100% {
      bottom: 100%;
    }
  }
  
  

  #halfsection{
    background-image: url(img/bg1.webp);
    display: flex;
    width: 100%;
    padding: 40px;
  }
  .halfpointers{
    width: 50%;
  }
  .halfform{
    width: 50%;
  }
  .points{
    align-items: flex-start;
color: #fff;
display: flex;
/* font-family: PoppinsRegular; */
font-size: 20px;
margin: 0 0 30px;
transition: .2s;
margin-left: 81px;

  }
  @media only screen and (max-width: 600px) {
      .trust{
margin-left: -45px;
padding-top:50px;
}
    
   
    .providers{
        grid-template-columns: repeat(2,auto);
/* padding: 12px 119px; */
padding: 1px 8px;
    }
      .halfform {
              margin-left: 14px;
}
      .header__logo img{
          margin-top: 10px;
      }
    .content-text p{
      font-size: 14px;
    }
    .img-woman {
      /* margin: 0px; */
      margin-left: -18px;
    }
    .celeb{
      padding: 26px;
    }
    .Content{
      font-size: 12px;
line-height: 2;
    }
    #our-games h1{
      font-size: 26px;
    }
    #our-games .our-games h2{
      font-size: 20px;
    }
    .section-head p, p.awesome_line{
      font-size: 13px;
      color: white;
    }
    .content .heading h1{
      font-size: 24px;
      font-weight: 800;
    }
    .content h2{
      font-size: 16px;
    }
    .content p{
      font-size: 15px;
    }
    .login-box{
      position: initial !important;
      transform: translate(-4%, 2%) !important;
      margin-top: 29px !important;
      left: 1%;
    }
    .points{
      margin-left: 0px;
      font-size: 11px;
      margin-top:12px;
    }
    .halfpointers{
      width: 93%;
    }
    #halfsection {
      padding: 0px;
    display: block;
  }
.halfsection{
  width: 100%;
}
.halfform{
  width: 100%;
}
}
.ic{
  margin-right: 14px ;
}
 

@media only screen and (max-width: 767px) {
       .ic{
  margin-right: 2px;
  font-size: 28px;
  color: goldenrod;
  margin-left: 6px;
  margin-top: -4px;
}
    .games2{
        grid-template-columns: repeat(2,auto);
        padding: 1px 12px;

    }
    .games3{
        grid-template-columns: repeat(2,auto);
        padding: 14px 16px;
    }
    .section-title {
        margin-bottom: 9px;
        margin-left: 22px;
}}



.glow-on-hover {
  width: 220px;
  height: 50px;
  border: none;
  outline: none;
  color: #fff;
  background: #25d366;
  cursor: pointer;
  position: relative;
  z-index: 0;
  border-radius: 10px;
  margin-top: 10px;
  margin-bottom: 10px;
  font-size: 20px;
}

.glow-on-hover:before {
  content: '';
  background: #fff;
  position: absolute;
  top: -2px;
  left:-2px;
  background-size: 400%;
  z-index: -1;
  filter: blur(5px);
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  animation: glowing 20s linear infinite;
  opacity: 0;
  transition: opacity .3s ease-in-out;
  border-radius: 10px;
}

.glow-on-hover:active {
  color: #25d366;
}

.glow-on-hover:active:after {
  background: transparent;
}

.glow-on-hover:hover:before {
  opacity: 1;
}

.glow-on-hover:after {
  z-index: -1;
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  background: #25d366;
  left: 0;
  top: 0;
  border-radius: 10px;
}

@keyframes glowing {
  0% { background-position: 0 0; }
  50% { background-position: 400% 0; }
  100% { background-position: 0 0; }
}


a,
a:hover,
a:focus,
a:active {
    text-decoration: none;
    outline: none;
}

a,
a:active,
a:focus {
    color: #6f6f6f;
    text-decoration: none;
    transition-timing-function: ease-in-out;
    -ms-transition-timing-function: ease-in-out;
    -moz-transition-timing-function: ease-in-out;
    -webkit-transition-timing-function: ease-in-out;
    -o-transition-timing-function: ease-in-out;
    transition-duration: .2s;
    -ms-transition-duration: .2s;
    -moz-transition-duration: .2s;
    -webkit-transition-duration: .2s;
    -o-transition-duration: .2s;
}

ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
img {
max-width: 100%;
height: auto;
}


.sec-title{
position:relative;
z-index: 1;
margin-bottom:60px;
}

.sec-title .title{
position: relative;
display: block;
font-size: 18px;
line-height: 24px;
color: #00aeef;
font-weight: 500;
margin-bottom: 15px;
}

.sec-title h2{
position: relative;
display: block;
font-size:40px;
line-height: 1.28em;
color: #222222;
font-weight: 600;
padding-bottom:18px;
}

.sec-title h2:before{
position:absolute;
content:'';
left:0px;
bottom:0px;
width:50px;
height:3px;
background-color:#d1d2d6;
}

.sec-title .text{
position: relative;
font-size: 16px;
line-height: 26px;
color: #848484;
font-weight: 400;
margin-top: 35px;
}

.sec-title.light h2{
color: #ffffff;
}

.sec-title.text-center h2:before{
left:50%;
margin-left: -25px;
}

.list-style-one{
position:relative;
}

.list-style-one li{
position:relative;
font-size:16px;
line-height:26px;
color: #222222;
font-weight:400;
padding-left:35px;
margin-bottom: 12px;
}

.list-style-one li:before {
content: "\f058";
position: absolute;
left: 0;
top: 0px;
display: block;
font-size: 18px;
padding: 0px;
color: #ff2222;
font-weight: 600;
-moz-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
font-style: normal;
font-variant: normal;
text-rendering: auto;
line-height: 1.6;
font-family: "Font Awesome 5 Free";
}

.list-style-one li a:hover{
color: #44bce2;
}

.btn-style-one{
position: relative;
display: inline-block;
font-size: 17px;
line-height: 30px;
color: #ffffff;
padding: 10px 30px;
font-weight: 600;
overflow: hidden;
letter-spacing: 0.02em;
background-color: #00aeef;
}

.btn-style-one:hover{
background-color: #0794c9;
color: #ffffff;
}
.about-section{
position: relative;
padding: 120px 0 70px;
}

.about-section .sec-title{
margin-bottom: 45px;
}

.about-section .content-column{
position: relative;
margin-bottom: 50px;
}

.about-section .content-column .inner-column{
position: relative;
padding-left: 30px;
}

.about-section .text{
margin-bottom: 20px;
font-size: 16px;
line-height: 26px;
color: #848484;
font-weight: 400;
}

.about-section .list-style-one{
margin-bottom: 45px;
}

.about-section .btn-box{
position: relative;
}

.about-section .btn-box a{
padding: 15px 50px;
}

.about-section .image-column{
position: relative;
}

.about-section .image-column .text-layer{
position: absolute;
right: -110px;
top: 50%;
font-size: 325px;
line-height: 1em;
color: #ffffff;
margin-top: -175px;
font-weight: 500;
}

.about-section .image-column .inner-column{
position: relative;
padding-left: 80px;
padding-bottom: 0px;
}
.about-section .image-column .inner-column .author-desc{
position: absolute;
bottom: 16px;
z-index: 1;
background: orange;
padding: 10px 15px;
left: 96px;
width: calc(100% - 152px);
border-radius: 50px;
}
.about-section .image-column .inner-column .author-desc h2{
font-size: 21px;
letter-spacing: 1px;
text-align: center;
color: #fff;
margin: 0;
}
.about-section .image-column .inner-column .author-desc span{
font-size: 16px;
letter-spacing: 6px;
text-align: center;
color: #fff;
display: block;
font-weight: 400;
}
.about-section .image-column .inner-column:before{
content: '';
position: absolute;
width: calc(50% + 80px);
height: calc(100% + 160px);
top: -80px;
left: -3px;
background: transparent;
z-index: 0;
border: 44px solid #00aeef;
}

.about-section .image-column .image-1{
position: relative;
}
.about-section .image-column .image-2{
position: absolute;
left: 0;
bottom: 0;
}

.about-section .image-column .image-2 img,
.about-section .image-column .image-1 img{
box-shadow: 0 30px 50px rgba(8,13,62,.15);
border-radius: 46px;
width: 80%;
}

.about-section .image-column .video-link{
position: absolute;
left: 70px;
top: 170px;
}

.about-section .image-column .video-link .link{
position: relative;
display: block;
font-size: 22px;
color: #191e34;
font-weight: 400;
text-align: center;
height: 100px;
width: 100px;
line-height: 100px;
background-color: #ffffff;
border-radius: 50%;
box-shadow: 0 30px 50px rgba(8,13,62,.15);
-webkit-transition: all 300ms ease;
-moz-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
transition: all 300ms ease;
}

.about-section .image-column .video-link .link:hover{
background-color: #191e34;
color: #fff}
.center-img{
width: 100%;
height: auto;
}
.text{
margin-bottom: 25px;
}


.wrapper{
max-width: 75%;
margin: auto;
}


.wrapper p,
.wrapper > h1 {

margin: 1.5rem o;
text-align: center;
}
.wrapper > h1 {
letter-spacing: 3px;
}


.wrapper .accordion {

background-color: white;
color: rgb(0,0,0,0.8);
cursor: pointer;
font-size: 1.2rem;
padding: 2rem 2.5rem;

border: none !important;
transition: 0.4s;

display: flex !important;
justify-content: space-between !important;
align-items: center;
font-weight: bold;
}
.accordion i {
font-size: 1.6rem !important;

}
 .accordion{
background-color: #f1f7f5;

}
.panel{
padding: 0 18px;

background-color: white;
display: none;
overflow: hidden;
}
.header__right .logg{
    margin-left:20px !important;
}
 .hsix{
    text-align: center;
    color: white;
    font-size: 19px;
    font-weight: 700;
    padding: 26px;
    margin-top: -34px;
}
.ic{
  margin-top: -6px;
}
  
  .halfpointers{
    padding: 31px;
  }
  .points{
    font-size: 14px;
  }
.github svg{
    width:68px!important;
}
    .follow {
        text-align: center;
    color: white;
    font-weight: 600;
    margin: 10px;
}

.d-f{
    display: flex;
  }
  .disclaimer {
    padding: 15px;
    width: 100%;
    margin: auto;
    background-color: #222121;
}

.disclaimer-img {
    width: 400px;
    padding: 22px;
}

.disclaimer-img img {
    width: 100%;
}



.item h6{
    font-weight:800;
}

#gamesimg{
  background-image: url(img/bg3.html);

}
#games3img{
  background-image: url(img/bg2.html);


}


@media (max-width:700px) {
  .d-b{
    display: block;
  }
    .disclaimer-img {
        width: 236px;
        padding: 17px 0px;
    }
}


@media only screen and (max-width: 360px) {
    
    
    .header__right .logg{
 margin-left:5px !important;
}
}

 

  @media screen and (max-width:600px) {
    .halfpointers {
  padding: 12px;
}
.points{
  font-size: 12px;
}
.ic{
  margin-right: 8px;
  margin-top: 0px;
}
.hsix{
  font-size: 17px;
  padding: 16px;
margin-top: -16px;
}
  }



  .hideMenu {
    display: block;
  }
  
  .showmobilemenu {
    display: none;
  }
  
  @media only screen and (max-width: 768px) {
  
    .hideMenu {
      display: none !important;
    }
  
    .showmobilemenu {
      display: block;
    }
  }
  .footer{
    
    padding: 40px 0 10px 0 !important;
}
.FixedHeightContainer h2{
    font-size:22px !important;
}
    .github svg{
    width:68px;
}
@media only screen and (max-width: 430px) {
  .cop{
      display: block!important;
  }
  .content-img img{
    width: 350px;
    height:250px;
    border-radius: 10px;
  }
  .content-box-section{
    background-color:transparent;
    padding: 20px;
    border-radius:5px;
  }
  
  .content-box h3{
   color: rgb(228, 153, 3);
   font-weight: 700;
  }
  .content-box  p ,li{
    color: rgb(255, 255, 255);
  }
 }
 
   @media only screen and (max-width: 1024px) {
  .cop{
      display: none;
  }
 }
   @media only screen and (max-width: 1440px) {
  .cop{
      display: none;
  }
 }
   @media only screen and (max-width: 2024px) {
  .cop{
      display: none;
  }
  
 }