.svg-custom {
    margin-top: -439px;
}
.svg-size {
    width: 423px;
    height: 407px;
}

.op1 {
    margin-top: -358px;
    left: 768px;
}
.text-topics {
    font-size: 31px;
}

.op2{
    left: 702px;
}

.op3{
    left: 667px;
}

 

@media only screen and (min-device-width: 1200px) and (max-device-width: 1600px) {
    .svg-custom {
        margin-top: -335px;
    }
    .svg-size {
        width: 500px;
        height: 300px;
    }
    .op1 {
        margin-top: -285px;
        left: 768px;
    }
    .text-topics {
        font-size: 21px;
    }
} 

@media only screen   
and (min-device-width : 768px)   
and (max-device-width : 1024px)  { 
    .svg-custom {
        margin-top: -263px;
    }
    .svg-size {
        width: 500px;
        height: 230px;
    }
    .svg-custom {
        margin-top: -251px;
    }
    .svg-size {
        width: 423px;
        height: 217px;
    }
    
    .op1 {
        margin-top: -217px;
        left: 716px;
    }
    .text-topics {
        font-size: 18px;
    }
    
    .op2{
        left: 682px;
    }
    
    .op3{
        left: 627px;
    }
}  


@media(max-width:767px) {
    .svg-custom {
        margin-top: -390px;
    }
    .svg-size {
        width: 500px;
        height: 355px;
    }
}


@media (max-width: 480px) {
    .svg-custom {
        margin-top: -328px;
    }
    .svg-size {
        width: 500px;
        height: 292px;
    }
    .text-topics{
        font-size: 17px;
    }
}


/* 



@media(max-width:767px) {
    .svg-custom {
        margin-top: -390px;
    }
    .svg-size {
        width: 500px;
        height: 355px;
    }
}