
.mediaList {
    margin: 0 0 20px;
}

.mediaList h2 {
    background: url(/img/commentsBrowserHead_bg.png) repeat-x left top;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 12px;
    font-style: italic;
    font-weight: bold;
    margin: 0;
    padding: 13px;
}

/*----- Media List Simple ------*/

/*.mediaList ul {list-style: none;margin: 0;padding:25px;}
.mediaList ul li {float:left;line-height:normal;list-style:none;margin:0;padding:7px;position:relative;}
.mediaList ul a img {border: none;}
.mediaList ul a span.videoIcon{background: url(/img/icons/media/video.png) no-repeat left top;cursor:pointer;display:block;height:40px;left:50px;position:absolute;top:50px;width:40px;}
.mediaList ul a span.audioIcon{background: url(/img/icons/media/audio.png) no-repeat left top;cursor:pointer;display:block;height:40px;left:50px;position:absolute;top:50px;width:40px;}*/

/*----- Media List Box ------*/

h6.galleryTitle {
    margin: 15px 0 15px 5px
}

.mediaHeader {
    width: 630px;
    height: 45px;
    background: url(/img/galleryHeaderBgrd.png) no-repeat left top
}

.mediaListBox {
    width: 630px;
}

.media {
    float: left;
    margin: 0 30px 15px 0;
    margin: 0 30px 15px 0;
    text-align: center;
    width: 100px;
    background: #A8A9AB;
}

.media a {
    box-shadow: 0 0 3px #333;
}

span.description {
    color: #333
}

.mediaListBox .last {
    margin-right: 0;
}

/*----- Media List Scroll ------*/

.mediaListScroll {
    position: relative;
}

.mediaListScroll .mediaListBlock {
    height: 120px;
    margin: 0 auto;
    overflow: hidden;
    padding: 10px 0;
    position: relative;
    width: 92%;
}

.mediaListScroll .mediaListBlock .items {
    clear: both;
    position: absolute;
    width: 20000em;
}

.mediaListScroll .mediaListBlock .items div.mediaHolder {
    float: left;
    margin: 0 5px 0 0;
    position: relative
}

.mediaListScroll .mediaListBlock .items div.mediaHolder img {
    border: 0;
}

.mediaListScroll .mediaListBlock .items div.mediaHolder span.videoIcon {
    background: url(/img/icons/media/video.png) no-repeat left top;
    cursor: pointer;
    display: block;
    height: 18px;
    left: 0px;
    position: absolute;
    top: 40px;
    width: 40px;
}

.mediaListScroll .mediaListBlock .items div.mediaHolder span.audioIcon {
    background: url(/img/icons/media/audio.png) no-repeat left top;
    cursor: pointer;
    display: block;
    height: 40px;
    left: 0px;
    position: absolute;
    top: 40px;
    width: 40px;
}

/*----- Left - Right Buttons ------*/

.mediaListScroll a.prev, .mediaListScroll a.prevPage {
    background: transparent url(/img/arrows/leftMS.png) no-repeat 0 0;
    cursor: pointer;
    display: block;
    height: 18px;
    left: 0px;
    position: absolute;
    top: 70px;
    width: 12px;
}

.mediaListScroll a.next, .mediaListScroll a.nextPage {
    background: transparent url(/img/arrows/leftMS.png) no-repeat 0 0;
    cursor: pointer;
    display: block;
    height: 18px;
    position: absolute;
    right: 0px;
    top: 70px;
    width: 12px;
}

.mediaListScroll a.prev:hover, .mediaListScroll a.next:hover, .mediaListScroll a.prevPage:hover, .mediaListScroll a.nextPage:hover {
    background-position: 0px 0px;
}

.mediaListScroll a.disabled {
    visibility: hidden !important;
}

.mediaListScroll a.next, .mediaListScroll a.nextPage {
    background-image: url(/img/arrows/rightMS.png);
    clear: right;
}

/*----- Media List Holder ------*/

.mediaListHolder {
    width: 630px
}

/*----- Center Image Hor and Ver ------*/

.centerHVGalleryML {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    height: 120px;
    width: 120px;
    background: #fff;
    position: relative;
}

.centerHVGalleryML * {
    vertical-align: middle;
}

/*\*//*/
.centerHVGalleryML {display: block;}
.centerHVGalleryML span {display: inline-block;height: 100%;width: 1px;}
/**/

.centerHVBI {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    height: 460px;
    width: 650px;
    background: #282828;
}

.centerHVBI * {
    vertical-align: middle;
}


/*-------------------- media set u formi matrice --------------------*/
#colorbox {
    display: none !important;
}

#content .mediaSetBrowser ul {
    margin: 0;
    list-style-image: none; 
}

.mediaSetBrowser ul li {
    list-style-type: none;
    float: left;
    margin: 0 13px 13px 0;
    width: 150px; 
}

.mediaSetBrowser ul li .blockHolder {
    width: 150px;
    height: 150px;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    background-color: #e8e8e9; 
}
.mediaSetBrowser ul li .blockHolder img {
    max-width: 150px;
    max-height: 150px;
}
.mediaSetBrowser ul li.fourth {
    margin-right: 0; 
}

.mediaSetBrowser ul li .blockHolder a, .mediaSetBrowser ul li .blockHolder a img {
    vertical-align: middle;
    text-align: center; 
}

.fancybox-title-float-wrap .child {
    text-transform: none !important;
    font-family: flamalight, Arial, Helvetica, sans-serif; 
}
@media screen and (max-width: 1037px) {
    .mediaSetBrowser ul li  {
        margin: 0 4px 4px 0;
        width: 140px;
    }
    .mediaSetBrowser ul li .blockHolder {
        width: 140px;
        height: 140px; 
    }
    .mediaSetBrowser ul li .blockHolder img {
        max-width: 140px;
        max-height: 140px;
    }
    .mediaSetBrowser ul li.fourth {
        margin-right: 4px; 
    }
    .mediaSetBrowser ul li.third {
        margin-right: 0; 
    }
}
@media screen and (max-width: 805px) {
    .mediaSetBrowser ul li  {
        margin: 0 10px 10px 0;
        width: 155px;
    }
    .mediaSetBrowser ul li .blockHolder {
        width: 155px;
        height: 155px; 
    }
    .mediaSetBrowser ul li .blockHolder img {
        max-width: 155px;
        max-height: 155px;
    }
    .mediaSetBrowser ul li.fourth, .mediaSetBrowser ul li.third {
        margin-right: 10px; 
    }
    .mediaSetBrowser ul li.second {
        margin-right: 0; 
    }
}
@media screen and (max-width: 357px) {
    .mediaSetBrowser ul li  {
        width: 135px;
    }
    .mediaSetBrowser ul li .blockHolder {
        width: 135px;
        height: 135px; 
    }
    .mediaSetBrowser ul li .blockHolder img {
        max-width: 135px;
        max-height: 135px;
    }
}





