@import url("https://use.typekit.net/pzo2wsl.css");
@import url("https://origin-slgem.americanexpress.com/content/dam/amex/nl/assets/css/normal.css");


.body {
    -webkit-font-smoothing: antialiased;
    font-family: benton-sans, sans-serif !important;
    font-weight: 400;
    font-style: normal;
}
.clear {clear: both;}
.row3 .grid .btn {border-radius: 30px;}
/* -------------------------------------------------------------------------------------------- */
/* -- Header - Start Layout ------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------- */
.grid {background:#ededed;}
.grid .row3 .grid {background:#fff;}
.grid .row1 {margin-top:60px; padding:100px 30px;}

h1 {
    line-height: 1.1;
    font-weight: 900;
    letter-spacing: -1px;
    font-size: 36px;
    font-family: benton-sans !important;
    margin: 10px 0 0 0;
}
h3 {
    font-family: benton-sans, sans-serif !important;
    font-size: 24px;
    letter-spacing: -.71px;
    line-height: 32px;
    color: #fff;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    margin-bottom: .5rem;
    margin-top: .5rem;
}
.grid .row2 {padding:30px 30px 15px 30px;}
.grid .row3 {padding:15px 30px 240px 30px; margin-bottom: 60px; }
.grid .row2 .dls-accent-gray-02-bg {
background-color: #fff;
}
.grid .row3 .dls-accent-gray-02-bg {
    background-color: #fff;
    background-image: url("https://origin-slgem.americanexpress.com/content/dam/amex/nl/assets/2020/informatie/bg-bericht.png");
    background-repeat: no-repeat;
    background-size: 70%;
    background-position: bottom left;
}
.grid .row1 p {display:none;}
.row2 .heading-4 {
    font-family: benton-sans, sans-serif !important;
    font-size: 18px;
    letter-spacing: -.71px;
    line-height: 22px;
    font-weight: 900;
    font-stretch: normal;
    font-style: normal;
    margin-bottom: 10px!important;
    padding-top: 20px!important;
    display:block;
}
.grid .row2 p{
    -webkit-font-smoothing: antialiased;
    font-family: benton-sans,sans-serif !important;
    font-weight: 400;
    font-style: normal;
    font-size: 17px;
    letter-spacing: -.5px;
    font-weight: 500;
    line-height: 1.6;
}
.grid .row3 p{
    -webkit-font-smoothing: antialiased;
    font-family: benton-sans,sans-serif !important;
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
    letter-spacing: -.5px;
    font-weight: 500;
    line-height: 1.6;
}

.row3 .col-md-4 .grid {
  border:1px solid #ccc;
  margin-bottom:30px;
  position: relative;
}
.row3 .col-md-4 .grid .row {
  height:440px !important;
}

.row3 .col-md-4 .grid > div[style] {
  position: static!important;
}
.row3 .grid .heading-4 {
    font-family: benton-sans, sans-serif !important;
    font-size: 18px;
    letter-spacing: -.71px;
    line-height: 22px;
    font-weight: 900;
    font-stretch: normal;
    font-style: normal;
    margin-bottom: 10px!important;
    padding-top: 20px!important;
    display:block;
}

.row3 .grid .btn {max-width: 95% !important; position:absolute; width:96%; bottom:0px;}
.row3 .grid .btn {max-width: 100%!important; position:absolute; width:calc(100% - 20px); bottom:20px;}
.row3 .icons {float:left; height:300px; margin-right:10px}

/* -------------------------------------------------------------------------------------------- */
@media only screen and (max-width: 576px){
.container {padding-left: 0px; padding-right: 0px;}
.grid .row1 {margin-top:0px;}
h1{font-size: 28px; margin: 10px 0 0 0;}
h3 {font-size: 18px; text-shadow: 1px 1px 5px rgba(15, 22, 26, 0.6);  font-weight: 500;}
.grid .row1 .card-img-bg {background-position: 65% 50%!important;}
.grid .row2 .dls-accent-gray-02-bg {background-size: 100%;}
.row3 .icons {float:none; height:auto; margin-right:0px}
.row3 .col-md-4 .grid .row {height: 420px !important;}   
.row3 .grid .btn {bottom:-10px;}
.grid .row3 {margin-bottom: 1px;}
} 
/* -------------------------------------------------------------------------------------------- */
@media (min-width:577px) and (max-width:768px){
.container {padding-left: 0px; padding-right: 0px;}
.grid .row1 {margin-top:0px;}
h1{font-size: 28px; margin: 10px 0 0 0; }
h3 {font-size: 18px; text-shadow: 1px 1px 5px rgba(15, 22, 26, 0.6);  font-weight: 500;}
.grid .row1 .card-img-bg {background-position: 65% 50%!important;}
.grid .row2 .dls-accent-gray-02-bg {background-size: 100%; }
.row3 .icons {float:none; height:auto; margin-right:0px}
.row3 .col-md-4 .grid .row {height: 380px !important;}   
.row3 .grid .btn {bottom:10px;}
} 
/* -------------------------------------------------------------------------------------------- */
@media (min-width:769px) and (max-width:992px){
.row3 .icons {float:none; height:auto; margin-right:0px}
.row3 .col-md-4 .grid .row {height: 730px !important;}   
.row3 .grid .btn {bottom:10px;}
} 
/* -------------------------------------------------------------------------------------------- */
@media (min-width:993px) and (max-width:1280px){
.row3 .icons {float:none; height:auto; margin-right:0px}
.row3 .col-md-4 .grid .row {height: 530px !important;}  
.row3 .grid .btn {bottom:10px;}



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