@font-face {
    font-family: 'gilroy, Arial';
    src: url(../fonts/gilroy-extrabold.otf) format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'gilroylight, Arial';
    src: url(../fonts/gilroy-light.otf) format('opentype');
    font-weight: normal;
    font-style: normal;
}

.NewPopUp {
    display: none;
}

* {
    box-sizing: border-box;
}

p {
    font-size: 15px;
}

body {
    height: 100%;
    width: 100%;
    position: relative;
    font-family: Gilroy, sans-serif;
    font-size: 15px;
    color: #011e41; /* Avencia main color */
    line-height: 20px;
    letter-spacing: 0.02em;
    background-color: #FFF;
    margin: 0;
    padding: 0;
}

#MainContent Section {
    padding: 70px 0;
}

#MainContent {
    max-width: 1200px;
    margin: 0 auto;
}


/***************************/
/********** Tools **********/
/***************************/

.guide {
    font-family: Verdana, Helvetica, Arial, sans-serif;
    color: #009fe3;
    text-decoration: none;
    font-size: 14px;
}

#min-content-height {
    min-height: calc(100vh - 352px);
}

.container:before,
.navbar-collapse:before,
.container:after {
    display: none;
}

.section-legend::before, .lum-apply-section__name::before, .apply-submit-wrapper::before {
    background: white;
}

#external_site_pif .form-control,
#apply-section_dps .form-control {
    font-size: 1em;
}

select.form-control:not([size]):not([multiple]) {
    height: auto;
}

.linkedin,
.twitter,
.google,
facebook,
youtube,
.email {
    transition: 0.3s;
}

    .linkedin:hover {
        color: #FFF;
        background-color: #0085AE;
    }

    .twitter:hover {
        color: #FFF;
        background-color: #32CCFE;
    }

    .email:hover {
        color: #FFF;
        background-color: rgb(0, 159, 227);
    }

    .google:hover {
        color: #FFF;
        background-color: #C20806;
    }

.facebook:hover {
    color: #FFF;
    background-color: #3B5998;
}

.youtube:hover {
    color: #FFF;
    background-color: #C31A1E;
}


#contact_avencia .social-icon {
    display: inline-block;
    font-size: inherit;
}



a {
    text-decoration: none;
    color: black;
}

.padding-forNav {
    position: absolute !important;
    height: 20vh;
    width: 100%;
    bootom: 0;
}


.no-padding {
    padding: 0;
}


.white_bg {
    background-color: #FFF;
    color: #000;
}

.dark_bg {
    background-color: rgb(1, 30, 65);
    color: #FFF;
}

.grey_bg {
    background-color: rgb(242, 242, 242);
    color: #000;
}

.blue_bg {
    background: #013f6a;
    color: #FFF;
}

.text_vertical_center {
    display: flex;
    align-items: center;
}

.case_study p {
    font-size: 20px;
}

.case_study button {
    width: 80%;
    background-color: #009FE3;
    color: #FFF;
    font-weight: bold;
    box-shadow: 1px 1px 10px rgba(133,133,133, 0.8);
}

    .case_study button:hover,
    #consultancy_services button:hover {
        box-shadow: 6px 6px 10px rgba(133,133,133, 0.8);
    }

.employee_name_blue {
    font-size: 20px;
    font-weight: bold;
    color: rgb(0, 159, 227);
}

.employee_name_red {
    font-size: 20px;
    font-weight: bold;
    color: rgb(229, 0, 91);
}


/*************************/
/********** Nav **********/
/*************************/

#MainNav {
    background-color: rgb(1, 30, 65);
    /*opacity: 0.9;*/
    margin-bottom: 0;
}

    #MainNav a {
        color: #FFF;
        font-size: 15px;
    }

        #MainNav a:hover,
        #MainNav .active {
            color: rgb(229, 0, 91);
            font-weight: bold;
        }

        #MainNav a > img {
            height: 46px;
        }

    #MainNav li {
        margin: 5px 10px;
    }


