/* Common */
    .ribbon-trademark {
      font-size: 1.5rem;
    }
    .network-security-ribbon, #netsec-report-2021-ribbon {
      background-image: url('../assets/images/network_security/cgwan/landing-page-header_forrester.svg');
    }
    .blue-teal-ribbon {
      background-image: linear-gradient(to right, #0088CE, #00B098);
    }
    .app-cloud-security-ribbon {
        background-image: linear-gradient(to right, #0088CE, #00B5D1);
    }
    /* Set background image based on id */
    #forrester-ribbon {
        background-image: url('../assets/images/campaign/email_wave/landing-page-header_forrester.jpg');
        background-position: center 27%;
    }
    /* Blue/green gradient ribbon */
    #email-reporting-ribbon, #nss-ribbon, #spearphishing2-ribbon, #spearphishing3-ribbon, #mssales-ribbon, #datacenter-ribbon-au,
    #datacenter-ribbon-ca, #cloudmarketing-ribbon, #remote-workforce-ribbon, #office-365-ribbon, #threat-report-ribbon, #ms-sales-ribbon,
    #sdwan-report-2020-ribbon, #spear-phishing-4-ribbon, #homepage-ribbon, #spear-phishing-5-ribbon, #ccb-ribbon, #office365-ccb-ribbon, #forrester-wave-ess {
        background-image: linear-gradient(to right, #0088CE, #82C341);
    }
    
    #phishline-gartner-ribbon {
        height: 70px !important;
        background-image: url('../assets/images/email_protection/bpl/ribbon_gartner.jpg');
    }
    #infisecure-ribbon, #wafwave-q1-2020-ribbon  {
        background-image: linear-gradient(to right, #0088CE, #9253A1);
    }
    /* Covid 19 theme ribbon */
    #retailmq-ribbon, #gartner-0420-ribbon, #covid-19-ribbon, #covid19-alert-ribbon {
        background: transparent linear-gradient(90deg, #FFFC66 0%, #FED556 4%, #FEBE45 9%, #FD8236 15%, #FD632A 21%, #FD4B20 27%, #FD3A1A 33%, #FD3016 40%, #FD2D15 49%, #FD3016 58%, #FD3919 66%, #FD4A20 72%, #FD6129 78%, #FD7F35 84%, #FEA343 90%, #FECE54 95%, #FFFC66 100%, #FFFC66 100%) 0% 0% no-repeat padding-box;
    }
    #clougenwan-ribbon, #azure-ribbon, #mssales-cgwan-ribbon, #sdwan-cgwan-ribbon, #future-netsec-ribbon, #cgwan-for-azure-ribbon, #cloudgen-access-ribbon, #ransomware-ribbon {
        background-image: url('../assets/images/network_security/cgwan/landing-page-header_forrester.svg');
    }
    
    /* Network Security theme ribbon */
    #wafmq-ribbon, #wafmq-2020-ribbon, #petsmart-ribbon, #waasmq-ribbon, #appsec-report-2021-ribbon {
        background-image: linear-gradient(to right, #0088CE, #00B5D1);
    }
    
    /* Ransomware ribbon */
    #ransomware-ribbon {
        background-image: linear-gradient(to right, #F06F36, #FDB513);
    }
    
    /* Network Firewalls MQ ribbon */
    #network-firewalls-mq-ribbon {
        background-color: #da291c;
    }
    
    /* HIde on mobile */
    .header-ribbon { 
        /*display: block;*/
        width: 100%;
        position: relative !important;
        height: 55px;
    }
    .header-ribbon-container {
        width: 100%;
        max-width: 1500px;
        margin: 0 auto;
        height: 100%;
    }
    .header-ribbon-container .container {
        position: relative;
    }
    .header-ribbon-container .col-md-12 {
        padding-left: 5px;
    }
    .header-ribbon-container.w-arrow .col-md-12 {
        height: 100%;
    }
    .header-ribbon-container.w-arrow .header-ribbon-msg{
        vertical-align: middle;
        top: 48%;
        position: relative;
        transform: translateY(-50%);
    }
    .header-ribbon-container.w-arrow .header-ribbon-msg a {
        font-size: 1rem;
        font-weight: 600;
    }
    .header-ribbon-arrow {
        background: none;
        width: 10px;
        height: 10px;
        border: 2px solid #fff;
        border-left: none;
        border-bottom: none;
        transform: rotate(45deg);
        transition: all 300ms;
        display: inline-block;
    }
    .header-ribbon-btn {
        background-color: #fff387;
        height: 35px;
        margin: 0 auto;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        animation: background-color ease-in 400ms;
    }
    .header-ribbon-btn:hover {
        background-color: #f7e75d;
    }
    .header-ribbon-msg {
        color: #FFF;
        font-weight: 500;
        font-size: 1rem;
    }
    
    .header-ribbon-msg a{
        color: #FFF;
        font-weight: 600;
    }
    
    .header-ribbon-close {
        color: #FFF;
        right: -5px;
        font-size: 2rem;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
    }
    .header-ribbon-close:hover {
        cursor: pointer;
    }
    
    .super-cta {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 16px;
    }
    
    .super-cta img {
        vertical-align: unset;
        width: 20px;
        height: 16px;
    }
    
    .header-ribbon.no-animation {
        transition: unset !important;
        animation-fill-mode: unset !important;
    }
    
    @media (min-width: 992px) {
        /* Display from ipad pro size */
        .header-wrapper {
            position: relative;
            height: 28px;
        }
        .header-ribbon-container .col-lg-9, .header-ribbon-container .col-lg-10, .header-ribbon-container .col-lg-3, .header-ribbon-container .col-lg-2, .header-ribbon-container .col-lg-1{
            padding-left: 0;
            top: 50%;
            transform: translateY(-50%);
            display: block;
            float: left;
        }
        .header-ribbon {
            height: 55px;
            background-size: 100% auto;
            width: 100%;
            margin: 0;
            opacity: 0;
            z-index: 5;
        }
        .header-ribbon-msg {
            font-size: 1.125rem;
            line-height: 1.1;
            padding-top: 0;
        }
        .header-ribbon-msg{
            margin: 0;
        }
    }
    
    @media (min-width: 1200px) {
        .header-ribbon-msg {
            font-size: 1.25rem;
        }
    }
    
    /* Small devices (tablets, 768px and up) */
    @media (max-width: 767px) {
        .header-ribbon-arrow {
            display: none;
        }
        #spearphishing3-ribbon {
            background-image: linear-gradient(to right, #0088CE, #82C341);
        }
    
        #forrester-ribbon {
            background-image: url('../assets/images/campaign/email_wave/landing-page-header_forrester.jpg');
            background-position: center 27%;
            padding-top: 8px;
            padding-bottom: 8px;
        }
        .header-ribbon-container {
            padding-top: 6px;
            padding-bottom: 8px;
        }
        .header-ribbon-msg {
            padding-top: 0.125rem;
            padding-left: 0;
            margin: 0;
            width: 314px;
            display: inline-block;
            line-height: 20px;
        }
        .header-ribbon-msg a{
            font-size: 1rem;
            font-weight: 500;
            vertical-align: unset;
        }
    }
    
    @media (max-width: 991px) {
        .ribbon-trademark {
            font-size: 1.25rem;
        }
        #covid-19-ribbon,  #covid19-alert-ribbon{
            background: transparent linear-gradient(90deg, #F05336 0%, #FD3016 20%, #FD3919 49%, #FD3016 60%, #FD3919 68%, #FD4A20 72%, #FD6129 78%, #FD7F35 84%, #FEA343 90%, #FECE54 95%, #FFFC66 100%) 0% 0% no-repeat padding-box;
        }
        .super-cta {
            height: 16px;
        }
        .header-ribbon-msg {
            padding-top: 0.25rem;
        }
        .header-ribbon-msg a {
            top: 1px;
            position: relative;
        }
    }
    
    @media (min-width: 768px) and (max-width: 991px) {
        #breadcrumb-container .breadcrumb {
            padding-top: 0;
        }
        .header-ribbon-container {
            padding-top: 18px;
            padding-bottom: 18px;
        }
        .header-ribbon-msg {
            margin: 0;
            width: 100%;
            max-width: 610px;
        }
        .header-ribbon-msg a {
            top: -3px;
        }
    }
    
    @media (min-width: 1366px) {
        #network-firewalls-mq-ribbon {
            background-size: 100% auto;
        }
    }
    
    .news-container {
        margin-bottom: 64px;
    }
    .news-item {
        min-height: 326px;
        background-color: #fff;
        position: relative;
        height: 100%;
        box-shadow: 0px 0px 6px #00000029;
        border-radius: 0px 0px 16px 0px;
    }
    .news-item-img {
        width: 100%;
        height: 150px;
        margin-bottom: 21px;
        background-size: cover;
        background-repeat: no-repeat;
    }
    .news-item-img img {
        max-height: 118px;
    }
    .in-the-news {
        border-top: 3px solid #0088CE;
    }
    .in-the-news .news-item-img{
        height: 150px;
        padding: 20px 20px 0 20px;
        margin-bottom: 18px;
        display: flex;
        align-items: center;
    }
    .in-the-news .news-item-img img {
        max-height: 118px;
        max-width: 100%;
        margin-bottom: 0;
    }
    .news-item.press-release .news-item-img {
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
    }
    .news-item.press-release .news-item-img.default {
        background-size: 90%;
        background-repeat: no-repeat;
        background-position: center;
        border-top: 3px solid #0088CE;
    }
    .news-item-content {
        padding: 0 19px 20px 20px;
        position: relative;
    }
    .news-item-date {
        color: #535353CC;
        font-size: 0.875rem;
        margin-right: 16px;
        position: relative;
        text-transform: uppercase;
    }
    .news-item-tag {
        color: #00000099;
        font-size: 0.75rem;
        letter-spacing: 0.6px;
        background-color: #D4D4D3;
        position: relative;
        padding: 3px 8px;
        border-radius: 3px;
        text-transform: uppercase;
        font-weight: 600;
    }
    .news-items-date-container {
        margin-bottom: 10px;
    }
    .news-item-title {
        font-size: 1.25rem;
        font-weight: 600;
        color: #000;
        margin-bottom: 0;
    }
    .news-item-summary {
        font-size: 1.125rem;
        margin-bottom: 2rem;
    }
    .news-item-detail {
        color: #000;
    }
    .news-item-detail:hover {
        text-decoration: none;
    }
    .news-item-detail:hover .news-item {
        box-shadow: 0 10px 20px rgba(0,0,0,0.2);
    }

    @media (max-width: 767px) {
        .news-container {
            margin-bottom: 18px !important;
        }
        .news-item {
            min-height: unset !important;
        }
        .news-item-content {
            padding-bottom: 36px !important;
            min-height: unset !important;
        }
        .news-item-detail {
            display: none;
        }
    }

    @media (min-width: 768px) and (max-width: 991px) {
        .news-container {
            margin-bottom: 42px !important;
        }
    }

    @media (max-width: 991px) {
        .news-item-date.size-desktop {
            display: none;
        }
        .news-item-date.size-mobile {
            display: block;
        }
    }

    @media (min-width: 992px) {
        .news-item-date.size-desktop {
            display: block;
        }
        .news-item-date.size-mobile {
            display: none;
        }
    }



    .event-each {
        border-top: none !important;
        padding: 0 15px;
        margin-bottom: 3rem;
        display: flex;
        justify-content: center;
    }
    .event-each a {
        color: #000;
    }
    .event-each:hover {
        text-decoration: none;
    }
    .event-each:last-child {
        border-bottom: none !important;
    }
    .event-item-wrapper {
        opacity: 1;
        width: auto;
        position: relative;
        padding: 10px 0;
        margin-bottom: 1rem;
    }
    .event-item-wrapper h3 {
        margin-bottom: 0;
        font-weight: 300;
        font-size: 1.5rem;
        color: #0088CE;
    }
    .event-item-wrapper p {
        letter-spacing: 0.6px;
        color: #00000099;
        text-transform: uppercase;
        opacity: 1;
        font-size: 0.75rem;
        margin-bottom: 0;
        font-weight: 600;
    }
    .event-item-container:hover {
        text-decoration: none;
        box-shadow: 0 10px 20px rgba(0,0,0,0.2);
    }
    .event-item-container {
        box-shadow: 0px 0px 6px #00000029;
        border-radius: 0px 0px 16px 0px;
        opacity: 1;
        padding: 20px 20px 74px 19px;
        border-top: 4px solid #0088D9;
        background-color: #fff;
        box-sizing: border-box;
    }
    .event-title {
        font: normal normal 600 20px/28px Proxima Nova;
        letter-spacing: 0px;
        color: #000000;
        opacity: 1;
    }
    .event-description {
        font-size: 1.125rem;
        margin-bottom: 0;
    }
    .event-cta {
        margin-bottom: 0;
        position: absolute;
        bottom: 20px;
        text-align: left;
        font: normal normal 600 16px/20px Proxima Nova;
        letter-spacing: 0px;
        color: #0088CE;
        text-transform: uppercase;
        opacity: 1;
        line-height: 20px;
    }
    .on-demand-event-item-wrapper {
        position: relative;
        display: flex;
        margin-bottom: 1rem;
        justify-content: left;
    }
    .event-item .video-play-wrapper {
        height: 54px;
        width: 54px;
        position: relative;
        background: #fff;
        border-radius: 50%;
        cursor: pointer;
        box-shadow: 0px 0px 6px #00000029;
        border: 1px solid #D4D4D3;
        margin-bottom: 4px;
        display: inline-block;
        margin: 0 16px 0 0;
        /* margin-right: 16px; */
    }
    .event-item .video-play-text-container {
        margin-left: -1px;
        position: relative;
        width: 200px;
        text-align: center;
        display: flex;
        align-items: center;
    }
    .event-item .video-play-icon {
        position: absolute;
        top: 50%;
        left: 54%;
        transform: translate(-50%,-50%);
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 10px 0 10px 17.3px;
        border-color: transparent transparent transparent #0088CE;
    }
    .event-item .video-play-text {
        font-size: 0.75rem;
        letter-spacing: 0.6px;
        color: #00000099;
        text-transform: uppercase;
        font-weight: 600;
    }
    
    #eventsContainer h2 {
        text-align: left;
        font: normal normal normal 28px/33px "Museo Slab";
        font-weight: 300;
        letter-spacing: 0px;
        color: #000000;
        opacity: 1;
    }



    .temp-menu-top-pos {
        top: 55px !important;
    }
    #temp-ribbon {
        top:0px;
        height: 55px;
        background:blue;
        z-index: 511;
        width: 100%;
        color: white;
        position: sticky;
        background-image: linear-gradient(to right, #0088CE, #82C341);
    }
    #temp-ribbon-content {
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 100%;
    }
    #temp-ribbon-content a {
        color: #FFF;
        padding-right: 15px;
    }
    #temp-header-ribbon-close {
        color: #FFF;
        font-size: 2rem;
        cursor: pointer;
        caret-color: transparent;
    }
    .temp-ribbon-show {
        display: block;
    }
    .temp-ribbon-show + .parallaxtron {
        height: calc(100vh - 55px);
    }
    .temp-ribbon-hide {
        display: none;
    }
    .temp-ribbon-hide + .parallaxtron {
        height: 100vh;
    }
    .regular-ribbon-hide {
        opacity: 0 !important;
        z-index: -1 !important;
    }