.pizza_modal_cart { display: block; /* Hidden by default */ position: fixed; /* Stay in place */ z-index: 100; /* Sit on top */ left: 0; top: 0; width: 100%; /* Full width */ height: 100%; /* Full height */ overflow: auto; /* Enable scroll if needed */ background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ .dialog { /* Modal Content */ .content { background: #F7F7F7; margin: auto; @media (max-width:760px) { height: 100vh; margin: 0 auto; } @media (min-width:780px) { height: 100vh; min-height: 600px; width: 430px; position: absolute; right: 0; left: unset !important; } .button_close{ @media (max-width:760px) { right: 20px; position: absolute; font-size: 30px; top: 10px; } @media (min-width:780px) { right: 450px; position: absolute; font-size: 40px; top: 45%; } svg{ @media (max-width:760px) { fill: #000000; } @media (min-width:780px) { fill: #fff; } } svg:hover{ transform: scale(1.2); } } .header{ width: 100%; height: 49px; padding: 15px; background-color: #FFFFFF; } .body{ @media (max-width:760px) { height: calc(100vh - 290px); overflow-y: scroll; } @media (min-width:780px) { height: calc(100vh - 690px); width: 100%; } } .body_order{ width: 100%; /*height: 70%;*/ position: relative; overflow-y: scroll; @import './product_box.scss'; } .body_additionally{ width: 100%; position: relative; @import './additionally.scss'; } .body_additionally_text{ font-size: 18px; line-height: 21px; letter-spacing: 0.02em; padding: 10px; } .basket_footer{ position: inherit; bottom: 0; width: 100%; background-color: #FFFFFF; margin-bottom: 10px; .promo_code_box{ flex: none; padding: 5px; order: 0; flex-grow: 1; margin: 0px 12px; border-bottom: 1px dashed #8E8E93; .input{ border: none; margin: 0; outline: none; -webkit-appearance: none; color: #252A48; font-size: 18px; height: 38px; } .button{ border: none; margin: 0; padding: 0; font-size: 18px; line-height: 30px; color: #1C80E3; cursor: pointer; transition: color .2s; &:hover{ color: lighten(#000000, 10%); } } } .check{ font-size: 18px; line-height: 28px; padding: 0px 0px 0px 15px; margin-bottom: 15px; border-bottom: 1px dashed #8E8E93; .box{ display: flex; margin-top: 6px;; .text{ right: 30px; position: absolute; } } } } } } }