 <style>
/* Контейнер для кнопки */
.css-modal-checkbox-container {
 height: 30px;
 display:flex;
 align-items:center;
 justify-content:center;
}
/* Убираем флажок */
#css-modal-checkbox {
 display: none;
}
/* Кнопка для открытия */
.css-modal-checkbox {
 display: inline-flex;
 margin: 10px;
 text-decoration: none;
 position: relative;
 font-size: 20px;
 line-height: 30px;
 padding: 12px 30px;
 color: #FFF;
 font-weight: bold;
 text-transform: uppercase;
 font-family: 'Roboto', Тahoma, sans-serif;
 background: #003e52;
 cursor: pointer;
 border: 2px solid #BFE2FF;
 border-radius: 0px;
 overflow: hidden;
 z-index: 1; 
}
.css-modal-checkbox:hover,
.css-modal-checkbox:active,
.css-modal-checkbox:focus {
 color: #FFF;
}
.css-modal-checkbox:before {
 content: '';
 position: absolute;
 top: 0;
 right: -50px;
 bottom: 0;
 left: 0;
 border-right: 50px solid transparent;
 border-top: 100px solid #bc2f2c;
 transition: transform 0.5s;
 transform: translateX(-100%);
 z-index: -1;
}
.css-modal-checkbox:hover:before,
.css-modal-checkbox:active:before,
.css-modal-checkbox:focus:before {
 transform: translateX(0);
}
 
 

/* Модал окно */
.modalDialog {
 position: fixed;
 font-family: font-family, Helvetica, sans-serif;
 top: -130px;
 right: 0;
 bottom: 0;
 left: 0;
 
 z-index: 99999;
 -webkit-transition: opacity 300ms ease-in;
 -moz-transition: opacity 300ms ease-in;
 transition: opacity 300ms ease-in;
 display: none;
 pointer-events: none;
 
}


.modalDialog:target { 
 display: block; 
 pointer-events: auto; 
} 
.modalDialog > div { 
 width: 100%; 
 height: 100%;
 position: relative; 
 margin: 10% auto; 
 padding: 5px 20px 13px 20px; 
 border-radius: 10px; 
 background: #fff; 
 background:#ffffff;
 background:#ffffff;
 background:#ffffff;
}


.close { 
 background: #606061; 
 color: #FFFFFF; 
 line-height: 41px; 
 position: absolute; 
 right: 10px; 
 text-align: center; 
 top: 93px; 
 width: 40px; 
 text-decoration: none; 
 font-weight: bold; 
 -webkit-border-radius: 12px; 
 -moz-border-radius: 12px; 
 border-radius: 3px; 
 -moz-box-shadow: 1px 1px 3px #000; 
 -webkit-box-shadow: 1px 1px 3px #000; 
 box-shadow: 1px 1px 3px #000; 
 z-index: 3;
} 
.close:hover { background: #003e52; }

</style>