/*
Theme Name: Headon
Author: avni.yayin
Author URI: https://avniyay.in/
Description: headon
Version: 1.0
Text Domain: headon
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
video { 
    max-width: 100%;
    position: relative;
    z-index: 3;
    -o-object-fit: contain;
       object-fit: contain;
    -o-object-position: center;
       object-position: center;
    margin: auto;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	/* list-style: none; */
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
div#wrapper {
    width: 100%;
    position: relative;
    max-width: 100vw;
    /* overflow: scroll; */
    z-index: 1;
}
img {
    max-width: 100%;
}
body {
    width: 100%;
    min-height: 100vh;
    margin: 0;
    font-family: Gilroy, Arial;
    position: relative;
    max-width: 100vw;
    cursor: default;
    /* overflow-x: hidden; */
    /* padding-top: 76px; */
}  
p { 
}
p em {
    font-style: italic;
}

p strong {
    font-weight: 700;
}


.pos-ab {margin: auto;position: absolute !important;left: 0;right: 0;top: 0;bottom: 0;z-index: 0 !important;}
.container {
    max-width: 1350px;
    position: relative;
    z-index: 1;
} 
nav#menu {
    margin: auto auto 0px;
    margin-left: auto;
    margin-right: 0px;
}

ul#menu-main {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    list-style: none;
}
 nav#menu li.contact-top a {
    border-radius: 20px;
    background-color: #dd2baa;
    margin: auto;
    line-height: 36px;
    height: 36px;
    display: table;
    padding: 0px 20px;
    margin-top: -8px;
}

nav#menu li a:hover {
    color: #dd2baa;
}

nav#menu li.contact-top a:hover {
    color: #dd2baa;
    /* box-shadow: inset 0px 0px 0px 2px #dd2baa; */
    background: white;
}





a.logo {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 170px;
            flex: 0 0 170px;
    margin: auto 0px;
    padding: 0;
}

header {
    padding: 20px 0px;
    position: fixed;
    z-index: 10;
    top: 0;
    width: 100%;
    left: 0;
    right: 0;
    margin: auto;
    -webkit-transition: 0.4s all ease;
    -o-transition: 0.4s all ease;
    transition: 0.4s all ease;
}
body.is-sticky header,
body.mobile-menu--open header {
    padding: 10px 0px 10px;
    background: rgb(18 12 44);
}
div#section--hero-bg {
    background: url(/wp-content/themes/headon/images/header.png);
    background-position: center;
    position: absolute;
    left: -10%;
    top: -10%;
    width: 120%;
    height: 120%;
    z-index: -1;
}

.section--hero {
    background: url(/wp-content/themes/headon/images/header.png);
    background-size: cover;
    background-position: center;
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-top: 100px;
    overflow: hidden;
    position: relative;
    padding-bottom: 8vw;
    background-attachment: fixed;
}
 

.section--hero .title {
    color: #ffffff;
    font-size: 54px;
    line-height: 64px;
    letter-spacing: normal;
    font-weight: 600;
}

.subtitle {
    color: #ffffff;
    font-size: 26px;
    font-weight: 400;
    line-height: 40px;
    margin: 30px 0px 36px;
}
img.hero-oo {
    top: -5%;
    position: absolute;
    right: -4%;
    opacity: 0.6;
    max-width: 800px;
    width: 52%;
    transition: 1s all ease;
    bottom: 10%;
    margin: auto;
    /* filter: drop-shadow(0px 0px 84px rgba(255,255,255,0.6)); */
}
a.button {
    color: #120c2c;
    transition: 0.3s all ease;
    font-size: 18px;
    font-weight: 600;
    border-radius: 25px;
    background-color: #5ed9f7;
    display: table;
    line-height: 50px;
    padding: 0px 23px;
    height: 50px;
    text-decoration: none;
}
a.button:hover {
    background: white;
    border-color: #5ed9f7;
    /* color: #5ed9f7; */
    box-shadow: inset 0px 0px 0px 2px #5ed9f7;
}
nav#menu li a {
    -webkit-transition: 0.3s all ease;
    -o-transition: 0.3s all ease;
    transition: 0.3s all ease;
    color: #ffffff;
    font-size: 16px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.01px;
    text-decoration: none;
}

.header-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}


.header-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}

ul#menu-main li {
    margin-left: 40px;
}


.section--intro {
    padding: 95px 0px 120px;
}

.section--intro .text {
    color: #120c2c;
    font-size: 30px;
    font-weight: 500;
    line-height: 50px;
    text-align: center;
    max-width: 960px;
    margin: auto;
}

