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



@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');



/***** General CSS *****/







body {



  word-break: break-word;



  font: 15px/25px 'Poppins', sans-serif;



  color: #393939;



  overflow-x: hidden;



}







a {



  text-decoration: none;



  color: #28b16d;



  white-space: initial;



}







a:hover,



a:focus {



  text-decoration: none;



  color: #393939;



}







a:hover {



  transition: all 0.5s ease-in-out;



  -webkit-transition: all 0.5s ease-in-out;



  -moz-transition: all 0.5s ease-in-out;



}







img {



  max-width: 100%;



}







input[type="text"]:focus,



textarea:focus,



input[type="password"]:focus,



select:focus,



input[type="email"]:focus,



input[type="url"]:focus,



input[type="tel"]:focus,



input[type="number"]:focus {



  transition: all 0.5s ease;



  -webkit-transition: all 0.5s ease;



  -moz-transition: all 0.5s ease;



  outline: none;



}







select,



input[type="text"],



input[type="password"],



input[type="email"],



input[type="url"],



input[type="number"],



textarea,



input[type="tel"] {



  -webkit-appearance: none;



  -moz-appearance: none;



  appearance: none;



}







ul {



  margin: 0 0 20px;



  padding: 0;



  list-style-type: none;



}







p {



  font-weight: 400;



  font-family: "Montserrat", sans-serif;



}











/***** Font Files *****/







@font-face {



  font-family: 'Trajan';



  src: url(../fonts/Trajan-Regular.otf);



  font-weight: 400;



  font-style: normal



}











/***** Custom Classes *****/







.noPadding {



  padding: 0;



}







.noLeft {



  padding-left: 0;



}







.noRight {



  padding-right: 0;



}







.centerCol {



  float: none;



  margin: 0 auto;



}







.theme-btn {



  font-size: 14px;



  line-height: 20px;



  font-weight: 500;



  padding: 15px 40px;



  color: #fff;



  margin: 20px 20px 20px 0;



  border-radius: 50px;



  -webkit-border-radius: 50px;



  -moz-border-radius: 50px;



  text-transform: capitalize;



  border: 2px solid;



  text-transform: uppercase;



}







.theme-btn:hover {



  background-color: #fff;



  color: #28b16d;



  border-color: #28b16d;



}







.flexRow {



  display: -webkit-box;



  display: -moz-box;



  display: -ms-flexbox;



  display: -webkit-flex;



  display: flex;



  align-items: center;



}







.flexCol {



  -webkit-box-flex: 1;



  -moz-box-flex: 1;



  -webkit-flex: 1;



  -ms-flex: 1;



  flex: 1;



  align-items: center;



}







h1 {



  font-family: 'Trajan';



  font-size: 55px;



  line-height: 60px;



  color: #fff;



  font-weight: 500;



  margin: 0 0 17px;



}







h2 {



  font-family: 'Trajan';



  font-size: 55px;



  line-height: 60px;



  color: #393939;



  font-weight: 500;



  margin: 0 0 30px;



}







h3 {



  font-family: 'Trajan';



  font-size: 30px;



  line-height: 34px;



  color: #000000;



  font-weight: 600;



  margin: 0 0 28px;



}







h4 {



  font-family: 'Trajan';



  font-size: 24px;



  line-height: 29px;



  color: #393939;



  font-weight: 500;



  margin: 0 0 13px;



}







h5 {



  font-family: 'Trajan';



  font-size: 20px;



  line-height: 25px;



  color: #393939;



  font-weight: 500;



  margin: 0 0 20px;



}







h6 {



  font-family: "Montserrat", sans-serif;



  font-size: 18px;



  line-height: 23px;



  color: #393939;



  font-weight: 500;



  margin: 0 0 22px;



}







select {



  background: #fff url('../images/arrow.png') no-repeat right;



  padding: 0 40px 0 30px;







}







::-webkit-input-placeholder {



  color: #575757;



}







::-moz-placeholder {



  color: #575757;



  opacity: 1;



}







:-ms-input-placeholder {



  color: #575757;



}







:-moz-placeholder {



  color: #575757;



  opacity: 1;



}











/*header css start */







.menuSec {



  padding: 20px 0;



}







.menuSec img {



  margin: 0;



}





.head-log {

    background-color: #fff;

    /* text-align: center; */

    height: 106px;

    width: fit-content;

    padding: 20px;

    height: 117px;

}

.menuSec ul {



position: relative;



list-style: none;



padding: 0;



margin: 0;



/* text-align: right; */



text-transform: capitalize;



justify-content: space-between;



display: flex;



text-align: center;

}







.menuSec ul li {



  position: relative;



  display: inline-block;



  margin: 0;



  padding: 0;



}







.menuSec li ul {



  display: none;



}







.menuSec ul li a {



position: relative;



display: inline-block;



text-decoration: none;



color: #fff;



font-size: 13px;



font-family: 'Montserrat';

}







.menuSec ul li a:after {



  content: '';



  position: absolute;



  top: 35%;



  right: 0;



  width: 1px;



  height: 13px;



  background-color: #393939;



  display: none;



}







.menuSec ul li:last-child a {



  padding-right: 0px;



}



.menuSec ul li a.active::before {



left: 0;



bottom: -67px;



width: 80%;



height: 2px;



content: '';



position: absolute;



background-color: #fff;



margin: 0 auto;



right: 0;

}



.menuSec ul li:last-child a:after {



  display: none;



}







.menuSec ul li a:hover,



.menuSec ul li a.active {



  transition: all 0.5s ease;



  -webkit-transition: all 0.5s ease;



  -moz-transition: all 0.5s ease;



  color: #ffffffba;



}







.menuSec li:hover>ul {



  display: block;



  position: absolute;



  z-index: 1000;



  background-color: #000000;



  left: 0px;



  width: 230px;



  text-align: left;



  top: 38px;



}







.menuSec li>ul>li>a {



  border: none;



  padding: 13px 20px !important;



  color: #fff !important;



  overflow: hidden;



  font-size: 13px;



  line-height: 20px;



}







.menuSec li>ul>li,



.menuSec li>ul>li>a {



  display: block;



  margin: 0;



}







.menuSec li>ul>li>a:before,



.menuSec li>ul>li>a:after {



  display: none;



}







.menuSec li:hover li {



  float: none;



}







.menuSec li:hover a {}







.menuSec li ul li a:hover {



  background-color: #ffffff;



  color: #000000 !important;



}







.menuSec ul ul ul {



  left: 100%;



  top: 0;



}







.menuSec ul:before,



.menuSec ul:after {



/* content: " "; */



/* display: table; */

}







.menuSec ul:after {



  clear: both;



}







.menuSec li>ul>li:hover>ul {



  left: 230px;



  top: 0px;



  width: 270px;



}







.droopdwon li:hover>ul {



  display: block;



  position: absolute;



  z-index: 1000;



  background-color: #000000;



  left: 0px;



  width: 230px;



  text-align: left;



  top: 40px;



}







.droopdwon {



  float: left;



}







.droopdwon li:hover li a:hover {



  background-color: #ffffff;



  color: #000 !important;



}







a.btn-1 {



  display: flex;



  align-items: center;



  font-size: 14px;



  font-weight: 500;



  color: #fff;



  background-color: #b7262e;



  width: fit-content;



  padding: 10px 10px;



  border-radius: 100px;



  border: 1px solid #fff;



  gap: 17px;



  padding-left: 17px;



}







.menuSec a.btn-1 {



  margin: 0 0 0 auto;



}







