@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600&display=swap");

:root {

 --blue:#0a8dbf;

  --black:#111;

  --white:#f7f7f7;

  --light-color:#d4d4d4;

  --light-bg:#eee;

  --box-shadow:0 .5rem 1rem rgba(0,0,0,.1);

  --border:.1rem solid rgba(0,0,0,.3);

 

  

}



* {

  font-family: 'Poppins', sans-serif;

  margin: 0;

  padding: 0;

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

  outline: none;

  border: none;

  text-decoration: none;

  

}

b

{

  color:var(--light-color)!important;

}
h3{
  color: #fff !important;
}

font{

  color:var(--light-color)!important;

}

p{

  color:var(--light-color);

}

h2{

  color:var(--white)!important;

}



html {

  font-size: 62.5%;

  overflow-x: hidden;

  scroll-behavior: smooth;

  scroll-padding-top: 7rem;

}

body{

    background:   #101922 !important;

    background-size: cover;

    background-position: center;

    

   

}







section {

  padding: 5rem 10%;

}

.data {



  margin-top:50px;



  



  padding:4rem;



  font-size:1.4rem;



  min-height:62vh;



  



}

.data h4{

  color:var(--white) !important;

}

.data p{

  color:var(--light-color);

}







.heading {

  margin-bottom: 3rem;

  font-size: 3rem;

  color: var(--black);

  text-transform: capitalize;

  padding-left: 1rem;

  border-left: 1rem solid var(--blue);

}

.heading-2 {

  text-align: center;

  margin-bottom: 5rem;

  font-size: 4rem;

  text-transform: capitalize;

  color: var(--white);

  line-height: 1.6;

  padding: 0 4rem;



}



.heading-2 span {

  color: #deaa38;

}



.btn-1 {

  display: inline-block;

  margin-top: 1rem;

  padding: 1rem 3rem;

  background: #b22505;

  color: var(--white);

  cursor: pointer;

  font-size: 1.7rem;

  text-transform: capitalize;

  -webkit-transition: .2s linear;

  transition: .2s linear;

}



.btn-1:hover {

  background: var(--black);

  color: var(--white);

  text-decoration: none;



}



@-webkit-keyframes fadeIn {

  0% {

    top: 50%;

    opacity: 0;

  }

}



@keyframes fadeIn {

  0% {

    top: 50%;

    opacity: 0;

  }

}



.header {

  position: -webkit-sticky;

  position: sticky;

  top: 0;

  left: 0;

  right: 0;

  -webkit-box-shadow: var(--box-shadow);

          box-shadow: var(--box-shadow);

  padding: 1.5rem 10%;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

      -ms-flex-align: center;

          align-items: center;

  -webkit-box-pack: justify;

      -ms-flex-pack: justify;

          justify-content: space-between;

  z-index: 1000;

  background: #101214;

}



.header .logo {

  font-size: 2.5rem;

  color: var(--white);

  text-transform: capitalize;

}



.header .logo span {

  color: var(--blue);

}



.header .main-navbar a {

  font-size: 2rem;

  color: var(--white);

  text-transform: capitalize;

  margin: 0 1rem;

}



.header .main-navbar a:hover {

  color: var(--blue);

}



.header .icons div {

  height: 5rem;

  width: 5rem;

  line-height: 5rem;

  font-size: 2rem;

  background: var(--light-bg);

  color: var(--black);

  cursor: pointer;

  text-align: center;

  margin-left: .3rem;

}



.header .icons div:hover {

  background: var(--black);

  color: var(--white);

}



.header #menu-btn {

  display: none;

  font-size: 2rem;

  color:var(--light-color);

}



.header .search-form {

  position: absolute;

  top: 120%;

  left: 50%;

  -webkit-transform: translateX(-50%);

          transform: translateX(-50%);

  width: 70rem;

  background: var(--white);

  -webkit-box-shadow: var(--box-shadow);

          box-shadow: var(--box-shadow);

  padding: 1rem;

  display: none;

  -webkit-box-align: center;

      -ms-flex-align: center;

          align-items: center;

  gap: 1rem;

  -webkit-animation: fadeIn .2s linear;

          animation: fadeIn .2s linear;

}



.header .search-form.active {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

}



.header .search-form input {

  width: 100%;

  padding: 1.2rem 1.4rem;

  background: var(--light-bg);

  font-size: 1.6rem;

  color: var(--light-color);

}



