

/* production css */

form,
input,
textarea {
    -moz-user-select: all !important;
    -webkit-user-select: all !important;
    -ms-user-select: all !important;
    user-select: all !important;
    -webkit-user-select: text !important;
}

* {
    user-drag: none;
    -webkit-user-drag: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -ms-overflow-style: none;
    /* IE and Edge hide scrollbar bar*/
    /* scrollbar-width: none; */
    /* Firefox hide scrollbar bar */
}

/* chrome hide scrollbar bar */
*::-webkit-scrollbar {
    display: none;
}

:root {
  --primary: #6C55F9;
  --accent: #FF3D85;
  --secondary: #645F88;
  --success: #35bb78;
  --warning: #FAC14D;
  --danger: #FF4943;
  --grey: #f3f3f3;
  --dark: #2D2B3A;
  --light: #F6F5FC;
  --green: #2fb8b1;
  --blue: #63abdd;
  --footer: #2f393a;
  --orange: #ffc107; 
  --bluebold: #5783ca;
  
}

/* @import url("https://fonts.googleapis.com/css2?family=Work+Sans:wght@300;400;500;600;700&display=swap"); */

body {
  font-family: "Work Sans", sans-serif;
  line-height: 1.5;
  color: #2D2B3A;
}

a {
  text-decoration: none;
  background-color: transparent;
}

a:hover {
  opacity: .5;
  text-decoration: none;
}

.text-bold{
  font-weight: bold;
}

.text-xs {
  font-size: 12px !important;
}

.text-sm {
  font-size: 14px !important;
}

.text-md {
  font-size: 1rem !important;
}

.text-lg {
  font-size: 18px !important;
}

.text-xl {
  font-size: 20px !important;
}
.text-center{
  text-align: center;
}
.text-blue {
  color: var(--blue);
}
.text-bluebold {
  color: var(--bluebold);
}
.text-green {
  color: var(--green);
}
.text-white{
  color: #fff;
}
.text-black{
  color: #000;
}
.text-danger{
  color: var(--danger);
}
.text-orange {
  color: var(--orange);
}

.white_shadow{
  text-shadow: 2px 7px 5px rgba(0,0,0,0.3), 
  0px -4px 10px rgba(255,255,255,0.3);
  /* text-shadow: #fff 2px 0, #fff -2px 0, #fff 0 -2px, #fff 0 2px, #fff 2px 2px, #fff -2px 2px, #fff 2px -2px, #fff -2px -2px, #fff 1px 2px, #fff -1px 2px, #fff 1px -2px, #fff -1px -2px, #fff 2px 1px, #fff -2px 1px, #fff 2px -1px, #fff -2px -1px, rgb(0 0 0 / 50%) 3px 3px 3px; */
}
.italic{
  font-style: italic;
}
/* Buttons */
.btn {
  transition: all .2s ease;
}

.btn:focus {
  box-shadow: none !important;
}

.btn-outline {
  /* border-color: #D7D5E9; */
  border-color: var(--dark);
  color: var(--dark);
} 
.btn-outline-blue{
  border-color: var(--blue);
  background: var(--blue);
  color: #fff;
}
.btn-outline-orange{
  border-color: var(--orange);
  background: var(--orange);
  color: #fff;
}
.btn-outline-green{
  border-color: var(--green);
  background: var(--green);
  color: #fff;
}

.btn-outline:hover {
  background-color: #F6F5FC;
}


.btn-outline-blue:hover{
  background: none;
  color: var(--blue);
}
.btn-outline-orange:hover{
  background: none;
  color: var(--orange);
}
.btn-outline-green:hover{
  background: none;
  color: var(--green);
}

.btn-outline-dark {
  color: #2D2B3A;
  border-color: #2D2B3A;
}

.btn-outline-dark:hover {
  color: #fff;
  background-color: #2D2B3A;
  border-color: #2D2B3A;
}

.btn-outline-dark:focus, .btn-outline-dark.focus {
  box-shadow: none;
}

.btn-outline-dark.disabled, .btn-outline-dark:disabled {
  color: #2D2B3A;
  background-color: transparent;
}

.btn-outline-dark:not(:disabled):not(.disabled):active, .btn-outline-dark:not(:disabled):not(.disabled).active,
.show > .btn-outline-dark.dropdown-toggle {
  color: #fff;
  background-color: #2D2B3A;
  border-color: #2D2B3A;
}

