@import url(fontiran.css); /* لینک فایلی که وظیفه بارگذاری فونت ها را برعهده دارد */
* {
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}
:root {
  --green-color: #126C6D;
  --menu-color: #293A3A;
  --background-body : #f2f2f2;
  --header-menu-color :  rgba(251, 251, 253, 0.8);
  --color-body: #212529;
}



body {	
  font-family: 'Kalameh';
  font-weight: 500;
  text-align: right;
  direction: rtl;
  background: var(--background-body) ;
  overflow-x: hidden;
  color: var(--color-body); 
 }

.select2-selection.is-invalid,
.is-invalid {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}

.select2-selection.is-valid,
.is-valid {
    border-color: #28a745 !important;
    box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25);
}

.custom-file-label.text-danger {
    color: #dc3545 !important;
}


a:hover {
  color: var(--green-color);
  text-decoration: underline;
}
hearer .nav-link.active {
  border-bottom: 3px solid var(--green-color);
}
h1, h2, h3, h4, h5, h6, input, textarea {
  font-family: Kalameh;
}
h1 {
  font-weight: bold;
}
p, a {
  font-weight: 500;
}
a {
  color: var(--green-color);
}
.text-small {
  font-size: 15px;
  color: rgba(41, 58, 58, 0.44);
}
.text-bold {
  font-size: 50px;
  margin: 0;
}
.time > div:first-child {
  background: var(--green-color);
  color: #fff;
  padding: 0 10px;
}
.imani {
  position: absolute;
  top: -55px;
}
.custom-file-label , .select2-container--bootstrap4 .select2-selection , .form-control {
	border: 2px solid #ced4da !important;}
#section1 .mande {
  color: var(--green-color);
  font-weight: 700;
  margin-top: -25px;
}
#section1 .titr2 {
  font-size: 25px;
  font-weight: 800;
  line-height: 55px;
  letter-spacing: 0em;
  text-align: right;
}
#seconds:after, #minutes:after, #hours:after {
  content: ":";
  padding-right: 10px;
}
header .navbar {
  padding: 0;
  top: 0;
}
header .nav-link {
  display: block;
  padding: .5rem 1rem;
  text-decoration: none;
  transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
  color: var(--menu-color);
  margin-right: 10px;
  text-transform: uppercase;
  font-size: 16px;
}
header .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,102,203, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}
header .navbar .nav-link {
  padding: 1rem 0;
}
header .navbar .nav-link:hover {
  color: var(--green-color);
}
header .navbar-nav .active {
  color: var(--green-color);
  border-bottom: 4px solid var(--green-color);
}
header .navbar-nav .register::before, .navbar-nav .people::before {
  content: "";
  width: 24px;
  height: 24px;
  display: inline-block;
  margin-left: 10px;
}
.navbar-nav .register::before {
  background-image: url('../image/user.svg');
}
.navbar-nav .register::after {
  /* content: "";
  width: 1px;
  height: 25px;
  display: inline-block;
  border: 1px solid #eaeaea;
  margin-right: 15px;
  margin-left: -5px;*/
}
.navbar-nav .people::before {
  background-image: url('../image/people.svg');
}
.navbar-nav .register, .navbar-nav .people {
  display: flex;
  align-items: center;
}
.navbar .navbar-search {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 2rem;
}
.navbar {
  z-index: 10;
}
#globalnav.navbar, .navbar #globalnav {
  background: var(--header-menu-color) !important;
  backdrop-filter: blur(10px);
}
.section-title {
  font-size: 24px;
  font-weight: 700;
  color: var(--menu-color);
  border-right: 6px solid var(--green-color);
  padding-right: 1rem;
}
#box_search {
  z-index: 11;
  position: absolute;
  top: 55px;
  padding: 20px;
}
#box_search, #box_search a {
  color: rgba(41, 58, 58, 0.87)
}
#box_search input {
  border: 0;
  background: #f8f9fa;
  border-bottom: 1px solid rgba(193, 193, 193, 1);
  border-radius: 0;
}
#box_search input:focus {
  background: #f1f1f1;
  box-shadow: unset;
}
#box_search ul li {
  list-style: none;
  margin-bottom: 0.5rem
}
#box_search ul li:after {
  content: ">"
}
#section1 .title {
  color: var(--green-color);
  font-weight: 900;
  line-height: 1.7;
}
#section1 .Dillustration {
  width: 100%;
  margin: auto;
  display: block;
}
#section1 .myfeature {
  margin-top: 2rem;
}
#section1 ul li {
  color: var(--green-color);
}
#section1 .btn-outline-primary {
  color: var(--green-color);
  background-color: transparent;
  background-image: none;
  border-color: var(--green-color);
  width: 30%;
  border-radius: 16px;
}
#section1 .join {
  color: #fff;
  background-color: var(--green-color);
  background-image: none;
  border-color: var(--green-color);
}
#section1 .btn-outline-primary:hover {
  color: #fff;
  background-color: var(--green-color);
  background-image: none;
  border-color: var(--green-color);
}
#section1 .myfeature img {
  background: rgba(17, 109, 110, 0.1);
  padding: 10px;
  border-radius: 1rem;
  width: 57px;
}
#section1 .myfeature span {
  color: var(--green-color);
  font-weight: bold;
  font-size: 18px;
}
#section2 .news {
  background: url('../image/bg_news.png');
  height: 440px;
  background-size: 100% 100%;
}
#section2 .news .card {
  border: 1.27px solid rgba(220, 220, 220, 1);
  border-radius: 15px;
}
#section2 .news .card:hover {
  box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.2);
}
#section2 .news .card-body {
  position: relative;
  min-height: 140px;
}
 