header {



  position: absolute;



  top: 0;



  left: 0;



  width: 100%;



  z-index: 99;



  border-bottom: 2px solid #ffffff52;



}







header .row {



  align-items: center;



}







.container-fluid {



  padding: 0 4%;



  max-width: 1700px;



  margin: auto;



}







/*header css start */







.dropdown-menu {



  position: absolute !important;



  z-index: 1000;



  display: block;



  min-width: 10rem;



  padding: 0.5rem 0;



  margin: 0;



  font-size: 1rem;



  color: #212529;



  text-align: left !important;



  background-color: #fff;



  background-clip: padding-box;



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



  border-radius: 0.25rem;



}







/*banner css start */



.banner_text h1 {



font-size: 42px;



line-height: 68px;



border-bottom: 1px solid #fff;



width: fit-content;



position: relative;

}







.banner_text h1 span {



  display: block;



}







.ankar {



  display: flex;



  align-items: center;



  gap: 45px;



}



.banner_text h1::before {



position: absolute;



content: '';



width: 29px;



height: 3px;



right: 0;



top: 135px;



background-color: #fff;

}







.banner_text p {



  font-size: 14px;



  width: 80%;



  margin-bottom: 20px;



}







.banner_img {



  position: absolute;



  bottom: 0;



  right: 185px;



}







section.main_slider {



  position: relative;



}







img.img-fluid {



  width: 100%;



  height: 827px;



}



.banner_img img {



    height: 700px;



    object-fit: cover;



}



.carousel-inner>.item>a>img,



.carousel-inner>.item>img {



  width: 100%;



}







.carousel-control.right,



.carousel-control.left {



  background: none;



  opacity: 1;



  width: 50px;



  height: 50px;



  top: initial;



  top: 40%;



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



  text-shadow: none;



}







.carousel-control.right:hover,



.carousel-control.left:hover {



  background: rgba(255, 27, 27, 0.6);



  color: #fff;



}







.carousel-control.right .fa,



.carousel-control.left .fa {



  position: relative;



  top: 12px;



  font-size: 20px;



  color: #fff;



  opacity: 0.5;



}







.carousel-control.right {



  right: 0px;



}







.carousel-control.left {



  left: 0px;



}







.carousel-indicators {}







.carousel-indicators [data-bs-target] {



  box-sizing: content-box;



  flex: 0 1 auto;



  width: 10px;



  height: 12px;



  padding: 0;



  margin: 3px !important;



  text-indent: -999px;



  cursor: pointer;



  background-color: #fff;



  background-clip: padding-box;



  border: 0;



  border-top: 10px solid transparent;



  border-bottom: 10px solid transparent;



  opacity: 1;



  /* transition: opacity 0.6s ease; */



  border-radius: 20px;



}







.carousel-caption {



  position: absolute;



  top: 0;



  width: 100%;



  height: 100%;



  left: 0;



  right: 0;



  margin: 0;



  padding: 0;



  color: #fff;



  text-align: left;



  display: -webkit-box;



  display: -moz-box;



  display: -ms-flexbox;



  display: -webkit-flex;



  display: flex;



  align-items: center;



  background: rgba(0, 0, 0, 0.1);



}







.carousel-indicators li {



  border: none;



  border-radius: 100%;



  -webkit-border-radius: 100%;



  -moz-border-radius: 100%;



  background: #fff;



  width: 12px;



  height: 12px;



  margin: 0;



}







.carousel-indicators .active {



  margin: 0;



  background-color: #28b16d;



  width: 10px;



  height: 12px;



}







/*banner css end*/







/*about start*/



section.about {



  padding: 100px 0px;



}







.abt-txt h3 {



  font-size: 45px;



  line-height: 50px;



  color: #fff;



  margin-bottom: 10px;



}







.abt-txt {



  background-color: #b3242b;



  padding: 35px;



  border-radius: 15px;



}







.abt-txt p {



  font-size: 14px;



  color: #fff;



}







.our-miss h5 {



  font-size: 17px;



  line-height: 20px;



  color: #fff;



}







.our-miss {



  margin-top: 40px;



  padding-left: 20px;



  border-left: 1px solid #fff;



  position: relative;



}







.abt-txt-img {



  margin-top: 30px;



}







.abt-txt-img h4 {



  font-size: 17px;



  color: #171717;



  margin-bottom: 10px;



}







.abt-txt-img p {



  font-size: 14px;



  color: #171717;



}







.abt-img img {



  width: 100%;



}







.our-miss::before {



  position: absolute;



  top: 0;



  left: -2px;



  content: '';



  width: 3px;



  background-color: #fff;



  height: 34px;



}







/*about end*/



/*SUPPORT START*/



.sup-slid .slick-active {



  opacity: 1;



  margin-bottom: 10px;



}







section.peer-support {



  padding: 100px 0px;



  background-color: #f4f4f4;



}







.peer-support-txt {



  text-align: center;



  margin-bottom: 30px;



}







.peer-support-txt h3 {



  font-size: 45px;



  line-height: 50px;



  color: #141414;



  margin-bottom: 10px;



  font-weight: 300;



}







.peer-support-txt p {



  font-size: 14px;



  color: #141414;



  width: 57%;



  margin: 0 auto;



}







.sup-txt {



  margin-top: 20px;



}







.sup-txt ul {



  display: flex;



  align-items: center;



  justify-content: space-between;



  padding-bottom: 10px;



  border-bottom: 1px solid #d9d9d9;



}







