/* Theme Description
-------------------------------------------------

	  Theme Name:
	  Author:
	  Support:
	  Description:
	  Version:
	  
------------------------------------------------- 
*/
/* CSS Index
-------------------------------------------------

	1. Theme default css
	2. header
	3. slider
	4. about-area
	5. features-box
	6. department
	7. team
	8. video-area
	9. counter
	10. footer

-------------------------------------------------
*/
/*-------------   Color Variable  --------------*/
@import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Roboto+Slab:wght@100;200;300;400;500;600;700;800;900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");

.white-bg {
  background: #ffffff;
}

.gray-bg {
  background: #f5f5f5;
}

/*-------------Color include--------------*/
/*-- Background color---*/
.gray-bg {
  background: #f7f7fd;
}

.white-bg {
  background: #ffffff;
}

.black-bg {
  background: #16161a;
}

.theme-bg {
  background: #c9252b;
}

.brand-bg {
  background: #f1f4fa;
}

.testimonial-bg {
  background: #f9fafc;
}

/*--- color------*/
.white-color {
  color: #ffffff;
}

.black-color {
  color: #16161a;
}

.theme-color {
  color: #c9252b;
}

/*------------------- Responsive --------------------------*/
/*
	@include transition(.4s);
	color:$theme-color;
*/
.boxed-btn {
  background: #fff;
  color: #c9252b !important;
  display: inline-block;
  padding: 18px 44px;
  font-family: "Roboto Slab", sans-serif;
  font-size: 14px;
  font-weight: 400;
  border: 0;
  border: 1px solid #c9252b;
  letter-spacing: 3px;
  text-align: center;
  color: #c9252b;
  text-transform: uppercase;
  cursor: pointer;
}

.boxed-btn:hover {
  background: #c9252b;
  color: #fff !important;
  border: 1px solid #c9252b;
}

.boxed-btn:focus {
  outline: none;
}

.boxed-btn.large-width {
  width: 220px;
}

/*--
    - Overlay
------------------------------------------*/
[data-overlay] {
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}

[data-overlay]::before {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  content: "";
}

/*-- Overlay Opacity --*/
[data-opacity="1"]::before {
  opacity: 0.1;
}

[data-opacity="2"]::before {
  opacity: 0.2;
}

[data-opacity="3"]::before {
  opacity: 0.3;
}

[data-opacity="4"]::before {
  opacity: 0.4;
}

[data-opacity="5"]::before {
  opacity: 0.5;
}

[data-opacity="6"]::before {
  opacity: 0.6;
}

[data-opacity="7"]::before {
  opacity: 0.7;
}

[data-opacity="8"]::before {
  opacity: 0.8;
}

[data-opacity="9"]::before {
  opacity: 0.9;
}

/* 1. Theme default css */
body {
  font-family: 'Roboto', 'Segoe UI', sans-serif;
  font-weight: normal;
  font-style: normal;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Roboto', 'Segoe UI', sans-serif;
  ;
  color: #159bfe;
  margin-top: 0px;
  font-style: normal;
  font-weight: 500;
  text-transform: normal;
}

p {
  font-family: 'Roboto', 'Segoe UI', sans-serif;
  color: #10285d;
  font-size: 16px;
  line-height: 30px;
  margin-bottom: 15px;
  font-weight: normal;
}


.bg-img-1 {
  background-image: url(../img/slider/slider-img-1.jpg);
}

.bg-img-2 {
  background-image: url(../img/background-img/bg-img-2.jpg);
}

.cta-bg-1 {
  background-image: url(../img/background-img/bg-img-3.jpg);
}