.header .search-form label {

  font-size: 2.5rem;

  color: var(--black);

  cursor: pointer;

  margin: 0 1rem;

}



.header .search-form label:hover {

  color: var(--blue);

}



.header .login-form {

  position: absolute;

  top: 120%;

  left: 50%;

  -webkit-transform: translateX(-50%);

          transform: translateX(-50%);

  width: 40rem;

  background: var(--white);

  -webkit-box-shadow: var(--box-shadow);

          box-shadow: var(--box-shadow);

  padding: 2rem;

  text-align: center;

  -webkit-animation: fadeIn .2s linear;

          animation: fadeIn .2s linear;

  display: none;

}



.header .login-form.active {

  display: block;

}



.header .login-form h3 {

  font-size: 2.5rem;

  color: var(--black);

  text-transform: capitalize;

  padding-bottom: 1rem;

  text-transform: uppercase;

}



.header .login-form .box {

  width: 100%;

  padding: 1.2rem 1.4rem;

  background: var(--light-bg);

  font-size: 1.6rem;

  color: var(--light-color);

  margin: .7rem 0;

}



.header .login-form .flex {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

      -ms-flex-align: center;

          align-items: center;

  gap: .5rem;

  padding-top: 1.5rem;

  padding-bottom: 1rem;

}



.header .login-form .flex label {

  font-size: 1.5rem;

  color: var(--light-color);

  cursor: pointer;

}



.header .login-form .flex a {

  font-size: 1.5rem;

  color: var(--light-color);

  margin-left: auto;

}



.header .login-form .flex a:hover {

  color: var(--blue);

  text-decoration: underline;

}



.header .login-form .btn {

  width: 100%;

}



.header .login-form p {

  font-size: 1.5rem;

  color: var(--light-color);

  line-height: 2;

  padding-top: 1.5rem;

}



.header .login-form p a {

  color: var(--blue);

}



.header .login-form p a:hover {

  text-decoration: underline;

}







.home {

  padding: 0;



}



.home .slide {

  min-height: 50rem;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

      -ms-flex-align: center;

          align-items: center;

  position: relative;

  background-size: cover !important;

  background-position: center !important;

}



.home .slide::before {

  content: '';

  position: absolute;

  top: 0;

  left: 0;

  height: 100%;

  width: 100%;

  /* background: -webkit-gradient(linear, left top, right top, from(var(--white)), to(transparent));

  background: linear-gradient(90deg, var(--white), transparent); */

}



.home .slide .content {

  width: 50rem;

  position: relative;

}



.home .slide .content h3 {

  font-size: 7rem;

  color: var(--white);

  text-transform: capitalize;

  text-transform: uppercase;

}



.home .slide .content p {

    font-size: 1.6rem;

    color: #dbd8d8;

  line-height: 2;

  padding: 1rem 0;

}



.home .swiper-button-next,

.home .swiper-button-prev {



  bottom: 0;

  /* left: 0;

  right: 0; */

  height: 7rem;

  width: 7rem;

  line-height: 7rem;

  background: var(--white);



}





.home .swiper-button-next:hover,

.home .swiper-button-prev:hover {

  background: var(--blue);

}



.home .swiper-button-next::after,

.home .swiper-button-prev::after {

  font-size: 2rem;

  color: var(--black);

}



.home .swiper-button-prev {

  right: 7rem;

}

.service {

  background: #000e19;

   



}



.service .box-container {

  display: -ms-grid;

  display: grid;

  -ms-grid-columns: (minmax(45rem, 1fr))[auto-fit];

      grid-template-columns: repeat(auto-fit, minmax(45rem, 1fr));

  gap: 1rem;

}



.service .box-container .box {

  text-align: center;

  padding: 1rem;

  /* background: var(--white); */

  /* -webkit-box-shadow: var(--box-shadow);

          box-shadow: var(--box-shadow); */

  /* border: var(--border); */

  margin-bottom: 2rem;

}

.service .box-container .box .box-top{

    display:flex;

    

}



.service .box-container .box:hover img {

  -webkit-transform: translateY(-1rem);

          transform: translateY(-1rem);

}





.service .box-container .box .content{

    text-align: left;

    padding-left: 2.5rem;

    z-index: 0;

}



.service .box-container .box h3 {

  font-size: 2.4rem;

  color: #fff;

  text-transform: capitalize;

 padding-bottom: 1rem;

  margin: 0;

}



