@charset "UTF-8";
/*-----------------------------------------------------------------------------------

    Template Name: Logio - Logistics & Transportation HTML5 Template
    Description: Logistics & Transportation HTML5 Template
    Author: BDevs
    Version: 1.0

-----------------------------------------------------------------------------------

    CSS INDEX
    ===================

    1. Theme default css
    2. header
    3. features
    4. about 
    5. cta
    6. services
    7. testimonial
    8. project
    9. counter
    10. newsletters
    11. footer
    12. footer
    13. team
    14. contact
    15. slider
    16. faq
    17. pricing

-----------------------------------------------------------------------------------*/
/*----------------------------------------*/
/*  01. Theme default CSS
/*----------------------------------------*/
/* 1. Theme default css */
@import url("https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,800,900|Roboto:300,400,500,700,900&display=swap");
body {
  font-family: "Roboto";
  font-weight: normal;
  font-style: normal;
  color: #9b9b9b;
}

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

.f-left {
  float: left;
}

.f-right {
  float: right;
}

.fix {
  overflow: hidden;
}

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

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

a:focus,
a:hover {
  color: inherit;
  text-decoration: none;
}

a,
button {
  color: inherit;
  outline: medium none;
}

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

.uppercase {
  text-transform: uppercase;
}

.capitalize {
  text-transform: capitalize;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Poppins";
  color: #282828;
  margin-top: 0px;
  font-style: normal;
  font-weight: 700;
  text-transform: normal;
  line-height: 1.1;
}

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

h1 {
  font-size: 40px;
  font-weight: 700;
}

h2 {
  font-size: 35px;
}

h3 {
  font-size: 28px;
}

h4 {
  font-size: 22px;
}

h5 {
  font-size: 18px;
}

h6 {
  font-size: 16px;
}

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

li {
  list-style: none;
}

p {
  font-size: 14px;
  font-weight: normal;
  line-height: 28px;
  color: #9b9b9b;
  margin-bottom: 15px;
}

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

label {
  color: #333333;
  cursor: pointer;
  font-size: 14px;
  font-weight: 400;
}

*::-moz-selection {
  background: #282828;
  color: #ffffff;
  text-shadow: none;
}

::-moz-selection {
  background: #282828;
  color: #ffffff;
  text-shadow: none;
}

::selection {
  background: #282828;
  color: #ffffff;
  text-shadow: none;
}

/*--
    - Input Placeholder
-----------------------------------------*/
*::-moz-placeholder {
  color: #282828;
  font-size: 14px;
  opacity: 1;
}

*::placeholder {
  color: #282828;
  font-size: 14px;
  opacity: 1;
}

/*--
    - Common Classes
-----------------------------------------*/
.fix {
  overflow: hidden;
}

.clear {
  clear: both;
}

/*--
    - Background color
-----------------------------------------*/
.grey-bg {
  background: #f9f9f9;
}

.grey-soft-bg {
  background: #ededed;
}

.white-bg {
  background: #ffffff;
}

.black-bg {
  background: #282828;
}

.black-bg {
  background: #282828;
}

.black-soft-bg {
  background: #333333;
}

.theme-bg {
  background: #E24F30;
}

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

.black-color {
  color: #282828;
}

.theme-color {
  color: #E24F30;
}

/*-- 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;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

/*-- 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-205 {
  padding-top: 205px;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

/*-- 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;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

/*-- 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;
}

/*
 	Flaticon icon font: Flaticon
 	Creation date: 08/02/2020 05:10
 	*/
@font-face {
  font-family: "Flaticon";
  src: url("../fonts/Flaticon.eot");
  src: url("../fonts/Flaticon.eot?#iefix") format("embedded-opentype"), url("../fonts/Flaticon.woff2") format("woff2"), url("../fonts/Flaticon.woff") format("woff"), url("../fonts/Flaticon.ttf") format("truetype"), url("../fonts/Flaticon.svg#Flaticon") format("svg");
  font-weight: normal;
  font-style: normal;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family: "Flaticon";
    src: url("../fonts/Flaticon.svg#Flaticon") format("svg");
  }
}
[class^=flaticon-]:before, [class*=" flaticon-"]:before,
[class^=flaticon-]:after, [class*=" flaticon-"]:after {
  font-family: Flaticon;
  font-style: normal;
  margin-left: 0;
  line-height: 1;
}

.flaticon-box:before {
  content: "";
}

.flaticon-trolley:before {
  content: "";
}

.flaticon-package:before {
  content: "";
}

.flaticon-delivery-truck:before {
  content: "";
}

.flaticon-plane:before {
  content: "";
}

.flaticon-plane-1:before {
  content: "";
}

.flaticon-ship:before {
  content: "";
}

.flaticon-ship-1:before {
  content: "";
}

.flaticon-logistic:before {
  content: "";
}

.flaticon-forklift:before {
  content: "";
}

.flaticon-truck-1:before {
  content: "";
}

.flaticon-aircraft:before {
  content: "";
}

.flaticon-boat:before {
  content: "";
}

.flaticon-travel:before {
  content: "";
}

.flaticon-vessel:before {
  content: "";
}

.flaticon-delivery-truck-1:before {
  content: "";
}

.flaticon-delivery:before {
  content: "";
}

.flaticon-box-1:before {
  content: "";
}

.flaticon-mail:before {
  content: "";
}

.flaticon-box-2:before {
  content: "";
}

.flaticon-scooter:before {
  content: "";
}

.flaticon-boat-1:before {
  content: "";
}

.flaticon-progress:before {
  content: "";
}

.flaticon-email:before {
  content: "";
}

.flaticon-train:before {
  content: "";
}

.flaticon-rocket-launch:before {
  content: "";
}

.flaticon-delivery-1:before {
  content: "";
}

.flaticon-product:before {
  content: "";
}

.flaticon-product-1:before {
  content: "";
}

.flaticon-box-3:before {
  content: "";
}

.flaticon-help:before {
  content: "";
}

.flaticon-yatch:before {
  content: "";
}

.flaticon-delivery-2:before {
  content: "";
}

.flaticon-plane-2:before {
  content: "";
}

.flaticon-global:before {
  content: "";
}

.flaticon-luggage:before {
  content: "";
}

/* bounce-animate */
.bounce-animate {
  animation-name: float-bob;
  animation-duration: 2s;
  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);
  }
}
.rotateme {
  -webkit-animation-name: rotateme;
  animation-name: rotateme;
  -webkit-animation-duration: 10s;
  animation-duration: 60s;
  -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);
  }
}
.button {
  cursor: pointer;
}

/* scrollUp */
#scrollUp {
  background: #282828;
  height: 40px;
  width: 40px;
  right: 50px;
  bottom: 77px;
  color: #ffffff;
  font-size: 20px;
  text-align: center;
  border-radius: 50%;
  font-size: 20px;
  line-height: 40px;
}

#scrollUp:hover {
  background: #333;
}

/*--
    - 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 Color --*/
[data-overlay=light]::before {
  background-color: #ffffff;
}

[data-overlay=dark]::before {
  background-color: #282828;
}

/*-- 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;
}

.btn {
  color: #ffffff;
  display: inline-block;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  /* Pedido de Patricio (2026-09-23: "los botones estan muy grandes") -
     el padding original (26px arriba/abajo, hasta 54px a los costados)
     lo hacia gigante. Se reduce a algo mas contemporaneo, sin perder el
     tacto de boton "pill" grande que ya tenia el sitio. */
  padding: 16px 32px;
  position: relative;
  text-transform: uppercase;
  transition: 0.3s;
  /* Pedido de Patricio (2026-09-23, "mejorar la estetica de los botones"):
     el degradado rojo-anaranjado generico del template no correspondia a
     la marca - se reemplaza por el violeta-coral reales del logo de Caddy
     (muestreados directo del PNG: #441C42 / #E05742), que ya se usaban a
     mano en algunos botones puntuales del hero via inline style (ver
     .blue-btn / .btn-coral mas abajo, y el hero en index.html). */
  /* FIX (Patricio, 2026-09-23: "dejalos todos naranja, no los pongas con
     degrade, y todos iguales") - se saca el degradado violeta/coral,
     naranja solido de marca (#E24F30, el mismo coral que ya se usaba en
     .btn-coral) para TODOS los botones por igual. */
  background: #E24F30;
  border-radius: 50px;
  border: none;
  box-shadow: 0 14px 28px -12px rgba(226, 79, 48, 0.5);
}
.btn i {
  font-size: 16px;
  position: relative;
  left: 6px;
}

/* FIX (Patricio, 2026-09-23: "el logo quedo enorme" -> despues "quedo muy
   chico") - el logo a color nuevo es un archivo mucho mas grande
   (900x365) que el blanco que reemplazo (227x85) y no habia ningun tope
   de tamano puesto por CSS. Se acota a una altura prolija de header en
   los 2 lugares donde se usa. */
.logo img,
.logo-side img {
  max-height: 58px;
  width: auto;
}

/* Efecto de tipeo del hero (pedido de Patricio, 2026-09-23: "que le de
   movilidad") - ver assets/js/typewriter.js */
.tipeo-cursor {
  display: inline-block;
  margin-left: 2px;
  animation: tipeoParpadeo 0.8s steps(1) infinite;
}
.tipeo-cursor--quieto {
  animation: tipeoParpadeo 0.8s steps(1) infinite;
  opacity: 0;
  animation-play-state: paused;
}
@keyframes tipeoParpadeo {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: 0; }
}
.palabra-fade {
  display: inline-block;
  opacity: 0;
  transform: translateX(-14px);
  transition: opacity 0.35s ease, transform 0.35s ease;
}
.palabra-fade--visible {
  opacity: 1;
  transform: translateX(0);
}

/* Botones del hero de a uno, izquierda a derecha (pedido de Patricio,
   2026-09-23) - ver assets/js/typewriter.js. .slider-button ya es flex
   (ver mas abajo), no se toca "display" para no romper eso. */
.btn-fade {
  opacity: 0;
  transform: translateX(-16px);
  transition: opacity 0.4s ease, transform 0.4s ease;
}
.btn-fade--visible {
  opacity: 1;
  transform: translateX(0);
}

.hero-greeting {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.3);
  color: #ffffff;
  font-family: "Poppins";
  font-weight: 600;
  font-size: 14px;
  padding: 8px 18px;
  border-radius: 30px;
  margin-bottom: 18px;
  backdrop-filter: blur(2px);
}
.hero-greeting span {
  font-size: 17px;
}

.btn:hover {
  color: #ffffff;
  transform: translateY(-6px);
  box-shadow: 0 20px 34px -12px rgba(226, 79, 48, 0.6);
}

.blue-btn {
  /* Pese al nombre (asi estaba en el template original), es el violeta
     de marca de Caddy - se le suma sombra a tono, igual que al .btn
     default, para que quede consistente con el resto. */
  background: #4D1A50;
  box-shadow: 0 14px 28px -12px rgba(77, 26, 80, 0.5);
}
.blue-btn:hover {
  box-shadow: 0 20px 34px -12px rgba(77, 26, 80, 0.6);
}

.btn-coral {
  /* Clase prolija para el coral de marca (antes duplicado como inline
     style suelto en el hero, ver index.html) - a pedido de Patricio,
     2026-09-23. */
  background: #E24F30;
  box-shadow: 0 14px 28px -12px rgba(226, 79, 48, 0.5);
}

.btn-whatsapp {
  /* Antes era .border-btn (link subrayado suelto) - pasa a boton
     "outline" en el verde de WhatsApp, para no desentonar al lado de
     los otros 3 botones solidos (Patricio, 2026-09-23). */
  background: transparent;
  color: #ffffff;
  border: 2px solid rgba(255, 255, 255, 0.6);
  box-shadow: none;
}
.btn-whatsapp:hover {
  background: #25D366;
  border-color: #25D366;
  color: #ffffff;
  box-shadow: 0 14px 28px -12px rgba(37, 211, 102, 0.6);
}
.btn-coral:hover {
  box-shadow: 0 20px 34px -12px rgba(226, 79, 48, 0.6);
}

.white-btn {
  background: #ffffff;
  color: #E24F30;
  transition: 0.3s;
}

