/*Designed for the long haul*/

.Design {
    position: relative;
    background: url('/library/assets/products/xs3800/Design-HW-1920px.png') no-repeat center center;
    height: 800px;
    background-size: cover;
}

@media only screen and (max-width:1367px) {
    .Design {
        height: 600px;
    }
}

@media only screen and (max-width:800px) {
    .Design {
        position: relative;
        background: url('/library/assets/products/xs3800/Design-HW-600px.png') no-repeat center center;
        height: 1000px;
        background-size: cover;
    }
}

@media only screen and (max-width:450px) {
    .Design {
        position: relative;
        background: url('/library/assets/products/xs3800/Design-HW-600px.png') no-repeat center center;
        height: 450px;
        background-size: cover;
    }
}

.DesignCnt {
    position: absolute;
    height: 100%;
    width: 45%;
    top: 5%;
    left: 5%;
    padding: 25px;
}

@media only screen and (max-width:800px) {
    .DesignCnt {
        position: absolute;
        height: 100%;
        width: 49%;
        top: 5%;
        left: 0%;
        padding: 5px;
    }
}

.Design .fa-plus-circle {
    color: #ff8900;
    font-size: 30px;
    animation: pulse 1s infinite;
    background: #fff;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: block;
    text-align: center;
    padding: 0px;
}


@media only screen and (max-width: 450px) {
    .Design .fa-plus-circle {
        color: #ff8900;
        font-size: 20px;
        animation: pulse 3s infinite;
        background: #fff;
        border-radius: 50%;
        width: 22px;
        height: 22px;
        display: block;
        text-align: center;
        padding: 1px;
    }
}

/* new210ax */

.Design-nwa210ax-Smart-fan {
    position: absolute;
    top: 30%;
    left: 75%;

}

.Design-nwa210ax-solid-capacitor {
    position: absolute;
    top: 45%;
    left: 35%;
}

.Design-nwa210ax-power {
    position: absolute;
    top: 55%;
    left: 20%;
}

.Design-nwa210ax-capacity {
    position: absolute;
    top: 60%;
    left: 40%;

}

.Design-nwa210ax-ESD {
    position: absolute;
    top: 60%;
    left: 75%;

}

.Design-nwa210ax-Thermal {
    position: absolute;
    top: 35%;
    left: 40%;
}

.Design-nwa210ax-Antenna {
    position: absolute;
    top: 40%;
    left: 80%;
}

@media only screen and (max-width: 1025px) {
    .Design-nwa210ax-Smart-fan {
        position: absolute;
        top: 30%;
        left: 65%;

    }

    .Design-nwa210ax-solid-capacitor {
        position: absolute;
        left: 25%;
    }

    .Design-nwa210ax-power {
        position: absolute;
        top: 55%;
    }

    .Design-nwa210ax-ESD {
        position: absolute;
        top: 60%;
        left: 65%;
    }

}

@media only screen and (max-width: 991px) {
    .Design-nwa210ax-Smart-fan {
        position: absolute;
        top: 60%;
        left: 10%;

    }

    .Design-nwa210ax-power {
        position: absolute;
        top: 60%;
        right: 175%;
    }

    .Design-nwa210ax-solid-capacitor {
        position: absolute;
        top: 55%;
        right: 175%;
    }

    .Design-nwa210ax-Thermal {
        position: absolute;
        top: 10%;
        left: 160%;
    }
}


@media only screen and (max-width: 800px) {
    .Design-nwa210ax-Smart-fan {
        position: absolute;
        top: 70%;
        left: 55%;

    }

    .Design-nwa210ax-ESD {
        position: absolute;
        top: 70%;
        left: 110%;
    }

    .Design-nwa210ax-power {
        position: absolute;
        top: 52%;
        left: 188%;
    }

    .Design-nwa210ax-solid-capacitor {
        position: absolute;
        top: 45%;
        left: 165%;
    }

    .Design-nwa210ax-Thermal {
        position: absolute;
        top: 10%;
        left: 170%;
    }
}