.img {
  max-width: 100%;
  -webkit-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

.f-left {
  float: left;
}

.f-right {
  float: right;
}

.fix {
  overflow: hidden;
}

.clear {
  clear: both;
}

a,
.button {
  -webkit-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

a:focus,
.button:focus {
  text-decoration: none;
  outline: none;
}

a {
  color: #635c5c;
}

a:hover {
  color: #fff;
}

a:focus,
a:hover,
.portfolio-cat a:hover,
.footer -menu li a:hover {
  text-decoration: none;
}

a,
button {
  color: #fff;
  outline: medium none;
}

button:focus,
input:focus,
input:focus,
textarea,
textarea:focus {
  outline: 0;
}

.uppercase {
  text-transform: uppercase;
}

input:focus::-moz-placeholder {
  opacity: 0;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.capitalize {
  text-transform: capitalize;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  color: inherit;
}

ul {
  margin: 0px;
  padding: 0px;
}

li {
  list-style: none;
}

hr {
  border-bottom: 1px solid #eceff8;
  border-top: 0 none;
  margin: 30px 0;
  padding: 0;
}

.logo-actech {
  height: 50px;
}

/* Theme-overlay */
.theme-overlay {
  position: relative;
}

.theme-overlay::before {
  background: #1696e7 none repeat scroll 0 0;
  content: "";
  height: 100%;
  left: 0;
  opacity: 0.6;
  position: absolute;
  top: 0;
  width: 100%;
}

.overlay {
  position: relative;
  z-index: 0;
}

.overlay::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}

.overlay2 {
  position: relative;
  z-index: 0;
}

.overlay2::before {
  position: absolute;
  content: "";
  background-color: #2e2200;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  opacity: 0.5;
}

.youtube_iframe {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90%;
  height: 50%;
  position: relative;
}

.youtube_iframe iframe {
  width: 123%;
  height: 100%;
  border-radius: 20px;
  margin-left: -77px;
}

.youtube_iframe .footer-social {
  margin-left: 18%;
  margin-top: 36px;
}

@media only screen and (min-width: 200px) and (max-width: 559px) {
  .youtube_iframe {
    position: relative;
    width: 350px;
    height: 278px;
    margin-bottom: -25px;
    padding-bottom: 50px;
    margin-top: 100px;
    padding-left: 120px;
  }

  .youtube_iframe iframe {
    width: 300px;
    height: 250px;
    margin-left: -12px;
  }

  .window_form {
    display: inline-flex;
  }

  .youtube_iframe .footer-social {
    margin-left: 26%;
    margin-top: 37px;
  }
}

@media only screen and (min-width: 560px) and (max-width:575px) {
  .youtube_iframe {
    position: relative;
    margin-bottom: -25px;
    padding-bottom: 50px;
    margin-left: 0px;
    margin-top: 100px;
  }

  .youtube_iframe iframe {
    width: 500px;
    height: 300px;
  }

  .window_form {
    display: inline-flex;
  }
}

@media only screen and (min-width: 576px) and (max-width: 992px) {
  .youtube_iframe {
    position: relative;
    width: 350px;
    height: 278px;
    margin-bottom: -25px;
    padding-bottom: 50px;
    margin-top: 100px;
    margin-left: -25px;
  }

  .youtube_iframe iframe {
    width: 480px;
    height: 260px;
    margin-left: -28px;
  }

  .window_form {
    display: inline-flex;
  }

  .youtube_iframe .footer-social {
    margin-left: 34%;
    margin-top: 44px;
  }
}

/* Why us Start */
.card-why-us {
  border-radius: 4px;
  background: #fff;
  box-shadow: 0 6px 10px rgba(0, 0, 0, .08), 0 0 6px rgba(0, 0, 0, .05);
  transition: .3s transform cubic-bezier(.155, 1.105, .295, 1.12), .3s box-shadow, .3s -webkit-transform cubic-bezier(.155, 1.105, .295, 1.12);
  padding: 14px 80px 18px 36px;
  cursor: pointer;
}

.card-why-us:hover {
  transform: scale(1.05);
  box-shadow: 0 10px 20px rgba(0, 0, 0, .12), 0 4px 8px rgba(0, 0, 0, .06);
}

.card-why-us h3 {
  font-weight: 600;
}

.card-why-us img {
  position: absolute;
  top: 20px;
  right: 15px;
  max-height: 120px;
}

.card-why-us-1 {
  height: 400px;
  background-image: url(https://ionicframework.com/img/getting-started/ionic-native-card.png);
  background-repeat: no-repeat;
  background-position: right;
  background-size: 80px;
}

.card-why-us-2 {
  height: 400px;
  background-image: url(https://ionicframework.com/img/getting-started/components-card.png);
  background-repeat: no-repeat;
  background-position: right;
  background-size: 80px;
}

.card-why-us-3 {
  height: 400px;
  background-image: url(https://ionicframework.com/img/getting-started/theming-card.png);
  background-repeat: no-repeat;
  background-position: right;
  background-size: 80px;
}

.card-why-us-4_1 {
  margin-top: 25px;
  height: 300px;
  background-image: url(https://ionicframework.com/img/getting-started/theming-card.png);
  background-repeat: no-repeat;
  background-position: right;
  background-size: 80px;
}

.card-why-us-4_2 {
  margin-top: 25px;
  height: 300px;
  background-image: url(https://ionicframework.com/img/getting-started/theming-card.png);
  background-repeat: no-repeat;
  background-position: right;
  background-size: 80px;
}

.card-why-us-4_3 {
  margin-top: 25px;
  height: 300px;
  background-image: url(https://ionicframework.com/img/getting-started/theming-card.png);
  background-repeat: no-repeat;
  background-position: right;
  background-size: 80px;
}

@media(max-width: 990px) {
  .card-why-us {
    margin: 20px;
  }
}

@media only screen and (min-width:950px) and (max-width:1200px) {
  .card-why-us-1 {
    height: 500px;
  }

  .card-why-us-2 {
    height: 500px;
  }

  .card-why-us-3 {
    height: 500px;
  }
}

@media only screen and (min-width:768px) and (max-width:820px) {
  .card-why-us-1 {
    height: 500px;
    background-size: 40px;
    width: 200px;
    height: 430px;
  }

  .card-why-us-1 p {
    z-index: 1;
    font-size: 10px;
    width: 152px;
  }

  .card-why-us-2 {
    height: 500px;
    background-size: 40px;
    width: 200px;
    height: 430px;
  }

  .card-why-us-2 p {
    z-index: 1;
    font-size: 10px;
    width: 152px;
  }

  .card-why-us-3 {
    height: 500px;
    background-size: 40px;
    width: 200px;
    height: 430px;
  }

  .card-why-us-3 p {
    z-index: 1;
    font-size: 10px;
    width: 152px;
  }

  .card-why-us-4_1 {
    width: 200px;
    height: 300px;
    background-size: 40px;
  }

  .card-why-us-4_1 p {
    font-size: 10px;
    width: 120px;
  }

  .card-why-us-4_2 {
    width: 200px;
    height: 300px;
    background-size: 40px;
  }

  .card-why-us-4_2 p {
    font-size: 10px;
    width: 120px;
  }

  .card-why-us-4_3 {
    width: 200px;
    height: 300px;
    background-size: 40px;
  }

  .card-why-us-4_3 p {
    font-size: 10px;
    width: 120px;
  }
}

@media only screen and (min-width:360px) and (max-width:414px) {
  .card-why-us-1 p {
    font-size: 13px;
  }

  .card-why-us-2 p {
    font-size: 13px;
  }


}

/* Why us End */

/* about_group3*/
.about-group-3 {
  margin-bottom: 4rem;
}

.about-group-3 .center-layout-2 {
  display: flex;
  justify-content: space-between;
}

.center-layout-2 {
  /* max-width: 1044px; */
  margin: 0 auto;
  padding-left: 16px;
  padding-right: 16px;
  padding-top: 65px
}

.about-group-3__title {
  text-transform: uppercase;
  font-size: 24px;
  color: #159bfe;
  font-weight: bold;
  margin-bottom: 0.5rem;
  /* padding-left: 25px; */
}

.about-group-3__name {
  font-family: inherit;
  font-size: 36px;
  font-weight: 100;
  color: #000;
  margin-bottom: 1.5rem;
  text-transform: uppercase;
}

.about-group-3__list {
  font-size: 1.057rem;
  font-family: inherit;
  color: #000;
  padding-left: 20px;
  margin-bottom: 3rem;
  text-align: justify;
  /* width: 600px; */
}

.about-group-3__left {
  width: 38.0859375%;
  margin-top: 3rem;
}

.list_item_about_group_3 {
  display: list-item;
}

.gs_reveal {
  opacity: 0;
  visibility: hidden;
  will-change: transform, opacity;
}


.about-group-3__right {
  width: 53.7109375%;
}

.about-group-3__right img {
  border-radius: 15px;
}

.about-group-3__list li {
  margin-bottom: 8px;
}

.about-group-3__image img {
  max-width: 100%;
  height: 500px;
}

@media screen and (max-width: 992px) {
  .about-group-3__left {
    margin-top: 4rem;
  }
}

@media screen and (max-width: 768px) {
  .about-group-3 .center-layout-2 {
    flex-direction: column-reverse;
  }

  .about-group-3__left {
    width: 100%;
    margin-top: 5rem;
  }

  .about-group-3__right {
    width: 100%;
  }

  .about-group-3__right img {
    width: 100%;
    padding-top: 87px
  }
}

/* about_group3_end*/

/* arrow */

.slick-next .slick-arrow {
  background: #fff;
  display: inline-block;
  border: none;
  color: blue;
}

.slick-prev .slick-arrow {
  background: #fff;
  display: inline-block;
  border: none;
  color: blue;
}

/* c-section-start */

.c-section {
  padding: 0 var(--s3);
}

.c-section__title-span {
  padding-left: 100px;
  padding-top: 70px;
  font-size: 72px;
  width: 870px;
  color: #159bfd;
}

.c-section__title {
  padding: var(--s2) var(--s3) calc(var(--s6) * 1.8);
  margin: 0 calc(var(--s3) * -1);
  color: #fff;
  font-size: 75px;
  font-weight: 900;
  text-align: center;
}

@media (min-width: 40.625em) {
  .c-section__title {
    padding: var(--s2) var(--s3) var(--s4);
  }
}

@media (min-width: 40.625em) {
  .c-section__title {
    display: flex;
    align-items: self-start;
    justify-content: flex-end;
    position: relative;
    text-align: unset;
    font-size: 60px;
  }

  .c-section__title-span {
    font-size: 44px;
    padding-left: 10px;
  }
}

@media (max-width:414px) {
  .c-section__title {
    font-size: 50px;
  }
}

.c-section__title:after {
  content: "";
  display: block;
  background-size: calc(var(--s5) * 3) calc(var(--s5) * 3);
  width: calc(var(--s5) * 3);
  height: calc(var(--s5) * 3);
  background-repeat: no-repeat;
  background-position: center;
  margin-left: auto;
  margin-right: auto;
  transform: translateY(11rem);
  z-index: 1;
  /* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' id='aadef149-4ba5-4382-9e09-7df651a328a5' data-name='Layer 1' width='704' height='745.19433' viewBox='0 0 704 745.19433' class='injected-svg modal__media modal__lg_media' data-src='https://42f2671d685f51e10fc6-b9fcecea3e50b3b59bdc28dead054ebc.ssl.cf5.rackcdn.com/illustrations/mobile_web_2g8b.svg'%3E%3Ctitle%3Emobile_web%3C/title%3E%3Cpath d='M344.69391,661.25125l-8.38722-33.073A429.46111,429.46111,0,0,0,290.74208,611.834l-1.05792,15.37062L285.39,610.2712c-19.202-5.482-32.265-7.89648-32.265-7.89648s17.64872,67.09731,54.6606,118.39272l43.124,7.57249-33.50125,4.83219A173.75069,173.75069,0,0,0,332.395,749.05228c53.84043,49.96979,113.80669,72.89422,133.93843,51.20309s-7.1946-79.78376-61.035-129.75355c-16.69106-15.49113-37.65818-27.92221-58.646-37.70546Z' transform='translate(-248 -77.40283)' fill='%23fb6f3c'/%3E%3Cpath d='M424.44317,625.32976l9.91563-32.64732a429.46451,429.46451,0,0,0-30.557-37.54385L394.9511,567.7497l5.07688-16.71545c-13.60408-14.61837-23.53857-23.43755-23.53857-23.43755s-19.57459,66.561-14.40543,129.60362l33.00186,28.77326L363.9095,672.79331a173.75138,173.75138,0,0,0,4.62073,21.34072c20.26038,70.60659,59.74453,121.22757,88.19038,113.06511s35.08143-72.01738,14.821-142.624c-6.28092-21.88874-17.80407-43.36822-30.71362-62.59176Z' transform='translate(-248 -77.40283)' fill='%23fb6f3c'/%3E%3Cellipse cx='352' cy='727.19433' rx='352' ry='18' fill='%233f3d56'/%3E%3Cpath d='M805.65354,250.35009h-3.99878V140.80476a63.40186,63.40186,0,0,0-63.40205-63.40193H506.16627a63.40186,63.40186,0,0,0-63.402,63.40193V741.77894a63.40186,63.40186,0,0,0,63.402,63.40193H738.25271a63.40186,63.40186,0,0,0,63.40205-63.40193V328.32631h3.99878Z' transform='translate(-248 -77.40283)' fill='%233f3d56'/%3E%3Cpath d='M788.16,141.24713v600.09a47.3508,47.3508,0,0,1-47.35,47.35H507.61a47.35084,47.35084,0,0,1-47.35-47.35v-600.09a47.35089,47.35089,0,0,1,47.35-47.35H535.9a22.50661,22.50661,0,0,0,20.83,30.99H689.69a22.50673,22.50673,0,0,0,20.83-30.99h30.29A47.35084,47.35084,0,0,1,788.16,141.24713Z' transform='translate(-248 -77.40283)' fill='%23fff'/%3E%3Cpath d='M788.16,612.40716v128.93a47.3508,47.3508,0,0,1-47.35,47.35H507.61a47.35084,47.35084,0,0,1-47.35-47.35v-116.36a222.97136,222.97136,0,0,1,327.9-12.57Z' transform='translate(-248 -77.40283)' fill='%23e6e6e6'/%3E%3Cpolygon points='322.174 511.167 312.75 511.167 315.891 327.064 319.033 327.064 322.174 511.167' fill='%23e6e6e6'/%3E%3Cpath d='M578.02779,288.5586l15.21367-23.512a352.49687,352.49687,0,0,0-15.60827-36.53743l-9.83764,7.94573,7.78946-12.03815c-7.42343-14.61275-13.26462-23.81956-13.26462-23.81956s-30.5115,48.08118-40.70521,98.98824l19.52266,30.17145L519.5254,312.3006a142.61,142.61,0,0,0-1.18572,17.8826c0,60.291,19.69081,109.16642,43.98071,109.16642s43.98072-48.87547,43.98072-109.16642c0-18.69079-4.22846-38.24546-10.0614-56.33418Z' transform='translate(-248 -77.40283)' fill='%23e6e6e6'/%3E%3Cpolygon points='267.479 524.167 262.908 524.167 264.432 434.879 265.955 434.879 267.479 524.167' fill='%23e6e6e6'/%3E%3Cpath d='M519.28775,456.06773l7.37846-11.40307a170.95723,170.95723,0,0,0-7.56983-17.72025l-4.77115,3.85359,3.7778-5.83837c-3.60028-7.087-6.43319-11.55223-6.43319-11.55223s-14.79775,23.31885-19.74158,48.00821l9.46827,14.63282-10.48179-8.46609a69.16528,69.16528,0,0,0-.57506,8.67286c0,29.24044,9.54982,52.94451,21.33016,52.94451S533,505.49564,533,476.2552c0-9.06483-2.05076-18.54863-4.87967-27.32146Z' transform='translate(-248 -77.40283)' fill='%23e6e6e6'/%3E%3Cpolygon points='386.479 524.167 381.908 524.167 383.432 434.879 384.955 434.879 386.479 524.167' fill='%23e6e6e6'/%3E%3Cpath d='M638.28775,456.06773l7.37846-11.40307a170.95723,170.95723,0,0,0-7.56983-17.72025l-4.77115,3.85359,3.7778-5.83837c-3.60028-7.087-6.43319-11.55223-6.43319-11.55223s-14.79775,23.31885-19.74158,48.00821l9.46827,14.63282-10.48179-8.46609a69.16528,69.16528,0,0,0-.57506,8.67286c0,29.24044,9.54982,52.94451,21.33016,52.94451S652,505.49564,652,476.2552c0-9.06483-2.05076-18.54863-4.87967-27.32146Z' transform='translate(-248 -77.40283)' fill='%23e6e6e6'/%3E%3Ccircle cx='264' cy='186.19433' r='42' fill='%23e6e6e6'/%3E%3Cpolygon points='415.872 234.173 492.533 236.077 502.852 144.666 415.872 144.666 415.872 234.173' fill='%232f2e41'/%3E%3Cpath d='M644.76993,239.9612l-21.14671-81.078s5.84211-38.92023,19.97409-38.27814-3.66865,38.049-3.66865,38.049l23.94311,70.03766Z' transform='translate(-248 -77.40283)' fill='%23ffb8b8'/%3E%3Cpath d='M686.22412,443.10875l3.31146,33.11459s-104.311,71.19639-104.311,100.99953-3.31146,124.17974-3.31146,124.17974l38.08179,1.65573,3.31146-44.70471s8.27865-49.67189,3.31146-67.88492l54.63908-41.39325s-16.5573,19.86876-13.24584,54.63909S663.0439,706.3698,663.0439,706.3698l39.73752,3.31146s4.96719-36.42606,6.62292-39.73752,9.93438-62.91773,1.65573-79.475l67.88493-79.475s23.18022-29.80314,0-59.60627l-13.24584-6.62292Z' transform='translate(-248 -77.40283)' fill='%232f2e41'/%3E%3Cpath d='M583.56887,694.77969l-3.31146,21.52449-21.52449,51.32763s-36.42606,18.213-9.93438,21.52449,36.42606-3.31146,41.39325-11.59011,14.90157-21.52449,14.90157-21.52449L603.43763,790.812h8.27865l13.56912-47.49194a29.95239,29.95239,0,0,0-5.09327-26.76756q-.09786-.12417-.1972-.24835c-6.62292-8.27865-3.31146-19.86876-3.31146-19.86876Z' transform='translate(-248 -77.40283)' fill='%232f2e41'/%3E%3Cpath d='M666.35536,694.77969l-3.31146,21.52449-21.52449,51.32763s-36.42605,18.213-9.93437,21.52449,36.426-3.31146,41.39324-11.59011,14.90157-21.52449,14.90157-21.52449L686.22412,790.812h8.27865l13.56913-47.49194a29.95239,29.95239,0,0,0-5.09328-26.76756q-.09786-.12417-.1972-.24835c-6.62292-8.27865-3.31146-19.86876-3.31146-19.86876Z' transform='translate(-248 -77.40283)' fill='%232f2e41'/%3E%3Ccircle cx='458.09288' cy='162.05113' r='33.1146' fill='%23ffb8b8'/%3E%3Cpath d='M704.43715,267.60138l14.90157,34.77032,29.80314-23.18022s-18.213-24.83594-18.213-28.1474Z' transform='translate(-248 -77.40283)' fill='%23ffb8b8'/%3E%3Cpath d='M707.74861,287.47013l7.06394,4.34051s22.82273-12.10094,28.576-20.6387c0,0,20.65486-6.882,28.93351,9.67527s-4.96719,130.80267-4.96719,130.80267,8.27865,11.59011,6.62292,16.5573S778.945,441.453,778.945,441.453v9.93438s-94.37661,1.65573-94.37661-6.62292V418.2728l-9.93438-3.31146s-9.93438,21.52449-13.24584,19.86876-19.86876-14.90157-19.86876-14.90157,26.49168-87.75369,41.39325-102.65526l18.213-31.45887Z' transform='translate(-248 -77.40283)' fill='%23fb6f3c'/%3E%3Cpath d='M704.43715,289.12586s-3.31146-6.62292-8.27865-8.27865-29.80314-36.42605-29.80314-36.42605l3.31146-18.213-33.1146-4.96719s1.65573,18.213,8.27865,29.80314,43.049,71.19638,43.049,71.19638l18.213-33.1146Z' transform='translate(-248 -77.40283)' fill='%23fb6f3c'/%3E%3Cpath d='M730.101,420.75639l-19.86875,59.60628s-41.39325,46.36044-18.213,46.36044,34.77032-41.39325,34.77032-41.39325l28.14741-59.60628Z' transform='translate(-248 -77.40283)' fill='%23ffb8b8'/%3E%3Cpath d='M666.40465,239.938c26.52245-10.63018,52.66949-12.89779,78.1352,0V218.51138A13.95535,13.95535,0,0,0,730.58449,204.556H677.42954a11.02489,11.02489,0,0,0-11.02489,11.02489Z' transform='translate(-248 -77.40283)' fill='%232f2e41'/%3E%3Cpath d='M750.79759,285.8144s15.10671-12.79586,23.28279,1.88072,3.20889,77.59432,1.55316,85.873-13.24584,59.60628-13.24584,59.60628l-39.73752-8.27865s-3.31146-23.18022,6.62292-21.52449Z' transform='translate(-248 -77.40283)' fill='%23fb6f3c'/%3E%3Cpath d='M767.27813,271.58657c-7.47508-4.10485-10.95384-13.3183-11.20173-21.8427-.24822-8.5244,1.81928-16.96078,1.98174-25.48727a19.70066,19.70066,0,0,0-.44217-5.19738,19.99152,19.99152,0,0,0-2.85872-5.91734c-9.72073-14.89484-26.61815-25.37235-44.41647-25.53721a19.72685,19.72685,0,0,0-7.51573,1.38171c-1.84014.737-2.44183.64676-2.79446,2.90614a18.80778,18.80778,0,0,0-12.90778.41044,43.67006,43.67006,0,0,0-11.28781,6.72245,50.91134,50.91134,0,0,0-5.707,4.94121c-9.4059,9.74414-11.57188,24.76187-8.847,38.02816.88586,4.313-3.3647,8.47684-6.88166,11.12594s-7.57824,5.08173-9.3054,9.132c-1.66117,3.89607-.74885,8.35188-1.08333,12.57414a21.50585,21.50585,0,0,1-13.71993,18.06931,6.619,6.619,0,0,0,6.38589,2.24579,15.71689,15.71689,0,0,0,6.65437-3.168,39.58173,39.58173,0,0,0,14.7562-21.89461c1.03307,4.69842.63244,9.54449.59442,14.355a40.097,40.097,0,0,1-2.90746,15.67932,22.95849,22.95849,0,0,1-10.57045,11.63912c4.6135,2.25911,9.69783.62172,13.60738-2.71074,3.90938-3.33246,6.21789-8.16974,7.83049-13.047a65.02715,65.02715,0,0,0,3.1334-24.67964A35.23865,35.23865,0,0,1,674.197,295.3399a36.73,36.73,0,0,1-12.45807,21.62429,71.55883,71.55883,0,0,0,32.75215-8.24838,18.53725,18.53725,0,0,0,6.71768-5.17351c3.251-4.50991,2.48187-10.6609,1.57006-16.14519-.72122-4.3364,4.69775-10.60546,1.5945-13.71918a5.14429,5.14429,0,0,0-3.44914-1.48246c-9.45259-.91006-18.20527-5.65746-23.25035-13.70275-3.53538-5.63781-5.87629-12.07592-5.87629-18.09738a32.93149,32.93149,0,1,1,64.38483,9.77247,66.08219,66.08219,0,0,0-2.39716,11.16014,87.6848,87.6848,0,0,1-2.6728,12.98267c-2.34787,8.17535-6.32542,16.51719-13.68526,20.7814,2.47315,1.35348,5.33556,1.41445,8.13766,1.72322,9.23506,1.01758,18.9478.79289,27.30655-3.26312C761.2304,289.496,767.87372,280.85839,767.27813,271.58657Z' transform='translate(-248 -77.40283)' fill='%232f2e41'/%3E%3Cpolygon points='490.38 252.288 481.739 323.422 482.101 255.6 490.38 252.288' opacity='0.2'/%3E%3Cpolygon points='518.772 336.291 515.216 358.255 523.494 361.567 518.772 336.291' opacity='0.2'/%3E%3C/svg%3E"); */
  background-image: url(../img/gallery/Tai_sao_chon_ACT.png);
}

@media (min-width: 40.625em) {
  .c-section__title:after {
    margin-left: auto;
    margin-right: -45px;
    transform: translateY(2rem);
    width: calc(var(--s5) * 7);
    height: calc(var(--s5) * 3);
  }
}

.c-section span:before {
  content: "";
  display: block;
  position: absolute;
  border-radius: 40px 40px 0px 0px;
  top: -3%;
  left: 0;
  width: 100%;
  height: 100%;
  /* transform: skew(0deg, 1deg); */
  z-index: -1;
  background: var(--color-brand-primary);
  background-attachment: fixed;
  opacity: 0.3;
  /* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='487' height='243.5' viewBox='0 0 1600 800' style='&%2310; opacity: .45;&%2310;'%3E%3Cpath fill='%23fdb9a0' d='M1102.5 734.8c2.5-1.2 24.8-8.6 25.6-7.5.5.7-3.9 23.8-4.6 24.5-.2.3-16-12.3-21-17zm123.8-505.7c0-.1-4.9-9.4-7-14.2-.1-.3-.3-1.1-.4-1.6-.1-.4-.3-.7-.6-.9-.3-.2-.6-.1-.8.1l-13.1 12.3c-.2.2-.3.5-.4.8 0 .3 0 .7.2 1 .1.1 1.4 2.5 2.1 3.6 2.4 3.7 6.5 12.1 6.5 12.2.2.3.4.5.7.6.3 0 .5-.1.7-.3 0 0 1.8-2.5 2.7-3.6 1.5-1.6 3-3.2 4.6-4.7 1.2-1.2 1.6-1.4 2.1-1.6.5-.3 1.1-.5 2.5-1.9.4-.5.5-1.3.2-1.8zM33 770.3c0-.7-.5-1.2-1.2-1.2-.1 0-.3 0-.4.1-1.6.2-14.3.1-22.2 0-.3 0-.6.1-.9.4-.2.2-.4.5-.4.9 0 .2 0 4.9.1 5.9l.4 13.6c0 .3.2.6.4.9.2.2.5.3.8.3h.1c7.3-.7 14.7-.9 22-.6.3 0 .7-.1.9-.3.2-.2.4-.6.4-.9-.1-6.1-.1-13.2 0-19.1z' style='&%2310;'/%3E%3Cpath fill='%23fee272' d='M171.1 383.4c1.3-2.5 14.3-22 15.6-21.6.8.3 11.5 21.2 11.5 22.1-.1.3-20.3.1-27.1-.5zm425.3 328.4c-.1-.1-6.7-8.2-9.7-12.5-.2-.3-.5-1-.7-1.5-.2-.4-.4-.7-.7-.8-.3-.1-.6 0-.8.3L574 712c-.2.2-.2.5-.2.9 0 .3.2.7.4.9.1.1 1.8 2.2 2.8 3.1 3.1 3.1 8.8 10.5 8.9 10.6.2.3.5.4.8.4.3 0 .5-.2.6-.5 0 0 1.2-2.8 2-4.1 1.1-1.9 2.3-3.7 3.5-5.5.9-1.4 1.3-1.7 1.7-2 .5-.4 1-.7 2.1-2.4.3-.3.2-1.1-.2-1.6zm131.1-531.9c.6.2 1.3-.2 1.4-.8v-.4c.2-1.4 2.8-12.6 4.5-19.5.1-.3 0-.6-.2-.8-.2-.3-.5-.4-.8-.5-.2 0-4.7-1.1-5.7-1.3l-13.4-2.7c-.3-.1-.7 0-.9.2-.2.2-.4.4-.5.6v.1c-.8 6.5-2.2 13.1-3.9 19.4-.1.3 0 .6.2.9.2.3.5.4.8.5 5.8 1.3 12.7 2.9 18.5 4.3zm1-1.8c-.1-.1-.2-.2-.4-.2.2 0 .3.1.4.2z'/%3E%3Cg fill='%23eac5e7'%3E%3Cpath d='M699.6 472.7c-1.5 0-2.8-.8-3.5-2.3-.8-1.9 0-4.2 1.9-5 3.7-1.6 6.8-4.7 8.4-8.5 1.6-3.8 1.7-8.1.2-11.9-.3-.9-.8-1.8-1.2-2.8-.8-1.7-1.8-3.7-2.3-5.9-.9-4.1-.2-8.6 2-12.8 1.7-3.1 4.1-6.1 7.6-9.1 1.6-1.4 4-1.2 5.3.4 1.4 1.6 1.2 4-.4 5.3-2.8 2.5-4.7 4.7-5.9 7-1.4 2.6-1.9 5.3-1.3 7.6.3 1.4 1 2.8 1.7 4.3l1.5 3.3c2.1 5.6 2 12-.3 17.6-2.3 5.5-6.8 10.1-12.3 12.5-.4.2-.9.3-1.4.3zm40.8-51.3c1.5-.2 3 .5 3.8 1.9 1.1 1.8.4 4.2-1.4 5.3-3.7 2.1-6.4 5.6-7.6 9.5-1.2 4-.8 8.4 1.1 12.1.4.9 1 1.7 1.6 2.7 1 1.7 2.2 3.5 3 5.7 1.4 4 1.2 8.7-.6 13.2-1.4 3.4-3.5 6.6-6.8 10.1-1.5 1.6-3.9 1.7-5.5.2-1.6-1.4-1.7-3.9-.2-5.4 2.6-2.8 4.3-5.3 5.3-7.7 1.1-2.8 1.3-5.6.5-7.9-.5-1.3-1.3-2.7-2.2-4.1-.6-1-1.3-2.1-1.9-3.2-2.8-5.4-3.4-11.9-1.7-17.8 1.8-5.9 5.8-11 11.2-14 .4-.4.9-.6 1.4-.6zM261.3 590.9c5.7 6.8 9 15.7 9.4 22.4.5 7.3-2.4 16.4-10.2 20.4-3 1.5-6.7 2.2-11.2 2.2-7.9-.1-12.9-2.9-15.4-8.4-2.1-4.7-2.3-11.4 1.8-15.9 3.2-3.5 7.8-4.1 11.2-1.6 1.2.9 1.5 2.7.6 3.9-.9 1.2-2.7 1.5-3.9.6-1.8-1.3-3.6.6-3.8.8-2.4 2.6-2.1 7-.8 9.9 1.5 3.4 4.7 5 10.4 5.1 3.6 0 6.4-.5 8.6-1.6 4.7-2.4 7.7-8.6 7.2-15-.5-7.3-5.3-18.2-13-23.9-4.2-3.1-8.5-4.1-12.9-3.1-3.1.7-6.2 2.4-9.7 5-6.6 5.1-11.7 11.8-14.2 19-2.7 7.7-2.1 15.8 1.9 23.9.7 1.4.1 3.1-1.3 3.7-1.4.7-3.1.1-3.7-1.3-4.6-9.4-5.4-19.2-2.2-28.2 2.9-8.2 8.6-15.9 16.1-21.6 4.1-3.1 8-5.1 11.8-6 6-1.4 12 0 17.5 4 2.1 1.7 4.1 3.6 5.8 5.7z'/%3E%3Ccircle cx='1013.7' cy='153.9' r='7.1'/%3E%3Ccircle cx='1024.3' cy='132.1' r='7.1'/%3E%3Ccircle cx='1037.3' cy='148.9' r='7.1'/%3E%3Cpath d='M1508.7 297.2c-4.8-5.4-9.7-10.8-14.8-16.2 5.6-5.6 11.1-11.5 15.6-18.2 1.2-1.7.7-4.1-1-5.2-1.7-1.2-4.1-.7-5.2 1-4.2 6.2-9.1 11.6-14.5 16.9-4.8-5-9.7-10-14.7-14.9-1.5-1.5-3.9-1.5-5.3 0-1.5 1.5-1.5 3.9 0 5.3 4.9 4.8 9.7 9.8 14.5 14.8-1.1 1.1-2.3 2.2-3.5 3.2-4.1 3.8-8.4 7.8-12.4 12-1.4 1.5-1.4 3.8 0 5.3 1.5 1.4 3.9 1.4 5.3-.1 3.9-4 8.1-7.9 12.1-11.7 1.2-1.1 2.3-2.2 3.5-3.3 4.9 5.3 9.8 10.6 14.6 15.9l.2.2c1.4 1.4 3.7 1.5 5.2.2 1.7-1.2 1.8-3.6.4-5.2zM327.6 248.6l-.4-2.6c-1.5-11.1-2.2-23.2-2.3-37 0-5.5 0-11.5.2-18.5v-2.3c0-5 0-11.2 3.9-13.5 2.2-1.3 5.1-1 8.5.9 5.7 3.1 13.2 8.7 17.5 14.9 5.5 7.8 7.3 16.9 5 25.7-3.2 12.3-15 31-30 32.1l-2.4.3zm4.5-69.4c-.2 0-.3 0-.4.1-.1.1-.7.5-1.1 2.7-.3 1.9-.3 4.2-.3 6.3v2.4c-.2 6.9-.2 12.8-.2 18.3.1 12.5.7 23.5 2 33.7 11-2.7 20.4-18.1 23-27.8 1.9-7.2.4-14.8-4.2-21.3-3.9-5.5-10.9-10.6-15.9-13.3-1.4-.8-2.4-1.1-2.9-1.1zM516.3 60.8c-.1 0-.2 0-.4-.1-2.4-.7-4-.9-6.7-.7-.7 0-1.3-.5-1.4-1.2 0-.7.5-1.3 1.2-1.4 3.1-.2 4.9 0 7.6.8.7.2 1.1.9.9 1.6-.2.6-.7 1-1.2 1zm-10.2 9.7c-.5 0-1-.3-1.2-.8-.8-2.1-1.2-4.3-1.3-6.6 0-.7.5-1.3 1.2-1.3s1.3.5 1.3 1.2c.1 2 .5 3.9 1.1 5.8.2.7-.1 1.4-.8 1.6 0 .1-.2.1-.3.1zm-12-6.1c-.4 0-.8-.2-1-.5-.4-.6-.3-1.4.2-1.8 1.8-1.4 3.7-2.6 5.8-3.6.6-.3 1.4 0 1.7.6.3.6 0 1.4-.6 1.7-1.9.9-3.7 2-5.3 3.3-.2.2-.5.3-.8.3zm6.4-9.1c-.5 0-.9-.3-1.2-.7-.5-1-1.2-1.9-2.4-3.4-.3-.4-.7-.9-1.1-1.4-.4-.6-.3-1.4.2-1.8.6-.4 1.4-.3 1.8.2.4.5.8 1 1.1 1.4 1.3 1.6 2.1 2.6 2.7 3.9.3.6 0 1.4-.6 1.7-.1.1-.3.1-.5.1zm6.2-.3c-.3 0-.5-.1-.8-.2-.6-.4-.7-1.2-.3-1.8 1.2-1.7 2.3-3.4 3.3-5.2.3-.6 1.1-.9 1.7-.5.6.3.9 1.1.5 1.7-1 1.9-2.2 3.8-3.5 5.6-.2.2-.5.4-.9.4zm522.6 327.8c-.1 0-.2 0-.4-.1-2.4-.7-4-.9-6.7-.7-.7 0-1.3-.5-1.4-1.2 0-.7.5-1.3 1.2-1.4 3.1-.2 4.9 0 7.6.8.7.2 1.1.9.9 1.6-.2.6-.7 1-1.2 1zm-10.2 9.7c-.5 0-1-.3-1.2-.8-.8-2.1-1.2-4.3-1.3-6.6 0-.7.5-1.3 1.2-1.3s1.3.5 1.3 1.2c.1 2 .5 3.9 1.1 5.8.2.7-.1 1.4-.8 1.6 0 .1-.2.1-.3.1zm-12-6.1c-.4 0-.8-.2-1-.5-.4-.6-.3-1.4.2-1.8 1.8-1.4 3.7-2.6 5.8-3.6.6-.3 1.4 0 1.7.6.3.6 0 1.4-.6 1.7-1.9.9-3.7 2-5.3 3.3-.2.2-.5.3-.8.3zm6.4-9.1c-.5 0-.9-.3-1.2-.7-.5-1-1.2-1.9-2.4-3.4-.3-.4-.7-.9-1.1-1.4-.4-.6-.3-1.4.2-1.8.6-.4 1.4-.3 1.8.2.4.5.8 1 1.1 1.4 1.3 1.6 2.1 2.6 2.7 3.9.3.6 0 1.4-.6 1.7-.1.1-.3.1-.5.1zm6.2-.3c-.3 0-.5-.1-.8-.2-.6-.4-.7-1.2-.3-1.8 1.2-1.7 2.3-3.4 3.3-5.2.3-.6 1.1-.9 1.7-.5.6.3.9 1.1.5 1.7-1 1.9-2.2 3.8-3.5 5.6-.2.2-.5.4-.9.4zm310 196.4c-1.4 0-2.9-.2-4.5-.7-8.4-2.7-16.6-12.7-18.7-20-.4-1.4-.7-2.9-.9-4.4-8.1 3.3-15.5 10.6-15.4 21 0 1.5-1.2 2.7-2.7 2.8-1.5 0-2.7-1.2-2.7-2.7-.1-6.7 2.4-12.9 7-18 3.6-4 8.4-7.1 13.7-8.8.5-6.5 3.1-12.9 7.4-17.4 7-7.4 18.2-8.9 27.3-10.1l.7-.1c1.5-.2 2.9.9 3.1 2.3.2 1.5-.9 2.9-2.3 3.1l-.7.1c-8.6 1.2-18.4 2.5-24 8.4-3 3.2-5 7.7-5.7 12.4 7.9-1 17.7 1.3 24.3 5.7 4.3 2.9 7.1 7.8 7.2 12.7.2 4.3-1.7 8.3-5.2 11.1-2.4 1.6-5 2.6-7.9 2.6zm-18.7-26.7c.1 1.5.4 3 .8 4.4 1.7 5.8 8.7 14.2 15.1 16.3 2.8.9 5.1.5 7.2-1.1 2.7-2.1 3.2-4.8 3.1-6.6-.1-3.2-2-6.4-4.8-8.3-5.7-3.9-14.7-5.8-21.4-4.7z'/%3E%3C/g%3E%3C/svg%3E"); */
}

.c-section span:after {
  display: block;
  font-size: 1.4rem;
  position: absolute;
  font-weight: 350;
  padding: 0 var(--s3);
  color: rgba(255, 255, 255, 0.85);
  left: 9px;
}

@media (min-width: 40.625em) {
  .c-section span:after {
    font-size: 23%;
  }
}

@media (min-width: 40.625em) {
  .c-section span:after {
    width: 47ch;
  }
}

@media (min-width: 48em) {
  .c-section span:after {
    width: 57ch;
  }
}

@media (min-width: 62em) {
  .c-section span:after {
    width: 67ch;
  }
}

.c-services {
  display: grid;
  grid-gap: var(--s2);
  margin: 0 calc(var(--s3) * -1);
  padding: var(--s6) var(--s3);
  position: relative;
  z-index: 1;
}

@media (min-width: 40.625em) {
  .c-services {
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: minmax(100px, 1fr);
  }
}

@media (min-width: 40.625em) {
  .c-services {
    padding: 0 var(--s3);
  }
}

.c-services:before {
  content: "";
  display: block;
  position: absolute;
  border-radius: 0px 0px 40px 40px;
  top: -15px;
  left: 0;
  background: var(--color-brand-accent-bg);
  width: 100%;
  height: 100%;
  bottom: 0%;
  opacity: 0.35;
  /* transform: skew(0deg, 10deg); */
  /* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='487' height='243.5' viewBox='0 0 1600 800'%3E%3Cpath fill='%23fdb9a0' d='M1102.5 734.8c2.5-1.2 24.8-8.6 25.6-7.5.5.7-3.9 23.8-4.6 24.5-.2.3-16-12.3-21-17zm123.8-505.7c0-.1-4.9-9.4-7-14.2-.1-.3-.3-1.1-.4-1.6-.1-.4-.3-.7-.6-.9-.3-.2-.6-.1-.8.1l-13.1 12.3c-.2.2-.3.5-.4.8 0 .3 0 .7.2 1 .1.1 1.4 2.5 2.1 3.6 2.4 3.7 6.5 12.1 6.5 12.2.2.3.4.5.7.6.3 0 .5-.1.7-.3 0 0 1.8-2.5 2.7-3.6 1.5-1.6 3-3.2 4.6-4.7 1.2-1.2 1.6-1.4 2.1-1.6.5-.3 1.1-.5 2.5-1.9.4-.5.5-1.3.2-1.8zM33 770.3c0-.7-.5-1.2-1.2-1.2-.1 0-.3 0-.4.1-1.6.2-14.3.1-22.2 0-.3 0-.6.1-.9.4-.2.2-.4.5-.4.9 0 .2 0 4.9.1 5.9l.4 13.6c0 .3.2.6.4.9.2.2.5.3.8.3h.1c7.3-.7 14.7-.9 22-.6.3 0 .7-.1.9-.3.2-.2.4-.6.4-.9-.1-6.1-.1-13.2 0-19.1z' style='&%2310;'/%3E%3Cpath fill='%23fee272' d='M171.1 383.4c1.3-2.5 14.3-22 15.6-21.6.8.3 11.5 21.2 11.5 22.1-.1.3-20.3.1-27.1-.5zm425.3 328.4c-.1-.1-6.7-8.2-9.7-12.5-.2-.3-.5-1-.7-1.5-.2-.4-.4-.7-.7-.8-.3-.1-.6 0-.8.3L574 712c-.2.2-.2.5-.2.9 0 .3.2.7.4.9.1.1 1.8 2.2 2.8 3.1 3.1 3.1 8.8 10.5 8.9 10.6.2.3.5.4.8.4.3 0 .5-.2.6-.5 0 0 1.2-2.8 2-4.1 1.1-1.9 2.3-3.7 3.5-5.5.9-1.4 1.3-1.7 1.7-2 .5-.4 1-.7 2.1-2.4.3-.3.2-1.1-.2-1.6zm131.1-531.9c.6.2 1.3-.2 1.4-.8v-.4c.2-1.4 2.8-12.6 4.5-19.5.1-.3 0-.6-.2-.8-.2-.3-.5-.4-.8-.5-.2 0-4.7-1.1-5.7-1.3l-13.4-2.7c-.3-.1-.7 0-.9.2-.2.2-.4.4-.5.6v.1c-.8 6.5-2.2 13.1-3.9 19.4-.1.3 0 .6.2.9.2.3.5.4.8.5 5.8 1.3 12.7 2.9 18.5 4.3zm1-1.8c-.1-.1-.2-.2-.4-.2.2 0 .3.1.4.2z'/%3E%3Cg fill='%23eac5e7'%3E%3Cpath d='M699.6 472.7c-1.5 0-2.8-.8-3.5-2.3-.8-1.9 0-4.2 1.9-5 3.7-1.6 6.8-4.7 8.4-8.5 1.6-3.8 1.7-8.1.2-11.9-.3-.9-.8-1.8-1.2-2.8-.8-1.7-1.8-3.7-2.3-5.9-.9-4.1-.2-8.6 2-12.8 1.7-3.1 4.1-6.1 7.6-9.1 1.6-1.4 4-1.2 5.3.4 1.4 1.6 1.2 4-.4 5.3-2.8 2.5-4.7 4.7-5.9 7-1.4 2.6-1.9 5.3-1.3 7.6.3 1.4 1 2.8 1.7 4.3l1.5 3.3c2.1 5.6 2 12-.3 17.6-2.3 5.5-6.8 10.1-12.3 12.5-.4.2-.9.3-1.4.3zm40.8-51.3c1.5-.2 3 .5 3.8 1.9 1.1 1.8.4 4.2-1.4 5.3-3.7 2.1-6.4 5.6-7.6 9.5-1.2 4-.8 8.4 1.1 12.1.4.9 1 1.7 1.6 2.7 1 1.7 2.2 3.5 3 5.7 1.4 4 1.2 8.7-.6 13.2-1.4 3.4-3.5 6.6-6.8 10.1-1.5 1.6-3.9 1.7-5.5.2-1.6-1.4-1.7-3.9-.2-5.4 2.6-2.8 4.3-5.3 5.3-7.7 1.1-2.8 1.3-5.6.5-7.9-.5-1.3-1.3-2.7-2.2-4.1-.6-1-1.3-2.1-1.9-3.2-2.8-5.4-3.4-11.9-1.7-17.8 1.8-5.9 5.8-11 11.2-14 .4-.4.9-.6 1.4-.6zM261.3 590.9c5.7 6.8 9 15.7 9.4 22.4.5 7.3-2.4 16.4-10.2 20.4-3 1.5-6.7 2.2-11.2 2.2-7.9-.1-12.9-2.9-15.4-8.4-2.1-4.7-2.3-11.4 1.8-15.9 3.2-3.5 7.8-4.1 11.2-1.6 1.2.9 1.5 2.7.6 3.9-.9 1.2-2.7 1.5-3.9.6-1.8-1.3-3.6.6-3.8.8-2.4 2.6-2.1 7-.8 9.9 1.5 3.4 4.7 5 10.4 5.1 3.6 0 6.4-.5 8.6-1.6 4.7-2.4 7.7-8.6 7.2-15-.5-7.3-5.3-18.2-13-23.9-4.2-3.1-8.5-4.1-12.9-3.1-3.1.7-6.2 2.4-9.7 5-6.6 5.1-11.7 11.8-14.2 19-2.7 7.7-2.1 15.8 1.9 23.9.7 1.4.1 3.1-1.3 3.7-1.4.7-3.1.1-3.7-1.3-4.6-9.4-5.4-19.2-2.2-28.2 2.9-8.2 8.6-15.9 16.1-21.6 4.1-3.1 8-5.1 11.8-6 6-1.4 12 0 17.5 4 2.1 1.7 4.1 3.6 5.8 5.7z'/%3E%3Ccircle cx='1013.7' cy='153.9' r='7.1'/%3E%3Ccircle cx='1024.3' cy='132.1' r='7.1'/%3E%3Ccircle cx='1037.3' cy='148.9' r='7.1'/%3E%3Cpath d='M1508.7 297.2c-4.8-5.4-9.7-10.8-14.8-16.2 5.6-5.6 11.1-11.5 15.6-18.2 1.2-1.7.7-4.1-1-5.2-1.7-1.2-4.1-.7-5.2 1-4.2 6.2-9.1 11.6-14.5 16.9-4.8-5-9.7-10-14.7-14.9-1.5-1.5-3.9-1.5-5.3 0-1.5 1.5-1.5 3.9 0 5.3 4.9 4.8 9.7 9.8 14.5 14.8-1.1 1.1-2.3 2.2-3.5 3.2-4.1 3.8-8.4 7.8-12.4 12-1.4 1.5-1.4 3.8 0 5.3 1.5 1.4 3.9 1.4 5.3-.1 3.9-4 8.1-7.9 12.1-11.7 1.2-1.1 2.3-2.2 3.5-3.3 4.9 5.3 9.8 10.6 14.6 15.9l.2.2c1.4 1.4 3.7 1.5 5.2.2 1.7-1.2 1.8-3.6.4-5.2zM327.6 248.6l-.4-2.6c-1.5-11.1-2.2-23.2-2.3-37 0-5.5 0-11.5.2-18.5v-2.3c0-5 0-11.2 3.9-13.5 2.2-1.3 5.1-1 8.5.9 5.7 3.1 13.2 8.7 17.5 14.9 5.5 7.8 7.3 16.9 5 25.7-3.2 12.3-15 31-30 32.1l-2.4.3zm4.5-69.4c-.2 0-.3 0-.4.1-.1.1-.7.5-1.1 2.7-.3 1.9-.3 4.2-.3 6.3v2.4c-.2 6.9-.2 12.8-.2 18.3.1 12.5.7 23.5 2 33.7 11-2.7 20.4-18.1 23-27.8 1.9-7.2.4-14.8-4.2-21.3-3.9-5.5-10.9-10.6-15.9-13.3-1.4-.8-2.4-1.1-2.9-1.1zM516.3 60.8c-.1 0-.2 0-.4-.1-2.4-.7-4-.9-6.7-.7-.7 0-1.3-.5-1.4-1.2 0-.7.5-1.3 1.2-1.4 3.1-.2 4.9 0 7.6.8.7.2 1.1.9.9 1.6-.2.6-.7 1-1.2 1zm-10.2 9.7c-.5 0-1-.3-1.2-.8-.8-2.1-1.2-4.3-1.3-6.6 0-.7.5-1.3 1.2-1.3s1.3.5 1.3 1.2c.1 2 .5 3.9 1.1 5.8.2.7-.1 1.4-.8 1.6 0 .1-.2.1-.3.1zm-12-6.1c-.4 0-.8-.2-1-.5-.4-.6-.3-1.4.2-1.8 1.8-1.4 3.7-2.6 5.8-3.6.6-.3 1.4 0 1.7.6.3.6 0 1.4-.6 1.7-1.9.9-3.7 2-5.3 3.3-.2.2-.5.3-.8.3zm6.4-9.1c-.5 0-.9-.3-1.2-.7-.5-1-1.2-1.9-2.4-3.4-.3-.4-.7-.9-1.1-1.4-.4-.6-.3-1.4.2-1.8.6-.4 1.4-.3 1.8.2.4.5.8 1 1.1 1.4 1.3 1.6 2.1 2.6 2.7 3.9.3.6 0 1.4-.6 1.7-.1.1-.3.1-.5.1zm6.2-.3c-.3 0-.5-.1-.8-.2-.6-.4-.7-1.2-.3-1.8 1.2-1.7 2.3-3.4 3.3-5.2.3-.6 1.1-.9 1.7-.5.6.3.9 1.1.5 1.7-1 1.9-2.2 3.8-3.5 5.6-.2.2-.5.4-.9.4zm522.6 327.8c-.1 0-.2 0-.4-.1-2.4-.7-4-.9-6.7-.7-.7 0-1.3-.5-1.4-1.2 0-.7.5-1.3 1.2-1.4 3.1-.2 4.9 0 7.6.8.7.2 1.1.9.9 1.6-.2.6-.7 1-1.2 1zm-10.2 9.7c-.5 0-1-.3-1.2-.8-.8-2.1-1.2-4.3-1.3-6.6 0-.7.5-1.3 1.2-1.3s1.3.5 1.3 1.2c.1 2 .5 3.9 1.1 5.8.2.7-.1 1.4-.8 1.6 0 .1-.2.1-.3.1zm-12-6.1c-.4 0-.8-.2-1-.5-.4-.6-.3-1.4.2-1.8 1.8-1.4 3.7-2.6 5.8-3.6.6-.3 1.4 0 1.7.6.3.6 0 1.4-.6 1.7-1.9.9-3.7 2-5.3 3.3-.2.2-.5.3-.8.3zm6.4-9.1c-.5 0-.9-.3-1.2-.7-.5-1-1.2-1.9-2.4-3.4-.3-.4-.7-.9-1.1-1.4-.4-.6-.3-1.4.2-1.8.6-.4 1.4-.3 1.8.2.4.5.8 1 1.1 1.4 1.3 1.6 2.1 2.6 2.7 3.9.3.6 0 1.4-.6 1.7-.1.1-.3.1-.5.1zm6.2-.3c-.3 0-.5-.1-.8-.2-.6-.4-.7-1.2-.3-1.8 1.2-1.7 2.3-3.4 3.3-5.2.3-.6 1.1-.9 1.7-.5.6.3.9 1.1.5 1.7-1 1.9-2.2 3.8-3.5 5.6-.2.2-.5.4-.9.4zm310 196.4c-1.4 0-2.9-.2-4.5-.7-8.4-2.7-16.6-12.7-18.7-20-.4-1.4-.7-2.9-.9-4.4-8.1 3.3-15.5 10.6-15.4 21 0 1.5-1.2 2.7-2.7 2.8-1.5 0-2.7-1.2-2.7-2.7-.1-6.7 2.4-12.9 7-18 3.6-4 8.4-7.1 13.7-8.8.5-6.5 3.1-12.9 7.4-17.4 7-7.4 18.2-8.9 27.3-10.1l.7-.1c1.5-.2 2.9.9 3.1 2.3.2 1.5-.9 2.9-2.3 3.1l-.7.1c-8.6 1.2-18.4 2.5-24 8.4-3 3.2-5 7.7-5.7 12.4 7.9-1 17.7 1.3 24.3 5.7 4.3 2.9 7.1 7.8 7.2 12.7.2 4.3-1.7 8.3-5.2 11.1-2.4 1.6-5 2.6-7.9 2.6zm-18.7-26.7c.1 1.5.4 3 .8 4.4 1.7 5.8 8.7 14.2 15.1 16.3 2.8.9 5.1.5 7.2-1.1 2.7-2.1 3.2-4.8 3.1-6.6-.1-3.2-2-6.4-4.8-8.3-5.7-3.9-14.7-5.8-21.4-4.7z'/%3E%3C/g%3E%3C/svg%3E"); */
}

.c-services__item {
  background: #159bfe;
  padding: calc(var(--s2) - 0.6rem) var(--s1);
  border-radius: 25px;
  box-shadow: 0 7px 20px rgba(100, 28, 2, 0.135);
  transition: all 300ms ease, transform 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
  position: relative;
  z-index: 1;
}

@media (min-width: 40.625em) {
  .c-services__item {
    transform: translateY(-85px);
  }
}

@media (min-width: 48em) {
  .c-services__item {
    transform: translateY(-130px);
  }
}

@media (min-width: 40.625em) {
  .c-services__item:nth-of-type(1) {
    grid-column: 1/-1;
    grid-row: 4;
  }
}

@media (min-width: 62em) {
  .c-services__item:nth-of-type(1) {
    grid-column: 5/-1;
    grid-row: 3;
  }
}

@media (min-width: 40.625em) {
  .c-services__item:nth-of-type(2) {
    grid-column: 1/span 3;
    grid-row: 2;
  }
}

@media (min-width: 62em) {
  .c-services__item:nth-of-type(2) {
    grid-column: 3/span 2;
    grid-row: auto;
  }
}

@media (min-width: 40.625em) {
  .c-services__item:nth-of-type(3) {
    grid-column: 4/-1;
  }
}

@media (min-width: 62em) {
  .c-services__item:nth-of-type(3) {
    grid-column: 4/-1;
    grid-row: 2;
  }
}

@media (min-width: 40.625em) {
  .c-services__item:nth-of-type(4) {
    grid-column: 1/span 4;
  }
}

@media (min-width: 62em) {
  .c-services__item:nth-of-type(4) {
    grid-column: 1/span 3;
  }
}

@media (min-width: 40.625em) {
  .c-services__item:nth-of-type(5) {
    grid-column: 5/-1;
  }
}

@media (min-width: 62em) {
  .c-services__item:nth-of-type(5) {
    grid-column: 1/span 4;
  }
}

@media (min-width: 40.625em) {
  .c-services__item:nth-of-type(6) {
    grid-column: 1/span 4;
    grid-row: 1;
  }
}

@media (min-width: 62em) {
  .c-services__item:nth-of-type(6) {
    grid-column: 1/span 2;
    grid-row: 1;
  }
}

.c-services__item h3 {
  color: #fff;
  font-family: inherit;
  font-size: 1.057rem;
  line-height: 1.2;
}


.c-services__item:after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  opacity: 0;
  width: 50px;
  height: 50px;
  border-radius: 25px 0;
  cursor: pointer;
  transition: inherit;
  /* background-color: var(--color-brand-accent); */
  background-size: 20px 20px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url(../img/logo/logo\ ACTECH-01.png);
}

.c-services__item p {
  margin-top: var(--s-1);
  font-weight: 400;
  color: #706d7e;
}

.c-services__item:hover {
  background-color: var(--color-brand-accent);
}



@media (min-width: 40.625em) {
  .c-services__item:hover {
    transform: translateY(-93px);
  }
}

@media (min-width: 48em) {
  .c-services__item:hover {
    transform: translateY(-138px);
  }
}

@media (min-width: 48em) {
  body {
    font-size: 1.5rem;
  }
}

@media (min-width: 48em) {
  :root {
    --s0: calc(1.4rem + 0.333vw);
  }
}

@media (min-width: 62em) {
  :root {
    --s0: calc(1.6rem + 0.333vw);
  }
}

@media (min-width: 40.625em) {
  :root {
    --s0: calc(1.25rem + 0.333vw);
  }
}

@media only screen and (min-width:360px) and (max-width:500px) {
  .c-section span:before {
    background: #fff;
    background-image: none;
  }

  .c-section__title-span {
    font-size: 30px;
    color: #149bfd;
    padding-left: 16px;
  }
}

.c-services__item:hover h3 {
  color: #fff;
}

.c-services__item:hover p {
  color: rgba(255, 255, 255, 0.8);
}

.c-services__item:hover:after {
  background-color: #fff;
  background-image: url(../img/logo/logo\ ACTECH-01.png);
  opacity: 1;
}

/* c-section-end */

/* liht-3ms start */

.liht-3ms,
.modul-loi {
  display: block;
  padding: 40px 0;
  background: ceebfcf;
}

.dv_title2 {
  font-weight: 700;
  font-size: 40px;
  text-align: center;
  line-height: 1.3;
  margin-bottom: 50px;
}

gtcl_thumb img,
.news_ar .thumbs img {
  transition: all 0.3s;
}

.gtcl_thumb img {
  max-width: 100%;
  height: 100px;
  width: unset !important;
  display: block;
  margin: auto;
  transition: all 0.5s;
}

.ct_gtcl_title {
  padding: 15px 40px;
  font-weight: 700;
  font-size: 20px;
  text-align: center;
  color: #333;
  height: 44px;
  overflow: visible;
}

.liht-3ms .excript {
  padding: 15px 40px;
}

.excript {
  font-size: 14px;
  text-align: center;
}

.gtcl_thumb img:hover {
  transform: scale(1.3);
}

@media only screen and (min-width:768px) and (max-width: 1100px) {
  .excript {
    font-size: 11px;
  }

  .ct_gtcl_title {
    font-size: 15px;
  }

}

@media (min-width: 1199px) {
  s .gtcl-owl_s .gt_fi2 {
    min-height: 300px;
  }
}

/* liht-3ms end */

/* QuyTrinh-Start */

.quytrinhtk {
  margin-top: 25px;
}

.main-timeline-section {
  position: relative;
  width: 100%;
  margin: auto;
  height: 300px;
}

.main-timeline-section .conference-center-line {
  position: absolute;
  width: 100%;
  height: 3px;
  top: 50%;
  transform: translateY(-50%);
  background: #ceebfc;
}

.marginlefft {
  margin-left: 6%;
}

.timeline-article {
  width: 25%;
  position: relative;
  min-height: 300px;
  float: left;
}

.timeline-article .meta-date1 {
  position: absolute;
  top: 50%;
  left: 78%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  border-radius: 100%;
  background: #036893;
  text-align: center;
  font-size: 14px;
  color: #fff;
  font-weight: 600;
}

.timeline-article .meta-date {
  position: absolute;
  top: 50%;
  left: 26%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  border-radius: 100%;
  background: #ffa707;
  text-align: center;
  font-size: 26px;
  color: #fff;
  font-weight: 700;
}

.timeline-article .content-box {
  width: 180px;
  position: absolute;
  font-size: 18px;
  font-weight: 700;
  top: 60%;
  color: #444;
  text-align: center;
}

.timeline-article-bottom .content-box {
  top: 23%;
}

.timeline-article-bottom .content-box.contentbox3 {
  top: 32%;
}

@media only screen and (max-width: 768px) {
  .main-timeline-section .conference-center-line {
    height: 250px;
    width: 2px;
    top: 45%;
    left: 78px;
  }

  .timeline-article {
    width: 100%;
    min-height: 80px;
  }

  .timeline-article .meta-date1,
  .wpostahs-slider-nav-1 {
    display: none;
  }

  .timeline-article .meta-date {
    position: relative;
    top: unset;
    float: left;
    transform: unset;
  }

  .timeline-article .content-box {
    width: 100%;
    position: unset;
    margin-left: 50px;
    font-size: 15px;
  }

  .timeline-article-bottom .content-box {
    top: unset;
  }

}

/* QuyTrinh-End */

/* blog-slider Start */

.blog-slider {
  width: 95%;
  position: relative;
  max-width: 800px;
  margin: auto;
  background: #fff;
  box-shadow: 0px 14px 80px rgba(34, 35, 58, 0.2);
  padding: 25px;
  border-radius: 25px;
  height: 400px;
  transition: all 0.3s;
}
.blog-slider__img{
  background-color: #4774fa;
}

@media screen and (max-width: 992px) {
  .blog-slider {
    max-width: 680px;
    height: 400px;
  }
}

@media screen and (max-width: 768px) {
  .blog-slider {
    min-height: 500px;
    height: auto;
    margin: 180px auto;
  }
}

@media screen and (max-height: 500px) and (min-width: 992px) {
  .blog-slider {
    height: 350px;
  }
}

.blog-slider__item {
  display: flex;
  align-items: center;
}

@media screen and (max-width: 768px) {
  .blog-slider__item {
    flex-direction: column;
  }
}

.blog-slider__item.swiper-slide-active .blog-slider__img img {
  opacity: 1;
  transition-delay: 0.3s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content>* {
  opacity: 1;
  transform: none;
}

.blog-slider__item.swiper-slide-active .blog-slider__content>*:nth-child(1) {
  transition-delay: 0.3s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content>*:nth-child(2) {
  transition-delay: 0.4s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content>*:nth-child(3) {
  transition-delay: 0.5s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content>*:nth-child(4) {
  transition-delay: 0.6s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content>*:nth-child(5) {
  transition-delay: 0.7s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content>*:nth-child(6) {
  transition-delay: 0.8s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content>*:nth-child(7) {
  transition-delay: 0.9s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content>*:nth-child(8) {
  transition-delay: 1s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content>*:nth-child(9) {
  transition-delay: 1.1s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content>*:nth-child(10) {
  transition-delay: 1.2s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content>*:nth-child(11) {
  transition-delay: 1.3s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content>*:nth-child(12) {
  transition-delay: 1.4s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content>*:nth-child(13) {
  transition-delay: 1.5s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content>*:nth-child(14) {
  transition-delay: 1.6s;
}

.blog-slider__item.swiper-slide-active .blog-slider__content>*:nth-child(15) {
  transition-delay: 1.7s;
}

.blog-slider__img {
  width: 300px;
  flex-shrink: 0;
  height: 300px;
  box-shadow: 4px 13px 30px 1px rgb(0 0 0 / 20%);
  border-radius: 20px;
  transform: translateX(-80px);
  overflow: hidden;
}

.blog-slider__img:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 20px;
  opacity: 0.2;
}

.blog-slider__img img {
  width: 100%;
  height: 100%;
  /* object-fit: cover; */
  display: block;
  opacity: 0;
  border-radius: 20px;
  transition: all 0.3s;
}

@media screen and (max-width: 768px) {
  .blog-slider__img {
    transform: translateY(-50%);
    width: 90%;
  }
}

@media screen and (max-width: 576px) {
  .blog-slider__img {
    width: 95%;
  }
}

@media screen and (max-height: 500px) and (min-width: 992px) {
  .blog-slider__img {
    height: 270px;
  }
}

.blog-slider__content {
  padding-right: 25px;
}

@media screen and (max-width: 768px) {
  .blog-slider__content {
    margin-top: -80px;
    text-align: center;
    padding: 0 30px;
  }
}

@media screen and (max-width: 576px) {
  .blog-slider__content {
    padding: 0;
  }
}

.blog-slider__content>* {
  opacity: 0;
  transform: translateY(25px);
  transition: all 0.4s;
}

.blog-slider__code {
  color: #7b7992;
  margin-bottom: 15px;
  display: block;
  font-weight: 500;
}

.blog-slider__title {
  font-size: 24px;
  font-weight: 700;
  color: #0d0925;
  margin-bottom: 20px;
}

.blog-slider__text {
  color: #4e4a67;
  margin-bottom: 30px;
  line-height: 1.5em;
}

.blog-slider__button {
  display: inline-flex;
  background-image: linear-gradient(147deg, #fe8a39 0%, #fd3838 74%);
  padding: 15px 35px;
  border-radius: 50px;
  color: #fff;
  box-shadow: 0px 14px 80px rgba(252, 56, 56, 0.4);
  text-decoration: none;
  font-weight: 500;
  justify-content: center;
  text-align: center;
  letter-spacing: 1px;
}

@media screen and (max-width: 576px) {
  .blog-slider__button {
    width: 100%;
  }
}

.blog-slider .swiper-container-horizontal>.swiper-pagination-bullets,
.blog-slider .swiper-pagination-custom,
.blog-slider .swiper-pagination-fraction {
  bottom: 10px;
  left: 0;
  width: 100%;
}

.blog-slider__pagination {
  position: absolute;
  z-index: 21;
  right: 20px;
  width: 11px !important;
  text-align: center;
  left: auto !important;
  top: 50%;
  bottom: auto !important;
  transform: translateY(-50%);
}

@media screen and (max-width: 768px) {
  .blog-slider__pagination {
    transform: translateX(-50%);
    left: 50% !important;
    top: 205px;
    width: 100% !important;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}

.blog-slider__pagination.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 8px 0;
}

@media screen and (max-width: 768px) {
  .blog-slider__pagination.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 5px;
  }
}

.blog-slider__pagination .swiper-pagination-bullet {
  width: 11px;
  height: 11px;
  display: block;
  border-radius: 10px;
  background: #062744;
  opacity: 0.2;
  transition: all 0.3s;
}

.blog-slider__pagination .swiper-pagination-bullet-active {
  opacity: 1;
  background: #003efa;
  height: 30px;
  box-shadow: 0px 0px 20px rgb(7 8 70 / 30%);
}

@media screen and (max-width: 768px) {
  .blog-slider__pagination .swiper-pagination-bullet-active {
    height: 11px;
    width: 30px;
  }
}

/* blog-slider End */

.section-padding {
  padding-top: 120px;
  padding-bottom: 120px;
}

.separator {
  border-top: 1px solid #f2f2f2;
}

.mb-90 {
  margin-bottom: 90px;
}

@media (max-width: 767px) {
  .mb-90 {
    margin-bottom: 30px;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .mb-90 {
    margin-bottom: 45px;
  }
}

/* owl-carousel button style */
.owl-carousel .owl-nav div {
  background: rgba(255, 255, 255, 0.8) none repeat scroll 0 0;
  height: 40px;
  left: 20px;
  line-height: 40px;
  font-size: 22px;
  color: #646464;
  opacity: 1;
  visibility: visible;
  position: absolute;
  text-align: center;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  width: 40px;
}

.owl-carousel .owl-nav div.owl-next {
  left: auto;
  right: -30px;
}

.owl-carousel .owl-nav div.owl-next i {
  position: relative;
  right: 0;
  top: 1px;
}

.owl-carousel .owl-nav div.owl-prev i {
  position: relative;
  right: 1px;
  top: 0px;
}

.owl-carousel:hover .owl-nav div {
  opacity: 1;
  visibility: visible;
}

.owl-carousel:hover .owl-nav div:hover {
  color: #fff;
  background: #ff3500;
}

.btn {
  background: #c9252a00;
  padding: 27px 44px;
  text-transform: uppercase;
  font-family: "Roboto Slab", sans-serif;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-size: 14px;
  border-radius: 5px;
  -moz-user-select: none;
  font-weight: 400;
  letter-spacing: 1px;
  line-height: 0;
  margin-bottom: 0;
  margin: 10px;
  cursor: pointer;
  -webkit-transition: color 0.4s linear;
  transition: color 0.4s linear;
  position: relative;
  z-index: 1;
  border: 0;
  overflow: hidden;
  margin: 0;
}

.btn::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 101%;
  height: 101%;
  background: #149bfd;
  z-index: 1;
  border-radius: 5px;
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
  -webkit-transition-timing-function: cubic-bezier(0.5, 1.6, 0.4, 0.7);
  transition-timing-function: cubic-bezier(0.5, 1.6, 0.4, 0.7);
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  border-radius: 0;
}

.btn:hover::before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
  color: #fff !important;
  z-index: -1;
}

.btn.focus,
.btn:focus {
  outline: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.btn-arrow {
  color: #c9252b;
  position: relative;
  right: 5px;
  -webkit-animation: arrow 1s infinite alternate;
  animation: arrow 1s infinite alternate;
}

.btn-arrow:hover {
  color: #fff;
}

@-webkit-keyframes arrow {
  100% {
    right: 0;
  }
}

@keyframes arrow {
  100% {
    right: 0;
  }
}

.header-btn {
  padding: 25px 35px;
}

.header-top-btn {
  padding: 10px 10px 6px 10px;
  border: 1px solid #fff !important;
}

.banner-btn {
  padding: 20px 30px;
  border: 1px solid #fff !important;
}

.about-btn {
  color: #000;
  font-weight: 600;
  padding: 20px 30px;
  border: 1px solid #000 !important;
}

.submit-btn {
  width: 100%;
  color: #000;
  font-weight: 600;
  font-family: inherit;
  padding: 20px 30px;
  border: 1px solid #000 !important;
}

/* Slide_auto*/
/* General Variables */
/* General Styles */
/*  */
.section-header {
  padding-top: 5.625em;
  text-align: center;
}

.section-header h3 {
  margin-bottom: 0.5em;
}

.section-header .line-red {
  margin: 2.5em auto 2.9375em auto;
}

.line-red {
  display: block;
  width: 4em;
  height: 0.1875em;
  margin: 0 auto;
  background: #f38181;
}

/* Section-1 Styles */
#section-1 {
  height: 38em;
  color: #fff;
  background-color: #222;
}

#section-1 .content-slider {
  position: relative;
  width: 100%;
  height: 100%;
}

#section-1 .content-slider input {
  display: none;
}

#section-1 .content-slider .slider {
  position: relative;
  width: inherit;
  height: inherit;
  overflow: hidden;
}

#section-1 .content-slider .slider .banner {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  z-index: 0;
  width: inherit;
  height: inherit;
  text-align: center;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  transition: all 0.5s ease;
}

#section-1 .content-slider .slider .banner .banner-inner-wrapper {
  height: 100%;
  padding-top: 6em;
  background-image: linear-gradient(rgb(129 205 243 / 80%), rgb(252 227 138 / 80%));
  box-sizing: border-box;
  padding-bottom: 6em;
}

#section-1 .content-slider .slider .banner .banner-inner-wrapper h2 {
  padding-bottom: 0.3em;
  font-weight: 400;
  font-size: 2.5em;
  text-transform: none;
}

#section-1 .content-slider .slider .banner .banner-inner-wrapper h1 {
  font-size: 6em;
  line-height: 95%;
}

#section-1 .content-slider .slider .banner .banner-inner-wrapper .line {
  display: block;
  width: 4em;
  height: 0.1875em;
  margin: 2.5em auto;
  background: #fff;
}

#section-1 .content-slider .slider .banner .banner-inner-wrapper .learn-more-button {
  padding-bottom: 5em;
  z-index: 15 !important;
}

#section-1 .content-slider .slider .banner .banner-inner-wrapper .learn-more-button a {
  padding: 0.5em 2em;
  text-align: center;
  font-family: Montserrat, sans-serif;
  font-size: 0.875em;
  color: #fff;
  text-transform: uppercase;
  border: 0.1875em solid #fff;
}

#section-1 .content-slider .slider .banner .banner-inner-wrapper .learn-more-button a:hover {
  color: #e88382;
  border-color: #e88382;
  transition: 0.3s;
}

#section-1 .content-slider .slider #top-banner-1 {
  background: url('/assets/img/gallery/blog01.png') no-repeat center center;
  background-size: cover;
}

#section-1 .content-slider .slider #top-banner-2 {
  background: url('/assets/img/gallery/blog02.png') no-repeat center center;
  background-size: cover;
}

#section-1 .content-slider .slider #top-banner-3 {
  background: url('/assets/img/gallery/blog01.png') no-repeat center center;
  background-size: cover;
}

#section-1 .content-slider .slider #top-banner-4 {
  background: url('/assets/img/gallery/blog02.png') no-repeat center center;
  background-size: cover;
}

#section-1 .content-slider nav {
  position: absolute;
  bottom: 0.5em;
  width: 100%;
  z-index: 10;
  text-align: center;
}

#section-1 .content-slider nav .controls {
  display: block;
  width: 70%;
  margin: 0 auto;
  font-family: Montserrat, sans-serif;
  color: #fff;
}

#section-1 .content-slider nav .controls label {
  position: relative;
  display: inline-block;
  width: 20%;
  height: 3.1em;
  overflow: hidden;
  margin: 0 1em;
  padding-top: 1em;
  text-align: left;
  text-transform: uppercase;
  font-family: Montserrat, sans-serif;
  font-size: 1em;
  color: #f6eac5;
  font-weight: 400;
  cursor: pointer;
  transition: all 0.3s;
}

#section-1 .content-slider nav .controls label .progressbar {
  position: absolute;
  top: 0;
  left: 0;
  height: 3px;
  width: 100%;
  background: #f6eac5;
  z-index: 100;
}

