@media screen {
    a {
        position: relative;
        --link-color1: var(--bc-black);
        --link-hover-color1: var(--bc-red);
        --link-visited-color1: var(--bc-dark-grey);
    }
    a,
    a:link {
        color: var(--link-color1);
        border-bottom: 1px solid;
    }

    a:visited {
        color: var(--link-visited-color1);
    }

    a:hover, a:active, a:focus {
        color: var(--link-hover-color1);
    }

    figure a,
    #header a {
        border-bottom: none;
        color: #000;
    }

    a.nonclick {
        cursor: default;
    }

    /* NAVIGATION STYLES
    ---------------------*/
    a.sprunglink:link, a.sprunglink:visited {
        position: absolute;
        top: -10000px;
        left: -10000px;
    }

    a.sprunglink:hover, a.sprunglink:active, a.sprunglink:focus {
        top: 1rem;
        left: 33px;
        height: 1.5rem;
        background-color: #ddd;
    }

    #nav-section {
        display: none;
        user-select: none;
    }

}

/* Mobile-landscape (and larger) lansacape */
@media only screen and (min-width: 480px) {
}


/* min-width:768px Tablet-portrait (and larger) */
@media only screen and (min-width: 768px) {

}


/* Tablet-landscape (and larger) for width 960px */
@media only screen and (min-width: 992px) {


}

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

/* min-width:1300 Laptops (and larger) for width 1200px */
@media only screen and (min-width:1200px) {
}



/* Main top Navigation Desktop
--------------------*/
@media screen {
    .js #mainNavi {
        display: none;
    }
}
/* Main top Navigation ends
--------------------*/


/* Header Navigation CB Query
--------------------*/
@media screen {
    #headerNav {
        display: none;
    }

    #headerNav ul {
        display: inline;
        margin: 1rem 0;
    }

    #headerNav li {
        display: inline-block;
        text-transform: uppercase;
        padding-right: 1rem;
        font-weight: 400;
        position: relative;
        font-size: 1.25rem;
    }

    #headerNav a.search-icon:before {
        content: "";
        display: inline-block;
        width: 1rem;
        height: 1.2rem;
        margin-right: 0.25rem;
        background-size: contain;
        background-position: left bottom;
        background-repeat: no-repeat;
        background-image: url(../images/icons/search.svg);
    }

    #headerNav a:hover {
        color: var(--bc-red);
    }

}

/* Mobile-landscape (and larger) lansacape */
@media only screen and (min-width: 480px) {
}


/* min-width:768px Tablet-portrait (and larger) */
@media only screen and (min-width: 768px) {
    #headerNav {
        display: block;
        margin-bottom: 0;
        line-height: 3rem;
    }
}


/* Tablet-landscape (and larger) for width 992px */
@media only screen and (min-width: 992px) {
}

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

/* min-width:1300 Laptops (and larger) for width 1300px */
@media only screen and (min-width:1300px) {
}
/* Header Side Navigation  ends
--------------------*/

/* Footer Navigation CB Query
--------------------*/
@media screen {
    .footerNavi {
    }

    .footerNavi ul.level_1 {
        margin: 0;
    }

    .footerNavi li {
        margin-bottom: 1rem;
        font-weight: 700;
    }

    .footerNavi a {
        letter-spacing: 0;
        border: none;
        color: #000;
    }

    .footerNavi a:hover {
        color: var(--theme-color1)
    }


    .footerNavi a.pressure-icon,
    .footerNavi a.cloudex-icon {
        background-color: chartreuse;
        display: block;
        visibility: hidden;
    }


    .footerNavi a.pressure-icon:after,
    .footerNavi a.cloudex-icon:after {
        content: "";
        width: 100%;
        height: 1.1rem;
        display: inline-block;
        visibility: visible;
        position: absolute;
        top: 0;
        left: 0;
        background-size: contain;
        background-position: left center;
        background-repeat: no-repeat;
        background-image: url(../../content/Images/logos/Pressurewave.svg);
    }


    .footerNavi a.cloudex-icon:after {
        background-image: url(../../content/Images/logos/CloudEx.svg);
    }

}

/* min-width:768px Tablet-portrait (and larger) */
@media only screen and (min-width: 768px) {

    .footerNavi li {
        margin-bottom: 2rem;
    }
}

/* Footer Navigation ends
--------------------*/






/* Link-arrow Query
In TinyMCE:
First set to link to text, then apply style class
<span><a></a></span>
--------------------*/
@media screen {
    a.link-arrow,
    .link-arrow a {
        display: inline-block;
        border: none;
        margin-top: 0.5rem;
        font-weight: 700;
        margin-right: 2rem;
        color: #000;
    }

    a.link-arrow:hover,
    .link-arrow a:hover,
    .link-arrow a:hover span {
        color: var(--bc-red);
    }

    .link-arrow a:after {
        content: "";
        display: inline-block;
        margin-left: 0.5rem;
        width: 1.5rem;
        height: 1rem;
        transition: all 0.4s cubic-bezier(.25,.1,.25,1);
        background-image: url(../images/icons/arrow-right.svg);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
        position: absolute;
        top: 0.4rem;
        right: -2rem;
    }

    .hovered .link-arrow a:after,
    .link-arrow a:hover:after {
        margin-left: 1rem;
        right: -2.5rem;
    }

}
/* Link-arrow ends
--------------------*/


/* Link-Button Query
--------------------*/
@media screen {

    .back a,
    a.link-button-red,
    .link-button-red a,
    a.link-button,
    .link-button a {
        cursor: pointer;
        display: inline-block;
        user-select: none;
        background: transparent;
        background: #fff;
        padding: 0.25rem 2rem;
        border: 0px solid #fff;
        color: var(--bc-red);
        font-weight: 700;
        transition: var(--transition);
    }

    a.link-button-red:visited,
    .link-button-red a:visited,
    a.link-button:visited,
    .link-button a:visited{

    }

    a.link-button-red,
    .link-button-red a {
        display: block;
        padding: 1rem 2rem;
        background: var(--bc-red);
        border: none !important;
        color: #fff;
    }

    a.link-button:hover,
    .link-button a:hover {
        background: var(--bc-bg-grey);
        color: #000;
    }


    a.link-button-red:hover,
    .link-button-red a:hover {
        color: #000;
        background: var(--bc-bg-grey);
    }


    .back a {
        margin-top: 1.5rem;
    }

    .back a:hover {
        color: var(--bc-red);
    }

    .more.link-button {
        white-space: nowrap;
    }

}

/* Mobile-landscape (and larger) lansacape */
@media only screen and (min-width: 480px) {
}


/* min-width:768px Tablet-portrait (and larger) */
@media only screen and (min-width: 768px) {
}


/* Tablet-landscape (and larger) for width 992px */
@media only screen and (min-width: 992px) {
    .back a,
    a.link-button-red,
    .link-button-red a,
    a.link-button,
    .link-button a {
        padding: 0.65rem 3rem;
    }

    a.link-button-red,
    .link-button-red a {
        padding: 1.5rem 2rem;
    }
}

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

/* min-width:1300 Laptops (and larger) for width 1300px */
@media only screen and (min-width:1300px) {
}
/* Link-Button ends
--------------------*/