.btn-outline-dark:not(:disabled):not(.disabled):active:focus, .btn-outline-dark:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-dark.dropdown-toggle:focus {
  box-shadow: none;
}

.btn-link {
  font-weight: 400;
  color: #5d47eb;
  text-decoration: none;
}

.btn-link:hover {
  color: #5641df;
  text-decoration: underline;
}

.btn-link:focus, .btn-link.focus {
  text-decoration: underline;
}

.btn-link:disabled, .btn-link.disabled {
  color: #645F88;
  pointer-events: none;
}


.btn {
  padding: 8px 24px;
}

.breadcrumb {
  font-weight: 500;
  background-color: #f8f9fa;
}

.breadcrumb .breadcrumb-item.active {
  color: #8e8aad;
}

.breadcrumb .breadcrumb-item + .breadcrumb-item::before {
  color: #8e8aad;
}

.breadcrumb-dark .breadcrumb-item a {
  color: #6C55F9;
}

.breadcrumb-dark .breadcrumb-item a:hover {
  color: #6C55F9;
  text-decoration: none;
}

.breadcrumb-dark .breadcrumb-item + .breadcrumb-item::before {
  display: inline-block;
  padding-right: 0.5rem;
  color: rgba(255, 255, 255, 0.8);
  content: "/";
}

.breadcrumb-dark .breadcrumb-item.active {
  color: rgba(255, 255, 255, 0.8);
}
.none_425{
  display: none;
}
.bg_img_400{
  width: 100%;
  height: 400px;
  object-fit: cover;

}

.hidden_btn:hover{
  opacity: none!important;
}
.hidden_btn{
  background: var(--gray)!important;
  color: #fff!important;
}

/* .logo_img{
  background-color: rgba(255, 255, 255, 1);
  padding: 6px 2rem;
} */
.logo_img img{
  max-height: 70px;
  /* background: rgba(255, 255, 255, 0.1);
  filter: drop-shadow(5px 5px 5px #fff); */
}

.cir_logo{
  /* height: 180px;
  width: 180px;
  border-radius: 50%; */
  padding: 1rem 2rem;
  border-radius: 20px;
  border: 1px solid #fff;
  background: rgba(255, 255, 255, 0.9);
  padding-bottom: 10px;
}
.navbar {
  min-height: 70px;
  z-index: 1000;
  background: rgba(255, 255, 255, 0.6);
}
.head_icon{
  height: 40px;
}
.navbar-toggler{
  font-size: 1rem;
}
.navbar-float {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  /* background-color: #fff; */
  /* box-shadow: 0 2px 6px rgba(100, 95, 136, 0.15); */
  z-index: 1070;
}

.navbar.sticky {
  z-index: 1080;
}

.navbar.sticky.fixed ~ * {
  margin-top: 70px;
}

.navbar.sticky.fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  animation: navTransition .5s ease;
  box-shadow: 0 2px 6px rgba(100, 95, 136, 0.15);
  z-index: 1080;
}

@keyframes navTransition {
  from {
    top: -100%;
  }
  to {
    top: 0;
  }
}

.navbar-brand {
  font-weight: 600;
  padding-top: 10px;
  padding-bottom: 10px;
}

.navbar-nav {
  margin-top: 10px;
  border-top: 1px solid #e4e7ee;
  flex-shrink: 0;
}

.navbar-nav .nav-link {
  transition: all .2s ease;
}

.navbar-nav .btn {
  font-size: 14px;
}

.navbar-light .navbar-nav .nav-link {
  color: #fff;
}

.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {
  color: #645F88;
}

.navbar-light .navbar-nav .show > .nav-link,
.navbar-light .navbar-nav .active > .nav-link,
.navbar-light .navbar-nav .nav-link.show,
.navbar-light .navbar-nav .nav-link.active {
  font-weight: 500;
  color: #5641df;
}

/* ====== login nav ====== */

.navbar .action-buttons .dropdown-toggle::after {
	display: none;
}
.navbar .dropdown-menu {
	border-radius: 1px;
	border-color: #e5e5e5;
	box-shadow: 0 2px 8px rgba(0,0,0,.05);
}
.navbar .navbar-nav .dropdown-menu a {
	padding: 8px 20px;
	line-height: normal;
}
.navbar .login-form label {
	color: #888;
	font-weight: normal;
}
.navbar .dropdown-menu.login-form {
	padding: 20px;
	left: auto;
	font-size: 14px;
}
.navbar .navbar-nav .dropdown-menu.login-form a {
	padding: 0 !important;
	color: #5c6ac4;
	font-weight: normal;
}
.navbar .navbar-nav .dropdown-menu.login-form a:hover{
	text-decoration: underline;
}
.navbar .dropdown-menu.login-form .checkbox-inline {
	margin-top: 10px;
}