.service .box-container .box p {

  font-size: 1.4rem;

  color: #999;

  line-height: 2;

}

.service .box-container .box .icon{

  width:150px;

}

.service .box-container .box .icon img{

  width: 100%;

}

.service .box-container .box .fa-solid{



  font-size: 4.5rem;

  color: #6b2cff;

  background: #fff;

  box-shadow: 0 1px 10px rgb(211 215 217);

  border-radius: 0 29px 1px;

  width: 9rem;

  line-height: 9rem;

  height: 9rem;

  border: 1px solid #47abea;



}



.about{

    background:#0c1116;

    background-position: center;

  background-size: cover;

 



}



.about .row {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

      -ms-flex-align: center;

          align-items: center;

  -ms-flex-wrap: wrap;

      flex-wrap: wrap;

  gap: 3rem;

  margin:0;

}



.about .row .image {

  -webkit-box-flex: 1;

      -ms-flex: 1 1 34rem;

          flex: 1 1 34rem;

          

}



.about .row .image img {

  width: 100%;

}



.about .row .content {

  -webkit-box-flex: 1;

      -ms-flex: 1 1 41rem;

          flex: 1 1 41rem;

          z-index: 0;

}

.about .row .content span{

    color:#0a8dbf;

    font-size: 2.2rem;

}



.about .row .content h3 {

  font-size: 3.5rem;

  color: var(--white);

  line-height: 1.6;

  text-transform: capitalize;

}



.about .row .content p {

  font-size: 1.5rem;

  color: var(--light-color);

  line-height: 2;

  padding: 1rem 0;

}



.about .box-container {

  margin-top: 3rem;

  display: -ms-grid;

  display: grid;

  -ms-grid-columns: (minmax(16rem, 1fr))[auto-fit];

      grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));

  gap: 2rem;

  -webkit-box-align: end;

      -ms-flex-align: end;

          align-items: flex-end;

}



.about .box-container .box {

  text-align: center;

  background: var(--light-bg);

  padding: 3rem 2rem;

}



.about .box-container .box h3 {

  font-size: 4rem;

  color: var(--black);

  text-transform: capitalize;

}



.about .box-container .box p {

  font-size: 1.5rem;

  color: var(--light-color);

  line-height: 2;

  padding-top: .5rem;

}

/* 

.services {

  margin-top: 12rem;;

   



} */



.services .box-container {

  display: -ms-grid;

  display: grid;

  -ms-grid-columns: (minmax(33rem, 1fr))[auto-fit];

      grid-template-columns: repeat(auto-fit, minmax(31rem, 1fr));

  gap: 1rem;

}



.services .box-container .box {

  text-align: center;

  padding: 1rem;

  /* background: var(--white); */

  /* -webkit-box-shadow: var(--box-shadow);

          box-shadow: var(--box-shadow); */

  /* border: var(--border); */

}

.services .box-container .box .box-top{

    display:flex;

    

}



.services .box-container .box:hover img {

  -webkit-transform: translateY(-1rem);

          transform: translateY(-1rem);

}





.services .box-container .box .content{

    text-align: left;

    padding-left: 2.5rem;

    z-index: 0;

}



.services .box-container .box h3 {

  font-size: 2.4rem;

 color: #ebe8e8;;

  text-transform: capitalize;

 padding-bottom: 1rem;

  margin: 0;

}



.services .box-container .box p {

  font-size: 1.4rem;

  color: #878686;

  line-height: 2;

}

.services .box-container .box .fa-solid{

  font-size: 3rem;

  height: 7rem;

  line-height: 7rem;

  width: 7rem;

  border-radius: 50%;

  color: #ffffff;

  /* border-radius: 50%; */

  background: #05a2b2;

  box-shadow: 0 6px 18px #05a2b2;



}

.cards{

  background: #0d141b;

}

.cards .box-container {

  display: -ms-grid;

  display: grid;

  -ms-grid-columns: (minmax(30rem, 1fr))[auto-fit];

      grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr));

  gap: 2rem;

}





.cards .box-container .box {

  text-align: center;



  border-right: 0.1rem solid rgba(0,0,0,0.2) ;

  border-bottom: 0.1rem solid rgba(0,0,0,0.2) ;

  -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);

          box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);

  padding: 3rem 2rem;

  background: #182939;

    border-radius: 10px;

}

