/* Responsive */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    
}
/* Responsive */

@media only screen and (max-width: 1450px) {
   
}/*  (max-width: 1450px) */

@media only screen and (max-width: 1260px) {

    .joinFormContainer {
        padding: 60px 30px 50px 30px;
    }
    
    .backModal {
        left: 20px;
        top: 20px;
        width: 35px;
    }
    
    .backModal img {
        max-width: 100%;
    }

    div#Holdings .apexcharts-canvas .apexcharts-legend.apexcharts-align-center {
        width: 150px;
    }

    div#Holdings g.apexcharts-pie {
        transform: scale(.85) translate(-4%);
    }

} /*  (max-width: 1260px) */

@media only screen and (max-width: 1025px) {

    
    div#Holdings g.apexcharts-pie {
        transform: scale(.8) translate(-5%);
    }

    .confirmationCont h2,
    .joinForm> h2,
    .heroContent h1, .titleContent h2 {
        font-size: 44px;
    }
    
    .confirmationCont p,
    .joinForm> p,
    .heroContent p, 
    .titleContent p, 
    .featureTradCol p {
        font-size: 18px;
    }
    
    section.heroArea {
        padding: 56px 0 95px;
    }
    
    .featureTradCol h3 {
        font-size: 26px;
    }
    
    .performanceWidget h3 {
        font-size: 20px;
    }
    
    section.tradingArea {
        padding: 120px 0 80px;
    }

    .joinSidebar {
        width: 250px;
    }

} /*  (max-width: 1025px) */

@media only screen and (max-width: 1199px) {
    
} /* (max-width: 1199px) */

@media only screen and (min-width: 768px) and (max-width: 991px) {

} /*  (min-width: 768px) and (max-width: 991px) */

@media only screen and (max-width: 991px) {
    
    div#Holdings g.apexcharts-pie {
        transform: unset;
    }

}/*and (max-width: 991px)*/
    
@media only screen and (min-width: 426px) and (max-width: 767px) {
   
} /* (min-width: 426px) and (max-width: 767px) */
      
@media only screen and (max-width: 767px) {

    .confirmationCont {
        padding: 20px 20px;
    }
    
    .confirmationCont> img {
        display: block;
        width: 80px;
        margin: 0 auto;
        margin-bottom: 20px;
    }
    

    .joinSidebar {
        display: none;
    }
    
    .joinForm {
        margin: 0 auto;
    }
    
    .joinFormContainer {
        padding: 70px 20px 50px 20px;
    }
    
    .joinForm> p {
        margin: 10px 0 20px 0;
    }
    
    .joinForm form {
        gap: 15px;
    }
    
    .inputCol input {
        height: 50px;
    }

    .joinForm> h2, .confirmationCont h2,
    .heroContent h1, .titleContent h2 {
        font-size: 26px;
    }
    
    video.loopVideo {
        margin: 0 auto 20px auto;
    }
    
    section.heroArea {
        padding: 40px 0 50px;
    }
    
    .heroContent p, .titleContent p, .featureTradCol p {
        font-size: 16px;
    }
    
    section.tradingArea {
        padding: 90px 0 90px;
    }
    
    .featureTradCol {
        padding: 30px 20px;
    }
    
    .container {
        padding: 0 20px;
    }
    
    .featureTradCol h3 {
        font-size: 22px;
    }
    
    section.performanceArea {
        padding: 70px 0 70px;
    }
    
    .titleContent h2 {
        margin-bottom: 10px;
    }
    
    .chartBox {
        padding: 20px 15px;
    }
    
    .performanceWidget {
        padding: 15px;
    }
    
    section.performanceArea .row {
        gap: 15px 0px;
    }
    
    .chartBox h3 {
        font-size: 18px;
    }

    p.errorMessage {
        transform: unset;
        left: 0;
        top: 100%;
    }

    .inputCol.error_input {
        margin-bottom: 16px;
    }

    footer.footerArea {
        padding: 20px 0px 30px 0px;
    }

    
}/* and (max-width: 767px) */
       
@media only screen and (max-width: 575px) {

    div#Holdings .apexcharts-canvas .apexcharts-legend.apexcharts-align-center {
        width: 150px;
        gap: 5px;
    }

    div#Holdings .apexcharts-canvas .apexcharts-legend.apexcharts-align-center {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
    
    div#Holdings .apexcharts-canvas .apexcharts-legend.apexcharts-align-center .apexcharts-legend-series .apexcharts-legend-text {
        width: 120px;
    }

} /* (max-width: 575px) */
    
@media only screen and (min-width: 320px) and (max-width: 425px) {
	
}     /*  (min-width: 320px) and (max-width: 425px) */

@media only screen and (max-width: 480px) {

} /* (max-width: 480px) */
      
@media only screen and (max-width: 360px) {

} /* (max-width: 360px)  */
   