.benefits--list {
    background: url(/wp-content/themes/headon/images/bg2.png);
    background-size: cover;
    background-position: center;
    padding: 80px 0px 110px;
    background-attachment: fixed;
}

h2 {
    font-size: 40px;
    font-weight: 400;
    color: #120c2c;
    line-height: 64px;
    margin-bottom: 50px;
}

h2.white {
    color: white;
}

.benefit--item {
    background-image: -o-linear-gradient(230deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.46) 100%);
    background-image: linear-gradient(220deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.46) 100%);
    padding: 40px 11px 10px;
    text-align: center;
    color: #120c2c;
    min-height: 392px;
}

.title {
    font-size: 20px;
    font-weight: 600;
    line-height: 34px;
    display: block;
}

.text {
    color: #120c2c;
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
}

.benefit--item  .icon {
    margin-bottom: 30px;
    transition: 0.4s all ease;
}



.customers--list {
    padding: 100px 0px;
}
.col {
    text-align: center;
}

.customers--list .col {
    min-height: 100px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.customers--list .col img {
    width: auto; 
    margin: auto;
}
.col.customer-logo {
    flex: 0 0 20%;
    text-align: center;
    margin: auto 0px;
    padding: 0px 20px 30px;
}
.benefit--item:hover .icon {
    transform: scale(1.15);
}
.industries--list {
    padding: 100px 0px;
    background-color: #f7f7f7;
}

.ind-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}

.ind-content {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    background: white;
    padding: 4% 5%;
}

.ing-image {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
}

.ing-image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center;
       object-position: center;
}

.ind-item .title {
    color: #5ed9f7;
    font-size: 36px;
    font-weight: 600;
    line-height: 64px;
    margin-bottom: 20px;
}
img.flip {
    -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
            transform: rotate(180deg);
}
.owl-nav {
    position: absolute;
    top: 0;
    bottom: 40px;
    margin: auto;
    height: 62px;
    left: -50px;
    right: -50px;
    width: calc(100% + 100px);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: 40px;
    color: #ddd;
}

div#owl-industries .owl-dots {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 30px 0px 0px;
}

div#owl-industries button.owl-dot {
    -webkit-transition: 0.3s all ease;
    -o-transition: 0.3s all ease;
    transition: 0.3s all ease;
    background-color: #d7d7d7;
    border-radius: 20px;
    height: 10px;
    width: 10px;
    margin: auto 6px;
    outline: none !important;
    border: 0px !important;
}
 

div#owl-industries button.owl-dot.active {
    background-color: #dd2baa;
}

.owl-carousel .owl-nav button {
    outline: none !important;
}
footer {
    padding: 50px 15px 20px;
    background: url(/wp-content/themes/headon/images/footer.png);
    color: white;
    background-size: cover;
    background-position: center;
}

.footer-text p {
    color: #ffffff;
    font-size: 18px;
    font-weight: 300;
    line-height: 1.5;
}

.socials--list {
    margin-top: 40px;
}

.footer-text {
    margin-top: 20px;
}
.follow-us {
    font-size: 16px;
    font-weight: 500;
    display: inline-block;
    padding-right: 20px;
}
.socials--list a {
    line-height: 28px;
    height: 28px;
    width: 28px;
    border-radius: 20px;
    border: 1px solid white;
    display: inline-block;
    text-align: center;
    color: white;
    margin-right: 20px;
}
.f-input input.wpcf7-text {
    background: none;
    outline: none;
    border: 0px;
    border-bottom: 1px solid rgb(255 255 255 / 50%);
    line-height: 40px;
    height: 40px;
    color: white;
    -webkit-transition: 0.3s all ease;
    -o-transition: 0.3s all ease;
    transition: 0.3s all ease;
    font-size: 18px;
    font-weight: 300;
    line-height: 43px;
    width: 100%;
}

.f-input input.wpcf7-text::-webkit-input-placeholder {
    color: white;
}

.f-input input.wpcf7-text::-moz-placeholder {
    color: white;
}

.f-input input.wpcf7-text:-ms-input-placeholder {
    color: white;
}

.f-input input.wpcf7-text::-ms-input-placeholder {
    color: white;
}

.f-input input.wpcf7-text::placeholder {
    color: white;
}

input#form-send {
    border-radius: 20px;
    background-color: #dd2baa;
    outline: none;
    border: 0px;
    color: #ffffff;
    font-size: 18px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.01px;
    letter-spacing: -0.1px;
    line-height: 40px;
    padding: 0px 30px;
    margin-left: auto;
    margin-right: 0;
    display: table;
    text-transform: capitalize;
    cursor: pointer;
}

.f-input {
    width: 100%;
    position: relative;
}

.f-input + .f-input {
    margin-top: 30px;
}
.f-input input.wpcf7-text:focus {
    border-bottom: 1px solid #5ed9f7;
}

