﻿@media only screen and (max-width: 1000px) and (min-width: 200px){
    .ig {
        max-width: 100%;
        height: auto;
    }
    .iq-software-demo {
        left: 0px;
    }
}
@media (min-width: 768px) {
    .lg-2 {
        flex: 0 0 20% !important;
        max-width: 20% !important;
    }
}
@media only screen and (max-width: 1400px) and (min-width: 1280px) {
    .iq-software-demo {
        top: 265px;
    }
}
@media only screen and (max-width: 1800px) and (min-width: 1000px) {

}
.vi img {
    width: 120px;
    height: auto;
}
@media only screen and (max-width: 800px) and (min-width: 200px) {
    .a,.a1, .a2, .a3, .a4, .a5, .a6, .a7, .a8, .a9, .a10, .a11, .a12, .a13, .a14, .a15, .a16, .a17, .a18, .a19 {
        display: none;
    }
}
.v {
    margin-bottom: 60px !important;
    text-align: center;
    align-items: center;
    justify-content: center;
    display: flex;
}

.a {
    top: 25px;
    width: 180px;
    height: 140px;
    left: 39%;
    position: absolute;
    border-radius: 100%;
}
.a2 {
    top: 66px;
    width: 175px;
    height: 100px;
    position: absolute;
    left: 68%;
    border-radius: 100%;
}
.a1 {
    top: 59px;
    width: 200px;
    height: 100px;
    position: absolute;
    left: 6%;
    border-radius: 100%;
}
.a3 {
    top: 34.5%;
    width: 165px;
    height: 60px;
    position: absolute;
    left: 46%;
    border-radius: 100%;
}
.a4 {
    top: 36.5%;
    width: 230px;
    height: 60px;
    position: absolute;
    left: 22%;
    border-radius: 100%;
}
.a5 {
    top: 53.5%;
    width: 226px;
    height: 60px;
    position: absolute;
    left: 20%;
    border-radius: 100%;
}
.a6 {
    top: 53.5%;
    width: 150px;
    height: 60px;
    position: absolute;
    left: 57%;
    border-radius: 100%;
}
.a7 {
    top: 40%;
    width: 225px;
    height: 100px;
    position: absolute;
    border-radius: 100%;
    left: 5%;
}
.a8 {
    top: 43%;
    width: 190px;
    height: 100px;
    position: absolute;
    border-radius: 100%;
    left: 80%;
}
.a9 {
    top: 67%;
    width: 239px;
    height: 140px;
    position: absolute;
    border-radius: 100%;
    left: 82%;
}
.a10 {
    top: 70%;
    width: 237px;
    height: 140px;
    position: absolute;
    border-radius: 100%;
    left: -3%;
}
.a11 {
    top: 86.5%;
    width: 252px;
    height: 90px;
    position: absolute;
    border-radius: 100%;
    left: 20%;
}
.a12 {
    top: 91.5%;
    width: 150px;
    height: 60px;
    position: absolute;
    border-radius: 100%;
    left: 60%;
}
.a13 {
    top: 110.5%;
    width: 220px;
    height: 100px;
    position: absolute;
    border-radius: 100%;
    left: 69%;
}
.a14 {
    top: 110.5%;
    width: 221px;
    height: 98px;
    position: absolute;
    border-radius: 100%;
    left: 2%;
}
.a15 {
    top: 121.5%;
    width: 164px;
    height: 75px;
    position: absolute;
    border-radius: 100%;
    left: 34%;
}
.a16 {
    top: 117.5%;
    width: 163px;
    height: 86px;
    position: absolute;
    border-radius: 100%;
    left: 46%;
}
.a17 {
    top: 134%;
    width: 240px;
    height: 80px;
    position: absolute;
    border-radius: 100%;
    left: 63%;
}
.a18 {
    top: 134%;
    width: 205px;
    height: 80px;
    position: absolute;
    border-radius: 100%;
    left: 6%;
}
.a19 {
    top: 141%;
    width: 227px;
    height: 140px;
    position: absolute;
    border-radius: 100%;
    left: 35%;
}

.a span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}
.a:hover span{
    display:block;

}

.a1 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a1:hover span {
    display: block;
}

.a2 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a2:hover span {
    display: block;
}

.a3 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a3:hover span {
    display: block;
}

.a4 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a4:hover span {
    display: block;
}

.a5 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a5:hover span {
    display: block;
}

.a6 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a6:hover span {
    display: block;
}

.a7 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a7:hover span {
    display: block;
}

.a8 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a8:hover span {
    display: block;
}

.a9 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a9:hover span {
    display: block;
}

.a10 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a10:hover span {
    display: block;
}

.a11 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a11:hover span {
    display: block;
}

.a12 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a12:hover span {
    display: block;
}

.a13 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a13:hover span {
    display: block;
}

.a14 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a14:hover span {
    display: block;
}

.a15 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a15:hover span {
    display: block;
}

.a16 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a16:hover span {
    display: block;
}

.a17 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a17:hover span {
    display: block;
}

.a18 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a18:hover span {
    display: block;
}

.a19 span {
    display: none;
    position: absolute;
    top: -51%;
    z-index: 5;
    max-width: 100%;
    padding: .5rem;
    font-size: 15px;
    line-height: 20px;
    text-transform: uppercase;
    color: #fff;
    background-color: rgba(0, 78, 146, 0.8);
    border-radius: .2rem;
}

.a19:hover span {
    display: block;
}
.iq-objects-software .iq-objects-03 {
    position: absolute;
    top: 0%;
    left: 10%;
    border: 40px solid #004e92;
    border-radius: 900px;
    height: 500px;
    width: 500px;
}
@media screen and (max-width: 1480px) {
    .iq-software-demo {
        position: absolute;
        top: 50%;
        width: 700px;
        height: auto;
        left: 50%;
        margin-left: -350px;
        margin-top: -360px;
    }

    .iq-objects-software .iq-objects-03 {
        position: absolute;
        top: 0%;
        left: 60px;
        border: 40px solid #004e92;
        border-radius: 900px;
        height: 600px;
        width: 600px;
    }
}

@media screen and (max-width: 1366px) {
    .iq-software-demo {
        position: absolute;
        top: 50%;
        width: 600px;
        height: auto;
        left: 50%;
        margin-left: -300px;
        margin-top: -290px;
    }

    .iq-objects-software .iq-objects-03 {
        position: absolute;
        top: 0%;
        left: 60px;
        border: 40px solid #004e92;
        border-radius: 900px;
        height: 550px;
        width: 550px;
    }
}


@media screen and (max-width: 1280px) {
    .iq-software-demo {
        position: absolute;
        top: 50%;
        width: 550px;
        height: auto;
        left: 50%;
        margin-left: -275px;
        margin-top: -290px;
    }
    .iq-objects-software .iq-objects-03 {
        position: absolute;
        top: 0%;
        left: 60px;
        border: 40px solid #004e92;
        border-radius: 900px;
        height: 500px;
        width: 500px;
    }

}

@media screen and (max-width: 991px) {
    .iq-objects-software {
        position: inherit;
        /* left: 0; */
        top: 20px;
        display: inline-block;
        /* width: 100%; */
        /* height: 70%; */
        /* z-index: -1; */
        height: 500px;
    }
    .iq-software-demo {
        position: absolute;
        top: 0;
        width: 100%;
        /* height: auto; */
        left: 0;
        margin-left: 0;
        margin-top: 0;
    }
    .iq-objects-software .iq-objects-03 {
        position: absolute;
        top: 0%;
        left: 0;
        border: 40px solid #004e92;
        border-radius: 100%;
        height: 100%;
        width: 100%;
    }
}