@media (min-width: 576px) {
  .btn-outline-blue, .btn-outline-orange, .btn-outline-green{
    min-width: 280px;
  }
  .navbar-expand-sm .navbar-nav {
    margin-top: 0;
    border-top: none;
  }
  .navbar-expand-sm .navbar-nav .nav-link {
    padding-right: 16px;
    padding-left: 16px;
  }
  .navbar-expand-sm .navbar-nav {
    align-items: center;
  }
  .page-banner{
    background: url(../../assets/img/head_bg.jpeg);
    height: 100vh;
    background-size: cover;
    background-position: center;
  }
  /* .mac_vid .content{
    margin-top: -7vh;
} */
  .page-banner img{
    display: none;
  }
  .none_575{
    display: none;
  }
}

@media (min-width: 768px) {
  .navbar-expand-md .navbar-nav {
    margin-top: 0;
    border-top: none;
  }
  .navbar-expand-md .navbar-nav .nav-link {
    padding-right: 16px;
    padding-left: 16px;
  }
  .navbar-expand-md .navbar-nav {
    align-items: center;
  }
}

@media (min-width: 992px) {
  .page-banner{
    height: 100vh;
  }
  /* .mac_vid .content{
    margin-top: -12vh;
} */
  .navbar-expand-lg .navbar-nav {
    margin-top: 0;
    border-top: none;
  }
  .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 8px;
    padding-left: 8px;
  }
  .navbar-expand-lg .navbar-nav {
    align-items: center;
  }
  .head_btn{
    background: var(--blue);
    padding: 8px 15px!important;
    margin-right: 10px;
  }
  .bg_pc_blue{
    background: var(--blue);
  }
  .logoutbtn{
    border: none;
    background: var(--bluebold);
  }
  .navbar .dropdown-menu.login-form {
    width: 280px;
    right: 20%;
    border-radius: 15px;
    box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.8);
  }
  .page_tt h1{
    font-size: 6rem;
  }

}

@media (min-width: 1200px) {
  .page-banner{
    height: 100vh;
  }
  .navbar-expand-xl .navbar-nav {
    margin-top: 0;
    border-top: none;
  }
  .navbar-expand-xl .navbar-nav .nav-link {
    padding-right: 16px;
    padding-left: 16px;
  }
  .navbar-expand-xl .navbar-nav {
    align-items: center;
  }
}
.page-banner img{
  width: 100%;
}
.form-control {
  padding: 8px 15px;
  height: calc(1.5em + 1.375rem + 2px);
  border-color: #d6dbd9;
}

.custom-select {
  height: calc(1.5em + 1.375rem + 2px);
}

.page-link {
  margin-left: 5px;
  min-width: 40px;
  color: #B4B2C5;
  border: 1px solid #dee1e6;
  text-align: center;
  border-radius: 4px;
}

.page-link:hover {
  color: #645F88;
  background-color: #F6F5FC;
  border-color: #dee1e6;
}

.page-link:focus {
  box-shadow: none;
}

.page-item.active .page-link {
  z-index: 3;
  color: #fff;
  background-color: #6C55F9;
  border-color: #4330c2;
}

.page-item.disabled .page-link {
  color: #645F88;
  pointer-events: none;
  cursor: auto;
  background-color: #fff;
  border-color: #dee2e6;
}

.pagination-lg .page-link {
  padding: 0.75rem 1.5rem;
  font-size: 1.25rem;
  line-height: 1.5;
}

.pagination-lg .page-item:first-child .page-link {
  border-top-left-radius: 0.3rem;
  border-bottom-left-radius: 0.3rem;
}

.pagination-lg .page-item:last-child .page-link {
  border-top-right-radius: 0.3rem;
  border-bottom-right-radius: 0.3rem;
}

.pagination-sm .page-link {
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  line-height: 1.5;
}

.pagination-sm .page-item:first-child .page-link {
  border-top-left-radius: 0.2rem;
  border-bottom-left-radius: 0.2rem;
}

.pagination-sm .page-item:last-child .page-link {
  border-top-right-radius: 0.2rem;
  border-bottom-right-radius: 0.2rem;
}