.f-input input.wpcf7-text::-webkit-input-placeholder {
    color: rgb(255 255 255 / 70%);
}

.f-input input.wpcf7-text::-moz-placeholder {
    color: rgb(255 255 255 / 70%);
}

.f-input input.wpcf7-text:-ms-input-placeholder {
    color: rgb(255 255 255 / 70%);
}

.f-input input.wpcf7-text::-ms-input-placeholder {
    color: rgb(255 255 255 / 70%);
}

.f-input input.wpcf7-text::placeholder {
    color: rgb(255 255 255 / 70%);
}

.footer-form {
    max-width: 400px;
    margin-right: 0px;
    margin-left: auto;
}
.footer-bottom {
    max-width: 1343px;
    margin: auto;
    padding: 0px 15px;
    margin-top: 10px;
    opacity: 0.6;
    color: #ffffff;
    font-size: 14px;
    font-weight: 400;
    line-height: 26px;
}

.footer-bottom a {
    color: inherit;
    font-weight: 600;
}

.footer-title {
    color: #ffffff;
    font-size: 24px;
    font-weight: 600;
    line-height: 43px;
    margin-bottom: 20px;
}

.f-input label {
    position: absolute;
    top: 9%;
    opacity: 0.7;
    color: #ffffff;
    font-size: 18px;
    font-weight: 300;
    line-height: 30px;
    -webkit-transition: 0.4s all ease;
    -o-transition: 0.4s all ease;
    transition: 0.4s all ease;
    left: 1px;
}

.f-input.has-value label {
    font-size: 12px;
    top: -17px;
    color: white;
    opacity: 0.8;
}










.inner--hero {
    height: 480px;
    background-position: center;
    background-size: cover;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-top: 60px;
}

h1.title {
    color: #ffffff;
    color: #ffffff;
    font-size: 54px;
    font-weight: 600;
    line-height: 64px;
}













.solutions--blocks {
    padding: 80px 15px 130px;
    overflow: hidden;
}

 

.solutions-content {
    color: #120c2c;
    font-size: 20px;
    font-weight: 500;
    line-height: 32px;
}

h3.solutions-title {
    color: #36b2ff;
    font-size: 46px;
    font-weight: 400;
    line-height: 56px;
    margin-bottom: 26px;
}

img.solutions-image {
    margin: auto;
    display: table;
}

.solutions--blocks .container + .container {
    margin-top: 70px;
}

.solutions--blocks .container:nth-child(even) .order-2 {
    -webkit-box-ordinal-group: -1;
        -ms-flex-order: -2;
            order: -2;
}
.solutions-inner {
    margin: auto -15px;
}
.solutions-image {
    display: table;
    margin: auto;
    border-radius: 50%;
    position: relative;
    overflow: hidden;
}

.solutions-image:after {content: '';position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: url(/wp-content/themes/headon/images/balloo.png);background-size: contain;background-position: center;opacity: 0.8;-webkit-animation: solutions 15s infinite;animation: solutions 15s infinite;border-radius: 50%;display: none;}
.solutions--blocks .container:nth-child(even) .solutions-image:after {
    -webkit-animation: solutions 12s infinite;
            animation: solutions 12s infinite;
}