.green-btn {
  background-image: -moz-linear-gradient(-51deg, #00c6fb 0%, #005bea 99%);
  background-image: -webkit-linear-gradient(-51deg, #00c6fb 0%, #005bea 99%);
  background-image: -ms-linear-gradient(-51deg, #00c6fb 0%, #005bea 99%);
}

.margon-btn {
  background-image: -moz-linear-gradient(-51deg, #cc208e 0%, #6713d2 99%);
  background-image: -webkit-linear-gradient(-51deg, #cc208e 0%, #6713d2 99%);
  background-image: -ms-linear-gradient(-51deg, #cc208e 0%, #6713d2 99%);
}

/* 2. header */
.header-transparent {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9;
  transition: 0.4s;
}

.sticky {
  left: 0;
  margin: auto;
  position: fixed;
  top: 0;
  width: 100%;
  box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.07);
  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;
}

.menu-3.sticky {
/*   background: #282828; */
  background: #4D1A50;
}

.menu-3.sticky {
/*   background: #282828; */
  background: #4D1A50;

}

.menu-3.sticky .main-menu nav > ul > li > a {
/*   background: #282828; */
 background: #4D1A50;

  padding: 40px 0;
}

.menu-3.sticky .header-2-right {
  margin-top: 35px;
}

.logo-mt {
  margin-top: 16px;
}

.header-lang {
  padding: 28px 0 17px;
  display: inline-block;
}

.lang-icon > a {
  font-size: 16px;
  color: #282828;
  margin-left: 5px;
  font-weight: 700;
}

.lang-icon i {
  font-size: 14px;
  position: relative;
  left: 3px;
  color: #E24F30;
}

.header-lang-list {
  position: absolute;
  width: 120px;
  opacity: 0;
  visibility: hidden;
  padding: 20px 15px;
  border-top: 3px solid #E24F30;
  transition: 0.4s;
  z-index: 999;
  background: #fff;
  padding-bottom: 5px;
  padding-top: 4px;
  top: 100%;
  box-shadow: 0 0 10px 3px rgba(0, 0, 0, 0.05);
  transition: 0.3s;
}

.header-lang:hover .header-lang-list {
  opacity: 1;
  visibility: visible;
}

.header-lang-list li {
  display: block;
  margin-bottom: 0;
  padding: 5px 0;
}
.header-lang-list li a {
  display: block;
  color: #647589;
  font-size: 13px;
}
.header-lang-list li a:hover {
  color: #E24F30;
}

.pos-rel {
  position: relative;
}

.menu-bar i {
  font-size: 35px;
  color: #9b9b9b;
  transition: 0.3s;
}
.menu-bar i:hover {
  color: #E24F30;
}

.menu-bar-red i {
  color: #282828;
}

.header-right-img {
  margin-top: 16px;
}

.header-info {
  margin-left: 45px;
  margin-top: 43px;
}
.header-info span {
  font-size: 18px;
  font-weight: 700;
  color: #282828;
  letter-spacing: -0.3px;
}
.header-info span i {
  color: #E24F30;
  font-size: 24px;
  margin-right: 5px;
}

.search-icon {
  margin-top: 42px;
  margin-left: 40px;
  margin-right: 45px;
}
.search-icon a {
  font-size: 18px;
  transition: 0.3s;
  color: #282828;
}
.search-icon a:hover {
  color: #E24F30;
}

.header-2-search {
  margin-right: 88px;
}

.header2-top-wrapper {
  margin-left: 24px;
}

/* extra info */
.extra-info {
  background: #152136;/*#4D1A50;*/
  height: 100%;
  padding: 30px;
  position: fixed;
  right: 0;
  top: 0;
  transition: all 0.7s ease 0s;
  width: 340px;
  z-index: 9999;
  transform: translateX(100%);
  padding-bottom: 40px;
}

.extra-info.info-open {
  transform: translateX(0);
}

.extra-info-left {
  right: inherit;
  left: 0;
  transform: translateX(-100%);
}

.extra-info.extra-info-left.info-open {
  transform: translateX(0);
}

.close-icon {
  margin-top: -16px;
  text-align: right;
}

.close-icon > button {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: 0 none;
  color: #E24F30;
  cursor: pointer;
  font-size: 20px;
  padding: 0;
}

.extra-info > p {
  color: #ddd;
  font-size: 15px;
  line-height: 28px;
}

.extra-info.extra-info-left.info-open {
  transform: translateX(0);
}

.instagram img {
  width: 100%;
}

.social-icon-right > a {
  color: #fff;
  display: inline-block;
  margin-right: 20px;
  text-align: center;
}

.social-icon-right > a:hover {
  color: #E24F30;
}

.instagram {
  overflow: hidden;
  margin: 0 -4px;
}

.instagram > a {
  float: left;
  width: 33.33%;
  padding: 0 4px;
  margin-bottom: 7px;
}

.side-info {
  border-top: 1px solid #344159;
  padding-top: 25px;
}

.contact-list h4 {
  color: #fff;
  font-weight: 500;
  font-size: 18px;
}

.contact-list p {
  color: #fff;
  opacity: 0.5;
  margin: 0;
  margin-bottom: 5px;
  line-height: 28px;
}

.side-menu ul li:hover a {
  color: #E24F30;
}

.header-top-area {
  padding: 17px 0;
}

.header-top-info span {
  color: #d7d7d7;
  font-size: 14px;
  font-weight: 400;
  margin-right: 45px;
}
.header-top-info span i {
  font-size: 14px;
  color: #E24F30;
  margin-right: 6px;
}
.header-top-info span:last-child {
  margin-right: 0;
}

.header-icon {
  margin-left: 50px;
}
.header-icon a {
  color: #9f9f9f;
  font-size: 14px;
  display: inline-block;
  text-align: center;
  margin-right: 13px;
  transition: 0.3s;
}
.header-icon a:last-child {
  margin-right: 0;
}
.header-icon a:hover {
  color: #E24F30;
}

.header-02-lang {
  padding: 1px 0 0;
  display: inline-block;
}

.header-02-lang .lang-icon > a {
  font-size: 16px;
  color: #d7d7d7;
  margin-left: 5px;
  font-weight: 400;
}

.header-2-right {
  margin-top: 58px;
  margin-left: 73px;
}

.header-2-right .header-icon {
  margin-left: 80px;
}

.header-2-right .header-02-lang {
  padding: 1px 0 5px;
  display: inline-block;
}

.header-2-right .header-icon a {
  color: #ffffff;
}
.header-2-right .header-icon a:hover {
  color: #E24F30;
}

.header-2-right .header-02-lang .lang-icon > a {
  font-size: 17px;
  color: #ffffff;
  font-weight: 700;
}

.header-02-right .search-icon {
  margin-top: 0;
  margin-left: 0;
  margin-right: 10px;
}

.header-02-right .search-icon a {
  font-size: 18px;
  color: #b5b5b5;
  border: 2px solid #b5b5b5;
  height: 70px;
  display: inline-block;
  width: 70px;
  text-align: center;
  line-height: 70px;
  transition: 0.3s;
}
.header-02-right .search-icon a:hover {
  background: #E24F30;
  color: #ffffff;
  border-color: #E24F30;
}

.menu-2-bar a {
  height: 70px;
  width: 70px;
  line-height: 70px;
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  color: #ffffff;
  display: inline-block;
  text-align: center;
  font-size: 32px;
}

/* menu */
.main-menu nav > ul > li {
  display: inline-block;
  position: relative;
  margin-left: 34px;
}

.main-menu nav > ul > li > a {
  margin-left: 0;
}

.main-menu nav > ul > li > a {
  display: block;
  font-size: 18px;
  padding: 47px 0;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  background: transparent;
  line-height: 1;
  position: relative;
  text-transform: capitalize;
  color: #282828;
  font-weight: 700;
}

.main-menu nav > ul > li > a i {
  font-size: 12px;
  margin-left: 3px;
}

.main-menu nav > ul > li:hover > a, .main-menu nav > ul > li.active > a {
  color: #E24F30;
}

/* sub-menu */
.main-menu nav > ul > li .sub-menu {
  background: #ffffff none repeat scroll 0 0;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
  left: 0;
  opacity: 0;
  position: absolute;
  top: 120%;
  transition: all 0.3s ease 0s;
  visibility: hidden;
  width: 220px;
  z-index: 9;
  border-top: 3px solid #E24F30;
  text-align: left;
}

.main-menu nav > ul > li:hover .sub-menu {
  opacity: 1;
  top: 100%;
  visibility: visible;
}

.main-menu nav > ul > li .sub-menu li {
  display: block;
}

.main-menu nav > ul > li .sub-menu li a {
  color: #666666;
  font-size: 14px;
  margin: 0;
  padding: 13px 20px;
  text-transform: capitalize;
  display: block;
  font-size: 400;
}

.main-menu nav > ul > li:hover > .sub-menu li > a:hover {
  color: #fff;
  background: #E24F30;
}

.menu-3 .main-menu nav > ul > li {
  margin-left: 45px;
}

.menu-3 .main-menu nav > ul > li > a {
  color: #ffffff;
  padding: 60px 0;
}

.menu-3 .main-menu nav > ul > li:hover > a, .main-menu nav > ul > li.active > a {
  color: #E24F30;
}

/* search modal */
#search-modal {
  background-color: rgba(23, 26, 33, 0.95);
}

#search-modal .modal-dialog {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  border: none;
  outline: 0;
}

#search-modal .modal-dialog .modal-content {
  background: #ffffff;
  border-radius: 16px;
  border: none;
  box-shadow: 0 30px 60px -12px rgba(40, 40, 40, 0.35);
  padding: 40px;
}

#search-modal .modal-dialog .modal-content h4 {
  margin-bottom: 6px;
}

#search-modal .modal-dialog .modal-content .close {
  position: absolute;
  top: 18px;
  right: 22px;
  font-size: 26px;
  color: #9b9b9b;
  background: none;
  border: none;
}

#search-modal .modal-dialog .modal-content form {
  width: 100%;
  position: relative;
  margin-top: 22px;
}

#search-modal .modal-dialog .modal-content form input {
  width: 100%;
  height: 58px;
  font-size: 16px;
  border: 1px solid #ececec;
  border-radius: 12px;
  background: #ffffff;
  color: #282828;
  padding: 0 50px 0 20px;
  box-shadow: 0 2px 10px -4px rgba(40, 40, 40, 0.06);
  transition: 0.25s;
}

#search-modal .modal-dialog .modal-content form input:focus {
  border: 1px solid #E24F30;
  box-shadow: 0 6px 18px -6px rgba(226, 79, 48, 0.3);
  outline: none;
}

#search-modal .modal-dialog .modal-content form input::-moz-placeholder {
  font-size: 15px;
  color: #9b9b9b;
}

#search-modal .modal-dialog .modal-content form input::placeholder {
  font-size: 15px;
  color: #9b9b9b;
}

#search-modal .modal-dialog .modal-content form button {
  position: absolute;
  right: 6px;
  top: 6px;
  height: 46px;
  width: 46px;
  border-radius: 10px;
  border: none;
  background: #E24F30;
  font-size: 16px;
  color: #ffffff;
  cursor: pointer;
}
#search-modal .modal-dialog .modal-content form button:hover {
  background: #441C42;
}

.header-shape {
  position: relative;
}

.header-shape::before {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  left: 0px;
  width: 415px;
  background: #E24F30;
  clip-path: polygon(0% 0, 87% 0%, 100% 100%, 0% 100%);
}

.header-shape::after {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  right: 0px;
  width: 415px;
  background: #E24F30;
  clip-path: polygon(0 0, 100% 0%, 100% 100%, 11% 100%);
}

.logo.logo-shape {
  transform: translateY(-27px);
}

.logo.logo-shape {
  transform: translateY(-27px);
  margin-left: 75px;
}

.header-2-button {
  position: relative;
  z-index: 99;
  transform: translateY(-29px);
  margin-left: -4px;
}

.main-menu-2 nav > ul > li {
  margin-left: 0;
  margin-right: 30px;
}

.header-2-button a.btn:hover {
  color: #E24F30;
}

/* 3. features */
.features-icon-img {
  position: relative;
  margin-bottom: 47px;
  z-index: 8;
}
.features-icon-img::before {
/*   position: absolute;
  content: ""; */
/*   background: #fff4ee; */
/*   height: 55px; */
/*   width: 55px; */
/*   left: -29px; */
/*   top: -30px; */
  transition: 0.3s;
  z-index: -1;
}

.features-wrapper:hover .features-icon-img::before {
  left: 0;
}

.features-text h3 {
  font-size: 18px;
  line-height: 1.2;
  margin-bottom: 21px;
  color: #E24F30; /*eu*/
}
.features-text h3 span {
  color: #E24F30;
}
.features-text p {
  margin-bottom: 17px;
  line-height: 25px;
  margin-right: 30px;
}

.b-button > a {
  font-size: 15px;
  color: #282828;
  font-weight: 700;
  text-transform: uppercase;
  border-bottom: 2px solid #282828;
  transition: 0.3s;
  display: inline-block;
}
.b-button > a:hover {
  color: #E24F30;
  border-color: #E24F30;
}

.b-02-button > a {
  color: #9b9b9b;
  border-bottom: 2px solid #9b9b9b;
  padding-bottom: 3px;
}

.black-b-button > a {
  color: #282828;
  border-bottom: 2px solid #282828;
  padding-bottom: 3px;
}

.white-b2-button > a {
  color: #ffffff;
  border-bottom: 2px solid #ffffff;
  padding-bottom: 3px;
}

.white-b-button > a {
  color: #ffffff;
  border-color: #ffffff;
}

.features-bg-img {
  background-size: auto;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 50%;
  background-position: center center;
}

.features-02-wrapper {
  padding: 80px 240px 100px 100px;
}

.play-video-icon {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  text-align: center;
}
.play-video-icon a {
  font-size: 22px;
  color: #E24F30;
  background: #ffffff;
  height: 120px;
  display: inline-block;
  width: 120px;
  line-height: 120px;
  text-align: center;
  border-radius: 50%;
  transition: 0.3s;
  position: relative;
}
.play-video-icon a::before {
  content: "";
  display: inline-block;
  position: absolute;
  top: -2px;
  left: -2px;
  bottom: -2px;
  right: -2px;
  border-radius: inherit;
  border: 1px solid #fff;
  -webkit-animation: btnIconRipple 2s cubic-bezier(0.23, 1, 0.32, 1) both infinite;
  animation: btnIconRipple 2s cubic-bezier(0.23, 1, 0.32, 1) both infinite;
  transition: 0.3s;
}

