/* ------------------------------------- DO NOT EDIT ----------------------------------------- */
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/HeaderA.css");
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/HeaderB.css");
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/HeaderC.css");
/* ------------------------------------------------------------------------------------------- */
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/IntroA.css");
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/IntroB.css");
/* ------------------------------------------------------------------------------------------- */
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/ContentBoxA.css");
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/ContentBoxB.css");
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/ContentBoxC.css");
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/ContentBoxD.css");
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/ContentBoxE.css");
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/ContentBoxF.css");
/* ------------------------------------------------------------------------------------------- */
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/ListA.css");
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/ListB.css");
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/ListC.css");
/* ------------------------------------------------------------------------------------------- */
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/BannerB.css");
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/BannerE.css");
/* ------------------------------------------------------------------------------------------- */
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/FooterA.css");
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/FooterB.css");
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/FooterC.css");
/* ------------------------------------------------------------------------------------------- */
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/OverlayA.css");
@import url("/content/dam/amex/nl/assets/bubl/ElementsV3/include_blocks/OverlayB.css");
/* ------------------------------------- END DO NOT EDIT ------------------------------------- */

/* -------------------------------  Make edits for mobile xs  -------------------------------- */
@media only screen and (max-width: 576px) {}

/* -------------------------------- Make edits for Mobile   ---------------------------------- */
@media (min-width:577px) and (max-width:768px) {}

/* -------------------------------  Make edits for Tablet ------------------------------------ */
@media (min-width:769px) and (max-width:1023px) {}

/* -------------------------------- Make edits for Desktop  ---------------------------------- */
@media (min-width:1024px) and (max-width:1279px) {}

/* -------------------------------- Make edits for Desktop xl -------------------------------- */
@media only screen and (min-width: 1280px) {}

/* ------------------------------------------------------------------------------------------- */
/* --------------------------------- INSERT BELOW CUSTOM CSS --------------------------------- */
/* Intro */
.IntroTekstA p.Large {
    color: #000;
}

.IntroTekstA#intro h2 {
    color: #000;
    font-size: 2.875rem;
    font-weight: 900
}

.IntroTekstA {
    margin-bottom: 50px;
}

/* List B */
.ListB h4 {
    font-family: BentonSans, "Helvetica Neue", Helvetica, fallbackBold, sans-serif;
    font-size: 0.95rem;
    line-height: 1.3rem;
    font-weight: 900;
    color: #000;
}

.ListB p {
    font-family: BentonSans, "Helvetica Neue", Helvetica, fallbackBold, sans-serif;
    font-size: 0.95rem;
    line-height: 1.3rem;
    font-weight: 300;
    color: #000;
}

.ListB .icon::before {
    font-size: 2.5rem;
}

/* -General- */
p {
    font-family: BentonSans, "Helvetica Neue", Helvetica, fallbackBold, sans-serif;
    font-size: .9375rem;
    font-weight: 300;
    line-height: 1.375rem;
}

.hide,
.hero {
    /*! display:none; */
}

p b,
p strong {
    font-weight: 700 !important;
}

.IntroTekstA h2 {
    font-family: Guardian, Helvetica Neue, Helvetica, sans-serif;
    font-weight: 300;
    font-size: 1.875rem;
    line-height: 2.375rem;
    color: #000;
}

h3 {
    font-family: Guardian, Helvetica Neue, Helvetica, sans-serif;
    font-weight: 300;
    font-size: 1.875rem;
    line-height: 2.375rem;
}

h4 {
    font-family: BentonSans, "Helvetica Neue", Helvetica, fallbackBold, sans-serif;
    font-size: .9375rem;
    font-weight: 700;
    line-height: 1.375rem;
}

/* -Header-header-type-a- */



.banner-h a {
    color: #fff;
    font-size: .9375rem;
    font-weight: 500;
    line-height: 1.375rem;
}

.banner-h .pad-3-b {
    padding-bottom: 0px !important;
}