.img-place {
  position: relative;
  display: block;
  margin: 0 auto;
  width: 100%;
  height: 100%;
  text-align: center;
  overflow: hidden;
}

.img-place img {
  width: auto;
  max-width: 100%;
  height: auto;
}

.bg-image {
  position: relative;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
}

.bg-image > * {
  position: relative;
  z-index: 10;
}

.bg-image-parallax {
  background-attachment: fixed;
}

.bg-image-overlay-dark {
  position: relative;
}

.bg-image-overlay-dark::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.6;
  background-color: #343531;
}

.bg-size-50 {
  background-size: 50% 50%;
}

.bg-size-75 {
  background-size: 75% 75%;
}

.bg-size-100 {
  background-size: 100% 100%;
}

.fix-back-btn{
  position: fixed;
  bottom: 20px;
  left: 25px;
  min-width: 90px;
  padding-left: 20px;
  cursor: pointer;
  z-index: 1100;
}

.back-to-top {
  position: fixed;
  bottom: 20px;
  right: 25px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: rgba(224, 223, 233, 0.7);
  visibility: hidden;
  cursor: pointer;
  transition: all .2s ease;
  z-index: 1100;
}

.back-to-top::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  margin: -4px auto;
  width: 12px;
  height: 12px;
  border-top: 2px solid #555;
  border-right: 2px solid #555;
  -webkit-transform: rotate(-45deg);
     -moz-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.back-to-top:hover {
  background: var(--green);
}

.back-to-top:hover::after {
  border-color: #fff;
}


.page-section {
  position: relative;
  padding-top: 80px;
  padding-bottom: 80px;
  background-color: #fff;
  overflow: hidden;
}


.subhead {
  display: block;
  text-transform: uppercase;
  letter-spacing: 3px;
  color: #898798;
  font-weight: 500;
  margin-bottom: 8px;
}

.title-section {
  max-width: 450px;
  color: #2D2B3A;
  font-weight: 500;
}

.title-section .marked {
  position: relative;
  color: #6C55F9;
}

/* .title-section .marked::before {
  content: '';
  position: absolute;
  bottom: 4px;
  left: 0;
  width: 100%;
  height: 8px;
  background-color: #d3ccff;
  z-index: -1;
} */

.text-center .title-section {
  margin-left: auto;
  margin-right: auto;
}