@-webkit-keyframes btnIconRipple {
  0% {
    border-width: 4px;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  80% {
    border-width: 1px;
    -webkit-transform: scale(1.35);
    transform: scale(1.35);
  }
  100% {
    opacity: 0;
  }
}
.features-02-link ul li {
  padding-bottom: 23px;
}
.features-02-link ul li:last-child {
  padding-bottom: 0;
}

.features-02-icon {
  margin-right: 28px;
}

.features-02-icon i {
  font-size: 24px;
  color: #E24F30;
  line-height: 60px;
  width: 60px;
  background: #fae9e2;
  text-align: center;
  border-radius: 50%;
  line-height: 60px;
  transition: 0.3s;
  
}

.features-02-link li:hover .features-02-icon i {
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  color: #ffffff;
}

.features-02-info {
  overflow: hidden;
}
.features-02-info h3 {
  font-size: 22px;
  margin-bottom: 12px;
}
.features-02-info p {
  margin-bottom: 0;
}

.features-03-img > img {
  width: 100%;
}
.features-03-img::before {
  background-image: -webkit-linear-gradient(-90deg, rgba(2, 2, 2, 0.8902) 0%, rgba(149, 56, 12, 0.45) 58%, rgba(255, 94, 20, 0.01) 100%, #E24F30 100%);
  content: "";
  display: inline-block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  transition: 0.3s;
  opacity: 1;
}
.features-03-img::after {
  background-image: -webkit-linear-gradient(-90deg, rgba(252, 79, 0, 0.85882) 0%, rgba(254, 88, 12, 0.43) 50%, rgba(255, 94, 20, 0.01) 100%, #E24F30 100%);
  content: "";
  display: inline-block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  transition: 0.3s;
  opacity: 0;
}

.features-03-wrapper:hover .features-03-img::before {
  opacity: 0;
}

.features-03-wrapper:hover .features-03-img::after {
  opacity: 1;
}

.features-03-text {
  position: absolute;
  top: 0;
  padding: 40px;
  z-index: 99;
}
.features-03-text h3 {
  color: #ffffff;
  font-size: 24px;
  line-height: 1.4;
  position: relative;
  margin-top: 28px;
  letter-spacing: -0.3px;
  margin-bottom: 0;
  padding-bottom: 30px;
}
.features-03-text h3::before {
  height: 4px;
  width: 51px;
  background: #ffffff;
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  transition: 0.3s;
}
.features-03-text h2 {
  font-size: 90px;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #ffffff;
  margin-bottom: 0;
  color: #ffffff;
  position: absolute;
  top: 95px;
  opacity: 0.2;
  font-weight: 700;
}

.services-b-btton {
  position: absolute;
  bottom: 40px;
  right: 40px;
  z-index: 9;
}
.services-b-btton > a {
  color: #ffffff;
  border-bottom: 2px solid #ffffff;
  padding-bottom: 3px;
}

.features-3-area {
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
}

.single-features-03 {
  padding: 110px 273px 130px 100px;
}

.single-features-03 .features-02-info h3 {
  color: #ffffff;
}

.single-features-03 .features-02-info p {
  margin-bottom: 0;
  color: #ffffff;
}

.single-features-03 .features-02-link li:hover .features-02-icon i {
  background-image: none;
  color: #E24F30;
}

.features-03-button .btn {
  color: #E24F30;
}

.features-01-area {
  margin-top: -258px;
  background: #ffffff;
  margin-left: 310px;
  margin-right: 310px;
}

.features-01-wrapper {
  margin-left: 20px;
}

.features-01-wrapper .features-text {
  overflow: hidden;
}

.features-01-wrapper .features-icon-img {
  margin-right: 22px;
  margin-top: 21px;
}

.features-01-wrapper .features-icon-img::before {
  left: -19px;
  top: -18px;
}

.features-01-wrapper .features-text h3 {
  line-height: 1;
  margin-bottom: 11px;
}

.features-01-wrapper .features-text p {
  margin-bottom: 9px;
}

/* 3. about */
.about-us-wrapper {
  margin-top: 17px;
}

.section-title h1 {
  position: absolute;
  z-index: 1;
  font-size: 220px;
  line-height: 1;
  opacity: 0.07;
  top: -28px;
  left: 0;
  margin-bottom: 0;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-width: 2px;
}
.section-title > span {
  color: #E24F30;
  font-family: "Poppins";
  font-weight: 700;
  font-size: 20px;
}
.section-title h2 {
  font-size: 50px;
  margin-top: 22px;
  letter-spacing: -0.3px;
}
.section-title p {
  margin-bottom: 0;
  margin-top: 35px;
}

.line {
  padding-left: 75px;
  position: relative;
}
.line::before {
  position: absolute;
  background: #E24F30;
  content: "";
  height: 3px;
  width: 45px;
  left: 0;
  bottom: 11px;
}

.line-white::before {
  background: #ffffff;
}

.section-2 h1 {
  right: 0;
}

.white-title span {
  color: #ffffff;
}
.white-title h1 {
  color: #ffffff;
}
.white-title h2 {
  color: #ffffff;
}

.white-02-title span {
  color: #E24F30;
}
.white-02-title h1 {
  color: #ffffff;
}
.white-02-title h2 {
  color: #ffffff;
}

.border-left-1 {
  height: 3px;
  width: 45px;
  background: #E24F30;
  left: -15px;
  display: inline-block;
  position: relative;
  top: -6px;
}

.border-right-1 {
  height: 3px;
  width: 45px;
  background: #E24F30;
  right: -15px;
  display: inline-block;
  top: -6px;
  position: relative;
}

.border-left-theme {
  background: #E24F30;
}

.border-right-theme {
  background: #E24F30;
}

.border-left-white {
  background: #ffffff;
}

.border-right-white {
  background: #ffffff;
}

.about-us-text > span {
  color: #282828;
  font-family: "Poppins";
  font-size: 18px;
  line-height: 28px;
  font-weight: 600;
}
.about-us-text p {
  margin-top: 20px;
  margin-right: 32px;
  margin-bottom: 36px;
}

.about-us-img {
  margin-right: 35px;
}
.about-us-img img {
  width: 100%;
}

.section-area {
  padding-bottom: 585px;
}

.about-wrapper {
  margin-left: 40px;
}

.about-img {
  margin-right: 30px;
}
.about-img img {
  width: 100%;
}

.about-wrapper .about-us-text p {
  margin-top: 0;
  margin-right: 0;
  margin-bottom: 40px;
}

.about-icon {
  margin-right: 18px;
}
.about-icon i {
  color: #E24F30;
  font-size: 45px;
}

.about-info h2 {
  font-size: 45px;
  font-weight: 600;
  line-height: 0.8;
}
.about-info h2 > span {
  font-size: 30px;
  color: #E24F30;
  position: relative;
  top: -27px;
  left: -5px;
}
.about-info > span {
  color: #9b9b9b;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 500;
}

.about-say-img {
  float: left;
  margin-right: 20px;
}

.about-say-content {
  padding-top: 5px;
  overflow: hidden;
}
.about-say-content h4 {
  font-size: 24px;
  margin-bottom: 5px;
}
.about-say-content span {
  font-size: 14px;
  color: #E24F30;
  font-weight: 700;
  text-transform: uppercase;
}

.about-02-img {
  margin-left: 30px;
  padding-right: 40px;
}
.about-02-img img {
  width: 100%;
}

.about-02-info {
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  position: absolute;
  right: 0;
  bottom: -30px;
  padding: 34px 40px 25px;
  border-radius: 10px;
}

.about-info-date {
  margin-right: 10px;
}
.about-info-date h2 {
  font-size: 60px;
  margin-bottom: 0;
  line-height: 1;
  letter-spacing: -0.3px;
  color: #ffffff;
}
.about-info-date h2 > span {
  font-size: 40px;
  color: #ffffff;
  position: relative;
  top: -30px;
  left: -5px;
  font-weight: 400;
}

.about-info-content {
  overflow: hidden;
}
.about-info-content h3 {
  margin-bottom: 0;
  color: #ffffff;
  font-size: 24px;
  font-family: "Roboto";
  font-weight: 400;
  line-height: 1.2;
}

.about-02-wrapper {
  margin-left: 30px;
}

.about-info-list {
  margin-bottom: 30px;
}
.about-info-list:last-child {
  margin-bottom: 0;
}

.about-info-icon {
  margin-right: 30px;
  position: relative;
  top: 5px;
}

.about-info-text {
  overflow: hidden;
}
.about-info-text h4 {
  font-size: 20px;
  line-height: 1.3;
}
.about-info-text p {
  margin-bottom: 0;
  margin-right: 42px;
}

.about-me-info span {
  font-family: "Poppins";
  font-size: 18px;
  color: #282828;
  line-height: 28px;
  font-weight: 600;
}
.about-me-info p {
  margin-bottom: 0;
  margin-top: 20px;
}

.about-me-img img {
  width: 100%;
}

.about-me-text {
  margin-top: 47px;
}
.about-me-text h3 {
  font-size: 24px;
  line-height: 1;
  position: relative;
  padding-bottom: 27px;
  margin-bottom: 23px;
}
.about-me-text h3 i {
  color: #E24F30;
  margin-right: 15px;
}
.about-me-text h3::before {
  background: #eeeeee;
  height: 2px;
  width: 100%;
  position: absolute;
  content: "";
  left: 0;
  bottom: 0;
  transition: 0.3s;
}
.about-me-text h3::after {
  background: #E24F30;
  height: 2px;
  width: 0;
  position: absolute;
  content: "";
  left: 0;
  bottom: 0;
  transition: 0.3s;
}
.about-me-text p {
  font-size: 16px;
  margin-bottom: 17px;
}

.about-me-wrapper:hover .about-me-text h3::after {
  width: 100%;
}

.about-me-wrapper.active .about-me-text h3::after {
  width: 100%;
}

.ab-01 {
  top: 10%;
  right: 15%;
}

/* 5. cta */
.cta-area {
  background-size: cover;
  background-position: center center;
}

.cta-text > span {
  font-size: 24px;
  font-weight: 700;
  border-bottom: 1px solid #ffffff;
  color: #ffffff;
}
.cta-text h1 {
  font-size: 60px;
  color: #ffffff;
  letter-spacing: -0.3px;
  line-height: 1.08;
  margin-top: 32px;
  margin-bottom: 37px;
}
.cta-text p {
  font-size: 18px;
  line-height: 30px;
  color: #ffffff;
  padding: 0 50px;
  margin-bottom: 36px;
}

/* 6. services */
.services-area {
  background-size: cover;
  background-position: center center;
}

.services-padding {
  margin-top: -518px;
  margin-bottom: -98px;
}

.services-img {
  overflow: hidden;
}
.services-img::before {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  content: "";
  background: #111111;
  opacity: 0.7;
  transition: 0.3s;
  z-index: 1;
}
.services-img img {
  width: 100%;
  transition: 0.3s;
}

.services-wrapper:hover .services-img img {
  transform: scale(1.1);
}

.services-text {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 20px 30px 40px 30px;
  z-index: 99;
}
.services-text h1 {
  font-size: 80px;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #ffffff;
  text-align: center;
  margin-bottom: 15px;
  color: #ffffff;
}
.services-text h2 {
  font-size: 30px;
  letter-spacing: -0.3px;
  color: #ffffff;
}
.services-text p {
  color: #ffffff;
  line-height: 25px;
}

.services-content {
  background: #282828;
  padding: 19px 15px 22px 15px;
  transition: 0.3s;
}
.services-content h3 {
  font-size: 24px;
  margin-bottom: 0;
  color: #ffffff;
}

.services-wrapper:hover .services-content {
  background: #E24F30;
}

.services-02-wrapper {
  background-color: #ffffff;
  padding: 60px;
}

.services-02-text h3 {
  font-size: 24px;
  margin-top: 26px;
  margin-bottom: 34px;
}
.services-02-text p {
  margin-bottom: 35px;
}

.arrow-style .slick-arrow {
  width: 70px;
  height: 70px;
  line-height: 70px;
  background: #ffffff;
  padding: 0;
  border-radius: 5px;
  color: #E24F30;
  font-size: 22px;
  margin: 0;
  position: absolute;
  top: 50%;
  left: -180px;
  z-index: 99;
  transform: translateY(-50%);
  border: 0;
  cursor: pointer;
  transition: 0.3s;
}

.arrow-style .slick-next {
  right: -180px;
  left: auto;
}

.arrow-style .slick-arrow:hover {
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  color: #ffffff;
}

.arrow-style .slick-dots {
  text-align: center;
  bottom: -100px;
  z-index: 99;
  position: absolute;
  left: 0;
  right: 0;
}

.arrow-style .slick-dots li {
  display: inline-block;
  margin: 0 4px;
}

.arrow-style .slick-dots li button {
  height: 15px;
  width: 15px;
  text-indent: -9999px;
  transition: 0.3s;
  padding: 0;
  border: 2px solid #E24F30;
  border-radius: 50%;
  background: none;
  cursor: pointer;
}

.arrow-style .slick-dots li.slick-active button {
  background: #E24F30;
}

.our-services-wrapper {
  overflow: hidden;
}

.inner-our-services {
  background-color: #ffffff;
  overflow: hidden;
  position: relative;
  padding: 30px 43px 35px;
  transition: 0.3s;
}

.our-services-wrapper:hover .inner-our-services {
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
}

.our-services-img {
  overflow: hidden;
}
.our-services-img img {
  width: 100%;
  transition: 0.3s;
}

.our-services-wrapper:hover .our-services-img img {
  transform: scale(1.1);
}

.our-services-text h3 {
  margin-bottom: 0;
  font-size: 24px;
  margin-right: 68px;
  line-height: 1.2;
  position: relative;
  transition: 0.3s;
}
.our-services-text h3::before {
  position: absolute;
  height: 55px;
  width: 5px;
  background: #E24F30;
  content: "";
  left: -43px;
  top: 7px;
  transition: 0.3s;
}

.our-services-wrapper:hover .our-services-text h3 {
  color: #ffffff;
}

.our-services-wrapper:hover .our-services-text h3::before {
  background: #ffffff;
}

.our-services-button {
  position: absolute;
  top: 34px;
  right: 35px;
}
.our-services-button > a {
  height: 55px;
  width: 55px;
  border: 2px solid #ececec;
  line-height: 55px;
  font-size: 18px;
  color: #9b9b9b;
  display: inline-block;
  transition: 0.3s;
  border-radius: 50%;
  text-align: center;
}

.our-services-wrapper:hover .our-services-button > a {
  border-color: #ffffff;
  color: #282828;
  background: #ffffff;
}

/* 7. testimonial */
.testimonial-area {
  background-size: cover;
  background-position: center center;
}

.testimonial-text {
  box-shadow: 0px 0px 29.7px 0.3px rgba(234, 234, 234, 0.78);
  overflow: hidden;
  padding: 38px 50px 44px 50px;
}
.testimonial-text p {
  font-size: 20px;
  line-height: 35px;
  margin-bottom: 27px;
}
.testimonial-text h3 {
  font-size: 24px;
  margin-bottom: 3px;
}
.testimonial-text span {
  color: #E24F30;
  font-size: 13px;
  text-transform: uppercase;
  font-weight: 500;
  position: relative;
  padding-left: 42px;
}
.testimonial-text span::before {
  position: absolute;
  content: "";
  height: 2px;
  width: 30px;
  background: #E24F30;
  left: 0;
  top: 7px;
}

.testimonial-active .slick-arrow {
  font-size: 22px;
  right: 0;
  opacity: 1;
  position: absolute;
  text-align: center;
  top: 56%;
  transition: all 0.3s ease 0s;
  visibility: visible;
  color: #ffffff;
  height: 70px;
  width: 70px;
  line-height: 70px;
  border-radius: 5px;
  border: 3px solid transparent;
  cursor: pointer;
  z-index: 9;
  background: #E24F30;
}

.testimonial-active .slick-next {
  top: 38%;
}

.testimonial-active .slick-arrow:hover {
  background: none;
  border: 3px solid #ececec;
  color: #E24F30;
}

.testimonial-active .slick-dots {
  text-align: center;
  bottom: -79px;
  z-index: 99;
  position: absolute;
  left: 0;
  right: 0;
}

.testimonial-active .slick-dots li {
  display: inline-block;
  margin: 0 4px;
}

.testimonial-active .slick-dots li button {
  height: 15px;
  width: 15px;
  text-indent: -9999px;
  transition: 0.3s;
  padding: 0;
  border: 2px solid #E24F30;
  border-radius: 50%;
  background: none;
  cursor: pointer;
}

.testimonial-active .slick-dots li.slick-active button {
  background: #E24F30;
}

.testimonial-02-img img {
  width: 100%;
}

.testimonial-video-icon {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  text-align: center;
}
.testimonial-video-icon a {
  font-size: 15px;
  color: #ffffff;
  height: 80px;
  display: inline-block;
  width: 80px;
  line-height: 80px;
  text-align: center;
  border-radius: 50%;
  transition: 0.3s;
  position: relative;
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
}
.testimonial-video-icon a::before {
  content: "";
  display: inline-block;
  position: absolute;
  top: -2px;
  left: -2px;
  bottom: -2px;
  right: -2px;
  border-radius: inherit;
  border: 1px solid #fff;
  -webkit-animation: btnIconRipple 2s cubic-bezier(0.23, 1, 0.32, 1) both infinite;
  animation: btnIconRipple 2s cubic-bezier(0.23, 1, 0.32, 1) both infinite;
  transition: 0.3s;
}

@-webkit-keyframes btnIconRipple {
  0% {
    border-width: 4px;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  80% {
    border-width: 1px;
    -webkit-transform: scale(1.35);
    transform: scale(1.35);
  }
  100% {
    opacity: 0;
  }
}
.inner-02-testimonial {
  background: #ffffff;
  padding: 30px 50px 39px;
  margin-left: 45px;
  margin-right: 20px;
  transition: 0.3s;
}

.inner-02-testimonial:hover {
  margin-left: 0;
}

.tesimonial-02-content p {
  font-size: 20px;
  line-height: 35px;
  margin-bottom: 18px;
}

.client-say-img {
  float: left;
  margin-right: 20px;
}

.client-say-content {
  padding-top: 4px;
  overflow: hidden;
}
.client-say-content h4 {
  font-size: 20px;
  margin-bottom: 3px;
}
.client-say-content span {
  color: #E24F30;
  font-size: 13px;
  text-transform: uppercase;
  font-weight: 500;
  position: relative;
  padding-left: 42px;
}
.client-say-content span::before {
  position: absolute;
  content: "";
  height: 2px;
  width: 30px;
  background: #E24F30;
  left: 0;
  top: 7px;
}

.shape-item {
  position: absolute;
}

.test-01 {
  top: 22%;
  right: 11%;
}

.test-02 {
  bottom: 10%;
  left: 16%;
}

.clients-wrapper {
  background: #ffffff;
  padding: 50px 50px 50px 50px;
  position: relative;
}
.clients-wrapper::after {
  position: absolute;
  content: "";
  font-family: "Font Awesome 5 Pro";
  display: inline-block;
  color: #ffffff;
  font-size: 20px;
  top: -32px;
  font-weight: 400;
  height: 60px;
  width: 60px;
  line-height: 60px;
  text-align: center;
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  left: 50px;
  border-radius: 50%;
}

.bg {
  border-radius: 50%;
  position: absolute;
  left: 426px;
  top: 5389px;
  width: 60px;
  height: 60px;
  z-index: 258;
}

.skills-bg-img {
  background-size: cover;
  height: 100%;
  right: 0;
  position: absolute;
  top: 0;
  width: 50%;
  background-position: center center;
}

.skills-wrapper {
  padding: 97px 199px 100px 201px;
}

.progress-bar-text {
  overflow: hidden;
}

.bar-title h4 {
  display: inline-block;
  font-size: 18px;
  margin-bottom: 17px;
  font-weight: 700;
}

.progress-bar span {
  font-size: 18px;
  margin-top: -52px;
  color: #1e283c;
  font-weight: 700;
}

.progress-bar {
  background-color: #E24F30;
  text-align: right;
}

.progress {
  border-radius: 0;
  height: 5px;
  overflow: visible;
  background: #e0e0e0;
}

.our-skills-area {
  background-size: cover;
  background-position: center center;
}

.our-skills-text p {
  color: #ffffff;
  margin-right: 98px;
  margin-bottom: 40px;
}

.our-skills-text a.white-btn {
  color: #E24F30;
}

.progress-circular input {
  font-size: 51px !important;
  font-weight: 700;
  line-height: 1;
}

.our-skills-content h3 {
  color: #ffffff;
  font-size: 24px;
  margin-bottom: 0;
  margin-top: 21px;
}

.skills-single-wrapper {
  overflow: hidden;
  margin-right: 100px;
}

.skills-single-wrapper .progress {
  height: 7px;
  background: #ffebe2;
}

.skills-single-wrapper .progress-bar {
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  text-align: right;
}

.skills-02-area {
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
}

.skills-2 .progress-bar span {
  color: #ffffff;
}

.skills-2 .progress-bar {
  background-color: #ffffff;
}

.skills-2 .bar-title h4 {
  color: #ffffff;
}

.skills-2 .progress {
  background: #fb7141;
}

/* 8. project */
.project-02-area {
  margin-right: 210px;
  margin-left: 210px;
}

.single-project {
  overflow: hidden;
}

.project-img {
  overflow: hidden;
}
.project-img img {
  width: 100%;
}

.single-project:hover .project-img img {
  -webkit-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}

.inner-project {
  box-shadow: 0px 0px 29.7px 0.3px rgba(220, 220, 220, 0.78);
  background: #ffffff;
  margin-left: 50px;
  margin-right: 22px;
  margin-bottom: 60px;
  padding: 26px 30px 28px 30px;
  margin-top: -28px;
  z-index: 9;
  position: relative;
}

.project-text {
  overflow: hidden;
}

.project-link-info {
  overflow: hidden;
}

.project-meta > a {
  color: #9b9b9b;
  font-size: 14px;
}
.project-meta > a i {
  color: #E24F30;
  font-size: 18px;
  margin-right: 3px;
}

.project-link > a {
  color: #9b9b9b;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 500;
  margin-right: 11px;
  transition: 0.3s;
}
.project-link > a:hover {
  color: #E24F30;
}
.project-link > a:last-child {
  margin-right: 0;
}

.project-content {
  overflow: hidden;
  margin-top: 10px;
  margin-bottom: 8px;
}
.project-content h3 {
  font-size: 24px;
}
.project-content h3 > a {
  transition: 0.3s;
  color: #282828;
}
.project-content h3 > a:hover {
  color: #E24F30;
}

.project-b-button > a {
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  height: 36px;
  width: 36px;
  line-height: 36px;
  border-radius: 50%;
  display: inline-block;
  font-size: 14px;
  color: #ffffff;
  text-align: center;
  transition: 0.3s;
}
.project-b-button > a:hover {
  background: #282828;
}

.project-button {
  overflow: hidden;
}

.portfolio-menu button {
  background: rgba(2, 2, 2, 0) none repeat scroll 0 0;
  border: medium none;
  color: #9b9b9b;
  font-family: "Poppins";
  font-size: 18px;
  line-height: 1;
  transition: all 0.3s ease 0s;
  cursor: pointer;
  text-transform: capitalize;
  padding: 0 16px;
  font-weight: 600;
  position: relative;
  letter-spacing: -0.3px;
}

.portfolio-menu button:focus {
  outline: 0 none;
}

.portfolio-menu button:hover {
  color: #E24F30;
}

.portfolio-menu button.active {
  color: #E24F30;
}

.custom {
  margin: 0 -15px;
}

.portfolio-img {
  overflow: hidden;
}
.portfolio-img > a {
  display: inline-block;
  position: relative;
}
.portfolio-img > a img {
  width: 100%;
  transition: 0.3s;
}
.portfolio-img > a::before {
  background-image: -webkit-linear-gradient(-51deg, rgba(235, 18, 10, 0.85098) 0%, rgba(245, 57, 15, 0.89) 51%, rgba(255, 94, 20, 0.93) 99%, #E24F30 100%);
  content: "";
  display: inline-block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  transition: 0.3s;
  opacity: 0;
  z-index: 99;
}

.portfolio-wrapper:hover .portfolio-img > a::before {
  opacity: 1;
}

.portfolio-wrapper:hover .portfolio-img img {
  transform: scale(1.1);
}

.portfolio-text {
  position: absolute;
  top: 40%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  z-index: 999;
  transition: 0.3s;
  opacity: 0;
}
.portfolio-text h2 {
  font-size: 30px;
}
.portfolio-text h2 > a {
  transition: 0.3s;
  color: #ffffff;
}

.portfolio-wrapper:hover .portfolio-text {
  opacity: 1;
  top: 50%;
}

.portfolio-icon > a {
  font-size: 60px;
  color: #ffffff;
}

.single-02-project .inner-project {
  margin-bottom: 30px;
}

/* 9. counter */
.counter-area {
  background-position: center center;
  background-size: cover;
}

.counter-padding {
  padding-top: 350px;
}

.counter-wrapper {
  overflow: hidden;
}

.counter-icon i {
  font-size: 80px;
  color: #E24F30;
  line-height: 1;
}

.counter-text {
  margin-bottom: 36px;
}
.counter-text h1 {
  color: #ffffff;
  font-size: 45px;
  line-height: 1;
  margin-top: 25px;
}
.counter-text h1 > span {
  font-size: 30px;
  font-weight: 600;
  color: #E24F30;
  position: relative;
  top: -27px;
  left: -4px;
  color: #E24F30;
}
.counter-text span {
  color: #ffffff;
  font-size: 14px;
  font-weight: 500;
}

.counter-wrapper .progress {
  border-radius: 0;
  height: 7px;
  overflow: visible;
  background: #fff;
}

.counter-wrapper .progress-bar {
  background-image: -moz-linear-gradient(0deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(0deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(0deg, #eb120a 0%, #E24F30 99%);
  text-align: right;
  border-radius: 0 30px 30px 0;
}

.counter-white .counter-text h1 {
  color: #282828;
}

.counter-white .counter-wrapper .progress {
  background: #e4e4e4;
}

/* 10. newsletters */
.newsletters-area {
  background-size: cover;
  background-position: bottom right;
}

.single-newsletters {
  margin-right: 70px;
}

.news-box {
  position: relative;
}
.news-box::before {
  position: absolute;
  content: "";
  font-family: "Font Awesome 5 Pro";
  display: inline-block;
  font-size: 18px;
  text-align: center;
  right: 40px;
  color: #E24F30;
  top: 25px;
}

.newsletter-form form {
  position: relative;
}

.newsletter-form form input {
  height: 80px;
  padding: 0 40px;
  background: #ffffff;
  color: #9b9b9b;
  font-size: 18px;
  border-radius: 10px;
  border: none;
  width: 100%;
}

.newsletter-form form input::placeholder {
  color: #9b9b9b;
  font-size: 18px;
  font-weight: 400;
}

.newsletter-form form::-moz-placeholder {
  color: #9b9b9b;
  font-size: 18px;
  font-weight: 400;
}

.newsletter-form form button.btn {
  margin-top: 15px;
}

.single-02-newsletters {
  margin-right: 36px;
  margin-left: 30px;
}

.single-02-newsletters .newsletter-form form input {
  padding: 0 65px;
}

.single-02-newsletters .news-box::before {
  left: 30px;
  right: auto;
}

.single-02-newsletters .newsletter-form form button {
  position: absolute;
  right: 0;
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  top: 0;
  font-size: 30px;
  color: #fff;
  border: none;
  padding: 25px;
  line-height: 1;
  border-radius: 10px;
}

.newsletters-shape-img {
  position: absolute;
  bottom: 0;
  left: 120px;
}

/* 11. blog */
.blog-img {
  position: relative;
}
.blog-img > a {
  display: inline-block;
  overflow: hidden;
}
.blog-img > a img {
  width: 100%;
  transition: 0.3s;
}

.blog-wrapper:hover .blog-img img {
  transform: scale(1.1);
}

.blog-date {
  position: absolute;
  top: 20px;
  left: 20px;
}
.blog-date > a {
  color: #ffffff;
  font-size: 20px;
  text-transform: capitalize;
  font-weight: 700;
  background: #E24F30;
  line-height: 24px;
  padding: 7px 18px;
  display: inline-block;
  font-family: "Poppins";
}

.blog-text {
  margin-top: 22px;
}
.blog-text h3 {
  font-size: 24px;
  line-height: 1.3;
  letter-spacing: -0.3px;
  margin-bottom: 23px;
}
.blog-text h3 > a {
  transition: 0.3s;
}
.blog-text h3 > a:hover {
  color: #E24F30;
}

.latest-news {
  position: relative;
}

.news__thumb img {
  width: 100%;
}

.postbox__thumb img {
  width: 100%;
}

.blog-inner-img img {
  width: 100%;
}

.news-meta span {
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #747691;
  margin-right: 15px;
  font-size: 13px;
}

.news-meta span a {
  color: #747691;
}

.news-meta span a:hover {
  color: #E24F30;
}

.news__caption h2 {
  font-size: 24px;
  margin-bottom: 15px;
  line-height: 1.4;
}

.news__caption h2 a:hover {
  color: #E24F30;
}

.news-link {
  font-size: 12px;
  color: #e4ecf3;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 2px;
}

.news-link:hover {
  color: #ffffff;
}

.news-link i {
  transition: 0.3s;
  display: inline-block;
}

.news-link:hover i {
  transform: translateX(3px);
}

.news__thumb-2 img {
  width: 100%;
}

.news__caption-2 {
  padding: 33px;
}

.news__caption-2 h2 {
  font-size: 20px;
  margin-bottom: 15px;
}

.news__caption-2 h2 a:hover {
  color: #E24F30;
}

.news__caption-2 p {
  margin-bottom: 0;
}

.news-meta span {
  text-transform: uppercase;
  margin-right: 25px;
  font-size: 13px;
}

@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .news-meta span {
    margin-right: 10px;
  }
}
.news-meta span a {
  color: #E24F30;
  letter-spacing: 2px;
  font-weight: 500;
}

.postbox__thumb {
  position: relative;
}

.postbox__thumb a img {
  max-width: 100%;
}

.post-meta span {
  font-size: 12px;
  letter-spacing: 2px;
  font-weight: 500;
  text-transform: uppercase;
  color: #6f7172;
  margin-right: 20px;
}

@media (max-width: 767px) {
  .post-meta span {
    margin-right: 10px;
  }
}
.post-meta span a:hover {
  color: #E24F30;
}

.post-meta span i {
  color: #E24F30;
  margin-right: 2px;
}

.post-meta span a {
  color: #6f7172;
}

.postbox__text {
  background: #faf9ff;
}

.p-50 {
  padding: 50px;
}

@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .p-50 {
    padding: 30px;
  }
}
@media (max-width: 767px) {
  .p-50 {
    padding: 30px;
  }
}
.p-30 {
  padding: 30px;
}

.post-meta {
  margin-bottom: 20px;
}

.blog-title {
  font-size: 28px;
  line-height: 1.3;
  margin-bottom: 20px;
}

.blog-title a:hover {
  color: #E24F30;
}

.read-more {
  letter-spacing: 2px;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 500;
}

.read-more {
  color: #E24F30;
}

.read-more .btn:hover {
  transform: translateY(-2px);
}

.read-more:hover {
  color: #8fb569;
}

.read-more i {
  transition: 0.3s;
  display: inline-block;
}

.blog-title-sm {
  font-size: 20px;
  margin-bottom: 10px;
  line-height: 1.5;
}

.postbox__gallery .slick-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 30px;
  border: none;
  background: none;
  padding: 0;
  z-index: 9;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
  background: #ffffff;
  width: 60px;
  height: 60px;
  color: #6f7172;
  border-radius: 50%;
  font-size: 14px;
}

.postbox__gallery .slick-arrow:hover {
  background: #E24F30;
  color: #ffffff;
}

.postbox__gallery .slick-arrow.slick-next {
  right: 30px;
  left: auto;
}

.postbox__video {
  position: relative;
}

.video-btn {
  position: absolute;
  background: #ffffff;
  height: 120px;
  width: 120px;
  top: 50%;
  left: 0;
  right: 0;
  margin: auto;
  text-align: center;
  border-radius: 50%;
  line-height: 120px;
  color: #E24F30;
  transform: translateY(-50%);
}

.video-btn:hover {
  background: #E24F30;
  color: #ffffff;
}

.post-text blockquote {
  background: none;
  padding: 40px 50px;
  position: relative;
  border-left: 5px solid #E24F30;
  color: #444;
  margin-top: 30px;
  margin-bottom: 30px;
}

@media (max-width: 767px) {
  .post-text blockquote {
    padding: 30px;
  }
}
.post-text blockquote p {
  font-size: 26px;
  margin-bottom: 20px;
  color: #222;
  font-weight: 600;
  line-height: 1.3;
}

.post-text blockquote footer {
  font-size: 14px;
  letter-spacing: 2px;
  color: #222;
  font-weight: 500;
  text-transform: uppercase;
}

.search-form {
  position: relative;
}

.search-form input {
  width: 100%;
  height: 80px;
  border: 1px solid #d7d7d7;
  padding: 0 20px;
  font-size: 18px;
  color: #282828;
  font-weight: 600;
}

.search-form button {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  padding: 0 30px;
  color: #ffffff;
  line-height: 60px;
  border: 0;
}

.search-form button:hover {
  background: #E24F30;
}

.search-form input::-moz-placeholder {
  font-size: 18px;
  color: #282828;
  font-weight: 600;
}

.search-form input::placeholder {
  font-size: 18px;
  color: #282828;
  font-weight: 600;
}

.widget {
  padding: 30px;
  background-color: #ffffff;
  box-shadow: 0px 8px 16px 0px rgba(200, 183, 255, 0.2);
}

.widget-2 {
  box-shadow: none;
}

.widget-title {
  font-size: 22px;
  position: relative;
  display: block;
  padding-bottom: 20px;
  border-bottom: 2px solid #ededed;
  margin-bottom: 35px;
}

.widget-title::after {
  position: absolute;
  content: "";
  width: 70px;
  height: 3px;
  left: 0;
  bottom: -2px;
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
}

.about-me img {
  margin-bottom: 25px;
  border-radius: 50%;
}

.about-me h4 {
  font-size: 18px;
  letter-spacing: 1px;
}

.widget-social-icon a {
  display: inline-block;
  margin: 0 8px;
  color: #E24F30;
}

.widget-social-icon a:hover {
  color: #E24F30;
}

.banner-widget img {
  width: 100%;
}

.widget .recent-posts > li:first-child {
  border: 0;
  padding-top: 0;
}

.widget .recent-posts li:last-child {
  padding-bottom: 0;
}

.widget .recent-posts > li {
  border-top: 1px solid #eaedff;
  padding: 20px 0;
  overflow: hidden;
}

.widget-posts-image {
  float: left;
}

.widget-posts-image img {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  margin-right: 15px;
}

.widget-posts-body {
  overflow: hidden;
}

.widget-posts-title {
  margin-bottom: 10px;
  font-size: 16px;
  line-height: 1.3;
}

.widget-posts-title a:hover {
  color: #E24F30;
}

.widget-posts-meta {
  font-size: 12px;
}

ul.cat li {
  border-top: 1px solid #eaedff;
  padding: 15px 0;
  overflow: hidden;
}

ul.cat li:first-child {
  border-top: 0;
  padding-top: 0;
}

ul.cat li:last-child {
  padding-bottom: 0;
}

ul.cat li a {
  display: block;
  color: #647589;
}

ul.cat li a:hover {
  color: #E24F30;
}

.social-profile a {
  height: 50px;
  width: 50px;
  text-align: center;
  background: #062a4d;
  line-height: 50px;
  margin-right: 2px;
  display: inline-block;
  color: #ffffff;
  margin-bottom: 5px;
}

.social-profile a:hover {
  background: #E24F30;
}

#Instafeed {
  margin: 0 -5px;
  overflow: hidden;
}

#Instafeed li {
  width: 33.33%;
  float: left;
  padding: 0 5px;
  margin-bottom: 10px;
}

#Instafeed li img {
  width: 100%;
}

.tag a {
  display: inline-block;
  line-height: 1;
  padding: 12px 18px;
  background: #f5f5f5;
  margin-bottom: 8px;
  margin-right: 5px;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 500;
  color: #5f5b5b;
  border-radius: 2px;
}

.tag a:hover {
  background: #E24F30;
  color: #ffffff;
}

.bg-none {
  background: none;
}

.blog-post-tag span {
  font-size: 18px;
  font-weight: 600;
  display: block;
  margin-bottom: 17px;
  font-family: "Poppins", sans-serif;
  color: #062a4d;
}

.blog-post-tag a {
  color: #646974;
  display: inline-block;
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  border: 2px solid #eaedff;
  padding: 12px 24px;
  margin-right: 10px;
  transition: 0.3s;
  border-radius: 5px;
  margin-bottom: 10px;
}

.blog-post-tag a:hover {
  color: #ffffff;
  background: #E24F30;
  border-color: #E24F30;
}

.blog-post-tag a:last-child {
  margin-right: 0;
}

.blog-share-icon span {
  font-size: 18px;
  font-weight: 600;
  font-family: "Poppins", sans-serif;
  color: #062a4d;
  display: block;
  margin-bottom: 17px;
}

.blog-share-icon a {
  color: #6f7172;
  font-size: 18px;
  transition: 0.3s;
  margin-right: 22px;
}

.blog-share-icon a:hover {
  color: #E24F30;
}

.blog-share-icon a:last-child {
  margin-right: 0;
}

.blog-details-border {
  border-top: 1px solid #eaedff;
  border-bottom: 1px solid #eaedff;
  padding-top: 33px;
  padding-bottom: 23px;
  margin-bottom: 42px;
}

.b-author {
  padding: 35px;
  border: 1px solid #f6f6f6;
  border-left: 3px solid #f5380f;
}

@media (max-width: 767px) {
  .b-author {
    padding: 0 30px 44px 30px;
  }
}
.author-img {
  float: left;
}

.author-text {
  overflow: hidden;
  padding-left: 30px;
}

.author-text h3 {
  font-size: 24px;
  margin-bottom: 15px;
  font-weight: 600;
}

.author-text p {
  margin-bottom: 15px;
  font-size: 15px;
  line-height: 28px;
}

.author-icon a {
  font-size: 14px;
  margin-right: 10px;
  transition: 0.3s;
  color: #444;
}

.author-icon a:hover {
  color: #E24F30;
}

.post-comments {
  border-bottom: 1px solid #eaedff;
  margin-bottom: 42px;
  padding-bottom: 46px;
}

.blog-coment-title h2 {
  font-size: 26px;
  margin-bottom: 0;
}

.comments-avatar {
  float: left;
}

@media (max-width: 767px) {
  .comments-avatar {
    float: none;
  }
}
.comments-avatar img {
  width: 100px;
  margin-right: 20px;
}

.latest-comments li:first-child .comments-box {
  border-top: 0;
  padding-top: 0;
}

.latest-comments li:last-child .comments-box {
  border-bottom: 0;
  padding-bottom: 0;
}

.latest-comments li.children {
  margin-left: 100px;
}

@media (max-width: 767px) {
  .latest-comments li.children {
    margin-left: 0;
  }
}
.comments-box {
  border-top: 1px solid #eaedff;
  padding: 30px 0;
}

.comments-text {
  overflow: hidden;
  padding-top: 4px;
}

@media (max-width: 767px) {
  .comments-text {
    margin-top: 15px;
  }
}
.comments-text p {
  margin-bottom: 0;
  margin-top: 8px;
}

.avatar-name h5 {
  font-size: 18px;
  margin-bottom: 7px;
}

.avatar-name span {
  color: #E24F30;
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 2px;
}

.avatar-name {
  margin-bottom: 3px;
  overflow: hidden;
  position: relative;
}

.reply {
  color: #6f7172;
  display: inline-block;
  font-size: 14px;
  font-weight: 400;
  transition: 0.3s;
  line-height: 1;
  margin-top: 4px;
  position: absolute;
  right: 0;
  top: 0;
}

.reply:hover {
  color: #E24F30;
}

.reply i {
  margin-right: 5px;
}

.post-comments-title {
  margin-bottom: 39px;
}

.post-comments-title h2 {
  font-size: 26px;
  color: #140a20;
  margin-bottom: 0;
}

.conatct-post-form {
  background: #f6f6f6;
  padding: 50px;
}

@media (max-width: 767px) {
  .conatct-post-form {
    padding: 20px;
  }
}
.conatct-post-form input {
  border: none;
  height: 60px;
  margin-bottom: 20px;
  padding: 0 30px;
  width: 100%;
  font-size: 14px;
  color: #a7a7c1;
}

.conatct-post-form textarea {
  border: none;
  height: 150px;
  margin-bottom: 20px;
  padding: 30px;
  width: 100%;
  color: #a7a7c1;
  font-size: 14px;
}

#contacts-form input::-moz-placeholder {
  color: #a7a7c1;
  font-size: 14px;
}

#contacts-form input::placeholder {
  color: #a7a7c1;
  font-size: 14px;
}

