a,
.btn,
button,
span,
p,
i,
input,
select,
textarea,
li,
img,
*::after,
*::before,
.transition-3,
h1 {
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}


/*----------------------------------------*/
/*  02. HEADER CSS START
/*----------------------------------------*/
.header__area.sticky, .header__bottom.sticky {
  left: 0;
  margin: auto;
  position: fixed !important;
  top: 0;
  width: 100%;
  box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.07);
  z-index: 99;
  -webkit-animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
  animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
  -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
  background: #ffffff;
}
.header__transparent {
  
  left: 0;
  right: 0;

  width: 100%;
 
    -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    background: #ffffff;
}
.header__right a.login {
  font-size: 15px;
  color: #070337;
}
.header__right a.login:hover {
  color: #5551ef;
}
.header__border {
  border-top: 4px solid #f385df;
}
.header__border-bottom {
  border-bottom: 1px solid #f1f1f3;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header__padding {
    padding: 15px 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .header__padding {
    padding: 15px 0;
  }
}
@media (max-width: 575px) {
  .header__padding {
    padding: 15px 0;
  }
}
.header__shadow {
  -webkit-box-shadow: 0px 30px 40px 0px rgba(10, 0, 48, 0.2);
  -moz-box-shadow: 0px 30px 40px 0px rgba(10, 0, 48, 0.2);
  box-shadow: 0px 30px 40px 0px rgba(10, 0, 48, 0.2);
  position: relative;
  z-index: 9;
}
.header__shadow-2 {
  -webkit-box-shadow: 0px 10px 20px 0px rgba(3, 1, 30, 0.06);
  -moz-box-shadow: 0px 10px 20px 0px rgba(3, 1, 30, 0.06);
  box-shadow: 0px 10px 20px 0px rgba(3, 1, 30, 0.06);
}
.header__info a {
  color: #6d737a;
  font-size: 13px;
  font-weight: 600;
}
.header__info a:not(:last-child) {
  margin-right: 20px;
}
.header__info a:hover {
  color: #1c7df8;
}
.header__info a i {
  color: #1c7df8;
  padding-right: 3px;
  display: inline-block;
}
.header__info a i.w-phone {
  -webkit-animation: phoneShake 1s linear infinite;
  -moz-animation: phoneShake 1s linear infinite;
  -o-animation: phoneShake 1s linear infinite;
  animation: phoneShake 1s linear infinite;
}
.header__social h5 {
  font-size: 13px;
  font-weight: 600;
  color: #6d737a;
  display: inline-block;
  margin-right: 10px;
  margin-bottom: 0;
}
.header__social ul {
  display: inline-block;
}
.header__social ul li {
  display: inline-block;
}
.header__social ul li:not(:last-child) {
  margin-right: 15px;
}
.header__social ul li a {
  font-size: 13px;
  color: #6d737a;
}
.header__social ul li a:hover {
  color: #1c7df8;
}
.header__search a {
  font-size: 17px;
  color: #011224;
}
.header__btn {
  font-size: 15px;
  font-weight: 600;
  color: #070337;
  text-transform: capitalize;
}
.header__btn:hover {
  color: #5551ef;
}

@keyframes phoneShake {
  0%, 100% {
    transform: rotate(0) scale(1) skew(1deg);
  }
  10% {
    transform: rotate(-25deg) scale(1) skew(1deg);
  }
  20%, 40% {
    transform: rotate(25deg) scale(1) skew(1deg);
  }
  30% {
    transform: rotate(-25deg) scale(1) skew(1deg);
  }
  50% {
    transform: rotate(0) scale(1) skew(1deg);
  }
}
/* main menu css */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .main-menu {
    padding-left: 40px;
  }
}
.main-menu ul li {
  display: inline-block;
  position: relative;
}
.main-menu ul li:not(:last-child) {
  margin-right: 40px;
}
@media only screen and (min-width: 1199px) and (max-width: 1499px) {
  .main-menu ul li:not(:last-child) {
    margin-right: 29px;
  }
}