@media only screen and (max-width: 450px) {
    .Design-nwa210ax-Smart-fan {
        position: absolute;
        top: 68%;
        left: 50%;
    }

    .Design-nwa210ax-power {
        position: absolute;
        top: 50%;
        left: 170%;
    }

    .Design-nwa210ax-solid-capacitor {
        position: absolute;
        top: 40%;
        left: 135%;
    }

    .Design-nwa210ax-Thermal {
        position: absolute;
        top: 10%;
        left: 160%;
    }
}


@media only screen and (max-width: 350px) {
    .Design-nwa210ax-Smart-fan {
        position: absolute;
        top: 70%;
        left: 45%;

    }

    .Design-nwa210ax-power {
        position: absolute;
        top: 50%;
        left: 190%;
    }

    .Design-nwa210ax-solid-capacitor {
        position: absolute;
        top: 45%;
        left: 145%;
    }

    .Design-nwa210ax-Thermal {
        position: absolute;
        top: 10%;
        left: 160%;
    }
}

/* new210ax END */

.popover {
    max-width: 450px !important;
}

.popover-title {
    padding: 10px;
    margin: 0;
    font-size: 14px;
    border-bottom: 0px;
    border-radius: 15px;
    background-color: transparent;
    box-shadow: none;
}


.fade.in {
    opacity: 0.9;
}

.popover.right>.arrow {
    display: none;
}

.popover.left>.arrow {
    display: none;
}


.popover {
    background-color: #ffa133;
    border: 0px;
    width: 300px;
    border-radius: 15px;
}

.popover-content {
    padding: 0px;
}



.popover.left>.arrow:after {
    right: 1px;
    bottom: -10px;
    content: " ";
    border-right-width: 0;
    border-left-color: #ffa133;
}

.popover.right>.arrow:after {
    bottom: -10px;
    left: 1px;
    content: " ";
    border-right-color: #ffa133;
    border-left-width: 0;
}

.Designreliableimagebanner {
    max-width: 1000px !important;
    border-radius: 10em;
}


@media only screen and (max-width: 1025px) {
    .Designreliableimagebanner {
        max-width: 750px !important;
    }
}

.Designreliableimage {
    max-width: 100px !important;
    padding-bottom: 10px;
}

@media only screen and (max-width: 1025px) {
    .Designreliableimage {
        max-width: 100px !important;
    }
}

/*Designed for the long haul END*/


.pinkBg {
    background-color: rgba(255, 255, 255, .7);
    /*     background-image: linear-gradient(90deg, #fd5581, #fd8b55); */
}

.intro-banner-vdo-play-btn {
    height: 30px;
    width: 30px;
    position: absolute;
    top: 50%;
    left: 50%;
    text-align: center;
    margin: -30px 0 0 -30px;
    border-radius: 100px;
    z-index: 1
}

.intro-banner-vdo-play-btn i {
    /*     line-height:56px; */
    font-size: 28px;
    padding: 1px;
    color: #ff8900;
}

.intro-banner-vdo-play-btn .ripple {
    position: absolute;
    width: 100px;
    height: 100px;
    z-index: -1;
    left: 50%;
    top: 50%;
    opacity: 0;
    margin: -50px 0 0 -50px;
    border-radius: 100px;
    -webkit-animation: ripple 1.8s infinite;
    animation: ripple 1.8s infinite
}

@-webkit-keyframes ripple {
    0% {
        opacity: 1;
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes ripple {
    0% {
        opacity: 1;
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.intro-banner-vdo-play-btn .ripple:nth-child(2) {
    animation-delay: .3s;
    -webkit-animation-delay: .3s
}

.intro-banner-vdo-play-btn .ripple:nth-child(3) {
    animation-delay: .6s;
    -webkit-animation-delay: .6s
}