#section-1 .content-slider nav .controls label .progressbar .progressbar-fill {
  position: inherit;
  width: inherit;
  height: inherit;
  margin-left: -100%;
  background: #e88382;
}

#section-1 .content-slider nav .controls label span {
  font-size: 1.4em;
  font-weight: 700;
}

#section-1 .content-slider nav .controls label:hover {
  color: #e88382;
}

#section-1 .content-slider #banner1:checked~.slider #top-banner-1,
#section-1 .content-slider #banner2:checked~.slider #top-banner-2,
#section-1 .content-slider #banner3:checked~.slider #top-banner-3,
#section-1 .content-slider #banner4:checked~.slider #top-banner-4 {
  opacity: 1;
  z-index: 1;
}

#section-1 .content-slider #banner1:checked~nav label:nth-of-type(1),
#section-1 .content-slider #banner2:checked~nav label:nth-of-type(2),
#section-1 .content-slider #banner3:checked~nav label:nth-of-type(3),
#section-1 .content-slider #banner4:checked~nav label:nth-of-type(4) {
  cursor: default;
  color: #fff;
  transition: all 0.5s;
}

#section-1 .content-slider #banner1:checked~nav label:nth-of-type(1) .progressbar,
#section-1 .content-slider #banner2:checked~nav label:nth-of-type(2) .progressbar,
#section-1 .content-slider #banner3:checked~nav label:nth-of-type(3) .progressbar,
#section-1 .content-slider #banner4:checked~nav label:nth-of-type(4) .progressbar {
  background: #fff;
}

#section-1 .content-slider #banner1:checked~nav label:nth-of-type(1) .progressbar-fill,
#section-1 .content-slider #banner2:checked~nav label:nth-of-type(2) .progressbar-fill,
#section-1 .content-slider #banner3:checked~nav label:nth-of-type(3) .progressbar-fill,
#section-1 .content-slider #banner4:checked~nav label:nth-of-type(4) .progressbar-fill {
  animation: progressBarFill 5s linear;
}

/* Animations */
@keyframes progressBarFill {
  from {
    margin-left: -100%;
  }

  to {
    margin-left: 0;
  }
}

/* Media Queries */
@media only screen and (min-width: 1920px) {
  body {
    font-size: 22px;
  }

  .main-header .header-wrapper {
    width: 57%;
  }

  #section-1 {
    height: 33em;
  }

  #section-1 .content-slider .slider .banner .banner-inner-wrapper {
    padding-top: 3em;
  }
}

@media only screen and (max-width: 1919px) {
  body {
    font-size: 20px;
  }

  .main-header .header-wrapper {
    width: 60%;
  }

  #section-1 {
    height: 43em;
  }

  #section-1 .content-slider .slider .banner .banner-inner-wrapper {
    padding-top: 11em;
  }
}

@media only screen and (max-width: 1680px) {
  body {
    font-size: 18px;
  }

  .main-header .header-wrapper {
    width: 65%;
  }

  #section-1 {
    height: 40em;
  }

  #section-1 .content-slider .slider .banner .banner-inner-wrapper {
    padding-top: 9em;
  }
}

@media only screen and (max-width: 1366px) {
  body {
    font-size: 16px;
  }

  .main-header .header-wrapper {
    width: 70%;
  }
}

@media only screen and (max-width: 1120px) {
  .main-header .header-wrapper .main-menu li {
    padding: 0.75em 1.4em;
  }

  #section-1 {
    height: 35em;
  }

  #section-1 .content-slider nav {
    bottom: -0.2em;
  }

  #section-1 .content-slider .slider .banner .banner-inner-wrapper {
    padding-top: 7em;
  }

  #section-1 .content-slider .slider .banner .banner-inner-wrapper .line {
    margin: 2em auto;
  }
}

@media only screen and (max-width: 1024px) {
  body {
    font-size: 14px;
  }

  .main-header .header-wrapper .main-menu li {
    padding: 0.75em 1.3em;
  }

  #section-1 .content-slider nav {
    bottom: 0;
  }

  #section-1 .content-slider nav .controls {
    width: 80%;
  }
}

@media only screen and (max-width: 860px) {
  .main-header .header-wrapper .main-menu li {
    padding: 0.75em 0.9em;
  }

  #section-1 {
    height: 32em;
  }

  #section-1 .content-slider nav {
    bottom: -1em;
  }

  #section-1 .content-slider nav .controls {
    width: 90%;
    padding-bottom: 20px;
  }

  #section-1 .content-slider .slider .banner .banner-inner-wrapper h2 {
    font-size: 2em;
  }

  #section-1 .content-slider .slider .banner .banner-inner-wrapper h1 {
    font-size: 4.5em;
  }

  #section-1 .content-slider .slider .banner .banner-inner-wrapper {
    padding-top: 5em;
  }
}

@media only screen and (max-width: 768px) {
  .main-header .header-wrapper .main-menu li {
    padding: 0.75em 0.5em;
  }

  #section-1 {
    height: 30em;
  }

  #section-1 .content-slider nav .controls {
    width: 100%;
  }

  #section-1 .content-slider nav .controls label {
    width: 19%;
    font-size: 0.8em;
  }

  #section-1 .content-slider .slider .banner .banner-inner-wrapper .line {
    margin: 1.7em auto;
  }
}

@media only screen and (max-width: 650px) {
  .main-header .header-wrapper {
    width: 95%;
  }
}

@media only screen and (max-width: 480px) {
  .main-header .header-wrapper {
    width: 97%;
  }

  .main-header .header-wrapper .main-logo {
    display: none;
  }

  .main-header .header-wrapper .main-menu li {
    padding: 0.2em 0.3em;
  }

  .main-header .header-wrapper .main-menu li:last-child,
  .main-header .header-wrapper .main-menu li:nth-child(6) {
    padding: 0.2em 0.7em;
  }

  #section-1 {
    height: 26em;
  }

  #section-1 .content-slider nav {
    bottom: -0.5em;
  }

  #section-1 .content-slider nav .controls label {
    width: 40%;
    font-size: 0.7em;
  }

  #section-1 .content-slider .slider .banner .banner-inner-wrapper h2 {
    font-size: 1.5em;
  }

  #section-1 .content-slider .slider .banner .banner-inner-wrapper h1 {
    font-size: 3em;
  }

  #section-1 .content-slider .slider .banner .banner-inner-wrapper .line {
    margin: 1.7em auto;
  }
}

/* End Slider */
/* Technology style css start*/

.hero-section {
  align-items: flex-start;
  /* background-image: linear-gradient(15deg, #0f4667 0%, #2a6973 150%); */
  display: flex;
  min-height: 100%;
  justify-content: center;
  padding: var(--spacing-xxl) var(--spacing-l);
  margin-bottom: -73px;
  margin-top: -26px;
}

.card-grid {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  grid-column-gap: var(--spacing-l);
  grid-row-gap: var(--spacing-l);
  max-width: var(--width-container);
  width: 100%;
}

.card_technology_hero_section {
  list-style: none;
  position: relative;
  background-color: #7fc7fb;
  border-radius: 20px;
}

.card_technology_hero_section:hover {
  background-color: #33a7fb;
  transition: all 0.5s;
}

.card_technology_hero_section:before {
  content: '';
  display: block;
  padding-bottom: 150%;
  width: 100%;
}

.Btn-hero-section {
  background-color: #7fc7fb;
  color: #fff;
  border-color: #fff;
  border-radius: 20px;
  width: 180px;
  margin: 55px 0px 25px 52px;
  cursor: pointer;
  transition: all 0.8s;
}

.Btn-hero-section:hover,
.Btn-hero-section:active {
  transform: scale(1.1);
}

.Btn-hero-section p {
  font-size: 10px;
  font-size: 13px;
  line-height: 0px;
  color: #fff;
  margin-top: 10px;
}

.card__background-1,
.card__background-2,
.card__background-3,
.card__background-4 {
  background-size: cover;
  border-color: #fff;
  width: 85%;
  height: 50%;
  margin: 20px 25px 25px 23px;
  background-position: center;
  border-radius: var(--spacing-l);
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transform-origin: center;
  transform: scale(1) translateZ(0);
  transition: filter 200ms linear, transform 200ms linear;
  box-shadow: 0px 19px 12px -7px grey;
  border: 2px white solid;
}

.card__background-1 {
  background-image: url(../img/gallery/Linh_Vuc_Phat_Trien_AC-SMT.png);
}

.card__background-2 {
  background-image: url(../img/gallery/Linh_Vuc_Phat_Trien_AC-Smart-System.jpg);
}

.card__background-3 {
  background-image: url(../img/gallery/Linh_Vuc_Phat_Trien_AC-App.jpg);
}

.card__background-4 {
  background-image: url(../img/gallery/Linh_Vuc_Phat_Trien_AC-Product.jpg);
}

.card_technology_hero_section:hover .card__background-1 .card__background-2 .card__background-3 .card__background-4 {
  transform: scale(1.05) translateZ(0);
}

/* .card-grid:hover > .card_technology_hero_section:not(:hover) .card__background{
  
} */

.card__content {
  left: 0;
  padding: var(--spacing-l);
  position: absolute;
  top: 60%;
}

.card__category {
  position: relative;
  color: var(--text-light);
  font-size: 0.8rem;
  margin-bottom: var(--spacing-s);
  text-transform: uppercase;
  text-align: center;
  color: floralwhite;
  z-index: 1;
  font-weight: bold;
}

.card__heading {
  position: relative;
  color: var(--text-lighter);
  font-size: 1.5rem;
  text-shadow: 2px 2px 20px rgba(0, 0, 0, 0.2);
  line-height: 1.4;
  text-align: center;
  z-index: 1;
  /* word-spacing: 100vw; */
}

.card_technology_hero_section:nth-child(4) .card__content .card__heading {
  margin-left: 11px;
}

.card_technology_hero_section:nth-child(4) .card__content .card__category {
  margin-left: 9px;
}

.card_technology_hero_section:nth-child(1) .card__content .card__heading {
  margin-left: 11px;
}

.card_technology_hero_section:nth-child(1) .card__content .card__category {
  margin-left: 9px;
}

@media(min-width: 540px) {
  .card-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media(min-width: 960px) {
  .card-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media only screen and (min-width:960px) and (max-width:1170px) {
  .card__heading {
    font-size: 14px;
  }

  .card__category {
    font-size: 8px;
  }

  .Btn-hero-section {
    margin: 52px 0px 26px 25px;
  }
}

@media only screen and (min-width:540px) and (max-width:959px) {
  .card__heading {
    font-size: 30px;
  }

  .card__category {
    font-size: 1.5rem;
  }

  .card_technology_hero_section:nth-child(4) .card__content .card__category {
    font-size: 1.5rem;
    margin-left: 31px;
  }

  .card_technology_hero_section:nth-child(4) .card__content .card__heading {
    margin-left: 29px;
  }

  .Btn-hero-section {
    margin: 52px 0px 26px 100px;
  }
}

@media only screen and (max-width:360px) {
  .card__heading {
    font-size: 25px;
  }

  .card__category {
    font-size: 19px;
  }

  .card_technology_hero_section:nth-child(4) .card__content .card__category {
    margin-left: 57px;
  }

  .card_technology_hero_section:nth-child(4) .card__content .card__heading {
    margin-left: 50px;
  }

  .Btn-hero-section {
    margin: 52px 0px 26px 88px;
  }
}

@media only screen and (min-width:340px) and (max-width:420px) {
  .card__heading {
    font-size: 25px;
  }

  .card__category {
    font-size: 19px;
  }

  .card_technology_hero_section:nth-child(4) .card__content .card__category {
    margin-left: 17px;
  }

  .card_technology_hero_section:nth-child(4) .card__content .card__heading {
    margin-left: 20px;
  }

  .Btn-hero-section {
    margin: 52px 0px 26px 67px;
  }
}

/* Technology style css end*/
/* Framework Section */

#drop-menu {
  display: block;
  position: relative;
  top: 80px;
  left: 0;
  right: 0;
  background-color: #fff;
  /* z-index: 888; */
  -moz-box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1);
  margin-top: -67px;
  /* -webkit-box-shadow: 0 2px 10px 0 rgb(0 0 0 / 10%);
  box-shadow: 0 2px 10px 0 rgb(0 0 0 / 10%); */
}

#drop-menu .row-drop-menu {
  overflow: hidden;
  display: flex;
}

#drop-menu .row-drop-menu .col-drop-menu {
  flex: 1;
  padding: 20px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  width: 25%;
  padding: 25px 0px 25px 54px;
}

#drop-menu .row-drop-menu .col-drop-menu .header {
  margin-bottom: 20px;
  cursor: pointer;
  border-bottom: 0;
  margin-bottom: 0;
}

#drop-menu .row-drop-menu .col-drop-menu .header .name {
  position: relative;
  font-weight: 700;
  font-size: 24px;
  line-height: 30px;
  letter-spacing: .02em;
  text-transform: uppercase;
  display: inline-block;
  padding-bottom: 20px;
  color: #106fb4;
  padding-bottom: 8px;
  background:
    linear-gradient(currentColor 0 0) left -100% bottom 0,
    linear-gradient(currentColor 0 0) right -100% bottom 0;
  background-size: 40% 3px;
  background-repeat: no-repeat;
  transition: 0.5s;
}

#drop-menu .row-drop-menu .col-drop-menu .header .name:hover {
  background-position: left 10% bottom 0, right 10% bottom 0;
}

#drop-menu .row-drop-menu .col-drop-menu .list-drop {
  margin: 0 -10px;
}

#drop-menu .row-drop-menu .col-drop-menu .list-drop .drop {
  position: relative;
  transition: all .5s;
  cursor: pointer;
  display: block;
  font-weight: normal;
  color: #505050;
  padding: 10px 0 10px 55px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  margin-bottom: 4px;
}

#drop-menu .row-drop-menu .col-drop-menu .list-drop .drop .icon {
  position: absolute;
  display: block;
  left: 13px;
  top: 13px;
  width: 40px;
  height: 40px;
}

#drop-menu .row-drop-menu .col-drop-menu .list-drop .drop .icon img {
  width: 42px;
  height: 40px;
}

#drop-menu .row-drop-menu .col-drop-menu .list-drop .drop .name {
  font-size: 0.79rem;
  font-family: inherit;
  font-weight: 500;
  display: block;
  padding-bottom: 20px;
  padding-left: 8px;
  color: #000;
  margin-top: 8px;
}

#drop-menu .row-drop-menu .col-drop-menu .list-drop .drop .infor {
  font-size: 13px;
  color: #3e3e3e;
  display: block;
  padding-left: 8px;
}

@media only screen and (max-width: 576px) {
  #drop-menu .row-drop-menu {
    display: block;
  }

  #drop-menu .row-drop-menu .col-drop-menu {
    width: 100%;
    padding: 25px 0px 25px 0px
  }

  #drop-menu .row-drop-menu .col-drop-menu .header .name {
    font-size: 18px;
    line-height: 22px;
    padding-bottom: 8px;
  }

  #drop-menu .row-drop-menu .col-drop-menu .list-drop {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    grid-template-areas:
      ". ."
      ". .";
    grid-gap: 10px;
  }

  #drop-menu .row-drop-menu .col-drop-menu .list-drop .drop {
    padding: 10px 8px 10px 55px;
  }

  #drop-menu .row-drop-menu .col-drop-menu .list-drop .drop .icon {
    top: 10px;
  }
}

@media only screen and (min-width: 580px) and (max-width:860px) {
  #drop-menu .row-drop-menu .col-drop-menu {
    padding: 20px 0px 20px 0px !important;
  }

  #drop-menu .row-drop-menu .col-drop-menu .list-drop .drop .name {
    font-size: 11px;
    padding: 11px;
  }

  #drop-menu .row-drop-menu .col-drop-menu .header .name {
    font-size: 16px;
  }
}

@media only screen and (max-width: 992px) {
  .about-app #drop-menu .row-drop-menu .col-drop-menu {
    padding: 20px 15px 20px 0 !important;
  }
}

/* Framework Section End */

.hero-btn {
  padding: 30px 38px;
}

hero-btn {
  padding: 30px 38px;
}

@media (max-width: 575px) {
  .btn.btn-black.f-right {
    float: left;
    margin-top: 20px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .btn.btn-black.f-right {
    float: left;
    margin-top: 20px;
  }
}

.submit-btn2 {
  background: #ec5b53;
  width: 100%;
  height: 60px;
  padding: 10px 20px;
  border: 0;
  color: #fff;
  text-transform: capitalize;
  cursor: pointer;
  font-size: 16px;
  border-radius: 0px;
}

.border-btn {
  border: 1px solid #e3c6c6;
  color: #464d65;
  background: none;
  border-radius: 5px;
  text-transform: capitalize;
  padding: 25px 57px;
  -moz-user-select: none;
  cursor: pointer;
  display: inline-block;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 1px;
  margin-bottom: 0;
  position: relative;
  -webkit-transition: color 0.4s linear;
  transition: color 0.4s linear;
  position: relative;
  overflow: hidden;
  margin: 0;
}

@media (max-width: 575px) {
  .border-btn {
    display: none;
  }
}

.border-btn::before {
  border: 1px solid transparent;
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 101%;
  height: 101%;
  background: #c9252b;
  z-index: -1;
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
  -webkit-transition-timing-function: cubic-bezier(0.5, 1.6, 0.4, 0.7);
  transition-timing-function: cubic-bezier(0.5, 1.6, 0.4, 0.7);
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  border-radius: 0;
}

.border-btn:hover::before {
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
  border: 1px solid transparent;
}

.content-btn-fix-small {
  position: fixed;
  z-index: 10;
  bottom: 1%;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .content-btn-fix-small {
    left: 1%;
    margin: 0 15px;
  }
}

.content-btn-fix-small .btn-fix-small {
  width: 100%;
  padding: 12px 20px;
  border: 0 !important;
}

@media (max-width: 390px) {
  .content-btn-fix-small .btn-fix-small {
    width: 55%;
    padding: 12px 20px;
    border: 0 !important;
  }

}

.content-btn-fix-small .btn-fix-small-register {
  background-color: #c31515a8;
}

.content-btn-fix-small .btn-fix-small-register i {
  color: #fff !important;
}

.content-btn-fix-small .btn-fix-small-login {
  background-color: #289d10a8;
}

.content-btn-fix-small .btn-fix-small-login i {
  color: #fff !important;
}

/* button style */
.breadcrumb>.active {
  color: #888;
}

/* scrollUp */
#scrollUp,
#back-top {
  background: #c31515a8;
  height: 50px;
  width: 50px;
  right: 31px;
  bottom: 8%;
  position: fixed;
  z-index: 10;
  color: #fff;
  font-size: 20px;
  text-align: center;
  border-radius: 50%;
  line-height: 48px;
  border: 2px solid transparent;
  -webkit-box-shadow: 0 0 10px 3px rgba(108, 98, 98, 0.2);
  box-shadow: 0 0 10px 3px rgba(108, 98, 98, 0.2);
}

@media (max-width: 575px) {

  #scrollUp,
  #back-top {
    right: 16px;
  }
}

#scrollUp a i,
#back-top a i {
  display: block;
  line-height: 50px;
}

#scrollUp:hover {
  color: #fff;
}

/* Sticky*/
.sticky-bar {
  left: 0;
  margin: auto;
  position: fixed;
  top: 0;
  width: 100%;
  -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
  box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
  z-index: 9999;
  -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: #fff;
}

/* Sticky end */
/*--- Margin & Padding --*/
/*-- Margin Top --*/
.mt-5 {
  margin-top: 5px;
}

.mt-10 {
  margin-top: 10px;
}

.mt-15 {
  margin-top: 15px;
}

.mt-20 {
  margin-top: 20px;
}

.mt-25 {
  margin-top: 25px;
}

.mt-30 {
  margin-top: 30px;
}

.mt-35 {
  margin-top: 35px;
}

.mt-40 {
  margin-top: 40px;
}

.mt-45 {
  margin-top: 45px;
}

.mt-50 {
  margin-top: 50px;
}

.mt-55 {
  margin-top: 55px;
}

.mt-60 {
  margin-top: 60px;
}

.mt-65 {
  margin-top: 65px;
}

.mt-70 {
  margin-top: 70px;
}

.mt-75 {
  margin-top: 75px;
}

.mt-80 {
  margin-top: 80px;
}

.mt-85 {
  margin-top: 85px;
}

.mt-90 {
  margin-top: 90px;
}

.mt-95 {
  margin-top: 95px;
}

.mt-100 {
  margin-top: 100px;
}

.mt-105 {
  margin-top: 105px;
}

.mt-110 {
  margin-top: 110px;
}

.mt-115 {
  margin-top: 115px;
}

.mt-120 {
  margin-top: 120px;
}

.mt-125 {
  margin-top: 125px;
}

.mt-130 {
  margin-top: 130px;
}

.mt-135 {
  margin-top: 135px;
}

.mt-140 {
  margin-top: 140px;
}

.mt-145 {
  margin-top: 145px;
}

.mt-150 {
  margin-top: 150px;
}

.mt-155 {
  margin-top: 155px;
}

.mt-160 {
  margin-top: 160px;
}

.mt-165 {
  margin-top: 165px;
}

.mt-170 {
  margin-top: 170px;
}

.mt-175 {
  margin-top: 175px;
}

.mt-180 {
  margin-top: 180px;
}

.mt-185 {
  margin-top: 185px;
}

.mt-190 {
  margin-top: 190px;
}

.mt-195 {
  margin-top: 195px;
}

.mt-200 {
  margin-top: 200px;
}

/*-- Margin Bottom --*/
.mb-5 {
  margin-bottom: 5px;
}

.mb-10 {
  margin-bottom: 10px;
}

.mb-15 {
  margin-bottom: 15px;
}

.mb-20 {
  margin-bottom: 20px;
}

.mb-25 {
  margin-bottom: 25px;
}

.mb-30 {
  margin-bottom: 30px;
}

.mb-35 {
  margin-bottom: 35px;
}

.mb-40 {
  margin-bottom: 40px;
}

.mb-45 {
  margin-bottom: 45px;
}

.mb-50 {
  margin-bottom: 50px;
}

.mb-55 {
  margin-bottom: 55px;
}

.mb-60 {
  margin-bottom: 60px;
}

.mb-65 {
  margin-bottom: 65px;
}

.mb-70 {
  margin-bottom: 70px;
}

.mb-75 {
  margin-bottom: 75px;
}

.mb-80 {
  margin-bottom: 80px;
}

.mb-85 {
  margin-bottom: 85px;
}

.mb-90 {
  margin-bottom: 90px;
}

.mb-95 {
  margin-bottom: 95px;
}

.mb-100 {
  margin-bottom: 100px;
}

.mb-105 {
  margin-bottom: 105px;
}

.mb-110 {
  margin-bottom: 110px;
}

.mb-115 {
  margin-bottom: 115px;
}

.mb-120 {
  margin-bottom: 120px;
}

.mb-125 {
  margin-bottom: 125px;
}

.mb-130 {
  margin-bottom: 130px;
}

.mb-135 {
  margin-bottom: 135px;
}

.mb-140 {
  margin-bottom: 140px;
}

.mb-145 {
  margin-bottom: 145px;
}

.mb-150 {
  margin-bottom: 150px;
}

.mb-155 {
  margin-bottom: 155px;
}

.mb-160 {
  margin-bottom: 160px;
}

.mb-165 {
  margin-bottom: 165px;
}

.mb-170 {
  margin-bottom: 170px;
}

.mb-175 {
  margin-bottom: 175px;
}

.mb-180 {
  margin-bottom: 180px;
}

.mb-185 {
  margin-bottom: 185px;
}

.mb-190 {
  margin-bottom: 190px;
}

.mb-195 {
  margin-bottom: 195px;
}

.mb-200 {
  margin-bottom: 200px;
}

/*-- Margin Left --*/
.ml-5 {
  margin-left: 5px;
}

.ml-10 {
  margin-left: 10px;
}

.ml-15 {
  margin-left: 15px;
}

.ml-20 {
  margin-left: 20px;
}

.ml-25 {
  margin-left: 25px;
}

.ml-30 {
  margin-left: 30px;
}

.ml-35 {
  margin-left: 35px;
}

.ml-40 {
  margin-left: 40px;
}

.ml-45 {
  margin-left: 45px;
}

.ml-50 {
  margin-left: 50px;
}

.ml-55 {
  margin-left: 55px;
}

.ml-60 {
  margin-left: 60px;
}

.ml-65 {
  margin-left: 65px;
}

.ml-70 {
  margin-left: 70px;
}

.ml-75 {
  margin-left: 75px;
}

.ml-80 {
  margin-left: 80px;
}

.ml-85 {
  margin-left: 85px;
}

.ml-90 {
  margin-left: 90px;
}

.ml-95 {
  margin-left: 95px;
}

.ml-100 {
  margin-left: 100px;
}

.ml-105 {
  margin-left: 105px;
}

.ml-110 {
  margin-left: 110px;
}

.ml-115 {
  margin-left: 115px;
}

.ml-120 {
  margin-left: 120px;
}

.ml-125 {
  margin-left: 125px;
}

.ml-130 {
  margin-left: 130px;
}

.ml-135 {
  margin-left: 135px;
}

.ml-140 {
  margin-left: 140px;
}

.ml-145 {
  margin-left: 145px;
}

.ml-150 {
  margin-left: 150px;
}

.ml-155 {
  margin-left: 155px;
}

.ml-160 {
  margin-left: 160px;
}

.ml-165 {
  margin-left: 165px;
}

.ml-170 {
  margin-left: 170px;
}

.ml-175 {
  margin-left: 175px;
}

.ml-180 {
  margin-left: 180px;
}

.ml-185 {
  margin-left: 185px;
}

.ml-190 {
  margin-left: 190px;
}

.ml-195 {
  margin-left: 195px;
}

.ml-200 {
  margin-left: 200px;
}

/*-- Margin Right --*/
.mr-5 {
  margin-right: 5px;
}

.mr-10 {
  margin-right: 10px;
}

.mr-15 {
  margin-right: 15px;
}

.mr-20 {
  margin-right: 20px;
}

.mr-25 {
  margin-right: 25px;
}

.mr-30 {
  margin-right: 30px;
}

.mr-35 {
  margin-right: 35px;
}

.mr-40 {
  margin-right: 40px;
}

.mr-45 {
  margin-right: 45px;
}

.mr-50 {
  margin-right: 50px;
}

.mr-55 {
  margin-right: 55px;
}

.mr-60 {
  margin-right: 60px;
}

.mr-65 {
  margin-right: 65px;
}

.mr-70 {
  margin-right: 70px;
}

.mr-75 {
  margin-right: 75px;
}

.mr-80 {
  margin-right: 80px;
}

.mr-85 {
  margin-right: 85px;
}

.mr-90 {
  margin-right: 90px;
}

.mr-95 {
  margin-right: 95px;
}

.mr-100 {
  margin-right: 100px;
}

.mr-105 {
  margin-right: 105px;
}

.mr-110 {
  margin-right: 110px;
}

.mr-115 {
  margin-right: 115px;
}

.mr-120 {
  margin-right: 120px;
}

.mr-125 {
  margin-right: 125px;
}

.mr-130 {
  margin-right: 130px;
}

.mr-135 {
  margin-right: 135px;
}

.mr-140 {
  margin-right: 140px;
}

.mr-145 {
  margin-right: 145px;
}

.mr-150 {
  margin-right: 150px;
}

.mr-155 {
  margin-right: 155px;
}

.mr-160 {
  margin-right: 160px;
}

.mr-165 {
  margin-right: 165px;
}

.mr-170 {
  margin-right: 170px;
}

.mr-175 {
  margin-right: 175px;
}

.mr-180 {
  margin-right: 180px;
}

.mr-185 {
  margin-right: 185px;
}

.mr-190 {
  margin-right: 190px;
}

.mr-195 {
  margin-right: 195px;
}

.mr-200 {
  margin-right: 200px;
}

/*-- Padding Top --*/
.pt-5 {
  padding-top: 5px;
}

.pt-10 {
  padding-top: 10px;
}

.pt-15 {
  padding-top: 15px;
}

.pt-20 {
  padding-top: 20px;
}

.pt-25 {
  padding-top: 25px;
}

.pt-30 {
  padding-top: 30px;
}

.pt-35 {
  padding-top: 35px;
}

.pt-40 {
  padding-top: 40px;
}

.pt-45 {
  padding-top: 45px;
}

.pt-50 {
  padding-top: 50px;
}

.pt-55 {
  padding-top: 55px;
}

.pt-60 {
  padding-top: 60px;
}

.pt-65 {
  padding-top: 65px;
}

.pt-70 {
  padding-top: 70px;
}

.pt-75 {
  padding-top: 75px;
}

.pt-80 {
  padding-top: 80px;
}

.pt-85 {
  padding-top: 85px;
}

.pt-90 {
  padding-top: 90px;
}

.pt-95 {
  padding-top: 95px;
}

.pt-100 {
  padding-top: 100px;
}

.pt-105 {
  padding-top: 105px;
}

.pt-110 {
  padding-top: 110px;
}

.pt-115 {
  padding-top: 115px;
}

.pt-120 {
  padding-top: 120px;
}

.pt-125 {
  padding-top: 125px;
}

.pt-130 {
  padding-top: 130px;
}

.pt-135 {
  padding-top: 135px;
}

.pt-140 {
  padding-top: 140px;
}

.pt-145 {
  padding-top: 145px;
}

.pt-150 {
  padding-top: 150px;
}

.pt-155 {
  padding-top: 155px;
}

.pt-160 {
  padding-top: 160px;
}

.pt-165 {
  padding-top: 165px;
}

.pt-170 {
  padding-top: 170px;
}

.pt-175 {
  padding-top: 175px;
}

.pt-180 {
  padding-top: 180px;
}

.pt-185 {
  padding-top: 185px;
}

.pt-190 {
  padding-top: 190px;
}

.pt-195 {
  padding-top: 195px;
}

.pt-200 {
  padding-top: 200px;
}

.pt-260 {
  padding-top: 260px;
}

/*-- Padding Bottom --*/
.pb-5 {
  padding-bottom: 5px;
}

.pb-10 {
  padding-bottom: 10px;
}

.pb-15 {
  padding-bottom: 15px;
}

.pb-20 {
  padding-bottom: 20px;
}

.pb-25 {
  padding-bottom: 25px;
}

.pb-30 {
  padding-bottom: 30px;
}

.pb-35 {
  padding-bottom: 35px;
}

.pb-40 {
  padding-bottom: 40px;
}

.pb-45 {
  padding-bottom: 45px;
}

.pb-50 {
  padding-bottom: 50px;
}

.pb-55 {
  padding-bottom: 55px;
}

.pb-60 {
  padding-bottom: 60px;
}

.pb-65 {
  padding-bottom: 65px;
}

.pb-70 {
  padding-bottom: 70px;
}

.pb-75 {
  padding-bottom: 75px;
}

.pb-80 {
  padding-bottom: 80px;
}

.pb-85 {
  padding-bottom: 85px;
}

.pb-90 {
  padding-bottom: 90px;
}

.pb-95 {
  padding-bottom: 95px;
}

.pb-100 {
  padding-bottom: 100px;
}

.pb-105 {
  padding-bottom: 105px;
}

.pb-110 {
  padding-bottom: 110px;
}

.pb-115 {
  padding-bottom: 115px;
}

.pb-120 {
  padding-bottom: 120px;
}

.pb-125 {
  padding-bottom: 125px;
}

.pb-130 {
  padding-bottom: 130px;
}

.pb-135 {
  padding-bottom: 135px;
}

.pb-140 {
  padding-bottom: 140px;
}

.pb-145 {
  padding-bottom: 145px;
}

.pb-150 {
  padding-bottom: 150px;
}

.pb-155 {
  padding-bottom: 155px;
}

.pb-160 {
  padding-bottom: 160px;
}

.pb-165 {
  padding-bottom: 165px;
}

.pb-170 {
  padding-bottom: 170px;
}

.pb-175 {
  padding-bottom: 175px;
}

.pb-180 {
  padding-bottom: 180px;
}

.pb-185 {
  padding-bottom: 185px;
}

.pb-190 {
  padding-bottom: 190px;
}

.pb-195 {
  padding-bottom: 195px;
}

.pb-200 {
  padding-bottom: 200px;
}

/*-- Padding Left --*/
.pl-5 {
  padding-left: 5px;
}

.pl-10 {
  padding-left: 10px;
}

.pl-15 {
  padding-left: 15px;
}

.pl-20 {
  padding-left: 20px;
}

.pl-25 {
  padding-left: 25px;
}

.pl-30 {
  padding-left: 30px;
}

.pl-35 {
  padding-left: 35px;
}

.pl-40 {
  padding-left: 40px;
}

.pl-45 {
  padding-left: 45px;
}

.pl-50 {
  padding-left: 50px;
}

.pl-55 {
  padding-left: 55px;
}

.pl-60 {
  padding-left: 60px;
}

.pl-65 {
  padding-left: 65px;
}

.pl-70 {
  padding-left: 70px;
}

.pl-75 {
  padding-left: 75px;
}

.pl-80 {
  padding-left: 80px;
}

.pl-85 {
  padding-left: 85px;
}

.pl-90 {
  padding-left: 90px;
}

.pl-95 {
  padding-left: 95px;
}

.pl-100 {
  padding-left: 100px;
}

.pl-105 {
  padding-left: 105px;
}

.pl-110 {
  padding-left: 110px;
}

.pl-115 {
  padding-left: 115px;
}

.pl-120 {
  padding-left: 120px;
}