#section2 .owl-carousel .owl-stage-outer {
  padding-bottom: 30px;
}
#section2 .news::after {
  content: "";
  background: url('../image/Rectangle_news.svg');
  width: 720px;
  height: 120px;
  display: block;
  position: absolute;
  z-index: -1;
  right: 18%;
  bottom: -35px;
}
#section2 .owl-carousel.owl-rtl {
  padding: 0 20px;
}
#section2 .owl-carousel .owl-nav button.owl-prev span, #section2 .owl-carousel .owl-nav button.owl-next span {
  font-size: 40px;
}
#section2 .nav-btn.next-slide, #section2 .nav-btn.prev-slide {
  background: url('../image/Arrow.svg');
  background-size: auto;
  background-size: 100% 100%;
  height: 40px;
  width: 40px;
  margin: 6px 5px;
}
#section2 .nav-btn.next-slide {
  transform: rotate(180deg);
}
#section2 .owl-carousel .owl-nav button.owl-prev {
  background: #fff;
  border-radius: 50%;
  height: 50px;
  width: 50px;
  right: 15px;
  margin-top: 0;
  position: absolute;
  top: 35%;
}
#section2 .owl-carousel .owl-nav button.owl-next {
  background: #fff;
  border-radius: 50%;
  height: 50px;
  width: 50px;
  left: 15px;
  margin-top: 0;
  position: absolute;
  top: 35%;
}
#section2 .news .card-text, #section2 .news .btn {
  font-size: 14px;
}
#section2 .news p {
  font-weight: 600
}
#section2 .news .btn {
  font-weight: 600
}
#section2 .news .card-body span {
  font-weight: 500;
  color: rgba(55, 55, 55, 0.49);
}
#section2 .news .Allnews:hover img {
  filter: brightness(100)
}
#section2 .news .btn-primary {
  color: rgba(41, 58, 58, 1);
  background-color: rgba(238, 238, 238, 1);
  border-color: rgba(238, 238, 238, 1);
  border-radius: 7px;
 
}
#section2 .news .btn-primary:hover {
  color: #fff;
  background-color: var(--green-color);
  background-image: none;
  border-color: var(--green-color);
}
#section2 .news .stretched-link:after {
  content: "";
  background: url('../image/login.svg');
  height: 20px;
  width: 20px;
  display: inline-block;
  margin-right: 10px;
  position: relative;
  top: 4px;
  background-size: cover;
}
#section2 .news .stretched-link:hover:after {
  filter: brightness(100)
}
.gallery .owl-item {
  transform: scale(0.8) !important;
  transition: 0.5s;
}
.gallery .owl-item.active.center {
  transform: scale(1) !important;
}
.gallery .owl-item.near {
  transform: scale(0.9) !important;
}
.gallery .owl-item.next {
  transform: scale(0.8) !important;
}
.gallery .owl-item.last {
  transform: scale(0.7) !important;
}
.gallery.owl-carousel.owl-rtl {
  padding: 0 20px;
}
.gallery.owl-carousel .owl-nav button.owl-prev span, .gallery.owl-carousel .owl-nav button.owl-next span {
  font-size: 40px;
}
.gallery .nav-btn.next-slide, .gallery .nav-btn.prev-slide {
  background: url('../image/Arrow.svg');
  background-size: auto;
  background-size: 100% 100%;
  height: 40px;
  width: 40px;
  margin: 6px 5px;
}
.gallery .nav-btn.next-slide {
  transform: rotate(180deg);
}
.gallery.owl-carousel .owl-nav button.owl-prev {
  background: #fff;
  border-radius: 50%;
  height: 50px;
  width: 50px;
  right: 15px;
  margin-top: 0;
  position: absolute;
  top: 35%;
}
.gallery.owl-carousel .owl-nav button.owl-next {
  background: #fff;
  border-radius: 50%;
  height: 50px;
  width: 50px;
  left: 15px;
  margin-top: 0;
  position: absolute;
  top: 35%;
}
#section3 .mymedia .nav-link {
  color: var(--green-color);
  background: rgba(232, 232, 232, 1);
  border-color: rgba(238, 238, 238, 1);
  border-radius: 7px;
}
#section3 .mymedia .nav-tabs .nav-link.active {
  color: #fff;
  background-color: var(--green-color);
  background-image: none;
  border-color: var(--green-color);
}
#section3 .owl-theme .owl-dots .owl-dot.active span {
  background: #869791;
  width: 20px;
}
#section3 .video video {
  border-radius: 20px;
  width: 100%;
  object-fit: inherit;
}
#section3 .videolive video {
  border-radius: 20px;
  width: 100%;
  object-fit: inherit;
}
#section3 #gallery img {
  width: 100%;
  min-height: 150px;
}
#section3 .bg-archive {
  background: rgba(217, 217, 217, 1);
}
#section3 #archive .item {
  border-radius: 12px;
}
#section3 .bg-archive .downloadbox {
  background: rgba(17, 109, 110, 1);
  height: 47px;
  width: 47px;
  border-radius: 12px;
}
#section3 .bg-archive .playbox {
  background: rgba(41, 58, 58, 1);
  height: 47px;
  width: 47px;
  border-radius: 12px;
}
#section3 .bg-archive .playbox img, #section3 .bg-archive .downloadbox img {
  width: 100%;
}
#section4 {
  position: relative;
  height: 328px;
  background: url(../image/bg-section.png) 100% 100%;
  background-repeat: no-repeat;
  background-size: cover;
}
#section4 .Rectangle {
  position: absolute;
  left: 2.54%;
  right: 2.27%;
  top: 15.85%;
  bottom: 12.5%;
  background: #116D6E;
  box-shadow: 0px 20px 40px rgba(17, 109, 110, 0.36);
  border-radius: 13px;
}
#section4 .col-right .time {
  background: linear-gradient(0deg, #FFFFFF, #FFFFFF), #FFFFFF;
  border-radius: 7px;
  padding: 10px;
  margin-top: -70px;
  width: max-content;
  color: rgba(17, 109, 110, 1);
}
#section4 .col-left .place {
  background: linear-gradient(0deg, #FFFFFF, #FFFFFF), #FFFFFF;
  border-radius: 7px;
  padding: 10px;
  margin-top: -70px;
  width: max-content;
  color: rgba(17, 109, 110, 1);
}
#section4 .col-right .title, #section4 .col-left .title {
  font-size: 24px;
  color: #fff;
}
#section4 .col-right .des, #section4 .col-left .des {
  font-size: 17px;
  color: #fff;
}
#section4 .col-right .border {
  position: absolute;
  left: 92.46%;
  right: 7.27%;
  top: 0;
  bottom: 21.65%;
  background: #FFFFFF;
  height: 140px;
}
#section4 .col-left::before {
  content: "";
  background: url("../image/Arrow_Left.svg") 100% 100%;
  width: 58px;
  height: 52px;
  position: absolute;
  right: -42px;
  top: 22%;
}
#section4 .col-left .border {
  position: absolute;
  left: 21.3%;
  right: 78.83%;
  top: 42%;
  bottom: -30.03%;
  background: #FFFFFF;
  transform: rotate(90deg);
  height: 170px;
}
#section5 {
  position: relative;
  /*background: rgba(22, 37, 37, 1) url(../image/bg_section.svg) 100% 100%;
  background-repeat: no-repeat;*/
}
#section5 .title {
  font-size: 24px;
  color: #fff;
  color: rgba(17, 109, 110, 1);
  font-size: 24px;
  font-weight: 700;
  line-height: 41px;
  letter-spacing: 0em;
  text-align: right;
}
#section5 .des {
  font-size: 17px;
  font-weight: 500;
  line-height: 29px;
  letter-spacing: 0em;
  text-align: justify;
}
#section5 .game {
  padding: 1rem;
  border-radius: 12px;
  transition: background 0.5s ease-out;
}
#section5 .game:hover {
  background: #2AB0A8;
  cursor: pointer;
}
#section5 .anim {
  padding: 1rem;
  border-radius: 12px;
  transition: background 0.5s ease-out;
}
#section5 .anim:hover {
  background: #2A60B0;
  cursor: pointer;
}
#section5 .app {
  padding: 1rem;
  border-radius: 12px;
  transition: background 0.5s ease-out;
}
#section5 .app:hover {
  background: #B02AA3;
  cursor: pointer;
}
#section6 .bg-archive {
  background: rgba(217, 217, 217, 1);
  border-radius: 12px;
}
#section6 .item-pishin {
  border-radius: 10px;
  border: 1.82px solid rgba(166, 166, 166, 0.55);
  padding: 7px;
}
#section6 .item-pishin .img_pishin {
  width: 100%
}
#section6 .title-pishin {
  font-size: 14px;
  font-weight: 700;
  line-height: 27px;
  letter-spacing: 0em;
  text-align: center;
}
#section6 .date-pishin, #section6 .users-pishin {
  font-size: 9.5px;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: 0em;
  text-align: center;
}

