.modal { 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 */ } body .modal { overflow: hidden; } /* Modal Content */ .modal_content { background-color: #fefefe; margin: auto; border: 1px solid #888; } .modal_body{ height: 100%; flex-wrap: wrap; display: flex; } .modal_img{ text-align: center; height: 100%; display: grid;; justify-content: center; /*Центрирование по горизонтали*/ align-items: center; /*Центрирование по вертикали */ } .modal_dialog{ margin: 0 auto; } .modal_footer{ display: table; margin: 0 auto; } .modal_title{ font-family: 'Rubik'; font-style: normal; font-weight: 400; font-size: 20px; line-height: 24px; letter-spacing: 0.02em; color: #252A48; margin: 10px 10px 10px 15px; } .modal_feature{ font-family: 'Rubik'; font-style: normal; font-weight: 400; font-size: 13px; line-height: 15px; letter-spacing: 0.02em; margin: 10px 10px 10px 15px; color: #8E8E93; } .modal_description{ font-family: 'Rubik'; font-style: normal; font-weight: 400; font-size: 13px; line-height: 15px; letter-spacing: 0.02em; color: #252A48; margin: 10px 10px 10px 15px; } /* The Close Button */ .close { color: #aaaaaa; float: right; font-size: 28px; font-weight: bold; } .close:hover, .close:focus { color: #000; text-decoration: none; cursor: pointer; }