.navbar-icon-collapsed {
    background-image: url(../Img/menu-icon-collapsed.png);
    display: block;
    height: 24px;
    width: 36px;
}


/****************************/
/********** Intro ***********/
/****************************/

#intro_section {
    margin: 5rem 0;
}

    #intro_section p {
        font-size: 20px;
        line-height: 1.5;
    }


#subheading p i {
    font-size: 20px;
    color: #999da3;
}


/****************************/
/********* Job List *********/
/****************************/

h1 {
    font-weight: bold;
    color: #009fe3;
    margin-bottom: 2rem;
}

.job_container {
    background: rgb(242, 242, 242);
    padding: 1.5rem;
    margin: 1rem 0;
    text-align: left;
    border-radius: 10px;
    transition: 0.3s;
}

    .job_container:hover {
        box-shadow: 0 0 11px rgba(33,33,33,.2);
        cursor: pointer;
    }

    .job_container i {
        color: #009fe3;
    }

.job_title {
    font-weight: bold;
    color: rgb(229, 0, 91);
    margin-bottom: 1rem;
}


/****************************/
/******** Job Details *******/
/****************************/

#jobDetail h1 {
    color: rgb(229, 0, 91);
    margin-top: 2rem;
    margin-bottom: 0;
}

#jobDetail h5 {
    margin-bottom: 2rem;
}

#jobDetail #BasicJobInfo {
    margin-bottom: 2rem;
}

    #jobDetail #BasicJobInfo span {
        display: inline-block;
        margin: 5px 1rem;
    }

        #jobDetail #BasicJobInfo span:first-child {
            margin-left: 0;
        }

#jobDetail h4 {
    font-size: 18px;
    font-weight: bold;
}

#jobDetail > div {
    margin-bottom: 4rem;
}

#jobDetail ul {
    line-height: 2;
}

#jobDetail button {
    color: #FFF;
    width: 100%;
    font-size: 20px;
    background-color: rgb(229, 0, 91);
    font-weight: bold;
    box-shadow: 1px 1px 10px rgba(133,133,133, 0.8);
    border-radius: 10px;
    padding: 10px 30px;
    width: auto;
}

    #jobDetail button:hover {
        cursor: pointer;
        background-color: rgb(0, 159, 227);
    }


/****************************/
/********** Footer **********/
/****************************/

footer .nav-link {
    display: inline-block;
    color: #FFF;
    font-weight: bold;
    font-size: 15px;
}

#FooterSocialMedia i {
    padding-right: 10px;
}

footer img {
    height: 46px;
    width: 203px;
}

footer .social_links {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

footer .social-icon {
    color: #FFF;
    display: inline-block;
}

footer i,
footer a {
    display: block;
}

footer .location {
    margin-top: 2rem;
}

    footer .location > span {
        display: block;
    }

footer .contact:nth-child(1) {
    font-weight: bold;
    color: rgb(229, 0, 91);
}

footer .contact:nth-child(2) {
    font-weight: bold;
    color: #009fe3;
}

footer ul a:hover {
    color: rgb(229, 0, 91);
    font-weight: bold;
}

footer a:hover {
    text-decoration: none;
}


/********************************************************/
/********** Desktop Version (Increased width) ***********/
/********************************************************/

/*Mainly for MacBook display*/
@media (min-width: 1281px) {

    #whatwedo_start h1 {
        font-size: 40px;
    }
}

/********************************************/
/**** Limit maximum width on xl displays ****/
/********************************************/

@media (min-width: 1200px) {
    .container {
        max-width: 1200px;
    }

    #contact_start input,
    #contact_start select {
        width: 90%;
    }
}
/*******************************************/
/*** Smooth transition from lg to md view ***/
/*******************************************/


@media (max-width: 992px) and (min-width: 768px) {

    .YOURAVENCIA .text_vertical_center {
        align-items: flex-start;
    }

    #geoCoverage h5,
    ul {
        font-size: 15px;
    }

    #geoCoverage h1 {
        font-size: 30px;
    }

    #geoCoverage ul {
        padding: 0;
    }
}