.sup-txt ul li h5 {font-size: 14px;line-height: 21px;margin: 0;color: #171717;}







.sup-txt ul li h6 {



  font-size: 20px;



  color: #872427;



  margin: 0;



}







.sup-txt p {



  font-size: 14px;



  color: #171717;



}







.sup-txt a.btn-1 img {



  width: 35px;



}







.sup-main-bx {

padding: 20px;

position: relative;

border-radius: 15px;

background-color: #fff;

height: 657px;
}







.service-box-bg {



  padding: 3px;



  overflow: hidden;



  position: relative;



  border-radius: 20px;



  /* background-color: #872427; */



  border: 1px solid #872427;



}







.service-box-bg::before {



  position: absolute;



  width: 80px;



  left: 0;



  top: 0;



  margin: auto;



  bottom: 0;



  height: 1000px;



  right: 0;



  content: '';



  background-color: #872427;



  animation: rotateInfinite 10s linear infinite;



  /* Add this line */



}







/* Add this keyframe animation */



@keyframes rotateInfinite {



  from {



    transform: rotate(0deg);



  }







  to {



    transform: rotate(360deg);



  }



}







/*SUPPRT END*/







/*laptop start*/



section.create-your {



    padding: 100px 0px;



}



.create-your-txt h3 {



    font-size: 45px;



    line-height: 60px;



    color: #141414;



    position: relative;



}



.create-your-txt p {



    font-size: 14px;



    color: #0b0a0a;



}



.laptop-img img {



    width: 100%;



}



.create-your-txt h3::before {



    position: absolute;



    top: 144px;



    right: -339px;



    width: 727px;



    content: '';



    height: 2px;



    background-color: #00000057;



}







.create-your-txt h3 span {



    display: block;



}



.create-your-txt h3::after {



    position: absolute;



    right: 348px;



    width: 42px;



    height: 4px;



    content: '';



    background-color: #b7262e;



    top: 143px;



     animation: moveRight 3s ease-in-out infinite;



}



 @keyframes moveRight {



  0% {



    transform: translateX(0);



  }



  50% {



    transform: translateX(650px);



  }



  100% {



    transform: translateX(0);



  }



}







/*laptop end*/







/*chose-start*/



.chose-txt h3 {



    font-size: 45px;



    font-weight: 400;



    color: #121212;



    margin-bottom: 10px;



}



.chose-txt ul li h5 {



    font-size: 14px;



    margin: unset;



    line-height: 30px;



    color: #0e0d0d;



    border-bottom: 1px solid #00000066;



    width: auto;



}



.chose-txt p {



    font-size: 14px;



    color: #0f0e0e;



}



.chose-txt ul {/*   display: flex;*/justify-content: space-between;width: 80%;margin-bottom: 10px;}







.chose-txt ul li {display: flex;align-items: center;gap: 10px;margin-bottom: 11px;}



section.chose-us {



    padding: 100px 0px;



}



.chose-txt {



    margin-left: 4%;



    width: 90%;



}



.chose-img img {



    width: 100%;



    height: 510px;



    object-fit: cover;



    border-radius: 15px;



}



/*chose end*/



/*footer-start*/







.footerSec {



    padding: 5% 0 0;



    background: #070707;



}



.footer-logo h2 {



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



    font-size: 49.02px;



    line-height: 40.85px;



    color: #ffffff;



    font-weight: 700;



    text-transform: uppercase;



    padding: 8px;



    border: 1px solid #ffffff;



    border-radius: 9px;



    text-align: center;







}



.footer-logo p {



    margin: 8% 0;



    color: #ffffff;



}



.footer-logo ul li a{



    color: #ffffff;



    background-color: #067c8a;



}



/*.footer-logo ul li a {



    color: #ffffff;



    background-color: #86bee7;



    height: 40px;



    width: 37px;



    display: flex;



    justify-content: center;



    align-items: center;



    border-radius: 7px;



}*/



/*.footer-logo ul li a:hover {



    box-shadow: 0 0 10px 0 #86bee7 inset, 0 0 10px 4px #86bee7;



    color: #ffffff;



    background-color: transparent;



}*/



/*.footer-logo ul{



    display: flex;



    gap: 15px;



}*/



.footerSec h5 {



    font-size: 18px;



    line-height: 20px;



    color: #ffffff;



    font-weight: 400;



    text-transform: uppercase;



    margin-bottom: 10%;



    position: relative;



    /* font-family: 'Display-Regular'; */



    border-bottom: 1px solid #fff;



    padding-bottom: 20px;



    width: fit-content;



}



/*.footerSec h5:after {



    content: "";



   background-color: #86bee7;



    position: absolute;



    height: 4px;



    width: 20%;



    bottom: -14px;



    left: 0;



    



}



*/



.foot-links ul li a {



    font-size: 14px;



    line-height: 36px;



    color: #ffffff;



    /* text-transform: uppercase; */



    font-family: 'Montserrat';



}



.foot-links ul li a:hover {



    color: #fe303b;



}



.footer-contact ul li {



    display: flex;



    align-items: center;



    padding: 0 0 13px;



}



.footer-contact ul li a{



    color: #ffffff;







}



.footer-contact ul li a:hover{



     color: #067c8a;



}







.footer-contact ul li i {



    color: #ffffff;



    padding-right: 9px;



}



.footer-contact ul li p{



    color: #ffffff;



        margin: 0;



}



.news-letter p{



    color: #ffffff;



    /* margin-bottom: 30px; */



    line-height: 50px;



    margin-bottom: 0;



    font-size: 13px;



}



.news-letter input {



    height: 60px;



    width: 95%;



    border: 0;



    border-radius: 4px;



    padding-left: 20px;



    background: transparent;



    border: solid white 0.5px;



    border-radius: 31px;



        color: white;



}







.news-letter ::placeholder{



    color: #fff;







}



.news-letter button.btn-theme {



    border: 0;



    border-radius: 12px;



    margin-top: 20px;



}



.footer-btm {



    /* background-color: #067c8a; */



    padding: 10px 0;



    margin-top: 5%;



    border-top: 1px solid #ffffff61;



}



.copy-txt p {



    line-height: 25px;



    color: #ffffff;



    /* text-align: center; */



    /* text-transform: uppercase; */



    font-size: 14px;



    font-family: 'Montserrat';



}



.news-btn a.btn1 {



    /* width: 55%; */



    margin-top: 10px;



    border-radius: 10px;



    background: #58c749;



    height: 50px;



    width: 96%;



    display: flex;



    align-items: center;



    justify-content: center;



    border-radius: 67px;



    color: #ffffff;



    font-size: 16px;



    font-family: 'Montserrat';



    text-transform: uppercase;



}







ul.footer_social {



    display: flex;



   /* margin-top: 60px;*/



}



.list-inline {



    padding-left: 0;



    list-style: none;



}







ul.footer_social li {



    margin-right: 10px;



}











ul.footer_social li a {



    line-height: 49px;



    color: #fff;



    font-size: 16px;



    font-family: 'Roboto';



}







 ul.footer_social li a i {



    transition: .5s ease-in-out;



}



ul.footer_social li a i {



    display: flex;



    align-items: center;



    justify-content: center;



    color: #fff;



    height: 40px;



    width: 40px;



    border-radius: 50%;



    transition: 0.3s ease-in-out;



}



/*ul.footer_social li a i {



    width: 30px;



}*/



.col-f1 {



    background-color: #3b5998;



}



.col-f2 {



    background-color: #0e76a8;



}



.col-f3 {



    background-color: #2296f9;



}



.col-f4 {



    background-color: #cd1f29;



}







/*.footer-logo {



    margin-top: 21px;



}*/



.copy-txt {



    /* text-align: end; */



}











.footer-socials h6 {



    font-size: 20px;



    font-family: 'Trajan-Pro-3';



    text-transform: uppercase;



    color: #fff;



    margin: 6px 0;



}



.footer-socials {



    margin: 50px 0 0;



}







.footer-socials ul {



    display: flex;



    align-items: center;



    justify-content: start;



    gap: 8px;



}







.footer-socials ul li a i {



    display: flex;



    align-items: center;



    justify-content: center;



    height: 35px;



    width: 35px;



    background-color: #fe303b;



    border-radius: 100px;



    color: #ffffff;



    /* border: 1px solid #ffffff; */



    transition: ease-out;



    transition-duration: 0.2s;



}



.visa_icon {



    text-align: end;



}



ul.ftr-list li a {



    display: flex;



    align-items: center;



    gap: 15px;



}



.foot-links.tw ul {



/* column-count: 2; */

}



.foot-links {



    margin-left: 21px;



}







.foot-links.tw {



margin-left: 40px;

}



.footer-logo img {

    /* border-bottom: 1px solid #fff; */

    /* padding-bottom: 25px; */

    width: 40%;

    margin-top: -40px;

    background-color: #fff;

    padding: 10px;

}



/*footer-end*/



img.img-sopnser {



    width: 100%;



    height: 640px;



    object-fit: cover;



}



.spnser-img {



    position: absolute;



    bottom: 0;



    top: auto;



}







section.sponser {



    position: relative;



}



.spnser-img.tw {



    right: 40px;



    left: unset;



}







.spnser-img img {



    height: 600px;



    object-fit: cover;



}



section.sponser .container-fluid{



  position: relative;



}



.sponser-txt {



    position: absolute;



    text-align: center;



    width: 50%;



    bottom: unset;



    top: -573px;



    margin: 0 auto;



    display: block;



}







.sopnser-img-laptop {



    position: absolute;



    bottom: -24px;



    left: 0;



    right: 0;



    margin: 0 auto;



    display: block;



    width: fit-content;



}



.sponser-txt h3 {



    font-size: 45px;



    line-height: 55px;



    color: #fff;



    font-weight: 400;



    margin-bottom: 15px;



}







.sponser-txt h3 span {



    display: block;



}



.sponser-txt p {



    font-size: 14px;



    color: #fff;



}







.sponser-txt a.btn-1 {



    display: block;



    margin: 0 auto;



}







.real-slid .slick-active {



    opacity: 1;



}



.real-img-sm img {



    width: 60px;



    border-radius: 7px;



    height: 50px;



    object-fit: cover;



}







.real-img-sm {



    display: flex;



    align-items: center;



    gap: 20px;



}



.real-img-sm h5 {



    font-size: 17px;



    color: #2e2e2e;



    margin: 0;



    line-height: 20px;



}







.real-img-sm h5 span {



    display: block;



    font-family: 'Montserrat';



    font-size: 12px;



}



.real-talk-txt {



    text-align: center;



}







.real-talk-txt h3 {



    font-size: 45px;



    line-height: 50px;



    margin-bottom: 10px;



    font-weight: 300;



}



.real-talk-txt p {



    font-size: 14px;



    color: #141414;



    width: 60%;



    margin: 0 auto;



    margin-bottom: 30px;



}



.real-main-bx p {



    font-size: 14px;



    color: #363636;



    margin-top: 15px;



}



.star {



    display: flex;



    gap: 20px;



}



.main-bx-work:hover {

    background-color: #b3242b;

    transition: 2s;

}



.main-bx-work:hover p {

    color: #fff;

}



.main-bx-work:hover h5 {

    color: #fff;

}



.main-bx-work:hover h4 {

    background-color: #fff;

    color: #000;

}



.star ul {



    display: flex;



    align-items: center;



    margin: 0;



}







.star ul li a i {



    color: #f39f1e;



}







.star h5 {



    font-size: 14px;



    color: #363636;



    margin: 0;



}







section.real-talk {



    padding-bottom: 100px;



}



section.real-talk .container-fluid {



    padding-right: 0;



}







section.real-talk .real-slid {



    width: 103vw;



}



.real-main-bx:hover {



    background-color: #b7262e;



    color: #fff;



    padding:15px;



    border-radius: 15px;



}



.real-main-bx:hover h5{



 color: #fff;



}







.real-main-bx:hover p{



 color: #fff;



}



.real-main-bx {



    padding: 15px;



}



/*inner-banner start*/



section.main_slider.inn .carousel-inner {



    overflow: unset;



}







section.main_slider.inn .carousel-item {



    display: block;



}



section.main_slider.inn h1::before{



  display: none;



}



section.main_slider.inn ul {



    display: flex;



    align-items: center;



    gap: 10px;



}







section.main_slider.inn ul li a {



    font-size: 19px;



    color: #fff;



    font-family: 'Trajan';



}



section.main_slider.inn .banner_img img {



    height: 460px;



}

.banner-follow ul li a:hover {

    background-color: #fff;

    color: #b7262e;

    transition: 2s;

}





section.main_slider.inn img.img-fluid {



    height: 600px;



    object-fit: cover;



}



.ban-lap-top {



    position: absolute;



    bottom: 16px;



    width: 24%;



    right: 380px;



}



section.main_slider.inn .chat {



    position: absolute;



    bottom: 182px;



    right: -30px;



    transform: rotate(269deg);



    display: flex;



    align-items: center;



    gap: 20px;



}







.chat h5 {



    font-size: 14px;



    color: #fff;



    font-family: 'Montserrat';



    margin: 0;



}







.chat i {



font-size: 23px;



color: #ae262b;



background-color: #fff;



width: 50px;



height: 50px;



border-radius: 50%;



display: flex;



align-items: center;



justify-content: center;

}



section.real-talk.inn {



    padding-bottom: 0;



}



section.chose-us.inn .chose-img img {



    height: 600px;



}







* Login */







form.login-form {



    text-align: center;



    padding: 30px 31px;



    border-radius: 15px;



    box-shadow: 0px 0px 12px lightgrey;



}







form.login-form input::placeholder {



    opacity: 0.3;



}







form.login-form input:not(input[type=checkbox]) {



    width: 100%;



    height: 55px;



    margin: 0 0 25px;



    padding: 0 10px;



    border: 1px solid #c8c8c8;



    background: transparent;



    border-radius: 5px;



}







form.login-form h2 {



    margin: 0 0 15px;



    font-size: 40px;



    /* text-align: center; */



    color: #fff;



    font-weight: 500;



    /* font-family: 'Hudson-NY'; */



    text-transform: capitalize;



}







input.btn-1 {



    background: #b90f29 !important;



    border: none !important;



    text-transform: uppercase;



    color: #fff !important;



}







.form-btm {



    display: flex;



    align-items: center;



    justify-content: space-between;



    font-weight: 500;



    width: 100%;



    font-size: 13px;



    color: #918f8f;



    margin-top: 20px;



}







.reg-frombtm span {



    display: flex;



    align-items: center;



    justify-content: start;



    color: #918f8f;



    font-size: 14px;



}







.reg-frombtm {



    margin: 0 0 20px;



}







.form-btm a {



    color: #fff;



}







.reg-frombtm span a {



    color: #000;



    text-decoration: underline;



}







form.login-form input::placeholder {



    color: #000;



}







section#next-sec {



    padding: 80px 0;



}