.cards .box-container .box .top-box{

  display: flex;

    justify-content: space-between;

    align-items: center;

    margin-bottom: 2rem;

}













.cards .box-container .box .fa-solid {



  background: linear-gradient(45deg, rgb(205 216 84), rgb(255 78 0));

  border-radius: 50%;

  color: #ffffff;

  height: 5rem;

  width: 5rem;

  line-height: 5rem;

  font-size: 2rem;

}



.cards .box-container .box h3 {

  font-size: 2.4rem;

  text-transform: capitalize;

  color: #fff;

  padding: 1rem 0;

}



.cards .box-container .box p {

  font-size: 1.5rem;

  line-height: 2;

  color: #999;

}



.about-2{

  background: #101922;

}

.about-2

 .row {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

      -ms-flex-align: center;

          align-items: center;

  -ms-flex-wrap: wrap;

      flex-wrap: wrap;

      margin:0;

      



}



.about-2

 .row .image {

  -webkit-box-flex: 1;

      -ms-flex: 1 1 35rem;

          flex: 1 1 35rem;

        

}



.about-2

 .row .image img {

  width: 100%;



}



.about-2

 .row .content {

  -webkit-box-flex: 1;

      -ms-flex: 1 1 41rem;

          flex: 1 1 41rem;

          padding: 0 4rem;

          z-index:0;



}

.about-2

 .row .content span{

    color:#02D2D8;

    font-size: 2.2rem;

}



.about-2

 .row .content h3 {

  font-size: 3.5rem;

  color: #fff;

  line-height: 1.6;

  font-weight: 700;

  text-transform: capitalize;

}



.about-2

 .row .content p {

  font-size: 1.5rem;

  color: #999;

  line-height: 2;

  margin:0;

  text-align: left;

  padding: 1rem 0;

}



.about-2

 .box-container {

  margin-top: 3rem;

  display: -ms-grid;

  display: grid;

  -ms-grid-columns: (minmax(16rem, 1fr))[auto-fit];

      grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));

  gap: 2rem;

  -webkit-box-align: end;

      -ms-flex-align: end;

          align-items: flex-end;

}



.about-2

 .box-container .box {

  text-align: center;

  background: var(--light-bg);

  padding: 3rem 2rem;

}



.about-2

 .box-container .box h3 {

  font-size: 4rem;

  color: #fff;

  text-transform: capitalize;

}



.about-2

 .box-container .box p {

  font-size: 1.5rem;

  color: #999;

  line-height: 2;

  padding-top: .5rem;

}

.list .box{

  display: flex;

  align-items: flex-start;

}

.list .box.box-2{

  align-items: center;

}

.list .box.box-2 .icon i{

  background: linear-gradient(45deg, rgb(205 216 84), rgb(255 78 0));

  color: #fff;

    width: 4rem;

    height: 4rem;

    line-height: 4rem;

    text-align: center;

    border-radius: 50%;

    font-size: 2rem;

}

.list .box .content{

  padding: 0 2rem;

  z-index:0;

}

.list .box  .icon i{

  color:var(--blue);

  font-size: 2.4rem;



}



.list .box h4{

  margin: 0;

  

}

.flex-box {

  display: flex;

  align-items: center;

}





.review {

 

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

      -ms-flex-align: center;

          align-items: center;

  -ms-flex-wrap: wrap;

      flex-wrap: wrap;

  gap: 2rem;

  min-height: 70vh;

}



.review .information {

  -webkit-box-flex: 1;

      -ms-flex: 1 1 35rem;

          flex: 1 1 35rem;

}



.review .information span {

  font-size: 2rem;

  color: #deaa38;

  text-transform: capitalize;

}



.review .information h3 {

  font-size: 3rem;

  color: var(--white);

  padding-top: 1rem;

}



.review .information p {

  font-size: 1.5rem;

  line-height: 2;

  color: var(--light-color);

  padding: 1rem 0;

}



.review .review-slider {

  -webkit-box-flex: 1;

      -ms-flex: 1 1 60rem;

          flex: 1 1 60rem;

}



.review .review-slider .slide {



     box-shadow: 0 10px 10px rgb(0 0 0 / 20%);

     border: 1px solid rgba(0,0,0,0.2);

  padding: 2rem 3rem;

  background: #182939;

}



.review .review-slider .slide p {

  font-size: 1.5rem;

  line-height: 2;

  color: var(--light-color);

}



