/* 

widths for popup
popsize-sm
popsize-md
popsize-lg
popsize-xsm

width: 425px;
width: 350px;
width: 300px;
width: 250px;
*/


[class^="popsize-"], [class*=" popsize-"] {
    display: block; 
    margin: auto;
}

.popsize-xsm {
    width: 250px;
}
.popsize-sm {
    width: 300px;
}
.popsize-md {
    width: 350px;
}
.popsize-lg {
    width: 425px;
}
.popsize-xlg {
    width: 485px;
}

@media (min-width: 1281px) {
    /* CSS */
    .popsize-xsm {
        width: 250px;
    }
    .popsize-sm {
        width: 300px;
    }
    .popsize-md {
        width: 350px;
    }
    .popsize-lg {
        width: 685px;
    }
    .popsize-xlg {
        width: 980px;
    }
  }
  


  @media (min-width: 1025px) and (max-width: 1280px) {
    /* CSS */
    .popsize-xsm {
        width: 250px;
    }
    .popsize-sm {
        width: 300px;
    }
    .popsize-md {
        width: 350px;
    }
    .popsize-lg {
        width: 650px;
    }
    .popsize-xlg {
        width: 720px;
    }
    
  }
  
  @media (min-width: 768px) and (max-width: 1024px) {
    
    /* CSS */
    .popsize-xsm {
        width: 250px;
    }
    .popsize-sm {
        width: 400px;
    }
    .popsize-md {
        width: 450px;
    }
    .popsize-lg {
        width: 600px;
    }
    .popsize-xlg {
        width: 755px;
    }
    
  }
  

  @media (min-width: 591px) and (max-width: 767px) {
    /* CSS */
    .popsize-xsm {
        width:280px;
    }
    .popsize-sm {
        width:380px;
    }
    .popsize-md {
        width: 450px;
    }
    .popsize-lg {
        width: 510px;
    }
    .popsize-xlg {
        width: 576px;
    }
    
  }

  @media (min-width: 481px) and (max-width: 590px) {
    /* CSS */
    .popsize-xsm {
        width:280px;
    }
    .popsize-sm {
        width:340px;
    }
    .popsize-md {
        width: 380px;
    }
    .popsize-lg {
        width: 450px;
    }
    .popsize-xlg {
        width: 472px;
    }
    
  }
  

  @media (min-width: 320px) and (max-width: 360px) {
    
    /* CSS */
    .popsize-xsm {
        width:260px;
    }
    .popsize-sm {
        width: 315px;
    }
    .popsize-md {
        width: 315px;
    }
    .popsize-lg {
        width: 315px;
    }
    .popsize-xlg {
        width: 315px;
    }
    
  }

  @media (min-width: 360px) and (max-width: 480px) {
    
    /* CSS */
    .popsize-xsm {
        width:290px;
    }
    .popsize-sm {
        width: 330px;
    }
    .popsize-md {
        width: 350px;
    }
    .popsize-lg {
        width: 350px;
    }
    .popsize-xlg {
        width: 354px;
    }
    
  }



  @media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
    /* .popsize-xsm {
        width:350px;
    }
    .popsize-sm {
        width: 400px;
    }
    .popsize-md {
        width: 480px;
    }
    .popsize-lg {
        width:540px;
    }

    .popsize-xlg {
        width: 560px;
    } */
    
  }