#contacts-form textarea::-moz-placeholder {
  color: #a7a7c1;
  font-size: 14px;
}

#contacts-form textarea::placeholder {
  color: #a7a7c1;
  font-size: 14px;
}

.contact-icon {
  position: relative;
}

.navigation-border {
  border-top: 2px solid #f7f7f7;
  overflow: hidden;
}

.navigation-border {
  border-top: 2px solid #f7f7f7;
  overflow: hidden;
}

.bakix-navigation span {
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-weight: 500;
  display: block;
  margin-bottom: 10px;
}

.bakix-navigation span a {
  color: #666;
}

.bakix-navigation span a:hover {
  color: #E24F30;
}

.bakix-navigation h4 {
  font-size: 24px;
  margin: 0;
}

.bakix-navigation h4 a:hover {
  color: #E24F30;
}

.basic-pagination ul {
  display: block;
}

.basic-pagination ul li {
  display: inline-block;
  margin: 0 5px;
}

@media (max-width: 767px) {
  .basic-pagination ul li {
    margin-bottom: 10px;
  }
}
.basic-pagination ul li a {
  height: 70px;
  width: 70px;
  background: #ffffff;
  color: #9990b8;
  font-size: 16px;
  font-weight: 500;
  border-radius: 50%;
  line-height: 70px;
  margin: 0px;
  display: inline-block;
  text-align: center;
}