#section6 .btn-pishin{
 background: rgba(17, 109, 110, 1);
color: #fff;
font-size: 14px;
font-weight: 500;
line-height: 30px;
letter-spacing: 0em;
text-align: center;
border: 0;
border-radius: 10px;
}
#section6 .btn-pishin:hover{
background: linear-gradient(270deg, #116D6E 0%, #0B3333 99.9%);
border: 0;
box-shadow: unset;
}

#section6 .bg-archive .plus {
  background: rgba(185, 185, 185, 1);
  height: 47px;
  width: 47px;
  border-radius: 12px;
  cursor: pointer;
}
#section6 .bg-archive .plus .fa {
  display: inline-block;
  margin: 12px;
}
#section6 .panel-heading.d-flex.mpanel-head {
  background: rgba(15, 72, 72, 1);
  border-radius: 12px;
  color: #fff;
}
#section6 .panel.bg-archive.item.bgpanel {
  background: rgba(17, 109, 110, 1) !important;
}
#section6 .panel.bg-archive.item .removebg-plus {
  background: unset !important;
}
#section6 .panel.bg-archive.item .removebg-plus i {
  color: #fff;
}
footer {
  background: rgba(22, 37, 37, 1);
  color: #fff;
  font-size: 15px;
  font-weight: 300;
}
footer .top {
  position: relative;
  background: url("../image/footer_top.jpg") 100% 100%;
  color: #fff;
  padding: 73px;
  background-position: top right+100px;
  background-repeat: no-repeat;
}
footer .top .call:before {
  content: "";
  background: url("../image/call.svg") 100% 100%;
  height: 18px;
  width: 18px;
  display: inline-flex;
  align-items: center;
  margin-left: 5px;
}
footer .top .call {
  display: inline-flex;
  align-items: center;
}
footer .top .address:before {
  content: "";
  background: url("../image/Location.svg") 100% 100%;
  height: 18px;
  width: 18px;
  display: inline-flex;
  align-items: center;
}
footer .copyright {
  background: #f2f2f2;
}
footer .up {
  position: absolute;
  width: 67px;
  height: 67px;
  left: 915px;
  top: -35px;
}
footer .logo_footer {
  position: absolute;
  left: 0;
  top: 15px;
}
footer .social {
  background: url("../image/footer_bottom.jpg") 100% 100%;
  position: absolute;
  left: 38%;
  bottom: 0px;
  background-repeat: no-repeat;
  background-position: bottom center;
  width: 301px;
  height: 67px;
}
footer .social div {
  position: absolute;
  bottom: 0;
  right: 25%;
}
footer .social div a {
  margin-left: 10px;
}
footer .social .twitter {
  background: #f2f2f2 url("../image/social.svg") 100% 100%;
  height: 26px;
  width: 30px;
  display: inline-block;
}
footer .social .bale {
  background: #f2f2f2 url("../image/social.svg") 100% 100%;
  height: 26px;
  width: 30px;
  display: inline-block;
  background-position: 74px;
}
footer .social .telegram {
  background: #f2f2f2 url("../image/social.svg") 100% 100%;
  height: 26px;
  width: 30px;
  display: inline-block;
  background-position: 112px;
}
footer .social .insta {
  background: #f2f2f2 url("../image/social.svg") 100% 100%;
  height: 26px;
  width: 30px;
  display: inline-block;
  background-position: 0px;
}
footer #goback {
  cursor: pointer;
}
/************* login  **********/
.myform .col-right {
  width: 680px;
}
.myform .col-right, .myform .col-left {
  min-height: 90vh;
  top: 5vh;
}
.myform .login-inner-form {
  color: #ccc;
  position: relative
}
.myform .extra-login {
  color: rgba(41, 58, 58, 0.6);
  font-size: 16px;
  font-weight: 500;
  line-height: 28px;
  letter-spacing: 0em;
  margin-top: 1rem;
}