@-webkit-keyframes solutions {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
    20%{
       -webkit-transform: rotate(20deg) scale(1.5);
               transform: rotate(20deg) scale(1.5);
    }
    40%{
       -webkit-transform: rotate(-10deg) scale(1.5);
               transform: rotate(-10deg) scale(1.5);
       opacity:0.6;
    }
    60%{
       -webkit-transform: rotate(-23deg) scale(1.2);
               transform: rotate(-23deg) scale(1.2);
    }
    80%{
        opacity:0.8;
       -webkit-transform: rotate(10deg) scale(1.3);
               transform: rotate(10deg) scale(1.3);
    }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@keyframes solutions {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
    20%{
       -webkit-transform: rotate(20deg) scale(1.5);
               transform: rotate(20deg) scale(1.5);
    }
    40%{
       -webkit-transform: rotate(-10deg) scale(1.5);
               transform: rotate(-10deg) scale(1.5);
       opacity:0.6;
    }
    60%{
       -webkit-transform: rotate(-23deg) scale(1.2);
               transform: rotate(-23deg) scale(1.2);
    }
    80%{
        opacity:0.8;
       -webkit-transform: rotate(10deg) scale(1.3);
               transform: rotate(10deg) scale(1.3);
    }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}





.partners--item {
    padding: 40px 46px 50px;
    background-color: #f7f7f7;
    min-height: 366px;
    margin: 15px 0px;
}

.partiners--img {
    min-height: 67px;
    margin-bottom: 48px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.partiners--img img {
    margin: auto 0px 0px;
}

.partners--list {
    padding: 120px 0px 100px;
}
.partners--item .text {
    color: #120c2c;
    font-size: 18px;
    font-weight: 500;
    line-height: 28px;
}






.section--intro .text p {
    color: #120c2c;
    font-size: 20px;
    font-weight: 400;
    line-height: 30px;
}

h2.title {
    color: #dd2baa;
    font-size: 40px;
    font-weight: 400;
    line-height: 64px;
    margin-bottom: 40px;
    font-weight: 500;
}
.section--team {
    padding: 100px 0px;
}








.members--item {
    margin-bottom: 50px;
    margin-top: 30px;
}

.members--item .image {
    position: relative;
    height: 270px;
}

.members--item .name {
    color: #120c2c;
    font-size: 20px;
    font-weight: 700;
    line-height: 32px;
    margin: 30px auto 0px;
}

.members--item .role {
    color: #120c2c;
    font-weight: 500;
    line-height: 32px;
    font-size: 20px;
}

.members--item .image > img {
    max-height: 100%;
    margin: auto;
    display: table;
}

.members--item .image > a {
    position: absolute;
    bottom: 0px;
    right: -30%;
    left: 0%;
    margin: auto;
    display: table;
    width: 33px;
    border-radius: 30px;
    -webkit-transition: 0.5s all ease;
    -o-transition: 0.5s all ease;
    transition: 0.5s all ease;
}

.members--item .image > a:hover {
    -webkit-box-shadow: 0px 0px 0px 5px white;
            box-shadow: 0px 0px 0px 5px white;
}




.section--offices {
    background-color: #120c2c;
    padding: 90px 0px;
    text-align: center;
    position: relative;
    background: url(/wp-content/themes/headon/images/globe_2.jpg);
    height: 870px;
    background-position: center;
    background-size: auto 100%;
}

.offices--map {
    height: 440px;
    /* padding-top: 9%; */
    /* background: url(/wp-content/themes/headon/images/globe_2.jpg); */
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    z-index: 2;
}
.section--intro h2.title {
    color: #120C2C;
    margin-bottom: 30px;
}
.section--offices h2.title {
    /* margin-bottom: 240px; */
    color: white;
    position: relative;
    font-weight: 400;
    z-index: 3;
}

.country--item {
    position: absolute;
    z-index: 1;
    height: 6px;
    width: 6px;
    /* pointer-events: none; */
}

.offices-img-o {
    position: absolute;
    /* background: url(/wp-content/themes/headon/images/mapo.png); */
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-size: cover;
    z-index: 0;
    background-position: center;
    display: none;
}

.section--offices > .container {
    position: relative;
    z-index: 3;
}

body.page-template-template-about footer#footer {
    background: #120c2c;
}
.section--offices > .container {
    max-width: 1000px;
    margin: auto;
}

.country--dot {
    width: 12px;
    height: 12px;
    background: #fff;
    border-radius: 20px;
    -webkit-transition: 0.4s all ease;
    -o-transition: 0.4s all ease;
    transition: 0.4s all ease;
    border: 2px solid #0e0929;
    box-shadow: 0px 0px 0px 2px white;
}

.country--label {
    border-radius: 20px;
    /* background-color: #ffffff; */
    color: white;
    font-size: 18px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: -0.1px;
    display: block;
    position: absolute;
    line-height: 32px;
    padding: 0px 14px;
    top: -11px;
    left: 11px;
    -webkit-transition: 0.4s all ease;
    -o-transition: 0.4s all ease;
    transition: 0.4s all ease;
}

.country--item.dot--right .country--label {
    -webkit-transform: translateX(calc(-100% - 9px));
    -ms-transform: translateX(calc(-100% - 9px));
    transform: translateX(calc(-100% - 9px));
}
 

.country--card {
    position: absolute;
    left: 11px;
    width: 200px;
    border-radius: 5px;
    background-color: rgb(94 217 247 / 20%);
    text-align: left;
    padding: 17px 12px;
    color: #ffffff;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    top: 30px;
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
    -webkit-transition: 0.4s all ease;
    -o-transition: 0.4s all ease;
    transition: 0.4s all ease;
    opacity: 0;
    /* opacity: 0.2; */
    border-radius: 5px;
    background-color: rgb(255 255 255 / 20%);
}

.country--item:hover .country--dot {
    /* background-color: #5ed9f7; */
}

.country--item:hover .country--card {
    opacity: 1;
    -webkit-transform: none;
        -ms-transform: none;
            transform: none;
}

.country--item:hover .country--label {
    /* background-color: #5ed9f7; */
}
 
.country--item.dot--right .country--card {
    left: auto;
    right: 11px;
}






/***** Solutions 2 ******/

.blocks--container {
    /* max-width: 1300px; */
    margin: 90px auto;
    /* max-height: 560px; */
    /* overflow: auto; */
}

.block--item {
    display: flex;
    background: #F7F7F7;
}

.block-content {
    flex: 0 0 750px;
    /* background: #F7F7F7; */
    padding: 40px 7.9%;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}

.block-title {
    color: #36B2FF;
    font-family: Gilroy;
    font-size: 40px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 56px;
    margin-top: auto;
    /* margin-bottom: 24px; */
}

.block-content-inner {margin-bottom: auto;margin-top: 20px;}

.block-content-inner p {
    font-family: Gilroy;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    color: #120C2C;
}

.block-subtitle {
    color: #36B2FF;
    font-family: Gilroy;
    font-size: 24px;
    letter-spacing: 0;
    line-height: 34px;
    margin-top: 10px;
}

.block-image img {
    display: table;
}

body.page-template-template-solutions-2 {
    overflow: hidden;
}

body.page-template-template-solutions-2 div#wrapper {
    overflow: auto;
    max-height: 100vh;
    position: sticky;
    top: 0;
}
.blocks--container.dark {
    max-width: 100%;
    background: #00001a;
    min-height: 620px;
}