.login-form button{



  height: 50px;



  background-color: #b0252b;



  text-transform: uppercase;



  color: #fff;



  border: none;



  font-size: 18px;



  font-family: 'Montserrat';



  font-weight: 600;



  border-radius: 100px;



  transition: 0.3s ease-in-out;



}



.login-form button:hover{



  background-color: #000;



  color: #fff;



  transition: 0.3s ease-in-out;



}



form.login-form {



    text-align: center;



    padding: 30px 31px;



    /* border-radius: 15px; */



    box-shadow: 0px 0px 3px lightgrey;



}



form.login-form.on {



    background-color: #b3242b;



    border-radius: 5px;



}



form.login-form h2 {



    color: #000;



}



form.login-form.on h2{



  color: #fff;



}



form.login-form.on button {



    border: 1px solid #fff;



}



form.login-form.on input {



    color: #fff;



}







form.login-form.on input::placeholder {



    color: #fff;



}



.form-btm span {



    color: #fff;



}



/*login-page*/







/*contact-page start*/



section.contact-pg {



    padding: 100px 0px;



}



.cont-bx {



    background-color: #b3242b;



    padding: 70px 20px;



    border-radius: 10px;



}







.cont-bx h3 {



    font-size: 19px;



    line-height: 11px;



    margin-bottom: 16px;



    color: #fff;



    font-weight: 400;



    padding-bottom: 15px;



    border-bottom: 1px solid #fff;



    width: 75%;



}



.cont-bx a {



    color: #fff;



}



.cont-bot-txt {



    text-align: center;



}



.cont-bot-txt h3 {



    font-size: 45px;



    line-height: 50px;



    margin-bottom: 10px;



}



.cont-bot-txt p {



font-size: 14px;



width: 61%;



margin: 0 auto;



margin-bottom: 40px;

}



.cont-bot-txt form input {



    width: 100%;



    padding: 15px;



    margin-bottom: 30px;



    border: 1px solid #c5c5c5;



    color: #000;



}



.cont-bot-txt form textarea {



    width: 100%;



    padding: 15px;



    margin-bottom: 30px;



    border: 1px solid #c5c5c5;



    color: #000;



    height: 150px;



}