.basic-pagination ul li a:hover, .basic-pagination ul li.active a {
  background: #E24F30;
  color: #ffffff;
}

.basic-pagination-2 ul li a {
  background: transparent;
  color: #9990b8;
  border: 2px solid #eaebec;
  height: 60px;
  width: 60px;
  line-height: 56px;
}

.basic-pagination-2 ul li a:hover, .basic-pagination-2 ul li.active a {
  background: #E24F30;
  color: #ffffff;
  border-color: #E24F30;
}

/* FIX (Patricio, 2026-09-23: "estan como desentrados") - Slick no centra
   verticalmente slides de distinta altura entre si por default (cada
   .brand-img queda "pegado arriba" de su slide en vez de centrado en la
   fila) - por eso los badges de Ansilta/Cerroplast (mas altos, con
   padding) se veian corridos respecto de los logos sueltos de al lado.
   Fix clasico de Slick: flex en el track. */
.brand-active.slick-slider .slick-track {
  display: flex !important;
  align-items: center;
}
.brand-active .slick-slide {
  display: flex !important;
  justify-content: center;
  height: auto;
}

.brand-img {
  /* FIX (Patricio, 2026-09-23: "queda feo, deja los logos solos") - se
     saca la tarjeta blanca. Los fondos de color solido que traian
     algunos logos (de sus fotos de perfil de redes) se limpiaron aparte
     (ver assets/img/brand/*.png) para que floten solos de verdad. */
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 20px;
}
.brand-img img {
  display: inline-block;
  max-width: 100%;
  max-height: 70px;
  width: auto;
  opacity: 0.85;
  transition: 0.25s;
}
.brand-img:hover img {
  opacity: 1;
}