.pl-125 {
  padding-left: 125px;
}

.pl-130 {
  padding-left: 130px;
}

.pl-135 {
  padding-left: 135px;
}

.pl-140 {
  padding-left: 140px;
}

.pl-145 {
  padding-left: 145px;
}

.pl-150 {
  padding-left: 150px;
}

.pl-155 {
  padding-left: 155px;
}

.pl-160 {
  padding-left: 160px;
}

.pl-165 {
  padding-left: 165px;
}

.pl-170 {
  padding-left: 170px;
}

.pl-175 {
  padding-left: 175px;
}

.pl-180 {
  padding-left: 180px;
}

.pl-185 {
  padding-left: 185px;
}

.pl-190 {
  padding-left: 190px;
}

.pl-195 {
  padding-left: 195px;
}

.pl-200 {
  padding-left: 200px;
}

/*-- Padding Right --*/
.pr-5 {
  padding-right: 5px;
}

.pr-10 {
  padding-right: 10px;
}

.pr-15 {
  padding-right: 15px;
}

.pr-20 {
  padding-right: 20px;
}

.pr-25 {
  padding-right: 25px;
}

.pr-30 {
  padding-right: 30px;
}

.pr-35 {
  padding-right: 35px;
}

.pr-40 {
  padding-right: 40px;
}

.pr-45 {
  padding-right: 45px;
}

.pr-50 {
  padding-right: 50px;
}

.pr-55 {
  padding-right: 55px;
}

.pr-60 {
  padding-right: 60px;
}

.pr-65 {
  padding-right: 65px;
}

.pr-70 {
  padding-right: 70px;
}

.pr-75 {
  padding-right: 75px;
}

.pr-80 {
  padding-right: 80px;
}

.pr-85 {
  padding-right: 85px;
}

.pr-90 {
  padding-right: 90px;
}

.pr-95 {
  padding-right: 95px;
}

.pr-100 {
  padding-right: 100px;
}

.pr-105 {
  padding-right: 105px;
}

.pr-110 {
  padding-right: 110px;
}

.pr-115 {
  padding-right: 115px;
}

.pr-120 {
  padding-right: 120px;
}

.pr-125 {
  padding-right: 125px;
}

.pr-130 {
  padding-right: 130px;
}

.pr-135 {
  padding-right: 135px;
}

.pr-140 {
  padding-right: 140px;
}

.pr-145 {
  padding-right: 145px;
}

.pr-150 {
  padding-right: 150px;
}

.pr-155 {
  padding-right: 155px;
}

.pr-160 {
  padding-right: 160px;
}

.pr-165 {
  padding-right: 165px;
}

.pr-170 {
  padding-right: 170px;
}

.pr-175 {
  padding-right: 175px;
}

.pr-180 {
  padding-right: 180px;
}

.pr-185 {
  padding-right: 185px;
}

.pr-190 {
  padding-right: 190px;
}

.pr-195 {
  padding-right: 195px;
}

.pr-200 {
  padding-right: 200px;
}

/*-- Some Animated CSS -- */
/* bounce-animate */
.bounce-animate {
  -webkit-animation-name: float-bob;
  animation-name: float-bob;
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  /* animation-timing-function: linear; */
  -moz-animation-name: float-bob;
  -moz-animation-duration: 2s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: float-bob;
  -ms-animation-duration: 2s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: float-bob;
  -o-animation-duration: 2s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear;
}

@-webkit-keyframes float-bob {
  0% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  50% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
  }

  100% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

/* heartbeat */
.heartbeat {
  -webkit-animation: heartbeat 1s infinite alternate;
  animation: heartbeat 1s infinite alternate;
}

@-webkit-keyframes heartbeat {
  to {
    -webkit-transform: scale(1.03);
    transform: scale(1.03);
  }
}

/* rotateme */
.rotateme {
  -webkit-animation-name: rotateme;
  animation-name: rotateme;
  -webkit-animation-duration: 30s;
  animation-duration: 30s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
}

@keyframes rotateme {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-webkit-keyframes rotateme {
  from {
    -webkit-transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(360deg);
  }
}

/* 20. preloader */
.preloader {
  background-color: #f7f7f7;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999999;
  -webkit-transition: 0.6s;
  transition: 0.6s;
  margin: 0 auto;
}

.preloader .preloader-circle {
  width: 100px;
  height: 100px;
  position: relative;
  border-style: solid;
  border-width: 1px;
  border-top-color: #c9252b;
  border-bottom-color: transparent;
  border-left-color: transparent;
  border-right-color: transparent;
  z-index: 10;
  border-radius: 50%;
  -webkit-box-shadow: 0 1px 5px 0 rgba(35, 181, 185, 0.15);
  box-shadow: 0 1px 5px 0 rgba(35, 181, 185, 0.15);
  background-color: #fff;
  -webkit-animation: zoom 2000ms infinite ease;
  animation: zoom 2000ms infinite ease;
  -webkit-transition: 0.6s;
  transition: 0.6s;
}

.preloader .preloader-circle2 {
  border-top-color: #0078ff;
}

.preloader .preloader-img {
  position: absolute;
  top: 50%;
  z-index: 200;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
  display: inline-block;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  padding-top: 6px;
  -webkit-transition: 0.6s;
  transition: 0.6s;
}

.preloader .preloader-img img {
  max-width: 55px;
}

.preloader .pere-text strong {
  font-weight: 800;
  color: #dca73a;
  text-transform: uppercase;
}

@-webkit-keyframes zoom {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: 0.6s;
    transition: 0.6s;
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transition: 0.6s;
    transition: 0.6s;
  }
}

@keyframes zoom {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: 0.6s;
    transition: 0.6s;
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transition: 0.6s;
    transition: 0.6s;
  }
}

/*-- Section Padding -- */
.section-padding2 {
  padding-top: 200px;
  padding-bottom: 200px;
}