.review .review-slider .slide .user {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

      -ms-flex-align: center;

          align-items: center;

  margin-top: 1.5rem;

}



.review .review-slider .slide .user img {

  height: 5rem;

  width: 5rem;

  -o-object-fit: cover;

     object-fit: cover;

  border-radius: 50%;

  margin-right: 1rem;

}



.review .review-slider .slide .user h3 {

  font-size: 2rem;

  color: var(--white);

}



.review .review-slider .slide .user span {

  color: #999;

  font-size: 1.5rem;

}



.review .review-slider .slide .user i {

  font-size: 5rem;

  margin-left: auto;

  margin-right: 2rem;

  color: #7f93a7;

}





.about-2 {

  

 

 

  

  

    -webkit-box-align: center;

        -ms-flex-align: center;

            align-items: center;

    -ms-flex-wrap: wrap;

        flex-wrap: wrap;



    /* min-height: 100vh; */

    /* background: url(../images/about-2-bg.jpg) no-repeat;

    background-position: center;

    background-size: cover; */

    

   

  }

  

  

  

  

/*   

  .about-2 .image {

    -webkit-box-flex: 1;

        -ms-flex: 1 1 45rem;

            flex: 1 1 45rem;

    position: relative;

  } */

  

  

  

  /* .about-2 .image img {

    width: 100%;

    padding: 2rem;

    border-radius: 2rem;

  }

   */

  .about-2 .content {

   width: 100%;

   z-index: 0;

  }

  

  

  .about-2 .content .title {

    font-size: 4rem;

    color: #20288f;

    margin-top: .5rem;

   

  }

  

  .about-2 .content p {

    font-size: 1.5rem;

    color: #555;

    padding: 1rem 0;

    text-align: center;

    line-height: 2;

  }

  /* .about-2 .content .box-container .box .border {

    margin: 2rem 0;

      border-left: 3px solid #654ff9;

      margin-left: 3rem;

  } */

  

  .about-2 .content .box-container {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

        flex-wrap: wrap;

    gap: 3rem;

    margin-top: 1rem;

  }

  

  .about-2 .content .box-container .box {

    -webkit-box-flex: 1;

    -ms-flex: 1 1 70rem;

    flex: 1 1 70rem;

    border-bottom: 1px solid rgb(88 88 88 / 20%);

    margin-bottom: 1rem;

    padding: 1rem;



        

  }

  .about-2 .content .box-container .box i{

    /* background: linear-gradient(45deg, rgb(56 180 211), rgb(9 135 183)); */

    /* box-shadow: rgb(149 120 48) 0px 3px 6px; */

    border-radius: 50%;

    color: var(--blue);

    /* height: 6rem;

    width: 6rem;

    line-height: 6rem; */

    font-size: 2.8rem;

    text-align: center;

    margin-right: 2rem;

  }

  .about-2 .content .box-container .box .top-box{

    display: flex;

    align-items:center;

    

    

  }

  

  

  .about-2 .content .box-container .box h3 {

    font-size: 2.4rem;

    color: var(--white);

    margin:0;

    /* background: linear-gradient(45deg, #ff93c0, #f7637a); */

  

  }

  

  .about-2 .content .box-container .box p {

    text-align: left;

    margin:0;

    padding: .5rem;;

    color: var(--light-color);

  }



  .team{

    background:#092746;

   

  }

  

  .team .box-container {

   

    display: -ms-grid;

    display: grid;

    -ms-grid-columns: (minmax(25rem, 1fr))[auto-fit];

        grid-template-columns: repeat(auto-fit, minmax(25rem, 1fr));

    gap: 2rem;

    -webkit-box-align: start;

        -ms-flex-align: start;

            align-items: flex-start;

  }

  

  .team .box-container .box {

    overflow: hidden;

    text-align: center;

  }

  

  .team .box-container .box:hover .content {

    margin-bottom: 0;



  }

  

  .team .box-container .box img {

    width: 65%;

    border-radius: 50%;

  }

  

  .team .box-container .box .content {

    padding: 2rem;

    z-index: 0;

   

  }

  

  .team .box-container .box .content h3 {

    font-size: 2rem;

    text-transform: capitalize;

    color: var(--white);

  }

  

  .team .box-container .box .content p {

    font-size: 1.4rem;

    line-height: 2;

    color: var(--light-color);

    padding: .5rem 0;

  }

  

  .team .box-container .box .content .share {

    margin-top: 1.5rem;

  }

  

  .team .box-container .box .content .share a {

    height: 4.5rem;

    width: 4.5rem;

    line-height: 4.5rem;

    font-size: 1.7rem;

    margin: 0 .3rem;

    background: #334;

    color: #fff;

  }

  

  .team .box-container .box .content .share a:hover {

    background: #2597f4;

  }

  

  

  

  



 /* footer */

 footer{margin:0; padding:48px 0; width:100%; float:left; background: #101214}



 footer .logoandicon{margin:0; padding:0; width:100%; float:left;}

 

 footer .logoandicon a.footer-logo{float:left; height:auto; padding:0 ; font-size:35px; line-height:20px; font-weight:700; color:#fff;}

 

 footer .logoandicon a.footer-logo p{margin:0; font-size: 25px; padding: 0; float:left;}

 

 footer .logoandicon a.footer-logo img{margin:0 10px 0 0; padding:0px; float:left;}

 

 

 

 

 footer ul.icon{ width:100%; float:left;}

 

 footer ul.icon li{margin:0 11px; padding:0; list-style:none; display:inline-block;}

 

 footer ul.icon li a{margin:0; padding:0; outline:none; text-decoration:none; cursor:pointer;}

 

 footer .quick-links{margin:0; padding-bottom: 2rem;; float:left; width:100%;}

 

 footer .quick-links h1{margin:0; padding:0; font-size:20px; color:#fff; font-weight:400;}

 

 footer .quick-links hr{margin-top:20px;

    margin-bottom:20px;

     border:none; height:2px;

      width:100%; -webkit-box-sizing:content-box; -moz-box-sizing:content-box;

       box-sizing:content-box;

        background:#336fb7;

      

        background: linear-gradient(to right, #ca8e2b 0%,#c07c24 20%,#4a484a 20%,#403d40 100%);

          filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#336fb7', endColorstr='#333c4f',GradientType=1 );}

 

 footer .quick-links ul{margin:0; padding:0; width:50%; float:left;}

 

 footer .quick-links ul li{margin:0; padding:0; list-style:none; display:block;}

 

 footer .quick-links ul li a{margin:0; padding:0; font-size:14px; color:var(--light-color); font-weight:400; outline:none; text-decoration:none; cursor:pointer;}

 

 footer .quick-links ul li:hover a{color:var(--blue);}

 

 footer .quick-links ul li a .fa-angle-right{font-size:18px; color:var(--light-color); margin:0 10px 0 0;}

 

 footer .company{margin:0; padding-bottom: 2rem; float:left; width:100%;}

 

 footer .company h1{margin:0; padding:0; font-size:20px; color:#fff; font-weight:400;}

 

 footer .company hr{margin-top:20px;

    margin-bottom:20px;

     border:none;

      height:2px;

       width:100%;

        -webkit-box-sizing:content-box; -moz-box-sizing:content-box;

         box-sizing:content-box;

          background:#336fb7;

      

        

          background: linear-gradient(to right, #ca8e2b 0%,#c07c24 20%,#4a484a 20%,#403d40 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#336fb7', endColorstr='#333c4f',GradientType=1 );}

 

 footer .company p{margin:0; padding:0; font-size:14px; color:var(--light-color); font-weight:400; line-height:26px;}

 

 .copyright{background: #0a0b0c;

   padding: 14px 0px;; padding:14px 0px; float:left; width:100%;}

 

 .copyright .granames{text-align:right; margin-top:-24px; margin-right:14px;}

 

 .copyright .copytexts{text-align:center; font-size:13px; color:#fff; font-weight:400;}

 /* signup page */



 .signup-wrapper{



  padding: 4rem; 



  height: 100%;



  display: flex;



  justify-content: center;



  align-items: center;







 }



 .signup-form{



  margin-top: 60px;

  position: relative;

  width: 100%;

  max-width: 600px;

  padding: 60px 40px 40px;

  background: #0b2a4a;

  border: 2px solid #13467c;

  border-radius: 10px;

  color: #fff;

  box-shadow: 0 15px 25px rgb(0 0 0 / 50%);



 }







.signup-form h2 {



  text-align: center;



  letter-spacing: 4px;



  margin-bottom: 2rem;



  font-size: 2.4rem;



  color: var(--white);



}



.signup-form .input-group {



  position: relative;



  width:100%;



}



.signup-form .input-group input,textarea,select {



  width: 100%;



  padding: 10px 0;



  font-size: 1.4rem;



  color:var(--white);



  letter-spacing: 1px;



  margin-bottom: 30px;



  border: none;



  border-bottom: 1px solid rgb(52 69 86);



  outline: none;



  background-color: transparent;



  resize: none;



}



.signup-form .input-group label{



    color: var(--white);



    font-size: 1.4rem;



}



.submit-btn {



   display: block;



   margin-left: auto;



   border: none;



   outline: none;



   background: var(--blue);



   font-size: 1.4rem;



   text-transform: uppercase;



   letter-spacing: 1px;



   padding: 10px 20px;



   border-radius: 5px;



   color: #fff;



   cursor: pointer;



   margin-bottom: 1.2rem;



 }



  /* login-form */



.login-wrapper {



    padding:7rem ;



 



   display: flex;



   justify-content: center;



   align-items: center;



 }



 .form {

  background: #0b2a4a;

  border: 2px solid #13467c;



     margin-top:40px;



   position: relative;



   width: 100%;



   max-width: 380px;



   padding: 80px 40px 40px;



  



   border-radius: 10px;



   color: #fff;



   box-shadow: 0 15px 25px rgba(0,0,0,0.5);



 }



 



 .form img {



   position: absolute;



   top: -50px;



   left: calc(50% - 50px);



   width: 100px;



   background: rgba(255,255,255, 0.8);



   border-radius: 50%;



 }



 .form h2 {



   text-align: center;



   letter-spacing: 4px;



   margin-bottom: 2rem;



   font-size: 2.4rem;



   color: var(--white);



 }



 .form .input-group {



   position: relative;



 }



 .form .input-group input {



   width: 100%;



   padding: 10px 0;



   font-size: 1.4rem;



   color:#111;



   letter-spacing: 1px;



   margin-bottom: 30px;



   border: none;



   border-bottom: 1px solid #777;



   outline: none;



   background-color: transparent;



 }



 .form .input-group label{



     color: var(--white);



     font-size: 1.4rem;



 }



  /* advertise page */



.content-top{



 margin-top:80px;







  text-align: center;



  list-style-type: none;



 



}



.content-top h2{



  color: #272F38;



  padding: 1rem;



  



  font-size: 2.1rem;



}



.content-top li{



  padding:.5rem;



  color: #384350;



  font-size: 1.4rem;



}



.content-top ul{



  list-style-type: none;



}

/*dashboard*/

.dash-container{

  position: relative;

  width:  100%;

  display:flex;

  margin: 0rem auto;

 min-height: 100vh;



  

  

}

.dash{

    padding:1rem;

}

.dash h3{

  color:#fff;

}

.dash-nav{

  position: absolute;

  top: 0;

  width :250px;

  height: 100%;

  background:#08284a;

  transition: 0.5s;

  /*overflow: hidden;*/

}

.dash-nav.active{

  width: 10px;



}

.dash-nav.active .link{

  display: none;



}



.dash-nav ul{

  position: absolute;

  top:0;

  left:0;

  width:100%

}

.dash-nav ul li{

  position: relative;

  width:100%;

  list-style: none;

}

.dash-nav ul li:hover{

  background:#052342;

  cursor:pointer;



}

/*.dash-nav ul li:nth-child(1){*/

/*  margin-bottom:20px ;*/

/*}*/



.dash-nav ul li:nth-child(1):hover{

  background: transparent;

}

.dash-nav ul li a h2{

  font-size: 15px;

  

 

}

.dash-nav .link .dash-title h2{

    margin-top:0px;

    margin-bottom:10px;

}







.dash-nav ul li .link{

   

   padding:.5rem;

  position: relative;

  display: block;

  width: 100%;

  /*display: flex;*/

  text-decoration: none;

  color:#fff;

  font-size: 12px;

  border-bottom:1px solid rgba(0,0,0,0.2);

  



}

.dash-nav ul li a{

    color:#fff;

    text-decoration:none;

    text-align:left;

    font-size:1.6rem;

}

/*.dash-nav ul li a .icon{*/

/*  position: relative;*/

/*  display: block;*/

/*  min-width: 60px;*/

/*  height: 60px;*/

/*  line-height: 60px;*/

/*  text-align: center;*/



/*}*/

.dash-nav ul li a .icon .fab{

  color: #fff;

  font-size: 15px;

}

.dash-nav ul li  .dash-title{

  position: relative;

 

  display: block;

  padding: 0 30px;

  /*height: 60px;*/

  line-height: 25px;

  white-space: nowrap;

}

.dash-nav ul li a .brand{

  text-transform: uppercase;

  font-size: 15px;

}

.main-container{

  position: relative;

  width: calc(100% - 250px);

 

  left:250px;

  /* min-height: 100vh; */

  /*background: #f5f5f5;*/

  transition: 0.5s;

}

.main-container.active{

  width: calc(100% - 10px);

  left:10px;

}





.main-container .topbar{

  width: 100%;

 background: rgb(2 17 32);;

  height: 60px;

  padding-left: 0 10px;

  display: flex;

  justify-content: space-between;

  align-items: center;

}

.toggle h4{

  position: absolute;

    top: 13px;

    left: 49px;

    color:var(--light-color);

}

.toggle{

  position: relative;

  width: 60px;

  height: 60px;

  

  cursor: pointer;

}

.toggle::before{

  content: '\f007';

  font-family: "Font Awesome 5 Free";

  position: absolute;

  width: 100%;

  height: 100%;

  line-height: 60px;

  font-size: 24px;

  text-align: center;

  color: var(--light-color);

}













@media (max-width: 1200px) {

  .header {

    padding: 1.5rem 2rem;

  }

  section {

    padding: 3rem 5%;

  }

}



@media (max-width: 991px) {

  html {

    font-size: 55%;

  }

  section {

    padding: 3rem 2rem;

  }

  .header #menu-btn {

    display: inline-block;

  }

  .header .main-navbar {

    position: absolute;

    top: 99%;

    left: 0;

    right: 0;

    background: #092746;

    border-top: var(--border);

    border-bottom: var(--border);

    -webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);

            clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);

    -webkit-transition: .2s linear;

    transition: .2s linear;

  }

  .header .main-navbar.active {

    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);

            clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);

  }

  .header .main-navbar a {

    display: block;

    margin: 2rem;

    color:var(--light-color);

  }

  .dash-nav{

    left:-300px;

}

.dash-nav.active {

    left:0;

}

.dash-nav.active h3{

  display: block;;



}



.main-container{

    width:100%;

    left:0px;   



}

.about-2 .row .content{

padding: 0;

}
}



@media (max-width: 768px) {

  .heading-2{

    font-size:2.4rem;

    line-height: 1.7;

  }

  .header .search-form {

    width: 90%;

  }

  .header .login-form {

    width: 90%;

  }

  .home .slide {

    -webkit-box-pack: center;

        -ms-flex-pack: center;

            justify-content: center;

  }

  .home .slide .content {

    /* background: #00000085; */

    text-align: center;

    padding: 2rem;

  }

  .home .slide .content h3 {

    font-size: 3rem;

  }

  .signup-wrapper , .login-wrapper{

    padding:3rem 2rem;

}

.about{

height:100%;

}

.about-2 {

    gap: 3rem;

   

  }

  .about-2 .image {

    margin-top: 5rem;

  }

  .about-2 .content .title {

    font-size: 3rem;

  }

  .service .box-container{

  grid-template-columns: 1fr;



}

.flex-box{

  flex-direction: column;

}

}



@media (max-width: 450px) {

  html {

    font-size: 50%;

  }

  .about .row .content h3 {

    font-size: 2.5rem;

  }

}

@media(max-width:480px){

   

  .dash-nav{

      width: 100%;

      left: -100%;

      z-index: 1;

  }

  .dash-nav.active{

      width: 100%;

      left:0;

  }

  .dash-nav.active .link{

    display: block;

  }



  .toggle.active{

      /* position: fixed; */

      z-index: 1;

      right: 0;

      left: 290px;

     



  }

  .toggle.active::before{

      color:#fff;

  }

  

  .dash-ban{

            left:0;

        }

        .dash-bottom{

            left:0;

            

        }

        .dash-container{

            width:100%;

        }

        

        

            .topbar h4{

                display:block;

            }

            .toggle.active h4{

                display:none;

                

            }

            

            

  

}
@media only screen and (max-width: 500px) {
  .g-recaptcha {
  transform:scale(0.77);
  transform-origin:0 0;
  }
  }