/*
Theme Name: Nathra
Description: A brief description of your themess.
Version: 1.0 
*/ 
body{font-family: "Source Sans 3", sans-serif !important;}
p{margin-bottom: 0px;direction: rtl;}
header{height: 100vh;overflow: hidden;}
a{display: inline-block;text-decoration: none !important;}
header img{width: 100%;height: 100% !important;object-fit: cover;}
.down-arrow img{position: absolute;bottom: 50px;left: 0;right: 0;margin: auto;width: 85px;height: 85px !important;object-fit: cover;}
.comments{height: 100vh;min-height: 100vh; display: flex; justify-content: center; align-items: center;position: relative;z-index: 1;text-align: center;padding: 30px 0 0;}
.comments::before{content: "";position: absolute;left: 0;right: 0;top: 0;bottom: 0;background: linear-gradient(180deg, #274244 0%, rgba(46, 77, 82, 0) 100%);z-index: -1;background: #274244; mix-blend-mode: multiply;}
.comment_section{background: #EDE9D00D;border: 1px solid #EDE9D0;border-radius: 10px;padding: 30px;color: #fff;text-align: right;}
.comments_box{color: #fff;text-align: right;}
.comments_box .comment_section img{width: 70px;}
.comments_box .comment_section .user img, .user img{height: 25px;width: 25px;border-radius: 50%;margin-right: 5px;}
.comments_box .comment_section .user, .user{display: flex;align-items: center;width: fit-content; padding: 7px 15px;border: 1px solid #fff;border-radius: 5px;}
.comments_box .comment_section p{font-size: 17px; font-weight: 400;padding: 20px 20px 20px 0; border-right: 1px solid #EDE9D0;}
.comments_box .comment_section .user p, .user p{font-size: 16px;margin-bottom: 0px; font-weight: 500;padding: 0px;border-right: 0px;}
.comment_heading{font-size: 24px;font-weight: 600;margin-bottom: 20px;display: inline-block;color: #EDE9D0;direction: rtl;}
.comments_box .comment_section .upload_video{text-align: center;cursor: pointer;}
.comments_box .comment_section .upload_video p{margin-top: 10px;font-size: 15px;font-weight: 500;color: #fff;padding: 0px;border-right: 0px;}
.comments_box .comment_section .upload_video {position: relative; text-align: center;}
.comments_box .comment_section .upload_video input{opacity: 0;height: 70px;width: 70px;position: absolute;}
.comments_box .comment_section form textarea{height: 120px;width: 100%;background: transparent;border: 0px;color: rgb(255, 255, 255);overflow: auto;padding: 30px 0;direction: rtl;}
textarea:focus-visible{outline: none;}
.reply_comment{border-top: 1px solid #EDE9D0;padding-top: 20px;text-align: left;}
.reply_comment button{background: transparent;padding: 6px 30px;box-shadow: none;border: 1px solid #fff;color: #fff;border-radius: 5px;font-size: 13px;font-weight: 400;}
.past_comment{border-bottom: 1px solid #EDE9D033;padding: 40px 0;color: #fff;text-align: right;}
.past_comment:last-child{border-bottom: 0px;}
.user{width: fit-content;}
.past_comment img, .past_comment video{border-right: 1px solid #EDE9D0;padding: 0 10px 0 0;}
.past_comment video{width: 100%;}
.past_comment .comment-video{border-right: 1px solid #EDE9D0; padding: 0 10px 0 0;}
.past_comment p{font-size: 17px;font-weight: 400;}
.comments .container{height: 100%; overflow-y: auto;}
.comments .container::-webkit-scrollbar-track, .comments_box .comment_section form textarea::-webkit-scrollbar-track, ::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);border-radius: 10px;background-color: #F5F5F5;}
.comments .container::-webkit-scrollbar, .comments_box .comment_section form textarea::-webkit-scrollbar, ::-webkit-scrollbar{width: 0px;background-color: #F5F5F5;}
.comments .container::-webkit-scrollbar-thumb, .comments_box .comment_section form textarea::-webkit-scrollbar-thumb, ::-webkit-scrollbar-thumb{border-radius: 10px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);background-color: #D6292900;}
.past_comment .user img{padding: 0px;}
.team{background: #2E4D52;position: relative;z-index: 9; color: #fff;padding: 0px 0 30px;height: 100vh;}
.team .container{height: 100%; overflow-y: auto;}
.team h1{text-align: right;padding-bottom: 30px;padding-top: 60px;}
.team ul{padding-left: 0px;list-style: none;column-count: 5;text-align: center;} 
.team ul li{height: 100%; width: 100%;margin-bottom: 50px;}
.team ul li img{height: 170px;width: 170px;object-fit: contain;background: #fff; border-radius: 50%;}
.login{padding: 60px 0; color: #fff;text-align: left;}
.login_form{background: #2e4d52;padding: 50px 40px 80px; border-radius: 20px;width: 100%; margin: 32px auto 32px auto; }
.login_form img{width:120px;border-radius: 14px;margin-bottom: 50px;}
.login_form h1{color: #fff;font-size: 30px; font-weight: 700;text-align: left;}
.login_form p{color: #d5d5d5;font-size: 13px; font-weight: 400;} 
.form-group {margin-bottom: 16px;position: relative;}
input {position: relative;display: block;width: 100%;border: 1px solid rgba(0,0,0,.37);border-radius: 4px;background-color: transparent;margin: 0px auto;padding: 6px 4px 4px 14px;height: 40px;outline: none !important;font-size: 16px;color: rgba(0,0,0,0.85);transition: all .2s ease-in-out;}
label {position: absolute;top: 13px; left: 12px;text-align: left;display: inline-block;padding: 0 4px;height: 20px;line-height: 14px;font-size: 14px;font-weight: 400;background: #fff;color: rgba(0,0,0,0.5);margin: 0px auto;cursor: text;transition: all .15s ease-in-out;}
input:hover, input:focus { border: 1px solid #000; }
input:valid + label, input:focus + label { top: -6px;color: #C1CD22;font-weight: 500;border: 1px solid #D9D9D9;font-size: 11px;padding: 3px;}
.gl-form-asterisk {background-color: inherit;color: #e32b2b;padding: 0;padding-left: 3px;   }
.gl-form-asterisk:after {content: "*";}
.form-check{display: flex; align-items: center;margin-bottom: 20px !important;}
.form-check-input{padding: 0px !important;}
.form-check-label{position: relative;background: transparent;color: #fff !important;border: 0px !important;text-align: left !important;width: -webkit-fill-available;padding: 0px !important;top: 0px !important;height: auto; font-weight: 400 !important;left: 0px;}
.login_form button{ width: -webkit-fill-available;background: #C1CD22;border: 0px;color: #fff;padding: 8px 20px;font-size: 14px;font-weight: 600;border-radius: 7px;}
.login_form button.login_google{background: #fff;color: #000;}
.login_form button img{width: 15px;margin-left: 5px;margin-bottom: 0px;}
.login_form p.create_acc{font-size: 15px;text-align: center;}
.login_form a{color: #C1CD22;}
.login_form span.or{padding: 20px 0;position: relative;display: block; color: #6E6E6E;font-size: 12px;text-align: center;}
.login_form span.or::before, .login_form span.or::after{content: "";position: absolute;top: 0;bottom:0px;width: 45%;height: 1px;background: #D9D9D9; margin: auto;left: 0;right: 0;}
.login_form span.or::before{left: 0;right: auto;}
.login_form span.or::after{left: auto;right: 0;}
.field-icon {float: right;margin-left: -25px;margin-top: -25px;position: relative;z-index: 99999;right: 10px;color: #9A9A9A;width: fit-content !important;}
.about:before{content: "";position: absolute;left: 0;right: 0;top: 0;bottom: 0; background: #2E4D52E5;; z-index: -1; mix-blend-mode: multiply; }
.about{height: 100vh;color: #fff; display: flex; align-items: center;z-index: 9;position: relative;}
    /* ========Account css=========== */ 
.account-section::before{content: "";position: absolute;left: 0;right: 0;top: 0;bottom: 0;background: linear-gradient(180deg, #274244 0%, rgba(46, 77, 82, 0) 100%);z-index: -1;/* background: #274244; */background: #2E4D52E5; mix-blend-mode: multiply; z-index: 9;}
.account_content{z-index: 999;} 
.account-section .account_content .main-title h1{font-size: 90px;line-height: 1.4;font-weight: 700;} 
.account-section .account_content .below-text p{font-size: 1.1rem;}
.account-section .account_content .divider-line {width: 2px;height: 100%; border-right: 3px dashed #FFFFFF; /* border: 1px dashed #FFFFFF; */transform: rotate(20deg);position: absolute;}
.account-section .account_content .circle-wrapper {position: relative;width: 350px;height: 350px;display: flex;align-items: center;justify-content: center;}
.account-section .account_content .circle-gif {width: 100%;height: 100%;object-fit: contain;}
.account-section .account_content .circle-text {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);font-size: 50px;font-weight: 600;color: #fff;}
.account-section .bottom-text {position: absolute;left: 100px;bottom: 20px;color: #fff;text-align: left; z-index: 99;}
.account-section .bottom-text p{font-size: 35px;}
.account-section .account_content .heading-btn{text-decoration: none; color: #fff;}
/* .account-section .account_content .typing-caret{display: inline-block;width: 0.65ch;animation: blink 1s steps(1) infinite;color: #fff;} */
.account-section .account_content .typing-done{opacity: 0;}
.account-section .account_content .third-text{margin-right: 150px;}
.account-section .account_content .second-text{margin-right: 50px;}
.about h3{font-size: 45px;font-weight: 400;margin-bottom: 0px;}
.about .autotype-section{height: 65vh;}
.about .autotype-section .text{display: flex;align-items: flex-end;position: relative;bottom: 80px;}
.about .autotype-section .text:last-child{display: flex;align-items: flex-start;position: relative;top: 80px;bottom: 0;}
.account-section .bottom-text a{color: #fff;}
/* @keyframes blink{50%{opacity: 0;}} */
    /* ========Account css end=========== */
@media (max-width:991px){
    .account-section .account_content .circle-wrapper{width: 200px;}
  .account-section .account_content .circle-text{font-size: 40px;}
  .account-section .account_content .main-title h1{font-size: 70px;}
  .account-section .bottom-text p{font-size: 25px;}
  .account-section .account_content .divider-line{transform: rotate(15deg);}
}
@media (max-width: 480px){
    .team ul{column-count: 2;}
    .team ul li{margin-bottom: 15px;}
    .team ul li img {height: 140px;width: 140px;}
}
@media (min-width: 481px) and (max-width: 767px){
    .team ul{column-count: 3;}
    .team ul li{margin-bottom: 25px;}
    .team ul li img {height: 140px;width: 140px;}
}
@media (min-width: 768px) and (max-width: 991px){
    .team ul{column-count: 4;}
    .team ul li{margin-bottom: 25px;}
    .team ul li img {height: 140px;width: 140px;}
}
@media (min-width: 992px) and (max-width: 1240px){ 
    .team ul li{margin-bottom: 36px;}
    .team ul li img {height: 150px;width: 150px;}
}
@media (max-width: 768px){
     .account-section {height: auto;padding: 40px 20px;}
  .account-section .account_content .row {flex-direction: column;align-items: center;}
  .account-section .account_content .col-md-5,
  .account-section .account_content .col-md-2 {width: 100%;text-align: center !important;}
  .account-section .account_content .main-title h1 {font-size: 40px;line-height: 1.2;text-align: center !important;}
  .account-section .account_content .second-text,
  .account-section .account_content .third-text {margin-right: 0;}
  .account-section .account_content .divider-line {width: 80%;height: 2px;border-right: 0;border-top: 3px dashed #FFFFFF;transform: rotate(0);position: static;margin: 20px auto;}
  .account-section .account_content .circle-wrapper {width: 240px;height: 240px;margin: 0 auto;}
  .account-section .bottom-text {position: static;text-align: center;margin-top: 24px;left: 0;bottom: auto;}
  .account-section .bottom-text p {font-size: 24px;}
  .account-section{flex-direction: column;}
    .down-arrow img{width: 60px;height: 60px !important;}
    .team_logo{width: 100px;}
    .comment_heading{font-size: 20px; font-weight: 500;}
    .comment_section{padding: 15px;}
    .comments_box .comment_section .user, .user{padding: 5px 15px;}
    .comments_box .comment_section .user img, .user img{height: 22px;width: 22px;}
    .comments_box .comment_section .user p, .user p{font-size: 14px;font-weight: 400;}
    .comments_box .comment_section form textarea{padding: 15px 0px;font-size: 13px; font-weight: 400;text-align: right;}
    .comments_box .comment_section img {width: 50px;}
    .comments_box .comment_section .upload_video p{font-size: 13px; font-weight: 400;}
    .comments_box .comment_section .user, .user{margin-left: auto;}
    .comments_box .comment_section .upload_video, .reply_comment{text-align: right;}
    .past_comment p{font-size: 14px; font-weight: 300;}
    .past_comment img, .past_comment video{border-bottom: 1px solid #EDE9D0; padding: 10px 0px 10px 0 !important;border-right: 0px !important;}
    .login_form img{margin-bottom: 0px;}
    .login_form{padding: 40px 25px 40px;}
}