@media (max-width: 1200px) and (min-width: 992px) {
    .job_end_date,
    .job_location {
        max-width: 100%;
        flex: 0 0 100%;
    }

    .job_end_date {
        padding-bottom: 1rem;
    }
}

/*************************************/
/********** Tablet Version ***********/
/*************************************/

@media (max-width: 768px) {

    #whatwedo_start {
        height: 100%;
    }

        #whatwedo_start h1 {
            font-size: 30px;
        }

    h1 {
        font-size: 30px;
    }

    #frontpage {
        padding: 200px 0 150px 0;
    }

    #services h4 {
        font-size: 20px;
    }

    .RPO {
        padding: 6em 0;
    }

    /* Bottom padding for 'Your Guiding light in RPO' set to 0 to place the torch correctly */
    #MainContent > div:nth-child(2) > div {
        padding-bottom: 0;
    }

    img[alt="compass"] {
        width: 95%;
    }

    .case_study p {
        font-size: 15px;
    }

    .case_study button {
        width: auto;
        font-size: 15px;
    }

    #whoweare_start {
        border-bottom: 5em solid rgb(1, 63, 106);
    }

    /*.speech_bubble_bg {
        background: rgb(242, 242, 242) url('../Img/speech-bubble.png') no-repeat fixed top;
    }*/

    #contact_avencia > div {
        margin: 6em 0 2em 0;
    }

    .speech_bubble_bg > div > div:nth-child(2) {
        margin-top: 5em;
        padding-bottom: 5em;
    }

    #geoCoverage ul,
    #geoCoverage h5 {
        font-size: 15px;
    }

    #geoCoverage ul {
        padding: 0;
    }

    .JOINTHETEAM h1 {
        font-size: 30px;
    }

    .JOINTHETEAM h5 {
        font-size: 15px;
    }

    #return-to-top,
    #return-to-top i,
    #return-to-top:hover {
        background-color: transparent;
        color: transparent;
    }
}

@media (max-width: 767px) {
    #geoCoverage {
        background: rgb(1, 30, 65);
    }
}

/*************************************/
/********** Mobile Version ***********/
/*************************************/
@media (max-width: 576px) {

    #job_section .job_title {
        font-size: 20px;
    }

    .job_end_date,
    .job_location {
        max-width: 100%;
        flex: 0 0 100%;
    }

    .job_end_date {
        padding-bottom: 1rem;
    }

    #intro_section h1,
    #job_section h1 {
        text-align: center;
    }

    #whatwedo_start {
        height: 100%;
    }

        #whatwedo_start h1 {
            font-size: 25px;
        }

    h1 {
        font-size: 30px;
    }

    #frontpage {
        padding: 200px 0 150px 0;
    }

    #services h4 {
        font-size: 20px;
    }

    #MSP_Link {
        padding-top: 8em;
    }

    #TC_Link {
        padding-top: 8em;
    }

        #TC_Link h4 {
            margin-bottom: 1em;
        }


    /*.RPO,
    .MSP {
        text-align: center;
    }*/

    /*Defined input Tablet Version*/
    /* Bottom padding for 'Your Guiding light in RPO' set to 0 to place the torch correctly */
    /*#MainContent > div:nth-child(2) {
        padding-bottom: 0;
    }*/

    img[alt="torch"] {
        padding-top: 5em;
    }

    img[alt="compass"] {
        width: 45%;
        padding-bottom: 4em;
    }

    img[alt="lumesse-logo-mobile"] {
        padding-bottom: 6em;
    }

    img[alt="end-to-end"],
    img[alt="pop-up"],
    img[alt="plug-in"],
    img[alt="workforce-solution"] {
        height: 110px;
        padding-top: 3em;
    }

    img[alt="core-principles-vertical"] {
        padding-top: 3em;
    }

    img[alt="MSP-infographic-square"] {
        width: 95%;
    }

    #consultancy_services button {
        width: auto;
    }

    .speech_bubble_bg {
        background: rgb(242, 242, 242) url('../Img/speech-bubble.png') no-repeat fixed center;
        background-size: contain;
    }
}