.flex_center{
  display: flex;
  justify-content: center;
  align-items: center;
}
.flex_col{
  display: flex;
  flex-direction: column;
}
.flex_row_item_c{
  display: flex;
  flex-direction: row;
  align-items: center;
}
.flex_col_center{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.flex_wrap_between{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
.flex_wrap_between_top{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.flex_row_start{
  display: flex;
  flex-direction: row;
}
/* ======== seminar ======== */

.mac_vid{
    width: 100%;
    margin-bottom: 3rem;
}
.mac_vid .content{
    position: relative;
    /* margin-top: -7vh; */
}
.mac_vid img{
   width: 500px;
}
.mac_vid_content{
    position: absolute;
    top: 10px;
    left: 15px;
}
.mac_vid_content iframe {
    width: 470px;
    height: 280px;
    border: 0;
}

.sec_title{
	width: 100%;
	margin-bottom: 2.5rem;
} 
.sec_title h1{
  font-size: 5rem;
}

.sec_title h4{
	padding: 10px 30px;
  min-width: 200px;
  text-align: center;
	color: #fff;
	font-weight: 500;
	background: var(--green);
}
.title_center{
	text-align: center;
	margin-bottom: 3rem;
}

/* .seminar table {
  min-width: 600px;
} */
.seminar table td{
  padding: 5px;
}

.seminarlink{
  padding-top: 5rem;
  color: var(--green);
  text-decoration: underline;
}
.seminarlink:hover{
  text-decoration: none;
}

/* ======== bussiness ======== */
.bussiness img{
  width: 100%;
}

/* ======== archive ======== */

.archive .item {
  position: relative;
  margin: 0 15px;
  /* background: #ffffff; */
  overflow: hidden;
}

.archive .item img {
  width: 100%;
  height: 200px;
  object-fit: inherit;
  margin-bottom: 25px;
}

.archive .item h5 {
  text-align: center;
  color: var(--green);
}

.archive .item h4 {
  text-align: center;
}

.video_thumb {
  /* width: 400px; */
  /* height: 300px; */
  display: block;
  /* border: 2px solid #fff; */
  margin: 2em auto;
  overflow: hidden;
}
.video_thumb img {
  display: block;
  max-width: 100%;
}

.archive_tab td{
  position: relative;
}
.video_tt{
  position: absolute;
  top: 80px;
  width: 80%;
  padding: 10px 0;
  /* border-radius: 20px; */
  margin: 0;
  color: #fff;
  background: var(--green);
  background: rgba(47, 184, 177, 0.7);
}
.play-button {
  position: absolute;
  top: 180px;
  /* top: 50%; */
  /* top: calc(50% - 25px); */
  /* left: calc(50% - 50px); */
  width: 100px;
  height: 100px;
  display: block;
  border: 2px solid #fff;
  border-radius: 50%;
  padding: 0;
  margin: 0 auto;
  user-select: none;
  background-color: rgba(0, 0, 0, 0.6);
  transition: background-color 0.5s ease;
}
.play-button:after {
  position: absolute;
  top: calc(50% - 25px);
  left: calc(50% - 14px);
  display: block;
  content: '';
  box-sizing: border-box;
  border-color: transparent transparent transparent #fff;
  border-style: solid;
  border-width: 26px 0 26px 40px;
}
.play-button:hover {
  background-color: rgba(0, 33, 66, 0.9);
}



/* ======== start dialog ======== */

.modal {
  display: none; 
  position: fixed; 
  z-index: 1; 
  padding-top: 100px; 
  left: 0;
  top: 0;
  width: 100%; 
  height: 100%; 
  overflow: auto; 
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0,0.4); 
}

.modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  /* border: 1px solid #888; */
  border: 10px double var(--orange);
  width: 80%;
}

.dialog_close {
  color: #aaaaaa;
  float: right;
  font-weight: bold;
}

.dialog_close:hover,
.dialog_close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

/* ======== end dialog ======== */


/* ======== it_care ======== */

.care_img img{
  width: 70%;
  margin: 1rem 0 4rem 0;
}

/* ======== about ======== */

.about_bg_img{
  background: url(../../assets/img/recurrent04.jpeg);
  height: 400px;
  background-repeat: repeat;
  background-size: cover;
  background-position: center;
}
.scroll_tab {
  width: 100%;
  overflow-x: auto;
}
.about table {
  border-collapse: separate;
  border-spacing: 1rem 0;
  /* min-width: 600px; */
  width: 100%;
}
.about table th, .about table td{
  padding: 8px 0;
  border-bottom: 2px dotted var(--green);
}
.about table th{
  color: var(--green);
  font-size: 20px;
  font-weight: 500;
}
.about table th:first-child{
  min-width: 100px;
}

/* ======== contact ======== */


/* .leaflet .content{
  height: 400px;
  overflow-y: scroll;
  border: 1px solid #555;
} */

#webkit_scrollbar::-webkit-scrollbar {
  display: block!important;
  background: lightyellow;
  width: 12px;
    }
#webkit_scrollbar::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
  border-radius: 10px;
}
#webkit_scrollbar::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}
div.scrollbar {
  height: 350px;
  border: 1px solid gray;
  overflow-y: scroll;
}
#webkit_scrollbar:hover::-webkit-scrollbar {
  background: lightgreen;
}
div.scrollbar > div {
  height: 400px;
}

 


.leaflet .content img{
  width: 100%;
}

.contact .row h3{
  color: #fff;
  text-align: center;
  padding: 3rem;
}

.contact .row .col-lg-5:hover{
  opacity: .8;
}

/* ======= page-footer ======= */

.page-footer {
  position: relative;
  display: block;
  padding: 80px 0;
  background: var(--footer);
}
.page-footer h3{
  text-align: center;
  color: #fff;
}


.maps-container {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  background-color: #F6F5FC;
  overflow: hidden;
}

#google-maps {
  width: 100%;
  height: 100%;
}

.custom-img-1 {
  width: auto;
  max-width: 390px;
}

.custom-index {
  z-index: 11;
}


/* Custom Plugin */
.owl-nav {
  display: block;
  margin: 15px auto;
  text-align: center;
}

.owl-carousel .owl-nav button.owl-next,
.owl-carousel .owl-nav button.owl-prev {
  display: inline-block;
  padding: 6px 0 !important;
  background-color: var(--green);
  color: #fff;
}

.owl-carousel .owl-nav button.owl-next {
  padding-right: 14px !important;
  padding-left: 7px !important;
  border-radius: 0 40px 40px 0;
}