.cont-bot-txt form button {



    display: flex;



    align-items: center;



    font-size: 14px;



    font-weight: 500;



    color: #fff;



    background-color: #b7262e;



    width: fit-content;



    padding: 10px 10px;



    border-radius: 100px;



    border: 1px solid #fff;



    gap: 17px;



    padding-left: 17px;



    margin: 0 auto;



}







section.sponser-main-pg {



    padding: 100px 0px;



}







.sponser-txt-main h3 {



    font-size: 45px;



    font-weight: 300;



    color: #181818;



    line-height: 55px;



}







.sponser-txt-main h3 span {



    display: block;



}







.sponser-txt-main p {



    font-size: 14px;



    color: #181818;



}



section.peer-support.inn {



background-color: unset;



padding-top: 60px;

}



section.how-it-work {



    padding-bottom: 100px;



}



.how-it-work-txt {



    text-align: center;



    margin-bottom: 40px;



}







.how-it-work-txt h3 {



    font-size: 45px;



    line-height: 50px;



    font-weight: 400;



    color: #141414;



    margin-bottom: 10px;



}



.how-it-work-txt p {



    width: 50%;



    margin: 0 auto;



    font-size: 14px;



}







.main-bx-work {



    text-align: center;



    padding: 30px 20px;



    border-radius: 5px;



    background-color: rgb(255, 255, 255);



    box-shadow: 0px 32px 84px 0px rgba(16, 16, 16, 0.04);



}



.main-bx-work h4 {



    font-size: 25px;



    color: #fff;



    height: 50px;



    width: 50px;



    background-color: #b3242b;



    border-radius: 5px;



    display: flex;



    align-items: center;



    justify-content: center;



    margin: 0 auto;



    margin-bottom: 30px;



}



.main-bx-work h5 {



    font-size: 20px;



    line-height: 30px;



    margin-bottom: 10px;



    color: #141414;



}







.main-bx-work p {



    font-size: 13px;



    color: #141414;



}



section.main_slider .ban-lap-top {



    width: 50%;



    right: 130px;



}



section.main_slider .chat {



    top: 213px;



    right: 0;



    position: absolute;



    right: -30px;



    transform: rotate(269deg);



    display: flex;



    align-items: center;



    gap: 20px;



}







.a-track-slider-contorl {



    display: flex;



    margin: 50px 0px 25px;



    align-items: center;



    justify-content: center;



}







.a-trackr-btn {



    gap: 25px;



    width: 50%;



    display: flex;



    position: relative;



    align-items: center;



    justify-content: center;



}







.a-trackr-btn button {



    border: none;



    background-color: transparent;



}







.a-track-number {



    width: 500px;



    position: relative;



}







.a-track-number .slide_counter h2 {



    color: #000;



    margin-bottom: 0;



    display: flex;



    height: 100%;



    gap: 190px;



    font-size: 25px;



    font-weight: 400;



    align-items: center;



    justify-content: space-between;



}







.a-track-number .progress {



    display: block;



    width: 80%;



    height: 1px;



    border-radius: 10px;



    overflow: hidden;



    bottom: 0%;



    background-color: #dcc6c7;



    background-image: linear-gradient(to right, #080e28, #ffffff4b);



    background-repeat: no-repeat;



    background-size: 0 100%;



    transition: background-size 0.4s ease-in-out;



    position: absolute;



    left: 0;



    top: 0;



    right: 0;



    margin: auto;



}











.a-track-slider-contorl {



    display: flex;



    margin: 50px 0px 25px;



    align-items: center;



    justify-content: center;



}







.a-trackr-btn {



    gap: 25px;



    width: 50%;



    display: flex;



    position: relative;



    align-items: center;



    justify-content: center;



}







.a-trackr-btn button {



    border: none;



    background-color: transparent;



}



.sup-slid .slick-prev,



.sup-slid .slick-next {



    top: 110%;



    z-index: 1;



    opacity: 1 !important;



}







.sup-slid .slick-prev {



    left: 46%;



}







.sup-slid .slick-next {



    right: 45px;



}



.a-track-number .slide_counter h2 span.start_number {



    color: #b7262e;



}







 .sup-slid .slick-arrow {



    display: none;



}



 



.sup-slid .slick-arrow:before {



    display: none;



} 







/*.banner-follow::before {



    top: 0;



    left: 0;



    right: 0;



    bottom: 0;



    width: 1px;



    content: '';



    height: 100%;



    margin: auto;



    position: absolute;



    background-color: #ffffff6e;



    z-index: -1;



}*/







.banner-follow {



    gap: 80px;



    z-index: 11;



    display: flex;



    height: 680px;



    position: absolute;



    align-items: center;



    padding-bottom: 25px;



    flex-direction: column;



    justify-content: flex-end;



    bottom: 2px;



    right: 24px;



}



.banner-follow ul li a {



    width: 40px;



    height: 40px;



    display: flex;



    color: #ffffff6e;



    border-radius: 50%;



    align-items: center;



    justify-content: center;



    border: 1px solid #ffffff6e;



}



.banner-follow ul {



    gap: 20px;



    display: flex;



    position: relative;



    align-items: center;



    flex-direction: column;



    justify-content: center;



}



.banner-follow h5 {



    transform: rotate(180deg);



    font-size: 12px;



    color: #fff;



    writing-mode: sideways-rl;



}



a.btn-1:hover {



    background-color: #070707;



    transition: 1s;



}









.main_slider .nike-zoom-progress-barchg .progress-ban {

    display: block;

    width: 250px;

    height: 3px !important;

    border-radius: 10px;

    overflow: hidden;

    background-color: #fff;

    background-image: linear-gradient(to right, #579dc4, #579dc4);

    background-repeat: no-repeat;

    background-size: 0 100%;

    transition: background-size 0.4s ease-in-out;

    position: absolute;

    left: 124px;

    bottom: 6.5%;

    transform: rotate(0deg);

}



.main_slider .nike-zoom-silder-number {

    position: absolute;

    bottom: 4px;

    left: 0;

    height: 30%;

}



.main_slider .nike-zoom-sec:before {

    content: "";

    position: absolute;

    background: linear-gradient(287deg, #d62a3a, transparent);

    width: 100%;

    height: 80px;

    bottom: 0;

    left: 0;

}



.main_slider .slide_counter h2 {

    margin-bottom: 0;

    display: flex;

    align-items: center;

    color: #fff;

    height: 100%;

}



.main_slider span.start_number {

    font-size: 20px;

    margin-left: 0;

    position: absolute;

    bottom: 46%;

    left: 99px;

    width: 32px;

    /* font-family: 'Oswald'; */

}



.main_slider span.end_number {

    font-size: 20px;

    margin-left: 0;

    position: absolute;

    bottom: 35%;

    left: 380px;

    width: 43px;

    /* font-family: 'Oswald'; */

    right: unset;

}

.carousel-control-prev, .carousel-control-next {

    position: absolute;

    top: auto;

    bottom: 38px;

    left: 0;

    left: 420px;

    opacity: 1;

    width: auto;

    right: auto;

}



.carousel-control-prev {

    left: 56px;

    right: auto;

}



.main_slider .slide_counter h2 {

    width: 600px;

    position: absolute;

    bottom: 20px;

    left: 0;

    height: auto;

    right: unset;

}



span.carousel-control-prev-icon {

    background-image: url(../images/banner-slider-btn-left.png);

    background-repeat: no-repeat;

    background-size: cover;

    filter: brightness(0) invert(1);

}



span.carousel-control-next-icon {

    background-image: url(../images/banner-slider-btn-right.png);

    background-repeat: no-repeat;

    background-size: cover;

    filter: brightness(0) invert(1);

}



section.chose-us.inn .chose-txt {

    margin: unset;

    width: 100%;

}



section.chose-us.inn .chose-txt ul {

    width: 100%;

    border: unset;

}



section.chose-us.inn .chose-txt ul li {

    display: block;

    border: unset;

}



section.chose-us.inn .chose-txt ul li h5 {

    border: unset;

    font-size: 14px;

    line-height: 21px;

}



section.chose-us.inn .chose-txt ul li p {

    font-size: 13px;

}

section.sponser-main-pg.conn .sponser-txt-main h3 {

    font-size: 31px;

    line-height: 42px;

    margin-bottom: 10px;

}

section.real-talk.inn {

    padding: 100px 0px;

}



section.shop {

    padding: 100px 0px;

}

.shop-bx img {

    width: 100%;

    height: 300px;

    object-fit: cover;

}

.shop-txt-bot h2 {

font-size: 30px;

text-align: center;

line-height: 33px;

margin-top: 20px;
}









/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ Chat ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++  */



#frame {

width: 100%;

min-width: 360px;

max-width: 100%;

height: 92vh;

min-height: 300px;

max-height: 720px;

background: #e6eaea;

margin: 0 auto;

margin-top: 6vh;
}



@media screen and (max-width: 360px) {

    #frame {

        width: 100%;

        height: 100vh;

    }

}



#frame #sidepanel {

    float: left;

    min-width: 280px;

    max-width: 340px;

    width: 40%;

    height: 100%;

    background: linear-gradient(0deg, hsl(195deg 13% 6%) 12%, hsl(214deg 6% 21%) 48%, hsl(216deg 6% 29%) 53%, hsl(216deg 6% 29%) 55%, hsl(214deg 6% 21%) 59%, hsl(195deg 13% 6%) 89%);

    color: #f5f5f5;

    overflow: hidden;

    position: relative;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel {

        width: 58px;

        min-width: 58px;

    }

}