.banner-h a::after {
    content: '';
    display: inline-block;
    width: 17px;
    height: 17px;
    background-image: url("http://conceptenzo.tech/AmexElementsV2/img/ArrowWitRight.svg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    position: relative;
    top: 4px;
    margin-left: 10px;
    transition: all 300ms;
}


.banner-h h1 {
    font-family: Guardian, Helvetica Neue, Helvetica, sans-serif;
    font-weight: 400;
    font-size: 40px;
    line-height: 50px;
    color: #fff;
}


.banner-h h2 {
    font-family: Guardian, Helvetica Neue, Helvetica, sans-serif;
    color:#006FCF;
}




.banner-h h3 {
    font-family: BentonSans, "Helvetica Neue", Helvetica, fallbackBold, sans-serif;
    font-weight: 500;
    font-size: .8125rem;
    line-height: 1.125rem;
    color: #fff;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.banner-h .image.parbase .j {
    height: 350px;
}

.banner-h p {
    font-family: BentonSans, "Helvetica Neue", Helvetica, fallbackBold, sans-serif;
    font-size: .9375rem;
    font-weight: 300;
    line-height: 1.375rem;
    color: #fff;
}

.banner-h .Btn {
    margin-top: 150px;
}

.banner-h .headercard3 {
    position: absolute;
    max-width: 400px;
    top: 70px;
    z-index: 2;
    margin: 0 auto;
}

.banner-h .headercard2 {
    position: absolute;
    max-width: 400px;
    top: 70px;
    z-index: 1;
    margin: 0 auto;
}

.banner-h .headercard1 {
    position: absolute;
    max-width: 400px;
    top: 70px;
    z-index: 3;
    margin: 0 auto;
}


.banner-h .headercard3 {
    animation: mymove 10s infinite;
}

@keyframes mymove {
    50% {
        transform: rotate(10deg);
    }
}

.banner-h .headercard2 {
    animation: mymove1 10s infinite;
}

@keyframes mymove1 {
    50% {
        transform: rotate(20deg);
    }
}

/* -------------------------------------------------------------------------------------------- */
@media only screen and (max-width: 576px) {
    .banner-h .container {
        /*! padding-left: 20px; */
        /*! padding-right: 20px; */
    }

    .banner-h h1 {
        font-size: 32px;
        line-height: 38px;
    }

    .banner-h .row {
        padding-top: 30px !important;
        padding-bottom: 40px !important;
    }

    .btn {
        max-width: 100%;
    }
}

/* -------------------------------------------------------------------------------------------- */
@media (min-width:577px) and (max-width:768px) {
    .btn {
        max-width: 100%;
    }
}

/* -------------------------------------------------------------------------------------------- */
@media (min-width:769px) and (max-width:1023px) {}

/* -------------------------------------------------------------------------------------------- */
@media (min-width:1024px) and (max-width:1279px) {}

/* -------------------------------------------------------------------------------------------- */
@media only screen and (min-width: 1280px) {}

/* -------------------------------------------------------------------------------------------- */

/* -banner-h- */

.HeaderA h2 {
    color: #006FCF;
    margin-bottom: 10px;
}

.banner-h {
    background: -webkit-linear-gradient(bottom, rgba(0, 111, 207, 0.25) 0%, rgba(0, 111, 207, 0) 100%);
    padding-top: 80px;
    padding-bottom: 80px;
}

.banner-h .grid:nth-child(1) {
    max-width: 70%;
    margin: 0 auto;
}

.banner-h .grid:nth-child(2) {
    height: 320px;
    /*! width:300px; */
    margin: 0 auto;
}

.banner-h .image {
    margin: 0 auto;
    width: 300px;
    display: block;
    position: relative;
}

.HeaderA h4 {
    font-family: BentonSans, "Helvetica Neue", Helvetica, fallbackBold, sans-serif;
    font-weight: 500;
    font-size: .8125rem;
    line-height: 1.125rem;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.HeaderA b {
    color: #333;
}

.banner-h p[style] {
    color: #333;
    text-align: center;
}

.banner-h p {
    color: #333;
    text-align: center;
}

.banner-h ul {
    color: #333;
    font-family: Helvetica Neue, Helvetica, sans-serif;
    font-size: .8125rem;
    line-height: 1.25rem;
}


.HeaderA img.lazy {
    margin: 70px 0px;
}

.HeaderA .ImageContent {
    bottom: 150px;
    right: 0;
    margin: 250px;
}


.HeaderA img.lazy {
    max-width: 70%;
    float: right;
    /*! margin: 0 50px; */
}

.HeaderA .headercard3 {
    position: absolute;
    z-index: 2;
    top: -100px;
    right: 0px;
}

.HeaderA .headercard2 {
    position: absolute;
    z-index: 1;
    top: -100px;
}

.HeaderA .headercard1 {
    position: absolute;
    z-index: 3;
    top: -100px;
}


.HeaderA .headercard3 {
    animation: mymove 10s infinite;
}

@keyframes mymove {
    50% {
        transform: rotate(10deg);
    }
}

.HeaderA .headercard2 {
    animation: mymove1 10s infinite;
}

@keyframes mymove1 {
    50% {
        transform: rotate(20deg);
    }
}

/* -------------------------------------------------------------------------------------------- */
@media only screen and (max-width: 576px) {
    .HeaderA .image {
        margin: 0 auto;
        width: 240px;
        display: block;
        position: relative;
    }

    .HeaderA ul {
        margin-top: 20px
    }

    .banner-h .grid:nth-child(1) {
        max-width: 100%;
    }

    .banner-h .card-img-bg {
        display: none;
    }

    .banner-h.grid:nth-child(2) {
        height: 260px;
    }

    .HeaderA {
        padding-top: 40px;
        padding-bottom: 60px;
    }

    .HeaderA img.lazy {
        max-width: 70%;
        float: none;
        margin: 0 15%;
    }

    .HeaderA .headercard3,
    .HeaderA .headercard2,
    .HeaderA .headercard1 {
        top: 200px;
    }

    #intro.IntroTekstA {
        margin-top: 230px;
    }

    .banner-h {
        padding-top: 30px;
        padding-bottom: 30px;
    }
}

/* -------------------------------------------------------------------------------------------- */
@media (min-width:577px) and (max-width:768px) {
    .HeaderA {
        padding: 80px 0px;
    }

    .HeaderA ul {
        margin-top: 20px
    }

    .HeaderA .grid:nth-child(1) {
        max-width: 100%;
    }

    .HeaderA img.lazy {
        max-width: 70%;
        float: none;
        margin: 0 15%;
    }

    .HeaderA .headercard3,
    .HeaderA .headercard2,
    .HeaderA .headercard1 {
        top: 200px;
    }

    #intro.IntroTekstA {
        margin-top: 200px;
    }
}