@media only screen and (min-width: 1200px) and (max-width: 1600px) {
  .section-padding2 {
    padding-top: 200px;
    padding-bottom: 200px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-padding2 {
    padding-top: 200px;
    padding-bottom: 200px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-padding2 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .section-padding2 {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}

@media (max-width: 575px) {
  .section-padding2 {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}

.pb-bottom {
  padding-bottom: 100px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .pb-bottom {
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pb-bottom {
    padding-bottom: 50px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .pb-bottom {
    padding-bottom: 10px;
  }
}

@media (max-width: 575px) {
  .pb-bottom {
    padding-bottom: 10px;
  }
}

.pb-top {
  padding-top: 100px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pb-top {
    padding-top: 70px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .pb-top {
    padding-top: 70px;
  }
}

@media (max-width: 575px) {
  .pb-top {
    padding-top: 70px;
  }
}

.testimonial-padding {
  padding-top: 20px;
  padding-bottom: 20px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .testimonial-padding {
    padding-top: 15px;
    padding-bottom: 15px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-padding {
    padding-top: 10px;
    padding-bottom: 10px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .testimonial-padding {
    padding-top: 5px;
    padding-bottom: 5px;
  }
}

@media (max-width: 575px) {
  .testimonial-padding {
    padding-top: 60px;
    padding-bottom: 40px;
  }
}

.w-padding2 {
  padding-top: 130px;
  padding-bottom: 125px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .w-padding2 {
    padding-top: 130px;
    padding-bottom: 125px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .w-padding2 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .w-padding2 {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}

@media (max-width: 575px) {
  .w-padding2 {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}

.section-padding10 {
  padding-top: 55px;
  padding-bottom: 45px;
}

@media only screen and (min-width: 1200px) and (max-width: 1600px) {
  .section-padding10 {
    padding-top: 55px;
    padding-bottom: 45px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-padding10 {
    padding-top: 45px;
    padding-bottom: 35px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-padding10 {
    padding-top: 35px;
    padding-bottom: 25px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .section-padding10 {
    padding-top: 25px;
    padding-bottom: 15px;
  }
}

@media (max-width: 575px) {
  .section-padding10 {
    padding-top: 15px;
    padding-bottom: 5px;
  }
}

.section-padding20 {
  padding-top: 105px;
  padding-bottom: 95px;
}

@media only screen and (min-width: 1200px) and (max-width: 1600px) {
  .section-padding20 {
    padding-top: 105px;
    padding-bottom: 95px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-padding20 {
    padding-top: 75px;
    padding-bottom: 60px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-padding20 {
    padding-top: 55px;
    padding-bottom: 40px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .section-padding20 {
    padding-top: 35px;
    padding-bottom: 30px;
  }
}

@media (max-width: 575px) {
  .section-padding20 {
    padding-top: 25px;
    padding-bottom: 20px;
  }
}

.section-padding30 {
  padding-top: 195px;
  padding-bottom: 170px;
}

@media only screen and (min-width: 1200px) and (max-width: 1600px) {
  .section-padding30 {
    padding-top: 195px;
    padding-bottom: 170px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-padding30 {
    padding-top: 150px;
    padding-bottom: 110px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-padding30 {
    padding-top: 100px;
    padding-bottom: 70px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .section-padding30 {
    padding-top: 65px;
    padding-bottom: 30px;
  }
}

@media (max-width: 575px) {
  .section-padding30 {
    padding-top: 65px;
    padding-bottom: 30px;
  }
}

.padding-bottom {
  padding-bottom: 120px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .padding-bottom {
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .padding-bottom {
    padding-bottom: 70px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .padding-bottom {
    padding-bottom: 70px;
  }
}

@media (max-width: 575px) {
  .padding-bottom {
    padding-bottom: 70px;
  }
}

.services-padding {
  padding-top: 145px;
  padding-bottom: 170px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .services-padding {
    padding-top: 145px;
    padding-bottom: 170px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .services-padding {
    padding-top: 100px;
    padding-bottom: 70px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .services-padding {
    padding-top: 65px;
    padding-bottom: 70px;
  }
}

@media (max-width: 575px) {
  .services-padding {
    padding-top: 65px;
    padding-bottom: 70px;
  }
}

.section-paddingt30 {
  padding-top: 195px;
  padding-bottom: 90px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-paddingt30 {
    padding-top: 150px;
    padding-bottom: 90px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-paddingt30 {
    padding-top: 100px;
    padding-bottom: 40px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .section-paddingt30 {
    padding-top: 65px;
    padding-bottom: 10px;
  }
}

@media (max-width: 575px) {
  .section-paddingt30 {
    padding-top: 65px;
    padding-bottom: 10px;
  }
}

.section-padding3 {
  padding-top: 150px;
  padding-bottom: 0;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-padding3 {
    padding-top: 150px;
    padding-bottom: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-padding3 {
    padding-top: 60px;
    padding-bottom: 0;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .section-padding3 {
    padding-top: 60px;
    padding-bottom: 0;
  }
}

@media (max-width: 575px) {
  .section-padding3 {
    padding-top: 60px;
    padding-bottom: 0;
  }
}

.footer-padding {
  padding-top: 47px;
  padding-bottom: 50px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-padding {
    padding-top: 105px;
    padding-bottom: 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-padding {
    padding-top: 30px;
    padding-bottom: 50px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .footer-padding {
    padding-top: 15px;
    padding-bottom: 0px;
  }
}

@media (max-width: 575px) {
  .footer-padding {
    padding-top: 15px;
    padding-bottom: 0px;
  }
}

@media (max-width: 575px) {
  .section-tittle {
    margin-bottom: 50px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .section-tittle {
    margin-bottom: 50px;
  }
}

.section-tittle span {
  font-size: 24px;
  display: block;
  color: #159bfe;
  font-weight: 600;
  text-transform: capitalize;
  margin-bottom: 17px;
  font-weight: bold;
}

.section-tittle h2 {
  font-size: 22px;
  display: block;
  font-weight: 600;
  text-transform: capitalize;
  line-height: 1.3;
  margin-top: -7px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-tittle h2 {
    font-size: 20px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .section-tittle h2 {
    font-size: 21px;
  }
}

@media (max-width: 575px) {
  .section-tittle h2 {
    font-size: 20px;
    line-height: 1.6;
  }
}

.section-tittle p {
  color: #717b9b;
}

.section-tittle2 h2 {
  color: #fff;
}

.section-tittle2 p {
  color: #fff;
}

.section-bg {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}

/*-------------   Color Variable  --------------*/
.white-bg {
  background: #ffffff;
}

.gray-bg {
  background: #f5f5f5;
}

/*-------------Color include--------------*/
/*-- Background color---*/
.gray-bg {
  background: #f7f7fd;
}

.white-bg {
  background: #ffffff;
}

.black-bg {
  background: #16161a;
}

.theme-bg {
  background: #c9252b;
}

.brand-bg {
  background: #f1f4fa;
}

.testimonial-bg {
  background: #f9fafc;
}

/*--- color------*/
.white-color {
  color: #ffffff;
}

.black-color {
  color: #16161a;
}

.theme-color {
  color: #c9252b;
}

.header-area .header-bottom img {
  width: -webkit-fill-available;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-area .header-bottom {
    padding: 20px 0px;
  }

  .header-area .header-bottom img {
    width: 20%;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .header-area .header-bottom {
    padding: 15px 0px;
  }

  .header-area .header-bottom img {
    width: 32%;
  }
}

@media (max-width: 575px) {
  .header-area .header-bottom {
    padding: 15px 0px;
  }

  .header-area .header-bottom img {
    width: 32%;
  }
}

.header-area {
  background: #ffffff;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-area {
    -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .header-area {
    -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
  }
}

@media (max-width: 575px) {
  .header-area {
    -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
  }
}

.header-area .header-top {
  border-bottom: 1px solid #2d2d2d;
  padding: 9px 0px;
}

.header-area .header-top .header-info-left ul li {
  color: #7b8693;
  display: inline-block;
  margin-right: 70px;
  font-size: 14px;
}

.header-area .header-top .header-info-left ul li:last-child {
  margin-right: 0px;
}

.header-area .header-top .header-info-left ul li i {
  margin-right: 8px;
}

.header-area .header-top .header-info-right .header-social li {
  display: inline-block;
}

.header-area .header-top .header-info-right .header-social li a {
  color: #7b8693;
  font-size: 14px;
  padding-left: 25px;
}

.header-area .header-top .header-info-right .header-social li a:hover {
  color: #c9252b;
}

.header-area .header-top .header-login-btn .btn-arrow {
  color: #c9252b;
  position: relative;
  right: 5px;
  -webkit-animation: arrow 1s infinite alternate;
  animation: arrow 1s infinite alternate;
}

@keyframes arrow {
  100% {
    right: 0;
    color: #fff;
  }
}

.main-header {
  position: relative;
  z-index: 3;
}

@media only screen and (min-width: 1200px) and (max-width: 1600px) {
  .main-header .main-menu {
    margin-right: 30px;
  }
}

.main-header .main-menu ul li {
  display: inline-block;
  position: relative;
  z-index: 1;
}

.main-header .main-menu ul li a {
  color: #149bfd;
  font-weight: bold;
  padding: 39px 19px;
  display: block;
  font-size: 16px;
  -webkit-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
  text-transform: uppercase;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .main-header .main-menu ul li a {
    padding: 39px 14px;
  }
}

.main-header .main-menu ul li:hover>a {
  color: #c9252b;
}

.main-header .main-menu ul ul.submenu {
  position: absolute;
  width: 20vw;
  background: rgba(229, 236, 248, 0.8);
  left: 0;
  top: 50%;
  visibility: hidden;
  opacity: 0;
  -webkit-box-shadow: 0 0 10px 3px rgba(0, 0, 0, 0.05);
  box-shadow: 0 0 10px 3px rgba(0, 0, 0, 0.05);
  padding: 17px 0;
  border-top: 2px solid #c9252b;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-transition: all 0.6s ease-out 0s;
  transition: all 0.6s ease-out 0s;
}

.main-header .main-menu ul ul.submenu>li {
  display: block;
  margin-left: 7px;
}

.main-header .main-menu ul ul.submenu>li:hover .submenu-design-website {
  visibility: visible;
  left: 100%;
  opacity: 1;
}

.main-header .main-menu ul ul.submenu>li>a {
  padding: 6px 10px !important;
  font-size: 16px;
  color: #149bfd;
}

.main-header .main-menu ul ul.submenu>li>a:hover {
  color: #c9252b;
  background: none;
  padding-left: 13px !important;
}

.main-header .main-menu ul ul.submenu ul.submenu-design-website {
  position: absolute;
  visibility: hidden;
  width: 50%;
  top: 0;
  left: 20%;
  opacity: 0;
  -webkit-box-shadow: 0 0 10px 3px rgba(0, 0, 0, 0.05);
  box-shadow: 0 0 10px 3px rgba(0, 0, 0, 0.05);
  background: rgba(0, 12, 32, 0.8);
  border-top: 2px solid #c9252b;
  padding: 5px 0;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-transition: all 0.6s ease-out 0s;
  transition: all 0.6s ease-out 0s;
}

.main-header .main-menu ul ul.submenu ul.submenu-design-website>li {
  display: block;
  margin-left: 7px;
}

.main-header .main-menu ul ul.submenu ul.submenu-design-website>li>a {
  padding: 6px 10px !important;
  font-size: 16px;
  color: #fff;
}

.main-header .main-menu ul ul.submenu ul.submenu-design-website>li>a:hover {
  color: #c9252b;
  background: none;
  padding-left: 13px !important;
}

.main-header ul>li:hover>ul.submenu {
  visibility: visible;
  opacity: 1;
  top: 100%;
}

.header-transparent {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 9;
}

.header-area .header-top .header-info-right .header-social a i {
  -webkit-transition: all 0.4s ease-out 0s;
  transition: all 0.4s ease-out 0s;
  transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
  -moz-transform: rotateY(0deg);
  -ms-transform: rotateY(0deg);
  -o-transform: rotateY(0deg);
}

.header-area .header-top .header-info-right .header-social a:hover i {
  transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
}

.header-sticky.sticky-bar {
  background: #fff;
}

.header-sticky.sticky-bar.sticky .main-menu ul li a {
  padding: 20px 20px !important;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-sticky.sticky-bar.sticky {
    padding: 15px 0px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .header-sticky.sticky-bar.sticky {
    padding: 15px 0px;
  }
}

@media (max-width: 575px) {
  .header-sticky.sticky-bar.sticky {
    padding: 15px 0px;
  }
}

.mobile_menu {
  position: absolute;
  right: 0px;
  width: 100%;
  z-index: 99;
}

.mobile_menu .slicknav_menu {
  background: transparent;
  margin-top: 0px !important;
}

.mobile_menu .slicknav_menu .slicknav_btn {
  top: -34px;
}

.mobile_menu .slicknav_menu .slicknav_btn .slicknav_icon-bar {
  background-color: #c9252b !important;
}

.mobile_menu .slicknav_menu .slicknav_nav {
  margin-top: 9px !important;
  -webkit-box-shadow: 0 0 10px 3px rgba(141, 140, 140, 0.5);
  box-shadow: 0 0 10px 3px rgba(141, 140, 140, 0.5);
}

.mobile_menu .slicknav_menu .slicknav_nav a:hover {
  background: transparent;
  color: #c9252b;
}

.mobile_menu .slicknav_menu .slicknav_nav a {
  font-size: 15px;
  padding: 7px 10px;
}

.mobile_menu .slicknav_menu .slicknav_nav .slicknav_item a {
  padding: 0 !important;
}

.slider-height .banner-content-icon-hand {
  position: absolute;
  z-index: 100;
  color: #fff;
  font-size: 2.5em;
  left: 5%;
  bottom: -12%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  -webkit-animation: iconHand 1s infinite alternate ease-in-out,
    iconHandColor 1s infinite alternate ease-in-out;
  animation: iconHand 1s infinite alternate ease-in-out,
    iconHandColor 1s infinite alternate ease-in-out;
}

@media (max-width: 575px) {
  .slider-height .banner-content-icon-hand {
    display: none;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-height .banner-content-icon-hand {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height .banner-content-icon-hand {
    display: none;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-height .banner-content-icon-hand {
    left: 3%;
  }
}

@-webkit-keyframes iconHand {
  100% {
    left: 10%;
    font-size: 2.8em;
  }
}

@keyframes iconHand {
  100% {
    left: 10%;
    font-size: 2.8em;
  }
}

@-webkit-keyframes iconHandColor {
  50% {
    color: #ffffff;
  }

  100% {
    color: #c9252b;
  }
}

@keyframes iconHandColor {
  50% {
    color: #ffffff;
  }

  100% {
    color: #c9252b;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-height .banner-video {
    height: 565px;
  }

  .slider-height .banner-content-caption h1 {
    font-size: 33px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height .banner-video {
    height: 450px;
  }

  .slider-height .banner-content-caption h1 {
    font-size: 32px;
  }

  .slider-height .banner-content-btn {
    display: none;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-height .banner-video {
    height: 360px;
  }

  .slider-height .banner-content-caption h1 {
    font-size: 31px;
  }

  .slider-height .banner-content-btn {
    display: none;
  }
}

@media (max-width: 575px) {
  .slider-height .banner-video {
    height: 250px;
  }

  .slider-height .banner-content-caption h1 {
    font-size: 30px;
  }

  .slider-height .banner-content-btn {
    display: none;
  }
}

.slider-height2 {
  background-image: url(../img/hero/hero2.jpg);
  min-height: 460px;
  background-repeat: no-repeat;
  background-size: cover;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height2 {
    min-height: 350px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-height2 {
    min-height: 260px;
  }
}

@media (max-width: 575px) {
  .slider-height2 {
    min-height: 260px;
  }
}

.banner {
  width: 100%;
  position: relative;
}

.banner-video {
  width: 100%;
  height: 950px;
  -o-object-fit: cover;
  object-fit: cover;
  margin-bottom: 50px;
}

.banner-content {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

.banner-content-caption h1 {
  color: #ffffff;
  font-size: 60px;
}

.banner-content-caption span {
  color: #c9252b;
}

.about-low-area .about-caption {
  text-align: justify;
}

.about-low-area .about-caption p {
  font-size: 16px;
  color: #64676c;
  line-height: 1.6;
  margin-bottom: 35px;
  padding-right: 50px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about-low-area .about-caption p {
    padding-right: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-low-area .about-caption p {
    padding-right: 0px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .about-low-area .about-caption p {
    padding-right: 0px;
  }
}

@media (max-width: 575px) {
  .about-low-area .about-caption p {
    padding-right: 0px;
  }
}

.about-low-area .about-img .about-font-img {
  position: absolute;
  z-index: 1;
  right: 0px;
  top: 0px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-low-area .about-img .about-font-img {
    position: unset;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .about-low-area .about-img .about-font-img {
    position: unset;
  }
}

@media (max-width: 575px) {
  .about-low-area .about-img .about-font-img {
    position: unset;
  }
}

@media (max-width: 575px) {
  .about-low-area .about-img .about-font-img img {
    width: 100%;
  }
}

.about-low-area .about-img .about-font-img img {
  width: 36em;
  height: 23em;
  -o-object-fit: cover;
  object-fit: cover;
}

@media (max-width: 575px) {
  .about-low-area .about-img .about-font-img img {
    width: 22.5em;
    height: 14em;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-low-area .about-img .about-font-img img {
    width: 43em;
    height: 30em;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about-low-area .about-img .about-font-img img {
    width: 30em;
    height: 20em;
  }
}


@media (max-width: 575px) {
  .about-caption {
    margin-bottom: 35px;
  }
}

@media (max-width: 575px) {
  .bg-height.pb-160 {
    padding-bottom: 100px;
  }
}

.hero-cap h2 {
  color: #149bfd;
  font-size: 50px;
  font-weight: 600;
  text-transform: capitalize;
  line-height: 1;
}

@media (max-width: 575px) {
  .hero-cap h2 {
    font-size: 18px;
  }
}

.hero-cap .breadcrumb {
  background: none;
  font-size: 20px;
}

@media (max-width: 575px) {
  .hero-cap .breadcrumb {
    font-size: 14px;
  }
}


.our-info-area {
  background: #f9f9f9;
}

.our-info-area .single-info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.our-info-area .single-info .info-icon span {
  color: #f15f22;
  font-size: 44px;
  margin-bottom: 0;
  display: block;
}

.our-info-area .single-info .info-caption {
  padding-left: 20px;
}

.our-info-area .single-info .info-caption p {
  color: #677294;
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 0;
}

.our-info-area .single-info .info-caption span {
  color: #2c234d;
  font-size: 20px;
  margin-bottom: 0px;
  display: block;
  font-weight: 600;
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .our-info-area .single-info .info-caption span {
    font-size: 16px;
  }
}

.categories-area .col-categories {
  display: flexbox;
  padding-left: 15px;
  padding-right: 15px;
}

@media (max-width: 576px) {
  .categories-area .col-categories {
    width: 100%;
    margin-top: 30px;
  }

  .social_icon {
    font-size: 20px;
    padding-left: 13px;
  }
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
  .categories-area .col-categories {
    width: 50%;
    margin-top: 30px;
  }

  .social_icon {
    font-size: 25px;
    padding-left: 13px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .categories-area .col-categories {
    width: 33.333333%;
    margin-top: 30px;
  }

  .social_icon {
    font-size: 30px;
    padding-left: 13px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .categories-area .col-categories {
    width: 25%;
    margin-top: 30px;
  }

  .social_icon {
    font-size: 40px;
    padding-left: 13px;
  }
}

@media only screen and (min-width: 1201px) {
  .categories-area .col-categories {
    width: 20%;
  }

  .social_icon {
    font-size: 50px;
    padding-left: 13px;
  }
}

.categories-area .single-cat {
  border: 1px solid #e1ebf7;
  background: linear-gradient(to right, #ebebeb, #a9a8a7);
  border-radius: 6px;
  padding: 20px 5px;
  -webkit-transition: all 0.4s ease-out 0s;
  transition: all 0.4s ease-out 0s;
  position: relative;
  z-index: 1;
}

@media (max-width: 575px) {
  .categories-area .single-cat {
    padding: 10px 5px;
  }
}

.categories-area .single-cat::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 0;
  background: linear-gradient(to right, #a9a8a7, #ebebeb);
  -webkit-transition: 0.6s;
  transition: 0.6s;
  bottom: 0;
  left: 0;
  z-index: -1;
  border-radius: 6px;
  opacity: 0.9;
}

.categories-area .single-cat .cat-icon span {
  color: #176fa2;
  font-size: 50px;
  margin-bottom: 30px;
  display: block;
  -webkit-transition: all 1s ease-out 0s;
  transition: all 1s ease-out 0s;
  transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
  -moz-transform: rotateY(0deg);
  -ms-transform: rotateY(0deg);
  -o-transform: rotateY(0deg);
}

.categories-area .single-cat .cat-cap h5>p {
  font-size: 18px;
  color: white;
  font-weight: 700;
  margin-bottom: 21px;
  display: block;
  -webkit-transition: all 0.2s ease-out 0s;
  transition: all 0.2s ease-out 0s;
  font-family: "Roboto Slab", sans-serif;
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .categories-area .single-cat .cat-cap h5>p {
    font-size: 26px;
  }
}

@media (max-width: 575px) {
  .categories-area .single-cat .cat-cap h5>p {
    font-size: 26px;
  }
}

.categories-area .single-cat .cat-cap p {
  margin-bottom: 36px;
  color: #57667e;
  font-size: 16px;
  -webkit-transition: all 0.2s ease-out 0s;
  transition: all 0.2s ease-out 0s;
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .categories-area .single-cat .cat-cap p {
    font-size: 15px;
  }
}

.categories-area .single-cat .cat-cap a {
  color: #1c165c;
  font-size: 16px;
  font-weight: 600;
  -webkit-transition: all 0.2s ease-out 0s;
  transition: all 0.2s ease-out 0s;
}

.categories-area .single-cat:hover {
  border: 1px solid transparent;
}

.categories-area .single-cat:hover::before {
  height: 100%;
}

.categories-area .single-cat:hover .cat-icon span {
  color: #fff;
  transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
}

.categories-area .single-cat:hover .cat-cap h5 {
  color: #fff;
}

.categories-area .single-cat:hover .cat-cap p {
  color: #fff;
}

.categories-area .single-cat:hover .cat-cap a {
  color: #fff;
}

.contact-form-area .contact-form-wrapper {
  background: #f5f5f5;
  padding: 62px 29px;
  width: 540px;
  border-radius: 8px;
}

@media (max-width: 575px) {
  .contact-form-area .contact-form-wrapper {
    padding: 20px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .contact-form-area .contact-form-wrapper {
    padding: 30px;
  }
}

@media only screen and (min-width: 360px) and (max-width: 420px) {
  .contact-form-area .contact-form-wrapper {
    width: 316px;
    margin-left: -24px;
    margin-top: 32px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 820px) {
  .contact-form-area .contact-form-wrapper {
    margin-left: 60px;
    margin-top: 85px;
  }
}

@media only screen and (min-width: 998px) and (max-width: 1199px) {
  .contact-form-area .contact-form-wrapper {
    margin-left: 0px;
    margin-top: 0px;
    width: 400px;
  }

  .contact-form-area .contact-form-wrapper form.contact-form input {
    font-size: 11px;
  }
}



.contact-form-area .contact-form-wrapper form.contact-form input {
  height: 60px;
  width: 100%;
  color: #777777;
  font-size: 13px;
  font-weight: 400;
  padding: 9px 33px 9px 32px;
  border-radius: 5px;
  border: 1px solid #efebeb;
  background: #fff;
  margin-bottom: 20px;
}



@media (max-width: 575px) {
  .contact-form-area .contact-form-wrapper form.contact-form input {
    margin-bottom: 20px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .contact-form-area .contact-form-wrapper form.contact-form input {
    padding: 9px 33px 9px 25px;
    margin-bottom: 20px;
  }
}

@media only screen and (min-width: 998px) and (max-width: 1199px) {
  .contact-form-area .contact-form-wrapper form.contact-form input {
    font-size: 11px;
  }
}

.contact-form-area .contact-form-wrapper form.contact-form input::-webkit-input-placeholder {
  color: #616875;
}

.contact-form-area .contact-form-wrapper form.contact-form input:-ms-input-placeholder {
  color: #616875;
}

.contact-form-area .contact-form-wrapper form.contact-form input::-ms-input-placeholder {
  color: #616875;
}

.contact-form-area .contact-form-wrapper form.contact-form input::placeholder {
  color: #616875;
}

@media (max-width: 575px) {
  .contact-form-area .contact-form-wrapper form.contact-form input::-webkit-input-placeholder {
    font-size: 14px;
  }

  .contact-form-area .contact-form-wrapper form.contact-form input:-ms-input-placeholder {
    font-size: 14px;
  }

  .contact-form-area .contact-form-wrapper form.contact-form input::-ms-input-placeholder {
    font-size: 14px;
  }

  .contact-form-area .contact-form-wrapper form.contact-form input::placeholder {
    font-size: 14px;
  }
}

.contact-form-area .contact-form-wrapper form.contact-form .nice-select {
  width: 100%;
  height: 60px;
  background: #fff;
  padding: 11px 19px 11px 31px;
  line-height: 42px;
  border-radius: 5px;
  border: 1px solid #efebeb;
  background: #fff;
  color: #a6abb0;
  font-size: 17px;
  margin-bottom: 20px;
}

@media (max-width: 575px) {
  .contact-form-area .contact-form-wrapper form.contact-form .nice-select {
    margin-bottom: 20px;
    padding-left: 25px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .contact-form-area .contact-form-wrapper form.contact-form .nice-select {
    margin-bottom: 20px;
    padding-left: 25px;
  }
}

.contact-form-area .contact-form-wrapper form.contact-form .nice-select .list {
  width: 100%;
}

.contact-form-area .contact-form-wrapper form.contact-form .nice-select.open .list {
  width: 100%;
  border-radius: 0;
  border: 0;
}

.contact-form-area .contact-form-wrapper form.contact-form .nice-select::after {
  border-bottom: 1px solid #a9b6cd;
  border-right: 1px solid #a9b6cd;
  height: 12px;
  width: 12px;
  margin-top: -7px;
  right: 29px;
}

.contact-form-area .contact-form-wrapper form.contact-form .radio-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.contact-form-area .contact-form-wrapper form.contact-form .radio-wrapper>label {
  position: relative;
  bottom: -8px;
  color: #2c234d;
  font-weight: 700;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-form-area .contact-form-wrapper form.contact-form .radio-wrapper {
    display: block;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-area .contact-form-wrapper form.contact-form .radio-wrapper {
    display: block;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .contact-form-area .contact-form-wrapper form.contact-form .radio-wrapper {
    display: block;
  }
}

@media (max-width: 575px) {
  .contact-form-area .contact-form-wrapper form.contact-form .radio-wrapper {
    display: block;
  }
}

.contact-form-area .contact-form-wrapper form.contact-form .radio-wrapper .select-radio .radio {
  margin: 0.5rem;
  display: inline-block;
}

.contact-form-area .contact-form-wrapper form.contact-form .radio-wrapper .select-radio .radio label {
  cursor: pointer;
  margin-left: -2px;
  font-size: 14px;
  color: #677294;
}

@media only screen and (min-width: 821px) and (max-width: 1000px) {
  .contact-form-area .contact-form-wrapper {
    margin-top: 50px;
    margin-left: 61px;
  }
}


@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form-area .contact-form-wrapper form.contact-form .radio-wrapper .select-radio .radio label {
    font-size: 15px;
  }
}

.contact-form-area .contact-form-wrapper form.contact-form .radio-wrapper .select-radio .radio input[type="radio"] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.contact-form-area .contact-form-wrapper form.contact-form .radio-wrapper .select-radio .radio input[type="radio"]+.radio-label:before {
  content: '';
  background: #f4f4f4;
  border-radius: 100%;
  border: 1px solid #b4b4b4;
  display: inline-block;
  width: 1.4em;
  height: 1.4em;
  position: relative;
  top: 3px;
  margin-right: 17px;
  vertical-align: top;
  cursor: pointer;
  text-align: center;
  -webkit-transition: all 250ms ease;
  transition: all 250ms ease;
}

.contact-form-area .contact-form-wrapper form.contact-form .radio-wrapper .select-radio .radio input[type="radio"]:checked+.radio-label:before {
  background-color: #f15f22;
  -webkit-box-shadow: inset 0 0 0 4px #f4f4f4;
  box-shadow: inset 0 0 0 4px #f4f4f4;
}

.contact-form-area .contact-form-wrapper form.contact-form .radio-wrapper .select-radio .radio input[type="radio"]:focus+.radio-label:before {
  outline: none;
  border-color: #f15f22;
}

.contact-form-area .contact-form-wrapper form.contact-form .radio-wrapper .select-radio .radio input[type="radio"]:disabled+.radio-label:before {
  -webkit-box-shadow: inset 0 0 0 4px #f4f4f4;
  box-shadow: inset 0 0 0 4px #f4f4f4;
  border-color: #b4b4b4;
  background: #b4b4b4;
}

.contact-form-area .contact-form-wrapper form.contact-form .radio-wrapper .select-radio .radio input[type="radio"]+.radio-label:empty:before {
  margin-right: 0;
}

.team-area .single-team .team-img {
  position: relative;
  overflow: hidden;
}

.team-area .single-team .team-img img {
  width: 100%;
}

.team-area .single-team .team-caption {
  position: absolute;
  bottom: -36px;
  background: rgba(255, 255, 255, 0.6);
  width: 100%;
  padding-top: 20px;
  padding-bottom: 30px;
  text-align: center;
  -webkit-transition: all 0.4s ease-out 0s;
  transition: all 0.4s ease-out 0s;
}

.team-area .single-team .team-caption h3 {
  margin-bottom: 3px;
  line-height: 13px;
  font-family: "Roboto Slab", sans-serif;
}

.team-area .single-team .team-caption h3 a {
  color: #2c234d;
  font-weight: 700;
  font-size: 20px;
}

.team-area .single-team .team-caption h3 a:hover {
  color: #c9252b;
}

.team-area .single-team .team-caption p {
  color: #2c234d;
  font-size: 16px;
  margin: 0;
  padding: 0;
}

.team-area .single-team:hover .team-img .team-social a {
  -webkit-transform: translateY(6px);
  transform: translateY(6px);
  opacity: 1;
  visibility: visible;
  color: #fff;
}

.team-area .single-team:hover .team-caption {
  background: #c9252b;
  bottom: 0;
}

.team-area .single-team:hover .team-caption h3 a {
  color: #fff;
}

.team-area .single-team:hover .team-caption p {
  color: #fff;
}

.team-social {
  bottom: 22px;
  left: 0;
  right: 0;
  text-align: center;
}

.team-social li {
  display: inline-block;
}

.team-social li a {
  color: #8ba4b1;
  font-size: 14px;
  margin: 0 12px;
  display: inline-block;
  -webkit-transform: 0.4s;
  transform: 0.4s;
  -webkit-transform: translateY(60px);
  transform: translateY(60px);
  opacity: 1;
  visibility: visible;
}

.team-social li a i {
  display: inline-block;
}

.team-social li:nth-child(1) a {
  -webkit-transition-delay: 0.0s;
  transition-delay: 0.0s;
}

.team-social li:nth-child(2) a {
  -webkit-transition-delay: 0.1s;
  transition-delay: 0.1s;
}

.team-social li:nth-child(3) a {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}

.team-social li:nth-child(4) a {
  -webkit-transition-delay: 0.3s;
  transition-delay: 0.3s;
}

.testimonial-area .testimonial-caption .testimonial-top-cap svg {
  margin-bottom: 17px;
}

.testimonial-area .testimonial-caption .testimonial-top-cap p {
  color: #a4acc3;
  font-weight: 500;
  line-height: 1.5;
  padding: 0 3px;
  margin-bottom: 50px;
  font-size: 16px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-area .testimonial-caption .testimonial-top-cap p {
    margin-bottom: 30px;
  }
}

@media (max-width: 575px) {
  .testimonial-area .testimonial-caption .testimonial-top-cap p {
    margin-bottom: 30px;
  }
}

.testimonial-area .testimonial-caption .testimonial-founder .founder-text {
  padding-left: 20px;
}

.testimonial-area .testimonial-caption .testimonial-founder .founder-text span {
  color: #fff;
}

.testimonial-area .testimonial-caption .testimonial-founder .founder-text p {
  color: #677294;
  font-weight: 500;
  line-height: 1.5;
  margin-bottom: 5px;
}

/* Homepage1 Testimonial */
.h1-testimonial-active button.slick-arrow {
  position: absolute;
  right: 90px;
  border: 0;
  padding: 0;
  z-index: 2;
  height: 50px;
  width: 50px;
  line-height: 50px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 20px;
  -webkit-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
  color: #616373;
  background: none;
  margin: 0 auto;
  bottom: 0;
  border: 1px solid #616373;
}

.h1-testimonial-active button.slick-arrow:hover {
  border: 1px solid #c9252b;
  color: #c9252b;
}

.h1-testimonial-active button.slick-next {
  right: 31px;
}

.h1-testimonial-active button i {
  font-size: 13px;
  position: relative;
  top: -3px;
}

.slick-initialized .slick-slide {
  outline: 0;
}

.testimonial-form {
  padding: 50px;
  border-radius: 10px;
  background: #fff;
  padding: 50px;
  border-radius: 10px;
}

@media (max-width: 575px) {
  .testimonial-form {
    padding: 30px;
  }
}

.testimonial-form h3 {
  font-size: 26px;
  display: block;
  font-weight: 600;
  text-transform: capitalize;
  line-height: 1.3;
  margin-bottom: 30px;
}

.testimonial-form input {
  height: 60px;
  width: 100%;
  color: #777777;
  font-size: 18px;
  font-weight: 400;
  padding: 9px 33px 9px 32px;
  border-radius: 5px;
  border: 1px solid #efebeb;
  background: #fff;
  margin-bottom: 20px;
}

@media (max-width: 575px) {
  .testimonial-form input {
    margin-bottom: 20px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .testimonial-form input {
    padding: 9px 33px 9px 25px;
    margin-bottom: 20px;
  }
}

.testimonial-form input::-webkit-input-placeholder {
  color: #616875;
}

.testimonial-form input:-ms-input-placeholder {
  color: #616875;
}

.testimonial-form input::-ms-input-placeholder {
  color: #616875;
}

.testimonial-form input::placeholder {
  color: #616875;
}

@media (max-width: 575px) {
  .testimonial-form input::-webkit-input-placeholder {
    font-size: 14px;
  }

  .testimonial-form input:-ms-input-placeholder {
    font-size: 14px;
  }

  .testimonial-form input::-ms-input-placeholder {
    font-size: 14px;
  }

  .testimonial-form input::placeholder {
    font-size: 14px;
  }
}

.footer-area {
  background: #fff;
}

.footer-area .footer-heading {
  padding-bottom: 51px;
  margin-bottom: 82px;
  border-bottom: 1px solid #1a2537;
}

.footer-area .footer-heading .wantToWork-caption h2 {
  color: #fff;
  font-size: 36px;
  font-weight: 700;
  line-height: 1.2;
  font-family: "Roboto Slab", sans-serif;
  margin: 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-area .footer-heading .wantToWork-caption h2 {
    font-size: 30px;
  }
}

@media (max-width: 575px) {
  .footer-area .footer-heading .wantToWork-caption h2 {
    font-size: 25px;
    margin-bottom: 20px;
  }
}

.footer-area .footer-heading .wantToWork-caption p {
  font-size: 18px;
}

.footer-area .footer-heading .contact-company {
  color: #159bfd;
  font-size: 27px;
  font-weight: bold;
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .footer-area .footer-heading .contact-company {
    float: left;
    margin-top: 30px;
    font-size: 25px;
  }
}

@media (max-width: 575px) {
  .footer-area .footer-heading .contact-company {
    float: left;
    margin-top: 20px;
    font-size: 25px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-area .footer-heading .contact-company {
    float: left;
    margin-top: 30px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-area .footer-heading .contact-company {
    font-size: 30px;
    margin-bottom: 20px;
  }
}


.footer-area .footer-heading .address {
  line-height: 2;
  width: 450px;
  text-align: justify;
}

.footer-area .footer-heading .address p,
.footer-area .footer-heading .address a,
.footer-area .footer-heading .address span {
  color: #000;
  font-family: inherit;
  font-size: 13px;
}

.footer-area .footer-heading .footer-map {
  padding: 0 45px;
}

.footer-area .footer-heading .footer-map .footer-map-iframe {
  width: 25.05em;
  height: 27em;
  border: 0;
}

@media (max-width: 575px) {
  .footer-area .footer-heading .footer-map .footer-map-iframe {
    padding-top: 15px;
    width: 22.5em;
    height: 15em;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-area .footer-heading .footer-map .footer-map-iframe {
    padding-top: 15px;
    width: 43em;
    height: 20em;
  }

  .footer-area .footer-heading .address {
    margin-top: 76px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-area .footer-heading .footer-map .footer-map-iframe {
    width: 28em;
    height: 20em;
  }
}

@media only screen and (min-width: 360px) and (max-width: 414px) {
  .footer-area .footer-heading .address {
    line-height: 2;
    width: 311px;
    text-align: justify;
  }
}

.footer-area .footer-top .single-footer-caption .footer-logo {
  margin-bottom: 30px;
}

.footer-area .footer-top .single-footer-caption .footer-pera .info1 {
  line-height: 1.8;
  margin-bottom: 30px;
  padding-right: 0;
  color: #c4c4c4;
  font-size: 14px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-area .footer-top .single-footer-caption .footer-pera .info1 {
    padding-right: 0px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-area .footer-top .single-footer-caption .footer-pera .info1 {
    padding-right: 0px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .footer-area .footer-top .single-footer-caption .footer-pera .info1 {
    padding-right: 0px;
  }
}


.footer-area .footer-top .single-footer-caption .footer-tittle h4 {
  color: #159bfe;
  font-family: "Roboto Slab", sans-serif;
  font-size: 24px;
  margin-bottom: 38px;
  font-weight: 500;
  text-transform: uppercase;
}

.footer-area .footer-top .single-footer-caption .footer-tittle ul li {
  color: #bbbcbc;
  margin-bottom: 15px;
  text-transform: capitalize;
}

.footer-area .footer-top .single-footer-caption .footer-tittle ul li a {
  color: #000;
  font-family: inherit;
  font-weight: 300;
  font-size: 16px;
  transition: all .5s;
}

.footer-area .footer-top .single-footer-caption .footer-tittle ul li a:hover {
  color: #148bfd;
  padding-left: 5px;
}

.footer-area .footer-top .single-footer-caption .search-box {
  width: 100%;
  height: 40px;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.footer-area .footer-top .single-footer-caption .search-box .search-input {
  width: 100%;
  padding: 10px;
  border: 1px solid #c9252b;
  border-radius: 10px 0 0 10px;
  border-right: none;
  outline: none;
  font-size: 20px;
  color: #c9252b;
  background: none;
}

.footer-area .footer-top .single-footer-caption .search-box .search-input::-webkit-input-placeholder {
  text-align: center;
  color: #fff;
}

.footer-area .footer-top .single-footer-caption .search-box .search-input:-ms-input-placeholder {
  text-align: center;
  color: #fff;
}

.footer-area .footer-top .single-footer-caption .search-box .search-input::-ms-input-placeholder {
  text-align: center;
  color: #fff;
}

.footer-area .footer-top .single-footer-caption .search-box .search-input::placeholder {
  text-align: center;
  color: #fff;
}

.footer-area .footer-top .single-footer-caption .search-box .search-button {
  text-align: center;
  height: 40px;
  width: 70px;
  outline: none;
  cursor: pointer;
  border: 1px solid #c9252b;
  border-radius: 0 10px 10px 0;
  border-left: none;
  background: none;
  font-size: 20px;
  border-left: 1px solid #c9252b;
}

.footer-area .footer-bottom {
  padding-bottom: 50px;
  padding-top: 20px;
}

.footer-area .footer-bottom .footer-copy-right p {
  color: #bbbcbc;
  font-weight: 300;
  font-size: 16px;
  line-height: 2;
  margin-bottom: 12px;
}

.footer-area .footer-bottom .footer-copy-right p i {
  color: #c9252b;
}

.footer-area .footer-bottom .footer-copy-right p a {
  color: #147bfd;
}

.footer-area .footer-social {
  text-align: center;
}

.footer-area .footer-social a {
  color: #848493;
  font-size: 18px;
  text-align: center;
  margin-left: 24px;
}

.footer-area .footer-social a:first-child {
  margin-left: 0px;
}

.footer-area .footer-social a:hover {
  color: #fff;
}

.hero-caption span {
  color: #fff;
  font-size: 16px;
  display: block;
  margin-bottom: 24px;
  font-weight: 600;
  padding-left: 95px;
  position: relative;
}

.hero-caption span::before {
  position: absolute;
  content: "";
  width: 75px;
  height: 3px;
  background: #c9252b;
  left: 0;
  top: 52%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.hero-caption h2 {
  color: #fff;
  font-size: 50px;
  font-weight: 700;
}

.technology-admin {
  margin-top: 120px;
}

@media (max-width: 575px) {
  .technology-admin {
    margin-top: 60px;
  }
}

.technology-admin .technology-image {
  position: relative;
  overflow: hidden;
  cursor: pointer;
  top: 0;
  width: 100%;
}

.technology-admin .technology-image:hover>img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.technology-admin .technology-image img {
  width: 100%;
  height: 600px;
  -o-object-fit: cover;
  object-fit: cover;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: all 0.5s ease-out 0s;
  transition: all 0.5s ease-out 0s;
}

@media (max-width: 575px) {
  .technology-admin .technology-image {
    display: none;
  }
}

.technology-admin-title {
  position: relative;
}

.technology-admin-title::after {
  position: absolute;
  content: " ";
  width: 150px;
  height: 50px;
  right: 2%;
  top: -5%;
  border-right: 6px solid #c9252b;
  border-top: 8px solid #c9252b;
  -webkit-transition: all 0.6s ease-out 0s;
  transition: all 0.6s ease-out 0s;
}

@media (max-width: 575px) {
  .technology-admin-title::after {
    display: none;
  }
}

.technology-admin-title:hover::after {
  width: 95%;
  height: 0;
  border-top: 2px solid #c9252b;
}

.technology-admin-description-1,
.technology-admin-description-2,
.technology-admin-description-3,
.technology-admin-description-4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.technology-admin-description-1 i,
.technology-admin-description-2 i,
.technology-admin-description-3 i,
.technology-admin-description-4 i {
  padding: 15px;
}

@media (max-width: 575px) {

  .technology-admin-description-1 i,
  .technology-admin-description-2 i,
  .technology-admin-description-3 i,
  .technology-admin-description-4 i {
    padding-left: 0;
  }
}

.technology-key {
  margin-top: 120px;
  position: relative;
}

.technology-key .container {
  height: 400px;
  top: 50%;
  left: 50%;
}

@media (max-width: 575px) {
  .technology-key .container {
    position: static;
    -webkit-transform: none;
    transform: none;
    height: inherit;
  }
}

@media (max-width: 575px) {
  .technology-key {
    margin-top: 60px;
  }
}

.technology-key .technology-key-video {
  width: 100%;
}

.technology-key .technology-key-video video {
  width: 100%;
}

.technology-key .technology-key-content {
  /* position: absolute; */
  padding: 30px;
  background-color: #ffffff99;
  width: 500px;
  top: 0;
  border-radius: 6px;
}

.technology-key-image {
  padding-left: 137px;
}

.technology-key .technology-key-content p {
  text-align: justify;
}

.technology-key .technology-key-content .technology-key-title {
  margin-bottom: 20px;
}

@media (max-width: 575px) {
  .technology-key .technology-key-content {
    position: static;
    width: 100%;
    margin-top: 50px;
    padding: 0;
    background: none;
  }
}

.technology-key .technology-key-content::before {
  content: "";
  position: absolute;
  width: 200px;
  height: 100px;
  border-top: 8px solid #c9252b;
  border-left: 6px solid #c9252b;
  left: -6%;
  top: -6%;
  -webkit-transition: all 0.6s ease-out 0s;
  transition: all 0.6s ease-out 0s;
}

@media (max-width: 575px) {
  .technology-key .technology-key-content::before {
    display: none;
  }
}

.technology-key .technology-key-content::after {
  content: "";
  position: absolute;
  width: 200px;
  height: 100px;
  border-bottom: 8px solid #c9252b;
  border-right: 6px solid #c9252b;
  right: -6%;
  bottom: 15%;
  -webkit-transition: all 0.6s ease-out 0s;
  transition: all 0.6s ease-out 0s;
}

@media (max-width: 575px) {
  .technology-key .technology-key-content::after {
    display: none;
  }
}

@media only screen and (min-width:1001px) and (max-width: 1200px) {
  .technology-key-image img {
    width: 25%;
    margin-left: 266px;
  }
}

@media only screen and (min-width:768px) and (max-width: 1000px) {
  .technology-key-image img {
    width: 38%;
    margin-left: 134px;
  }

  .technology-key .technology-key-content::after {
    right: -1%;
  }

  .technology-key .technology-key-content::before {
    left: -2%;
  }
}

@media only screen and (min-width:360px) and (max-width: 414px) {
  .technology-key-image img {
    width: 70%;
    margin-left: -10px;
  }
}

.technology-key .technology-key-content:hover::before {
  width: 100px;
  height: 200px;
}

.technology-key .technology-key-content:hover::after {
  width: 100px;
  height: 200px;
}

.form-register-smt {
  margin: 50px 0px -30px 0px;
}

@media (max-width: 575px) {
  .form-register-smt {
    margin-top: 60px;
  }
}

.form-register-smt .contact-form-wrapper {
  position: relative;
}

.form-register-smt .contact-form-wrapper::after {
  position: absolute;
  content: " ";
  top: 18%;
  left: 10%;
  width: 0;
  border-top: 0;
  -webkit-transition: all 0.6s ease-out 0s;
  transition: all 0.6s ease-out 0s;
}

.form-register-smt .contact-form-wrapper:hover::after {
  width: 80%;
  border-top: 3px solid #c9252b;
  border-radius: 6px;
}

@media (max-width: 575px) {
  .form-register-smt .contact-form-wrapper::after {
    display: none;
  }

  .form-register-smt .contact-form-wrapper .section-tittle {
    margin-bottom: 30px;
  }
}

.form-register-smt .submit-btn {
  position: relative;
  left: 0;
  -webkit-animation: slidebg 6s infinite alternate;
  animation: slidebg 6s infinite alternate;
}

.form-register-smt .submit-btn .btn-arrow {
  -webkit-animation: changeColor 1s infinite alternate;
  animation: changeColor 1s infinite alternate;
}

@media (max-width: 575px) {
  .form-register-smt .submit-btn {
    padding: 18px 20px;
  }
}

@-webkit-keyframes slidebg {
  to {
    background-image: -webkit-gradient(linear, left top, right top, from(#fff), color-stop(49%, #149bfd), color-stop(80%, #149bfd), to(#fff));
    background-image: linear-gradient(90deg, #fff 0%, #149bfd 49%, #149bfd 80%, #fff 100%);
    background-position: 50vw;
    border: 0 !important;
  }
}

@keyframes slidebg {
  to {
    background-image: -webkit-gradient(linear, left top, right top, from(#fff), color-stop(49%, #149bfd), color-stop(80%, #149bfd), to(#fff));
    background-image: linear-gradient(90deg, #fff 0%, #149bfd 49%, #149bfd 80%, #fff 100%);
    background-position: 50vw;
    border: 0 !important;
  }
}

@-webkit-keyframes changeColor {
  to {
    right: 0;
    color: #fff;
  }
}

@keyframes changeColor {
  to {
    right: 0;
    color: #fff;
  }
}

.project-app {
  margin-top: 120px;
}

@media (max-width: 575px) {
  .project-app {
    margin-top: 60px;
  }
}

.project-app-content .section-tittle {
  margin-bottom: 30px;
}

.project-app-description {
  margin-bottom: 50px;
}

.project-app-image .image-1,
.project-app-image .image-2,
.project-app-image .image-3 {
  height: 600px;
  overflow: hidden;
  position: relative;
}

@media (max-width: 575px) {

  .project-app-image .image-1,
  .project-app-image .image-2,
  .project-app-image .image-3 {
    position: relative;
    margin-top: 30px;
  }

  .project-app-image .image-1 img,
  .project-app-image .image-2 img,
  .project-app-image .image-3 img {
    width: 92%;
  }
}

.project-app-image img {
  width: 90%;
  height: 800px;
  -o-object-fit: fill;
  object-fit: fill;
  position: absolute;
  top: 0;
  -webkit-transition: all 2.5s ease-out;
  transition: all 2.5s ease-out;
}

.project-app-image img:hover {
  top: -200px;
  cursor: pointer;
}

.introduce-app {
  margin-top: 120px;
}

@media (max-width: 575px) {
  .introduce-app {
    margin-top: 60px;
  }
}

.introduce-app-content {
  position: relative;
  background: #000000d9;
  min-height: 530px;
  border-radius: 6px;
}

.introduce-app-content::before {
  content: " ";
  position: absolute;
  width: 0;
  height: 100%;
  border-top: 8px solid #c9252b;
  border-right: 6px solid #c9252b;
  top: 0;
  right: 0;
  border-radius: 6px;
  -webkit-transition: all 0.6s ease-out 0s;
  transition: all 0.6s ease-out 0s;
}

.introduce-app-content:hover::before {
  width: 100%;
  height: 0;
  border-top: 8px solid #c9252b;
  border-radius: 6px;
}

.introduce-app-content-wapper {
  position: absolute;
  padding: 0 30px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media (max-width: 575px) {
  .introduce-app-content-wapper {
    position: static;
    -webkit-transform: none;
    transform: none;
    padding: 30px 15px;
  }
}

@media (max-width: 575px) {
  .introduce-app-content {
    position: static;
    min-height: auto;
  }

  .introduce-app-content .section-tittle {
    margin-bottom: 30px;
  }

  .introduce-app-content::before {
    display: none;
  }
}

.introduce-app-description-1,
.introduce-app-description-2,
.introduce-app-description-3,
.introduce-app-description-4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-align: justify;
}

.introduce-app-description-1 p,
.introduce-app-description-2 p,
.introduce-app-description-3 p,
.introduce-app-description-4 p {
  color: #fff;
}

.introduce-app-description-1 i,
.introduce-app-description-2 i,
.introduce-app-description-3 i,
.introduce-app-description-4 i {
  color: #fff;
  padding-right: 15px;
  padding-top: 10px;
}

@media (max-width: 575px) {

  .introduce-app-description-1 i,
  .introduce-app-description-2 i,
  .introduce-app-description-3 i,
  .introduce-app-description-4 i {
    display: none;
  }
}

.introduce-app-image {
  width: 100%;
  overflow: hidden;
  cursor: pointer;
}

.introduce-app-image:hover>img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.introduce-app-image img {
  width: 100%;
  height: 400px;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: all 0.5s ease-out 0s;
  transition: all 0.5s ease-out 0s;
}

@media (max-width: 575px) {
  .introduce-app-image img {
    display: none;
  }
}

.benefit-app {
  margin-top: 120px;
  margin-bottom: 120px;
}

@media (max-width: 575px) {
  .benefit-app {
    margin: 60px 0;
  }
}

.benefit-app-content {
  position: relative;
  background: #000000d9;
  min-height: 400px;
  border-radius: 6px;
}

.benefit-app-content::before {
  content: " ";
  position: absolute;
  width: 0;
  height: 100%;
  border-top: 8px solid #c9252b;
  border-left: 6px solid #c9252b;
  top: 0;
  left: 0;
  border-radius: 6px;
  -webkit-transition: all 0.6s ease-out 0s;
  transition: all 0.6s ease-out 0s;
}

.benefit-app-content:hover::before {
  width: 100%;
  height: 0;
  border-top: 8px solid #c9252b;
  border-radius: 6px;
}

.benefit-app-content-wapper {
  position: absolute;
  padding: 0 30px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media (max-width: 575px) {
  .benefit-app-content-wapper {
    position: static;
    -webkit-transform: none;
    transform: none;
    padding: 30px 15px;
  }
}

@media (max-width: 575px) {
  .benefit-app-content::before {
    display: none;
  }
}

.benefit-app-description-1,
.benefit-app-description-2,
.benefit-app-description-3,
.benefit-app-description-4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-align: justify;
}

.benefit-app-description-1 p,
.benefit-app-description-2 p,
.benefit-app-description-3 p,
.benefit-app-description-4 p {
  color: #fff;
}

.benefit-app-description-1 i,
.benefit-app-description-2 i,
.benefit-app-description-3 i,
.benefit-app-description-4 i {
  color: #fff;
  padding-right: 15px;
  padding-top: 10px;
}

.benefit-app-image {
  width: 100%;
  overflow: hidden;
  cursor: pointer;
}

.benefit-app-image:hover>img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.benefit-app-image img {
  width: 100%;
  height: 400px;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: all 0.5s ease-out 0s;
  transition: all 0.5s ease-out 0s;
}

@media (max-width: 575px) {
  .benefit-app-image img {
    display: none;
  }
}

.wapper-design-web {
  margin-top: 80px;
}

.wapper-design-web .web-title {
  text-align: center;
}

.wapper-design-web .web-title h2.title {
  color: #2a79ff;
  font-size: 36px;
}

.wapper-design-web .web-title p.description {
  font-size: 22px;
  color: #555;
}

.wapper-design-web .web-content {
  margin: 50px 0;
}

.wapper-design-web .web-content .lits-items .item a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border: 1px solid #2a79ff;
  border-radius: 6px;
  padding: 20px 2px;
}

.wapper-design-web .web-content .lits-items .item a:hover {
  background-color: #2a79ff;
}

.wapper-design-web .web-content .lits-items .item a:hover .img-1 {
  opacity: 0;
  visibility: hidden;
}

.wapper-design-web .web-content .lits-items .item a:hover .img-2 {
  opacity: 1 !important;
  visibility: visible !important;
}

.wapper-design-web .web-content .lits-items .item a:hover p {
  color: #fff;
}

.wapper-design-web .web-content .lits-items .item a .item-img {
  position: relative;
  overflow: hidden;
  height: 50px;
  width: 100%;
}

.wapper-design-web .web-content .lits-items .item a .item-img .img {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  height: 100%;
}

.wapper-design-web .web-content .lits-items .item a .item-img .img-2 {
  opacity: 0;
  visibility: hidden;
}

.wapper-design-web .web-content .lits-items .item a p {
  text-transform: uppercase;
  font-size: 13px;
  font-weight: 500;
  color: #1d262d;
  margin: 0;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  height: 40px;
  padding-top: 5px;
}

.wapper-design-web .web-content .list-web-templete {
  margin-top: 50px;
}

.wapper-design-web .web-content .list-web-templete .theme-item {
  position: relative;
  border: 1px solid transparent;
  margin-bottom: 30px;
  -webkit-box-shadow: 0px 0px 12px 2px #e4ecf0;
  box-shadow: 0px 0px 12px 2px #e4ecf0;
  background: #fff;
  padding: 10px;
  border-radius: 10px;
}

.wapper-design-web .web-content .list-web-templete .theme-item .details {
  text-align: center;
}

.wapper-design-web .web-content .list-web-templete .theme-item .details h3 {
  font-size: 16px;
  font-weight: 500;
  padding: 10px 5px 0;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.wapper-design-web .web-content .list-web-templete .theme-item .details h3:hover {
  color: #2a79ff;
}

.wapper-design-web .web-content .list-web-templete .theme-item .theme-item-pack {
  position: absolute;
  top: -15px;
  right: 10px;
}

.wapper-design-web .web-content .list-web-templete .theme-item .theme-item-pack .theme-package-pro {
  width: 50px;
  height: 30px;
  border-radius: 5px;
  background-image: -webkit-gradient(linear, left top, right top, from(#ff7b02), to(#ffb33a));
  background-image: linear-gradient(to right, #ff7b02, #ffb33a);
  color: #fff;
  line-height: 30px;
  text-align: center;
  font-weight: 500;
}

.wapper-design-web .web-content .list-web-templete .theme-item .theme-item-pack .theme-package-vip {
  width: 50px;
  height: 30px;
  border-radius: 5px;
  background-image: -webkit-gradient(linear, left top, right top, from(#5e76eb), to(#a35df3));
  background-image: linear-gradient(to right, #5e76eb, #a35df3);
  color: #fff;
  line-height: 30px;
  text-align: center;
  font-weight: 500;
}

.wapper-design-web .web-content .list-web-templete .theme-item .actions {
  position: absolute;
  top: 30%;
  display: block;
  text-align: center;
  width: 100%;
  left: 0;
  right: 0;
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transition: all 0.5s ease-out 0s;
  transition: all 0.5s ease-out 0s;
}

.wapper-design-web .web-content .list-web-templete .theme-item .actions .view-all,
.wapper-design-web .web-content .list-web-templete .theme-item .actions .view-demo {
  display: inline-block;
  height: 40px;
  left: 50%;
  line-height: 38px;
  margin-left: -60px;
  position: absolute;
  width: 140px;
  line-height: 40px;
  top: 0;
  color: #fff !important;
  border-radius: 20px;
  background-image: -webkit-gradient(linear, left top, right top, from(#0077fb), to(#00b1e5));
  background-image: linear-gradient(to right, #0077fb, #00b1e5);
}

.wapper-design-web .web-content .list-web-templete .theme-item .actions .view-demo {
  top: 60px;
  background-image: -webkit-gradient(linear, left top, right top, from(#ff7b02), to(#ffb33a)) !important;
  background-image: linear-gradient(to right, #ff7b02, #ffb33a) !important;
}

.wapper-design-web .web-content .list-web-templete .theme-item .image {
  position: relative;
  overflow: hidden;
}

.wapper-design-web .web-content .list-web-templete .theme-item .image .mask-brg {
  display: block;
  float: left;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: #fff;
  opacity: 0;
  -webkit-transition: ease all 0.5s;
  transition: ease all 0.5s;
  -webkit-transform: scale(0);
  transform: scale(0);
}

.wapper-design-web .web-content .list-web-templete .theme-item .image img {
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center top;
  object-position: center top;
  outline: #e5e5e5 solid 1px;
  -webkit-transition: all 1s ease;
  transition: all 1s ease;
  margin: auto;
}

.wapper-design-web .web-content .list-web-templete .theme-item:hover .actions {
  -webkit-transform: scale(1);
  transform: scale(1);
}

.wapper-design-web .web-content .list-web-templete .theme-item:hover .mask-brg {
  background: #aac9ff;
  opacity: .5;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.wapper-design-web .web-content .list-web-templete .theme-item:hover h3 {
  color: #2a79ff;
}

.wapper-design-web .web-content .list-web-templete .theme-item:hover img {
  -webkit-transform: translateY(-100px);
  transform: translateY(-100px);
}

.home-blog-area .home-blog-single .blog-img {
  overflow: hidden;
  border-radius: 6px;
  margin-bottom: 30px;
}

.home-blog-area .home-blog-single .blog-img img {
  width: 100%;
  height: 250px;
  -webkit-transform: scale 1;
  transform: scale 1;
  -webkit-transition: all 0.5s ease-out 0s;
  transition: all 0.5s ease-out 0s;
}

.home-blog-area .home-blog-single .blog-caption .blog-date {
  background: #f5f5f5;
  padding: 14px 19px;
  display: block;
  float: left;
  overflow: hidden;
  border-radius: 6px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .home-blog-area .home-blog-single .blog-caption .blog-date {
    padding: 8px 20px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .home-blog-area .home-blog-single .blog-caption .blog-date {
    padding: 8px 20px;
  }
}

@media (max-width: 575px) {
  .home-blog-area .home-blog-single .blog-caption .blog-date {
    padding: 8px 20px;
    float: unset;
    display: inline-block;
  }
}

.home-blog-area .home-blog-single .blog-caption .blog-date span {
  color: #f15f22;
  font-size: 32px;
  font-weight: 700;
  line-height: 1;
  margin: 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .home-blog-area .home-blog-single .blog-caption .blog-date span {
    font-size: 22px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .home-blog-area .home-blog-single .blog-caption .blog-date span {
    font-size: 22px;
  }
}

@media (max-width: 575px) {
  .home-blog-area .home-blog-single .blog-caption .blog-date span {
    font-size: 22px;
  }
}

.home-blog-area .home-blog-single .blog-caption .blog-date p {
  color: #111111;
  margin: 0;
  font-size: 14px;
  line-height: 1.1;
}

.home-blog-area .home-blog-single .blog-caption .blog-cap {
  margin-left: 100px;
}

@media (max-width: 575px) {
  .home-blog-area .home-blog-single .blog-caption .blog-cap {
    margin-left: 0px;
    margin-top: 10px;
  }
}

.home-blog-area .home-blog-single .blog-caption .blog-cap ul {
  margin-bottom: 10px;
}

.home-blog-area .home-blog-single .blog-caption .blog-cap ul li {
  display: inline-block;
  padding-right: 40px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .home-blog-area .home-blog-single .blog-caption .blog-cap ul li {
    padding-right: 14px;
  }
}

.home-blog-area .home-blog-single .blog-caption .blog-cap ul li:last-child {
  padding-right: 0px;
}

.home-blog-area .home-blog-single .blog-caption .blog-cap ul li a {
  color: #717b9b;
  font-size: 13px;
}

.home-blog-area .home-blog-single .blog-caption .blog-cap ul li a i {
  padding-right: 10px;
}

.home-blog-area .home-blog-single .blog-caption .blog-cap h3 a {
  color: #191d34;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.4;
  margin-bottom: 20px;
  display: block;
}

.home-blog-area .home-blog-single .blog-caption .blog-cap h3 a:hover {
  color: #c9252b;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .home-blog-area .home-blog-single .blog-caption .blog-cap h3 a {
    font-size: 19px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .home-blog-area .home-blog-single .blog-caption .blog-cap h3 a {
    font-size: 19px;
  }
}

@media (max-width: 575px) {
  .home-blog-area .home-blog-single .blog-caption .blog-cap h3 a {
    font-size: 19px;
  }
}

.home-blog-single:hover .blog-img img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

/* End-latest-blog-area */
/* Start Blog Area css
============================================================================================ */
.latest-blog-area .area-heading {
  margin-bottom: 70px;
}

.blog_area a {
  color: "Roboto Slab", sans-serif !important;
  text-decoration: none;
  -webkit-transition: .4s;
  transition: .4s;
}

.blog_area a:hover,
.blog_area a :hover {
  background: -webkit-linear-gradient(131deg, #c9252b 0%, #c9252b 99%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-decoration: none;
  -webkit-transition: .4s;
  transition: .4s;
}

.single-blog {
  overflow: hidden;
  margin-bottom: 30px;
}

.single-blog:hover {
  -webkit-box-shadow: 0px 10px 20px 0px rgba(42, 34, 123, 0.1);
  box-shadow: 0px 10px 20px 0px rgba(42, 34, 123, 0.1);
}

.single-blog .thumb {
  overflow: hidden;
  position: relative;
}

.single-blog .thumb:after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0;
  -webkit-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

.single-blog h4 {
  border-bottom: 1px solid #dfdfdf;
  padding-bottom: 34px;
  margin-bottom: 25px;
}

.single-blog a {
  font-size: 20px;
  font-weight: 600;
}

.single-blog .date {
  color: #666666;
  text-align: left;
  display: inline-block;
  font-size: 13px;
  font-weight: 300;
}

.single-blog .tag {
  text-align: left;
  display: inline-block;
  float: left;
  font-size: 13px;
  font-weight: 300;
  margin-right: 22px;
  position: relative;
}

.single-blog .tag:after {
  content: '';
  position: absolute;
  width: 1px;
  height: 10px;
  background: #acacac;
  right: -12px;
  top: 7px;
}

@media (max-width: 1199px) {
  .single-blog .tag {
    margin-right: 8px;
  }

  .single-blog .tag:after {
    display: none;
  }
}

.single-blog .likes {
  margin-right: 16px;
}

@media (max-width: 800px) {
  .single-blog {
    margin-bottom: 30px;
  }
}

.single-blog .single-blog-content {
  padding: 30px;
}

.single-blog .single-blog-content .meta-bottom p {
  font-size: 13px;
  font-weight: 300;
}

.single-blog .single-blog-content .meta-bottom i {
  color: #fdcb9e;
  font-size: 13px;
  margin-right: 7px;
}

@media (max-width: 1199px) {
  .single-blog .single-blog-content {
    padding: 15px;
  }
}

.single-blog:hover .thumb:after {
  opacity: .7;
  -webkit-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

@media (max-width: 1199px) {
  .single-blog h4 {
    -webkit-transition: all 300ms linear 0s;
    transition: all 300ms linear 0s;
    border-bottom: 1px solid #dfdfdf;
    padding-bottom: 14px;
    margin-bottom: 12px;
  }

  .single-blog h4 a {
    font-size: 18px;
  }
}

.full_image.single-blog {
  position: relative;
}

.full_image.single-blog .single-blog-content {
  position: absolute;
  left: 35px;
  bottom: 0;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

@media (min-width: 992px) {
  .full_image.single-blog .single-blog-content {
    bottom: 100px;
  }
}

.full_image.single-blog h4 {
  -webkit-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
  border-bottom: none;
  padding-bottom: 5px;
}

.full_image.single-blog a {
  font-size: 20px;
  font-weight: 600;
}

.full_image.single-blog .date {
  color: #fff;
}

.full_image.single-blog:hover .single-blog-content {
  opacity: 1;
  visibility: visible;
  -webkit-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

/* TimeLine css start
============================================================================================ */

.main-timeline5{overflow:hidden;position:relative}
.main-timeline5 .timeline{position:relative;margin-top:-79px}
.main-timeline5 .timeline:first-child{margin-top:0}
.main-timeline5 .timeline-icon,.main-timeline5 .year{margin:auto;position:absolute;top:0;left:0;bottom:0;right:0}
.main-timeline5 .timeline:after,.main-timeline5 .timeline:before{content:"";display:block;width:100%;clear:both}
.main-timeline5 .timeline:before{content:"";width:100%;height:100%;box-shadow:-8px 0 5px -5px rgba(0,0,0,.5) inset;position:absolute;top:0;right:0;z-index:2}
.main-timeline5 .timeline-icon{width:210px;height:210px;border-radius:50%;border:25px solid transparent;border-top-color:#f44556;border-right-color:#f44556;z-index:1;transform:rotate(45deg)}
.main-timeline5 .year{display:block;width:110px;height:110px;line-height:110px;border-radius:50%;background:#fff;box-shadow:0 0 20px rgba(0,0,0,.4);font-size:30px;font-weight:700;color:#f44556;text-align:center;transform:rotate(-45deg)}
.main-timeline5 .timeline-content{width:35%;float:right;background:#f44556;padding:30px 20px;margin:50px 0;z-index:1;position:relative}
.main-timeline5 .timeline-content:before{content:"";width:20%;height:15px;background:#f44556;position:absolute;top:50%;left:-20%;z-index:-1;transform:translateY(-50%)}
.main-timeline5 .title{font-size:20px;font-weight:700;color:#fff;margin:0 0 10px}
.main-timeline5 .description{font-size:16px;color:#fff;line-height:24px;margin:0}
.main-timeline5 .timeline:nth-child(2n):before{box-shadow:8px 0 5px -5px rgba(0,0,0,.5) inset}
.main-timeline5 .timeline:nth-child(2n) .timeline-icon{transform:rotate(-135deg);border-top-color:#e97e2e;border-right-color:#e97e2e}
.main-timeline5 .timeline:nth-child(2n) .year{transform:rotate(135deg);color:#e97e2e}
.main-timeline5 .timeline:nth-child(2n) .timeline-content{float:left}
.main-timeline5 .timeline:nth-child(2n) .timeline-content:before{left:auto;right:-20%}
.main-timeline5 .timeline:nth-child(2n) .timeline-content,.main-timeline5 .timeline:nth-child(2n) .timeline-content:before{background:#e97e2e}
.main-timeline5 .timeline:nth-child(3n) .timeline-icon{border-top-color:#13afae;border-right-color:#13afae}
.main-timeline5 .timeline:nth-child(3n) .year{color:#13afae}
.main-timeline5 .timeline:nth-child(3n) .timeline-content,.main-timeline5 .timeline:nth-child(3n) .timeline-content:before{background:#13afae}
.main-timeline5 .timeline:nth-child(4n) .timeline-icon{border-top-color:#105572;border-right-color:#105572}
.main-timeline5 .timeline:nth-child(4n) .year{color:#105572}
.main-timeline5 .timeline:nth-child(4n) .timeline-content,.main-timeline5 .timeline:nth-child(4n) .timeline-content:before{background:#105572}
@media only screen and (max-width:1199px){.main-timeline5 .timeline{margin-top:-103px}
.main-timeline5 .timeline-content:before{left:-18%}
.main-timeline5 .timeline:nth-child(2n) .timeline-content:before{right:-18%}
}
@media only screen and (max-width:990px){.main-timeline5 .timeline{margin-top:-127px}
.main-timeline5 .timeline-content:before{left:-2%}
.main-timeline5 .timeline:nth-child(2n) .timeline-content:before{right:-2%}
}
@media only screen and (max-width:767px){.main-timeline5 .timeline{margin-top:0;overflow:hidden}
.main-timeline5 .timeline:before,.main-timeline5 .timeline:nth-child(2n):before{box-shadow:none}
.main-timeline5 .timeline-icon,.main-timeline5 .timeline:nth-child(2n) .timeline-icon{margin-top:-30px;margin-bottom:20px;position:relative;transform:rotate(135deg)}
.main-timeline5 .timeline:nth-child(2n) .year,.main-timeline5 .year{transform:rotate(-135deg)}
.main-timeline5 .timeline-content,.main-timeline5 .timeline:nth-child(2n) .timeline-content{width:100%;float:none;border-radius:0 0 20px 20px;text-align:center;padding:25px 20px;margin:0 auto}
.main-timeline5 .timeline-content:before,.main-timeline5 .timeline:nth-child(2n) .timeline-content:before{width:15px;height:25px;position:absolute;top:-22px;left:50%;z-index:-1;transform:translate(-50%,0)}
}

/* timeline2 start */

.main-timeline2{padding-top:50px;overflow:hidden;position:relative}
.main-timeline2:before{content:"";width:7px;height:100%;background:#084772;margin:0 auto;position:absolute;top:80px;left:0;right:0}
.main-timeline2 .timeline{width:50%;float:left;padding:20px 60px;border-top:7px solid #084772;border-right:7px solid #084772;border-radius:0 30px 0 0;position:relative;right:-3.5px}
.main-timeline2 .icon{display:block;width:50px;height:50px;line-height:50px;border-radius:50%;background:#e84c47;border:1px solid #fff;text-align:center;font-size:25px;color:#fff;box-shadow:0 0 0 2px #e84c47;position:absolute;top:-30px;left:0}
.main-timeline2 .timeline-content{display:block;padding:30px 10px 10px;border-radius:20px;background:#e84c47;color:#fff;position:relative}
.main-timeline2 .timeline-content:hover{text-decoration:none;color:#fff}
.main-timeline2 .timeline-content:after,.main-timeline2 .timeline-content:before{content:"";display:block;width:10px;height:50px;border-radius:10px;background:#e84c47;border:1px solid #fff;position:absolute;top:-35px;left:50px}
.main-timeline2 .timeline-content:after{left:auto;right:50px}
.main-timeline2 .title{font-size:24px;margin:0;color: #fff;}
.main-timeline2 .description{font-size:15px;letter-spacing:1px;margin:0 0 5px}
.main-timeline2 .timeline:nth-child(2n){border-right:none;border-left:7px solid #084772;border-radius:30px 0 0;right:auto;left:-3.5px}
.main-timeline2 .timeline:nth-child(2n) .icon{left:auto;right:0;box-shadow:0 0 0 2px #4bd9bf}
.main-timeline2 .timeline:nth-child(2){margin-top:130px}
.main-timeline2 .timeline:nth-child(odd){margin:-130px 0 30px}
.main-timeline2 .timeline:nth-child(even){margin-bottom:80px}
.main-timeline2 .timeline:first-child,.main-timeline2 .timeline:last-child:nth-child(even){margin:0 0 30px}
.main-timeline2 .timeline:nth-child(2n) .icon,.main-timeline2 .timeline:nth-child(2n) .timeline-content,.main-timeline2 .timeline:nth-child(2n) .timeline-content:after,.main-timeline2 .timeline:nth-child(2n) .timeline-content:before{background:#4bd9bf}
.main-timeline2 .timeline:nth-child(3n) .icon,.main-timeline2 .timeline:nth-child(3n) .timeline-content,.main-timeline2 .timeline:nth-child(3n) .timeline-content:after,.main-timeline2 .timeline:nth-child(3n) .timeline-content:before{background:#ff9e09}
.main-timeline2 .timeline:nth-child(3n) .icon{box-shadow:0 0 0 2px #ff9e09}
.main-timeline2 .timeline:nth-child(4n) .icon,.main-timeline2 .timeline:nth-child(4n) .timeline-content,.main-timeline2 .timeline:nth-child(4n) .timeline-content:after,.main-timeline2 .timeline:nth-child(4n) .timeline-content:before{background:#3ebae7}
.main-timeline2 .timeline:nth-child(4n) .icon{box-shadow:0 0 0 2px #3ebae7}
@media only screen and (max-width:767px){.main-timeline2:before{left:0;right:auto}
.main-timeline2 .timeline,.main-timeline2 .timeline:nth-child(even),.main-timeline2 .timeline:nth-child(odd){width:100%;float:none;padding:20px 30px;margin:0 0 30px;border-right:none;border-left:7px solid #084772;border-radius:30px 0 0;right:auto;left:0}
.main-timeline2 .icon{left:auto;right:0}
}
@media only screen and (max-width:480px){.main-timeline2 .title{font-size:18px}
}


/* timeline2 end */


/* timeline7 start */
.main-timeline7{overflow:hidden;position:relative}
.main-timeline7 .timeline{width:50%;float:left;z-index:1;position:relative}
.main-timeline7 .timeline:after,.main-timeline7 .timeline:before{content:"";display:block;clear:both}
.main-timeline7 .timeline:before{content:"";width:40px;height:90%;background:#727cb6;position:absolute;top:10%;right:-20px}
.main-timeline7 .timeline:last-child:before{height:0}
.main-timeline7 .timeline-icon{width:80px;height:80px;border-radius:50%;background:#727cb6;overflow:hidden;text-align:center;position:absolute;top:0;right:-40px;z-index:3}
.main-timeline7 .timeline-icon:before{content:"";width:60px;height:60px;border-radius:50%;background:#fff;border:2px solid #727cb6;box-shadow:0 0 0 4px #a5afe4;margin:auto;position:absolute;top:0;left:0;bottom:0;right:0}
.main-timeline7 .timeline-icon i{font-size:35px;color:#303a3b;line-height:80px;z-index:1;position:relative}
.main-timeline7 .year{display:block;padding:0 60px 0 30px;font-size:30px;color:#303a3b;text-align:right;border-bottom:2px solid #303a3b;z-index:2;position:relative}
.main-timeline7 .year:before{content:"";display:block;width:30px;height:30px;border-radius:50%;background:#727cb6;border:5px solid #fff;box-shadow:0 0 0 4px #727cb6;margin:auto;position:absolute;bottom:-15px;left:4px}
.main-timeline7 .year:after{content:"";border-left:10px solid #303a3b;border-top:10px solid transparent;border-bottom:10px solid transparent;position:absolute;bottom:-11px;left:50px}
.main-timeline7 .timeline-content{padding:18px 60px 18px 40px;text-align:right;position:relative;z-index:1}
.main-timeline7 .timeline-content:after,.main-timeline7 .timeline-content:before{content:"";width:80px;height:150px;border-radius:50%;background:#fff;position:absolute;top:-7%;right:15px;z-index:-1}
.main-timeline7 .timeline-content:after{left:auto;right:-95px}
.main-timeline7 .timeline:last-child .timeline-content:after,.main-timeline7 .timeline:last-child .timeline-content:before{width:0;height:0}
.main-timeline7 .title{font-size:22px;font-weight:700;color:#727cb6;margin-top:0}
.main-timeline7 .description{font-size:15px;color:#7f8386;line-height:25px}
.main-timeline7 .timeline:nth-child(2){margin-top:140px}
.main-timeline7 .timeline:nth-child(even){margin-bottom:80px}
.main-timeline7 .timeline:nth-child(odd){margin:-140px 0 0}
.main-timeline7 .timeline:first-child,.main-timeline7 .timeline:last-child:nth-child(even){margin:0!important}
.main-timeline7 .timeline:nth-child(2n) .timeline-icon,.main-timeline7 .timeline:nth-child(2n):before{right:auto;left:-20px;background:#e77e21}
.main-timeline7 .timeline:nth-child(2n) .timeline-icon{left:-40px}
.main-timeline7 .timeline:nth-child(2n) .year{padding:0 30px 0 60px;text-align:left}
.main-timeline7 .timeline:nth-child(2n) .year:before{left:auto;right:3px}
.main-timeline7 .timeline:nth-child(2n) .year:after{border-left:none;border-right:10px solid #303a3b;right:50px}
.main-timeline7 .timeline:nth-child(2n) .timeline-content{padding:18px 40px 18px 60px;text-align:left}
.main-timeline7 .timeline:nth-child(2n) .timeline-content:before{left:-95px}
.main-timeline7 .timeline:nth-child(2n) .timeline-content:after{left:15px}
.main-timeline7 .timeline:nth-child(2n) .timeline-icon:before{border-color:#e77e21;box-shadow:0 0 0 4px #f1a563}
.main-timeline7 .timeline:nth-child(2n) .year:before{background:#e77e21;box-shadow:0 0 0 4px #e77e21}
.main-timeline7 .timeline:nth-child(2n) .title{color:#e77e21}
.main-timeline7 .timeline:nth-child(3n) .timeline-icon,.main-timeline7 .timeline:nth-child(3n):before{background:#008b8b}
.main-timeline7 .timeline:nth-child(3n) .timeline-icon:before{border-color:#008b8b;box-shadow:0 0 0 4px #50b5b4}
.main-timeline7 .timeline:nth-child(3n) .year:before{background:#008b8b;box-shadow:0 0 0 4px #008b8b}
.main-timeline7 .timeline:nth-child(3n) .title{color:#008b8b}
.main-timeline7 .timeline:nth-child(4n) .timeline-icon,.main-timeline7 .timeline:nth-child(4n):before{background:#ed687c}
.main-timeline7 .timeline:nth-child(4n) .timeline-icon:before{border-color:#ed687c;box-shadow:0 0 0 4px #f798a8}
.main-timeline7 .timeline:nth-child(4n) .year:before{background:#ed687c;box-shadow:0 0 0 4px #ed687c}
.main-timeline7 .timeline:nth-child(4n) .title{color:#ed687c}
@media only screen and (max-width:990px){.main-timeline7 .timeline{width:100%}
.main-timeline7 .timeline:nth-child(even),.main-timeline7 .timeline:nth-child(odd){margin:0}
.main-timeline7 .timeline:before,.main-timeline7 .timeline:nth-child(2n):before{width:30px;height:100%;left:25px}
.main-timeline7 .timeline-icon,.main-timeline7 .timeline:nth-child(2n) .timeline-icon{left:0}
.main-timeline7 .timeline:nth-child(2n) .year,.main-timeline7 .year{text-align:left;padding:0 30px 0 100px}
.main-timeline7 .timeline:nth-child(2n) .year:before,.main-timeline7 .year:before{left:auto;right:4px}
.main-timeline7 .year:after{left:auto;right:50px;border-right:10px solid #303a3b;border-left:none}
.main-timeline7 .timeline-content .description{color:#666}
.main-timeline7 .timeline-content,.main-timeline7 .timeline:nth-child(2n) .timeline-content{text-align:left;padding:18px 40px 18px 100px}
.main-timeline7 .timeline-content:after,.main-timeline7 .timeline-content:before{width:0;height:0}
}

/* timeline7 End */

/* TimeLine css End
============================================================================================ */

/* End Blog Area css
============================================================================================ */
/* Latest Blog Area css
============================================================================================ */
.l_blog_item .l_blog_text .date {
  margin-top: 24px;
  margin-bottom: 15px;
}

.l_blog_item .l_blog_text .date a {
  font-size: 12px;
}

.l_blog_item .l_blog_text h4 {
  font-size: 18px;
  border-bottom: 1px solid #eeeeee;
  margin-bottom: 0px;
  padding-bottom: 20px;
  -webkit-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

.l_blog_item .l_blog_text p {
  margin-bottom: 0px;
  padding-top: 20px;
}

/* End Latest Blog Area css
============================================================================================ */

/* whychoose start*/
.text_tilte__service-crm_wc{
  font-size: 25px;
  font-weight: bold;
}
/* whychoose end*/

/* Causes Area css
============================================================================================ */
.causes_slider .owl-dots {
  text-align: center;
  margin-top: 80px;
}

.causes_slider .owl-dots .owl-dot {
  height: 14px;
  width: 14px;
  background: #eeeeee;
  display: inline-block;
  margin-right: 7px;
}

.causes_slider .owl-dots .owl-dot:last-child {
  margin-right: 0px;
}

.causes_item {
  background: #fff;
}

.causes_item .causes_img {
  position: relative;
}

.causes_item .causes_img .c_parcent {
  position: absolute;
  bottom: 0px;
  width: 100%;
  left: 0px;
  height: 3px;
  background: rgba(255, 255, 255, 0.5);
}

.causes_item .causes_img .c_parcent span {
  width: 70%;
  height: 3px;
  position: absolute;
  left: 0px;
  bottom: 0px;
}

.causes_item .causes_img .c_parcent span:before {
  content: "75%";
  position: absolute;
  right: -10px;
  bottom: 0px;
  color: #fff;
  padding: 0px 5px;
}

.causes_item .causes_text {
  padding: 30px 35px 40px 30px;
}

.causes_item .causes_text h4 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 15px;
  cursor: pointer;
}

.causes_item .causes_text p {
  font-size: 14px;
  line-height: 24px;
  font-weight: 300;
  margin-bottom: 0px;
}

.causes_item .causes_bottom a {
  width: 50%;
  border: 1px solid;
  text-align: center;
  float: left;
  line-height: 50px;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
}

.causes_item .causes_bottom a+a {
  border-color: #eeeeee;
  background: #fff;
  font-size: 14px;
}

/* End Causes Area css
============================================================================================ */
/*================= latest_blog_area css =============*/
.latest_blog_area {
  background: #f9f9ff;
}

.single-recent-blog-post {
  margin-bottom: 30px;
}

.single-recent-blog-post .thumb {
  overflow: hidden;
}

.single-recent-blog-post .thumb img {
  -webkit-transition: all 0.7s linear;
  transition: all 0.7s linear;
}

.single-recent-blog-post .details {
  padding-top: 30px;
}

.single-recent-blog-post .details .sec_h4 {
  line-height: 24px;
  padding: 10px 0px 13px;
  -webkit-transition: all 0.3s linear;
  transition: all 0.3s linear;
}

.single-recent-blog-post .date {
  font-size: 14px;
  line-height: 24px;
  font-weight: 400;
}

.single-recent-blog-post:hover img {
  -webkit-transform: scale(1.23) rotate(10deg);
  transform: scale(1.23) rotate(10deg);
}

.tags .tag_btn {
  font-size: 12px;
  font-weight: 500;
  line-height: 20px;
  border: 1px solid #eeeeee;
  display: inline-block;
  padding: 1px 18px;
  text-align: center;
}

.tags .tag_btn+.tag_btn {
  margin-left: 2px;
}

/*========= blog_categorie_area css ===========*/
.blog_categorie_area {
  padding-top: 30px;
  padding-bottom: 30px;
}

@media (min-width: 900px) {
  .blog_categorie_area {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}

@media (min-width: 1100px) {
  .blog_categorie_area {
    padding-top: 120px;
    padding-bottom: 120px;
  }
}

.categories_post {
  position: relative;
  text-align: center;
  cursor: pointer;
}

.categories_post img {
  max-width: 100%;
}

.categories_post .categories_details {
  position: absolute;
  top: 20px;
  left: 20px;
  right: 20px;
  bottom: 20px;
  background: rgba(34, 34, 34, 0.75);
  color: #fff;
  -webkit-transition: all 0.3s linear;
  transition: all 0.3s linear;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.categories_post .categories_details h5 {
  margin-bottom: 0px;
  font-size: 18px;
  line-height: 26px;
  text-transform: uppercase;
  color: #fff;
  position: relative;
}

.categories_post .categories_details p {
  font-weight: 300;
  font-size: 14px;
  line-height: 26px;
  margin-bottom: 0px;
}

.categories_post .categories_details .border_line {
  margin: 10px 0px;
  background: #fff;
  width: 100%;
  height: 1px;
}

.categories_post:hover .categories_details {
  background: rgba(222, 99, 32, 0.85);
}

/*============ blog_left_sidebar css ==============*/
.blog_item {
  margin-bottom: 50px;
}

.blog_details {
  padding: 30px 0 20px 10px;
  -webkit-box-shadow: 0px 10px 20px 0px rgba(221, 221, 221, 0.3);
  box-shadow: 0px 10px 20px 0px rgba(221, 221, 221, 0.3);
}

@media (min-width: 768px) {
  .blog_details {
    padding: 60px 30px 35px 35px;
  }
}

.blog_details p {
  margin-bottom: 30px;
}

.blog_details a {
  color: #242b5e;
}

.blog_details a:hover {
  color: #c9252a00;
}

.blog_details h2 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 8px;
}

@media (min-width: 768px) {
  .blog_details h2 {
    font-size: 24px;
    margin-bottom: 15px;
  }
}

.blog-info-link li {
  float: left;
  font-size: 14px;
}

.blog-info-link li a {
  color: #999999;
}

.blog-info-link li i,
.blog-info-link li span {
  font-size: 13px;
  margin-right: 5px;
}

.blog-info-link li::after {
  content: "|";
  padding-left: 10px;
  padding-right: 10px;
}

.blog-info-link li:last-child::after {
  display: none;
}

.blog-info-link::after {
  content: "";
  display: block;
  clear: both;
  display: table;
}

.blog_item_img {
  position: relative;
}

.blog_item_img .blog_item_date {
  position: absolute;
  bottom: -10px;
  left: 10px;
  display: block;
  color: #fff;
  background-color: #c9252b;
  padding: 8px 15px;
  border-radius: 5px;
}

@media (min-width: 768px) {
  .blog_item_img .blog_item_date {
    bottom: -20px;
    left: 40px;
    padding: 13px 30px;
  }
}

.blog_item_img .blog_item_date h3 {
  font-size: 22px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 0;
  line-height: 1.2;
}

@media (min-width: 768px) {
  .blog_item_img .blog_item_date h3 {
    font-size: 30px;
  }
}

.blog_item_img .blog_item_date p {
  font-size: 18px;
  margin-bottom: 0;
  color: #fff;
}

@media (min-width: 768px) {
  .blog_item_img .blog_item_date p {
    font-size: 18px;
  }
}

.blog_right_sidebar .widget_title {
  font-size: 20px;
  margin-bottom: 40px;
}

.blog_right_sidebar .widget_title::after {
  content: "";
  display: block;
  padding-top: 15px;
  border-bottom: 1px solid #f0e9ff;
}

.blog_right_sidebar .single_sidebar_widget {
  background: #fbf9ff;
  padding: 30px;
  margin-bottom: 30px;
}

.blog_right_sidebar .single_sidebar_widget .btn_1 {
  margin-top: 0px;
}

.blog_right_sidebar .search_widget .form-control {
  height: 50px;
  border-color: #f0e9ff;
  font-size: 13px;
  color: #999999;
  padding-left: 20px;
  border-radius: 0;
  border-right: 0;
}

.blog_right_sidebar .search_widget .form-control::-webkit-input-placeholder {
  color: #999999;
}

.blog_right_sidebar .search_widget .form-control:-ms-input-placeholder {
  color: #999999;
}

.blog_right_sidebar .search_widget .form-control::-ms-input-placeholder {
  color: #999999;
}

.blog_right_sidebar .search_widget .form-control::placeholder {
  color: #999999;
}

.blog_right_sidebar .search_widget .form-control:focus {
  border-color: #f0e9ff;
  outline: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.blog_right_sidebar .search_widget .input-group button {
  background: #c9252b;
  border-left: 0;
  border: 1px solid #f0e9ff;
  padding: 4px 15px;
  border-left: 0;
  cursor: pointer;
}

.blog_right_sidebar .search_widget .input-group button i {
  color: #fff;
}

.blog_right_sidebar .search_widget .input-group button span {
  font-size: 14px;
  color: #999999;
}

.blog_right_sidebar .newsletter_widget .form-control {
  height: 50px;
  border-color: #f0e9ff;
  font-size: 13px;
  color: #999999;
  padding-left: 20px;
  border-radius: 0;
}

.blog_right_sidebar .newsletter_widget .form-control::-webkit-input-placeholder {
  color: #999999;
}

.blog_right_sidebar .newsletter_widget .form-control:-ms-input-placeholder {
  color: #999999;
}

.blog_right_sidebar .newsletter_widget .form-control::-ms-input-placeholder {
  color: #999999;
}

.blog_right_sidebar .newsletter_widget .form-control::placeholder {
  color: #999999;
}

.blog_right_sidebar .newsletter_widget .form-control:focus {
  border-color: #f0e9ff;
  outline: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.blog_right_sidebar .newsletter_widget .input-group button {
  background: #fff;
  border-left: 0;
  border: 1px solid #f0e9ff;
  padding: 4px 15px;
  border-left: 0;
}

.blog_right_sidebar .newsletter_widget .input-group button i,
.blog_right_sidebar .newsletter_widget .input-group button span {
  font-size: 14px;
  color: #fff;
}

.blog_right_sidebar .post_category_widget .cat-list li {
  border-bottom: 1px solid #f0e9ff;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  padding-bottom: 12px;
}

.blog_right_sidebar .post_category_widget .cat-list li:last-child {
  border-bottom: 0;
}

.blog_right_sidebar .post_category_widget .cat-list li a {
  font-size: 14px;
  line-height: 20px;
  color: #888888;
}

.blog_right_sidebar .post_category_widget .cat-list li a p {
  margin-bottom: 0px;
}

.blog_right_sidebar .post_category_widget .cat-list li+li {
  padding-top: 15px;
}

.blog_right_sidebar .popular_post_widget .post_item .media-body {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
  padding-left: 20px;
}

.blog_right_sidebar .popular_post_widget .post_item .media-body h3 {
  font-size: 16px;
  line-height: 20px;
  margin-bottom: 6px;
  -webkit-transition: all 0.3s linear;
  transition: all 0.3s linear;
}

.blog_right_sidebar .popular_post_widget .post_item .media-body a:hover {
  color: #fff;
}

.blog_right_sidebar .popular_post_widget .post_item .media-body p {
  font-size: 14px;
  line-height: 21px;
  margin-bottom: 0px;
}

.blog_right_sidebar .popular_post_widget .post_item+.post_item {
  margin-top: 20px;
}

.blog_right_sidebar .tag_cloud_widget ul li {
  display: inline-block;
}

.blog_right_sidebar .tag_cloud_widget ul li a {
  display: inline-block;
  border: 1px solid #eeeeee;
  background: #fff;
  padding: 4px 20px;
  margin-bottom: 8px;
  margin-right: 3px;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  color: #888888;
  font-size: 13px;
}

.blog_right_sidebar .tag_cloud_widget ul li a:hover {
  background: #c9252b;
  color: #fff !important;
  -webkit-text-fill-color: #fff;
  text-decoration: none;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

.blog_right_sidebar .instagram_feeds .instagram_row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-right: -6px;
  margin-left: -6px;
}

.blog_right_sidebar .instagram_feeds .instagram_row li {
  width: 33.33%;
  float: left;
  padding-right: 6px;
  padding-left: 6px;
  margin-bottom: 15px;
}

.blog_right_sidebar .br {
  width: 100%;
  height: 1px;
  background: #eeeeee;
  margin: 30px 0px;
}

.blog-pagination {
  margin-top: 80px;
}

.blog-pagination .page-link {
  font-size: 14px;
  position: relative;
  display: block;
  padding: 0;
  text-align: center;
  margin-left: -1px;
  line-height: 45px;
  width: 45px;
  height: 45px;
  border-radius: 0 !important;
  color: #8a8a8a;
  border: 1px solid #f0e9ff;
  margin-right: 10px;
}

.blog-pagination .page-link i,
.blog-pagination .page-link span {
  font-size: 13px;
}

.blog-pagination .page-item.active .page-link {
  background-color: #fbf9ff;
  border-color: #f0e9ff;
  color: #888888;
}

.blog-pagination .page-item:last-child .page-link {
  margin-right: 0;
}

/*============ Start Blog Single Styles  =============*/
.single-post-area .blog_details {
  -webkit-box-shadow: none;
  box-shadow: none;
  padding: 0;
}

.single-post-area .social-links {
  padding-top: 10px;
}

.single-post-area .social-links li {
  display: inline-block;
  margin-bottom: 10px;
}

.single-post-area .social-links li a {
  color: #cccccc;
  padding: 7px;
  font-size: 14px;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.single-post-area .blog_details {
  padding-top: 26px;
}

.single-post-area .blog_details p {
  margin-bottom: 20px;
  font-size: 15px;
}

.single-post-area .quote-wrapper {
  background: rgba(130, 139, 178, 0.1);
  padding: 15px;
  line-height: 1.733;
  color: #888888;
  font-style: italic;
  margin-top: 25px;
  margin-bottom: 25px;
}

@media (min-width: 768px) {
  .single-post-area .quote-wrapper {
    padding: 30px;
  }
}

.single-post-area .quotes {
  background: #fff;
  padding: 15px 15px 15px 20px;
  border-left: 2px solid;
}

@media (min-width: 768px) {
  .single-post-area .quotes {
    padding: 25px 25px 25px 30px;
  }
}

.single-post-area .arrow {
  position: absolute;
}

.single-post-area .arrow .lnr {
  font-size: 20px;
  font-weight: 600;
}

.single-post-area .thumb .overlay-bg {
  background: rgba(0, 0, 0, 0.8);
}

.single-post-area .navigation-top {
  padding-top: 15px;
  border-top: 1px solid #f0e9ff;
}

.single-post-area .navigation-top p {
  margin-bottom: 0;
}

.single-post-area .navigation-top .like-info {
  font-size: 14px;
}

.single-post-area .navigation-top .like-info i,
.single-post-area .navigation-top .like-info span {
  font-size: 16px;
  margin-right: 5px;
}

.single-post-area .navigation-top .comment-count {
  font-size: 14px;
}

.single-post-area .navigation-top .comment-count i,
.single-post-area .navigation-top .comment-count span {
  font-size: 16px;
  margin-right: 5px;
}

.single-post-area .navigation-top .social-icons li {
  display: inline-block;
  margin-right: 15px;
}

.single-post-area .navigation-top .social-icons li:last-child {
  margin: 0;
}

.single-post-area .navigation-top .social-icons li i,
.single-post-area .navigation-top .social-icons li span {
  font-size: 14px;
  color: #999999;
}

.single-post-area .blog-author {
  padding: 40px 30px;
  background: #fbf9ff;
  margin-top: 50px;
}

@media (max-width: 600px) {
  .single-post-area .blog-author {
    padding: 20px 8px;
  }
}

.single-post-area .blog-author img {
  width: 90px;
  height: 90px;
  border-radius: 50%;
  margin-right: 30px;
}

@media (max-width: 600px) {
  .single-post-area .blog-author img {
    margin-right: 15px;
    width: 45px;
    height: 45px;
  }
}

.single-post-area .blog-author a {
  display: inline-block;
}

.single-post-area .blog-author a:hover {
  color: #c9252a00;
}

.single-post-area .blog-author p {
  margin-bottom: 0;
  font-size: 15px;
}

.single-post-area .blog-author h4 {
  font-size: 16px;
}

.single-post-area .navigation-area {
  border-bottom: 1px solid #eee;
  padding-bottom: 30px;
  margin-top: 55px;
}

.single-post-area .navigation-area p {
  margin-bottom: 0px;
}

.single-post-area .navigation-area h4 {
  font-size: 18px;
  line-height: 25px;
}

.single-post-area .navigation-area .nav-left {
  text-align: left;
}

.single-post-area .navigation-area .nav-left .thumb {
  margin-right: 20px;
  background: #000;
}

.single-post-area .navigation-area .nav-left .thumb img {
  -webkit-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

.single-post-area .navigation-area .nav-left .lnr {
  margin-left: 20px;
  opacity: 0;
  -webkit-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

.single-post-area .navigation-area .nav-left:hover .lnr {
  opacity: 1;
}

.single-post-area .navigation-area .nav-left:hover .thumb img {
  opacity: .5;
}

@media (max-width: 767px) {
  .single-post-area .navigation-area .nav-left {
    margin-bottom: 30px;
  }
}

.single-post-area .navigation-area .nav-right {
  text-align: right;
}

.single-post-area .navigation-area .nav-right .thumb {
  margin-left: 20px;
  background: #000;
}

.single-post-area .navigation-area .nav-right .thumb img {
  -webkit-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

.single-post-area .navigation-area .nav-right .lnr {
  margin-right: 20px;
  opacity: 0;
  -webkit-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

.single-post-area .navigation-area .nav-right:hover .lnr {
  opacity: 1;
}

.single-post-area .navigation-area .nav-right:hover .thumb img {
  opacity: .5;
}

@media (max-width: 991px) {
  .single-post-area .sidebar-widgets {
    padding-bottom: 0px;
  }
}

.comments-area {
  background: transparent;
  border-top: 1px solid #eee;
  padding: 45px 0;
  margin-top: 50px;
}

@media (max-width: 414px) {
  .comments-area {
    padding: 50px 8px;
  }
}

.comments-area h4 {
  margin-bottom: 35px;
  font-size: 18px;
}

.comments-area h5 {
  font-size: 16px;
  margin-bottom: 0px;
}

.comments-area .comment-list {
  padding-bottom: 48px;
}

.comments-area .comment-list:last-child {
  padding-bottom: 0px;
}

.comments-area .comment-list.left-padding {
  padding-left: 25px;
}

@media (max-width: 413px) {
  .comments-area .comment-list .single-comment h5 {
    font-size: 12px;
  }

  .comments-area .comment-list .single-comment .date {
    font-size: 11px;
  }

  .comments-area .comment-list .single-comment .comment {
    font-size: 10px;
  }
}

.comments-area .thumb {
  margin-right: 20px;
}

.comments-area .thumb img {
  width: 70px;
  border-radius: 50%;
}

.comments-area .date {
  font-size: 14px;
  color: #999999;
  margin-bottom: 0;
  margin-left: 20px;
}

.comments-area .comment {
  margin-bottom: 10px;
  color: #777777;
  font-size: 15px;
}

.comments-area .btn-reply {
  background-color: transparent;
  color: #888888;
  padding: 5px 18px;
  font-size: 14px;
  display: block;
  font-weight: 400;
}

.comment-form {
  border-top: 1px solid #eee;
  padding-top: 45px;
  margin-top: 50px;
  margin-bottom: 20px;
}

.comment-form .form-group {
  margin-bottom: 30px;
}

.comment-form h4 {
  margin-bottom: 40px;
  font-size: 18px;
  line-height: 22px;
}

.comment-form .name {
  padding-left: 0px;
}

@media (max-width: 767px) {
  .comment-form .name {
    padding-right: 0px;
    margin-bottom: 1rem;
  }
}

.comment-form .email {
  padding-right: 0px;
}

@media (max-width: 991px) {
  .comment-form .email {
    padding-left: 0px;
  }
}

.comment-form .form-control {
  border: 1px solid #f0e9ff;
  border-radius: 5px;
  height: 48px;
  padding-left: 18px;
  font-size: 13px;
  background: transparent;
}

.comment-form .form-control:focus {
  outline: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.comment-form .form-control::-webkit-input-placeholder {
  font-weight: 300;
  color: #999999;
}

.comment-form .form-control:-ms-input-placeholder {
  font-weight: 300;
  color: #999999;
}

.comment-form .form-control::-ms-input-placeholder {
  font-weight: 300;
  color: #999999;
}

.comment-form .form-control::placeholder {
  font-weight: 300;
  color: #999999;
}

.comment-form .form-control::-webkit-input-placeholder {
  color: #777777;
}

.comment-form .form-control:-ms-input-placeholder {
  color: #777777;
}

.comment-form .form-control::-ms-input-placeholder {
  color: #777777;
}

.comment-form .form-control::placeholder {
  color: #777777;
}

.comment-form textarea {
  padding-top: 18px;
  border-radius: 12px;
  height: 100% !important;
}

.comment-form ::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  font-size: 13px;
  color: #777;
}

.comment-form ::-moz-placeholder {
  /* Firefox 19+ */
  font-size: 13px;
  color: #777;
}

.comment-form :-ms-input-placeholder {
  /* IE 10+ */
  font-size: 13px;
  color: #777;
}

.comment-form :-moz-placeholder {
  /* Firefox 18- */
  font-size: 13px;
  color: #777;
}

/*============ End Blog Single Styles  =============*/
/*=================== contact banner start ====================*/
.dropdown .dropdown-menu {
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.contact-info {
  margin-bottom: 25px;
}

.contact-info__icon {
  margin-right: 20px;
}

.contact-info__icon i,
.contact-info__icon span {
  color: #8f9195;
  font-size: 27px;
}

.contact-info .media-body h3 {
  font-size: 16px;
  margin-bottom: 0;
  font-size: 16px;
  color: #2a2a2a;
}

.contact-info .media-body h3 a:hover {
  color: #1f2b7b;
}

.contact-info .media-body p {
  color: #8a8a8a;
}

/*=================== contact banner end ====================*/
/*=================== contact form start ====================*/
.contact-title {
  font-size: 27px;
  font-weight: 600;
  margin-bottom: 20px;
}

.form-contact label {
  font-size: 14px;
}

.form-contact .form-group {
  margin-bottom: 30px;
}

.form-contact .form-control {
  border: 1px solid #e5e6e9;
  border-radius: 0px;
  height: 48px;
  padding-left: 18px;
  font-size: 13px;
  background: transparent;
}

.form-contact .form-control:focus {
  outline: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.form-contact .form-control::-webkit-input-placeholder {
  font-weight: 300;
  color: #999999;
}

.form-contact .form-control:-ms-input-placeholder {
  font-weight: 300;
  color: #999999;
}

.form-contact .form-control::-ms-input-placeholder {
  font-weight: 300;
  color: #999999;
}

.form-contact .form-control::placeholder {
  font-weight: 300;
  color: #999999;
}

.form-contact textarea {
  border-radius: 0px;
  height: 100% !important;
}

/*=================== contact form end ====================*/
/* Contact Success and error Area css
============================================================================================ */
.modal-message .modal-dialog {
  position: absolute;
  top: 36%;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%) !important;
  transform: translateX(-50%) translateY(-50%) !important;
  margin: 0px;
  max-width: 500px;
  width: 100%;
}

.modal-message .modal-dialog .modal-content .modal-header {
  text-align: center;
  display: block;
  border-bottom: none;
  padding-top: 50px;
  padding-bottom: 50px;
}

.modal-message .modal-dialog .modal-content .modal-header .close {
  position: absolute;
  right: -15px;
  top: -15px;
  padding: 0px;
  color: #fff;
  opacity: 1;
  cursor: pointer;
}

.modal-message .modal-dialog .modal-content .modal-header h2 {
  display: block;
  text-align: center;
  padding-bottom: 10px;
}

.modal-message .modal-dialog .modal-content .modal-header p {
  display: block;
}

.contact-section {
  padding: 130px 0 100px;
}

@media (max-width: 991px) {
  .contact-section {
    padding: 70px 0 40px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .contact-section {
    padding: 80px 0 50px;
  }
}

.contact-section .btn_2 {
  background-color: #191d34;
  padding: 18px 60px;
  border-radius: 50px;
  margin-top: 0;
}

.contact-section .btn_2:hover {
  background-color: #1f2b7b;
}

.breadcam_bg {
  background-image: url(../img/banner/bradcam.png);
}

.breadcam_bg_1 {
  background-image: url(../img/banner/bradcam2.png);
}

.breadcam_bg_2 {
  background-image: url(../img/banner/bradcam3.png);
}

.bradcam_area {
  background-size: cover;
  background-position: center center;
  padding: 160px 0;
  background-position: bottom;
  background-repeat: no-repeat;
}

@media (max-width: 767px) {
  .bradcam_area {
    padding: 150px 0;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .bradcam_area {
    padding: 150px 0;
  }
}

.bradcam_area h3 {
  font-size: 50px;
  color: #fff;
  font-weight: 900;
  margin-bottom: 0;
  font-family: "Roboto Slab", sans-serif;
  text-transform: capitalize;
}

@media (max-width: 767px) {
  .bradcam_area h3 {
    font-size: 30px;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .bradcam_area h3 {
    font-size: 40px;
  }
}

.popup_box {
  background: #fff;
  display: inline-block;
  z-index: 9;
  width: 681px;
  padding: 60px 40px;
}

@media (max-width: 767px) {
  .popup_box {
    width: 320px;
    padding: 45px 30px;
  }
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
  .popup_box {
    width: 420px !important;
    padding: 45px 30px;
  }
}

.popup_box h3 {
  text-align: center;
  font-size: 22px;
  color: #1F1F1F;
  margin-bottom: 46px;
}

.popup_box .boxed-btn3 {
  width: 100%;
  text-transform: capitalize;
}

.popup_box .nice-select {
  -webkit-tap-highlight-color: transparent;
  background-color: #fff;
  /* border-radius: 5px; */
  border: solid 1px #E2E2E2;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  clear: both;
  cursor: pointer;
  display: block;
  float: left;
  font-family: "Roboto Slab", sans-serif;
  font-weight: normal;
  width: 100% !important;
  /* height: 42px; */
  line-height: 50px;
  outline: none;
  padding-left: 18px;
  padding-right: 30px;
  position: relative;
  text-align: left !important;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  white-space: nowrap;
  width: auto;
  border-radius: 0;
  margin-bottom: 30px;
  height: 50px !important;
  font-size: 16px;
  font-weight: 400;
  color: #919191;
}

.popup_box .nice-select::after {
  content: "\f0d7";
  display: block;
  height: 5px;
  margin-top: -5px;
  pointer-events: none;
  position: absolute;
  right: 17px;
  top: 3px;
  -webkit-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
  width: 5px;
  font-family: fontawesome;
  color: #919191;
  font-size: 15px;
}

.popup_box .nice-select.open .list {
  opacity: 1;
  pointer-events: auto;
  -webkit-transform: scale(1) translateY(0);
  transform: scale(1) translateY(0);
  height: 200px;
  overflow-y: scroll;
}

.popup_box .nice-select.list {
  height: 200px;
  overflow-y: scroll;
}

#test-form {
  display: inline-block;
  margin: auto;
  text-align: center;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

@media (max-width: 767px) {
  #test-form {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: none;
    transform: none;
  }
}

#test-form .mfp-close-btn-in .mfp-close {
  color: #333;
  display: none !important;
}

#test-form button.mfp-close {
  display: none !important;
}

@media (max-width: 767px) {
  #test-form button.mfp-close {
    display: block !important;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
  }
}

#test-form button.mfp-close {
  overflow: visible;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
  display: block;
  outline: none;
  padding: 0;
  z-index: 1046;
  -webkit-box-shadow: none;
  box-shadow: none;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  width: 40px;
  height: 40px;
  background: #4A3600;
  text-align: center;
  line-height: 20px;
  position: absolute;
  right: 0;
  border-bottom-right-radius: 20px;
  border-bottom-left-radius: 20px;
  position: absolute;
  right: -6px;
  color: #fff !important;
}

.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1042;
  overflow: hidden;
  position: fixed;
  background: #4A3600;
  opacity: 0.6;
}

@media (max-width: 767px) {
  .gj-picker.gj-picker-md.timepicker {
    width: 310px;
    left: 6px !important;
  }
}

@media (max-width: 767px) {
  .gj-picker.gj-picker-md.datepicker.gj-unselectable {
    width: 320px;
    left: 0 !important;
  }
}

.flex-center-start {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: start;
}

.overlay::before {
  background-image: -ms-linear-gradient(170deg, rgba(34, 34, 34, 0) 0%, black 100%);
}

.sample-text-area {
  background: #fff;
  padding: 100px 0 70px 0;
}

.text-heading {
  margin-bottom: 30px;
  font-size: 24px;
}

b,
sup,
sub,
u,
del {
  color: #1f2b7b;
}

.typography h1,
.typography h2,
.typography h3,
.typography h4,
.typography h5,
.typography h6 {
  color: #828bb2;
}

.button-area {
  background: #fff;
}

.button-area .border-top-generic {
  padding: 70px 15px;
  border-top: 1px dotted #eee;
}

.button-group-area .genric-btn {
  margin-right: 10px;
  margin-top: 10px;
}

.button-group-area .genric-btn:last-child {
  margin-right: 0;
}

.genric-btn {
  display: inline-block;
  outline: none;
  line-height: 40px;
  padding: 0 30px;
  font-size: .8em;
  text-align: center;
  text-decoration: none;
  font-weight: 500;
  cursor: pointer;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.genric-btn:focus {
  outline: none;
}

.genric-btn.e-large {
  padding: 0 40px;
  line-height: 50px;
}

.genric-btn.large {
  line-height: 45px;
}

.genric-btn.medium {
  line-height: 30px;
}

.genric-btn.small {
  line-height: 25px;
}

.genric-btn.radius {
  border-radius: 3px;
}

.genric-btn.circle {
  border-radius: 20px;
}

.genric-btn.arrow {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.genric-btn.arrow span {
  margin-left: 10px;
}

.genric-btn.default {
  color: #415094;
  background: #f9f9ff;
  border: 1px solid transparent;
}

.genric-btn.default:hover {
  border: 1px solid #f9f9ff;
  background: #fff;
}

.genric-btn.default-border {
  border: 1px solid #f9f9ff;
  background: #fff;
}

.genric-btn.default-border:hover {
  color: #415094;
  background: #f9f9ff;
  border: 1px solid transparent;
}

.genric-btn.primary {
  color: #fff;
  background: #1f2b7b;
  border: 1px solid transparent;
}

.genric-btn.primary:hover {
  color: #1f2b7b;
  border: 1px solid #1f2b7b;
  background: #fff;
}

.genric-btn.primary-border {
  color: #1f2b7b;
  border: 1px solid #1f2b7b;
  background: #fff;
}

.genric-btn.primary-border:hover {
  color: #fff;
  background: #1f2b7b;
  border: 1px solid transparent;
}

.genric-btn.success {
  color: #fff;
  background: #4cd3e3;
  border: 1px solid transparent;
}

.genric-btn.success:hover {
  color: #4cd3e3;
  border: 1px solid #4cd3e3;
  background: #fff;
}

.genric-btn.success-border {
  color: #4cd3e3;
  border: 1px solid #4cd3e3;
  background: #fff;
}

.genric-btn.success-border:hover {
  color: #fff;
  background: #4cd3e3;
  border: 1px solid transparent;
}

.genric-btn.info {
  color: #fff;
  background: #38a4ff;
  border: 1px solid transparent;
}

.genric-btn.info:hover {
  color: #38a4ff;
  border: 1px solid #38a4ff;
  background: #fff;
}

.genric-btn.info-border {
  color: #38a4ff;
  border: 1px solid #38a4ff;
  background: #fff;
}

.genric-btn.info-border:hover {
  color: #fff;
  background: #38a4ff;
  border: 1px solid transparent;
}

.genric-btn.warning {
  color: #fff;
  background: #f4e700;
  border: 1px solid transparent;
}

.genric-btn.warning:hover {
  color: #f4e700;
  border: 1px solid #f4e700;
  background: #fff;
}

.genric-btn.warning-border {
  color: #f4e700;
  border: 1px solid #f4e700;
  background: #fff;
}

.genric-btn.warning-border:hover {
  color: #fff;
  background: #f4e700;
  border: 1px solid transparent;
}

.genric-btn.danger {
  color: #fff;
  background: #f44a40;
  border: 1px solid transparent;
}

.genric-btn.danger:hover {
  color: #f44a40;
  border: 1px solid #f44a40;
  background: #fff;
}

.genric-btn.danger-border {
  color: #f44a40;
  border: 1px solid #f44a40;
  background: #fff;
}

.genric-btn.danger-border:hover {
  color: #fff;
  background: #f44a40;
  border: 1px solid transparent;
}

.genric-btn.link {
  color: #415094;
  background: #f9f9ff;
  text-decoration: underline;
  border: 1px solid transparent;
}

.genric-btn.link:hover {
  color: #415094;
  border: 1px solid #f9f9ff;
  background: #fff;
}

.genric-btn.link-border {
  color: #415094;
  border: 1px solid #f9f9ff;
  background: #fff;
  text-decoration: underline;
}

.genric-btn.link-border:hover {
  color: #415094;
  background: #f9f9ff;
  border: 1px solid transparent;
}

.genric-btn.disable {
  color: #222222, 0.3;
  background: #f9f9ff;
  border: 1px solid transparent;
  cursor: not-allowed;
}

.generic-blockquote {
  padding: 30px 50px 30px 30px;
  background: #f9f9ff;
  border-left: 2px solid #1f2b7b;
}

.progress-table-wrap {
  overflow-x: scroll;
}

.progress-table {
  background: #f9f9ff;
  padding: 15px 0px 30px 0px;
  min-width: 800px;
}

.progress-table .serial {
  width: 11.83%;
  padding-left: 30px;
}

.progress-table .country {
  width: 28.07%;
}

.progress-table .visit {
  width: 19.74%;
}

.progress-table .percentage {
  width: 40.36%;
  padding-right: 50px;
}

.progress-table .table-head {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.progress-table .table-head .serial,
.progress-table .table-head .country,
.progress-table .table-head .visit,
.progress-table .table-head .percentage {
  color: #415094;
  line-height: 40px;
  text-transform: uppercase;
  font-weight: 500;
}

.progress-table .table-row {
  padding: 15px 0;
  border-top: 1px solid #edf3fd;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.progress-table .table-row .serial,
.progress-table .table-row .country,
.progress-table .table-row .visit,
.progress-table .table-row .percentage {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.progress-table .table-row .country img {
  margin-right: 15px;
}

.progress-table .table-row .percentage .progress {
  width: 80%;
  border-radius: 0px;
  background: transparent;
}

.progress-table .table-row .percentage .progress .progress-bar {
  height: 5px;
  line-height: 5px;
}

.progress-table .table-row .percentage .progress .progress-bar.color-1 {
  background-color: #6382e6;
}

.progress-table .table-row .percentage .progress .progress-bar.color-2 {
  background-color: #e66686;
}

.progress-table .table-row .percentage .progress .progress-bar.color-3 {
  background-color: #f09359;
}

.progress-table .table-row .percentage .progress .progress-bar.color-4 {
  background-color: #73fbaf;
}

.progress-table .table-row .percentage .progress .progress-bar.color-5 {
  background-color: #73fbaf;
}

.progress-table .table-row .percentage .progress .progress-bar.color-6 {
  background-color: #6382e6;
}

.progress-table .table-row .percentage .progress .progress-bar.color-7 {
  background-color: #a367e7;
}

.progress-table .table-row .percentage .progress .progress-bar.color-8 {
  background-color: #e66686;
}

.single-gallery-image {
  margin-top: 30px;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
  height: 200px;
}

.list-style {
  width: 14px;
  height: 14px;
}

.unordered-list li {
  position: relative;
  padding-left: 30px;
  line-height: 1.82em !important;
}

.unordered-list li:before {
  content: "";
  position: absolute;
  width: 14px;
  height: 14px;
  border: 3px solid #1f2b7b;
  background: #fff;
  top: 4px;
  left: 0;
  border-radius: 50%;
}

.ordered-list {
  margin-left: 30px;
}

.ordered-list li {
  list-style-type: decimal-leading-zero;
  color: #1f2b7b;
  font-weight: 500;
  line-height: 1.82em !important;
}

.ordered-list li span {
  font-weight: 300;
  color: #828bb2;
}

.ordered-list-alpha li {
  margin-left: 30px;
  list-style-type: lower-alpha;
  color: #1f2b7b;
  font-weight: 500;
  line-height: 1.82em !important;
}

.ordered-list-alpha li span {
  font-weight: 300;
  color: #828bb2;
}

.ordered-list-roman li {
  margin-left: 30px;
  list-style-type: lower-roman;
  color: #1f2b7b;
  font-weight: 500;
  line-height: 1.82em !important;
}

.ordered-list-roman li span {
  font-weight: 300;
  color: #828bb2;
}

.single-input {
  display: block;
  width: 100%;
  line-height: 40px;
  border: none;
  outline: none;
  background: #f9f9ff;
  padding: 0 20px;
}

.single-input:focus {
  outline: none;
}

.input-group-icon {
  position: relative;
}

.input-group-icon .icon {
  position: absolute;
  left: 20px;
  top: 0;
  line-height: 40px;
  z-index: 3;
}

.input-group-icon .icon i {
  color: #797979;
}

.input-group-icon .single-input {
  padding-left: 45px;
}

.single-textarea {
  display: block;
  width: 100%;
  line-height: 40px;
  border: none;
  outline: none;
  background: #f9f9ff;
  padding: 0 20px;
  height: 100px;
  resize: none;
}

.single-textarea:focus {
  outline: none;
}

.single-input-primary {
  display: block;
  width: 100%;
  line-height: 40px;
  border: 1px solid transparent;
  outline: none;
  background: #f9f9ff;
  padding: 0 20px;
}

.single-input-primary:focus {
  outline: none;
  border: 1px solid #1f2b7b;
}

.single-input-accent {
  display: block;
  width: 100%;
  line-height: 40px;
  border: 1px solid transparent;
  outline: none;
  background: #f9f9ff;
  padding: 0 20px;
}

.single-input-accent:focus {
  outline: none;
  border: 1px solid #eb6b55;
}

.single-input-secondary {
  display: block;
  width: 100%;
  line-height: 40px;
  border: 1px solid transparent;
  outline: none;
  background: #f9f9ff;
  padding: 0 20px;
}

.single-input-secondary:focus {
  outline: none;
  border: 1px solid #f09359;
}

.default-switch {
  width: 35px;
  height: 17px;
  border-radius: 8.5px;
  background: #f9f9ff;
  position: relative;
  cursor: pointer;
}

.default-switch input {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.default-switch input+label {
  position: absolute;
  top: 1px;
  left: 1px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #1f2b7b;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  -webkit-box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.2);
  cursor: pointer;
}

.default-switch input:checked+label {
  left: 19px;
}

.primary-switch {
  width: 35px;
  height: 17px;
  border-radius: 8.5px;
  background: #f9f9ff;
  position: relative;
  cursor: pointer;
}

.primary-switch input {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.primary-switch input+label {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

.primary-switch input+label:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  border-radius: 8.5px;
  cursor: pointer;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.primary-switch input+label:after {
  content: "";
  position: absolute;
  top: 1px;
  left: 1px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #fff;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  -webkit-box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.2);
  cursor: pointer;
}

.primary-switch input:checked+label:after {
  left: 19px;
}

.primary-switch input:checked+label:before {
  background: #1f2b7b;
}

.confirm-switch {
  width: 35px;
  height: 17px;
  border-radius: 8.5px;
  background: #f9f9ff;
  position: relative;
  cursor: pointer;
}

.confirm-switch input {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.confirm-switch input+label {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

.confirm-switch input+label:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  border-radius: 8.5px;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  cursor: pointer;
}

.confirm-switch input+label:after {
  content: "";
  position: absolute;
  top: 1px;
  left: 1px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #fff;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  -webkit-box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.2);
  cursor: pointer;
}

.confirm-switch input:checked+label:after {
  left: 19px;
}

.confirm-switch input:checked+label:before {
  background: #4cd3e3;
}

.primary-checkbox {
  width: 16px;
  height: 16px;
  border-radius: 3px;
  background: #f9f9ff;
  position: relative;
  cursor: pointer;
}

.primary-checkbox input {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.primary-checkbox input+label {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  border-radius: 3px;
  cursor: pointer;
  border: 1px solid #f1f1f1;
}

.primary-checkbox input:checked+label {
  background: url(../img/elements/primary-check.png) no-repeat center center/cover;
  border: none;
}

.Select_multi_lague {
  position: absolute;
  width: 89px;
  height: 50px;
  z-index: 2147483647;
  border-style: none;
  background: transparent;
  top: 5px;
  left: 25px;
  opacity: 0.5;
  font-size: 13px;
  display: none;
}

@media only screen and (min-width:360px) and (max-width:414px) {
  .Select_multi_lague {
    position: absolute;
    width: 90px;
    height: 52px;
    z-index: 2147483647;
    border-style: none;
    background: transparent;
    top: 5px;
    left: 274px;
    opacity: 0.5;
    font-size: 13px;
    display: none;
  }
}

@media only screen and (min-width:768px) and (max-width:820px) {
  .Select_multi_lague {
    position: absolute;
    width: 94px;
    height: 52px;
    z-index: 2147483647;
    border-style: none;
    background: transparent;
    top: 24px;
    left: 627px;
    opacity: 0.5;
    font-size: 13px;
    display: none;
  }
}

.confirm-checkbox {
  width: 16px;
  height: 16px;
  border-radius: 3px;
  background: #f9f9ff;
  position: relative;
  cursor: pointer;
}

.confirm-checkbox input {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.confirm-checkbox input+label {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  border-radius: 3px;
  cursor: pointer;
  border: 1px solid #f1f1f1;
}

.confirm-checkbox input:checked+label {
  background: url(../img/elements/success-check.png) no-repeat center center/cover;
  border: none;
}

.disabled-checkbox {
  width: 16px;
  height: 16px;
  border-radius: 3px;
  background: #f9f9ff;
  position: relative;
  cursor: pointer;
}

.disabled-checkbox input {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.disabled-checkbox input+label {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  border-radius: 3px;
  cursor: pointer;
  border: 1px solid #f1f1f1;
}

.disabled-checkbox input:disabled {
  cursor: not-allowed;
  z-index: 3;
}

.disabled-checkbox input:checked+label {
  background: url(../img/elements/disabled-check.png) no-repeat center center/cover;
  border: none;
}

.primary-radio {
  width: 16px;
  height: 16px;
  border-radius: 8px;
  background: #f9f9ff;
  position: relative;
  cursor: pointer;
}

.primary-radio input {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.primary-radio input+label {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  border-radius: 8px;
  cursor: pointer;
  border: 1px solid #f1f1f1;
}

.primary-radio input:checked+label {
  background: url(../img/elements/primary-radio.png) no-repeat center center/cover;
  border: none;
}

.confirm-radio {
  width: 16px;
  height: 16px;
  border-radius: 8px;
  background: #f9f9ff;
  position: relative;
  cursor: pointer;
}

.confirm-radio input {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.confirm-radio input+label {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  border-radius: 8px;
  cursor: pointer;
  border: 1px solid #f1f1f1;
}

.confirm-radio input:checked+label {
  background: url(../img/elements/success-radio.png) no-repeat center center/cover;
  border: none;
}

.disabled-radio {
  width: 16px;
  height: 16px;
  border-radius: 8px;
  background: #f9f9ff;
  position: relative;
  cursor: pointer;
}

.disabled-radio input {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.disabled-radio input+label {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  border-radius: 8px;
  cursor: pointer;
  border: 1px solid #f1f1f1;
}

.disabled-radio input:disabled {
  cursor: not-allowed;
  z-index: 3;
}

.disabled-radio input:checked+label {
  background: url(../img/elements/disabled-radio.png) no-repeat center center/cover;
  border: none;
}

.default-select {
  height: 40px;
}

.default-select .nice-select {
  border: none;
  border-radius: 0px;
  height: 40px;
  background: #f9f9ff;
  padding-left: 20px;
  padding-right: 40px;
}

.default-select .nice-select .list {
  margin-top: 0;
  border: none;
  border-radius: 0px;
  -webkit-box-shadow: none;
  box-shadow: none;
  width: 100%;
  padding: 10px 0 10px 0px;
}

.default-select .nice-select .list .option {
  font-weight: 300;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  line-height: 28px;
  min-height: 28px;
  font-size: 12px;
  padding-left: 20px;
}

.default-select .nice-select .list .option.selected {
  color: #1f2b7b;
  background: transparent;
}

.default-select .nice-select .list .option:hover {
  color: #1f2b7b;
  background: transparent;
}

.default-select .current {
  margin-right: 50px;
  font-weight: 300;
}

.default-select .nice-select::after {
  right: 20px;
}

.form-select {
  height: 40px;
  width: 100%;
}

.form-select .nice-select {
  border: none;
  border-radius: 0px;
  height: 40px;
  background: #f9f9ff;
  padding-left: 45px;
  padding-right: 40px;
  width: 100%;
}

.form-select .nice-select .list {
  margin-top: 0;
  border: none;
  border-radius: 0px;
  -webkit-box-shadow: none;
  box-shadow: none;
  width: 100%;
  padding: 10px 0 10px 0px;
}

.form-select .nice-select .list .option {
  font-weight: 300;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  line-height: 28px;
  min-height: 28px;
  font-size: 12px;
  padding-left: 45px;
}

.form-select .nice-select .list .option.selected {
  color: #1f2b7b;
  background: transparent;
}

.form-select .nice-select .list .option:hover {
  color: #1f2b7b;
  background: transparent;
}

.form-select .current {
  margin-right: 50px;
  font-weight: 300;
}

.form-select .nice-select::after {
  right: 20px;
}

.mt-10 {
  margin-top: 10px;
}

.section-top-border {
  padding: 50px 0;
  border-top: 1px dotted #eee;
}

.mb-30 {
  margin-bottom: 30px;
}

.mt-30 {
  margin-top: 30px;
}

.switch-wrap {
  margin-bottom: 10px;
}

/*# sourceMappingURL=style.css.map */


/* Card (Power Area ) - Index Page */

.power-area,
.power-area:before,
.power-area:after {
  box-sizing: border-box;
}

.power-area {
  user-select: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  transform-style: preserve-3d;
  margin: 0;
  padding: 0;
}

.power-area:focus {
  outline: none !important;
}

/* body{
  margin: 0;
  padding: 0;
  background: #131313;
  color: #f5f5f5;
  font-family: 'Fira Sans';
  text-align: left;
  overflow-x: hidden;
  overflow-y: hidden;
} */


.col_power-area:nth-of-type(1) {
  transform: rotateY(5deg) translateZ(34px) scale(.98);
}

.col_power-area:nth-of-type(3) {
  transform: rotateY(-5deg) translateZ(34px) scale(.98);
}

.col_power-area:hover,
.col_power-area:focus {
  transform: translateZ(34px);
  transition: transform 300ms cubic-bezier(0.390, 0.575, 0.565, 1.000), opacity 300ms ease;
}

.card-container {
  position: relative;
  width: 600px;
  height: 125px;
  margin-top: 12px;
  text-align: center;
  opacity: .89;
}

.card-container:hover,
.card-container:focus {
  opacity: 1;
}

.overlay {
  display: block;
  position: absolute;
  cursor: pointer;
  width: 50%;
  height: 50%;
  z-index: 1;
  transform: translateZ(34px);
}

.col_power-area {
  height: 100%;
  transition: transform 600ms cubic-bezier(0.390, 0.575, 0.565, 1.000), opacity 300ms ease;
  transform: translateZ(34px) scale(.98);
  flex: 0 0 33.3333%;
  position: relative;
}

.overlay:nth-of-type(1) {
  left: 0;
  top: 0;
}

.overlay:nth-of-type(2) {
  right: 0;
  top: 0;
}

.overlay:nth-of-type(3) {
  bottom: 0;
  right: 0;
}

.overlay:nth-of-type(4) {
  bottom: 0;
  left: 0;
}

.overlay:nth-of-type(1):hover~.card-power-area,
.overlay:nth-of-type(1):focus~.card-power-area {
  transform-origin: right top;
  transform: rotateX(3deg) rotateY(-3deg) translateZ(0);
}

.overlay:nth-of-type(2):hover~.card-power-area,
.overlay:nth-of-type(2):focus~.card-power-areard {
  transform-origin: left top;
  transform: rotateX(3deg) rotateY(3deg) translateZ(0);
}

.overlay:nth-of-type(3):hover~.card-power-area,
.overlay:nth-of-type(3):focus~.card-power-area {
  transform-origin: left bottom;
  transform: rotateX(-3deg) rotateY(3deg) translateZ(0);
}

.overlay:nth-of-type(4):hover~.card-power-area,
.overlay:nth-of-type(4):focus~.card-power-area {
  transform-origin: right bottom;
  transform: rotateX(-3deg) rotateY(-3deg) translateZ(0);
}

.card-power-area {
  border-radius: 5px;
  height: 100%;
  transition: all 300ms ease-out;
  align-items: center;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  position: relative;
  z-index: 0;
  opacity: .89;
  padding: 13px 21px;
}

.card-power-area:before,
.card-power-area:after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  width: 100%;
  height: 100%;
  opacity: .21;
  transition: transform 300ms ease;
  transform: scale(.98);
}

.card-power-area:before {
  background-size: cover;
  background-position: 50% 50%;
}

.card-container:hover .card-power-area:before,
.card-container:hover .card-power-area:after,
.card-container:focus .card-power-area:before,
.card-container:focus .cacard-power-areard:after {
  opacity: .34;
  transform: scale(1);
}

.col_power-area:nth-of-type(1) .card-container:nth-of-type(1) .card-power-area:before {
  background-image: url('https://www.nasa.gov/sites/default/files/styles/full_width/public/thumbnails/image/pia22474-2000.jpg?itok=cajl1lYH');
}

.col_power-area:nth-of-type(2) .card-container:nth-of-type(1) .card-power-area:before {
  background-image: url('https://www.nasa.gov/sites/default/files/styles/full_width/public/thumbnails/image/m18-090.jpg?itok=TQ8Fuk4x');
}

.col_power-area:nth-of-type(3) .card-container:nth-of-type(1) .card-power-area:before {
  background-image: url('https://www.nasa.gov/sites/default/files/styles/full_width/public/thumbnails/image/40808879360_18c96d62f1_o.jpg?itok=NttmTWPK');
}

.col_power-area:nth-of-type(1) .card-container:nth-of-type(2) .card-power-area:before {
  background-image: url('https://www.nasa.gov/sites/default/files/styles/full_width/public/thumbnails/image/jwst-pv-145604copy.jpg?itok=Jq7GN-Rc');
}

.col_power-area:nth-of-type(2) .card-container:nth-of-type(2) .card-power-area:before {
  background-image: url('https://www.nasa.gov/sites/default/files/styles/ubernode_alt_horiz/public/thumbnails/image/worldview201709201920x1080.png');
}

.col_power-area:nth-of-type(3) .card-container:nth-of-type(2) .card-power-area:before {
  background-image: url('https://www.nasa.gov/sites/default/files/styles/full_width/public/thumbnails/image/nasasibexobs.jpg?itok=U2LCp14i');
}

.col_power-area:nth-of-type(1) .card-container:nth-of-type(3) .card-power-area:before {
  background-image: url('https://www.nasa.gov/sites/default/files/styles/full_width/public/thumbnails/image/pia19808.jpg?itok=rgxgamMM');
}

.col_power-area:nth-of-type(2) .card-container:nth-of-type(3) .card-power-area:before {
  background-image: url('https://www.nasa.gov/sites/default/files/styles/full_width/public/thumbnails/image/e0102_lg.jpg?itok=sd9lOayI');
}

.col_power-area:nth-of-type(3) .card-container:nth-of-type(3) .card-power-area:before {
  background-image: url('https://www.nasa.gov/sites/default/files/styles/full_width/public/thumbnails/image/asteroid20180605-home.jpg?itok=KSUffiCR');
}

.card-power-area:after {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.89) 100%);
}

.card-power-area h4 {
  font-family: inherit;
  text-align: left;
  font-size: 20px;
  font-weight: 600;
  transform: translateY(5px);
  transition: transform 450ms cubic-bezier(0.390, 0.575, 0.565, 1.000);
  max-width: 550px;
  outline: 1px solid transparent;
  color: #000;
}

.card-power-area h4 span {
  font-family: inherit;
  text-align: left;
  font-size: 30px;
  font-weight: 600;
  transform: translateY(5px);
  transition: transform 450ms cubic-bezier(0.390, 0.575, 0.565, 1.000);
  max-width: 550px;
  outline: 1px solid transparent;
  color: #148bfd;
}

.overlay:hover~.card-power-area h4,
.overlay:focus~.card-power-area h4 {
  transform: translateZ(144px);
}

.card-power-area>span {
  font-size: 34px;
  opacity: 0;
  transform: translateX(-3px);
  transition: all 300ms ease;
}

/* .card-container:hover > .card-power-area > h4,
.card-container:focus > .card-power-area > h4{
  transform: translateY(-13px);
} */

.card-container:hover>.card-power-areard>span,
.card-container:focus>.card-power-areard>span {
  opacity: 1;
  transform: translateX(3px);
  animation: slideRight 300ms ease;
}

@media (max-width: 768px) {
  body {
    overflow-y: scroll;
  }

  h4 {
    font-size: 17px;
  }
}

@media (max-width: 540px) {
  .container {
    flex-flow: column;
    perspective: none;
  }

  .col_power-area:nth-of-type(1),
  .col_power-area:nth-of-type(2),
  .col_power-area:nth-of-type(3),
  .col_power-area:hover {
    transform: none;
  }

  h4 {
    padding-bottom: 8px;
    font-size: 18px;
  }

  .card-power-areard>span {
    display: none;
  }
}

@media (max-height: 599px) {
  .card-power-areard>span {
    display: none;
  }
}

@media (max-width: 860px) and (max-height: 540px) {
  h4 {
    font-size: 14px;
  }
}

@media (max-width: 620px) and (max-height: 540px) {
  h4 {
    font-size: 13px;
  }
}

@media only screen and (min-width: 360px) and (max-width: 414px) {
  .card-container {
    width: 360px;
  }

  .card-power-area h4 {
    font-size: 15px;
  }

  .card-power-area h4 span {
    font-size: 25px;
  }
}

@media only screen and (min-width: 1000px) and (max-width: 1200px) {
  .card-container {
    width: 460px;
  }
}

/* End Card (Power Area) - Index Page */

/* Card (Open Properties) - Index Page */
:root {
  --surface-color: #fff;
  --curve: 40;
  --d: 700ms;
  --e: cubic-bezier(0.19, 1, 0.22, 1);
  --background-dark: #2d3548;
  --text-light: rgba(255, 255, 255, 0.6);
  --text-lighter: rgba(255, 255, 255, 0.9);
  --spacing-s: 8px;
  --spacing-m: 16px;
  --spacing-l: 24px;
  --spacing-xl: 32px;
  --spacing-xxl: 64px;
  --width-container: 1200px;
  --color-brand-primary: hsl(var(--color-brand-primary-h), 14%, 70%);
  --color-brand-primary-h: 200;
  --color-brand-primary-s: 43%;
  --color-brand-primary-l: 43%;
  --color-brand-accent: hsl(var(--color-brand-accent-h), 90%, 55%);
  --color-brand-accent-h: 200;
  --color-brand-accent-s: 96%;
  --color-brand-accent-l: 61%;
  --color-brand-accent-bg: hsl(calc(var(--color-brand-accent-h)), 17%, 70%);
  --ratio: 1.4;
  --s-6: calc(var(--s-5) / var(--ratio));
  --s-5: calc(var(--s-4) / var(--ratio));
  --s-4: calc(var(--s-3) / var(--ratio));
  --s-3: calc(var(--s-2) / var(--ratio));
  --s-2: calc(var(--s-1) / var(--ratio));
  --s-1: calc(var(--s0) / var(--ratio));
  --s0: calc(1.05rem + 0.333vw);
  --s1: calc(var(--s0) * var(--ratio));
  --s2: calc(var(--s1) * var(--ratio));
  --s3: calc(var(--s2) * var(--ratio));
  --s4: calc(var(--s3) * var(--ratio));
  --s5: calc(var(--s4) * var(--ratio));
  --s6: calc(var(--s5) * var(--ratio));
}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

* {
  box-sizing: border-box;
}

.cards {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 2rem;
  padding: 0;
  list-style-type: none;
}

.card {
  position: relative;
  display: block;
  height: 100%;
  border-radius: calc(var(--curve) * 1px);
  overflow: hidden;
  text-decoration: none;
}

.card__image {
  width: 100%;
  height: auto;
}

.card__overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
  border-radius: calc(var(--curve) * 1px);
  background-color: var(--surface-color);
  transform: translateY(100%);
  transition: .2s ease-in-out;
}

.card:hover .card__overlay {
  transform: translateY(0);
}

.card__header {
  position: relative;
  display: flex;
  align-items: center;
  gap: 2em;
  padding: 2em;
  border-radius: calc(var(--curve) * 1px) 0 0 0;
  background-color: var(--surface-color);
  transform: translateY(-100%);
  transition: .2s ease-in-out;
}

.card__arc {
  width: 80px;
  height: 80px;
  position: absolute;
  bottom: 100%;
  right: 0;
  z-index: 1;
}

.card__arc path {
  fill: var(--surface-color);
  d: path("M 40 80 c 22 0 40 -22 40 -40 v 40 Z");
}

.card:hover .card__header {
  transform: translateY(0);
}

.card__thumb {
  flex-shrink: 0;
  width: 50px;
  height: 50px;
  border-radius: 50%;
}

.card__title {
  font-size: 1em;
  margin: 0 0 .3em;
  color: #6A515E;
}

.card__tagline {
  display: block;
  margin: 1em 0;
  font-family: "MockFlowFont";
  font-size: .8em;
  color: #D7BDCA;
}

.card__status {
  font-size: .8em;
  color: #D7BDCA;
}

.card__description {
  padding: 0 2em 2em;
  margin: 0;
  color: #D7BDCA;
  font-family: "MockFlowFont";
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

/* End Card (Open Properties) - Index Page */

/* Transfrom Skew - Index Page */
.tilesWrap {
  padding: 0;
  margin: 50px auto;
  list-style: none;
  text-align: center;
}

.tilesWrap li {
  display: inline-block;
  min-width: 200px;
  padding: 80px 20px 40px;
  position: relative;
  vertical-align: top;
  margin: 10px;
  font-family: 'helvetica', san-serif;
  min-height: 25vh;
  background: #fff;
  border: 1px solid #fff;
  text-align: left;
}

.tilesWrap li h2 {
  font-size: 114px;
  margin: 0;
  position: absolute;
  opacity: 0.2;
  top: 100px;
  right: 10px;
  transition: all 0.3s ease-in-out;
}

.tilesWrap li h3 {
  font-size: 20px;
  color: #b7b7b7;
  margin-bottom: 5px;
}

.tilesWrap li p {
  font-size: 16px;
  line-height: 18px;
  color: #b7b7b7;
  margin-top: 5px;
}

.tilesWrap li button {
  background: transparent;
  border: 1px solid #b7b7b7;
  padding: 10px 20px;
  color: #b7b7b7;
  border-radius: 3px;
  position: relative;
  transition: all 0.3s ease-in-out;
  transform: translateY(-40px);
  opacity: 0;
  cursor: pointer;
  overflow: hidden;
}

.tilesWrap li button:before {
  content: '';
  position: absolute;
  height: 100%;
  width: 120%;
  background: #b7b7b7;
  top: 0;
  opacity: 0;
  left: -140px;
  border-radius: 0 20px 20px 0;
  z-index: -1;
  transition: all 0.3s ease-in-out;

}

.tilesWrap li:hover button {
  transform: translateY(5px);
  opacity: 1;
}

.tilesWrap li button:hover {
  color: #262a2b;
}

.tilesWrap li a {
  cursor: pointer;
}

.tilesWrap li button:hover:before {
  left: 0;
  opacity: 1;
}

.tilesWrap li:hover h2 {
  top: 0px;
  opacity: 0.6;
}

.tilesWrap li:before {
  content: '';
  position: absolute;
  top: -2px;
  left: -2px;
  right: -2px;
  bottom: -2px;
  z-index: -1;
  background: #fff;
  transform: skew(2deg, 2deg);
}

.tilesWrap li:after {
  content: '';
  position: absolute;
  width: 40%;
  height: 100%;
  left: 0;
  top: 0;
  background: rgba(255, 255, 255, 0.02);
}

.tilesWrap li:nth-child(1):before {
  background: #C9FFBF;
  background: -webkit-linear-gradient(to right, #FFAFBD, #C9FFBF);
  background: linear-gradient(to right, #FFAFBD, #C9FFBF);
}

.tilesWrap li:nth-child(2):before {
  background: #f2709c;
  background: -webkit-linear-gradient(to right, #ff9472, #f2709c);
  background: linear-gradient(to right, #ff9472, #f2709c);
}

.tilesWrap li:nth-child(3):before {
  background: #c21500;
  background: -webkit-linear-gradient(to right, #ffc500, #c21500);
  background: linear-gradient(to right, #ffc500, #c21500);
}

.tilesWrap li:nth-child(4):before {
  background: #FC354C;
  background: -webkit-linear-gradient(to right, #0ABFBC, #FC354C);
  background: linear-gradient(to right, #0ABFBC, #FC354C);
}

.tilesWrap li:nth-child(5):before {
  background: #FC354C;
  background: -webkit-linear-gradient(to right, #02F563, #eb00ce);
  background: linear-gradient(to right, #02F563, #eb00ce);
}

/* End Transfrom Skew - Index Page  */
er-area:before {
  background-image: url('https://www.nasa.gov/sites/default/files/styles/full_width/public/thumbnails/image/40808879360_18c96d62f1_o.jpg?itok=NttmTWPK');
}

.col_power-area:nth-of-type(1) .card-container:nth-of-type(2) .card-power-area:before {
  background-image: url('https://www.nasa.gov/sites/default/files/styles/full_width/public/thumbnails/image/jwst-pv-145604copy.jpg?itok=Jq7GN-Rc');
}

.col_power-area:nth-of-type(2) .card-container:nth-of-type(2) .card-power-area:before {
  background-image: url('https://www.nasa.gov/sites/default/files/styles/ubernode_alt_horiz/public/thumbnails/image/worldview201709201920x1080.png');
}

.col_power-area:nth-of-type(3) .card-container:nth-of-type(2) .card-power-area:before {
  background-image: url('https://www.nasa.gov/sites/default/files/styles/full_width/public/thumbnails/image/nasasibexobs.jpg?itok=U2LCp14i');
}

.col_power-area:nth-of-type(1) .card-container:nth-of-type(3) .card-power-area:before {
  background-image: url('https://www.nasa.gov/sites/default/files/styles/full_width/public/thumbnails/image/pia19808.jpg?itok=rgxgamMM');
}

.col_power-area:nth-of-type(2) .card-container:nth-of-type(3) .card-power-area:before {
  background-image: url('https://www.nasa.gov/sites/default/files/styles/full_width/public/thumbnails/image/e0102_lg.jpg?itok=sd9lOayI');
}

.col_power-area:nth-of-type(3) .card-container:nth-of-type(3) .card-power-area:before {
  background-image: url('https://www.nasa.gov/sites/default/files/styles/full_width/public/thumbnails/image/asteroid20180605-home.jpg?itok=KSUffiCR');
}

.card-power-area:after {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.89) 100%);
}

.card-power-area h4 {
  font-family: inherit;
  text-align: left;
  font-size: 20px;
  font-weight: 600;
  transform: translateY(5px);
  transition: transform 450ms cubic-bezier(0.390, 0.575, 0.565, 1.000);
  max-width: 550px;
  outline: 1px solid transparent;
  color: #000;
}

.card-power-area h4 span {
  font-family: inherit;
  text-align: left;
  font-size: 30px;
  font-weight: 600;
  transform: translateY(5px);
  transition: transform 450ms cubic-bezier(0.390, 0.575, 0.565, 1.000);
  max-width: 550px;
  outline: 1px solid transparent;
  color: #148bfd;
}

.overlay:hover~.card-power-area h4,
.overlay:focus~.card-power-area h4 {
  transform: translateZ(144px);
}

.card-power-area>span {
  font-size: 34px;
  opacity: 0;
  transform: translateX(-3px);
  transition: all 300ms ease;
}

/* .card-container:hover > .card-power-area > h4,
.card-container:focus > .card-power-area > h4{
  transform: translateY(-13px);
} */

.card-container:hover>.card-power-areard>span,
.card-container:focus>.card-power-areard>span {
  opacity: 1;
  transform: translateX(3px);
  animation: slideRight 300ms ease;
}

@media (max-width: 768px) {
  body {
    overflow-y: scroll;
  }

  h4 {
    font-size: 17px;
  }
}

@media (max-width: 540px) {
  .container {
    flex-flow: column;
    perspective: none;
  }

  .col_power-area:nth-of-type(1),
  .col_power-area:nth-of-type(2),
  .col_power-area:nth-of-type(3),
  .col_power-area:hover {
    transform: none;
  }

  h4 {
    padding-bottom: 8px;
    font-size: 18px;
  }

  .card-power-areard>span {
    display: none;
  }
}

@media (max-height: 599px) {
  .card-power-areard>span {
    display: none;
  }
}

@media (max-width: 860px) and (max-height: 540px) {
  h4 {
    font-size: 14px;
  }
}

@media (max-width: 620px) and (max-height: 540px) {
  h4 {
    font-size: 13px;
  }
}

@media only screen and (min-width: 360px) and (max-width: 414px) {
  .card-container {
    width: 360px;
  }

  .card-power-area h4 {
    font-size: 15px;
  }

  .card-power-area h4 span {
    font-size: 25px;
  }
}

@media only screen and (min-width: 1000px) and (max-width: 1200px) {
  .card-container {
    width: 460px;
  }
}

/* End Card (Power Area) - Index Page */

/* Card (Open Properties) - Index Page */
:root {
  --surface-color: #fff;
  --curve: 40;
  --d: 700ms;
  --e: cubic-bezier(0.19, 1, 0.22, 1);
  --background-dark: #2d3548;
  --text-light: rgba(255, 255, 255, 0.6);
  --text-lighter: rgba(255, 255, 255, 0.9);
  --spacing-s: 8px;
  --spacing-m: 16px;
  --spacing-l: 24px;
  --spacing-xl: 32px;
  --spacing-xxl: 64px;
  --width-container: 1200px;
  --color-brand-primary: hsl(var(--color-brand-primary-h), 14%, 70%);
  --color-brand-primary-h: 200;
  --color-brand-primary-s: 43%;
  --color-brand-primary-l: 43%;
  --color-brand-accent: hsl(var(--color-brand-accent-h), 90%, 55%);
  --color-brand-accent-h: 200;
  --color-brand-accent-s: 96%;
  --color-brand-accent-l: 61%;
  --color-brand-accent-bg: hsl(calc(var(--color-brand-accent-h)), 17%, 70%);
  --ratio: 1.4;
  --s-6: calc(var(--s-5) / var(--ratio));
  --s-5: calc(var(--s-4) / var(--ratio));
  --s-4: calc(var(--s-3) / var(--ratio));
  --s-3: calc(var(--s-2) / var(--ratio));
  --s-2: calc(var(--s-1) / var(--ratio));
  --s-1: calc(var(--s0) / var(--ratio));
  --s0: calc(1.05rem + 0.333vw);
  --s1: calc(var(--s0) * var(--ratio));
  --s2: calc(var(--s1) * var(--ratio));
  --s3: calc(var(--s2) * var(--ratio));
  --s4: calc(var(--s3) * var(--ratio));
  --s5: calc(var(--s4) * var(--ratio));
  --s6: calc(var(--s5) * var(--ratio));
}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

* {
  box-sizing: border-box;
}

.cards {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 2rem;
  padding: 0;
  list-style-type: none;
}

.card {
  position: relative;
  display: block;
  height: 100%;
  border-radius: calc(var(--curve) * 1px);
  overflow: hidden;
  text-decoration: none;
}

.card__image {
  width: 100%;
  height: auto;
}

.card__overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
  border-radius: calc(var(--curve) * 1px);
  background-color: var(--surface-color);
  transform: translateY(100%);
  transition: .2s ease-in-out;
}

.card:hover .card__overlay {
  transform: translateY(0);
}

.card__header {
  position: relative;
  display: flex;
  align-items: center;
  gap: 2em;
  padding: 2em;
  border-radius: calc(var(--curve) * 1px) 0 0 0;
  background-color: var(--surface-color);
  transform: translateY(-100%);
  transition: .2s ease-in-out;
}

.card__arc {
  width: 80px;
  height: 80px;
  position: absolute;
  bottom: 100%;
  right: 0;
  z-index: 1;
}

.card__arc path {
  fill: var(--surface-color);
  d: path("M 40 80 c 22 0 40 -22 40 -40 v 40 Z");
}

.card:hover .card__header {
  transform: translateY(0);
}

.card__thumb {
  flex-shrink: 0;
  width: 50px;
  height: 50px;
  border-radius: 50%;
}

.card__title {
  font-size: 1em;
  margin: 0 0 .3em;
  color: #6A515E;
}

.card__tagline {
  display: block;
  margin: 1em 0;
  font-family: "MockFlowFont";
  font-size: .8em;
  color: #D7BDCA;
}

.card__status {
  font-size: .8em;
  color: #D7BDCA;
}

.card__description {
  padding: 0 2em 2em;
  margin: 0;
  color: #D7BDCA;
  font-family: "MockFlowFont";
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

/* End Card (Open Properties) - Index Page */

/* Transfrom Skew - Index Page */
.tilesWrap {
  padding: 0;
  margin: 50px auto;
  list-style: none;
  text-align: center;
}

.tilesWrap li {
  display: inline-block;
  min-width: 200px;
  padding: 80px 20px 40px;
  position: relative;
  vertical-align: top;
  margin: 10px;
  font-family: 'helvetica', san-serif;
  min-height: 25vh;
  background: #fff;
  border: 1px solid #fff;
  text-align: left;
}

.tilesWrap li h2 {
  font-size: 114px;
  margin: 0;
  position: absolute;
  opacity: 0.2;
  top: 100px;
  right: 10px;
  transition: all 0.3s ease-in-out;
}

.tilesWrap li h3 {
  font-size: 20px;
  color: #b7b7b7;
  margin-bottom: 5px;
}

.tilesWrap li p {
  font-size: 16px;
  line-height: 18px;
  color: #b7b7b7;
  margin-top: 5px;
}

.tilesWrap li button {
  background: transparent;
  border: 1px solid #b7b7b7;
  padding: 10px 20px;
  color: #b7b7b7;
  border-radius: 3px;
  position: relative;
  transition: all 0.3s ease-in-out;
  transform: translateY(-40px);
  opacity: 0;
  cursor: pointer;
  overflow: hidden;
}

.tilesWrap li button:before {
  content: '';
  position: absolute;
  height: 100%;
  width: 120%;
  background: #b7b7b7;
  top: 0;
  opacity: 0;
  left: -140px;
  border-radius: 0 20px 20px 0;
  z-index: -1;
  transition: all 0.3s ease-in-out;

}

.tilesWrap li:hover button {
  transform: translateY(5px);
  opacity: 1;
}

.tilesWrap li button:hover {
  color: #262a2b;
}

.tilesWrap li a {
  cursor: pointer;
}

.tilesWrap li button:hover:before {
  left: 0;
  opacity: 1;
}

.tilesWrap li:hover h2 {
  top: 0px;
  opacity: 0.6;
}

.tilesWrap li:before {
  content: '';
  position: absolute;
  top: -2px;
  left: -2px;
  right: -2px;
  bottom: -2px;
  z-index: -1;
  background: #fff;
  transform: skew(2deg, 2deg);
}

.tilesWrap li:after {
  content: '';
  position: absolute;
  width: 40%;
  height: 100%;
  left: 0;
  top: 0;
  background: rgba(255, 255, 255, 0.02);
}

.tilesWrap li:nth-child(1):before {
  background: #C9FFBF;
  background: -webkit-linear-gradient(to right, #FFAFBD, #C9FFBF);
  background: linear-gradient(to right, #FFAFBD, #C9FFBF);
}

.tilesWrap li:nth-child(2):before {
  background: #f2709c;
  background: -webkit-linear-gradient(to right, #ff9472, #f2709c);
  background: linear-gradient(to right, #ff9472, #f2709c);
}

.tilesWrap li:nth-child(3):before {
  background: #c21500;
  background: -webkit-linear-gradient(to right, #ffc500, #c21500);
  background: linear-gradient(to right, #ffc500, #c21500);
}

.tilesWrap li:nth-child(4):before {
  background: #FC354C;
  background: -webkit-linear-gradient(to right, #0ABFBC, #FC354C);
  background: linear-gradient(to right, #0ABFBC, #FC354C);
}

.tilesWrap li:nth-child(5):before {
  background: #FC354C;
  background: -webkit-linear-gradient(to right, #02F563, #eb00ce);
  background: linear-gradient(to right, #02F563, #eb00ce);
}

/* End Transfrom Skew - Index Page  */



/* Chatbot CSS */
.chatbot__overview {
  background-color: #163631;
  display: flex;
  flex-flow: row nowrap;
  align-content: space-between;
  min-height: 80vh;
  max-height: 80vh;
  margin: 0 auto;
  padding: 1em;
  padding-bottom: 0;
}

.chatlist {
  font-family: inherit;
  font-size: 1em;
  display: flex;
  flex-flow: column nowrap;
  align-items: flex-end;
  overflow-x: hidden;
  width: 100%;
  max-width: 35em;
  max-height: 75vh;
  margin: 0 auto;
}

.chatlist .userInput,
.chatlist .bot__output {
  padding: 0.85em;
  margin: 0.5em;
  max-width: 100%;
  background-color: #fff;
  border-radius: 5px;
  border-bottom: 1px solid #777;
}

.chatlist .userInput {
  text-transform: lowercase;
  box-shadow: 1px 1px 2px #666;
  border-top: 4px solid #CC8914;
  opacity: 0;
  animation-name: animateBubble;
  animation-duration: 400ms;
  animation-iteration-count: 1;
  animation-play-state: running;
  animation-fill-mode: forwards;
}

.chatlist .bot__output {
  align-self: flex-start;
  box-shadow: -1px 1px 2px #666;
  border-top: 4px solid #27ae60;
  will-change: auto;
  height: auto;
  opacity: 0;
  animation-name: animateBubble;
  animation-duration: 400ms;
  animation-iteration-count: 1;
  animation-play-state: paused;
  animation-fill-mode: forwards;
}

.chatlist .bot__output:last-child {
  display: none;
}

.chatlist .bot__command {
  color: #f5f5f5;
  color: #27ae60;
  font-weight: 600;
  padding: 0.1em;
}

.chatlist .bot__output:nth-child(1) {
  animation-delay: 600ms;
  animation-play-state: running;
}

.chatlist .bot__output:nth-child(2) {
  animation-delay: 1200ms;
  animation-play-state: running;
}

.chatlist .bot__output:nth-child(3) {
  animation-delay: 1800ms;
  animation-play-state: running;
}

.chatlist .bot__output--standard:last-child {
  display: block;
}

.chatlist .bot__output--failed {
  display: block !important;
}

.chatlist .bot__output--second-sentence {
  display: block;
}

.chatlist .bot__outputImage {
  max-width: 16em;
  height: 12em;
}

@keyframes animateBubble {
  0% {
    transform: translateY(-20%);
    opacity: 0;
  }

  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

.block--background {
  background-color: #363636;
  width: 100vw;
  height: 100vh;
}

#chatform {
  display: flex;
  justify-content: center;
  width: 80%;
  max-width: 35em;
  margin: 0 auto;
  padding-top: 1em;
  font-size: 1em;
  font-family: Helvetica;
}

@media screen and (max-width: 29em) {
  #chatform {
    width: 90%;
  }
}

.chatbox-area {
  margin: 0 auto;
  position: relative;
  bottom: 0;
  height: auto;
  width: 100%;
}

textarea[name=chatbox] {
  resize: none;
  border: 2px solid #27ae60;
  border-right: 0;
  width: 70%;
  background-color: transparent;
  color: #fff;
  height: 3em;
  margin: 0;
  padding: 0.75em;
  border-radius: 8px 0px 0px 8px;
  font-family: inherit;
  font-size: 1em;
}

textarea[name=chatbox]:focus {
  outline: none;
  border: 2px solid #4bd786;
}

::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: #fff;
}

:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #fff;
  opacity: 1;
}

::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #fff;
  opacity: 1;
}

input[type=submit] {
  -webkit-appearance: none;
  appearance: none;
  border: 0;
  width: 25%;
  margin: 0;
  background-color: #27ae60;
  color: #fff;
  border: 2px solid #27ae60;
  border-left: 0;
  border-radius: 0 8px 8px 0;
  font-family: inherit;
  font-size: 1em;
  transition: 200ms all ease-in;
}

input[type=submit]:hover {
  background-color: #4bd786;
  border-color: #4bd786;
  color: #fff;
}

.input__nested-list {
  list-style: disc;
  list-style-position: inside;
  padding: 0.5em;
}

.input__nested-list:first-child {
  padding-top: 1em;
}

.input__nested-link {
  color: #2ecc71;
  text-decoration: none;
  border-bottom: 1px solid #2ecc71;
}

::-webkit-scrollbar {
  width: 0.65em;
  /* for vertical scrollbars */
  height: 0.65em;
  /* for horizontal scrollbars */
}

::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.1);
}

::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.3);
}

/* End Chatbot */

/*  start introduce System Smart*/
.o_animate {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
  text-rendering: geometricPrecision;
  visibility: hidden;

}

/*  end introduce System Smart*/

/* start introduce Thiet ke mobile app*/
a{text-decoration:none}
.main-timeline{position:relative}
.main-timeline:before{content:"";width:5px;height:100%;border-radius:20px;margin:0 auto;background:#242922;position:absolute;top:0;left:0;right:0}
.main-timeline .timeline{display:inline-block;margin-bottom:50px;position:relative}
.main-timeline .timeline:before{content:"";width:20px;height:20px;border-radius:50%;border:4px solid #fff;background:#ec496e;position:absolute;top:50%;left:50%;z-index:1;transform:translate(-50%,-50%)}
.main-timeline .timeline-icon{display:inline-block;width:130px;height:130px;border-radius:50%;border:3px solid #ec496e;padding:13px;text-align:center;position:absolute;top:50%;left:30%;transform:translateY(-50%)}
.main-timeline .timeline-icon i{display:block;border-radius:50%;background:#ec496e;font-size:64px;color:#fff;line-height:100px;z-index:1;position:relative}
.main-timeline .timeline-icon:after,.main-timeline .timeline-icon:before{content:"";width:100px;height:4px;background:#ec496e;position:absolute;top:50%;right:-100px;transform:translateY(-50%)}
.main-timeline .timeline-icon:after{width:70px;height:50px;background:#fff;top:89px;right:-30px}
.main-timeline .timeline-content{width:50%;padding:0 50px;margin:52px 0 0;float:right;position:relative}
.main-timeline .timeline-content:before{content:"";width:70%;height:100%;border:3px solid #ec496e;border-top:none;border-right:none;position:absolute;bottom:-13px;left:35px}
.main-timeline .timeline-content:after{content:"";width:37px;height:3px;background:#ec496e;position:absolute;top:13px;left:0}
.main-timeline .title{font-size:20px;font-weight:600;color:#ec496e;text-transform:uppercase;margin:0 0 5px}
.main-timeline .description{display:inline-block;font-size:16px;color:#404040;line-height:20px;letter-spacing:1px;margin:0}
.main-timeline .timeline:nth-child(even) .timeline-icon{left:auto;right:30%}
.main-timeline .timeline:nth-child(even) .timeline-icon:before{right:auto;left:-100px}
.main-timeline .timeline:nth-child(even) .timeline-icon:after{right:auto;left:-30px}
.main-timeline .timeline:nth-child(even) .timeline-content{float:left}
.main-timeline .timeline:nth-child(even) .timeline-content:before{left:auto;right:35px;transform:rotateY(180deg)}
.main-timeline .timeline:nth-child(even) .timeline-content:after{left:auto;right:0}
.main-timeline .timeline:nth-child(2n) .timeline-content:after,.main-timeline .timeline:nth-child(2n) .timeline-icon i,.main-timeline .timeline:nth-child(2n) .timeline-icon:before,.main-timeline .timeline:nth-child(2n):before{background:#f9850f}
.main-timeline .timeline:nth-child(2n) .timeline-icon{border-color:#f9850f}
.main-timeline .timeline:nth-child(2n) .title{color:#f9850f}
.main-timeline .timeline:nth-child(2n) .timeline-content:before{border-left-color:#f9850f;border-bottom-color:#f9850f}
.main-timeline .timeline:nth-child(3n) .timeline-content:after,.main-timeline .timeline:nth-child(3n) .timeline-icon i,.main-timeline .timeline:nth-child(3n) .timeline-icon:before,.main-timeline .timeline:nth-child(3n):before{background:#8fb800}
.main-timeline .timeline:nth-child(3n) .timeline-icon{border-color:#8fb800}
.main-timeline .timeline:nth-child(3n) .title{color:#8fb800}
.main-timeline .timeline:nth-child(3n) .timeline-content:before{border-left-color:#8fb800;border-bottom-color:#8fb800}
.main-timeline .timeline:nth-child(4n) .timeline-content:after,.main-timeline .timeline:nth-child(4n) .timeline-icon i,.main-timeline .timeline:nth-child(4n) .timeline-icon:before,.main-timeline .timeline:nth-child(4n):before{background:#2fcea5}
.main-timeline .timeline:nth-child(4n) .timeline-icon{border-color:#2fcea5}
.main-timeline .timeline:nth-child(4n) .title{color:#2fcea5}
.main-timeline .timeline:nth-child(4n) .timeline-content:before{border-left-color:#2fcea5;border-bottom-color:#2fcea5}
.main-timeline .timeline:nth-child(5n) .timeline-content:after,.main-timeline .timeline:nth-child(5n) .timeline-icon i,.main-timeline .timeline:nth-child(5n) .timeline-icon:before,.main-timeline .timeline:nth-child(5n):before{background:#FF9999}
.main-timeline .timeline:nth-child(5n) .timeline-icon{border-color:#FF9999}
.main-timeline .timeline:nth-child(5n) .title{color:#FF9999}
.main-timeline .timeline:nth-child(5n) .timeline-content:before{border-left-color:#FF9999;border-bottom-color:#FF9999}
@media only screen and (max-width:1200px){.main-timeline .timeline-icon:before{width:50px;right:-50px}
.main-timeline .timeline:nth-child(even) .timeline-icon:before{right:auto;left:-50px}
.main-timeline .timeline-content{margin-top:75px}
}
@media only screen and (max-width:990px){.main-timeline .timeline{margin:0 0 10px}
.main-timeline .timeline-icon{left:25%}
.main-timeline .timeline:nth-child(even) .timeline-icon{right:25%}
.main-timeline .timeline-content{margin-top:115px}
}
@media only screen and (max-width:767px){.main-timeline{padding-top:50px}
.main-timeline:before{left:80px;right:0;margin:0}
.main-timeline .timeline{margin-bottom:70px}
.main-timeline .timeline:before{top:0;left:83px;right:0;margin:0}
.main-timeline .timeline-icon{width:60px;height:60px;line-height:40px;padding:5px;top:0;left:0}
.main-timeline .timeline:nth-child(even) .timeline-icon{left:0;right:auto}
.main-timeline .timeline-icon:before,.main-timeline .timeline:nth-child(even) .timeline-icon:before{width:25px;left:auto;right:-25px}
.main-timeline .timeline-icon:after,.main-timeline .timeline:nth-child(even) .timeline-icon:after{width:25px;height:30px;top:44px;left:auto;right:-5px}
.main-timeline .timeline-icon i{font-size:30px;line-height:45px}
.main-timeline .timeline-content,.main-timeline .timeline:nth-child(even) .timeline-content{width:100%;margin-top:-15px;padding-left:130px;padding-right:5px}
.main-timeline .timeline:nth-child(even) .timeline-content{float:right}
.main-timeline .timeline-content:before,.main-timeline .timeline:nth-child(even) .timeline-content:before{width:50%;left:120px}
.main-timeline .timeline:nth-child(even) .timeline-content:before{right:auto;transform:rotateY(0)}
.main-timeline .timeline-content:after,.main-timeline .timeline:nth-child(even) .timeline-content:after{left:85px}
}
@media only screen and (max-width:479px){.main-timeline .timeline-content,.main-timeline .timeline:nth-child(2n) .timeline-content{padding-left:110px}
.main-timeline .timeline-content:before,.main-timeline .timeline:nth-child(2n) .timeline-content:before{left:99px}
.main-timeline .timeline-content:after,.main-timeline .timeline:nth-child(2n) .timeline-content:after{left:65px}
}
/* end introduce Thiet ke mobile app*/

/* start service-office*/
.textp_benifit{
  margin-bottom: 5px;
}
/* end service-office*/
/* start service-ssm*/
.blog-slider__img.xanh{
  background-image: linear-gradient(147deg, blue 0%, #fd3838 74%);
  box-shadow: 4px 13px 30px 1px rgb(63 32 248 / 20%);
}
.blog-slider__img.xanh::after{
  background-image: linear-gradient(147deg, blue 0%, #fd3838 74%);
  box-shadow: 4px 13px 30px 1px rgb(63 32 248 / 20%);
}
/* end service-ssm*/

/* start service-dms*/
.main-timelinedms{
  overflow: hidden;
  position: relative;
}
.main-timelinedms .timelinedms{ position: relative; }
.main-timelinedms .timelinedms:before,
.main-timelinedms .timelinedms:after{
  content: "";
  display: block;
  width: 100%;
  clear: both;
}
.main-timelinedms .timelinedms:before{
  content: "";
  width: 15px;
  height: 100%;
  background: #f4a24c;
  margin: 0 auto;
  position: absolute;
  top: -50%;
  left: 0;
  right: 0;
}
.main-timelinedms .timelinedms:first-child:before{
  height: 50%;
  border-radius: 10px 10px 0 0;
  top: 0;
}
.main-timelinedms .timelinedms:last-child:before{
  height: 150%;
  border-radius: 0 0 10px 10px;
}
.main-timelinedms .timeline-icondms{
  display: block;
  width: 130px;
  height: 130px;
  line-height: 105px;
  border-radius: 50%;
  background: #1d2124;
  border: 12px solid #f4a24c;
  margin: auto;
  font-size: 70px;
  font-weight: bold;
  color: #fff;
  text-transform: uppercase;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 1;
}
.main-timelinedms .timeline-icondms:before{
  content: "";
  width: 0;
  height: 0;
  border-right: 15px solid #f4a24c;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  margin: auto 0;
  position: absolute;
  top: 0;
  left: -33px;
  bottom: 0;
}
.main-timelinedms .timeline-contentdms{
  width: 50%;
  padding-right: 100px;
}
.main-timelinedms .icon{
  float: left;
  margin-right: 15px;
  font-size: 70px;
  color: #f4a24c;
}
.main-timelinedms .descriptiondms{
  font-size: 16px;
  color: #000;
  line-height: 24px;
  margin: 0;
}
.main-timelinedms .year{
  width: 50%;
  padding-left: 50px;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}
.main-timelinedms .year span{
  display: inline-block;
  padding: 12px 25px 12px 25px;
  background: #f4a24c;
  border-radius: 0 50px 50px 0;
  font-size: 40px;
  font-weight: bold;
  line-height: 36px;
  color: #fff;
}
.main-timelinedms .timelinedms:nth-child(2n) .timeline-icondms:before{
  border-right: none;
  border-left: 15px solid #f26f77;
  left: auto;
  right: -33px;
}
.main-timelinedms .timelinedms:nth-child(2n) .timeline-contentdms{
  float: right;
  padding: 0 0 0 100px;
}
.main-timelinedms .timelinedms:nth-child(2n) .descriptiondms{ padding-left: 20px; }
.main-timelinedms .timelinedms:nth-child(2n) .year{
  padding: 0 50px 0 0;
  text-align: right;
  right: auto;
  left: 0;
}
.main-timelinedms .timelinedms:nth-child(2n) .year span{ border-radius: 50px 0 0 50px; }
.main-timelinedms .timelinedms:nth-child(2n) .timeline-icondms{ border-color: #f26f77; }
.main-timelinedms .timelinedms:nth-child(2n) .icon{ color: #f26f77; }
.main-timelinedms .timelinedms:nth-child(2n):before,
.main-timelinedms .timelinedms:nth-child(2n) .year span{ background: #f26f77; }
.main-timelinedms .timelinedms:nth-child(3n) .timeline-icondms{ border-color: #13a3b5; }
.main-timelinedms .timelinedms:nth-child(3n) .timeline-icondms:before{ border-right-color: #13a3b5; }
.main-timelinedms .timelinedms:nth-child(3n) .icon{ color: #13a3b5; }
.main-timelinedms .timelinedms:nth-child(3n):before,
.main-timelinedms .timelinedms:nth-child(3n) .year span{ background: #13a3b5; }
.main-timelinedms .timelinedms:nth-child(4n) .timeline-icondms{ border-color: #a6d050; }
.main-timelinedms .timelinedms:nth-child(4n) .timeline-icondms:before{ border-left-color: #a6d050; }
.main-timelinedms .timelinedms:nth-child(4n) .icon{ color: #a6d050; }
.main-timelinedms .timelinedms:nth-child(4n):before,
.main-timelinedms .timelinedms:nth-child(4n) .year span{ background: #a6d050; }
@media only screen and (max-width: 767px){
  .main-timelinedms .timelinedms{
      padding-top: 95px;
      margin-top: 150px;
      margin-bottom: 50px;
  }
  .main-timelinedms .timelinedms:first-child{ margin-top: 135px; }
  .main-timelinedms .timelinedms:last-child{ margin-bottom: 0; }
  .main-timelinedms .timelinedms:before,
  .main-timelinedms .timelinedms:first-child:before,
  .main-timelinedms .timelinedms:last-child:before{
      width: 100%;
      height: 15px;
      border-radius: 10px;
      margin: 0;
      top: 0;
  }
  .main-timelinedms .timeline-icondms{
      margin: 0 auto;
      top: -65px;
  }
  .main-timelinedms .timeline-icondms:before,
  .main-timelinedms .timelinedms:nth-child(2n) .timeline-icondms:before,
  .main-timelinedms .timelinedms:nth-child(3n) .timeline-icondms:before{
      border: 10px solid transparent;
      border-top: 15px solid #f4a24c;
      margin: 0 auto;
      position: absolute;
      top: auto;
      left: 0;
      bottom: -43px;
      right: 0;
  }
  .main-timelinedms .timelinedms:nth-child(2n) .timeline-icondms:before{ border-top-color: #f26f77; }
  .main-timelinedms .timelinedms:nth-child(3n) .timeline-icondms:before{ border-top-color: #149cad; }
  .main-timelinedms .timelinedms:nth-child(4n) .timeline-icondms:before{ border-top-color: #a6d050; }
  .main-timelinedms .timeline-contentdms,
  .main-timelinedms .timelinedms:nth-child(2n) .timeline-contentdms{
      width: 100%;
      padding: 0;
      float: none;
  }
  .main-timelinedms .timelinedms:nth-child(2n) .descriptiondms{ padding: 0; }
  .main-timelinedms .year,
  .main-timelinedms .timelinedms:nth-child(2n) .year{
      width: 100%;
      padding: 0;
      text-align: center;
      position: absolute;
      top: -135px;
      right: 0;
      transform: translateY(0);
  }
  .main-timelinedms .year span,
  .main-timelinedms .timelinedms:nth-child(2n) .year span{ border-radius: 50px; }
}

/* end service-dms*/

/* start service-mkt*/
.main-timeline2{padding-top:50px;overflow:hidden;position:relative}
.main-timeline2:before{content:"";width:7px;height:100%;background:#084772;margin:0 auto;position:absolute;top:80px;left:0;right:0}
.main-timeline2 .timeline{width:50%;float:left;padding:20px 60px;border-top:7px solid #084772;border-right:7px solid #084772;border-radius:0 30px 0 0;position:relative;right:-3.5px}
.main-timeline2 .icon{display:block;width:50px;height:50px;line-height:50px;border-radius:50%;background:#FF9999;border:1px solid #fff;text-align:center;font-size:25px;color:#fff;box-shadow:0 0 0 2px #e84c47;position:absolute;top:-30px;left:0}
.main-timeline2 .timeline-content{display:block;padding:30px 10px 10px;border-radius:20px;background:#FF9999;color:#fff;position:relative}
.main-timeline2 .timeline-content:hover{text-decoration:none;color:#fff}
.main-timeline2 .timeline-content:after,.main-timeline2 .timeline-content:before{content:"";display:block;width:10px;height:50px;border-radius:10px;background:#FF9999;border:1px solid #fff;position:absolute;top:-35px;left:50px}
.main-timeline2 .timeline-content:after{left:auto;right:50px}
.main-timeline2 .title{font-size:24px;margin:0}
.main-timeline2 .description{font-size:15px;letter-spacing:1px;margin:0 0 5px}
.main-timeline2 .timeline:nth-child(2n){border-right:none;border-left:7px solid #084772;border-radius:30px 0 0;right:auto;left:-3.5px}
.main-timeline2 .timeline:nth-child(2n) .icon{left:auto;right:0;box-shadow:0 0 0 2px #4bd9bf}
.main-timeline2 .timeline:nth-child(2){margin-top:130px}
.main-timeline2 .timeline:nth-child(odd){margin:-130px 0 30px}
.main-timeline2 .timeline:nth-child(even){margin-bottom:80px}
.main-timeline2 .timeline:first-child,.main-timeline2 .timeline:last-child:nth-child(even){margin:0 0 30px}
.main-timeline2 .timeline:nth-child(2n) .icon,.main-timeline2 .timeline:nth-child(2n) .timeline-content,.main-timeline2 .timeline:nth-child(2n) .timeline-content:after,.main-timeline2 .timeline:nth-child(2n) .timeline-content:before{background:#4bd9bf}
.main-timeline2 .timeline:nth-child(3n) .icon,.main-timeline2 .timeline:nth-child(3n) .timeline-content,.main-timeline2 .timeline:nth-child(3n) .timeline-content:after,.main-timeline2 .timeline:nth-child(3n) .timeline-content:before{background:#ff9e09}
.main-timeline2 .timeline:nth-child(3n) .icon{box-shadow:0 0 0 2px #ff9e09}
.main-timeline2 .timeline:nth-child(4n) .icon,.main-timeline2 .timeline:nth-child(4n) .timeline-content,.main-timeline2 .timeline:nth-child(4n) .timeline-content:after,.main-timeline2 .timeline:nth-child(4n) .timeline-content:before{background:#3ebae7}
.main-timeline2 .timeline:nth-child(4n) .icon{box-shadow:0 0 0 2px #3ebae7}
@media only screen and (max-width:767px){.main-timeline2:before{left:0;right:auto}
.main-timeline2 .timeline,.main-timeline2 .timeline:nth-child(even),.main-timeline2 .timeline:nth-child(odd){width:100%;float:none;padding:20px 30px;margin:0 0 30px;border-right:none;border-left:7px solid #084772;border-radius:30px 0 0;right:auto;left:0}
.main-timeline2 .icon{left:auto;right:0}
}
@media only screen and (max-width:480px){.main-timeline2 .title{font-size:18px}
}
/* end service-mkt*/

/* start slide_card*/
@import url(https://fonts.googleapis.com/css?family=Raleway:400,600,700);
@import url(https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css);
.container.news{
  max-width: 1000px;

}
figure.snip1312 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  overflow: hidden;
  margin: 10px;
  min-width: 250px;
  max-width: 400px;
  width: 100%;
  background-color: #ffffff;
  color: #000000;
  text-align: left;
  font-size: 16px;
  display: inline-block;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
figure.snip1312 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
figure.snip1312 img {
  max-width: 100%;
  vertical-align: top;
  position: relative;
}
figure.snip1312 figcaption {
  position: absolute;
  bottom: 15px;
  left: 15px;
  right: 15px;
  padding: 15px 15px 30px;
  background-color: #ffffff;
}
figure.snip1312 .date {
  background-color: #7f8c8d;
  top: 15px;
  color: #fff;
  left: 15px;
  min-height: 48px;
  min-width: 48px;
  position: absolute;
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
}
figure.snip1312 .date span {
  display: block;
  line-height: 24px;
}
figure.snip1312 .date .month {
  font-size: 14px;
  background-color: rgba(0, 0, 0, 0.1);
}
figure.snip1312 p {
  margin: 0;
  padding-top: 10;
}
figure.snip1312 p {
  font-size: 0.8em;
  margin-bottom: 20px;
  line-height: 1.6em;
}
figure.snip1312 footer {
  padding: 0 25px;
  background-color: #667273;
  color: #e6e6e6;
  font-size: 1em;
  line-height: 30px;
  text-align: right;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}
figure.snip1312 footer > div {
  display: inline-block;
  margin-left: 10px;
}
figure.snip1312 footer i {
  color: rgba(255, 255, 255, 0.2);
  margin-right: 5px;
}
figure.snip1312 a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}
figure.snip1312:hover img,
figure.snip1312.hover img {
  -webkit-transform: scale(1.15);
  transform: scale(1.15);
}
/* end slide_card*/

/*start news_ kinh doanh*/
.container.news{
  max-width: 900px;
}
.img_news{
  width:60%;
  margin-left: auto;
  margin-right: auto;
  display: block;
}
/*end news_ kinh doanh*/