.blocks--container .container {
    max-width: 1300px;
}

.blocks--container.dark .col-img {
    min-height: 620px;
    background-size: cover;
    background-position: center;
}

.blocks--container.dark .title {
    color: #DD2BAA;
    font-family: Gilroy;
    font-size: 40px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 56px;
}

.blocks--container.dark .subtitle {
    color: #DD2BAA;
    font-size: 24px;
    letter-spacing: 0;
    line-height: 34px;
    margin-top: 2px;
}

.blocks--container.dark .content p {
    color: #FFFFFF;
    font-family: Gilroy;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 32px;
    max-width: 90%;
}

.blocks--container.block .block--item {
    background: none;
}

.blocks--container.block .block--item .block-content {
    padding-left: 0px;
    padding-right: 10%;
}


div#wrapper.blocks-started .blocks--container.blocks {
    position: sticky;
    top: 0px;
    left: 0;
    width: 100%;
    height: calc(100% - 560px);
    z-index: 2;
    background: white;
}
.block--item {
    max-width: calc(100% - 30px);
    width: 1300px;
    margin: auto;
}
.blocks--container.blocks {
    /* overflow: hidden; */
    margin: auto;
    padding: 100px 0px;
}

.blocks--holder {
    /* max-height: 560px; */
    overflow: hidden;
    position: relative;
}

.blocks--holder:after {content: '';position: absolute;top: 560px;height: 1120px;width: 100%;left: 0;background: white;}

.blocks--holder {top: 190px;}
body.page-template-template-solutions-2 div#wrapper.blocks-finished .blocks--container.blocks .blocks--holder:after {
    display: none;
}

body.page-template-template-solutions-2 div#wrapper.blocks-finished .blocks--container.blocks .blocks--holder {
    top: 0px;
}




/**** Careers ****/

.section--careers-intro {
    padding: 90px 15px 0px;
}

.section--careers-intro .title {
    color: #120C2C;
    font-size: 40px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 56px;
    margin-bottom: 50px;
}
 


body.page-id-303 .inner--hero {
    text-align: center;
    height: 510px;
}

.inner--hero .subtitle {
    font-size: 20px;
    letter-spacing: 0;
    line-height: 30px;
    max-width: 810px;
    margin: 30px auto auto;
}
div#owl-careers .owl-dots button {
    transition: 0.3s all ease;
    border-radius: 20px;
    height: 11px;
    width: 11px;
    margin: 20px 5px;
    background-color: #D7D7D7;
}
div#owl-careers .owl-dots button.active {background: #DD2BAA;}

.section--join {
    margin-top: 100px;
    padding-bottom: 60px;
}

.section--join .join--title {
    color: #36B2FF;
    font-family: Gilroy;
    font-size: 40px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 64px;
    margin-bottom: 12px;
}


.section--join  .join--text {
    color: #120C2C;
    font-family: Gilroy;
    font-size: 20px;
    letter-spacing: 0;
    line-height: 30px;
    text-align: center;
    margin: auto;
    max-width: 810px;
}

.section--jobs {
    background-color: #F7F7F7;
    padding: 100px 15px 130px;
}

.jobs_title {
    text-align: center;
    color: #120C2C;
    font-size: 40px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 64px;
    margin-bottom: 30px;
}