/* -------------------------------------------------------------------------------------------- */
@media (min-width:769px) and (max-width:1023px) {
    .HeaderA img.lazy {
        max-width: 70%;
        float: none;
        margin: 0 15%;
    }

    .HeaderA .headercard3,
    .HeaderA .headercard2,
    .HeaderA .headercard1 {
        top: 100px;
    }

    #intro.IntroTekstA {
        margin-top: 200px;
    }
}

/* -------------------------------------------------------------------------------------------- */
@media (min-width:1024px) and (max-width:1279px) {}

/* -------------------------------------------------------------------------------------------- */
@media only screen and (min-width: 1280px) {}

/* -------------------------------------------------------------------------------------------- */

/* -Voorwaarden- */

.HeaderC {
    margin-bottom: 0px;
}

.HeaderC h2 {
    font-family: Guardian, Helvetica Neue, Helvetica, sans-serif;
    font-weight: 300;
    font-size: 1.875rem;
    line-height: 2.375rem;
}

.ContentBoxA {
    padding: 100px 0px;
    margin-bottom: 0px;
}


.ContentBoxA p {
    font-weight: 300;
    font-size: 0.95rem;
    line-height: 1.3rem;
    color: #000;
    margin-bottom: 15px;
}



.ContentBoxA h3 {
    font-family: Guardian, Helvetica Neue, Helvetica, sans-serif;
    font-weight: 400;
    font-size: 28px;
    line-height: 1.9 rem;
    color: #006FCF;
}

.ContentBoxC {
    background: #f7f8f9;
    padding-top: 40px;
    padding-bottom: 80px;
    margin-bottom: 0px;
}

.ContentBoxC h2 {
    font-family: Guardian, Helvetica Neue, Helvetica, sans-serif;
    padding-top: 0px;
    padding-bottom: 30px;
}

.ContentBoxC .row {
    max-width: 100%;
    padding-top: 0px;
    padding-bottom: 0px;
}

.ContentBoxC h5,
.ContentBoxC ul {
    color: #97999B;
    font-family: Helvetica Neue, Helvetica, sans-serif;
    font-size: .8125rem;
    line-height: 1.25rem;
}

.ContentBoxC h5 {
    margin-bottom: 10px;
}

/* -------------------------------------------------------------------------------------------- */
@media only screen and (max-width: 576px) {
    .ContentBoxC h2 {
        font-size: 21px;
        line-height: 26px;
    }

    .ContentBoxA {
        padding: 30px 0px;
    }
}

/* -------------------------------------------------------------------------------------------- */
@media (min-width:577px) and (max-width:768px) {
    .Content .row {
        padding-top: 30px;
        padding-bottom: 0px;
        max-width: 100%
    }
}

/* -------------------------------------------------------------------------------------------- */
@media (min-width:769px) and (max-width:1023px) {}

/* -------------------------------------------------------------------------------------------- */
@media (min-width:1024px) and (max-width:1279px) {}

/* -------------------------------------------------------------------------------------------- */
@media only screen and (min-width: 1280px) {}

/* -------------------------------------------------------------------------------------------- */