.myform .extra-login h2 {
  font-size: 24px;font-weight: 700;color: rgba(17, 109, 110, 1);
}


.myform .form-group {
  position: relative;
}
.myform .flex-fill {
  -ms-flex: 1 1 auto !important;
  flex: 1 1 auto !important;
  margin: 10px;
}
.myform .form-section {
  max-width: 860px;
  margin: 0 auto;
  text-align: center;
  width: 100%;
  overflow: hidden;
  -webkit-transition: all .5s;
  transition: all .9s;
  z-index: 1
}
.custom-file {
  border-bottom: 1px solid #bdbdbd
}
.custom-file-label {
  position: absolute;
  left: 0;
  background: red;
  line-height: 2;
  padding: 5px 10px
}
.myform .login-inner-form img {
  margin-bottom: 5px;
  height: 40px;
  z-index: 10;
}
.myform .login-inner-form input {
  padding-right: 45px !important;
  font-size: 15px;
  font-weight: 300;
  border-radius: 14px;
}
.myform .profile {
  position: absolute;
  right: 10px;
  z-index: 1;
  border-left: 1px solid #126c6d;
  padding-left: 3px;
  margin-top: 10px;
  height: 25px !important;
  top: 39px;
}
.myform .register-form select {
  padding-right: 40px !important;
  border-radius: 14px;
}
.myform .select2-container--bootstrap4 .select2-selection {
  border-radius: 14px;
}
.myform .select2-container--bootstrap4 .select2-selection--single {
  height: 58px !important;
}
.myform .select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered {
  line-height: 58px;
}
.custom-file {
  border-bottom: 0;
}
.custom-file-label {
  text-align: right;
  background: #fff;
  line-height: 2.6;
  padding-right: 50px;
  border-radius: 14px;
  height: 58px;
}
.custom-file-label::after {
  position: absolute;
  top: 9px;
  left: 7px;
  bottom: 0;
  z-index: 3;
  display: block;
  height: 30px;
  padding: 20px;
  line-height: 0;
  color: #495057;
  content: "انتخاب فایل";
  background-color: #e9ecef;
  border-left: 0;
  border-radius: 10px;
  right: auto;
}
.myform .register-form input, .myform .register-form select {
  padding-right: 45px !important;
  font-size: 15px;
  font-weight: 300;
  border-radius: 14px;
 
}
.select2-container--bootstrap4.select2-container--focus .select2-selection {
  box-shadow: unset !important;
  border: 3px solid var(--green-color) !important;
}
.myform .img_form-register {
  position: absolute;
  right: 10px;
  z-index: 1;
  border-left: 1px solid rgba(113, 113, 113, 0.19);
  padding-right: 0px;
  margin-top: 8px;
  height: 26px !important;
  padding-left: 4px;
  top: 7px;
}
.myform .login-inner-form .form-box input {
  float: right;
  width: 100%;
  text-align: right;
}
.myform .login-inner-form .form-box select {
  float: right;
  width: 100%;
  text-align: right;
  direction: rtl;
  background: #fff;
}
.form-check-input {
  margin-right: -1.25rem;
}
.myform .login-inner-form .forgot {
  margin: 0;
  line-height: 45px;
  color: #535353;
  font-size: 15px;
  float: right
}
.myform .bg-img {
  background: url("../image/login/Mask group.png") no-repeat, linear-gradient(#664fa3, #0c0022);
  background-size: auto, auto;
  background-size: 100% 100%;
  width: 100%;
  opacity: 1;
  z-index: 0;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
  box-shadow: 4px -5px 37px -10px #000 inset;
  z-index: 1;
  border-radius: 0 1rem 1rem 0;
}
.myform .bg-color-10 {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 2rem;
  background: #f8f9fa;
  border-radius: 1rem 0 0 1rem;
}
.myform .info span {
  font-size: 20px;
  color: #fff;
  font-weight: 700;
  text-align: center;
  text-transform: uppercase;
  display: block
}
.myform .info h1 span {
  font-weight: 300
}
.myform .info {
  text-align: left
}
@keyframes leaves {
  0% {
    transform: scale(1.0);
  }
  100% {
    transform: scale(1.05);
  }
}
.myform .info img {
  animation: leaves 1.5s ease-in-out infinite alternate;
  -webkit-animation: leaves 1.5s ease-in-out infinite alternate;
}
.myform .info:after {
  content: '';
  background: url('../image/login/human.svg');
  height: 100px;
  width: 100px;
}
.myform .info .mid {
  width: 100%;
  left: -177px;
  position: absolute;
  top: 22%;
}
.myform .info .under_mid {
  position: absolute;
  top: 35%;
  left: -102px;
  width: 49%;
}
.myform .info .under_under_mid {
  position: absolute;
  top: 40%;
  left: -62px;
  width: 29%;
}
.myform .logo img {
  height: 55px;
  width: 55px;
  border: 0.72px solid rgba(41, 58, 58, 0.16);
  border-radius: 14px;
}
.myform .title_under_logo {
  font-size: 16px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: 0em;
  color: rgba(17, 109, 110, 1);
  margin-bottom: 15px;
}
.myform .mybtn {
  width: fit-content;
  background: rgba(234, 234, 234, 1);
  border-radius: 15px;
  padding: 7px 6px;
}
.myform .mybtn .login {
  border-radius: 15px;
  padding: 10px 45px;
  min-width: 170px;
}
.myform .mybtn .register {
  margin-right: 5px;
  padding: 10px 45px;
  min-width: 170px;
}
.myform .nav-tabs .nav-link.active {
  border-color: transparent;
  border-radius: 15px;
}
.myform .transfer {
  background-color: var(--green-color);
  border-color: var(--green-color);
  border-radius: 16px;
  padding: 5px;
  min-width: 40%;
}

.myform .transfer:hover{
	background: linear-gradient(267.1deg, #116D6E -9.98%, #293A3A 99.72%);

}
.myform .transfer img {
  width: 22px;
}
.myform .back {
  background-color: transparent;
  border: 2px solid rgba(217, 217, 217, 1);
  color: rgba(217, 217, 217, 1);
  border-radius: 16px;
  padding: 0 10px;
  min-width: 40%;
}
.myform .back:hover {
  background-color: var(--green-color);
  border-color: var(--green-color);
  border-radius: 16px;
  color: rgba(255, 255, 255, 1);
}
.myform .invalid-feedback {
  font-weight: 300;
}
.myform .was-validated .form-control:invalid {
  background: rgba(235, 52, 52, 0.06);
  border: 1.82px solid rgba(235, 52, 52, 1)
}
/* Customize the label (the container) */
.container_checkbox {
  display: block;
  position: relative;
  padding-right: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
/* Hide the browser's default checkbox */
.container_checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  right: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 50%;
}
/* On mouse-over, add a grey background color */
.container_checkbox:hover input ~ .checkmark {
  background-color: #ccc;
}
/* When the checkbox is checked, add a blue background */
.container_checkbox input:checked ~ .checkmark {
  background-color: var(--green-color);
}
/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}
/* Show the checkmark when checked */
.container_checkbox input:checked ~ .checkmark:after {
  display: block;
}
/* Style the checkmark/indicator */
.container_checkbox .checkmark::after {
  background: url('../image/login/Tick-Square.svg') 100% 100%;
  background-size: auto;
  background-size: auto;
  left: 5px;
  top: 6px;
  width: 15px;
  height: 13px;
  background-size: 100% 100%;
}
@media(max-width:1200px) {
  .myform .info h1 {
    font-size: 45px
  }
}
@media(max-width:992px) {
  .myform .none-992 {
    display: none
  }
}
.reg_top {
  display: none;
}
@media(min-width:992px) and (max-width:1440px) {
  .myform .info .under_mid {
    top: 39%;
    left: 26%;
  }
  .myform .info .under_under_mid {
    top: 43.5%;
    left: 36.6%;
  }
  .myform .bg-img {
    background-position: center center;
    background-size: 45%;
  }
}
@media(min-width:412px) and (max-width:992px) {
  .reg_top {
    background: #f8f9fa;
    display: block;
  }
  .reg_top img {
    display: block;
    margin: auto;
  }
  .myform .bg-img {
    background-position: center center;
    background-size: 75%;
  }
}
@media(min-width:1px) and (max-width:411px) {
  .reg_top {
    background: #f8f9fa;
    display: block;
  }
  .reg_top img {
    display: block;
    margin: auto;
    width: 100%;
  }
}
/************* login  **********/
/****** wizard ***/
.wizard {
  position: relative;
}
.wizard > .steps .current-info, .wizard > .steps .number {
  display: none;
}
.wizard > .steps ul {
  display: flex;
  justify-content: center;
  list-style: none;
  direction: ltr;
  padding: 0;
}
.steps ul li {
  width: 35%;
}




.wizard > .steps .current-info, .wizard > .steps .number {
  display: none;
}
.wizard > .steps li a {
  display: inline-block;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #e9e0cf;
  position: relative;
}
.wizard > .steps li a:before {
  content: "";
  width: 150px;
  height: 2px;
  background: #e9e0cf;
  position: absolute;
  right: 55px;
  top: 12px;
}
.wizard > .steps li a::after {
  content: "";
  width: 0;
  height: 2px;
  background: var(--green-color);
  position: absolute;
  left: -180px;
  top: 12px;
  transition: all 0.6s ease;
}
.wizard > .steps li.first:before {
  content: "";
  background: url('../image/login/Tick-Square.svg');
  background-size: auto;
  background-size: auto;
  position: absolute;
  z-index: 1;
  margin-left: 4px;
  color: #fff;
  width: 15px;
  height: 23px;
  background-size: 100% 100%;
}
.wizard > .steps li.first a {
  background: var(--green-color);
}
.wizard > .steps li.checked a {
  background: var(--green-color);
}
.wizard > .steps li.checked a::after {
  width: 150px;
}
.wizard > .steps li:last-child a {
  margin-right: 0;
}
.wizard > .steps li:first-child a:before {
  display: none;
}
.wizard > .steps li:first-child a:after {
  display: none;
}
.wizard .checked::before {
  content: "";
  background: url('../image/login/Tick-Square.svg');
  background-size: auto;
  position: absolute;
  z-index: 1;
  margin-left: 4px;
  color: #fff;
  width: 15px;
  height: 23px;
  background-size: 100% 100%;
}
.actions ul {
  display: flex;
  list-style: none;
  padding: 0;
  direction: ltr;
}
.actions li {
  flex: 1 1 auto !important;
  margin: 5px;
}
.actions li a {
  background-color: var(--green-color);
  border-color: var(--green-color);
  border-radius: 16px;
  padding: 11px 15px;
  color: #fff;
  text-decoration: none;
  width: 100%;
  display: inline-block;
}
.actions li a:before {
  content: 'a1';
  position: absolute;
  top: 14px;
  right: 28px;
}
.actions li a:hover {
  border-radius: 20px;
}
.actions li:first-child a {
  background-color: transparent;
  border: 2px solid rgba(217, 217, 217, 1);
  color: rgba(217, 217, 217, 1);
  border-radius: 16px;
  padding: 11px 15px;
}
.actions li:first-child a:before {
  content: '';
  position: absolute;
  top: 14px;
  left: 26px;
}
.actions li:last-child a {
  color: #fff;
}
.actions li:last-child a:hover {
  border-radius: 20px;
}
.actions li:last-child a:before {
  content: 'a3';
  position: absolute;
  top: 13px;
  right: 28px;
}
.actions li[aria-disabled="true"] a {
  opacity: 0;
  transition: all 1s;
}
.actions li[aria-disabled="false"] ~ li a {
  color: #fff;
}
.actions li[aria-disabled="false"] ~ li a:hover {
  border-radius: 20px;
}
.progress {
  height: 5px;
}
#popover-password p {
  font-size: 10px;
}
.list-unstyled {
  font-size: 10px;
}
.progress-bar-success {
  background: green
}
.progress-bar-warning {
  background-color: #f0ad4e;
}
.progress-bar-danger {
  background-color: #d9534f;
}