/* FIX (Patricio, 2026-09-23: "hay que ponerles un fondo porque se
   pierde") - Ansilta y Cerroplast quedaron con el logo casi todo en
   blanco (les sacamos el fondo de sus fotos de perfil) - invisibles
   sobre la pagina clara. Se les devuelve, como badge, su propio color de
   marca (el mismo que traian originalmente) en vez de la tarjeta blanca
   generica que se saco para el resto. */
.brand-badge-ansilta,
.brand-badge-cerroplast {
  /* pedido de Patricio: "mas grande, mas centrado" - las imagenes ya se
     recortaron al contenido real (antes tenian mucho margen transparente
     vacio alrededor, por eso se veian chicas y descentradas dentro del
     badge). Con el recorte + este padding + el centrado flex de
     .brand-img, quedan centradas de verdad. */
  padding: 16px 26px;
  border-radius: 12px;
  height: auto;
  min-height: 90px;
}
.brand-badge-ansilta {
  background: #000000;
}
.brand-badge-cerroplast {
  background: #38A935;
}
.brand-badge-ansilta img,
.brand-badge-cerroplast img {
  opacity: 1;
  max-height: 90px;
}

/* 11. footer */
.footer-middle-area {
  border-top: 2px solid #414141;
}

.header-address-icon i {
  font-size: 30px;
  color: #E24F30;
}

.header-address-text h4 {
  color: #ffffff;
  font-weight: 600;
  font-size: 20px;
  line-height: 1;
  margin-top: 15px;
}

.footer-title {
  font-size: 20px;
  color: #ffffff;
  margin-bottom: 22px;
  font-weight: 600;
  position: relative;
  padding-bottom: 23px;
}
.footer-title::before {
  height: 3px;
  width: 45px;
  background: #E24F30;
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  transition: 0.3s;
}

.footer-link ul li {
  padding-bottom: 12px;
}
.footer-link ul li:last-child {
  padding-bottom: 0;
}
.footer-link ul li a {
  color: #d4d4d4;
  font-size: 14px;
  font-weight: 400;
  transition: 0.3s;
}
.footer-link ul li a:hover {
  color: #E24F30;
  border-bottom: 1px solid #E24F30;
}

.contact-link li {
  margin-bottom: 19px;
}
.contact-link li:last-child {
  margin-bottom: 0;
}

.contact-address-icon {
  float: left;
  margin-right: 15px;
}
.contact-address-icon i {
  font-size: 20px;
  color: #E24F30;
  position: relative;
  top: 4px;
}

.contact-address-text {
  overflow: hidden;
}
.contact-address-text span {
  font-size: 18px;
  color: #d4d4d4;
  font-weight: 500;
}

.footer-text p {
  color: #d4d4d4;
  margin-bottom: 22px;
  line-height: 25px;
}

.footer-icon a {
  color: #9f9f9f;
  font-size: 14px;
  display: inline-block;
  text-align: center;
  transition: 0.3s;
  height: 40px;
  width: 40px;
  text-align: center;
  line-height: 40px;
  border: 2px solid #9f9f9f;
  border-radius: 50%;
  margin-right: 5px;
}
.footer-icon a:hover {
  color: #ffffff;
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  border-color: #E24F30;
}

.copyright p {
  margin-bottom: 0;
  color: #d4d4d4;
}
.copyright p a {
  color: #E24F30;
}

.footer-gallery-img {
  overflow: hidden;
}
.footer-gallery-img > a img {
  width: 100%;
}
.footer-gallery-img::before {
  background-image: -moz-linear-gradient(-51deg, rgba(235, 18, 10, 0.8) 0%, rgba(245, 57, 15, 0.8) 51%, rgba(255, 94, 20, 0.8) 99%, #E24F30 100%);
  background-image: -webkit-linear-gradient(-51deg, rgba(235, 18, 10, 0.8) 0%, rgba(245, 57, 15, 0.8) 51%, rgba(255, 94, 20, 0.8) 99%, #E24F30 100%);
  background-image: -ms-linear-gradient(-51deg, rgba(235, 18, 10, 0.8) 0%, rgba(245, 57, 15, 0.8) 51%, rgba(255, 94, 20, 0.8) 99%, #E24F30 100%);
  content: "";
  display: inline-block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  transition: 0.3s;
  opacity: 0;
  z-index: 9;
}

.footer-gallery-wrapper:hover .footer-gallery-img::before {
  opacity: 1;
}

.footer-gallery-wrapper:hover .footer-gallery-img img {
  transform: scale(1.1);
}

.footer-gallery-icon {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  text-align: center;
  transition: 0.3s;
  opacity: 0;
  z-index: 999;
}
.footer-gallery-icon > a {
  font-size: 20px;
  color: #ffffff;
  border: 2px solid #ffffff;
  height: 30px;
  width: 30px;
  line-height: 28px;
  text-align: center;
  display: inline-block;
  border-radius: 50%;
}

.footer-gallery-wrapper:hover .footer-gallery-icon {
  opacity: 1;
}

.footer-2 .footer-title {
  font-size: 24px;
  color: #282828;
}

.footer-2 .footer-text p {
  color: #9b9b9b;
}

.footer-2 .footer-link ul li a {
  color: #9b9b9b;
  border-bottom: 1px solid #9b9b9b;
  transition: 0.3s;
}
.footer-2 .footer-link ul li a:hover {
  border-color: #E24F30;
  color: #E24F30;
}

.footer-bottom-border {
  border-top: 2px solid #eeeeee;
}

.footer-bottom-border .copyright p {
  color: #9b9b9b;
}

/* 12. footer */
.appiontment-area {
  background-position: bottom left;
  background-repeat: no-repeat;
}

.app-wrapper {
  margin-left: 206px;
}

.appiontment-form input {
  background: #ffffff;
  height: 58px;
  width: 100%;
  padding-left: 24px;
  padding-right: 46px;
  color: #282828;
  border: 1px solid #ececec;
  font-size: 15px;
  text-transform: capitalize;
  border-radius: 12px;
  font-weight: 500;
  font-family: "Poppins";
  transition: 0.25s;
  box-shadow: 0 2px 10px -4px rgba(40, 40, 40, 0.06);
}

.appiontment-form input:focus {
  border: 1px solid #E24F30;
  box-shadow: 0 6px 18px -6px rgba(226, 79, 48, 0.3);
  outline: none;
}

.appiontment-form input::-moz-placeholder, .appiontment-form input::placeholder {
  color: #9b9b9b;
  font-weight: 500;
  font-size: 15px;
}

.form-box {
  position: relative;
}

.form-box::after {
  position: absolute;
  content: "";
  font-family: "Font Awesome 5 Pro";
  display: inline-block;
  font-size: 16px;
  text-align: center;
  right: 22px;
  color: #E24F30;
  top: 19px;
}

.email-icon::after {
  content: "";
}

.pro-filter {
  position: relative;
}

.pro-filter select {
  background: #ffffff;
  height: 80px;
  width: 100%;
  padding-left: 30px;
  border: 0;
  color: #282828;
  border: 2px solid #eeeeee;
  font-size: 16px;
  text-transform: capitalize;
  font-weight: 600;
  appearance: none;
  -moz-appearance: none;
  font-family: "Poppins";
}

.pro-filter::before {
  content: "";
  position: absolute;
  font-family: "Font Awesome 5 Pro";
  display: inline-block;
  font-size: 18px;
  text-align: center;
  right: 28px;
  color: #E24F30;
  top: 27px;
}

.appiontment-02-area {
  background-size: cover;
  background-position: center center;
}

.single-appiontment {
  margin-top: 130px;
}

.appiontment-02-wrapper {
  background: #ffffff;
  margin-right: 30px;
  padding: 60px 70px 65px 70px;
}

.appiontment-text p {
  font-size: 18px;
  font-weight: 500;
  color: #ffffff;
  margin-bottom: 34px;
}

.appiontment-tab {
  border-bottom: 2px solid #e5e5e5;
  padding-bottom: 16px;
}
.appiontment-tab ul li {
  position: relative;
}
.appiontment-tab ul li a {
  transition: 0.3s;
  margin: 0;
  margin-right: 0px;
  color: #282828;
  font-size: 18px;
  font-weight: 600;
  padding: 0;
  margin-right: 45px;
  position: relative;
  letter-spacing: -0.3px;
  font-family: "Poppins";
  transition: 0.3s;
}
.appiontment-tab ul li a::before {
  background: #E24F30;
  position: absolute;
  bottom: 0;
  content: "";
  left: 0;
  height: 2px;
  width: 100%;
  bottom: -17px;
  transition: 0.3s;
  opacity: 0;
}
.appiontment-tab ul li a:hover::before {
  opacity: 1;
}
.appiontment-tab ul li a:hover {
  color: #E24F30;
  border-color: #E24F30;
}
.appiontment-tab ul li a.active {
  color: #E24F30;
}

.appiontment-tab ul li a.active::before {
  opacity: 1;
}

.appiontment-tab ul li:last-child a {
  margin-right: 0;
}

.working-area {
  background-size: cover;
  background-position: center center;
}

.working-img img {
  backface-visibility: hidden;
  transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
}

.working-wrapper:hover .working-img img {
  transform: translate3d(0, -10px, 0);
}

.working-text h3 {
  font-size: 24px;
  margin-top: 34px;
  margin-bottom: 18px;
}
.working-text p {
  margin-bottom: 0;
  padding: 0 60px;
}

.video-area {
  margin-bottom: -219px;
  position: relative;
}

.video-02-area {
  background-size: cover;
  background-position: center center;
}

.video-bg {
  background-size: cover;
  background-position: center center;
  padding-top: 265px;
  padding-bottom: 265px;
}

.video-icon a {
  font-size: 22px;
  color: #E24F30;
  background: #ffffff;
  height: 120px;
  display: inline-block;
  width: 120px;
  line-height: 120px;
  text-align: center;
  border-radius: 50%;
  transition: 0.3s;
  position: relative;
}
.video-icon a::before {
  content: "";
  display: inline-block;
  position: absolute;
  top: -2px;
  left: -2px;
  bottom: -2px;
  right: -2px;
  border-radius: inherit;
  border: 1px solid #fff;
  -webkit-animation: btnIconRipple 2s cubic-bezier(0.23, 1, 0.32, 1) both infinite;
  animation: btnIconRipple 2s cubic-bezier(0.23, 1, 0.32, 1) both infinite;
  transition: 0.3s;
}

@-webkit-keyframes btnIconRipple {
  0% {
    border-width: 4px;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  80% {
    border-width: 1px;
    -webkit-transform: scale(1.35);
    transform: scale(1.35);
  }
  100% {
    opacity: 0;
  }
}
.video-text h2 {
  color: #ffffff;
  margin-bottom: 0;
  font-size: 60px;
  letter-spacing: -0.3px;
  margin-top: 33px;
}

/* 13. team */
.team-img {
  position: relative;
}
.team-img img {
  width: 100%;
}
.team-img::before {
  height: 100%;
  width: 100%;
  position: absolute;
  content: "";
  background: #222;
  left: 0;
  top: 0;
  border-radius: 50%;
  opacity: 0;
  transition: 0.3s;
}

.team-wrapper:hover .team-img::before {
  opacity: 0.5;
}

.team-icon {
  position: absolute;
  left: 0;
  right: 0;
  text-align: center;
  top: 40%;
  transition: 0.3s;
  opacity: 0;
}
.team-icon > a {
  font-size: 14px;
  transition: 0.3s;
  margin: 0 1px;
  height: 36px;
  width: 36px;
  background: #ffffff;
  display: inline-block;
  text-align: center;
  line-height: 36px;
  border-radius: 50%;
  color: #979797;
}
.team-icon > a:hover {
  color: #ffffff;
  background: #E24F30;
}

.team-wrapper:hover .team-icon {
  opacity: 1;
  transform: translatey(-50%);
  top: 50%;
}

.team-02-icon {
  top: 6px;
  position: absolute;
  right: 24px;
  transition: 0.3s;
}
.team-02-icon > a {
  background: #E24F30;
  color: #ffffff;
  font-size: 16px;
  height: 45px;
  width: 45px;
  display: inline-block;
  line-height: 45px;
  text-align: center;
  border-radius: 50%;
}

.team-wrapper:hover .team-02-icon {
  transform: scale(0);
}

.team-text {
  margin-top: 26px;
}
.team-text h3 {
  margin-bottom: 9px;
  font-size: 24px;
}
.team-text span {
  color: #E24F30;
  font-size: 16px;
  font-weight: 700;
  text-transform: capitalize;
}

.team-parent .col-xl-6:nth-child(1) .team-wrapper {
  transform: translateY(-40px);
}

.team-parent .col-xl-6:nth-child(3) .team-wrapper {
  transform: translateY(-40px);
}

/* 14. contact */
.contact-us-area {
  /* FIX (Patricio, 2026-09-23: "sigue con fondo negro") - tenia una foto
     de fondo (assets/img/bg/09.jpg, sacada del HTML) practicamente negra
     (~ #282828). El texto de toda esta seccion es blanco (9 reglas mas
     abajo), asi que sacar el fondo oscuro del todo lo dejaria ilegible -
     se usa el violeta de marca (mismo que .blue-btn/header sticky) en
     vez de una foto generica oscura. */
  background-color: #441C42;
  margin-left: 205px;
  margin-right: 205px;
  border-top: 4px solid #E24F30;
  margin-top: -100px;
  position: relative;
}

.contact-map {
  min-height: 750px;
}

.single-contact-us {
  margin-right: 30px;
  overflow: hidden;
}

.contact-us-list {
  overflow: hidden;
  margin-bottom: 38px;
}
.contact-us-list:last-child {
  margin-bottom: 0;
}

.contact-us-text {
  overflow: hidden;
  text-align: right;
}
.contact-us-text span {
  color: #9b9b9b;
  font-size: 18px;
  font-weight: 500;
}
.contact-us-text h4 {
  font-size: 22px;
  font-weight: 600;
  color: #efefef;
  margin-bottom: 0;
  margin-top: 0;
  line-height: 1.3;
}

.contact-us-icon {
  border: 3px dashed #686868;
  padding: 6px;
  border-radius: 50%;
  margin-left: 18px;
}
.contact-us-icon i {
  background: #E24F30;
  height: 45px;
  width: 45px;
  font-size: 18px;
  color: #ffffff;
  line-height: 45px;
  text-align: center;
  border-radius: 50%;
}

#contact-form input {
  border: 0;
  border-bottom: 2px solid #595959;
  width: 100%;
  height: 50px;
  background: none;
  font-size: 18px;
  font-weight: 600;
  color: #ffffff;
  padding: 0 20px;
  text-transform: capitalize;
}

#contact-form input:focus {
  border-color: #ffffff;
}

#contact-form textarea {
  border: 0;
  border-bottom: 2px solid #595959;
  height: 110px;
  width: 100%;
  background: none;
  font-size: 18px;
  font-weight: 600;
  /* !important de refuerzo (Patricio, 2026-09-23: "Su Mensaje quedo
     negro") - probablemente era cache vieja del navegador (ver el
     ?v=... nuevo en el <link> de main.css), pero por las dudas algun
     navegador tenga un estilo propio de textarea mas terco que el de
     input, esto gana seguro. */
  color: #ffffff !important;
  padding: 0 20px;
  text-transform: capitalize;
}

#contact-form textarea:focus {
  border-color: #ffffff;
}

