.d-flex {display: flex; flex-wrap: wrap}
.align-items-center {align-items: center;}

.title .report-name { font-size: 24px !important; padding-bottom: 10px; }

#hero h1{margin: 0; font-size: 36px; }
#hero span{font-size: 16px; margin-bottom: 4px !important; display: block;}
#hero { background-size: auto 500px; background-repeat: no-repeat; background-position: right 0px top 0; max-width: 1400px; margin: 0 auto; }
#hero .content { background: rgba(255,255,255,.9); height: 500px; }
.bg-wrapper { position: relative; }
.bg-wrapper::after {  content: ''; position: absolute; bottom: 0; left: 0; height: 50px;  width: 100%; background: rgb(255,188,65); background: linear-gradient(0deg, rgba(255,188,65,0.4150035014005602) 0%, rgba(255,188,65,0.196516106442577) 30%, rgba(255,188,65,0.0760679271708683) 70%, rgba(250,250,250,0) 100%); }

.gated h1 {font-size: 36px;font-weight: 400;}
.gated h3{font-size: 24px; max-width: 640px; margin: 0 auto; font-weight: 500;}
.gated p.emphasis {font-size: 30px; margin-bottom: 30px}


.mktoFormCol .mktoHtmlText.mktoHasWidth span{color: #000}
.gated .mktoForm .mktoButtonWrap.mktoInset .mktoButton, .gated .mktoButtonRow{width: 100% !important;}

.bg-gray{background-color: #f1f1f1;}

.form { padding-top: 0; }
.form .mktoFormRow:first-of-type { display: none; }
.form .mktoForm { width: 100% !important }
.form .mktoForm input[type=text], .form .mktoForm input[type=email], .form .mktoForm select.mktoField, .form .mktoForm div.mktoLogicalField{ width: 98% !important; }
.form .mktoFormCol, .form  .mktoFieldWrap, .form .mktoHtmlText { width: 100% !important; }
.form .mktoButtonWrap { margin-left: 0 !important; }
.form .mktoForm div.mktoLogicalField { height: 1em I !important; }
.form .mktoButton {     background-image: none !important;
    background-color: #009CFF !important;
    background: #009CFF !important;
    color: #fff !important;
    width: 100% !important;
    cursor: pointer;
    border: 1px solid transparent !important;
    box-shadow: 0 0 0 0 #fff !important;
    padding: 0.5em 1em !important;
    font-size: 1.3em !important;
    margin-top: 20px !important; 
}

.modal-content .mktoForm input[type=text], .modal-content .mktoForm input[type=email], .modal-content .mktoForm select.mktoField, 
.modal-content .mktoForm div.mktoLogicalField, .modal-content .mktoForm input, 
.modal-content .mktoForm textarea.mktoField:valid[type=tel]:valid, .modal-content .mktoForm input[type=tel]:valid,.modal-content .mktoForm textarea.mktoField:valid{ width: 98% !important; }


#hero .hero-image { display: none; }

.img-400 {
    display: flex;
    margin: 15px auto;
    max-width: 400px;
}

.marketo-form {
    padding: 20px;
    background-color: #fff;
    margin-top: -150px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, .2);
    width: auto;
    position: absolute;
    border-radius: 15px;
}

.position-relative {
    position: relative!important;
}

.pr-2 { padding-right: 16px;}

.gated .content ul { padding-left: 0; }

.gated  .content ul>li {
    background: url(../png/blue-check.png) no-repeat 0px 3px;
    background-size: 1.25em;
    padding-left: 32px;
    list-style-type: none;
    margin-bottom: 5px;
}

@keyframes progress {
    0% { stroke-dasharray: 0 100; }
}
.pt-1 { padding-top: 1em; }
.pt-2 { padding-top: 2em; }
.pt-3 { padding-top: 3em; }
.pt-4 { padding-top: 4em; }
.pt-5 { padding-top: 5em; }
.pb-1 { padding-bottom: 1em; }
.pb-2 { padding-bottom: 2em; }
.pb-3 { padding-bottom: 3em; }
.pb-4 { padding-bottom: 4em; }
.pb-5 { padding-bottom: 5em; }
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 1200px) {
    #hero { background-position: right -30px top 0; }	
}

@media (max-width: 991px) {
    #hero { background-position: right -400px top 0;}
    #hero h1{font-size: 28px}
    .gated p.emphasis {font-size: 18px;}
    .num-cols .col{width: 48%; max-width: 400px; margin: 0 auto 30px}
    #hero { background-position: right -30px top 0; }	
    .marketo-form { margin: -50px auto 40px;  position: relative;}
    .pr-2 { padding-right: 0;}

}
@media (max-width: 767px) {
    .dlp-checklist #hero .hero-image {
        background-image: url(../jpg/hero.jpg);
        display: block;
        min-height: 250px;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center right -25px;
    }
    #hero .content { height: auto; padding: 40px 15px; }
    .num-cols .col{width: 100%; max-width: 400px; margin: 0 auto 30px}
    .num-cols .col:last-of-type { margin-bottom: 0; }
    .bg-gray { padding-top: 20px !important; }
}

@media (min-width: 768px) {
    .dlp-checklist #hero { background-image: url(../jpg/hero.jpg); }		
    .num-cols .row { display: flex; flex-wrap: wrap; justify-content: space-between }
    .de .bg-wrapper-inner { padding: 60px 0;}
    .list-item{min-height: 130px; }
}