@media screen and (min-width: 0px) and (max-width: 413px) {
	
 
	
	.wizard > .steps li a::before {
   width: 100px;
   right: 25px;
 }
	.wizard > .steps li.checked a::after {
  width: 103px;
}
.wizard > .steps li a::after {
 
	left: -101px;}
	
	
	
}


/****** wizard ***/
.form-control {
  background-color: #fff;
  border-radius: 20px;
  padding: 14px;
  border: 2px solid #c1c1c1;
}
.form-control:focus {
  box-shadow: unset;
  border: 3px solid var(--green-color);
}
/*--green-color: #126C6D;
  --menu-color: #293A3A;
*/
/****** rule ***/
#rule {
  background-color: var(--green-color);
  border-radius: 33px;
  margin: 100px 0 100px 0;
}
#rule .top span {
  color: var(--menu-color);
  position: absolute;
  top: 1.25%;
  font-size: 24px;
  background: transparent;
}
#rule .content {
  color: #fff;
  font-weight: 300;
}
/****** rule ***/
/****** p-gallery ***/
.p-gallery .titlepage {
  font-family: Kalameh;
  font-size: 24px;
  font-weight: 600;
  line-height: 41px;
  letter-spacing: 0em;
  border-bottom: 4px solid rgb(17, 109, 110);
  width: 157px;
  margin: 0 auto 2rem auto;
  color: rgb(17, 109, 110);
}
.p-gallery .nav-item {
  margin-left: 5px;
}
/****** p-gallery ***/
/****** s-news ***/
#s-news .img_news {
  border-radius: 20px;
}
#s-news .detail-news li {
  display: inline-block;
}
#s-news .detail-news li:first-child:before {
  display: none
}
#s-news .detail-news li::before {
  content: "";
  width: 5px;
  height: 5px;
  background: rgba(41, 58, 58, 1);
  display: inline-block;
  border-radius: 50%;
  margin: 0 15px;
}
#s-news .title-news h1 {
  font-size: 18px;
  font-weight: 600;
  line-height: 31px;
  letter-spacing: 0em;
  text-align: right;
  color: rgba(17, 109, 110, 1);
}
#s-news .content-top-news p {
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  letter-spacing: 0em;
  text-align: justify;
}
#s-news .join {
  color: #fff;
  background-color: var(--green-color);
  background-image: none;
  border-color: var(--green-color);
  font-weight: 600;
  font-size: 12px;
}
#s-news .join:hover {
  color: #fff;
  background-color: rgba(41, 58, 58, 1);
  background-image: none;
  border-color: var(--green-color);
}
#s-news .maincontent p {
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  letter-spacing: 0em;
  text-align: justify;
}
#s-news .related .title {
  color: var(--green-color);
  font-size: 18px;
  font-weight: 700;
  line-height: 31px;
  letter-spacing: 0em;
}
#s-news .owl-carousel .owl-nav button.owl-prev span, #s-news .owl-carousel .owl-nav button.owl-next span {
  font-size: 40px;
}
#s-news .nav-btn.next-slide, #s-news .nav-btn.prev-slide {
  background: url('../image/Arrow.svg');
  background-size: auto;
  background-size: 100% 100%;
  height: 40px;
  width: 40px;
  margin: 6px 5px;
}
#s-news .nav-btn.next-slide {
  transform: rotate(180deg);
}
#s-news .owl-carousel .owl-nav button.owl-prev {
  background: #fff;
  border-radius: 50%;
  height: 50px;
  width: 50px;
  right: 15px;
  margin-top: 0;
  position: absolute;
  top: 35%;
}
#s-news .owl-carousel .owl-nav button.owl-next {
  background: #fff;
  border-radius: 50%;
  height: 50px;
  width: 50px;
  left: 15px;
  margin-top: 0;
  position: absolute;
  top: 35%;
}
#s-news .card {
  border: 0;
  border-radius: 14px;
}
#s-news .mynews .btn-primary {
  color: rgba(41, 58, 58, 1);
  background-color: rgba(238, 238, 238, 1);
  border-color: rgba(238, 238, 238, 1);
  border-radius: 7px;
}
#s-news .mynews .btn-primary:hover {
  color: #fff;
  background-color: var(--green-color);
  background-image: none;
  border-color: var(--green-color);
}
#s-news .mynews .stretched-link:after {
  content: "";
  background: url('../image/login.svg');
  height: 20px;
  width: 20px;
  display: inline-block;
  margin-right: 10px;
  position: relative;
  top: 4px;
  background-size: cover;
}
#s-news .mynews .stretched-link:hover:after {
  filter: brightness(100)
}
#s-news .mynews .card-body span {
  font-weight: 500;
  color: rgba(55, 55, 55, 0.49);
}
/****** s-news ***/
/****** pishin ***/
.pishin-header {
  background: url('../image/pishin.png') no-repeat;
  background-size: 100%;
}
.pishin-header .pishin-title {
  font-size: 30px;
  font-weight: 700;
  line-height: 51px;
  letter-spacing: 0em;
  text-align: center;
  color: #fff;
  border-bottom: 4px solid #fff;
  width: max-content;
  margin: auto;
}
.pishin-header p {
  font-size: 19px;
  font-weight: 400;
  line-height: 32px;
  letter-spacing: 0em;
  text-align: center;
  color: #fff;
  width: 75%;
  margin: auto
}
.pishin .pishin-title {
  font-size: 24px;
  font-weight: 700;
  line-height: 41px;
  letter-spacing: 0em;
  text-align: right;
  color: rgba(17, 109, 110, 1);
}
.myfeature .items {
  border: 1px solid #c1c1c1;
  border-radius: 10px;
  padding: 5px;
  text-align: right;
  margin: 10px 5px;
  display: flex;
  justify-content: right;
  align-items: center
}
.myfeature .items img {
  background: red;
  padding: 5px 10px;
  margin-left: 10px;
  border-radius: 10px;
  min-height: 65px;
}
/****** pishin ***/