/* FIX (Patricio, 2026-09-23: "su mensaje esta en negro, no se ve") - a
   cada elemento le faltaba una de las dos reglas (el input tenia
   -moz-placeholder pero no el ::placeholder estandar; el textarea al
   reves) - en el navegador donde faltaba, el placeholder caia al gris/
   negro por defecto en vez de blanco. Ya no se notaba tanto sobre la
   foto de fondo vieja, pero sobre el violeta solido quedaba invisible. */
#contact-form input::-moz-placeholder,
#contact-form textarea::-moz-placeholder,
#contact-form input::placeholder,
#contact-form textarea::placeholder {
  color: #ffffff;
  opacity: 1;
  font-weight: 600;
  font-size: 18px;
}

.form-2-box {
  position: relative;
}

.form-2-box::after {
  position: absolute;
  content: "";
  font-family: "Font Awesome 5 Pro";
  display: inline-block;
  font-size: 18px;
  text-align: center;
  right: 20px;
  color: #E24F30;
  top: 14px;
}

.email-2-icon:after {
  content: "";
}

.phone-2-icon:after {
  content: "";
}

.subject-2-icon:after {
  content: "";
}

.message-2-icon:after {
  content: "";
}

/* 15. slider */
.single-slider {
  background-size: cover;
  background-position: center center;
}

.slider-height {
  min-height: 840px;
}

.slider-02-height {
  min-height: 1150px;
}

.slider-content h1 {
  position: absolute;
  z-index: 1;
  font-size: 200px;
  line-height: 1;
  opacity: 0.09;
  top: -63px;
  left: 0;
  margin-bottom: 0;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-width: 2px;
  color: #ffffff;
}
.slider-content h2 {
  font-size: 120px;
  margin-bottom: 65px;
  line-height: 1;
  letter-spacing: -0.3px;
  color: #ffffff;
}
.slider-content h2 span {
  color: #4D1A50;
/*   color: #ff5e14;  NARANJA LOGIO */
  font-style: italic;
}
.slider-content p {
  font-size: 18px;
  font-weight: 500;
  color: #ffffff;
  line-height: 32px;
  padding: 0 170px;
  margin-bottom: 35px;
}

.slider-02-content h2 {
  margin-bottom: 41px;
}

.slider-meta {
  position: relative;
  padding-bottom: 16px;
  margin-bottom: 27px;
}
.slider-meta span {
  font-size: 18px;
  font-weight: 600;
  color: #ffffff;
  font-family: "Poppins";
  padding: 0 10px;
}
.slider-meta::before {
  width: 357px;
  position: absolute;
  content: "";
  height: 2px;
  background: #ffffff;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.slider-text h1{
  font-size: 40px;
  margin-bottom: 50px;
  color: #E24F30;
}

.slider-text h2 {
  font-size: 70px;
  margin-bottom: 50px;
  line-height: 1;
  letter-spacing: -0.3px;
  color: #4D1A50;
/*   color: #ffffff; */
}


/* FIX (Patricio, 2026-09-23: "dejalos en la misma fila") - los 4 botones
   del hero (quiero enviar / quiero trabajar / donde esta mi envio /
   enviar mensaje) son inline-block sueltos, se iban a una segunda linea
   apenas no entraban todos en el ancho disponible. Se pone flex sin
   wrap para forzar una sola fila. El @media (max-width:576px) de
   Patricio (mas abajo en el <style> del <head>) sigue ganando en mobile
   -carga despues de main.css, no se pisa- y ahi vuelve a apilarlos en
   columna, que es lo correcto para pantallas chicas. Responsive en el
   rango intermedio (tablet, ya no apila pero tampoco entran comodos los
   4 con su tamano normal): en vez de romper el layout, se deja
   scrollear horizontal en una sola fila. */
.slider-button {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
}
/* FIX (Patricio: primero "el boton enviar mensaje quedo cortado" ->
   despues "estan todos chicos") - achicarlos fijo de base (13px/12px)
   resolvia el corte en pantallas angostas, pero en desktop con espacio
   de sobra quedaban chiquitos sin necesidad. Con clamp() escalan fluido
   segun el ancho disponible: chicos solo cuando realmente hace falta
   (poco espacio), grandes cuando hay lugar - sin puntos de quiebre fijos
   que despues hay que estar re-ajustando. */
.slider-button a.btn {
  padding: clamp(13px, 2.6vw, 16px) clamp(18px, 4vw, 32px);
  font-size: clamp(12px, 1.35vw, 14px);
  margin: 0 !important;
}
/* Por debajo de esto Patricio ya los apila en columna (ver
   @media (max-width:576px) en el <style> del <head>, carga despues de
   main.css asi que gana ahi). */

.slider-button a.btn:hover {
  transform: translateY(0);
  background: #ffffff;
  color: #E24F30;
}

.slider-button a.white-btn {
  color: #E24F30;
  margin-left: 5px;
  transition: 0.3s;
}
.slider-button a.white-btn:hover {
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  color: #ffffff;
}

.border-btn {
  font-size: 15px;
  color: #ffffff;
  font-weight: 700;
  text-transform: uppercase;
  border-bottom: 2px solid #ffffff;
  transition: 0.3s;
  display: inline-block;
  margin-top: 18px;
  margin-left: 30px;
  padding-bottom: 5px;
}
.border-btn:hover {
  color: #00BB2D;/*#E24F30;*/
  border-color: #00BB2D;/*#E24F30;*/
}
.border-btn i {
  position: relative;
  left: 6px;
}

.slider-video-icon {
  margin-top: 110px;
  text-align: right;
}
.slider-video-icon a {
  font-size: 22px;
  color: #E24F30;
  background: #ffffff;
  height: 120px;
  display: inline-block;
  width: 120px;
  line-height: 120px;
  text-align: center;
  border-radius: 50%;
  transition: 0.3s;
  position: relative;
}
.slider-video-icon a::before {
  content: "";
  display: inline-block;
  position: absolute;
  top: -2px;
  left: -2px;
  bottom: -2px;
  right: -2px;
  border-radius: inherit;
  border: 1px solid #fff;
  -webkit-animation: btnIconRipple 2s cubic-bezier(0.23, 1, 0.32, 1) both infinite;
  animation: btnIconRipple 2s cubic-bezier(0.23, 1, 0.32, 1) both infinite;
  transition: 0.3s;
}