a.career-link {
    display: block;
    border: 1px solid #C5BFBF;
    border-radius: 10px;
    background-color: #FFFFFF;
    margin-top: 30px;
    text-decoration: none;
    padding: 22px;
    transition: 0.3s all ease;
}

.career--item-title {
    color: #120C2C;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 42px;
    transition: 0.3s all ease;
}

.career--item--location {
    color: #120C2C;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 42px;
    opacity: 0.6;
}

a.career-link:hover {border-color: #36B2FF;}

.career--item--location:after {content: '\f061';font-family: fontAwesome;margin-left: auto;display: table;line-height: 0;top: -8px;position: relative;color: #36B2FF;}


/**** Single Career ****/

.inner--hero.single-career {
    background-image: url(/wp-content/themes/headon/images/hero_career.jpg);
    height: 320px;
}

body.single-career div#wrapper {
    border-top: 85px solid #120C2C;
}
 
.inner--hero.single-career h1.title {
    font-size: 40px;
    line-height: 1.33;
    font-weight: 600;
    margin-bottom: 30px;
}
.inner--hero.single-career .subtitle {
    max-width: 100%;
    font-size: 20px;
}
a.careers--link {
    display: block;
    color: #36B2FF;
    font-size: 24px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 64px;
    margin: 40px 0px 54px;
}
a.careers--link i.fas {
    margin-right: 14px;
}
.career-content-title {
    color: #120C2C;
    font-family: Gilroy;
    font-size: 32px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 42px;
    margin-bottom: 20px;
}

.post-content p, .post-content li {
    font-family: Gilroy;
    font-size: 18px;
    letter-spacing: 0;
    line-height: 28px;
    margin-bottom: 20px;
}

* + .career-content-title {
    margin-top: 50px;
}

.post-content ol, .post-content ul {
    margin-left: 20px;
}

.post-content ol li::marker, .post-content ul li::marker {
    color: #36B2FF;
}

.post-content ol li, .post-content ul li {
    padding-left: 20px;
}

.body--single-career {
    padding-bottom: 80px;
}
.career-form {padding: 32px 32px 0px;max-width: 350px;border: 1px solid #C5BFBF;background-color: #FFFFFF;position: sticky;top: 80px;}

.career-form-title {
    color: #36B2FF;
    font-family: Gilroy;
    font-size: 26px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 44px;
    margin-bottom: 20px;
}

.career-form input.wpcf7-text {
    height: 47px;
    width: 281px;
    border: 1px solid #C5BFBF;
    border-radius: 4px;
    background-color: #FFFFFF;
    width: 100%;
    color: #120C2C;
    font-family: Gilroy;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0;
    padding: 0px 15px;
    outline: none;
    transition: 0.3s all ease;
}

.cform-input label {
    color: #120C2C;
    font-family: Gilroy;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 28px;
    margin-top: 5px;
}

.cform-input {
    /* margin-bottom: 20px; */
    color: #120C2C;
    font-family: Gilroy;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 28px;
    margin-bottom: 29px;
}
.cform-input a {
    color: inherit;
    text-decoration: underline;
}

input#career-form-submit {
    width: 100%;
    height: 50px;
    line-height: 50px;
    border: 0px;
    border-radius: 60px;
    outline: none;
    background: #36B2FF;
    color: white;
    font-size: 18px;
    font-weight: 700;
    cursor: pointer;
}

span.wpcf7-spinner {
    position: absolute !important;
}

.cform-input + .cform-input {
    margin-top: 1px;
}
input#file-1 {
    opacity: 0;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    height: 30px;
    cursor: pointer;
    font-size: 0px;
    padding: 0px;
    border: 0px;
    background: none;
    left: -20px;
}

.file-faker:after {
    content: attr(data-nofile);
}

.file-holder {
    position: relative;
    height: 100%;
    display: table;
    width: 100%;
    margin-top: 40px;
    color: #36B2FF;
    font-family: Gilroy;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 28px;
    cursor: pointer;
}

.wpcf7-form-control-wrap {
    height: 30px;
    display: block;
    width: 100%;
    cursor: pointer;
}

.file-faker {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    z-index: -1;
}

.career-form input.wpcf7-text:focus {
    border-color: #36B2FF;
}
 
.file-faker.has-file:after {
    content: attr(data-file);
}
.career-form span.wpcf7-not-valid-tip {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 12px;
    line-height: 1;
    padding: 5px;
}


.career-form .wpcf7 form.sent .wpcf7-response-output {
    border: 0px;
    padding: 0px;
    text-align: center;
    font-weight: 600;
    color: #4caf50;
    font-size: 20px;
    line-height: 1.4;
}

