@media all and (max-width: 430px) { /*Mobile*/
    .od-ct-modal .product-details-page .product-name{margin-top:0px}
    .od-ct-modal .product-details-page .product-name h1{font-size:18px !important}
    .od-ct-modal .modal-content {width: 90% !important}
    .od-ct-modal .gallery.sevenspikes-cloudzoom-gallery{width:50%;text-align:center;margin:0 auto}
}
@media all and (max-width: 768px) { /*Tablet*/
    .od-ct-modal .modal-content{margin:15% auto}
}
@media all and (min-width: 1024px) { /*Desktop*/
    .od-ct-modal .modal-content {margin: 3% auto}
}
.od-ct-modal {display: none;position: fixed;z-index: 9999;left: 0;top: 0;width: 100%;height: 100%;overflow: auto;background-color: rgb(0,0,0);background-color: rgba(0,0,0,0.4)}
.od-ct-modal__title{font-size: 20px;margin-top: 10px;font-weight:400;color:#000}
.od-ct-modal .modal-content {position: relative;background-color: #fefefe;padding: 0;border: 1px solid #888;width: 80%;box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);animation-name: animatetop;animation-duration: 0.4s}
.od-ct-modal .modal-content .modal-header {padding: 2px 16px 12px;position: sticky;top: 0px;background-color: #fff;border-bottom: 1px solid #eee;z-index: 101}
.od-ct-modal .modal-content .modal-header h2 {font-size: 20px;margin-top: 10px;font-weight: lighter;}
.od-ct-modal .modal-content .modal-header .close {color: #000;float: right;font-size: 28px;font-weight: lighter;}
.od-ct-modal .modal-content .modal-header .close:hover, .close:focus {color: black;text-decoration: none;cursor: pointer;}
.od-ct-modal .modal-content .od-ct-modal-body {padding: 10px 16px 16px}
.od-ct-modal .od-ct-modal__items {font-size: 13px;font-weight: 300;padding-top: 3px;display:block;color:#000}
@keyframes animatetop {from {top: -300px;opacity: 0} to {top: 0;opacity: 1}}