/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/



#colorbox, #cboxOverlay, #cboxWrapper {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9999; /*overflow:hidden;*/
}

#cboxOverlay {
    position: fixed;
    width: 100%;
    height: 100%;
}

#cboxMiddleLeft, #cboxBottomLeft {
    clear: left;
}

#cboxContent {
    position: relative;
    border-radius: 10px;
/*    background: url("images/processing-red.svg") no-repeat center center #FFFFFF;*/
    background-size: 50px 50px;
    
}

#cboxLoadedContent {
    overflow: auto;
}

#cboxTitle {
    margin: 0;
}

#cboxLoadingOverlay, #cboxLoadingGraphic {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow {
    cursor: pointer;
}

.cboxPhoto {
    float: left;
    margin: auto;
    border: 0;
    display: block;
}

.cboxIframe {
    width: 100%;
    height: 100%;
    display: block;
    border: 0;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}

/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay {
    backdrop-filter: blur(10px);
    background-color: rgba(0,0,0,.5);
    opacity:1 !important;
}

#colorbox {
}

#cboxWrapper {
}
/*
    #cboxTopLeft{width:25px; height:25px; background:url(images/border1.png) no-repeat 0 0;}
    #cboxTopCenter{height:25px; background:url(images/border1.png) repeat-x 0 -50px;}
    #cboxTopRight{width:25px; height:25px; background:url(images/border1.png) no-repeat -25px 0;}
    #cboxBottomLeft{width:25px; height:25px; background:url(images/border1.png) no-repeat 0 -25px;}
    #cboxBottomCenter{height:25px; background:url(images/border1.png) repeat-x 0 -75px;}
    #cboxBottomRight{width:25px; height:25px; background:url(images/border1.png) no-repeat -25px -25px;}
    #cboxMiddleLeft{width:25px; background:url(images/border2.png) repeat-y 0 0;}
    #cboxMiddleRight{width:25px; background:url(images/border2.png) repeat-y -25px 0;}
*/
#cboxContent {
    background: #fff;
    border: solid 1px #e6e6e6;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    /*overflow:hidden;*/

}

.cboxIframe {
    /*   background: #fff;*/

}

#cboxError {
    padding: 50px;
    border: 1px solid #ccc;
}

#cboxLoadedContent { /*margin-bottom:20px;*/

}

#cboxTitle {
    position: absolute;
    bottom: 0px;
    left: 0;
    text-align: center;
    width: 100%;
    color: #999;
}

#cboxCurrent {
    position: absolute;
    bottom: 0px;
    left: 100px;
    color: #999;
}

#cboxSlideshow {
    position: absolute;
    bottom: 0px;
    right: 42px;
    color: #444;
}

#cboxPrevious {
    position: absolute;
    bottom: 0px;
    left: 0;
    color: #444;
}

#cboxNext {
    position: absolute;
    bottom: 0px;
    left: 63px;
    color: #444;
}

#cboxLoadingOverlay {
    background: #fff url(../images/loading.gif) no-repeat 5px 5px;
}
/*        #cboxClose{position:absolute; top:-12px; right:-15px; display:block; color:Transparent; height:38px;width:38px;background:url(../images/cBoxClose.png) top left no-repeat;border: none;}
*/
#cboxClose {
    position: absolute;
    top: -35px;
    right: -1px;
    display: block;
    color: Transparent;
    height: 25px;
    width: 88px;
    background: url(../images/cBoxClose.png) top left no-repeat;
    border: none;
}

    #cboxClose img {
        display: none;
    }

    #cboxClose:hover {
        background: url(../images/btn-close_hover.png) top left no-repeat;
    }

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
/*
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}
*/

.blue #cboxContent {
    border-color: #0397d6;
    border-top-color: #00a9cb;
}

.purple #cboxContent {
    border-color: #662d91;
    border-top-color: #a260c7;
}

.orange #cboxContent {
    border-color: #edae20;
    border-top-color: #fca00f;
}

.green #cboxContent {
    border-color: #008c5d;
    border-top-color: #22b573;
}

.customPosition {
    position: absolute;
    top: 398px !important;
}

    .customPosition #cboxContent { /*border-top: none;*/
    }

    .customPosition #cboxTopCenter {
        width: 23px !important;
        height: 11px;
        position: relative;
    }

.blue #cboxTopCenter {
    background: url(../images/interestspopup/arrow-blue.png) no-repeat;
}

.purple #cboxTopCenter {
    background: url(../images/interestspopup/arrow-purple.png) no-repeat;
}

.orange #cboxTopCenter {
    background: url(../images/interestspopup/arrow-orange.png) no-repeat;
}

.green #cboxTopCenter {
    background: url(../images/interestspopup/arrow-green.png) no-repeat;
}

.position1 #cboxTopCenter {
    left: 85px;
}

.position2 #cboxTopCenter {
    left: 248px;
}

.position3 #cboxTopCenter {
    left: 417px;
}

.position4 #cboxTopCenter {
    left: 583px;
}

.customPosition {
    margin-left: 15px;
}

/* Chrome bug */
#colorbox {
    -webkit-backface-visibility: hidden;
}