.owl-carousel .owl-nav button.owl-prev {
  padding-right: 7px !important;
  padding-left: 14px !important;
  border-radius: 40px 0 0 40px;
}

.owl-carousel .owl-dots {
  display: block;
  margin: 16px auto;
  text-align: center;
}

.owl-carousel button.owl-dot {
  display: inline-block;
  margin: 3px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #aba7c2;
  transition: all .2s ease;
}

.owl-carousel button.owl-dot:focus {
  outline: none;
}

.owl-carousel button.owl-dot.active {
  background-color: var(--green);
}


/* ======== start videos ======== */
.videos_bg_img {
  background: url(../../assets/img/bussiness.jpeg);
  background-size: cover;
  background-position: top;
  height: 50vh;
}
.recodes_bg_img{
  background: url(../../assets/img/recurrent03.jpeg);
  background-size: cover;
  background-position: top;
  height: 50vh;
}

.course_block {
  /* width: calc(33.33% - 17px); */
  display: inline-block;
  vertical-align: top;
  margin: 0;
  color: rgba(0,0,0,.6);
  transition: .8s;
  text-decoration: none;
  position: relative;
  /* overflow: hidden; */
  box-sizing: border-box;
}
.course_block:hover .course_image>img {
  filter: blur(4px);
  -webkit-filter: blur(4px);
}
/* .course_block:nth-child(3n), .course_block:nth-child(3n+1) {
  margin: 12px 0
} */
.course_block img {
  width: 100%;
  transition: .8s
}
.course_details {
  padding: 10px 15px;
}
.course_details p {
  height: 38px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2; /* number of lines to show */
          line-clamp: 2; 
  -webkit-box-orient: vertical;

}
.course_block h3 {
  font-size: 16px;
  margin: 0 0 10px 0;
  text-align: center;
}
.course_block p {
  font-size: 14px;
  margin: 0;
}
.course_image {
  position: relative;
  overflow: hidden;
}
.course_date {
  position: absolute;
  bottom: 18px;
  right: 12px;
  background: rgba(0,0,0,.6);
  font-size: 13px;
  padding: 4px 8px;
  border-radius: 3px;
  color: #fff;
}
.course_top_notices {
  position: absolute;
  top: 10px;
  right: 12px;
}
.course_new, .course_unique {
  font-size: 12px;
  display: inline-block;
  padding: 2px 5px;
  font-weight: bold;
  border-radius: 3px;
  margin-left: 5px;
}
.course_unique, .course_new {
  background: white;
}
.view_course {
  position: absolute;
  top: 40%;
  left: calc(50% - 70px);
  width: 140px;
  text-align: center;
  background: rgba(0,0,0,.1);
  box-sizing: border-box;
  padding: 8px 10px;
  border-radius: 5px;
  border: 1px solid #fff;
  color:#fff;
  transition: .8s;
  opacity: 0
}
.course_block:hover .view_course {
  opacity: 1
}
.absolute_top{
  position: absolute;
  top: 0;
  right: 0;
  z-index: 99;
}

.tags {
  display: inline-block;
  position: relative;
  margin-right: -20px;
  padding: 8px 20px;
  font-size: 15px;
  color: #FFF;
  background: var(--accent);
}
  
  .tags::after {
    position: absolute;
    content: '';
    top: 100%;
    right: 0;
    border: none;
    border-bottom: solid 15px transparent;
    border-left: solid 20px rgb(149, 158, 155);
  }
  

  .tabs_gallery {
    padding: 2rem 0;
    }
    
    .tabs_slider {
    margin: 20px 0;
    display: flex;
    flex-wrap: wrap;
    font-size: 16px;
    font-weight: bold;
    }

    .link_tt {
      background: var(--blue);
      padding: 1rem;
      margin-left: 1rem;
      border-radius: 20px;
      min-width: 100px;
    }
    .link_tt:first-child {
      margin-left: 0!important;
    }
    .link_tt:hover{
      cursor: pointer;
      cursor: hand;
    }
    .tabs_link span {
      color: #fff!important;
      display:flex;
      justify-content: center;
      width: 100%;
    }
    
    .tabs_title {
    margin: 20px 0;
    display: grid;
    grid-template: repeat(1, 250px)/repeat(3, 1fr);
    gap: 10px;
    justify-content: space-around;
    }
    .tabs_title .row{
      width: 100%;
    }
    
    .course_vid .videos_list .col-sm-4:first-child .videos_content img,
    .course_vid .videos_list .col-md-4:first-child .videos_content img{
      height: auto!important;
      object-fit: contain!important;
    }
    .course_vid .tabs_gallery img {
    height: 210px;
    width: 100%;
    object-fit: cover;
    }
    .seminar_vid .tabs_gallery img{
      width: 100%;
      object-fit: contain;
    }
    
    .videos_list{
      justify-content: space-around!important;
    }
    .videos_list .videos_content{
      box-shadow: 0 0 10px rgba(0,0,0,.3);
      height: 100%;
    }

    .videos_list .col-sm-4:first-child, .videos_list .col-md-4:first-child{
      max-width: 100%!important;
      width: 100%!important;
      height: auto;
      flex: auto;
      display: flex;
      justify-content: center;
      align-items: center;
      margin-bottom: 2rem;
    }
    .videos_list .col-sm-4:first-child .videos_content, .videos_list .col-md-4:first-child .videos_content{
      width: 44%!important;
    }

    .videos_btn{
      width: 100%;
    }
    
    .dl_btn, .link_btn{
      text-align: center;
      padding: 10px;
      color: #000;
      /* width: 100%; */
      float: left;
      font-size: 16px;
    }
    .dl_btn{ 
      background: #9fc7f3;
    }
    .link_btn{
      background: #dffb3f;
    }
    .videos_btn a:first-child div{
      width: 100%!important;
    }