#frame #sidepanel #profile {

    width: 80%;

    margin: 25px auto;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #profile {

        width: 100%;

        margin: 0 auto;

        padding: 5px 0 0 0;

        background: #32465a;

    }

}



#frame #sidepanel #profile.expanded .wrap {

    height: 210px;

    line-height: initial;

}



#frame #sidepanel #profile.expanded .wrap p {

    margin-top: 20px;

}



#frame #sidepanel #profile.expanded .wrap i.expand-button {

    -moz-transform: scaleY(-1);

    -o-transform: scaleY(-1);

    -webkit-transform: scaleY(-1);

    transform: scaleY(-1);

    filter: FlipH;

    -ms-filter: "FlipH";

}



#frame #sidepanel #profile .wrap {

    height: 50px;

    line-height: 60px;

    overflow: hidden;

    -moz-transition: 0.3s height ease;

    -o-transition: 0.3s height ease;

    -webkit-transition: 0.3s height ease;

    transition: 0.3s height ease;

    display: flex;

    align-items: center;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #profile .wrap {

        height: 55px;

    }

}



#frame #sidepanel #profile .wrap img {

    width: 50px;

    border-radius: 50%;

    padding: 3px;

    border: 2px solid #e74c3c;

    height: auto;

    float: left;

    cursor: pointer;

    -moz-transition: 0.3s border ease;

    -o-transition: 0.3s border ease;

    -webkit-transition: 0.3s border ease;

    transition: 0.3s border ease;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #profile .wrap img {

        width: 40px;

        margin-left: 4px;

    }

}



#frame #sidepanel #profile .wrap img.online {border: 2px solid #ae262b;display: none;}



#frame #sidepanel #profile .wrap img.away {

    border: 2px solid #f1c40f;

}



#frame #sidepanel #profile .wrap img.busy {

    border: 2px solid #e74c3c;

}



#frame #sidepanel #profile .wrap img.offline {

    border: 2px solid #95a5a6;

}



#frame #sidepanel #profile .wrap p {

    float: left;

    margin-left: 15px;

    margin-top: 14px;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #profile .wrap p {

        display: none;

    }

}



#frame #sidepanel #profile .wrap i.expand-button {

    float: right;

    margin-top: 23px;

    font-size: 0.8em;

    cursor: pointer;

    color: #435f7a;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #profile .wrap i.expand-button {

        display: none;

    }

}



#frame #sidepanel #profile .wrap #status-options {

    position: absolute;

    opacity: 0;

    visibility: hidden;

    width: 150px;

    margin: 70px 0 0 0;

    border-radius: 6px;

    z-index: 99;

    line-height: initial;

    background: #435f7a;

    -moz-transition: 0.3s all ease;

    -o-transition: 0.3s all ease;

    -webkit-transition: 0.3s all ease;

    transition: 0.3s all ease;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #profile .wrap #status-options {

        width: 58px;

        margin-top: 57px;

    }

}



#frame #sidepanel #profile .wrap #status-options.active {

    opacity: 1;

    visibility: visible;

    margin: 75px 0 0 0;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #profile .wrap #status-options.active {

        margin-top: 62px;

    }

}



#frame #sidepanel #profile .wrap #status-options:before {

    content: '';

    position: absolute;

    width: 0;

    height: 0;

    border-left: 6px solid transparent;

    border-right: 6px solid transparent;

    border-bottom: 8px solid #435f7a;

    margin: -8px 0 0 24px;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #profile .wrap #status-options:before {

        margin-left: 23px;

    }

}



#frame #sidepanel #profile .wrap #status-options ul {

    overflow: hidden;

    border-radius: 6px;

    margin: 0;

}



#frame #sidepanel #profile .wrap #status-options ul li {

    padding: 15px 0 30px 18px;

    display: block;

    cursor: pointer;

    position: relative;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #profile .wrap #status-options ul li {

        padding: 15px 0 35px 22px;

    }

}



#frame #sidepanel #profile .wrap #status-options ul li:hover {

    background: #496886;

}



#frame #sidepanel #profile .wrap #status-options ul li span.status-circle {

    position: absolute;

    width: 10px;

    height: 10px;

    border-radius: 50%;

    margin: 5px 0 0 0;

    left: 20px;

    top: 30px;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #profile .wrap #status-options ul li span.status-circle {

        width: 14px;

        height: 14px;

    }

}



#frame #sidepanel #profile .wrap #status-options ul li span.status-circle:before {

    content: '';

    position: absolute;

    width: 14px;

    height: 14px;

    margin: -2px 0 0 -3px;

    background: transparent;

    border-radius: 50%;

    z-index: 0;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #profile .wrap #status-options ul li span.status-circle:before {

        height: 18px;

        width: 18px;

    }

}



#frame #sidepanel #profile .wrap #status-options ul li p {

    padding-left: 12px;

    width: 100%;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #profile .wrap #status-options ul li p {

        display: none;

    }

}



#frame #sidepanel #profile .wrap #status-options ul li#status-online span.status-circle {

    background: #2ecc71;

}



#frame #sidepanel #profile .wrap #status-options ul li#status-online.active span.status-circle:before {

    border: 1px solid #2ecc71;

}



#frame #sidepanel #profile .wrap #status-options ul li#status-away span.status-circle {

    background: #f1c40f;

}



#frame #sidepanel #profile .wrap #status-options ul li#status-away.active span.status-circle:before {

    border: 1px solid #f1c40f;

}



#frame #sidepanel #profile .wrap #status-options ul li#status-busy span.status-circle {

    background: #e74c3c;

}



#frame #sidepanel #profile .wrap #status-options ul li#status-busy.active span.status-circle:before {

    border: 1px solid #e74c3c;

}



