<?php
?>.dzsap-main-con.loaded-item {
opacity: 1;
visibility: visible; }

.dzsap-main-con.loading-item {
opacity: 1;
visibility: visible; }

.dzsap-main-con {
z-index: 5555;
position: fixed;
width: 100%;
height: 100%;
opacity: 0;
visibility: hidden;
top: 0;
left: 0;
transition-property: opacity, visibility;
transition-duration: 0.3s;
transition-timing-function: ease-out; }

.dzsap-main-con .overlay-background {
background-color: rgba(50, 50, 50, 0.5);
position: absolute;
width: 100%;
height: 100%; }

.dzsap-main-con .box-mains-con {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
pointer-events: none; }

.dzsap-main-con .box-main {
pointer-events: auto;
max-width: 100%;
position: absolute;
top: 50%;
left: 50%;
transform: translate3d(-50%, -50%, 0);
transition-property: left, opacity;
transition-duration: 0.3s;
transition-timing-function: ease-out; }


.dzsap-main-con.transition-slideup.loaded-item .transition-target {
opacity: 1;
visibility: visible;
transform: translate3d(0, 0, 0); }

.dzsap-main-con.transition-slideup .transition-target {
opacity: 0;
visibility: hidden;
transform: translate3d(0, 50px, 0);
transition-property: all;
transition-duration: 0.3s;
transition-timing-function: ease-out; }

.dzsap-main-con .box-main-media-con {
max-width: 100%; }

.dzsap-main-con .box-main .close-btn-con {
position: absolute;
right: -15px;
top: -15px;
z-index: 5;
cursor: pointer;
width: 30px;
height: 30px;
background-color: #dadada;
border-radius: 50%; }

.close-btn--icon{

color: #222;
font-size: 20px;
position: absolute;
top: 50%;
left: 50%;
display: block;
transform: translate3d(-50%,-50%,0);
}

.dzsap-main-con.gallery-skin-default .box-main-media {
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3); }

.dzsap-main-con .box-main-media-con .box-main-media {
transition-property: width, height;
transition-duration: 0.3s;
transition-timing-function: ease-out; }

.box-main-media.type-inlinecontent {
background-color: #ffffff;
padding: 15px; }

.dzsap-main-con.skin-default .box-main:not(.with-description) .real-media {
border-radius: 5px; }

.dzsap-main-con .box-main-media-con .box-main-media > .real-media {
width: 100%;
height: 100%; }


.real-media .hidden-content-for-zoombox, .real-media > .hidden-content {
display: block !important; }

.hidden-content {
display: none !important; }

.social-icon {
margin-right: 3px;
position: relative; }

.social-icon > .fa {
font-size: 30px;
color: #999;
transition-property: color;
transition-duration: 0.3s;
transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1); }

.social-icon > .the-tooltip {
line-height: 1;
padding: 6px 5px;
background: rgba(0, 0, 0, 0.7);
color: #FFFFFF;
font-family: "Lato", "Open Sans", arial;
font-size: 11px;
font-weight: bold;
position: absolute;
left: 8px;
white-space: nowrap;
pointer-events: none;
bottom: 100%;
margin-bottom: 7px;
opacity: 0;
visibility: hidden;
transition-property: opacity,visibility;
transition-duration: 0.3s;
transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1); }


.social-icon:hover > .the-tooltip{
opacity:1;
visibility: visible;
}

.social-icon > .the-tooltip:before {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 6px 6px 0 0;
border-color: rgba(0, 0, 0, 0.7) transparent transparent transparent;
position: absolute;
left: 0;
top: 100%; }

.share-content > * + *{
margin-top: 20px;
}

h6.social-heading {
display: block;
text-transform: uppercase;
font-family: sans-serif;
font-size: 10px;
font-weight: bold;
margin-top: 0px;
margin-bottom: 10px;
color: #222222;
letter-spacing: 1px;
}

.field-for-view {
background-color: #f0f0f0;
line-height: 1;
color: #555;
padding: 8px;
white-space: nowrap;
font-size: 13px;
overflow: hidden;
text-overflow: ellipsis;
font-family: 'Monospaced', Arial; }

textarea.field-for-view {
width: 100%;
white-space: pre-line;
line-height: 1.75; }


.box-main-for-share .type-inlinecontent{
height: auto!important;
}

@media all and (max-height: 300px){

.real-media > .share-content:not(.a){
display: flex!important;
flex-wrap: nowrap;
align-items: baseline;
}
.share-content > *{
flex: 0 0 33%;
overflow: hidden;
}
}