@-webkit-keyframes btnIconRipple {
  0% {
    border-width: 4px;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  80% {
    border-width: 1px;
    -webkit-transform: scale(1.35);
    transform: scale(1.35);
  }
  100% {
    opacity: 0;
  }
}
.slider-03-space {
  padding-top: 268px;
}

.slider-active .slick-arrow {
  font-size: 22px;
  right: 20%;
  opacity: 1;
  position: absolute;
  text-align: center;
  top: 49%;
  transition: all 0.3s ease 0s;
  visibility: visible;
  color: #ffffff;
  height: 70px;
  width: 70px;
  line-height: 70px;
  border-radius: 5px;
  cursor: pointer;
  z-index: 9;
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  border: none;
}

.slider-active .slick-next {
  top: 39%;
}

.slider-active .slick-arrow:hover {
  background: #ffffff;
  color: #E24F30;
}

.slider-02-active .slick-arrow {
  width: 70px;
  height: 70px;
  line-height: 70px;
  background: #ffffff;
  padding: 0;
  border-radius: 5px;
  color: #E24F30;
  font-size: 22px;
  margin: 0;
  position: absolute;
  top: 50%;
  left: 70px;
  z-index: 99;
  transform: translateY(-50%);
  border: 0;
  cursor: pointer;
  transition: 0.3s;
}

.slider-02-active .slick-next {
  right: 70px;
  left: auto;
}

.slider-02-active .slick-arrow:hover {
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  color: #ffffff;
}

.breadcrumb-area {
  background-position: center center;
  background-size: cover;
}

.breadcrumb-text {
  position: relative;
  z-index: 1;
}

.breadcrumb-text > h1 {
  font-size: 120px;
  margin-bottom: 12px;
  text-transform: capitalize;
  line-height: 1;
  color: #ffffff;
}

.breadcrumb-menu li {
  display: inline-block;
  position: relative;
  padding: 0 35px;
}

.breadcrumb-menu li a {
  color: #E24F30;
  font-size: 30px;
  text-transform: capitalize;
  transition: all 0.3s ease 0s;
  font-weight: 500;
}

.breadcrumb-menu li::before {
  content: "";
  display: inline-block;
  padding-bottom: 0;
  position: absolute;
  top: 3px;
  left: -11px;
  font-family: "Font Awesome 5 Pro";
  color: #fff;
  font-size: 30px;
}

.breadcrumb-menu li:first-child::before {
  display: none;
}

.breadcrumb-menu span {
  color: #ffffff;
  font-size: 30px;
  text-transform: capitalize;
  font-weight: 500;
}

.history-area {
  background-size: cover;
  background-position: center center;
}

.inner-history {
  background: #ffffff;
  padding: 30px 20px 28px;
  position: relative;
}
.inner-history::before {
  position: absolute;
  content: "";
  background: #ececec;
  height: 2px;
  width: 100%;
  left: 0;
  bottom: -41px;
  transition: 0.3s;
  transition: 0.3s;
}
.inner-history::after {
  background-image: url("../img/bg/001.jpg");
  background-repeat: no-repeat;
  content: "";
  height: 100%;
  position: absolute;
  transition: all 0.3s ease 0s;
  width: 100%;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  opacity: 0;
  background-size: cover;
}

.history-wrapper:hover .inner-history::after {
  opacity: 1;
}

.history-wrapper.active .inner-history::after {
  opacity: 1;
}

.history-wrapper:hover .inner-history::before {
  background: #E24F30;
}

.history-wrapper.active .inner-history::before {
  background: #E24F30;
}

.history-text {
  position: relative;
  z-index: 99;
}
.history-text h4 {
  font-size: 20px;
  margin-bottom: 7px;
  transition: 0.3s;
}
.history-text p {
  margin-bottom: 0;
  font-size: 16px;
  transition: 0.3s;
}
.history-text::before {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 15px 10px 0 10px;
  border-color: #fff transparent transparent transparent;
  position: absolute;
  content: "";
  bottom: -43px;
  left: 0;
  right: 0;
  margin: auto;
  transition: 0.3s;
}

.history-wrapper:hover .history-text::before {
  border-color: #E24F30 transparent transparent transparent;
}

.history-wrapper.active .history-text::before {
  border-color: #E24F30 transparent transparent transparent;
}

.history-wrapper:hover .history-text h4 {
  color: #ffffff;
}

.history-wrapper:hover .history-text p {
  color: #ffffff;
}

.history-wrapper.active .history-text h4 {
  color: #ffffff;
}

.history-wrapper.active .history-text p {
  color: #ffffff;
}

.history-info {
  background: #E24F30;
  padding: 9px 17px;
  display: inline-block;
  margin-top: 70px;
  position: relative;
}
.history-info::before {
  position: absolute;
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 10px 15px 10px;
  border-color: transparent transparent #E24F30 transparent;
  left: 0;
  right: 0;
  margin: auto;
  top: -15px;
}
.history-info h5 {
  color: #ffffff;
  margin-bottom: 0;
  line-height: 1;
  font-size: 16px;
}

.air-img {
  position: relative;
}
.air-img img {
  width: 100%;
}

.air-text h2 {
  font-size: 35px;
  line-height: 1;
  font-weight: 600;
  margin-bottom: 35px;
}
.air-text h2 i {
  color: #E24F30;
  margin-right: 15px;
}
.air-text p {
  font-size: 16px;
}

.air-video-icon {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  text-align: center;
}
.air-video-icon a {
  font-size: 16px;
  color: #ffffff;
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  height: 80px;
  display: inline-block;
  width: 80px;
  line-height: 80px;
  text-align: center;
  border-radius: 50%;
  transition: 0.3s;
  position: relative;
}
.air-video-icon a::before {
  content: "";
  display: inline-block;
  position: absolute;
  top: -2px;
  left: -2px;
  bottom: -2px;
  right: -2px;
  border-radius: inherit;
  border: 1px solid #E24F30;
  -webkit-animation: btnIconRipple 2s cubic-bezier(0.23, 1, 0.32, 1) both infinite;
  animation: btnIconRipple 2s cubic-bezier(0.23, 1, 0.32, 1) both infinite;
  transition: 0.3s;
}

@-webkit-keyframes btnIconRipple {
  0% {
    border-width: 4px;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  80% {
    border-width: 1px;
    -webkit-transform: scale(1.35);
    transform: scale(1.35);
  }
  100% {
    opacity: 0;
  }
}
.air-info {
  margin-top: 18px;
}
.air-info h2 {
  font-size: 35px;
  line-height: 1;
  margin-bottom: 25px;
  font-weight: 600;
}
.air-info p {
  font-size: 16px;
  line-height: 30px;
  margin-bottom: 0;
  position: relative;
  padding-left: 25px;
  margin-bottom: 24px;
}
.air-info p::before {
  position: absolute;
  content: "";
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  height: 77px;
  width: 4px;
  left: 0;
  top: 7px;
}

.air-link ul li {
  display: flex;
  margin-bottom: 12px;
}
.air-link ul li:last-child {
  margin-bottom: 0;
}
.air-link ul li i {
  font-size: 16px;
  color: #E24F30;
  margin-right: 17px;
  position: relative;
  top: 11px;
}
.air-link ul li span {
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  color: #9b9b9b;
}

button {
  cursor: pointer;
}

.service-list li a {
  background: #f6f6f6;
  display: block;
  padding: 17px 30px;
  color: #666;
  position: relative;
  font-weight: 500;
}

.service-list li a:hover {
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  color: #fff;
}

.service-list li {
  margin-bottom: 7px;
}

.service-list li a::before {
  content: "";
  display: inline-block;
  padding-bottom: 0;
  position: absolute;
  top: 15px;
  right: 30px;
  font-family: "Font Awesome 5 Pro";
  color: #666;
  font-size: 18px;
}

.service-list li a:hover::before {
  color: #ffffff;
}

.download-link li {
  padding-bottom: 12px;
}
.download-link li:last-child {
  padding-bottom: 0;
}

.download-link li a {
  font-size: 18px;
  color: #9b9b9b;
  font-size: 18px;
  font-weight: 500;
  font-family: "Poppins";
  transition: 0.3s;
}
.download-link li a:hover {
  color: #E24F30;
}

.download-link li a i {
  color: #E24F30;
  font-size: 16px;
  margin-right: 10px;
}

.sea-content .about-icon {
  margin-right: 12px;
}

.sea-content .about-icon i {
  font-size: 35px;
}

.sea-content .about-info h2 {
  font-size: 35px;
}

.sea-content .about-info > span {
  font-size: 14px;
}

.sea-content .about-info h2 > span {
  top: -22px;
  left: -5px;
}

.sea-info p {
  font-size: 16px;
  line-height: 30px;
}

/* 16. faq */
.faq-box .btn-link {
  display: block;
  font-size: 16px;
  border: 0;
  text-decoration: none;
  line-height: 1;
  font-weight: 600;
  padding: 26px 30px;
  font-family: "Poppins";
}

.faq-box .btn-link {
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  color: #ffffff;
}

.faq-box .btn-link.collapsed {
  background: #f9f9f9;
  color: #727272;
}

.faq-box .card-header {
  padding: 0;
  border-bottom: 0;
  background: none;
  border-radius: 0;
}

.faq-box .card {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: 0;
  border-radius: 0;
  background: none;
  margin-bottom: 16px;
}

.faq-box .card-body {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  padding: 0 0 0 0;
  border-bottom: 0;
  padding-bottom: 5px;
  border-top: 0;
  padding-top: 18px;
  margin-top: 0;
  padding-left: 30px;
  padding-right: 30px;
  background: none;
}

.faq-box .card-body p {
  margin: 0;
  line-height: 28px;
  margin-right: 26px;
  color: #9b9b9b;
  font-size: 16px;
}

.faq-box .btn-link.collapsed::before {
  content: "";
  color: #ffffff;
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
}

.faq-box .btn-link::before {
  content: "";
  position: absolute;
  right: 30px;
  font-size: 18px;
  font-family: "Font Awesome 5 Pro";
  color: #E24F30;
  height: 45px;
  width: 45px;
  line-height: 45px;
  border-radius: 50%;
  background: #ffffff;
  text-align: center;
  top: 13px;
}

.faq-img {
  margin-left: 70px;
}
.faq-img img {
  width: 100%;
}

.faq-info p {
  font-size: 18px;
  line-height: 30px;
  margin-bottom: 37px;
}

.case-details-img img {
  width: 100%;
}

.case-details-text h2 {
  font-size: 30px;
  margin-bottom: 24px;
}
.case-details-text p {
  font-size: 16px;
  line-height: 30px;
  margin-bottom: 0;
}

.case-link ul li {
  display: flex;
  margin-bottom: 12px;
}
.case-link ul li:last-child {
  margin-bottom: 0;
}
.case-link ul li i {
  font-size: 24px;
  color: #E24F30;
  margin-right: 17px;
  position: relative;
  top: 8px;
}
.case-link ul li span {
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  color: #9b9b9b;
}

.career-wrapper {
  border-top: 4px solid #E24F30;
  padding: 40px 20px 40px 40px;
  box-shadow: 0px 0px 29.7px 0.3px rgba(226, 226, 226, 0.78);
}

.career-text span {
  background-color: #ffefe7;
  color: #E24F30;
  font-size: 15px;
  font-weight: 700;
  padding: 6px 11px;
  border-radius: 5px;
  line-height: 1;
}
.career-text h3 {
  font-size: 24px;
  margin-top: 21px;
  margin-bottom: 13px;
}
.career-text p {
  font-size: 16px;
  line-height: 26px;
  margin-bottom: 24px;
}

.career-text a.btn {
  padding: 16px 32px 16px 29px;
  background: #fff2ed;
  color: #E24F30;
  transition: 0.3s;
  transform: translateY(0);
}
.career-text a.btn:hover {
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  color: #ffffff;
}

.career-cta-area {
  background-size: cover;
  background-position: center center;
}

.career-cta-wrapper {
  background-image: -moz-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -webkit-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  background-image: -ms-linear-gradient(-51deg, #eb120a 0%, #E24F30 99%);
  padding: 70px 60px 80px 60px;
  margin-right: 20px;
  margin-left: 80px;
}

.career-cta-text h2 {
  font-size: 50px;
  color: #ffffff;
  margin-bottom: 23px;
}
.career-cta-text p {
  color: #ffffff;
  font-size: 16px;
  margin-bottom: 20px;
  margin-bottom: 35px;
}

/* 17. pricing */
.pricing-area {
  background-size: cover;
  background-position: center center;
}

.price-middle {
  -ms-flex: 0 0 33.333333%;
  flex: 0 0 30.333%;
  max-width: 30.333%;
}

.pricing-wrapper {
  background: #ffffff;
  padding: 40px;
  background-repeat: no-repeat;
  background-position: top;
}

.price-middle .pricing-wrapper {
  padding: 45px 50px 55px;
  box-shadow: 0px 0px 29.7px 0.3px rgba(221, 221, 221, 0.82);
}

.price-count h1 {
  font-size: 30px;
  color: #E24F30;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.3px;
  margin-bottom: 0;
}

.price-count span {
  font-size: 16px;
  color: #9b9b9b;
  font-weight: 600;
}

.price-count h1 span.usd {
  font-size: 15px;
  font-weight: 700;
  color: #E24F30;
  position: relative;
}

.pricing-text h3 {
  font-size: 20px;
  margin-bottom: 7px;
}

.pricing-list {
  margin-top: 26px;
  margin-bottom: 32px;
}

.pricing-list li {
  color: #9b9b9b;
  font-size: 16px;
  font-weight: 500;
  padding-bottom: 13px;
}

.pricing-list li:last-child {
  padding-bottom: 0;
}

.pricing-list li i {
  margin-right: 6px;
}

.pricing-button a.btn {
  padding: 16px 32px 16px 29px;
}

/* ==========================================================
   Cotizador tipo chat (pedido de Patricio, 2026-09-23)
   Ver assets/js/cotizador-chat.js
   ========================================================== */
.cotizar-chat-content {
  border-radius: 18px;
  border: none;
  overflow: hidden;
  box-shadow: 0 30px 60px -12px rgba(40, 40, 40, 0.35);
}
.cotizar-chat-close {
  position: absolute;
  top: 16px;
  right: 20px;
  z-index: 5;
  font-size: 24px;
  color: #ffffff;
  opacity: 0.85;
  background: none;
  border: none;
}
.cotizar-chat-close:hover {
  opacity: 1;
}
.cotizar-chat-header {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px 26px;
  background: linear-gradient(-51deg, #441C42 0%, #E05742 99%);
  color: #ffffff;
}
.cotizar-chat-header img {
  /* FIX (Patricio, 2026-09-23: "el logo en ese ovalo queda mal, dejalo
     solo") - se saca el fondo blanco circular. */
  height: 34px;
  width: auto;
}

/* FIX (Patricio, 2026-09-23: "el flujo de direccion de Google aparece
   atras del modal") - el dropdown de sugerencias de Places (.pac-container)
   lo cuelga Google directo de <body>, con un z-index mas bajo que el del
   modal de Bootstrap (1050+backdrop) - queda tapado. Se sube por encima
   de todo. */
.pac-container {
  z-index: 10000 !important;
}
.cotizar-chat-header strong {
  display: block;
  font-family: "Poppins";
  font-size: 15px;
}
.cotizar-chat-estado {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  opacity: 0.9;
}
.cotizar-chat-estado::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #25D366;
  display: inline-block;
}
.cotizar-chat-mensajes {
  height: 420px;
  overflow-y: auto;
  padding: 22px 26px;
  background: #faf9fb;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.cc-msg {
  max-width: 78%;
  padding: 11px 16px;
  border-radius: 16px;
  font-size: 14px;
  line-height: 1.45;
  animation: ccPop 0.25s ease;
}
@keyframes ccPop {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
.cc-msg--bot {
  align-self: flex-start;
  background: #ffffff;
  color: #282828;
  border-bottom-left-radius: 4px;
  box-shadow: 0 2px 8px -4px rgba(40, 40, 40, 0.12);
}
.cc-msg--user {
  align-self: flex-end;
  background: #441C42;
  color: #ffffff;
  border-bottom-right-radius: 4px;
}
.cc-msg--resumen {
  align-self: stretch;
  max-width: 100%;
  background: #ffffff;
  border: 1px solid #ececec;
  box-shadow: 0 6px 20px -10px rgba(40, 40, 40, 0.15);
}
.cc-msg--resumen table {
  width: 100%;
  font-size: 13px;
}
.cc-msg--resumen table td {
  padding: 4px 0;
}
.cc-msg--resumen table td:last-child {
  text-align: right;
  font-weight: 600;
}
.cc-msg--resumen .cc-total {
  font-size: 20px;
  font-weight: 700;
  color: #441C42;
}
.cc-typing {
  align-self: flex-start;
  display: flex;
  gap: 4px;
  padding: 14px 16px;
  background: #ffffff;
  border-radius: 16px;
  border-bottom-left-radius: 4px;
  box-shadow: 0 2px 8px -4px rgba(40, 40, 40, 0.12);
}
.cc-typing span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #c8c8c8;
  animation: ccTyping 1s infinite ease-in-out;
}
.cc-typing span:nth-child(2) { animation-delay: 0.15s; }
.cc-typing span:nth-child(3) { animation-delay: 0.3s; }
@keyframes ccTyping {
  0%, 60%, 100% { transform: translateY(0); opacity: 0.5; }
  30% { transform: translateY(-4px); opacity: 1; }
}
.cotizar-chat-input {
  display: flex;
  gap: 10px;
  padding: 16px 20px;
  border-top: 1px solid #ececec;
  background: #ffffff;
}
/* FIX (Patricio, 2026-09-23: "los botones estan todos chicos", referido
   a los del chat del cotizador) - se agrandan un poco: boton de enviar,
   inputs y chips. */
.cotizar-chat-input input,
.cotizar-chat-input select {
  flex: 1;
  height: 54px;
  border: 1px solid #ececec;
  border-radius: 13px;
  padding: 0 18px;
  font-size: 15px;
  color: #282828;
  min-width: 0;
}
.cotizar-chat-input input:focus,
.cotizar-chat-input select:focus {
  border-color: #E24F30;
  outline: none;
}
.cotizar-chat-input .cc-dim {
  max-width: 96px;
}
.cotizar-chat-input button {
  height: 54px;
  width: 54px;
  flex-shrink: 0;
  border: none;
  border-radius: 13px;
  background: #E24F30;
  color: #ffffff;
  font-size: 19px;
  cursor: pointer;
  transition: 0.2s;
}
.cotizar-chat-input button:hover {
  background: #441C42;
}
.cotizar-chat-input button:disabled {
  background: #d8d8d8;
  cursor: not-allowed;
}
.cc-chip-group {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  width: 100%;
}
.cc-chip {
  border: 1px solid #E24F30;
  color: #E24F30;
  background: #ffffff;
  padding: 12px 22px;
  border-radius: 30px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: 0.2s;
}
.cc-chip:hover {
  background: #E24F30;
  color: #ffffff;
}

/*# sourceMappingURL=main.css.map */