#frame #sidepanel #profile .wrap #status-options ul li#status-offline span.status-circle {

    background: #95a5a6;

}



#frame #sidepanel #profile .wrap #status-options ul li#status-offline.active span.status-circle:before {

    border: 1px solid #95a5a6;

}



#frame #sidepanel #profile .wrap #expanded {

    padding: 80px 0 0 0;

    display: block;

    line-height: initial !important;

}



#frame #sidepanel #profile .wrap #expanded label {

    float: left;

    clear: both;

    margin: 0 8px 5px 0;

    padding: 5px 0;

}



#frame #sidepanel #profile .wrap #expanded input {

    border: none;

    margin-bottom: 6px;

    background: #f5f5f5;

    border-radius: 3px;

    color: #000;

    padding: 7px;

    width: calc(100% - 43px);

}



#frame #sidepanel #profile .wrap #expanded input:focus {

    outline: none;

    background: linear-gradient(180deg, rgb(22 150 44) 41%, rgb(43 184 72) 78%);

    color: #fff;

}



#frame #sidepanel #search {border-top: 1px solid #32465a;border-bottom: 1px solid #32465a;font-weight: 300;display: none;}



@media screen and (max-width: 735px) {

    #frame #sidepanel #search {

        display: none;

    }

}



#frame #sidepanel #search label {

    position: absolute;

    margin: 10px 0 0 20px;

}



#frame #sidepanel #search input {

    font-family: "proxima-nova", "Source Sans Pro", sans-serif;

    padding: 10px 0 10px 46px;

    width: calc(100% - 0px);

    border: none;

    background: #b7262e;

    color: #f5f5f5;

}



#frame #sidepanel #search input:focus {

    outline: none;

    background: #42454a;

}



#frame #sidepanel #search input::-webkit-input-placeholder {

    color: #f5f5f5;

}



#frame #sidepanel #search input::-moz-placeholder {

    color: #f5f5f5;

}



#frame #sidepanel #search input:-ms-input-placeholder {

    color: #f5f5f5;

}



#frame #sidepanel #search input:-moz-placeholder {

    color: #f5f5f5;

}



#frame #sidepanel #contacts {

    height: calc(100% - 177px);

    overflow-y: scroll;

    overflow-x: hidden;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #contacts {

        height: calc(100% - 149px);

        overflow-y: scroll;

        overflow-x: hidden;

    }



    #frame #sidepanel #contacts::-webkit-scrollbar {

        display: none;

    }

}



#frame #sidepanel #contacts.expanded {

    height: calc(100% - 334px);

}



#frame #sidepanel #contacts::-webkit-scrollbar {

    width: 8px;

    background: #2c3e50;

}



#frame #sidepanel #contacts::-webkit-scrollbar-thumb {

    background-color: #243140;

}



#frame #sidepanel #contacts ul li.contact {

    position: relative;

    padding: 10px 0 15px 0;

    font-size: 0.9em;

    cursor: pointer;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #contacts ul li.contact {

        padding: 6px 0 46px 8px;

    }

}



#frame #sidepanel #contacts ul li.contact:hover {

    background: #32465a;

}



#frame #sidepanel #contacts ul li.contact.active {

    /* background: linear-gradient(180deg, rgba(22, 150, 44, 1) 41%, rgba(43, 184, 72, 1) 78%); */

    border-right: 5px solid #435f7a;

}



#frame #sidepanel #contacts ul li.contact.active span.contact-status {

    border: 2px solid #32465a !important;

}



#frame #sidepanel #contacts ul li.contact .wrap {

    width: 88%;

    margin: 0 auto;

    position: relative;

    /* display: flex; */

    align-items: center;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #contacts ul li.contact .wrap {

        width: 100%;

    }

}



#frame #sidepanel #contacts ul li.contact .wrap span {

    position: absolute;

    right: -10px;

    margin: -2px 0 0 -2px;

    width: 10px;

    height: 10px;

    border-radius: 50%;

    border: 2px solid #2c3e50;

    background: #95a5a6;

}



#frame #sidepanel #contacts ul li.contact .wrap span.online {

    background: #2ecc71;

}



#frame #sidepanel #contacts ul li.contact .wrap span.away {

    background: #f1c40f;

}



#frame #sidepanel #contacts ul li.contact .wrap span.busy {

    background: #e74c3c;

}



#frame #sidepanel #contacts ul li.contact .wrap img {width: 60px;border-radius: 0;float: left;margin-right: 10px;border-radius: 3px;display: none;}



@media screen and (max-width: 735px) {

    #frame #sidepanel #contacts ul li.contact .wrap img {

        margin-right: 0px;

    }

}



#frame #sidepanel #contacts ul li.contact .wrap .meta {

    padding: 5px 0 0 0;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #contacts ul li.contact .wrap .meta {

        display: none;

    }

}



#frame #sidepanel #contacts ul li.contact .wrap .meta .name {

    font-weight: 600;

    margin-bottom: 9px;

}



#frame #sidepanel #contacts ul li.contact .wrap .meta .preview {

    margin: 5px 0 0 0;

    padding: 0 0 1px;

    font-weight: 400;

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;

    -moz-transition: 1s all ease;

    -o-transition: 1s all ease;

    -webkit-transition: 1s all ease;

    transition: 1s all ease;

}



#frame #sidepanel #contacts ul li.contact .wrap .meta .preview span {

    position: initial;

    border-radius: initial;

    background: none;

    border: none;

    padding: 0 2px 0 0;

    margin: 0 0 0 1px;

    opacity: 0.5;

}



#frame #sidepanel #bottom-bar {

    position: absolute;

    width: 100%;

    bottom: 0;

}



#frame #sidepanel #bottom-bar button {

    float: left;

    border: none;

    width: 50%;

    padding: 10px 0;

    background: #ae262b;

    color: #f5f5f5;

    cursor: pointer;

    font-size: 0.85em;

    font-family: "proxima-nova", "Source Sans Pro", sans-serif;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #bottom-bar button {

        float: none;

        width: 100%;

        padding: 15px 0;

    }

}



#frame #sidepanel #bottom-bar button:focus {

    outline: none;

}



#frame #sidepanel #bottom-bar button:nth-child(1) {

    border-right: 1px solid #ffffff;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #bottom-bar button:nth-child(1) {

        border-right: none;

        border-bottom: 1px solid #2c3e50;

    }

}



#frame #sidepanel #bottom-bar button:hover {

    background: #0d1011;

}



section.chat #frame #sidepanel #bottom-bar button i {

    margin-right: 3px;

    font-size: 1em;

    height: unset;

    width: unset;

    display: unset;

    background-color: unset;

    color: #fff;

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #bottom-bar button i {

        font-size: 1.3em;

    }

}



@media screen and (max-width: 735px) {

    #frame #sidepanel #bottom-bar button span {

        display: none;

    }

}



#frame .content {

    float: right;

    width: 60%;

    height: 100%;

    overflow: hidden;

    position: relative;

}



@media screen and (max-width: 735px) {

    #frame .content {

        width: calc(100% - 58px);

        min-width: 300px !important;

    }

}



@media screen and (min-width: 900px) {

    #frame .content {

        width: calc(100% - 340px);

    }

}



#frame .content .contact-profile {

    width: 100%;

    height: 60px;

    line-height: 60px;

    background: #f5f5f5;

    display: flex;

    align-items: center;

    justify-content: space-between;

}


#frame .content .contact-profile .social-media i.fas.fa-phone-alt {
    transform: rotate(90deg);
}
#frame .content .contact-profile img {

