/* Модальные окна на чистом CSS, без javascript и дополнительных изображений Копирайт (c) 2014 shurawi http://www.dbmast.ru */
/*** Стили относящиеся к модальному окну и содержанию ***/

/* заголовок 1 */
.popup h1 {color: #787339; text-align: left; text-shadow: 0 1px 3px rgba(0,0,0,.3); font:24px 'Trebuchet MS', Helvetica, sans-serif; font-weight: bold;}
 /* заголовок 2 */
.popup h2 {color: #787339; text-align: left; text-shadow: 0 1px 3px rgba(0,0,0,.3); font:22px 'Trebuchet MS', Helvetica, sans-serif;}

/* Базовые стили слоя затемнения и модального окна  */
.overlay {top: 0; right: 0; bottom: 0; left: 0; z-index: 1; visibility: hidden; /* фон затемнения */ background-color: rgba(0, 0, 0, 0.7); opacity: 0; position:  fixed; /* фиксированное поцизионирование */ cursor: default; /* тип курсара */ -webkit-transition: opacity .5s; -moz-transition: opacity .5s; -ms-transition: opacity .5s; -o-transition: opacity .5s; transition: opacity .5s;}
.overlay:target {visibility: visible; opacity: 1;}
.is-image {top: 0; right: 0; bottom: 0; left: 0; display: block; margin: auto; width: 100%; height: auto; /* скругление углов встроенных картинок */ -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; border-radius: 4px;}
/* встроенные элементы м-медиа, фреймы */
embed, object, iframe {top: 0; right: 0; bottom: 0; left: 0; display:block; margin: auto; min-width: 320px; max-width: 600px; width: 100%;}
/* стили модального окна */
.popup {top: 0; right: 0; left: 0; font-size: 14px; z-index: 10; display: block; visibility: hidden; margin: 0 auto; width: 90%; min-width: 320px; max-width: 800px; /* фиксированное позиционирование, окно стабильно при прокрутке */ position: absolute;/* fixed;*/ padding: 15px; border: 1px solid #383838; /* скругление углов */ -webkit-border-radius: 12px; -moz-border-radius: 12px; -ms-border-radius: 12px; border-radius: 12px; background-color: #FFFFFF; /* внешняя тень */  -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8); -ms-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8); -o-box-shadow: 0 0 6px rgba(0, 0, 0, 0.8); box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.8); /* полная прозрачность окна, появление при клике */ opacity: 0; /* эффект перехода (появление) */ -webkit-transition: all ease .5s; -moz-transition: all ease .5s; -ms-transition: all ease .5s; -o-transition: all ease .5s; transition: all ease .5s; color: #6a6a6a;}
.overlay:target+.popup {/*top: 16px;*/top: auto; margin-top: -20px; visibility: visible; opacity: 1;}
/* формируем кнопку закрытия */
.close {position: absolute; top: -10px; right: -10px; padding: 0; width: 20px; height: 20px; border: 2px solid #CCCCCC; -webkit-border-radius: 15px; -moz-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px; border-radius: 15px; background-color: rgba(61, 61, 61, 0.8); -webkit-box-shadow: 0px 0px 10px #000000; -moz-box-shadow: 0px 0px 10px #000000; box-shadow: 0px 0px 10px #000000; text-align: center; text-decoration: none; font-weight: bold; line-height: 20px; -webkit-transition: all ease .8s; -moz-transition: all ease .8s; -ms-transition: all ease .8s; -o-transition: all ease .8s; transition: all ease .8s;}
.close:before {color: rgba(255, 255, 255, 0.9); content: "X"; text-shadow: 0 -1px rgba(0, 0, 0, 0.9); font-size: 12px;}
.close:hover {background-color: rgba(252, 20, 0, 0.8); -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg);   
}
/*.popup p, .popup div {margin-bottom: 10px; font-size: 0.8em;} */
.popup h4 {font-style: italic; font-weight: normal;}
.popup li {text-align: left !important;}