/* ======== end videos ======== */


/* ======== start send ======== */

.send_bg{
  background: url(../../assets/img/recurrent_main.jpeg);
  height: 100vh;
  background-size: cover;
  background-position: center;
}
.send_card .content {
  padding: 2rem;
  width: 90%;
  max-width: 600px;
  border: 15px double var(--success);
  background: rgba(255, 255, 255, 0.8);
}
.send_card h1{
  color: var(--blue);
}

.err_card .content{
  border: 15px double var(--orange)!important;
}

/* ======== end send ======== */

.name_list div{
  /* width: 24%; */
  /* min-width: 120px; */
  padding: 5px 10px;
  /* border: 1px solid var(--primary); */
}

/* ======== start course page ======== */

.course_bg_img {
  background: url(../../assets/img/recurrent02.jpeg);
  background-size: cover;
  background-position: center;
  height: 50vh;
}

.page_tt{
  height: 50vh;
}
.blog-content img{
  /* width: auto;
  max-width: 100%; */
  width: 100%;
  height: 200px;
  object-fit: cover;
  margin-top: 3rem;
}
.background_div {
  background: url(../../assets/img/recurrent05.jpeg);
  background-size: cover;
  background-position: center;
  min-height: 300px;
}
.background_div .content{
  background: rgba(255, 255, 255, 0.7);
  padding: 3rem;
}

.tt_icon img {
  max-height: 80px;
}

.addr_tab th{
  border-right: 4px solid var(--dark);
  padding: 5px 15px;
  font-weight: normal;
  vertical-align: top;
}
.addr_tab td{
  padding: 5px 15px;
}
.addr_tab td p{
  margin-bottom: 5px;
}
.access .row{
  padding: 3rem 0;
  border-bottom: 1px solid #808080;
}
.access .row:last-child{
  border-bottom: none;
}
.access .img-place img {
  width: auto;
  max-width: 100%;
  object-fit: cover;
  height: 280px;
}


/* ======== end course ======== */

/* ======== start detail ======== */

.details_link{
  display: flex;
  padding: 10px 20px;
  /* width: 50%; */
}
.details_item{
  width: 100%;
  position: relative;
  margin-bottom: 1rem;
}
.details_item p{
  margin: 0 10px 0 0;
}
.details_item .tags{
  margin-right: -5px;
  margin-top: -5px;
  padding: 5px 20px;
  background: var(--success);
}

/* ======== end course ======== */