width: 40px;

border-radius: 50%;

float: left;

margin: 9px 12px 0 9px;

height: 40px;
}



#frame .content .contact-profile .d-flex {

    align-items: center;

}



#frame .content .contact-profile p {

    margin: 0;

}



#frame .content .contact-profile .social-media {

float: right;

display: flex;

align-items: center;

/* display: none; */
}



#frame .content .contact-profile .social-media i {

margin-left: 14px;

cursor: pointer;

-webkit-background-clip: text;

/* -webkit-text-fill-color: transparent; */

font-family: 'FontAwesome';

color: #ae262b;

height: unset;

width: unset;

display: unset;

font-size: 20px;
}



#frame .content .contact-profile .social-media i:nth-last-child(1) {

    margin-right: 20px;

}



#frame .content .contact-profile .social-media i:hover {

    color: #435f7a;

}



#frame .content .messages {

    height: auto;

    min-height: calc(100% - 93px);

    max-height: calc(100% - 93px);

    overflow-y: scroll;

    overflow-x: hidden;

}



@media screen and (max-width: 735px) {

    #frame .content .messages {

        max-height: calc(100% - 105px);

    }

}



#frame .content .messages::-webkit-scrollbar {

    width: 8px;

    background: rgba(0, 0, 0, .0);

}



#frame .content .messages::-webkit-scrollbar-thumb {

    background-color: rgba(0, 0, 0, .3);

}



#frame .content .messages ul li {

    display: inline-block;

    clear: both;

    float: left;

    margin: 15px 15px 5px 15px;

    width: calc(100% - 25px);

    font-size: 0.9em;

}



#frame .content .messages ul li:nth-last-child(1) {

    margin-bottom: 20px;

}



#frame .content .messages ul li.sent img {

    margin: 6px 8px 0 0;

}



#frame .content .messages ul li.sent p {

    background: #000;

    color: #f5f5f5;

}



#frame .content .messages ul li.replies img {

    float: right;

    margin: 6px 0 0 8px;

}



#frame .content .messages ul li.replies p {

background: #b7262e;

float: right;
}



#frame .content .messages ul li img {

    width: 22px;

    border-radius: 50%;

    float: left;

}



#frame .content .messages ul li p {

    display: inline-block;

    padding: 10px 15px;

    border-radius: 20px;

    max-width: 205px;

    line-height: 130%;

}



@media screen and (min-width: 735px) {

    #frame .content .messages ul li p {

max-width: 300px;

color: #fff;

}

}



#frame .content .message-input {

    position: absolute;

    bottom: 0;

    width: 100%;

    z-index: 99;

}



#frame .content .message-input .wrap {

    position: relative;

}



#frame .content .message-input .wrap input {

    font-family: "proxima-nova", "Source Sans Pro", sans-serif;

    float: left;

    border: none;

    width: calc(100% - 50px);

    padding: 11px 32px 10px 8px;

    font-size: 0.8em;

    color: #32465a;

}



@media screen and (max-width: 735px) {

    #frame .content .message-input .wrap input {

        padding: 15px 32px 16px 8px;

    }

}



#frame .content .message-input .wrap input:focus {

    outline: none;

}



#frame .content .message-input .wrap .attachment {

    position: absolute;

    right: 60px;

    z-index: 4;

    margin-top: 10px;

    font-size: 1.1em;

    color: #435f7a;

    opacity: 0.5;

    cursor: pointer;

}



@media screen and (max-width: 735px) {

    #frame .content .message-input .wrap .attachment {

        margin-top: 17px;

        right: 65px;

    }

}



#frame .content .message-input .wrap .attachment:hover {

    opacity: 1;

}



#frame .content .message-input .wrap button {

    float: right;

    border: none;

    width: 50px;

    padding: 12px 0;

    cursor: pointer;

    background: #ae262b;

    color: #f5f5f5;

}



@media screen and (max-width: 735px) {

    #frame .content .message-input .wrap button {

        padding: 16px 0;

    }

}



#frame .content .message-input .wrap button:hover {

    background: #435f7a;

}



#frame .content .message-input .wrap button:focus {

    outline: none;

}



section.chat ul#myTab {

    background: linear-gradient(0deg, hsl(195deg 13% 6%) 12%, hsl(214deg 6% 21%) 48%, hsl(216deg 6% 29%) 53%, hsl(216deg 6% 29%) 55%, hsl(214deg 6% 21%) 59%, hsl(195deg 13% 6%) 89%);

    margin: 0 auto;

    width: 100%;

    /* min-width: 360px; */

    /* max-width: 1000px; */

    border-bottom: unset;

}



section.chat ul#myTab li .nav-link {

    color: #fff;

    font-size: 11px;

    padding: 10px 0px;

}

.nav-tabs {

    display: flex;

    align-items: center;

    gap: 10px;

    padding: 10px 7px;

}

section.chat ul#myTab li .nav-link.active {

    border-radius: 0;

    background: #ae262b;

    border: 0;

    padding: 6px 16px;

}



.heart {font-size: 25px;color: #fff;display: none;}



.heart-des {

    font-size: 25px;

    color: red;

}



.fav {

    position: absolute;

    right: 6px;

    top: -10px;

}



section.chat .fav i {

    font-size: 11px;

    width: unset;

    height: unset;

    background-color: unset;

    display: unset;

    justify-content: unset;

    color: #000;

}

section.chat {

    padding-bottom: 100px;

}

section.chat i.fa.fa-search {

    background: unset;

    display: unset;

    width: unset;

    height: unset;

    font-size: 15px;

    color: #fff;

}

section.chat i.fa.fa-paper-plane {

    background: unset;

    height: unset;

    width: unset;

    display: unset;

    color: #fff;

}

.head-log a img {

    margin-bottom: -19px;

    margin-top: -10px;

    height: 98px;

    text-align: center;

    width: 100%;

}

section.about.inn {

    padding-bottom: 0;

}

.nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus{

  border: unset;

}





.nav-tabs {
    display: flex;
    align-items: center;
    gap: 3px;
    padding: unset;
    /* background: linear-gradient(0deg, hsl(195deg 13% 6%) 12%, hsl(214deg 6% 21%) 48%, hsl(216deg 6% 29%) 53%, hsl(216deg 6% 29%) 55%, hsl(214deg 6% 21%) 59%, hsl(195deg 13% 6%) 89%); */
    margin: 0 auto;
    width: 103%;
    /* min-width: 360px; */
    /* max-width: 1000px; */
    border-bottom: unset;
    margin-left: -20px;
}

.nav-tabs li .nav-link {
    color: #fff;
    font-size: 11px;
    padding: 8px 6px;
    background: #000;
    border-radius: unset;
    background: linear-gradient(0deg, hsl(195deg 13% 6%) 12%, hsl(214deg 6% 21%) 48%, hsl(216deg 6% 29%) 53%, hsl(216deg 6% 29%) 55%, hsl(214deg 6% 21%) 59%, hsl(195deg 13% 6%) 89%);
}

.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {

border-radius: 0;

background: #ae262b;

border: 0;

padding: 11px 6px;

color: #fff;
}
.support-img img {
    height: 330px;
    width: 100%;
    object-fit: cover;
}

section.main_slider.inn.cha h1 {
    font-size: 35px;
    line-height: 50px;
}
section.chats-pg {
    padding: 100px 0px;
}
.service-box-bg a {
    margin: 0 auto;
    margin-top: 25px;
}
section.chats-pg .container-fluid {
    padding: 0;
}
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ Chat End ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++  */