@media only screen and (max-width: 992px) {
  .main-menu ul li:not(:last-child) {
    margin-right: 7px;
  }
}
.main-menu ul li.has-dropdown > a {
  position: relative;
}
.main-menu ul li.has-dropdown > a::after {
  content: "";
  -webkit-transform: translateY(1px);
  -moz-transform: translateY(1px);
  -ms-transform: translateY(1px);
  transform: translateY(1px);
  font-size: 14px;
  color: #070337;
  font-family: "Font Awesome 5 Pro";
  font-weight: 400;
  margin-left: 5px;
  display: inline-block;
}
.main-menu ul li a {
  font-size: 15px;
  font-weight: 600;
  color: #070337;
  display: block;
  padding: 35px 0;
}
.main-menu ul li:hover > a {
  color: #5551ef;
}
.main-menu ul li:hover > a::after {
  color: #5551ef;
}
.main-menu ul li:hover .submenu {
  top: 100%;
  visibility: visible;
  opacity: 1;
}
.main-menu ul li .submenu {
  position: absolute;
  top: 120%;
  left: 0;
  width: 200px;
  background: #ffffff;
  z-index: 99;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
  visibility: hidden;
  opacity: 0;
  -webkit-box-shadow: 0px 30px 70px 0px rgba(11, 6, 70, 0.08);
  -moz-box-shadow: 0px 30px 70px 0px rgba(11, 6, 70, 0.08);
  box-shadow: 0px 30px 70px 0px rgba(11, 6, 70, 0.08);
}
.main-menu ul li .submenu li {
  display: block;
  width: 100%;
}
.main-menu ul li .submenu li:not(:last-child) {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.main-menu ul li .submenu li.has-dropdown > a::after {
  right: 25px;
  -webkit-transform: translateY(-50%) rotate(-90deg);
  -moz-transform: translateY(-50%) rotate(-90deg);
  -ms-transform: translateY(-50%) rotate(-90deg);
  transform: translateY(-50%) rotate(-90deg);
}
.main-menu ul li .submenu li a {
  padding: 10px 25px;
  font-size: 13px;
  position: relative;
  z-index: 1;
}
.main-menu ul li .submenu li a::before {
  position: absolute;
  content: "";
  top: 0;
  left: auto;
  right: 0;
  width: 0;
  height: 100%;
  background: #5551ef;
  z-index: -1;
}
.main-menu ul li .submenu li .submenu {
  left: 120%;
  top: 0;
  visibility: hidden;
  opacity: 0;
}
.main-menu ul li .submenu li:hover > a {
  color: #ffffff;
}
.main-menu ul li .submenu li:hover > a::after {
  color: #ffffff;
}
.main-menu ul li .submenu li:hover > a::before {
  left: 0;
  right: auto;
  width: 100%;
}
.main-menu ul li .submenu li:hover .submenu {
  left: 100%;
  visibility: visible;
  opacity: 1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .main-menu-2 {
    padding-left: 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .main-menu-2 ul li:not(:last-child) {
    margin-right: 19px;
  }
}
.main-menu-2 ul li a {
  padding: 28px 0;
  padding-bottom: 32px;
}
.main-menu-2 ul li:hover > a {
  color: #2f80ed;
}
.main-menu-2 ul li:hover > a::after {
  color: #2f80ed;
}
.main-menu-2 ul li .submenu li a::before {
  background: #2f80ed;
}
.main-menu-3 ul li:not(:last-child) {
  margin-right: 35px;
}
.main-menu-3 ul li a {
  color: #0a0030;
  padding: 25px 0;
  padding-bottom: 29px;
}
.main-menu-3 ul li:hover > a {
  color: #5d41c2;
}
.main-menu-3 ul li:hover > a::after {
  color: #5d41c2;
}
.main-menu-3 ul li .submenu li a::before {
  background: #5d41c2;
}
.main-menu-4 ul li a {
  color: #0f1432;
  padding: 30px 0;
  padding-bottom: 33px;
}
.main-menu-4 ul li:hover > a {
  color: #6c63ff;
}
.main-menu-4 ul li:hover > a::after {
  color: #6c63ff;
}
.main-menu-4 ul li .submenu li a::before {
  background: #6c63ff;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .main-menu-5 {
    margin-left: 70px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .main-menu-5 {
    margin-left: 0px;
  }
}
.main-menu-5 ul li:not(:last-child) {
  margin-right: 40px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .main-menu-5 ul li:not(:last-child) {
    margin-right: 25px;
  }
}
.main-menu-5 ul li a {
  color: #011224;
  padding: 27px 0;
  padding-bottom: 31px;
}
.main-menu-5 ul li:hover > a {
  color: #1c7df8;
}
.main-menu-5 ul li:hover > a::after {
  color: #1c7df8;
}
.main-menu-5 ul li .submenu li a::before {
  background: #1c7df8;
}

/* sidebar area start */
.sidebar__area {
  position: fixed;
  right: -340px;
  top: 0;
  width: 320px;
  height: 100%;
  background: #ffffff none repeat scroll 0 0;
  overflow-y: scroll;
  -webkit-box-shadow: -5px 0 20px -5px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: -5px 0 20px -5px rgba(0, 0, 0, 0.5);
  box-shadow: -5px 0 20px -5px rgba(0, 0, 0, 0.5);
  -webkit-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  z-index: 9999;
}
.sidebar__area.sidebar-opened {
  right: 0px;
}
.sidebar__wrapper {
  position: relative;
  padding: 30px;
}
.sidebar__close {
  position: absolute;
  top: 30px;
  right: 80px;
}
.sidebar__close-btn {
  transition: all 450ms cubic-bezier(0.4, 0.25, 0.3, 1.3);
  width: 40px;
  height: 40px;
  position: absolute;
  text-align: center;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  justify-content: center;
  align-items: center;
  color: #222222;
  border: 1px solid rgba(34, 34, 34, 0.9);
  border-radius: 50%;
  cursor: pointer;
  overflow: hidden;
  background: transparent;
  z-index: 99;
}
.sidebar__close-btn:focus {
  border: 1px solid #222222;
}
.sidebar__close-btn span {
  transition: all 400ms cubic-bezier(0.4, 0.25, 0.3, 1.3) 100ms;
  position: absolute;
  top: 47%;
  left: 50%;
  font-size: 14px;
  font-weight: 900;
  line-height: 40px;
  vertical-align: middle;
}
.sidebar__close-btn span:first-of-type {
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
}
.sidebar__close-btn span:last-of-type {
  text-transform: uppercase;
  transform: translate(-50%, 50%);
  -webkit-transform: translate(-50%, 50%);
  -moz-transform: translate(-50%, 50%);
  -ms-transform: translate(-50%, 50%);
  -o-transform: translate(-50%, 50%);
}
.sidebar__close-btn:hover {
  width: 80px;
  border-radius: 0;
}
.sidebar__close-btn:hover span:first-of-type {
  transform: translate(-50%, -150%);
  -webkit-transform: translate(-50%, -150%);
  -moz-transform: translate(-50%, -150%);
  -ms-transform: translate(-50%, -150%);
  -o-transform: translate(-50%, -150%);
}
.sidebar__close-btn:hover span:last-of-type {
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sidebar-toggle-btn {
    margin-left: 50px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .sidebar-toggle-btn {
    margin-left: 30px;
  }
}
@media (max-width: 575px) {
  .sidebar-toggle-btn {
    margin-left: 30px;
  }
}
.sidebar-toggle-btn .line {
  width: 30px;
  height: 3px;
  background-color: #5551ef;
  display: block;
  margin: 6px auto;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.sidebar-toggle-btn:hover {
  cursor: pointer;
}
.sidebar-toggle-btn:hover .line {
  -webkit-transform: rotate(-30deg);
  -ms-transform: rotate(-30deg);
  -o-transform: rotate(-30deg);
  -moz-transform: rotate(-30deg);
  transform: rotate(-30deg);
}
.sidebar-toggle-btn:hover .line:nth-child(1) {
  width: 10px;
}
.sidebar-toggle-btn:hover .line:nth-child(2) {
  width: 20px;
}
.sidebar-toggle-btn-2 .line {
  background-color: #2f80ed;
}
.sidebar-toggle-btn-2 .line {
  background-color: #5d41c2;
}
.sidebar-toggle-btn-5 .line {
  background-color: #1c7df8;
}

.body-overlay {
  background-color: rgba(0, 0, 0, 0.5);
  height: 100%;
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 999;
  left: 0;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

.body-overlay.opened {
  opacity: 1;
  visibility: visible;
}

.search-form {
  position: fixed;
  top: 70%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50%;
  opacity: 0;
  visibility: hidden;
  z-index: 9999;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .search-form {
    width: 80%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .search-form {
    width: 80%;
  }
}
@media (max-width: 575px) {
  .search-form {
    width: 80%;
  }
}

.search-form input {
  width: 100%;
  height: 60px;
  line-height: 60px;
  border: 2px solid #ffffff;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  background-color: transparent;
  padding-left: 30px;
  padding-right: 65px;
  font-size: 14px;
  color: #ffffff;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

.search-form input::placeholder {
  color: #ffffff;
  font-weight: 600;
}

.search-form input:focus {
  border-color: #1c7df8;
  outline: none;
}

.search-form .search-btn {
  position: absolute;
  top: 0;
  right: 10px;
  width: 50px;
  height: 100%;
  text-align: center;
  line-height: 60px;
  background-color: transparent;
  color: #ffffff;
  font-size: 18px;
}
.search-form .search-btn:hover {
  cursor: pointer;
  color: #1c7df8;
}

.search-close {
  position: absolute;
  top: -250px;
  right: -150px;
  color: #ffffff;
  font-size: 25px;
  z-index: 9999;
}
.search-close:hover {
  color: #1c7df8;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .search-close {
    right: 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .search-close {
    right: 0;
  }
}
@media (max-width: 575px) {
  .search-close {
    right: 0;
  }
}

.search-wrapper.search-open .search-form {
  top: 50%;
  opacity: 1;
  visibility: visible;
}

/* mean menu customize */
.mean-container a.meanmenu-reveal {
  display: none;
}

.mean-container .mean-nav {
  background: none;
  margin-top: 0;
}

.mean-container .mean-bar {
  padding: 0;
  min-height: auto;
  background: none;
}

.mean-container .mean-nav > ul {
  padding: 0;
  margin: 0;
  width: 100%;
  list-style-type: none;
  display: block !important;
}

.mean-container a.meanmenu-reveal {
  display: none !important;
}

.mean-container .mean-nav ul li a {
  width: 100%;
  padding: 10px 0;
  color: #222222;
  border-top: 1px solid #dedee3;
  font-size: 13px;
  font-weight: 600;
}

.mean-container .mean-nav ul li a:hover {
  color: #5551ef;
  letter-spacing: 2px;
}

.mobile-menu-2.mean-container .mean-nav ul li a:hover {
  color: #2f80ed;
}

.mobile-menu-3.mean-container .mean-nav ul li a:hover {
  color: #5d41c2;
}

.mobile-menu-5.mean-container .mean-nav ul li a:hover {
  color: #1c7df8;
}

.mean-container .mean-nav ul li a.mean-expand {
  margin-top: 2px;
  height: 15px;
  line-height: 14px;
  border-bottom: none;
  padding: 0;
  display: inline-block;
  width: 40px;
  height: 44px;
  line-height: 44px;
}

.mean-container .mean-nav ul li a.mean-expand:hover {
  color: #222222;
}

.mean-container .mean-nav > ul > li:first-child > a {
  border-top: 0;
}

.mean-container .mean-nav ul li a.mean-expand.mean-clicked {
  color: #222222;
}

.mean-container .mean-nav ul li a.mean-expand.mean-clicked i {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  color: #222222;
}

/* theme btn */
.w-btn {
  font-size: 15px;
  color: #ffffff;
  background: #5551ef;
  height: 44px;
  line-height: 40px;
  border: 2px solid #5551ef;
  text-align: center;
  padding: 0 30px;
  display: inline-block;
  font-weight: 600;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  text-transform: capitalize;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.w-btn::after {
  position: absolute;
  content: "";
  z-index: -1;
  display: block;
  left: -20%;
  right: -20%;
  top: -4%;
  height: 150%;
  width: 150%;
  bottom: 0;
  -webkit-transform: skewX(45deg) scale(0, 1);
  -moz-transform: skewX(45deg) scale(0, 1);
  -ms-transform: skewX(45deg) scale(0, 1);
  transform: skewX(45deg) scale(0, 1);
  background: #ffffff;
}
.w-btn:hover {
  color: #5551ef;
  -webkit-box-shadow: 0px 20px 60px 0px rgba(15, 0, 40, 0.2);
  -moz-box-shadow: 0px 20px 60px 0px rgba(15, 0, 40, 0.2);
  box-shadow: 0px 20px 60px 0px rgba(15, 0, 40, 0.2);
}
.w-btn:hover::after {
  -webkit-transform: skewX(45deg) scale(1, 1);
  -moz-transform: skewX(45deg) scale(1, 1);
  -ms-transform: skewX(45deg) scale(1, 1);
  transform: skewX(45deg) scale(1, 1);
}
.w-btn-transparent {
  background: transparent;
  border-color: transparent;
  color: #070337;
}
.w-btn-transparent::after {
  display: none;
}
.w-btn-transparent:hover {
  background: transparent;
  color: #5551ef;
}
.w-btn-transparent-2 {
  font-size: 15px;
  color: #011224;
  background: transparent;
  padding: 0;
}
.w-btn-transparent-2:hover {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  color: #1c7df8;
}
.w-btn-white {
  background: #ffffff;
  color: #5551ef;
  border-color: #ffffff;
}

@media (max-width: 1600px){
.logo img {
    height: 38px;
}}


/* ------------------------
    Featured Box
------------------------*/
.featured-item {
    padding: 40px 20px;
    position: relative;
    /* -webkit-box-shadow: 0px 15px 35px rgba(0, 0, 0, 0.1); */
    -moz-box-shadow: 0px 15px 35px rgba(0, 0, 0, 0.1);
    /* box-shadow: 0px 15px 35px rgba(0, 0, 0, 0.1); */
    box-shadow: #cfc5c5 0px 1px 13px;
    background: #fff;
	margin-bottom:30px;
}
    -moz-box-shadow: 0px 15px 35px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 15px 35px rgba(0, 0, 0, 0.1);}
.featured-item:hover{background: #ffffff;}
.featured-item .featured-icon{display:inline-block;}
.featured-desc p{margin-bottom: 0; font-size: 14px;}
.featured-title h5{margin: 30px 0 20px; text-transform: capitalize;}
.dark-bg .featured-title h5, .dark-bg .featured-desc, .theme-bg .featured-title h5, .theme-bg .featured-desc, .theme-bg .featured-icon i{color: #ffffff}
.light-bg .featured-desc p{color: #111121} 

.featured-item.style-2{background: #ffffff; padding: 60px 30px;}

.featured-item.style-3{background: #ffffff; padding: 50px 30px 50px 200px;    margin-bottom: 20px;}
.featured-item.style-3 .featured-icon{position: absolute; left: 30px; top: 50%;}
.featured-item.style-3 .featured-title h5{margin-top: 0;}

.featured-item.style-4:hover, .featured-item.style-4.active{transform: inherit; border-radius: 15px; background: #ffffff;}
.featured-item.style-4 .featured-icon i{background: #ffffff; color: #5551ef; display: inline-block; font-size: 30px; width: 70px; height: 70px; line-height: 70px; text-align: center; border-radius: 50%;}
.featured-item.style-4:hover .featured-icon i{background: #5551ef; color: #ffffff;}
.featured-item.style-4.active .featured-icon i{background: #5551ef; color: #ffffff;}
.owl-carousel .featured-item{-webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1); box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1);}


.title:before {position:absolute; left: 0; width:100px; margin:0 auto; bottom:0; height: 3px; animation: rotate 80s infinite linear; -webkit-animation: rotate 80s infinite linear; content: ""; border-radius: 5px;
  background: rgb(85,81,239,1); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(85,81,239,1) 0%, rgba(85,81,239,1) 25%, rgba(85,81,239,1) 50%, rgba(85,81,239,1) 75%, rgba(85,81,239,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(85,81,239,1)), color-stop(25%,rgba(85,81,239,1)), color-stop(50%,rgba(85,81,239,1)), color-stop(75%,rgba(85,81,239,1)), color-stop(100%,rgba(85,81,239,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left,  rgba(85,81,239,1) 0%,rgba(85,81,239,1) 25%,rgba(85,81,239,1) 50%,rgba(85,81,239,1) 75%,rgba(85,81,239,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left,  rgba(85,81,239,1) 0%,rgba(85,81,239,1) 25%,rgba(85,81,239,1) 50%,rgba(85,81,239,1) 75%,rgba(85,81,239,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left,  rgba(85,81,239,1) 0%,rgba(85,81,239,1) 25%,rgba(85,81,239,1) 50%,rgba(85,81,239,1) 75%,rgba(85,81,239,1) 100%); /* IE10+ */
background: linear-gradient(to right,  rgba(85,81,239,1) 0%,rgba(85,81,239,1) 25%,rgba(85,81,239,1) 50%,rgba(85,81,239,1) 75%,rgba(85,81,239,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5551ef', endColorstr='#5551ef',GradientType=1 ); /* IE6-9 */}


.list-unstyled {
    padding-left: 0;
    list-style: none;
    display: inline-grid;
}


.tooimt{
	margin-top:60px;
}

.bbtooi{
	background:url("tooiv6/04.png")
}

.bounce-effect {
	position:relative;
	-webkit-animation:bounce-hero 3s infinite;
	   -moz-animation:bounce-hero 3s infinite;
			animation:bounce-hero 3s infinite;
}

@keyframes bounce-hero {
    0% 		{top:0px;}
    50% 	{top:25px;}
    100% 	{top:0px;}
}

.header-top-bar {
    background-color: #5551ef;
}

.header-top {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}


.header-top .header-top-left {
    margin-right: 30px;
}

.header-top .header-info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 -30px;
}

.header-top .header-info li {
    display: inline-block;
    margin: 0;
    font-size: 14px;
    color:#fff;
    padding: 14px 30px 12px;
    position: relative;
}
.header-top .header-info li a {
    color: #fff;
}
ul li a {
    text-decoration: none;
    color: #fff;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.header-top .header-info li:after {
    content: "";
    height: 100%;
    width: 1px;
    background-color: rgba(255, 255, 255, .1);
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 0;
}
.header-top .header-top-right {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: right;
}

.header-top .header-info li.header-btn {
    padding: 0 30px 0 0;
}

.header-top .header-info li.header-btn .edu-btn {
    color: var(--color-white);
    border-radius: 0;
    overflow: visible;
}
.header-top .header-info li a {
    color: var(--color-white);
}
a.edu-btn.btn-secondary, button.edu-btn.btn-secondary {
    background: var(--color-secondary);
    color: var(--color-white);
}
a.edu-btn.btn-medium, button.edu-btn.btn-medium {
    height: 50px;
    line-height: 51px;
    padding: 0 25px;
}
a.edu-btn, button.edu-btn {
    text-align: center;
    border-radius: 5px;
    display: inline-block;
    height: 60px;
    line-height: 62px;
    color: var(--color-white);
    background: var(--color-primary);
    padding: 0 30px;
    font-size: 15px;
    font-weight: 500;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    font-family: var(--font-secondary);
    border: 0 none;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

@media screen and (max-width: 768px) {
	.hidkong{
		display:none;
	}

}