@media (max-width:767px)
{
    header {
        background: rgb(18 12 44 / 80%);
        padding: 20px 0px;
    }
    div#mobile-toggler {
        width: 32px;
        height: 32px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin: auto 0px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        /* box-shadow: 0px 0px 0px 1px white; */
        position: relative;
        z-index: 50;
    }

    div#mobile-toggler > div {
        background: #5ED9F7;
        height: 2px;
        margin: auto;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 5px;
        flex: 0 0 2px;
        width: 100%;
        border-radius: 20px;
        -webkit-transition: 0.4s all ease;
        -o-transition: 0.4s all ease;
        transition: 0.4s all ease;
    }

    ul#menu-main li {
        margin-left: 15px;
    }
    body.mobile-menu--open div#mobile-toggler > div.hm-1 {
        -webkit-transform: rotate(225deg) translate(-8px, -8px);
        -ms-transform: rotate(225deg) translate(-8px, -8px);
        transform: rotate(225deg) translate(-8px, -8px);
    }
    body.mobile-menu--open div#mobile-toggler > div.hm-3 {
        -webkit-transform: rotate(-225deg) translate(-8px, 8px);
        -ms-transform: rotate(-225deg) translate(-8px, 8px);
        transform: rotate(-225deg) translate(-8px, 8px);
    } 
    body.mobile-menu--open div#mobile-toggler > div.hm-2 {
        -webkit-transform: rotateZ(47deg);
            -ms-transform: rotate(47deg);
                transform: rotateZ(47deg);
        opacity: 0;
    }

    body.mobile-menu--open  nav#menu {
        opacity: 1;
        -webkit-transform: none;
            -ms-transform: none;
                transform: none;
        z-index: 50;
    }

    ul#menu-main {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        line-height: 3;
    }

    nav#menu li a {
        font-size: 18px;
    }

    nav#menu li.contact-top a {
        margin: 30px 00px;
        line-height: 40px;
        height: 40px;
        padding: 0px 25px;
    }

    body.mobile-menu--open {
        overflow: hidden;
    }

    a.logo {
        position: relative;
        z-index: 52;
    }
    a.logo img {
        height: 26px;
    }


    .item-content {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        text-align: left;
        /* padding-left: 20px; */
        text-align: center;
    }

    .benefit--item 
     .title {
        font-size: 20px;
        line-height: 30px;
    }

    .customers--list {
        padding: 50px 0px 25px;
    }

    .customers--list .col {
        width: 50%;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        -o-flex: 0 0 50%;
        text-align: center;
        padding: 0px 35px 30px;
        margin: auto;
    }
    .customers--list .col img {
        max-height: 70px;
    }
    div#wrapper {
        overflow: hidden;
    }

    nav#menu {
        /* display: none; */
        position: fixed;
        top: 52px;
        height: calc(100vh - 52px);
        background: #120c2c;
        left: 0;
        width: 100%;
        padding-top: 10vw;
        -webkit-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        transform: translateX(-100%);
        -webkit-transition: 0.5s all ease;
        -o-transition: 0.5s all ease;
        transition: 0.5s all ease;
        opacity: 0;
    }
    .section--hero a.button {
        line-height: 40px;
        height: 40px;
        margin-top: 40px;
    }
    .ind-item {
        padding: 0px 15px;
    }
    div#owl-industries .owl-dots {
        justify-content: left;
        padding: 30px 15px 0px;
    }

    .footer-title {
        margin-top: 40px;
        margin-bottom: 0px;
    }
    #owl-industries .owl-nav {
        display: none;
    }

    .ind-content {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(100% - 0px);
        flex: 0 0 calc(100% - 0px);
        position: relative;
        padding: 30px 0px 0px;
        width: calc(100% - 0px);
        margin: 0px auto 0px;
        background: #F7F7F7;
    }

    .ing-image {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
        order: -1;
        max-height: 67vw;
    }

    .ind-item .title {
        font-size: 30px;
        margin-bottom: 15px;
        line-height: 1.3;
    }

    .text {
        font-size: 18px;
        line-height: 28px;
    }

    .industries--list {
        padding: 30px 0px 40px;
    }

    h2 {
        font-size: 34px;
        margin-bottom: 20px;
        font-weight: 500;
    }

    img.hero-oo {
        right: -50%;
        left: auto;
        top: 10%;
        width: 100%;
    }

    .section--hero .title {
        font-size: 6.8vw;
        line-height: 1.4;
    }

    .section--hero .subtitle {
        font-size: 4.3vw;
        line-height: 1.7;
        margin: 15px 0px 25px;
    }

    .section--hero .subtitle br {
        display: none;
    }

    .section--hero {
        height: auto;
        min-height: auto;
        padding: 140px 15px 90px;
        background-position: left;
    }

    .section--intro {
        padding: 40px 15px;
    }

    .section--intro .text {
        font-size: 20px;
        line-height: 32px;
    }

    .benefits--list {padding: 50px 15px 20px;background-position: left;}

    .benefit--item {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        min-height: auto;
        margin-bottom: 30px;
        padding: 30px 20px;
    }

    .benefit--item {
    flex-direction: column;
    margin-bottom: 10px;
    padding: 30px 10px;
    }

    .benefit--item .icon {
        -webkit-box-flex: 0;
            -ms-flex: 0 0 80px;
                flex: 0 0 80px;
    }

    .benefit--item  .text {
		font-size: 20px;
		line-height: 30px;
	}



    /** Solutions **/

    h3.solutions-title {
        font-size: 28px;
        margin-bottom: 10px;
        line-height: 1.3;
    }

    .solutions--blocks {
        padding: 50px 30px;
    }

    .solutions--blocks .container:nth-child(even) .order-2 {-webkit-box-ordinal-group: 3;-ms-flex-order: 2;order: 2;}

    img.solutions-image {
        margin: auto;
        max-width: 100%;
    }

    .solutions--blocks .container + .container {
        margin-top: 40px;
    } 
	.solutions-image {
		margin-top: 30px;
	}

    /** Partners **/
    .partners--list {
        padding: 25px 0px;
    }

    .partners--item {
        min-height: auto;
        padding: 30px 36px 40px;
    }




    /** About **/

    .inner--hero {
        height: 90vw;
    }

    h1.title {
        font-size: 40px;
        max-width: 70%;
        line-height: 1.2;
        text-align: center;
        margin: auto 15px;
        text-align: left;
    }

    h2.title {
        font-size: 40px;
    }

    .section--intro .text p {
        font-size: 20px;
        line-height: 1.5;
    }

    .section--team {
        padding: 30px 0px;
    }

    .country--item.dot--right .country--label, .country--item.dot--left .country--label {opacity: 0;}

    .section--offices {
        /* padding: 60px 0px; */
        height: 92vw;
        background-size: cover;
    }

    .section--offices h2.title {
        margin-bottom: 50px;
        position: absolute;
        left: 0;
        right: 0;
        top: 30px;
    }

    .country--item:hover .country--label {
        opacity: 1;
    }
     .section--offices > .container {
        max-width: 100%;
        position: absolute;
        top: -13%;
        bottom: 0;
        margin: auto;
        height: 80vw;
    }

    .offices--map {
        height: 87vw;
    }
    .country--item[data-id="2"] .country--card {
        left: auto;
        right: -9px;
    }


    

    /*** Career ***/
    body.page-id-303 h1.title {
        max-width: 250px;
    }

    body.page-id-303 .inner--hero .subtitle {
        text-align: left;
        margin-left: 15px;
    }

    .section--careers-intro {
        padding: 50px 15px;
    }

    .section--careers-intro .title {
        font-size: 30px;
        line-height: 1.3;
        margin-bottom: 20px;
        color: #36B2FF;
    }

    .section--join {
        margin-top: 30px;
        padding-bottom: 32px;
    }

    .section--join .join--title {
        font-size: 30px;
        line-height: 1.3;
        color: #120C2C;
    }

    .section--join .join--text {
        font-size: 16px;
        line-height: 26px;
    }

    .section--jobs {
        padding: 30px 10px 50px;
    }

    .jobs_title {
        font-size: 30px;
        line-height: 1.4;
        margin-bottom: 0px;
    }

    .career--item-title {
        line-height: 1.4;
    }

    .career--item--location {
        line-height: 1;
        margin-top: 11px;
    }
    .careers-wrapper {
        display: flex;
        flex-direction: column;
    }

    .section--careers-intro {
        order: 4;
    }

    /**** Single Career ****/

    .inner--hero.single-career {
        background: url(/wp-content/themes/headon/images/hero_career_mobile_single.jpg);
        background-size: cover;
        background-position: center;
        padding-top: 0px;
        height: auto;
        padding: 70px 0px;
    }

    .inner--hero.single-career h1.title {
        max-width: 100%;
        font-size: 32px;
        font-weight: 600;
        letter-spacing: 0;
        line-height: 42px;
    }

    .inner--hero.single-career .subtitle {
        margin: auto 15px;
        font-size: 16px;
    }
    a.careers--link {
        margin: 20px 0px;
        font-size: 20px;
    }

    .body--single-career {
        padding: 0px 15px 50px;
    }

    .career-form {
        padding: 23px;
        margin-top: 30px;
        position: relative;
        top: auto;
    }

}