@media (max-width: 991px){
  .navbar-nav {
    background:rgba(255, 255, 255, 0.9);
    padding-top: 0!important;
  }
  .navbar-light .navbar-nav .nav-link{
    color: var(--green);
    padding: 5px 1rem;
    border-bottom: 1px dotted var(--green);
  }
  .navbar-light .navbar-nav .nav-link:hover{
    background: var(--green);
    color: #fff;
  }
  .head_icon{
    height: 30px;
  }

  .navbar-light .flex_row_start .nav-link{
    border-bottom: 0;
    /* padding: .7rem 0 .7rem 2rem; */
  }
  .navbar-light .flex_row_start .nav-link:hover{
    background: none!important;
    opacity: .5;
  }
  .logoutbtn{
    width: 100%;
    text-align: left;
    border-top: 0;
    border-left: 0;
    border-right: 0;
    background: none;
  }
  .course_bg_img, .videos_bg_img, .recodes_bg_img{
    height: 40vh;
  }
  .course_bg_img, .page_tt {
    height: 40vh;
  }
  
  .order_1{
    order: 1;
  }
  .order_2{
    order: 2;
  }
  .contact .col-lg-5{
    width: 45%;
  }
  .contact .row h3{
    padding: 2rem;
  }

  .video_tt{
    top: 55px;
  }
  .archive .bg_img_400{
    height: 300px;
  }
  .play-button{
    top: 140px;
    width: 80px;
    height: 80px;
  }
  .play-button:after{
    top: calc(50% - 22px);
    left: calc(50% - 10px);
    border-width: 20px 0 24px 30px;
  }

   
  .tags{
    margin-right: -10px;
    padding: 5px 8px;
    font-size: 10px;
  }
  .tags::after{
    border-bottom: solid 10px transparent;
    border-left: solid 10px rgb(149, 158, 155);
  }
  .course_date{
    font-size: 10px;
    bottom: 6px;
  }
  .details_item .tags{
    margin-right: 5px;
  }

  .course_vid .tabs_gallery img {
    height: 150px;
    }

}
@media (max-width: 768px){
  .navbar{
    padding-top: 0;
    padding-bottom: 0;
    min-height: 50px;
  }
  .logo_img img{
    height: 40px;
  }
  footer h3{
    font-size: 1.5rem;
  }
  .sec_title h1{
    font-size: 3.5rem;
  }
  .page-section{
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .title_center{
    margin-bottom: 2rem;
  }
  .title-section{
    font-size: 1.7rem;
  }
  /* .tabs_gallery img {
    height: 180px;
    width: 100%;
    } */
}
@media (max-width: 767px){
  .videos_list .col-md-4:first-child img{
    height: auto!important;
  }
  .videos_list .col-md-4:first-child .videos_content{
    width: auto!important;
  }
  .course_vid .tabs_gallery img {
    height: auto!important;
    object-fit: contain;
    }

}
@media (max-width: 575px){
  .videos_list .col-sm-4:first-child .videos_content{
    width: auto!important;
  }
}
@media (max-width: 540px){
  .mac_vid img{
    width: 300px;
  }
  .mac_vid_content{
    left: 10px;
  }
  .mac_vid_content iframe{
    width: 280px;
    height: 170px;
  }

  .sec_title h1{
    font-size: 2.5rem;
  }
  .sec_title h4{
    padding: 6px 20px;
    font-size: 1.3rem;
  }
  .contact .col-lg-5{
    width: 100%;
  }
  .send_card h1{
    font-size: 1.3rem;
  }
  .background_div .content{
    padding: 2rem;
  }

  .seminar table td{
    width: 100%;
    float: left;
    padding: 0 15px;
  }
  .seminar table tr{
    border-bottom: 1px solid var(--green);
  }
  .seminar table tr td:first-child{
    padding-top: 10px;
  }
  .seminar table tr td:last-child{
    padding-bottom: 10px;
  }

  div.scrollbar {
    height: 250px;
  }
  div.scrollbar > div {
    height: 300px;
  }
  .archive_tab td{
    width: 100%!important;
    display: flex;
  }
  .videos_list .col-sm-4:first-child img{
    height: auto!important;
  }
  
}
@media (max-width: 425px){
  .none_425{
    display: block;
  }
  .d_425{
    display: none;
  }
  .send_card .content{
    padding: 1.5rem 1rem;
    border: 10px double var(--accent);
  }
  .send_card h5{
    font-size: 1rem;
  }

  .err_card h2{
    font-size: 1.2rem;
  }
  .addr_tab th, .addr_tab td{
    width: 100%;
    float: left;
  }
  .addr_tab th{
    font-weight: 600;
    border-right: none;
  }
  /* .course_bg_img, .page_tt {
    height: 30vh;
  } */
}
  
@media (max-width: 375px){
  /* .mac_vid .content{
    margin-top: -5vh;
  } */
  .background_div .content{
    padding: 1.4rem;
    margin: 1.5rem 0px!important;
  }

}

@media (max-width: 540px){
.videotab {
    gap: 10px !important;
   flex-direction: column;
}}