	/* стили для работы CristallBox */
	/* экран, заслоняющий страницу */
#ekranBlock { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0; z-index:1000;}	
#ekranBlock.act { display:block; }
#ekranBlock.act.active { opacity:.7;  }
	/* анимированная иконка загрузки */
#loading { position:fixed; top:140px; left:0; right:0; width:300px; margin:auto; padding:87px 0 0; text-align:center; }
#ekranBlock i.fa { position:absolute; left:0; right:0; top:0; margin:auto; font-size:90px; width:78px; height:78px; line-height:78px; /* left:49%; */ color:#77ad3a; opacity:.6; }
#ekranBlock span { /* position:fixed; top:46%;  */display:block; /* width:210px; */ font-size:20px; /* left:46%; margin:auto; */ color:#77ad3a; }
	/* служебный блок для публикации ответа из ajax-сценариев ( js-код )*/
#serviceBlock { display:none; }
	/* общие правила для всех модальных окон */
#modalBlock { position:absolute; top:0; left:0; width:100%; padding:0; text-align:center; }
#modalBlock.active { padding:0 0 65px; }

.modalItem { transition:.3s; display:none; position:relative; top:50px; margin:auto; width:auto; height:0; max-height:100%; max-width:calc(100% - 10px); padding:0; z-index:1001; opacity:0; text-align:left; background:#ccc; }
.modalItem.act { display:inline-block; height:100%; }
.modalItem.act.active { opacity:1; }

a.modalClose:not(.btn), .modalItem .right span, .modalItem .left span { display:flex; justify-content:center; align-items:center; position:absolute; width:40px; height:40px; border-radius:50%; border:4px solid #fff; transition:.7s; background:inherit; }
.modalClose:not(.btn) { width:38px; height:38px; top:-13px; right:-13px; text-align:center; line-height:30px; font-size:30px; text-decoration:none !important; color:#fff; font-family: Arial; }
	.wrap .modalClose:not(.btn):hover{ color:red; border-color:red; }

.modalItem h2 { margin:0 0 0 20px;}
.modalItem .content { position:relative;}

.modalItem.imgBox { top:0; }
.modalItem.imgBox .imgBlock { position:relative; margin:0 auto; max-width:100%; max-height:100%; /*  padding:0 40px;  */transition:.3s; box-sizing:content-box; overflow:hidden; }
.modalItem .imgItem { display:none; position:relative; width:180%; height:100%; margin-left:-40%; text-align:center; }
.modalItem .imgItem.active, .modalItem.active{ display:inline-block; }
.modalItem .imgItem img { display:inline-block; max-height:96%; max-width:55%; opacity:0; transition:.3s; box-sizing:border-box; }
.modalItem .imgItem img.active { opacity:1; }

.modalItem .imgItem span.imgTitle { display:block; position:absolute; bottom:0; left:0; right:0; margin:auto; width:55%; color:#000; visibility:hidden; color:#000; opacity:0.5; background: rgba(255, 255, 255, 0.85)}
.modalItem .imgItem span.imgTitle.active { visibility:visible; transition:.3s; }
	.wrap .modalItem .imgItem span.imgTitle.active:hover { opacity:1; }

.modalItem.imgBox .content a { display:block; position:absolute; bottom:0; width:50%; height:100%; }
	.wrap .modalItem.imgBox .content a:hover span { opacity:1; }
.modalItem .left{ left:-25px; }
.modalItem .right { right:-25px; }
.modalItem .right span, .modalItem .left span { top:40%; margin:auto; opacity:.2; }
.modalItem .right span{ right:0; }
.modalItem .left span{ left:0; }
.modalItem .right span i, .modalItem .left span i { position:relative; top:6px; display:block; width:0; height:0; border:10px outset transparent; transition:.3s; }
.modalItem .right span i{  left:13px;  border-left-color:#fff; }
.modalItem .left span i{  left:-1px;  border-right-color:#fff; border-style:inset;}

.modalItem .cke_button_save{ display:none !important; }
.modalItem .cke_editor { margin:0 0 0 -1.2% !important; }
.modalItem .cke_browser_webkit .cke_editor { margin:0 !important; }

@media ( max-width: 600px){
	/* .modalItem { width:85%; } */
	.modalItem form { width:auto; }
}

@media ( max-width: 500px){
	.modalItem { width:calc( 100% - 10px ); }
	.modalClose { right:0; }
	.modalItem .right span { right:30px; }
	.modalItem .left span { left:30px; }
}

@media ( max-width: 370px){
	/* .modalItem { width:85%; } */
}

/*
   Animation example, for spinners
*/
.animate-spin {
  -moz-animation: spin 4s infinite linear;
  -o-animation: spin 4s infinite linear;
  -webkit-animation: spin 4s infinite linear;
  animation: spin 4s infinite linear;
}
@-moz-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@-webkit-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@-o-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@-ms-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}