@charset "utf-8";
/* CSS Document */
/* Version SVN: $ID$ */
/* TEST*/


/****************************************************************/
/*              FONTS                                           */
/****************************************************************/

/******** Roboto ********/

@font-face {
    font-family: 'robotolight';
    src: url('../fonts/Roboto/roboto_light/Roboto-Light-webfont.eot');
    src: url('../fonts/Roboto/roboto_light/Roboto-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto/roboto_light/Roboto-Light-webfont.woff') format('woff'),
         url('../fonts/Roboto/roboto_light/Roboto-Light-webfont.ttf') format('truetype')/*,
         url('../fonts/Roboto/roboto_light/Roboto-Light-webfont.svg#robotolight') format('svg') */;
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'robotomedium';
    src: url('../fonts/Roboto/roboto_medium/Roboto-Medium-webfont.eot');
    src: url('../fonts/Roboto/roboto_medium/Roboto-Medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto/roboto_medium/Roboto-Medium-webfont.woff') format('woff'),
         url('../fonts/Roboto/roboto_medium/Roboto-Medium-webfont.ttf') format('truetype')/*,
         url('../fonts/Roboto/roboto_medium/Roboto-Medium-webfont.svg#robotomedium') format('svg') */;
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'robotobold';
    src: url('../fonts/Roboto/roboto_bold/Roboto-Bold-webfont.eot');
    src: url('../fonts/Roboto/roboto_bold/Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto/roboto_bold/Roboto-Bold-webfont.woff') format('woff'),
         url('../fonts/Roboto/roboto_bold/Roboto-Bold-webfont.ttf') format('truetype')/*,
         url('../fonts/Roboto/roboto_bold/Roboto-Bold-webfont.svg#robotomedium') format('svg') */;
    font-weight: normal;
    font-style: normal;
}


@media screen and (-webkit-min-device-pixel-ratio:0) {
    @font-face {
        font-family: 'robotolight';
/*      src: url('../fonts/Roboto/roboto_light/Roboto-Light-webfont.svg#robotolight') format('svg'); */
    }

    @font-face {
        font-family: 'robotomedium';
/*      src: url('../fonts/Roboto/roboto_medium/Roboto-Medium-webfont.svg#robotomedium') format('svg'); */
    }

    @font-face {
        font-family: 'robotobold';
/*      src: url('../fonts/Roboto/roboto_bold/Roboto-Bold-webfont.svg#robotomedium') format('svg'); */
    }
}


/******** Open Sans ********/

@font-face {
    font-family: 'open_sanslight';
    src: url('../fonts/OpenSans/opensans_light/OpenSans-Light-webfont.eot');
    src: url('../fonts/OpenSans/opensans_light/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans/opensans_light/OpenSans-Light-webfont.woff') format('woff'),
         url('../fonts/OpenSans/opensans_light/OpenSans-Light-webfont.ttf') format('truetype')/*,
         url('../fonts/OpenSans/opensans_light/OpenSans-Light-webfont.svg#open_sanslight') format('svg') */;
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sansregular';
    src: url('../fonts/OpenSans/opensans_regular/OpenSans-Regular-webfont.eot');
    src: url('../fonts/OpenSans/opensans_regular/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans/opensans_regular/OpenSans-Regular-webfont.woff') format('woff'),
         url('../fonts/OpenSans/opensans_regular/OpenSans-Regular-webfont.ttf') format('truetype')/*,
         url('../fonts/OpenSans/opensans_regular/OpenSans-Regular-webfont.svg#open_sansregular') format('svg') */;
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sanssemibold';
    src: url('../fonts/OpenSans/opensans_semibold/OpenSans-Semibold-webfont.eot');
    src: url('../fonts/OpenSans/opensans_semibold/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans/opensans_semibold/OpenSans-Semibold-webfont.woff') format('woff'),
         url('../fonts/OpenSans/opensans_semibold/OpenSans-Semibold-webfont.ttf') format('truetype')/*,
         url('../fonts/OpenSans/opensans_semibold/OpenSans-Semibold-webfont.svg#open_sansbold') format('svg') */;
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sansbold';
    src: url('../fonts/OpenSans/opensans_bold/OpenSans-Bold-webfont.eot');
    src: url('../fonts/OpenSans/opensans_bold/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans/opensans_bold/OpenSans-Bold-webfont.woff') format('woff'),
         url('../fonts/OpenSans/opensans_bold/OpenSans-Bold-webfont.ttf') format('truetype')/*,
         url('../fonts/OpenSans/opensans_bold/OpenSans-Bold-webfont.svg#open_sansbold') format('svg') */;
    font-weight: normal;
    font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    @font-face {
        font-family: 'open_sanslight';
/*        src: url('../fonts/OpenSans/opensans_light/OpenSans-Light-webfont.svg#open_sanslight') format('svg'); */
    }

    @font-face {
        font-family: 'open_sansregular';
/*        src: url('../fonts/OpenSans/opensans_regular/OpenSans-Regular-webfont.svg#open_sansregular') format('svg'); */
    }

    @font-face {
        font-family: 'open_sanssemibold';
/*        src: url('../fonts/OpenSans/opensans_semibold/OpenSans-Semibold-webfont.svg#open_sansbold') format('svg'); */
    }

    @font-face {
        font-family: 'open_sansbold';
/*        src: url('../fonts/OpenSans/opensans_bold/OpenSans-Bold-webfont.svg#open_sansbold') format('svg'); */
    }
}



/******** Font Awesome ********/

@font-face {
  font-family: 'FontAwesome';
  src:  url('../fonts/FontAwesome/fontawesome-webfont.eot?v=3.2.1');
  src:  url('../fonts/FontAwesome/fontawesome-webfont.eot?#iefix&v=3.2.1') format('embedded-opentype'),
        url('../fonts/FontAwesome/fontawesome-webfont.woff?v=3.2.1') format('woff'),
        url('../fonts/FontAwesome/fontawesome-webfont.ttf?v=3.2.1') format('truetype')/*,
        url('../fonts/FontAwesome/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1') format('svg') */;
  font-weight: normal;
  font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    @font-face {
        font-family: 'FontAwesome';
/*      src: url('../fonts/FontAwesome/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1') format('svg'); */
    }
}


/****************************************************************/
/*              GENERAL STYLES                                  */
/****************************************************************/

html,
body {
    background:#f5f6f7;
    font-size:14px;
    line-height:1.42857;
    color:#1a1c1e;
    font-weight:normal;
    font-family:'Open Sans', 'open_sansregular', 'Segoe UI', 'Helvetica Neue', sans-serif;
    max-width: 1920px;
    margin: 0 auto;
}

@media (min-width: 768px) {
    html,
    body {
        font-size:13px; }
}

*:focus:hover,
*:focus:hover i:before {
    /*color: initial;*/
}
@media (max-width:992px)
{
  #siteHeader{
    /*height: 150px !important;*/
  }

  #searchHead{
    /*position: absolute;
    left: 0;
    top: 65px;*/
  }
}

@media (min-width: 1300px) {
  .container {
    /*width: 1270px;*/
  }
}
.vmp-flr {
    display: flex;
    flex-direction: row;
}
.vmp-flc {
    display: flex;
    flex-direction: column;
}
input[type="checkbox"] {
    min-height: 15px;
    min-width: 15px;
}

.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
  margin-left: -20px;
}
.checkbox .shared-with-clients input[type="checkbox"] {
    margin-left: 0;
}
/*
@media (min-width: 1600px) {

    html,
    body {
        font-size:14px; }

}*/

/******** Body Copy ********/

/*** Headlines ***/

h1, h2, h3, h4, h5, h6 {
    color:#546174;
    font-weight:normal;
    font-family:'Roboto Light', 'robotolight', sans-serif; }

h1,
.h1 {
  font-size:2.3em; /* 30 px */
  margin-bottom:20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; }

    h1 i,
    .h1 i {
      color:#acbbc3;  }

h2,
.h2 {
  font-size:1.7em; /* 25 px */
  margin-bottom:15px; }

h3,
.h3 {
  font-size:1.429em; /* 20 px */ }

h4,
.h4 {
  font-size:1.214em; /* 17 px */ }

h5,
.h5 {
  font-size:1.071em; /* 15 px */ }

h6,
.h6 {
  font-size:1em; /* 14 px */ }


/*** Text ***/

p {
    margin: 0 0 0.75em; }

b,
strong {
    font-weight:normal;
    font-family:'open_sanssemibold', sans-serif; }

.text {
    color:#1a1c1e !important; }

.price {
    font-size:0.8em;
    display:inline-block;
    color:#fff;
    background:#53708D;
    padding:0.2em 0.5em;
    margin-bottom:0.2em;
    border-radius:1em;
    -moz-border-radius:1em;
    -webkit-border-radius:1em; }

.noContent {
    font-style:italic;
    color:#59717D; }


/*** Links ***/

a {
    /*color:#617ca3;*/
    color:#3B6297;
    text-decoration:none; }

    a:hover {
        color:#475d7b;
        text-decoration:none; }

    a:active,
    a:focus {
        color:#003f61;
        text-decoration:none;
        outline:none;
    }

    a:visited {
        color:#617ca3; }

.actionLink {
    font-size:0.8em;
    color:#8a9eac; }

    #siteContent .actionLink {
        font-size:0.9em;
        color:#475d7b;
        /* background:#eef0f3; */
        padding:0.2em 0.5em;
        border:1px solid #3B6297;
        /*border-radius:0.5em;
        -moz-border-radius:0.5em;
        -webkit-border-radius:0.5em;*/
        overflow:hidden;
    }

    .mediaActionsList > .mediaAction > .actionLink,
    .messageActionsList > .messageAction > .actionLink {
        display: block;
    }

        #siteContent .actionLink:focus,
        #siteContent .actionLink:hover {
            color:#fff !important;
            background:#3B6297;
            border:1px solid #3B6297; }

        #siteContent .actionLink i {
            margin-right:0.2em; }

            #siteContent .actionLink i:before {
                color:#3B6297;
            }

            #siteContent .actionLink:hover i {
                color:#9eafc7;
            }

            #siteContent .actionLink:focus i:before,
            #siteContent .actionLink:hover i:before {
                color: #ffffff;
            }

.viewProfile #innerNav #userInfo .userCover {
    z-index: 101;
}

.mediaActions {
    position: relative;
    width: 155px;
    margin-right: 1rem;
    border: 1px solid #475d7b;
    color: #475d7b;
    font-size: .9em;
}

.messageActions {
    position: relative;
    width: 95%;
    border: 1px solid #475d7b;
    font-size: 14px;
    margin-left: 2.5%;
    height: 30px;
    border-radius: 5px;
    margin-bottom: 15px;
}

.mediaActions[open],
.messageActions[open] {
    z-index: 1;
}

.messageActionsSummary {
    position: relative;
    font-size: 14px;
}

.mediaActionsSummary,
.messageActionsSummary {
    padding: .2em .5em;
    cursor: pointer;
    list-style: none;
}

summary::-webkit-details-marker {
    display: none;
}

.staticPage ol,
.staticPage ul {
    list-style: initial;
}

.mediaActions[open] summary:before,
.messageActions[open] summary:before {
    content: '';
    display: block;
    width: 100vw;
    height: 100vh;
    background: transparent;
    position: fixed;
    top: 0;
    left: 0;
}

.mediaActionsSummary:focus,
.messageActionsSummary:focus {
    color: #fff !important;
    background: #3B6297;
    border: 1px solid #3B6297;
}

.mediaActionsSummary:after,
.messageActionsSummary:after {
    content: '';
    display: inline-block;
    float: right;
    width: .5rem;
    height: .5rem;
    border-bottom: 1px solid currentColor;
    border-left: 1px solid currentColor;
    border-bottom-left-radius: 2px;
    transform: rotate(45deg) translate(50%, 0%);
    transform-origin: center center;
    transition: transform ease-in-out 100ms;
    margin: 3px;
}

.mediaActionsSummary:focus,
.messageActionsSummary:focus {
    outline: none;
}

.mediaActions[open] summary:after,
.messageActions[open] summary:after {
    margin: 3px;
    transform: rotate(-45deg) translate(0%, 0%);
}

.mediaActionsList,
.messageActionsList {
    width: 100%;
    background: #eef0f3;
    position: absolute;
    left: 0;
    padding: 1rem;
    margin: 0;
    box-sizing: border-box;
    border-radius: 5px;
    max-height: 200px;
    overflow-y: auto;
}

.mediaActionsList {
    top: calc(100% + .5rem);
}

.messageActionsList {
    top: 100%;
    border-radius: 5px;
}

.mediaActionsList > li {
    text-transform: capitalize;
}

.mediaAction {
    margin: 0;
    padding: 0.2rem 0;
}

.messageAction {
    margin: 0;
    font-size: 14px;
    padding: 5px 0;
}

.mediaAction:first-child,
.messageAction:first-child {
    padding-top: 0;
}

.mediaAction:last-child,
.messageAction:last-child {
    padding-bottom: 0;
    border-bottom: none;
}

.mediaNavigation {
    margin-top:10px;
    margin-bottom:10px;}

.mediaNavigationButton {
    border-radius: 0;
    border: none;
    font-size: 1.2em; }

.mediaNavigationButton:hover {
    border: none;
    color: #fff;}

.navigationDisabled {
    color: #aaa !important;
    pointer-events: none;}

    .more {
    border:1px solid #475d7b;
    color:#475d7b;
    /*border-radius:1em;
    -moz-border-radius:1em;
    -webkit-border-radius:1em;*/
    padding:0.2em 0.75em;
    margin:0.5em 0 0;
    display:inline-block; }

    .more:hover {
        background:#3B6297;
        color: #FFFFFF
    }

.backToTop {
    float:right; }

.view {
    color:#acbbc3; }


/*** Box ***/

.box {
    background: transparent;
    padding:0.75em;
    margin-top:0.75em;
    box-shadow:none; }

.showMore {
    display:block;
    text-align:center;
    text-transform:uppercase;
    color:#acbbc3;
    background:#fdfdfd;
    padding:0.75em 1em;
    margin:0.5em -0.75em -0.75em;
    border-top:1px solid #f0f3f7;
    cursor: pointer; }

.showMore:hover {
    background:#f0f3f7; }

.vmp-mobile .box button.showMore {
    border: 1px solid;
    margin: 0;
    width: 100%;
}

/******** Lists ********/

dt {
    float:left;
    width:15%;
    padding:0 1em 0 0;
    min-height:20px;
    margin-bottom:0.5em;
    font-weight:normal;
    font-family:'open_sanssemibold', sans-serif; }

dd {
    float:left;
    width:85%;
    min-height:20px;
    margin-bottom:0.5em; }


/******** Table ********/

table th {
    font-weight:normal;
    font-family:'open_sanssemibold', sans-serif; }


/******** Form ********/

form {
    background:#f5f6f7;
    padding:1em;
    margin:1em 0;
    /*border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;*/
}

fieldset {}

label {
    font-weight:normal;
    font-family:'open_sanssemibold', sans-serif;
    margin-right:0.5em; }

label[for="media_thumbnail_select"]{
    display: none;
}

.date input,
.date select,
.date .form-control {
    width:32.5%; }

.checkbox label,
.radio label {
    font-family:'open_sansregular', sans-serif; }


/*** Checkboxes & Radiobuttons ***/



/*** Inputs ***/

.form-control {
    border-color:#acbbc3; }

.input-group-addon {
    border-color:#acbbc3;
    background:#acbbc3; }

    .input-group-addon label {
        margin: 0;
        display: inline-block; }

    .input-group-addon:hover label {
        /*display: inline-block;*/ }

    .input-group-addon:hover input[type="checkbox"] {
        /*margin-right: 0.5em;*/ }

    .input-group-addon i {
        color:#fff;
        width:25px;
        text-align:center;
        display:inline-block; }

.input-group:hover .input-group-addon {
    border-color:#3B6297;
    background:#3B6297;
}

.input-group:hover .input-group-addon i:before {
    color:#FFFFFF;
}

.input-group:hover .form-control {
    border-color:#3B6297; }

#pass_protected{
    display:none;
}

/*** Textarea ***/



/*** Buttons ***/

.btn,
.btn:visited {
    font-family:'robotomedium', sans-serif;
    /*color:#51585f;
    border:1px solid #acbbc3;
    background:#dfe5eb;*/ }

    .btn:hover {
        /*border:1px solid #acbbc3;
        background:#bac7cd;*/ }

    .btn:active,
    .btn:focus,
    .btn.active,
    .btn.focus {
        /*border:1px solid #acbbc3;
        background:#dfe5eb;
        box-shadow:inset 0 2px 4px #acbbc3;*/ }

    .btn i {
        color:#475d7b; }

        .btn:hover i {
            color:#FFFFFF; }

.btn-primary,
.btn-primary:visited  {
    font-family:'robotomedium', sans-serif;
    /* color:#fff;
    text-shadow:0 -1px 0 #324362;
    border:1px solid #475d7b;
    background:#617ca3;*/ }

    .btn-primary:hover {
        /*text-shadow:0 -1px 0 #324362;
        border:1px solid #324362;
        background:#475d7b;*/ }

    .btn-primary:active,
    .btn-primary:focus,
    .btn-primary.active,
    .btn-primary.focus {
        /*border:1px solid #324362;
        background:#617ca3;
        box-shadow:inset 0 2px 4px #324362;*/ }

    .btn-primary i {
        /*color:#fff !important;*/ }

.btn-facebook,
.btn-facebook:visited {
    color:#fff;
    text-shadow:0 -1px 0 #3d4e7e;
    border:1px solid #3d4e7e;
    background:#4E69a2; }

    .btn-facebook:hover {
        color:#fff;
        border:1px solid #3d4e7e;
        background:#3b5998; }

    .btn-facebook:active,
    .btn-facebook:focus,
    .btn-facebook.active,
    .btn-facebook.focus {
        border:1px solid #3d4e7e;
        background:#4E69a2;
        box-shadow:inset 0 2px 4px #3d4e7e; }

    .btn-facebook i {
        color:#fff !important; }

.btn-openID,
.btn-openID:visited {
    color:#fff;
    text-shadow:0 -1px 0 #d07609;
    border:1px solid #ea8509;
    background:#f7931e; }

    .btn-openID:hover {
        color:#fff;
        border:1px solid #d07609;
        background:#ea8509; }

    .btn-openID:active,
    .btn-openID:focus,
    .btn-openID.active,
    .btn-openID.focus {
        border:1px solid #d07609;
        background:#f7931e;
        box-shadow:inset 0 2px 4px #d07609; }

    .btn-openID i {
        color:#fff !important; }

.buttonpane,
.modal .modal-dialog .modal-body .buttonpane {
    float:none;
    margin-top:1em;
    text-align:right; }



/*** Select ***/



/*** Form Group ***/



/*** Error Styles for Form Group ***/



/*** Help Text ***/




/******** Media ********/

audio {
    display: inline-block; }

video {
    display: inline-block; }

canvas {
    display: inline-block; }

img {
    border: 0 none;
    page-break-inside: avoid;
    max-width: 100% !important;
    display: inline-block;
    height: auto;
    vertical-align: middle; }

a [class^="icon-"],
a [class*=" icon-"],
.glyphicon {
    color:#acbbc3; }

.userThumb {
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    box-shadow:0 0 2px #acbbc3; }

.mediaCover {
    position:relative; }

    .mediaCover i {
        color:#fff;
        border-radius:50%;
        -moz-border-radius:50%;
        -webkit-border-radius:50%;
        padding:0.5em;
        background:rgba(0,0,0,.8); }

.mediaCover .view {
    background:#282a2d;
    border:1px solid #1a1c1e; }

.mediaCover .buy {
    background:#617ca3;
    border:1px solid #003f61; }

.mediaCover .remove {
    background:#282a2d;
    border:1px solid #1a1c1e; }

.mediaCover .add {
    background:#282a2d;
    border:1px solid #1a1c1e; }


/*** Media Overlay ***/

.big .mediaOverlay {
    position:absolute;
    bottom:0;
    left:0;
    height:0;
    padding:1em;
    visibility:hidden;
    background:rgba(0,0,0,.7);
    -webkit-transition:height 1s;
    -moz-transition:height 1s;
    -o-transition:height 1s;
    transition:height 1s;
    color:#fff; }

    .big li:hover .mediaOverlay,
    .big li:focus .mediaOverlay {
        visibility:visible;
        height:96%;
    }

    .big .mediaOverlay .details {
        position:absolute;
        bottom:1em;
        left:0.5em;
        width:100%;
        opacity:0;
        -webkit-transition:opacity 1s .5s;
        -moz-transition:opacity 1s .5s;
        -o-transition:opacity 1s .5s;
        transition:opacity 1s .5s; }

        .big li:hover .mediaOverlay .details {
            opacity:1; }


/*** Thumb Overlay ***/

.categoryThumbs .mediaCover .icons,
.small .mediaCover .icons,
.list .mediaCover .icons {
    position:absolute;
    left:0;
    top:0;
    height:100%;
    width:100%;
    background:rgba(0,0,0,.7);
    visibility:hidden;
    opacity:0;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out; }

    .categoryThumbs article:hover .mediaCover .icons,
    .small article:hover .mediaCover .icons,
    .list article:hover .mediaCover .icons {
        visibility:visible;
        opacity:0.4; }

    .mediaCover .icons i {
        position:absolute;
        top:40%;
        left:0 !important;
        width:100%;
        display:block;
        padding:0;
        font-size:2em;
        text-align:center;
        border-radius:0;
        -moz-border-radius:0;
        -webkit-border-radius:0;
        background:transparent; }

    .mediaCover .icons img {
        position:absolute;
        top:37%;
        left:50%;
        transform:translateX(-50%);
    }

    .mediaCover .icons img.icon-listvideo {
        top:40%;
        width:35px;
    }

/******** Loading Overlay ********/

.loadingOverlay {
    text-align:center;
    background:#fff;
    height:100%;
    width:100%;
    opacity:0.8;
    padding:2em 0 0;
    position:absolute;
    top:0;
    left:0;
    z-index:3; }

    .loadingOverlay .loader {
        position:absolute;
        top:50%;
        left:50%; }


/******** Filter ********/

.filter {
    position:relative;
    margin-bottom:1em;
    background:#f5f6f7;
    padding:0.75em 0.5em 0;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
}

    .filter ul,
    .filter .nav-tabs > li > a {
        color:#6b7073;
        min-height:38px;  }

    .filter .nav-tabs > li.active > a,
    .filter .nav-tabs > li.active > a:hover,
    .filter .nav-tabs > li.active > a:focus,
    .filter .nav-tabs > li.active > a {
        color:#1a1c1e;
        border-top:5px solid #617ca3; }

.additionalFilter {
    margin:0.5em 0 1em;
    height:40px; }

    .additionalFilter li:first-child {
        line-height:40px;
        margin-right:0.5em; }

    .additionalFilter .nav-pills > li > a,
    .additionalFilter .nav-pills > li > a:hover,
    .additionalFilter .nav-pills > li > a:focus {
        margin:0.6em 0;
        padding:0.2em 0.75em; }

    .additionalFilter .nav-pills > li.active > a,
    .additionalFilter .nav-pills > li.active > a:hover,
    .additionalFilter .nav-pills > li.active > a:focus {
        background:#617ca3;
        color:#fff; }

/*** View ***/

.filterView {
    /*position:absolute;
    right:1em;
    top:0.5em;*/
    display: flex;
    flex-wrap: nowrap;
    background:#eef0f3; }

    .filterView a {
        background:#eef0f3; }

    .filterView a.active i,
    .filterView a:hover i,
    .filterView a:focus i {
        color:#6b7075; }

/*** Tabs ***/
#myTab.nav {
    gap: 8px
}

#myTab.nav .nav-item .nav-link {
    background: #eceff2;
    padding: .5em 1em;
    border-radius: 0;
    border: 0;
    color: #3f68a2;
    height: auto;
}

#myTab.nav .nav-item :is(.nav-link:hover, .nav-link.active) {
    background: #3b6297;
    color: #fff;
}

/*** Filters ***/

.mediaFilter {
    float:left;
    width:160px;
    cursor:pointer;
    appearance:auto;
    background-color: #fdfdfd; }


/*** Search Form ***/

.inlineSearch {
    float:right;
    margin-right:1em;
    width:20%; }

.inlineSearch form {
    margin:0;
    padding:0;
    background:transparent; }




/******** Dropdown ********/




/******** Overlay ********/

.fade.in {
    opacity:9999; }

.modal-backdrop {
    background:rgba(0,0,0,.8);
    z-index: 89;
}


/******** Tooltip ********/



/******** Badge ********/

.badge {
    background:#acbbc3; }


/******** Tags ********/

.tag {
    font-size:0.9em;
    display:inline-block;
    color:#fff;
    background:#acbbc3;
    padding:0.2em 0.5em;
    margin-bottom:0.2em;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em; }

    .tag:hover {
        color:#fff;
        background:#475d7b; }

    .tag:visited {
        color:#fff; }

/************************* Tabs *********************************/

.nav > li > a:hover,
.nav > li > a:focus {
    background:#DFE5EB; }

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    background:#fdfdfd; }

.nav-tabs > li.active > a {
    /*height:38px;*/
    margin-bottom:-1px; }

form .nav-tabs > li.active > a,
form .nav-tabs > li.active > a:hover,
form .nav-tabs > li.active > a:focus {
    background:#f5f6f7; }


/******** Scrollbar ********/

.scrollbar {
    overflow:auto;
    height:750px;
    width:auto;
    padding:0 5px;
    border:1px solid #acbbc3; }

  .scrollbar ul li img.loader {
    margin: 0 50%; }

.track {
    width:10px;
    background:rgba(0, 0, 0, 0);
    margin-right:2px;
    border-radius:10px;
    -webkit-transition:background 250ms linear;
    transition:background 250ms linear; }

    .track:hover,
    .track.dragging {
        background:#d9d9d9; /* Browsers without rgba support */
        background:rgba(0, 0, 0, 0.15); }

.handle {
    width:7px;
    right:0;
    background:#999;
    background:rgba(0, 0, 0, 0.4);
    border-radius:7px;
    -webkit-transition:width 250ms;
    transition:width 250ms; }

    .track:hover .handle,
    .track.dragging .handle {
        width:10px; }


/****************************************************************/
/*                     COMMENTS                                 */
/****************************************************************/

.comment {
    overflow: auto;
    overflow-y: hidden;
    font-size:0.9em;
    margin-bottom:20px;
}

.comment,
.comment .comment-content,
.comment .comment-info,
.comment .comment-header,
.comment .comment-info .comment-avatar,
.comment .comment-action {
    display: flex;
}

.comment .comment-avatar {
    flex-shrink: 0;
    padding: 1px 20px 0 1px;
}

.comment .comment-avatar .userThumb {
    width: 55px;
    height: 55px;
}

.comment .comment-content {
    flex-wrap: wrap;
    width:100%;
    padding-bottom: 20px;
}

.comment .comment-header {
    width: 100%;
    justify-content: space-between;
}

.comment .comment-info {
    flex-wrap: wrap;
    align-items: baseline;
}
.comment .comment-action {
    flex-wrap: nowrap;
}

.comment .text {
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;
    width: 100%;
}

.comment .commentTextarea {
    height: 100%;
}

.comment .comment-info a {
    margin-right: 5px;
}

.comment a p,
.comment .comment-header .comment-info a {
    display: inline;
    color: black;
    font-weight: bold;
}
.comment .comment-header .comment-info a:hover,
.comment .comment-header a:hover p {
    color: #3b6297;
}

.comment .comment-header a:focus p,
.comment .comment-header .comment-info a:focus{
    color: white;
}

.comment .comment-header .comment-info p {
    margin-bottom: 5px;
}

.comment-date {
    opacity: .6;
}

.comment .comment-header .comment-action .pencilEditComment,
.comment .comment-header .comment-action .deleteComment {
    opacity: 0.2;
    background-color: transparent;
    border: none;
    height: 20px;
}

.comment .comment-header .comment-action .pencilEditComment:hover,
.comment .comment-header .comment-action .deleteComment:hover,
.comment .comment-header .comment-action .pencilEditComment:focus,
.comment .comment-header .comment-action .deleteComment:focus {
    color: #3b6297;
    opacity: 1;
}

.commentTimestamp {
    position: relative;
    z-index: 5;
    cursor: pointer; }

#comment_message {
    position: absolute; }

#comment_message span {
    margin-right: 5px; }

.limit-reached-icon {
    color: #acbbc3; }
/******** Quote ********/

.quote {
    position:relative;
    background:#dfe5eb;
    padding:1em;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;
    min-height:60px;
    overflow:hidden; }

    .quote i {
        position: absolute;
        top:-10px;
        left:-5px;
        color:#000;
        font-size:5em;
        opacity:0.1; }


/******** Pager ********/

.pagingLinks {
    text-align:center; }

    .pagingLinks .pagination {
        width:auto; }


.pagingLinks .pagination > li {
    padding:0;
    display:inline-block; }

.pagingLinks .pagination > li > a,
.pagingLinks .pagination > li > span {
    position:relative;
    border:none;
    float:none;
    font-size:0.8em;
    line-height:1.42857;
    margin:0;
    padding:0.5em 1em;
    text-decoration:none;
    color:#fff;
    background:#acbbc3;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em; }

    .pagination > li:first-child > a,
    .pagination > li:first-child > span {
        border-radius:0.5em;
        -moz-border-radius:0.5em;
        -webkit-border-radius:0.5em; }

    .pagingLinks .pagination > li.disabled {
        opacity:0.4; }

    .pagingLinks .pagination > li > a:hover,
    .pagingLinks .pagination > li > a:focus {
        color:#fff;
        background:#475d7b; }

    .pagingLinks .pagination > li.active span {
        color:#fff;
        background:#617ca3; }


/******** Rating ********/

.rating i {
  font-size: 16px; }

.rating .hover i,
.rating .icon-star:before,
.rating .icon-star-half-empty:before {
  color:#617ca3; }

.rating .hover .icon-star:before,
.rating .hover .icon-star-empty:before,
.rating .hover .icon-star-half-empty:before {
  content: "\f005"; }

.rating .clear .icon-star:before,
.rating .clear .icon-star-empty:before,
.rating .clear .icon-star-half-empty:before {
  color: #ACBBC3;
  content: "\f006"; }


/******** media tags ********/

.tagged,
.mediaThumbs.small .mediaCover i.tagged {
    display:block;
    position:absolute;
    right:5px;
    top:5px;
}

.tagged.featured {
    background:url('../images/overlay-sprite.png') 0 -187px no-repeat; }

.tagged.new {
    background:url('../images/overlay-sprite.png') 0 -46px no-repeat; }

.tagged.favorite {
    background:url('../images/overlay-sprite.png') 0 -236px no-repeat; }

.tagged.own {
    background:url('../images/overlay-sprite.png') 0 -92px no-repeat; }

.tagged.friend {
    background:url('../images/overlay-sprite.png') 0 -140px no-repeat; }

    .userList .tagged.friend {
        height:50%;
        width:50%;
        background:url('../images/overlay-friend.png') 100% 0 no-repeat;
        background-size:contain; }

.userCover .tagged.friend {
    height: 35px;
    text-indent: -9999px;
    width: 31px;
}

.tagged.rss {
    background:url('../images/overlay-sprite.png') 0 -334px no-repeat; }


.layout_converting {
    display: block;
    height: 35px;
    position: absolute;
    top: 45px;
    width: 100%;
    font-size: 22px;
    text-align: center;
    color: #fff;
    text-shadow: 1px 1px #000;
}

.online {
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    text-align:center;
    font-size:0.7em !important;
    color:#fff !important;
    padding:70% 0 0 0;
    margin:0;
    height:100% !important;
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    overflow:hidden; }

    .online span {
        padding:0.1em 0.1em 0.2em;
        display:block;
        background:url('../images/transGREEN-80.png') 0 0 repeat; }


/******** or-devider ********/

.or {
    /*position:absolute;
    top:38%;
    left:45%;
    right:45%;*/
    text-align:center;
    display:block;
    background:url('../images/lineGrey.png') 0 50% repeat-x;  }

    .or span {
        background:#acbbc3;
        border-radius:50%;
        -moz-border-radius:50%;
        -webkit-border-radius:50%;
        line-height:50px;
        height:50px;
        width:50px;
        display:inline-block; }


/******** bottom ********/

.bottom {
    text-align:right;
    padding:0.5em 0 0;
    border-top:1px solid #dfe5eb; }


/******** Likes ********/

.likes span:hover i {
    color:#617ca3; }

.likes span:hover {
    cursor: pointer;
}


/******** Favorite ********/

.favorite span:hover i {
    color:#617ca3; }

.favorite span:hover {
    cursor: pointer;
}

/******** Countdown ********/

.countdown {
    padding:1em;
    border:1px solid #dfe5eb;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;
    text-align:center;
    min-width:220px; }

    .countdown .status,
    .countdown small span {
        font-weight:normal;
        font-family:'open_sanssemibold', sans-serif; }


/******** Inner Nav ********/

#innerNav {
    position:relative;
    margin:20px 0; }


/******** Sub Nav ********/

#subNav { }

    #subNav ul,
    #subNav .nav-tabs > li > a {
        color:#6b7073;
        height:38px;
        border:none; }

    #subNav .nav-tabs > li > a {
        background:url('../images/transWHT-80.png') 0 0 repeat;
        color: #FFFFFF;
    }

        #subNav .nav-tabs > li > a:hover {
            background:#fff; }

    #subNav .nav-tabs > li.active > a,
    #subNav .nav-tabs > li.active > a:hover,
    #subNav .nav-tabs > li.active > a:focus {
        color:#1a1c1e;
        border-top:5px solid #617ca3;
        background:#fdfdfd;
        padding:5px 15px 10px;
    }


/******** Slider ********/

.mediaSlider .swiper-container {
    height:135px; }

    .mediaSlider .swiper-container .content-slide {
        padding:0.75em; }

.mediaSlider #slider .arrow-left,
.mediaSlider #slider .arrow-right {
    margin-top:0;
    top:30%;
    text-shadow:none; }

    #slider .arrow-left,
    #slider .arrow-right {
        z-index: 2; }

    .mediaSlider #slider .arrow-left:hover i,
    .mediaSlider #slider .arrow-right:hover i {
        color:#475d7b;  }

.mediaSlider #slider .mediaCover {
    margin-bottom:0.5em; }

    .mediaSlider #slider .mediaCover i {
        position:absolute;
        bottom:0.5em;
        left:0.5em; }

.mediaSlider #slider .hasPrice {
    height:40px;
    width:40px;
    padding:0.25em; }

    .mediaSlider #slider .hasPrice i {
        font-size:1.2em; }


/****************************************************************/
/*              SITE LAYOUT                                     */
/****************************************************************/



/*********************************************************/
/*              Header                                   */
/*********************************************************/

#siteHeader {
    position: relative;
    border-top:3px solid #3B6297;
    background: #eceff2;
    box-shadow:0 1px 0 rgba(255, 255, 255, 0.1), inset 0 -1px 1px rgba(255, 255, 255, 0.1);
    padding: 0 1em;
    height: auto;
    min-height: 90px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
    #siteHeader button:focus,
    #siteHeader a:focus {
        color: #FFFFFF;
    }

    #siteHeader .wrapper {
        position:relative;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

    @media(max-width: 999px) {
        #siteHeader .wrapper {
            display: none;
        }
    }

    #siteHeader .vmp-leftwrp {
        display: flex;
        flex-direction: row;
    }


#headerContent {
    /*position: absolute;*/
    text-align: right;
    /*width: 100%;*/
    right: 15px;
    height:70px;
    vertical-align:top;
    display:flex;
    justify-content: flex-end;
}

#headerContent * {
  text-align: left; }

#headerContent .badge,
#headerContent .or span,
#headerContent #register .or, #headerContent #login .or,
#headerContent #userActions #loginDropdown .or,  #headerContent #userActions #registrationDropdown .or,
#headerContent .loginOptions, #headerContent .registerOptions,
#headerContent .input-group-addon i {
  text-align: center; }

#headerContent .buttonpane, #headerContent .modal .modal-dialog .modal-body .buttonpane {
  text-align: right; }


/******** Logo ********/

#siteLogo,
#siteLogoMobile {
    /*position: absolute;
    left: 15px;*/
    z-index: 1;
    max-height:90px;
    overflow:hidden;
    border: 5px solid transparent;
    /* margin-left: 1em; */
}

    #siteLogo img {
        margin: 0;
        max-height:80px; }

    #siteLogoMobile img {
        margin: 0;
        max-height: 60px; }

/******** Search ********/

#searchHead,
#searchHeadMobile {
    display:inline-block;
    height:70px;
    min-width:245px;
    max-width:280px;
    padding:0 1em;
    position:relative;
    vertical-align:top;}

    #searchHead form,
    #searchHeadMobile form{
        background:transparent;
        border-radius:0;
        margin:17px 0 0;
        padding:0; }

    #searchHead input[type="search"],
    #searchHeadMobile input[type="search"] {
        border-right:none;
        border-radius:0.5em 0 0 0.5em;
        -moz-border-radius:0.5em 0 0 0.5em;
        -webkit-border-radius:0.5em 0 0 0.5em; }

    .mobile-hidden-search {
        position: absolute;
        top: 70px;
        width: 100%;
        left: 0px;
        background-color: rgb(236, 239, 242);
        display: none;
        justify-content: center;
    }

/******** Upload ********/
#headerContent .language,
#headerContent .upload {
    line-height: 70px;
    font-size: 15px;
    padding: 0 1em 0 1em;
    font-family: 'Roboto Light', 'robotolight', sans-serif;
}

#siteHeader #headerContent #userActions .userLoginLink,
#siteHeader #headerContent #userActions .userRegistrationLink,
#siteHeader #headerContent #userActions .loginSeparate  {
    line-height: 70px;
    font-size: 15px;
    font-family: 'Roboto Light', 'robotolight', sans-serif;
}

#headerContent .language,
#headerContent .upload {
    display: block;
}

#userActions {
    display: flex;
}

#headerContent .upload {
    padding-top: 4px;
}

@media (max-width: 1000px) {
    #userActions {
        line-height: 0;
    }
}

/******** Language ********/

    #headerContent .language li i {
        display:inline-block;
        vertical-align:bottom; }

/******** Login & Registration Links ********/
#userActions .userLoginLink,
#userActions .userRegistrationLink {
    margin-right: 5px;
}

#userActions .userLoginLink {
    padding: 0 1em 0 1em;
}

#userActions .userRegistrationLink {
    margin-left: 5px;
}

#userActions .userRegistrationLink a {
    padding: 0 1em 0 1em;
}

    #userActions .userLoginLink:hover/*,
    #userActions .userRegistrationLink:hover*/ {
        z-index:9999;
        background:url('../images/arrowOverlay.png') 50% 55px no-repeat; }

#userActions .userLoginLink > i {
    color:#3B6297;  }


/******** Login & Registration Dropdown ********/

#userActions #loginDropdown,
#userActions #registrationDropdown {
    position:absolute;
    right:0;
    padding:1em;
    margin:1em 0 1em 2.3em;
    background:#f5f6f7;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;
    box-shadow:0 3px 3px #333;
    z-index:9998;
    visibility:hidden;  }

    #userActions #registrationDropdown {
        top: 54px;
    }

    #userActions .userLoginLink:hover #loginDropdown,
    #userActions .userLoginLink #loginDropdown.hover,
    #userActions .userRegistrationLink:hover #registrationDropdown,
    #userActions .userRegistrationLink #registrationDropdown.hover {
        z-index:9998; }

    #userActions #loginDropdown .arrow,
    #userActions #registrationDropdown .arrow {
        position:absolute;
        top:-12px;
        right:0;
        height:12px;
        width:100%; }

    #userActions #registrationDropdown .arrow {  }

    #userActions #loginDropdown > div,
    #userActions #registrationDropdown > div {
        position:relative; }


/********** User registration password strength *********/
.userRegistration #password-strength-holder,
#password #password-strength-holder{
    width:100px;
    height:8px;
    margin-left:50px;
    margin-top:5px;
    background-color: #d1e0e0;
}

#password #password-strength-holder{
    margin-left:0;
}

.userRegistration #password-strength-holder span,
#password #password-strength-holder span {
    width:0;
    height:8px;
}

/******** Profile Link ********/

#userControls {
    display:flex;
    height:70px; }

#userControls .button {
    display:inline-block;
    /*padding:20px 20px 0;*/
    /*height:70px;*/
    padding-top:20px;
}

    #userControls .button.profile {
        padding-right: 20px;
        display: flex;

    }
    #userControls .button.profile .profile-icon-wrp{
        width: 40px;
        height: 40px;
        border: 1px solid #acbbc3;
        border-radius: 20px;
        display: flex;
        flex-direction: column;
        margin-right: 6px;
        justify-content: center;
        background-color: #ebeff2;
    }

    @media(min-width: 1000px) {
        #userControls .button.profile .profile-icon-wrp.hide-default {
            display: none;
        }
    }

    #userLinks #profileLink .profile-icon-wrp{
        width: 80px;
        height: 80px;
        border: 1px solid #acbbc3;
        border-radius: 40px;
        display: flex;
        flex-direction: column;
        margin-right: 10px;
        justify-content: center;
        background-color: #ebeff2;
    }
    #userControls .button.profile .profile-icon-wrp .icon-user{
        display: flex;
        justify-content: center;
        font-size: 18px;
        color: #acbac3;
    }
    #userLinks #profileLink .profile-icon-wrp .icon-user{
        display: flex;
        justify-content: center;
        font-size: 40px;
        color: #acbac3;

    }

    #userControls .button .wrap {
        position:relative; }

        /*#userControls .button .wrap i {*/
        /*    font-size:1.8em; }*/

        #userControls .wrap .badge {
            position:absolute;
            top:-10px;
            right:-10px;
            background:#5B789A;
            font-size:0.8em; }

#userControls .messages,
#userControls .notifications,
#userControls .settings {
    vertical-align:top; }

    #userControls .messages:hover i,
    #userControls .notifications:hover i,
    #userControls .settings:hover i {
        color:#40454a; }

#userControls .profile {
    padding-top:13px; }

    #userControls .profile:hover {
        z-index:9999;
        background:url('../images/arrowOverlay.png') 50% 55px no-repeat; }

    #siteHeader.blank #userControls .profile:hover {
        background: transparent; }

    #userControls .profile .userThumb {
        height:45px;
        width:45px;
        margin:0 0.5em 0 0;
        float:left; }

    #userControls .profile .linkToProfile {
        height:45px;
        float:left;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    #userLinks #profileLink .linkToProfile {
        height: auto;
        /*min-height: 45px;*/
    }

        #userControls .profile .linkToProfile a {
            display:block;
            font-family:'Roboto Light', 'robotolight', sans-serif;
            padding: 0 0.5em;
        }

    #userControls .profile .linkToProfile a [class^=icon-] {
        padding: 0 0.5em 0 0;
    }

#userControls .profile .linkToProfile a p {
            margin: 0;}


/******** Profile Dropdown ********/

#userControls .profile #userLinks {
    min-width: 200px;
    max-width: 300px;
    position:absolute;
    top:73px;
    /*left:0;*/
    right:0;
    padding:1em;
    margin:1em 0 1em 2.3em;
    background:#f5f6f7;
    /*border:1px solid #dfe5eb;*/
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;
    box-shadow:0 3px 3px #333;
    visibility:hidden;  }

    #userControls .profile:hover #userLinks {
        visibility:visible;
        z-index:9998; }

    #userControls .profile #userLinks .arrow {
        position:absolute;
        top:-12px;
        right:0;
        height:12px;
        width:100%; }


/*** Profile Link ***/

#userControls #profileLink {
    /*float:left;
    width:33%;*/ }

#userControls #profileLink p{
    color: #3B6297;
}

    #userControls #profileLink .userThumb {
        display: inline-block;
        width:80px;
        height:80px;
        margin:0 1em 0 0; }

    @media (min-width:320px) {

        #userControls #profileLink .userThumb {
            /*width:90px;
            height:90px;*/ }

    }

    @media (min-width:1300px) {

        #userControls #profileLink .userThumb {
            /*width:100px;
            height:100px;*/ }

    }

    #userControls #profileLink .linkToProfile {
        position:relative;
        display:inline-block;
        /* height:135px;*/
        min-width:160px;
        width: 100%;}

        #userControls #profileLink .linkToProfile .username {
            font-size:1.8em;
            font-family:'Roboto Light', 'robotolight', sans-serif; }

        @media (min-width:320px) {

            #userControls #profileLink .linkToProfile .username {
                font-size:1.4em; }

        }

        @media (min-width:1300px) {

            #userControls #profileLink .linkToProfile .username {
                font-size:1.8em; }

        }

        #userControls #profileLink .linkToProfile p {
             margin: 0;}

        #userControls #profileLink .linkToProfile .links {
            position:inherit;
            bottom:0;
            left:0;
            padding: 0;}

            #userControls #profileLink .linkToProfile .links a {
                width: 100%;
                margin:0;
                font-size:1em;
                display:block;
                padding: .5em;}

                #userControls #profileLink .linkToProfile .links a:hover {
                    background: #dfe5eb;
                    /*color:#475d7b !important;*/ }

    #userLinks .mobile-logout {
        display: none;
    }

    @media (max-width: 599px) {
        #userLinks #profileLink .linkToProfile .desktop-logout {
            display: none !important;
        }

        #userLinks .mobile-logout {
            display: block;
            width: 100%;
            height: 30px;
            text-align: center;
            line-height: 30px;
            text-transform: capitalize;
            border-top: 1px solid #dfe5eb;
        }
    }

/*** Link Lists ***/

#userControls #furtherLinks {
    /*float:right;
    width:67%;*/
    width: auto; }

    #userControls #furtherLinks ul {
        /*float:left;
        width:33%;*/
        margin:0;
        border-left:1px solid #dfe5eb; }

    #userControls #furtherLinks ul li {
        margin:0 0.5em;
        padding:0 0.5em; }

        #userControls #furtherLinks ul li:hover {
            background:#dfe5eb; }

        #userControls #furtherLinks ul li a {
            display:inline-block;
            /*width:70%;*/
            /*color:#1a1c1e;*/
            padding:0.5em 1em 0.5em 0; }

        #userControls #furtherLinks ul li span {
            display:inline-block;
            width:40px; }

        #userControls #furtherLinks ul li:hover .badge {
            background:#617ca3;  }


        @media (min-width: 992px) {

            #userControls #furtherLinks ul li a {
                /*width:70%;*/ }
        }

        @media(min-width: 758px) {
            #userControls #furtherLinks {
                /*width: 600px;*/
            }
        }

        @media (min-width: 1001px) {
            #userControls #furtherLinks {
                /*width: 700px;*/
            }
        }

        @media(max-width: 758px) {
        }


        @media (min-width: 1300px) {
        }


/******** Settings ********/

/*#userControls .button > i,*/
#userControls .button a.dropdown-toggle > i,
#userControls .button ul.dropdown-menu li a > i {
    font-size:1.8em;
    vertical-align: bottom; }

.userLinks.dropdown-menu {
    left:auto;
    right:0; }


/******** jQuery UI AutoComplete ********/

ul.ui-autocomplete {
  background:#fff;
  border:1px solid #888;
  border-radius:5px;
  margin-top:2px;
  width: 10px; }


/*********************************************************/
/*              Slider                                   */
/*********************************************************/

#indexSlider #slider {
    margin:0;
    position:relative; }

/******** Content ********/

#indexSlider .swiper-container {
    min-height:300px;
    max-height:400px;
    width:100%;
    height:100%; }

@media (min-width:1300px) {

    #indexSlider .swiper-container {
        height:400px; }

    #indexSlider .text {
        font-size: 100%; }

}

    #indexSlider .swiper-container .content-slide {
        padding:0;
        min-height:300px;
        height:100%;
        max-height:400px;
        position:relative; }

#indexSlider .mediaThumb {
    border-radius:0;
    -moz-border-radius:0;
    -webkit-border-radius:0; }

#indexSlider .preview,
#indexSlider .text {
    float:left; }

#indexSlider .preview {
    width:100%;
    height:100%;
    padding:0; }

    #indexSlider .preview img {
        height:100%; }

#indexSlider .text {
    position:absolute;
    top:0;
    bottom:0;
    right:0;
    width:40%;
    color:#fff;
    padding:1em 4.5em 2em 2em;
    background:rgba(59,98,151,.7); }

    #indexSlider .text h2,
    #indexSlider .text p {
        color:#fff; }


/******** Arrows ********/

#slider .arrow-right,
#slider .arrow-left {
    text-shadow:0 0 2px #000; }

#slider .arrow-right:hover i,
#slider .arrow-left:hover i {
    color:#fff; }


/******** Pager ********/

#indexSlider .pagination {
    position:absolute;
    bottom:10px;
    left:0;
    right:0;
    z-index:20;
    display: flex;
    justify-content: center;}


/*********************************************************/
/*              Sidebar                                  */
/*********************************************************/

#siteSidebar, #siteSidebarMobile {
    padding:0 0 15em;
    background:#eceff2;
    /*background: -moz-linear-gradient(top, rgba(236,239,242,1) 90%, rgba(236,239,242,0.5) 95%, rgba(236,239,242,0) 100%); /* FF3.6+ */
    /*background: -webkit-gradient(linear, left top, left bottom, color-stop(90%,rgba(236,239,242,1)), color-stop(95%,rgba(236,239,242,0.5)), color-stop(100%,rgba(236,239,242,0))); /* Chrome,Safari4+ */
    /*background: -webkit-linear-gradient(top, rgba(236,239,242,1) 90%,rgba(236,239,242,0.5) 95%,rgba(236,239,242,0) 100%); /* Chrome10+,Safari5.1+ */
    /*background: -o-linear-gradient(top, rgba(236,239,242,1) 90%,rgba(236,239,242,0.5) 95%,rgba(236,239,242,0) 100%); /* Opera 11.10+ */
    /*background: -ms-linear-gradient(top, rgba(236,239,242,1) 90%,rgba(236,239,242,0.5) 95%,rgba(236,239,242,0) 100%); /* IE10+ */
    /*background: linear-gradient(to bottom, rgba(236,239,242,1) 90%,rgba(236,239,242,0.5) 95%,rgba(236,239,242,0) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eceff2', endColorstr='#00eceff2',GradientType=0 ); /* IE6-9 */
}

#siteSidebar.vmp-mobile {
    padding: 0;
}


/******** Main Navigation ********/

#siteNav {
    /*border:1px solid #acbbc3;
    border:1px solid #c5d0d5;*/ }

#siteNav h2 {}

#siteNav ul {
    margin:0; }

    #siteNav li {
        position:relative;
        /*background:#c5d0d5;*/
        background:#dfe5eb;
        /*border-top:1px solid #acbbc3;*/
        border-top:1px solid #c5d0d5; }

        #siteNav li a {
            color:#1a1c1e;
            padding:0.5em 1em;
            display:block;
            font-size:1.2em;
            font-family:'Roboto Light', 'robotolight', sans-serif; }

    #siteNav li:first-child {
        border-top:none; }

    #siteNav li:hover {
        background:#426DA8; }

        #siteNav li:hover a {
            color:#fff; }

    #siteSidebar #siteNav li.active,
    #siteSidebarMobile #siteNav li.active{
        /*background: #b3bfcb;*/
        background: #3B6297;
    }

        #siteSidebar #siteNav li.active>.sitemenu-wrap-form button,
        #siteSidebar #siteNav li.active>.sitemenu-submenu-wrap-form>button:last-child,
        #siteSidebarMobile #siteNav li.active>.sitemenu-wrap-form button,
        #siteSidebarMobile #siteNav li.active>.sitemenu-submenu-wrap-form>button:last-child {
            border-right:5px solid #3B6297;
        }

        #siteSidebar #siteNav li.hasSublinks.active,
        #siteSidebarMobile #siteNav li.hasSublinks.active {
            border-right:none
        }
        #siteSidebar #siteNav>ul>li.active>.sitemenu-wrap-form>button,
        #siteSidebar #siteNav>ul>li.active.hasSublinks>.sitemenu-submenu-wrap-form>button,
        #siteSidebar #siteNav>ul>li.active.hasSublinks>ul>li.active .sitemenu-wrap-form>button,
        #siteSidebarMobile #siteNav>ul>li.active>.sitemenu-wrap-form>button,
        #siteSidebarMobile #siteNav>ul>li.active.hasSublinks>.sitemenu-submenu-wrap-form>button,
        #siteSidebarMobile #siteNav>ul>li.active.hasSublinks>ul>li.active .sitemenu-wrap-form>button {
            color:#FFFFFF;
        }
        #siteNav li.active a {
            color:#fff;  }

    #siteNav li p {
        margin:0; }

    #siteNav li .arrow {
        position:absolute;
        top:0;
        right:0.25em;
        width:20px;
        height:38px;
        line-height:38px;
        padding:0; }

/*** Site nav horizontal ***/

#siteNavHorizontal {
    background: #dfe5eb; }

#siteNavHorizontal ul {
    margin-bottom: 0;
    display: table;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: stretch;
    align-content: center;
    margin-left: 0;
    padding-left: 0; }

    #siteNavHorizontal ul li {
        position:relative;
        /*border-top:5px solid transparent;*/
        background:#dfe5eb;
        display: table-cell;}

    #siteNavHorizontal ul li form{
        background: none;
        padding: 0;
        margin: 0;
        border: 0;
        width: 100%;
    }

        #siteNavHorizontal ul li form button {
            background: transparent;
            color: #3B6297;
            padding: 0.5em 1em;
            font-size: 1.2em;
            font-family: 'Open Sans Regular', 'open_sansregular', sans-serif;
            width: 100%;
            height: 50px;
            border: 0;}

        #siteNavHorizontal ul li:hover>form>button {
            color:#fff; }

    #siteNavHorizontal ul li:focus-within {
        /*background:#3B6297;*/
    }

    #siteNavHorizontal ul li.hasSublinks form button:focus,
    #siteNavHorizontal ul li.hasSublinks form button:focus i:before {
        color: #FFFFFF;
        background-color: #3B6297;
    }



    #siteNavHorizontal ul li form button:focus {
        color:#fff;
        background-color: #3B6297;
    }

    #siteNavHorizontal ul li.active {
        background:#3B6297;
    }

        #siteNavHorizontal ul li.active>form>button {
            color:#fff;
            background-color: #3B6297;
        }

        #siteNavHorizontal ul li.active>form>button:focus {
            color: #3B6297;
            background-color: #dfe5eb;
            box-shadow: inset 0px 0px 0px 5px #3B6297;
        }

        #siteNavHorizontal ul .hasSublinks form{
            display: flex;
        }
        #siteNavHorizontal ul .hasSublinks .open-sub-menu{

        }

        #siteNavHorizontal ul .hasSublinks .open-sub-menu i{

        }

        #siteNavHorizontal .sublinks li form button{
            color: #3B6297;
        }
        #siteNavHorizontal .sublinks li:hover form button{
            color: #fff !important;
        }

    #siteNavHorizontal li p {
        margin:0; }

    #siteNavHorizontal ul li form button i {
        /*position:absolute;
        top:0;
        right:0.5em;
        height:38px;
        line-height:38px;*/
        padding:0 !important; }

    #siteNavHorizontal ul li.active form button i {
      top: -5px;
    }

    #siteNavHorizontal ul li.hasSublinks form button:focus i:before {
        color: #3B6297;
        background-color: #dfe5eb;
    }

/*** Site nav horizontal end ***/

/*** Sublinks ***/

#siteNav .hasSublinks ul li {
    padding-left:1em; }

    #siteNav .hasSublinks:hover ul a {
        color:#1a1c1e; }

#siteNav .hasSublinks.active {
    border-right:none; }

    #siteNav .hasSublinks.active ul {
        visibility:visible;
        height:100%; }

        #siteNav .hasSublinks.active ul li a {
            color:#1a1c1e; }

        #siteNav .hasSublinks.active ul li.active a {
            color:#fff; }

        #siteNav .hasSublinks.active p {
            border-right:5px solid #617ca3; }

#siteNav .hasSublinks ul li:first-child {
    border-top:1px solid #acbbc3; }


/*** Horizontal sublinks ***/

#siteNavHorizontal .hasSublinks a {
    padding-right:1.8em; }

#siteNavHorizontal .hasSublinks ul {
    position:absolute;
    left:0;
    top:100%;
    border:1px solid #c5d0d5;
    border-top:none;
    box-shadow:0 3px 3px #333;
    visibility: hidden;
}

    #siteNavHorizontal .hasSublinks:hover ul {
        /*left:0;*/
        z-index:99;
        visibility: visible;
    }

#siteNavHorizontal .hasSublinks ul li {
    white-space:nowrap;
    display:block;
    padding-left:0;
    width:-moz-available;
    border-top:1px solid #c5d0d5; }

    #siteNavHorizontal .hasSublinks:hover ul a {
        color:#1a1c1e; }

#siteNavHorizontal .hasSublinks.active {
    border-right:none; }

    #siteNavHorizontal .hasSublinks.active ul {
        /*visibility:visible;
         height:100%; */ }

        #siteNavHorizontal .hasSublinks.active ul li a {
            color:#1a1c1e; }

        #siteNavHorizontal .hasSublinks.active ul li.active a {
            color:#fff; }

/*
        #siteNav .hasSublinks.active p {
            border-right:5px solid #617ca3; }
*/

#siteNavHorizontal .hasSublinks ul li:first-child {
    border-top:1px solid #acbbc3; }

/******** Clients ********/
#clientShare .checkbox input[type="checkbox"]
{
    margin-left: 0;
}
/******** Categories ********/

#categoryLinks,
#categoryLinksMobile {
    margin:1em; }

    #categoryLinks .panel,
    #categoryLinks .panel li,
    #categoryLinks .panel li:first-child,
    #categoryLinksMobile .panel,
    #categoryLinksMobile .panel li,
    #categoryLinksMobile .panel li:first-child {
        border:0; }

    #categoryLinks li,
    #categoryLinks li.panel,
    #categoryLinks li ul li,
    #categoryLinksMobile li,
    #categoryLinksMobile li.panel,
    #categoryLinksMobile li ul li {
        position:relative;
        margin:0;
        border-radius:0;
        -moz-border-radius:0;
        -webkit-border-radius:0;
        border-top:0;
        border-right:0;
        border-bottom:1px solid #dfe5eb;
        border-left:0;
        background:transparent;
        box-shadow:none; }

        #categoryLinks li:first-child {
            /*border-top:1px solid #dfe5eb;*/
        }

        #categoryLinks li a,
        #categoryLinksMobile li a {
            display:block;
            padding:0.5em 1em 0.5em 0.5em;
            color:#3B6297;
            overflow: hidden;
            text-overflow: ellipsis; }

        #categoryLinks li p,
        #categoryLinksMobile li p {
            margin:0; }

        #categoryLinks li .arrow,
        #categoryLinksMobile li .arrow {
            position:absolute;
            top:0;
            right:0;
            width:20px;
            height:32px;
            line-height:32px;
            padding:0;
            text-align:right; }

    #categoryLinks li ul li,
    #categoryLinksMobile li ul li {
        border-bottom:0;
        padding-left:1em; }

#categoryLinks a:hover,
#categoryLinksMobile a:hover {
    color:#000; }

    #categoryLinks .bottom,
    #categoryLinksMobile .bottom,
    #liveStreamLinks .bottom,
    #channelLinks .bottom {
        margin-top: 20px;
    }



/******** Tags ********/

#tagLinks {
    margin:1em; }


/******** Channels ********/

#channelLinks {
    margin:1em; }

    #channelLinks .channelLink {
        margin:0 0 0.5em;
        display: block;
        border: 5px solid transparent;
        overflow: hidden;
    }

    #channelLinks .channelLink:focus {
        border-color:#3B6297;
    }

    #channelLinks .channelLink .channelThumb {
        position:relative;
    }
    #channelLinks .channelThumb>a {
        display: flex;
        /*border: 5px solid transparent;*/
    }

        #channelLinks .channelThumb p {
            position:absolute;
            bottom:0;
            left:0;
            color:#fff;
            margin:0;
            padding:0.2em 0.5em;
            display:block;
            width:100%;
            background:rgba(59,98,151,.7); }

            #channelLinks .channelThumb .hasPrice {
                height:45px;
                width:40px;
                padding:0.3em 0.5em 0.5em 0.3em; }

                #channelLinks .channelThumb .hasPrice i {
                    font-size:1em;
                    color:#fff;
                }

/******** Manage Media Markers ********/
#addChannelMedia .markers,
#addGroupMedia .markers,
#addAlbumMedia .markers {
    float: left; }

#addChannelMedia .markers *,
#addGroupMedia .markers *,
#addAlbumMedia .markers * {
    padding-right: 10px; }

/******** Livestreams ********/

#liveStreamLinks {
    margin:1em; }

#liveStreamLinks .liveStreamLink {
    margin:0 0 0.5em;
    display: block;
    border: 5px solid transparent;
    overflow: hidden;
}

#liveStreamLinks .liveStreamLink:focus {
    border-color:#3B6297;
}

#liveStreamLinks .liveStreamLink .liveStreamThumb {
    position:relative;
}
#liveStreamLinks .liveStreamThumb>a {
    display: flex;
}


/*********************************************************/
/*              Alerts                                   */
/*********************************************************/

#alerts {
    display: block;
    z-index: 10;
    padding-top:1em;
    background:#fdfdfd;
}

.alert-danger:before {
    font-family: "FontAwesome", sans-serif;
    content: "\f071";
    font-size: 2.5em;
    width: auto;
    font-weight: 400;
    padding: 0 0.2em;
}

.alert-warning:before {
    font-family: "FontAwesome", sans-serif;
    content: "\f06a";
    font-size: 2.5em;
    width: auto;
    font-weight: 400;
    padding: 0 0.2em;
}

.alert-info:before {
    font-family: "FontAwesome", sans-serif;
    content: "\f05a";
    font-size: 2.5em;
    width: auto;
    font-weight: 400;
    padding: 0 0.2em;
}

.alert-success:before {
    font-family: "FontAwesome", sans-serif;
    content: "\f058";
    font-size: 2.5em;
    width: auto;
    font-weight: 400;
    padding: 0 0.2em;
}

/*.alert-info:before {
    content: "i";
    border: 1px solid;
    font-size: 2em;
    width: auto;
    margin-right: 15px;
    font-weight: 400;
    border-radius: 20px;
    padding: 0 0.5em;
}
.alert-success:before {
    content: "\2713";
    border: 1px solid;
    font-size: 2em;
    width: auto;
    margin-right: 15px;
    font-weight: 400;
    border-radius: 20px;
    padding: 0 0.22em;
}*/


/*********************************************************/
/*              Content                                  */
/*********************************************************/

#siteContent {
    background:#fdfdfd;
    padding:0 3em 2em; }

@media (max-width: 576px) {
    #siteContent {
        background:#fdfdfd;
        padding:0 1em 2em; }
}

#siteHeader.blank #siteContent {
    background:#fdfdfd;
    padding:0 1.5em 2em;
    min-height:700px; }


/*********************************************************/
/*              Footer                                   */
/*********************************************************/

#siteFooter {
    /*background:#788d96;*/
    border-top:1px solid #dfe5eb;
    background: #eceff2;
    position:relative; }

#siteFooter a {
    color:#475d7b;
    /*padding: 0 0.5em;*/
}

/*#language {
    position:absolute;
    bottom:5em;
    right:3%; }*/

/******** ViMP Footer ********/

#vimpFooter {
    font-size:0.9em;
    padding:0.5em 1em;
    background:#dfe5eb;
    display: flex;
    justify-content: center;

}

#vimpFooter .copy {
    color:#979B9F;
    /* margin:0 auto; */
}

#vimpFooter a {
    color:#517588; }


@media (min-width: 320px) {

  #vimpFooter .copy {
    /* min-width: 940px;
    max-width: 970px; */ }

}

@media (min-width: 1300px) {

  #vimpFooter .copy {
    /*max-width: 1270px;*/ }

}

/*

@media (min-width: 1600px) {

  .container {
    max-width: 1570px; }

}

*/


/******** Language ********/

#language i {
    display:inline-block;
    vertical-align:bottom; }

#language>.btn-group {
    margin-bottom: 10px;
    margin-left: 10px;
}





/****************************************************************/
/*              MEDIA                                           */
/****************************************************************/

.mediaListing {
    position:relative; }

    .mediaListing .callToAction {
        position:absolute;
        top:0;
        right:0; }


/******** Has Price ********/

.hasPrice {
    position:absolute;
    top:0;
    left:0;
    display:inline-block;
    padding:0.75em;
    background:url('../images/priceTag.png') 100% 0 no-repeat; }

    .hasPrice i {
        position:relative !important;
        top:0 !important;
        left:0 !important;
        padding:0;
        font-size:1.7em;
        background:transparent; }

.hasPrice.bought {
    background:url('../images/priceTagBought.png') 100% 0 no-repeat; }

.channelHasPrice {
    position: absolute;
    padding: .5em;
    z-index: 1;
    width: 45px;
    height: 45px;
    background:url('../images/priceTag.png') 100% 0 no-repeat;
}

.small .channelHasPrice {
    left:0;
}

    .channelHasPrice i {
        position: relative !important;
        top: 0 !important;
        left: 0 !important;
        padding: 0;
        font-size: 1em;
        background: transparent;
        color: white;
    }

.channelHasPrice.bought {
    background:url('../images/priceTagBought.png') 100% 0 no-repeat; }
/******** Vimeo Icon ********/

.icon-vimeo {
    height:26px;
    width:26px;
    background-color: #fff !important;
    padding: 8px 6px 4px 6px !important; }

    .icon-vimeo span {
        display:inline-block;
        height:14px;
        width:14px;
        background-image:url('../images/icon_vimeo-BLK.png');
        background-repeat:no-repeat;
        background-size:contain;
        -moz-background-size:contain;
        -webkit-background-size:contain; }

.mediaThumbs.big .icon-vimeo {
    height:26px;
    width:26px; }

    .mediaThumbs.big .icon-vimeo span {
        height:20px;
        width:20px;
        vertical-align:bottom; }

.icon-vimeo-grey {
  height: 15px;
  width: 10px;
  display: inline-block; }

    .icon-vimeo-grey span {
        height:10px;
        width:14px;
        margin-top: 5px;
        float: left;
        background-image:url('../images/icon_vimeo-GREY.png');
        background-repeat:no-repeat;
        background-size:contain;
        -moz-background-size:contain;
        -webkit-background-size:contain; }


/******** OpenID Icon ********/

.icon-openID {
    height:20px;
    width:20px;  }

    .icon-openID span {
        display:inline-block;
        height:23px;
        width:20px;
        vertical-align:middle;
        background-image:url('../images/icon_openID-WHT.png');
        background-repeat:no-repeat;
        background-size:contain;
        -moz-background-size:contain;
        -webkit-background-size:contain; }

.input-group-addon .icon-openID span {
    background-image:url('../images/icon_openID.png');
    height:20px;
}

/*********************************************************/
/*              Lists & Thumbs                           */
/*********************************************************/

/******** Thumbs (Big) ********/

ul.mediaThumbs.big{
    margin-bottom: 0;
}
.mediaThumbs.big > li {
    position:relative;
    margin-bottom:20px; }

.mediaThumbs.big > li a {
}

/*** Preview ***/

.mediaThumbs.big .mediaCover {
    position:relative;
    height:auto;
    overflow:hidden; }

    .mediaThumbs.big .mediaCover h3 {
        position:absolute;
        bottom:0;
        left:0;
        margin:0;
        padding:0.25em 0.5em;
        color:#fff;
        display:block;
        width:100%;
        height:50px;
        overflow:hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size:1.2em;
        line-height:1.2em;
        background:rgba(0,0,0,.7); }

    .mediaThumbs.big li:hover .mediaCover h3 {
        display:none; }

    .mediaThumbs.big .mediaCover i {
        padding:0;
        background:transparent; }

.mediaThumbs.big .hasPrice {
    height:60px;
    width:60px; }

    .mediaThumbs.big .hasPrice i {
        font-size:1.2em; }


/*** Hover ***/

.mediaThumbs.big .mediaOverlay {
    position:absolute;
    bottom:5px;
    left:11px;
    right:11.5px;
    height:0;
    /*width:91%;*/
    padding:0;
    overflow:hidden;
    visibility:hidden;
    background:rgba(0,0,0,.7);
    -webkit-transition:height 1s;
    -moz-transition:height 1s;
    -o-transition:height 1s;
    transition:height 1s;
    color:#fff; }
    .mediaThumbs.big>li>a {
        border: 5px solid transparent;
    }
    .mediaThumbs.big>li>a:focus {
        border-color: #3B6297;
    }
    .mediaThumbs.big li:hover .mediaOverlay {
        visibility:visible;
        height: calc(100% - 10px); }

    .mediaThumbs.big .mediaOverlay a {
        height:100%;
        padding:1em;
        display:block; }

    .mediaThumbs.big .mediaOverlay h3 {
        color:#fff;
        margin:0;
        line-height:1.2em;
        font-size: 1.2em;
        height:23px;
        overflow:hidden;
        padding: 5px 0 0 10px; }

    .mediaThumbs.big .mediaOverlay .text {
        color:#fff !important;
        font-size:0.8em;
        margin:1em 0 0.5em 0;
        overflow:hidden;
        padding: 5px 0 0 10px; }

    .mediaThumbs.big .mediaOverlay .additionalInfo {
      padding: 5px 0 0 10px; }

        @media (min-width: 992px) {

            .mediaThumbs.big .mediaOverlay .text {
                height:0; }

        }

        /*
        @media (min-width: 1600px) {

            .mediaThumbs.big .mediaOverlay .text {
                height:35px; }

        }*/

    .mediaThumbs.big .mediaOverlay .additionalInfo .uploader {
        float:left;
        margin-bottom: 0;
        margin-top: 18px;}

        .mediaThumbs.big .mediaOverlay .additionalInfo .uploader span {
            color:#9eafc7; }

        .mediaThumbs.big .mediaOverlay .additionalInfo .uploader span p {
            margin-bottom: -4px; }

        .mediaThumbs.big .mediaOverlay .additionalInfo .userThumb {
            height:35px;
            width:35px;
            margin-bottom: 0.4em; }

    .mediaThumbs.big .mediaOverlay .additionalInfo .buyMedia {
        float:right;
        margin-top:1em; }

        .mediaThumbs.big .mediaOverlay .additionalInfo .buyMedia .buy {
            margin-right:0.5em;
            background:#617ca3;
            border:1px solid #003f61;
            padding:0.2em 0.5em;
            text-align:center; }

            .mediaThumbs.big .mediaOverlay .additionalInfo .buyMedia .buy i {
                color:#fff; }

    .mediaThumbs.big .mediaOverlay .details {
        position:absolute;
        bottom:1em;
        left:0;
        width:100%;
        opacity:0;
        -webkit-transition:opacity 1s .5s;
        -moz-transition:opacity 1s .5s;
        -o-transition:opacity 1s .5s;
        transition:opacity 1s .5s; }

        .mediaThumbs.big li:focus .mediaOverlay .details,
        .mediaThumbs.big li:hover .mediaOverlay .details {
            opacity:1; }

    .mediaThumbs.big .mediaOverlay .details li {
        float:left;
        text-align:center;
        width:25%;
        padding:0 1em;
        color:#acbbc3; }
    .mediaThumbs a {
        display: block;
        overflow: hidden;
    }

    .mediaThumbs a:focus article {
        background-color: #ffffff;
    }

    .mediaThumb{
        width:100%;
    }

#userActivity a:focus i:before,
.mediaThumbs a:focus i:before {
    color: #3B6297;
}

.mediaThumbs a:focus i.icon-play:before {
    color: #FFFFFF!important;
}

#featured-media-box .mediaThumbs a:focus i:before {
    color: #FFFFFF!important;
}

    @media (min-width:320px) {

        .mediaThumbs.big .mediaOverlay .details {
                font-size:0.9em; }

            .mediaThumbs.big .mediaOverlay .details li {
                    padding: 0 0.75em; }

    }

    @media (min-width:1300px) {

        .mediaThumbs.big .mediaOverlay .details {
                font-size:0.8em; }

            .mediaThumbs.big .mediaOverlay .details li {
                    padding: 0 0.75em; }

    }

    /*
    @media (min-width: 1600px) {

        .mediaThumbs.big .mediaOverlay .details {
                font-size:0.9em; }

            .mediaThumbs.big .mediaOverlay .details li {
                    padding: 0 1em; }

    }*/

.mediaThumbs .mediaCover .mediaThumb {
    width: 100%;
}

/******** Thumbs (Small) ********/

.mediaThumbs.small {
    padding: 0 2px;
}

.mediaThumbs.small article {
    overflow:hidden; }

.mediaThumbs > li:focus > article {
    border: 0.2px solid #c7c7c7; }

.mediaThumbs.small .mediaCover {
    position:relative; }

    .mediaThumbs.small .mediaCover .mediaThumb {
        width: 100%;}

    .mediaThumbs.small .mediaCover i {
        position:absolute;
        bottom:0.5em;
        right:0.5em; }

.mediaThumbs.small .mediaCover .uploader {
    position:absolute;
    bottom: 0.1em;
    left:0.5em; }

    .mediaThumbs.small .mediaCover .uploader span {
        font-size:0.9em;
        color:#fff;
        text-shadow:0 0 2px #000; }

    .mediaThumbs.small .mediaCover .uploader span p {
        margin-bottom: 0; }

.mediaThumbs.small .mediaCover .userThumb {
    height:35px;
    width:35px;
    margin-bottom: 0.2em;}

.mediaThumbs.small h3 {
    margin:auto;
    padding: 1em 0 1em 0.4em;
    min-height:20px;
    height:fit-content;
    line-height:0.7em;
    font-size:1.2em;
    overflow:hidden;
    text-overflow: ellipsis;
    white-space: nowrap; }

.mediaThumbs.small .additionalInfo {
    padding:0.5em 1em 0; }

    .mediaThumbs.small .additionalInfo p {
        float:left;
        color:#acbbc3; }

    .mediaThumbs.small .additionalInfo .price {
        padding: 0 0.5em;
        margin-bottom: 0;
        line-height: 20px;
        margin-left: 8px;
    }
    .mediaThumbs.big .additionalInfo .price {
        margin-left: 8px;
    }

.mediaThumbs.small .details {
    font-size:0.9em;
    background: #f9fafb;
    border-top: 1px solid #acbbc3;
    display: flex;
    /*box-shadow:inset 0 1px 2px #acbbc3;*/
    /*border-radius:0 0 0.5em 0.5em;
    -moz-border-radius:0 0 0.5em 0.5em;
    -webkit-border-radius:0 0 0.5em 0.5em;*/
}

    .mediaThumbs.small .details li {
        float:left;
        width:33%;
        padding:0.3em 0.5em;
        color:#3B6297;
        font-size: 0.9em;
        text-align:center; }

.mediaThumbs.small .hasPrice {
    height:50px;
    width:50px;
    padding:0.5em; }

    .mediaThumbs.small .hasPrice i {
        font-size:1.2em; }


/*** Hover ***/

.mediaThumbs.small .mediaCover .links {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    padding:15% 0 0;
    text-align:center;
    background:rgba(0,0,0,.7);
    visibility:hidden;
    opacity:0;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out; }

    .mediaThumbs.small article:hover .links {
        visibility:visible;
        opacity:1; }

    .mediaThumbs.small .mediaCover .links p {
        text-align:center;
        display:inline-block;
        padding:0.75em 1em; }

        .mediaThumbs.small .mediaCover .links p i  {
            position:relative;
            top:0;
            left:0;
            padding:0;
            font-size:1.8em;
            background:transparent; }


/******** Thumbs (Small) with black bars ********/
.list-contain {
    height: auto;
    max-height: 350px;
}

.groupThumbs-contain {
    display: flex;
    flex-wrap: wrap;
}

.article-contain {
    height: 100%;
}

.elearningThumbs li article {
    border: 1px solid #3B6297;
    margin: 5px;
}

.mediaCover-contain {
    display: flex;
    justify-content: center;
}

.groupThumbs.big .mediaCover-contain,
.groupThumbs.list .mediaCover-contain{
    height: 100%;
}

.groupThumbs.small .mediaCover-contain {
    max-height: 80%;
}

.mediaThumb-contain {
    height: auto;
    object-fit: contain;
    background-color: #000000;
}

.mediaThumb-gray {
    background-color: #eceff2;
}

.groupThumbs.list.groupThumbs-contain li {
    max-height: 160px;
}

.channelThumbs-contain.small .mediaCover {
    background-color: black;
}

@media (max-width: 576px) {
    .groupThumbs.big.groupThumbs-contain .list-contain {
        height: 200px;
        margin: 5px 0;
    }

    .groupThumbs.small.groupThumbs-contain .list-contain {
        height: 250px;
        margin: 5px 0;
    }
}

.elearningThumbs li {
    padding-right: 0;}

    .elearningThumbs.list .mediaCover i {
        position:absolute;
        bottom:0.5em;
        left:0.5em; }

    @media (min-width: 576px) {
        .mediaThumbs li,
        .groupThumbs li,
        .albumThumbs li,
        .channelThumbs li,
        .playlistThumbs li {
            padding-right: .5em;
        }

        .groupThumbs li {
            border-right: 5px solid transparent;
        }
    }

/*********************************************************/
/*              Detail                                   */
/*********************************************************/

@media (min-width: 1300px) {

  .mediaDetail article {
    position:relative; }

    .mediaDetail aside {
        /*position:absolute;
        top:0;
        right:0;*/
    }

}


/******** Player ********/

.mediaDetail #mediaPlayer {
    margin-bottom:1em; }

#progressbarContainer{
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    position:relative;
    /*float:left;*/
    width:100%;
    height:620px;
    margin:0;
    padding:0;
    background-color:#dfe5eb;
    /*text-shadow: -1px 0 #666;*/
    overflow:hidden;
    z-index:2;
    text-align: center;
}
#progressbar{
  width: 50%;
  margin: auto;
  background: #fff;
  border-radius: 15px;
  border: 1px solid gray;
}
#progressMsg{
    margin-top: 150px;
    font-size: 2em;
    margin-bottom: 20px;
    color: #617ca3;
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 30px;
}
#uploadedMsg{
    font-size: 2em;
    color: #617ca3;
    width: 70%;
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
}

#progressbarContainer #precentage{
  font-size: 1.3em;
  color: #617ca3;
  margin: 0;
}

.mediaDetail #mediaPlayer .ui-progressbar-value {
    background: #617ca3;
    margin: 0;
}

#playercomm-url {
    display:none; }

.player_photo {
    width: 100%;
    /*height: 100%;*/
}

.player_photo_pagination {
    width: 100%;
    height: 95%;
}

.viewMedia.vmp-grid #mediaPlayer #videojs_playerContainer {
    aspect-ratio: auto !important;
    background: #000;
}

.viewMedia.vmp-grid #mediaPlayer #videojs_playerContainer > .video-js {
    width: 100% !important;
    height: 100% !important;
    overflow: hidden;
}

.viewMedia.vmp-grid #mediaPlayer #videojs_playerContainer {
    aspect-ratio: auto !important;
    background: #000;
}

.viewMedia.vmp-grid #mediaPlayer #videojs_playerContainer .video-js .vjs-tech {
    object-fit: contain !important;
    object-position: center center !important;
}

.viewMedia.vmp-grid #mediaPlayer #videojs_playerContainer .video-js .vjs-poster {
    background-size: contain !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

/******** Web Player Responsive (ocean only) ********/
@media (max-width: 576px){
    .homePage #mediaPlayer .p_videoContainer{
        height: 151px !important;
    }
    .mediaForm #fileDetails .p_videoContainer{
        height: 250px !important;
    }
    .viewMedia #mediaPlayer .p_videoContainer{
        height: 151px !important;
    }
}

@media (min-width: 576px) and (max-width: 768px){
    .homePage #mediaPlayer .p_videoContainer{
        height: 261px !important;
    }
    .mediaForm #fileDetails .p_videoContainer{
        height: 261px !important;
    }
    .viewMedia #mediaPlayer .p_videoContainer{
        height: 261px !important;
    }
}

/******** Details ********/

.viewMedia .details > div,
.viewChannel .details > div,
.viewAlbum .details > div,
.viewGroup .details > div {
    margin-bottom:1em; }


/*** Description ***/

.viewMedia .description,
.viewChannel .description,
.viewAlbum .description,
.viewGroup .description {
    margin-bottom:1.5em; }


/*** Show More Link ***/

.show-more-height {
    height:67px;
    overflow:hidden; }

.show-more {
    position:relative;
    width:100%;
    height:20px;
    text-align:center;
    cursor:pointer;
    box-shadow:0 -10px 10px #fdfdfd;
    background:url('../images/lineGrey.png') 0 50% repeat-x; }

.show-more span {
    color:#fff;
    font-size:0.8em;
    padding:0.5em 1em;
    background:#acbbc3;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em; }


/*** Statistics ***/

.albumDetail .statistics,
.mediaDetail .statistics {
    float:left;
}

    .albumDetail .statistics li,
    .mediaDetail .statistics li,
    .liveStreamDetail .statistics li {
        float:left;
        padding:0 1em 0 0;
        /*color:#acbbc3;*/
        color: #3B6297;
    }

.homePage .mediaDetail .statistics {
    float:right;
    margin-top:0.5em; }


/*** Share Buttons ***/

.mediaDetail .shareSocial {
    float:left; }

    .mediaDetail .shareSocial li {
        float:left;
        padding:0 0.5em 0 0; }

        .mediaDetail .shareSocial li a {
            height:20px;
            width:20px;
            text-align:center;
            display:inline-block;
            border-radius:50%;
            -moz-border-radius:50%;
            -webkit-border-radius:50%; }

        .mediaDetail .shareSocial li a i {
            color:#fff; }

        .twitter,
        .googleplus,
        .facebook{
            /*background:#4e69a2;*/
            background-color: transparent;
            border: 1px solid #3B6297;
        }
        .twitter .icon-twitter:before,
        .googleplus .icon-google-plus-sign:before,
        .googleplus .icon-google-plus:before,
        .facebook .icon-facebook:before {
            color: #3B6297;
        }

            .facebook:hover,
            .facebook:focus {
                background:#4e69a2;
                border: 1px solid transparent;
            }
            .facebook:hover .icon-facebook:before,
            .facebook:focus .icon-facebook:before {
                color:#FFFFFF;
            }

        .twitter:hover,
        .twitter:focus {
            background:#32bbef;
            border: 1px solid transparent;
        }

            .twitter:hover .icon-twitter:before,
            .twitter:focus .icon-twitter:before{
                color: #FFFFFF;
            }

        .googleplus:hover,
        .googleplus:focus {
            background:#e24b40;
            border: 1px solid transparent;
        }
        .googleplus:hover .icon-google-plus-sign:before,
        .googleplus:hover .icon-google-plus:before,
        .googleplus:focus .icon-google-plus-sign:before,
        .googleplus:focus .icon-google-plus:before {
                color: #FFFFFF;
        }


/*** Shared ***/

.mediaDetail .shared {
    padding:0.5em 0 1em; }


/*** Uploader ***/

.mediaDetail .uploader {
    float:left; }

.mediaDetail .uploader li {
    display:table-cell;
    padding:0 0.5em 0 0;
    color:#acbbc3; }

.mediaDetail .uploader li a p {
    margin-bottom: 0.2em; }

.mediaDetail .uploader i {
    font-size:0.5em;
    margin-right:0.5em;
    vertical-align:middle; }

.mediaDetail .uploader .userThumb {
    height:35px;
    width:35px;
    margin-bottom: 0.3em;}


/*** Action Nav ***/

.viewMedia #actionNav {
    float:left;
}

.viewGroup #actionNav {
    float:left;
    margin-top:0.5em; }

.viewGroup  #actionNav a {
    background-color: #fff; }

/******** Share & Buy ********/

.mediaDetail .details .buttonpane {
    float:right;
    text-align:left;
    margin:0; }

    .mediaDetail .buttonpane .dropdown-menu {
        left:auto;
        right:0;
        min-width:500px;
        padding:0; }

@media (max-width: 868px) {
    .viewMedia #actionNav {
        float: left;
        width: 100%;
    }
}

@media (max-width: 1300px) {
    .media-actions {
        display: inline-block;
        width: 100%;
    }

    .mediaDetail .details .buttonpane {
        float: none;
    }
}

/*** Share ***/

.mediaDetail .share .bookmarks,
.mediaDetail .share .permalink,
.mediaDetail .share .mail {
    float:left;
    padding:0 0 1em 0; }

.mediaDetail .share .starttime h4 {
    display: inline-block;
    color: #acbbc3; }

.starttime input[type="checkbox"] {
    margin-top: 11px;
    position: relative;
}

.mediaDetail .share .starttime input[type="text"] {
   width: 43px;
   display: inline-block; }

.mediaDetail .share .embedd {
    float:right;
    padding:0 0 4em 1em;
    margin-left:13px;
    border-left:1px solid #acbbc3; }

.mediaDetail .share .left-share-container {
    width:225px !important;
    padding-right:0 !important;
}
    .mediaDetail .share .embedd form {
        padding:0;
        background:transparent; }

    .mediaDetail .share .embedd label {
        font-weight:normal; }

    .mediaDetail .share .embedd strong {
        float:left;
        width:25%; }

    .mediaDetail .share .embedd div {
        float:right;
        width:75%;
        margin:0; }

.mediaDetail .share .embedd .size {
        margin:0.5em 0; }

        .mediaDetail .share .embedd .size input[type="text"],
        .playlist-share-buttons .share .embedd .size input[type="text"] {
            width:65px;
            display:inline-block; }

    .mediaDetail .share .embedd .options label {
        display:block; }

    .shareMedia .embedd textarea[readonly] {
      cursor: text;
    }

    .shareMedia .form-control{
        width:225px;
    }

/******** Buy ********/

.buy {
    position:relative;
    padding:1em;
    border:1px solid #acbbc3;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em; }

    .buy.single {
        margin-bottom:1em; }

    .buy h3 {
        margin-top:0; }

    .buy .period {
        color:#78919e;
        font-size:0.9em; }

#buyModal .modal-dialog {
    width:75%; }


/*** buy or ***/

/*
.mediaDetail .buy .or {
    position:relative;
    left:auto;
    right:auto;
    width:50px;
    vertical-align:middle;
    padding: 0 2.5em;
    background:url('../images/transBLK-80.png') 50% 0 repeat-y;  } */


/*** buy media ***/

.buySingle {
    /*float:left;
    width:48%;*/
    padding:0;
    position:relative; }

    .buySingle .info {
        margin:1em 0;
        height:55px; }

        .buySingle .info .thumb {
            float:left;
            width:auto; }

        .buySingle .info .mediaThumb {
            height:55px; }

        .buySingle .info div {
            float:left;
            width:60%;
            padding:0 0 0 0.5em; }

        .buySingle .info div p {
            margin-bottom:0;
            font-size:0.9em; }

        .buySingle .info div span {
            color:#acbbc3;
            font-size:0.8em; }

    .buySingle button {
        position:absolute;
        bottom:0;
        right:0; }


/*** buy portal access ***/

.buyPortalAccess {
    /*float:right;
    width:48%;*/
    padding:0;
    position:relative; }

    .buyPortalAccess .info {
        margin:1em 0;
        font-size:0.9em;
        /*color:#acbbc3;
        height:55px;*/ }

    .buyPortalAccess button {
        position:absolute;
        bottom:0;
        right:0; }


/*** buy subscription ***/

.buy.subscription .costs ul {
    display:table;
    width:100%; }

.buy.subscription .costs .top {
    font-size:.8em; }

.buy.subscription .title,
.buy.subscription .period,
.buy.subscription .amount,
.buy.subscription .action {
    display:table-cell;
    vertical-align:middle; }

.buy.subscription .title {
    width:40%; }

.buy.subscription .period {
    width:15%; }

.buy.subscription .amount {
    width:15%; }

.buy.subscription .action {
    width:30%;
    text-align:right; }

    .buy.subscription .action button {
        margin:0; }



/*
.buy .wrap {
    display:table; }

.buy .buySingle,
.buy .buyPortalAccess,
.buy .or {
    display:table-cell; } */



.buyMedia,
.shareMedia,
.downloadMedia  {
    position:relative;
    float:left; }

    .buyMedia .wrap,
    .downloadMedia .wrap,
    .shareMedia .wrap {
        position:absolute;
        top:100%;
        right:0;
        border:1px solid #ccc;
        border-radius:0.5em;
        -moz-border-radius:0.5em;
        background:#fff;
        padding:1em;
        display:flex;
        box-shadow:-5px 5px 16px -2px #8a95a6;
        /*animation: 1s fadeOutShare;
        animation-fill-mode: forwards;
        z-index: 99;*/
        visibility: hidden; }

    .downloadMedia .wrap,
    .editRole .wrap {
        display:block;
        width:250px; }

    .buyMedia .wrap {
        display:block;
        width:550px;
    }
    .downloadMedia .wrap table,
    .editRole .wrap table{
        width: 100%; }

    .downloadMedia .wrap table tr td,
    .editRole .wrap table tr td{
        width: 33%;
        height: 30px;}

    .downloadMedia .wrap table tr td input,
    .editRole .wrap table tr td input{
        margin-right: 5px; }

    .downloadMedia .wrap table tr td.file_format,
    .editRole .wrap table tr td.file_format{
        text-align: left;
        color: #475d7b; }

    .downloadMedia .wrap table tr .file_size,
    .editRole .wrap table tr .file_size{
        text-align: center;
        color: #acbbc3; }

    .downloadMedia .wrap table tr .file_ext,
    .editRole .wrap table tr .file_ext {
        text-align: center; }

    .downloadMedia .wrap h4,
    .editRole .wrap h4 {
        display: inline; }

    .buyMedia:hover .wrap,
    .downloadMedia:hover .wrap,
    .editRole:hover .wrap,
    .shareMedia:hover .wrap {
        /*animation: 1s fadeInShare;
        animation-fill-mode: forwards;*/
        visibility: visible;
        z-index:99; }

    /*@keyframes fadeInShare {
      99% { visibility: hidden; }
      100% { visibility: visible; }
    }
    @keyframes fadeOutShare {
      99% { visibility: visible; }
      100% { visibility: hidden; }
    } */

.qrShareContainer p a {
    font-weight: bold;
    text-decoration: underline;
}

/******** Details ********/

.mediaDetail .countdown {
    float:right;
    margin-bottom:1em; }


/******** Details ********/

/*** Tags & Categories ***/

.mediaDetail .tags,
.mediaDetail .categories,
.mediaDetail .map,
.mediaDetail .customFields {
    float:left;
    width:50%;
    margin-bottom:20px; }

.mediaDetail .tags button.tag,
#tagLinks .button-wrap-form button.tag {
    max-width: 220px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

@media only screen and (max-width: 300px) {
    .mediaDetail .tags button.tag,
    #tagLinks .button-wrap-form button.tag {
        max-width: 80vw;
    }
}

.mediaInfoHolder{
  width:50%;
  float:left; }

.mediaInfoHolder .tags,
.mediaInfoHolder .categories,
.mediaInfoHolder .customFields {
  width:100%;
  word-wrap: break-word; }

/*** Map ***/

.mediaDetail .map {
    min-height:100px;
    padding-left:20px;
    float:right; }


/******** Comments ********/

@media (min-width: 992px) {

.mediaDetail .comments {
    min-height:650px; }

}


/******** Playlist & Recomended ********/

.mediaThumbnail {
    margin-bottom:20px; }

    .mediaThumbnail .mediaCover {
        position:relative;
        margin-bottom:0.25em; }

        .mediaThumbnail .mediaCover i,
        .mediaThumbnail .mediaCover .number,
        .mediaThumbnail .mediaCover .active {
            position:absolute;
            bottom:0.5em;
            left:0.5em; }

        .mediaThumbnail .mediaCover .number,
        .mediaThumbnail .mediaCover .active  {
            color:#fff;
            font-size:0.8em;
            padding:0.5em 1em;
            border-radius:50%;
            -moz-border-radius:50%;
            -webkit-border-radius:50%;
            background:rgba(0,0,0,.8);  }

        .mediaThumbnail .mediaCover .active {
            border-radius:1em;
            -moz-border-radius:1em;
            -webkit-border-radius:1em;
            padding:0.5em 1em 0.5em 2.5em; }

            .mediaThumbnail .mediaCover .active i {
                bottom:0.1em;
                background:transparent; }


/*** Playlist ***/

#playlist {
    /*background:#f5f6f7; */
    padding:1em;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;
    margin:0 0 1.5em; }

    #playlist h3 {
        margin-top:0;
        font-size:1.5em; }

    #playlist .scrollbar {
        border:none;
        height:500px; }

/*********************************************************/
/*              Upload                                   */
/*********************************************************/

/******** File Upload ********/

#fileUpload {
    margin-bottom:2em; }

    #fileUpload .fileUpload {
        border:1px dashed #acbbc3;
        background:#fff;
        padding:0.5em;
        border-radius:0.5em;
        -moz-border-radius:0.5em;
        -webkit-border-radius:0.5em;
        text-align:center; }

        #fileUpload .fileUpload fieldset {
            background:#f5f6f7;
            padding:1em;
            border-radius:0.5em;
            -moz-border-radius:0.5em;
            -webkit-border-radius:0.5em; }

        #fileUpload .fileUpload i {
            color:#acbbc3;
            font-size:4em;
            display:block; }

        #fileUpload .fileUpload strong {
            font-size:1.5em; }

    #fileUpload .filename {
        font-weight:normal;
        font-family:'open_sanssemibold', sans-serif;
        text-align:left;
        margin-bottom:0.3em; }

    #fileUpload .uploadProgress .progress {
        float:left;
        width:90%; }

    #fileUpload .uploadProgress .progress-bar:not(.progress-bar-success) {
        background-color:#617ca3; }

    #fileUpload .uploadProgress .cancel {
        float:right;
        width:10%;
        text-align:right; }

        #fileUpload .uploadProgress .cancel i {
            font-size:1.3em; }

    #fileUpload .progressInfo {
        margin-top:20px; }

        #fileUpload .progressInfo .size {
            float:left;
            font-size:0.8em;
            text-align:left;
            width:50%; }

            #fileUpload .progressInfo .size span {
                font-weight:normal;
                font-family:'open_sanssemibold', sans-serif; }

        #fileUpload .progressInfo .status {
            float:left;
            font-size:0.8em;
            text-align:center;
            width:50%; }

        #fileUpload .progressInfo .time {
            float:left;
            font-size:0.8em;
            text-align: right;
            width: 25%; }

    #fileUpload .description {
        color:#acbbc3;
        padding:1em 0 0 1em; }


/******** Credits ********/

.mediaCredits li {
    float:left;
    padding:0 0 2em; }

@media (min-width:320px) {

    .mediaCredits li {
        width:50%; }

}

@media (min-width: 1300px) {

    .mediaCredits li {
        width:33%; }

}

/*
@media (min-width: 1500px) {

    .mediaCredits li {
        width:25%; }

} */

.mediaCredits .userThumb {
    height:35px;
    width:35px;
    float:left;
    margin-right:1em; }

.mediaCredits li div a,
.mediaCredits li div span {
    display:block; }


/******** Costs ********/

.costs .radio {
    display:inline-block;
    margin-top:0;
    vertical-align:bottom;
    width:15%; }


/******** Categories ********/
ul.categories {
    display: flex;
    flex-wrap: wrap;
}
.categories li,
.groups li,
.channels li {
    width:33%;
    padding-right:1em;
    margin-bottom:0.5em !important;
    margin-top:0 !important; }
.groups li,
.channels li {
    float:left;
}

form fieldset ul.categories li label {
	  overflow: hidden;
	  text-overflow: ellipsis;
}

#fileDetails fieldset ul.categories li label {
    border: 1px solid transparent;
}

form fieldset ul.categories li .arrow {
    position:relative;
    top:-5px;
    width:8px;
    height:13px;
    line-height:13px;
    padding:0;
    text-align:right; }

form fieldset ul.categories ul.sublinks li {
	  width: 100%;
    margin-bottom: 0 !important; }

form fieldset ul.categories li ul li {
    border-bottom:0;
    padding-left:1em; }

form fieldset ul.categories li p {
	  margin: 0; }


/******** Add Existing Media ********/

.addMediaFile {
    border:1px dashed #e5e5e5;
    background:#fff;
    padding:0.5em;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em; }

    .addMediaFile a {
        display:block;
        height:126px;
        background:#e5e5e5;
        padding:1em;
        border-radius:0.3em;
        -moz-border-radius:0.3em;
        -webkit-border-radius:0.3em;
        text-align:center; }

        .addMediaFile a i {
            color:#617ca3;
            font-size:2em;
            display:block;
            margin-top:1.2em; }

        .addMediaFile a span {
            color:#333;
            display:block;
        }
            .addMediaFile a:focus span {
                color: #FFFFFF;
            }


#addMedia li,
.addMedia li {
    margin-bottom:1em; }

.mediaSortable {
    display: flex;
    flex-wrap: wrap; }

.addMedia li {
    height:175px; }

#addMedia .mediaCover i,
.addMedia .mediaCover i {
    position:absolute;
    bottom:0.5em;
    left:0.5em; }

#addMedia .mediaCover i.icon-check,
.addMedia .mediaCover i.icon-check {
    position:absolute;
    bottom:auto;
    left:auto;
    top:0.5em;
    right:0.5em; }

#addMedia .mediaCover:hover i.icon-check,
.addMedia .mediaCover:hover i.icon-check {
  display: none;
}

#addMedia .mediaCover .hasPrice,
.addMedia .mediaCover .hasPrice {
    height:50px;
    width:50px;
    padding:0.5em; }

    #addMedia .mediaCover .hasPrice i,
    .addMedia .mediaCover .hasPrice i {
        font-size:1.2em; }

#addMedia form,
.addMedia form {
  background: none;
  border-radius: 0;
  margin: 0;
  padding: 0; }

#addMedia .links,
.addMedia .links {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    padding:12% 0 0;
    text-align:center;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;
    background:rgba(0,0,0,.7);
    visibility:hidden;
    z-index: 1; }

.addMedia .links {
    padding:17% 0 0; }

    #addMedia li:hover .links,
    .addMedia li:hover .links {
        visibility:visible; }

    #addMedia .mediaCover .links .batch,
    .addMedia .mediaCover .links .batch {
      position: absolute;
      right: 0.5em;
      top: 0.5em; }

    #addMedia .mediaCover .links a,
    .addMedia .mediaCover .links a {
        text-align:center;
        border-radius:0.5em;
        -moz-border-radius:0.5em;
        -webkit-border-radius:0.5em;
        display:inline-block;
        padding:0.75em 1em;
        border: 1px solid #FFFFFF;
        background-color: #FFFFFF
    }

    #albumContent #addMedia .mediaCover i,
    #addAlbumMedia #addMedia .mediaCover i {
        color: #3B6297;
    }

    #addMedia .links i,
    .addMedia .links i  {
        position:relative;
        top:0;
        left:0;
        padding:0;
        font-size:1.8em;
        background:transparent; }

#addMedia .mediaLink,
.addMedia .mediaLink  {
    display:block;
    overflow:hidden; }

#addMedia li p,
.addMedia li p  {
    margin-top:0.25em;
    font-size:0.8em; }


/*** Add Existing Media - Modal ***/

.addMedia.modal .modal-dialog {
    width:800px; }

.addMedia.modal .modal-dialog {
    width:60%; }

.addMedia.modal .scrollbar {
    width:100% !important;
    height:500px;
    padding-top:1em;
    padding-bottom:1em; }

#newMediaList {
    position: relative; }



/****************************************************************/
/*              CHANNELS                                        */
/****************************************************************/

/*********************************************************/
/*              Overview                                 */
/*********************************************************/

.channelListing {
    position: relative; }

.channelList > article {
    position:relative;
    box-shadow:0 0 2px #acbbc3;
    margin-bottom:50px;
    overflow:hidden; }

    .channelList > article:hover:not(.slider) {
        box-shadow:0 0 3px #617ca3; }

    .channelList .mediaThumb {
        width:100%;
        height:auto;
     }


/******** Overlay ********/

.channelList .slider .channelTeaser .link {
    position:absolute;
    left:0;
    height:100%;
    width:50%;
    padding:1em;
    background:rgba(0,0,0,.7); }

.channelList .slider .channelTeaser  {
    position: relative; }

#channels article.slider {
    margin-bottom: 25px; }

.channelList .vmp-mobile .channelTeaser .link {
    position: relative;
    margin-left: 10%;
    left: 0;
    top: 0;
    padding: 0; }

.channelList .vmp-mobile .channelTeaser .link > * {
    padding: 5px 0 0 5px; }

.channelList .vmp-mobile .channelTeaser {
    background-color: rgba(0, 0, 0, 0.9);
}

@media (max-width: 1000px) {
    .channelList .vmp-mobile .channelSlider {
        display: none;
    }
}

.channelList .vmp-mobile article {
    margin: 25px 0; }

    .channelList .channelTeaser h3 {
        color:#9eafc7;
        margin-bottom:1em; }

    .channelList .channelTeaser .text {
        color:#fff !important; }

    @media (min-width:320px) {

        .channelList .channelTeaser h3 {
            margin-bottom:0.75em;
            margin-top:0.5em;
            max-height:41px; }

        .channelList .channelTeaser .text {
            max-height:73px;
            overflow:hidden; }

    }

    @media (min-width: 1300px) {

        .channelList .channelTeaser .text {
            height:auto; }

    }


    .channelList .channelTeaser .details {
        color:#acbbc3;
        margin-top:1.5em; }


/******** Slider ********/

.channelList .channelSlider {
    background:#fff;
    position:relative; }

.channelList .channelSlider li {
    display:inline-block;
    position:relative; }

    .channelList .channelSlider .mediaCover {
        margin-bottom:0.5em; }

    .channelList .channelSlider .hasPrice {
        height:50px;
        width:50px;
        padding:0.5em; }

        .channelList .channelSlider .hasPrice i {
            font-size:1.2em; }

    .channelList .channelSlider li i {
        position:absolute;
        bottom:0.5em;
        left:0.5em;
        color:#fff;
        border-radius:50%;
        -moz-border-radius:50%;
        -webkit-border-radius:50%;
        padding:0.5em;
        background:rgba(0,0,0,.8); }

    .channelList .channelSlider h4 {
        position:absolute;
        right:0;
        bottom:0.5em;
        margin:0;
        width:70%;
        text-align:right;
        color:#fff;
        background:#000;
        padding:0.2em 0.5em;
        background:-moz-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(2,0,0,0.8) 15%, rgba(0,0,0,1) 100%); /* FF3.6+ */
        background:-webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0)), color-stop(15%,rgba(2,0,0,0.8)), color-stop(100%,rgba(0,0,0,1))); /* Chrome,Safari4+ */
        background:-webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(2,0,0,0.8) 15%,rgba(0,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
        background:-o-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(2,0,0,0.8) 15%,rgba(0,0,0,1) 100%); /* Opera 11.10+ */
        background:-ms-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(2,0,0,0.8) 15%,rgba(0,0,0,1) 100%); /* IE10+ */
        background:linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(2,0,0,0.8) 15%,rgba(0,0,0,1) 100%); /* W3C */
        filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=1 ); /* IE6-9 */ }
/*** Arrows ***/

.channelList .channelSlider .arrow-left,
.channelList .channelSlider .arrow-right {
    position:absolute;
    top:30%;
    font-size:4em; }

.channelList .channelSlider .arrow-left {
    left:0.2em; }

.channelList .channelSlider .arrow-right {
    right:0.2em; }

/******** Slider ********/
#membersList .remove,
#membersList #editRoles,
#save_role {
    display: inline-block;
    padding: 5px 0;
    /*border: 1px;*/
    color: #475d7b;
    border: 1px solid #475d7b;
    height: 30px;
    font-size: 12px; }

#membersList .remove,
#membersList #editRoles {
    width: 80px;
    text-align: center;
}

#channelContent #manageUsers #membersList .removeRole .remove,
#channelContent #manageUsers #membersList .editRoleBlock .editRole #editRoles {
    padding-right: 5px;
    padding-left: 5px;
    width:auto;
}

#channelContent .editRole.mainRoleDiv #editRoles .icon-edit::before {
    color: #3B6297;
}

#channelContent .editRole.mainRoleDiv #editRoles:hover .icon-edit::before {
    color: white;
}

#channelContent #manageUsers #membersList li article .editRoleBlock,
#channelContent #manageUsers #membersList li article div.removeRole {
    display: inline-block;
}

#channelContent #manageUsers #membersList li article .editRoleBlock div.editRole {
    margin-bottom: 2px;
}

#membersList .remove:hover,
#membersList #editRoles:hover,
#save_role:hover {
    color: white; }

.saveRole > i {
    color: white; }

#membersList #editRoles {
    position: relative; }

.mainRoleDiv {
    display: inline-block; }

.editRoleWrapper {
    flex-direction: column; }

.editRole .wrap {
    position:absolute;
    top:83%;
    right:0;
    border:1px solid #ccc;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    background:#fff;
    padding:1em;
    display:flex;
    box-shadow:-5px 5px 16px -2px #8a95a6;
    visibility: hidden; }

.editRoleBlock {
    display: contents;
}

@media (max-width: 600px) {
    .editRoleBlock{
        display: none;
    }
}

/*********************************************************/
/*              Listing                                  */
/*********************************************************/

.channelThumbs .hasPrice {
    height:50px;
    width:50px;
    padding:0.5em; }

    .channelThumbs .hasPrice i {
        font-size:1.2em; }

.channelThumbs .mediaOverlay {
    padding:0.5em 0.5em 0; }

    .channelThumbs .mediaOverlay h3 {
        margin-top:0; }

    .channelThumbs .mediaOverlay .additionalInfo p {
        color:#acbbc3; }

    .channelThumbs>li>a:focus i:before {
        color: #3B6297
    }

/******** Thumbs (Big) ********/

.channelThumbs.big article {
    position:relative;
    margin-bottom:15px;
    margin-top:5px; }

    .channelThumbs.big .mediaCover h3 {
        position:absolute;
        bottom:0;
        left:0;
        margin:0;
        padding:0.25em 0.5em;
        color:#fff;
        display:block;
        width:100%;
        height:32px;
        line-height:1.3em;
        overflow:hidden;
        background:rgba(0,0,0,.7); }

    .channelThumbs.big li>a:focus .mediaCover h3,
    .channelThumbs.big li:hover .mediaCover h3 {
        display:none;
    }


/*** Hover ***/

.channelThumbs.big .mediaOverlay {
    position:absolute;
    bottom:0;
    left:0;
    height:0;
    width:100%;
    margin:0;
    overflow:hidden;
    visibility:hidden;
    background:rgba(0,0,0,.7);
    -webkit-transition:height 1s;
    -moz-transition:height 1s;
    -o-transition:height 1s;
    transition:height 1s;
    color:#fff;
    padding:10px; }

    .channelThumbs.big li>a:focus .mediaOverlay,
    .channelThumbs.big li:hover .mediaOverlay {
        visibility:visible;
        height:100%;
    }

    .channelThumbs.big .mediaOverlay a {
        height:100%;
        padding:1em;
        display:block; }

    .channelThumbs.big .mediaOverlay h3 {
        color:#fff;
        margin:0; }

    .channelThumbs.big .mediaOverlay .text {
        color:#fff !important;
        font-size:0.8em;
        margin:1em 0 0.5em 0;
        overflow:hidden; }

        @media (min-width:320px) {

            .channelThumbs.big .mediaOverlay .text {
                height:30px; }

        }

        @media (min-width:1300px) {

            .channelThumbs.big .mediaOverlay .text {
                height:54px;
                font-size:0.9em; }

        }

        /*
        @media (min-width: 1600px) {

            .channelThumbs.big .mediaOverlay .text {
                height:55px; }

        }*/

    .channelThumbs.big .mediaOverlay .additionalInfo .uploader {
        float:left;
        margin:0; }

        .channelThumbs.big .mediaOverlay .additionalInfo .userThumb {
            height:35px;
            width:35px; }

    .channelThumbs.big .mediaOverlay .additionalInfo .buyMedia {
        float:right; }

        .channelThumbs.big .mediaOverlay .additionalInfo .buyMedia .buy {
            margin-right:0.5em;
            background:#617ca3;
            border:1px solid #003f61;
            padding:0.2em 0.5em;
            text-align:center; }

            .channelThumbs.big .mediaOverlay .additionalInfo .buyMedia .buy i {
                color:#fff; }

    .channelThumbs.big .mediaOverlay .details {
        position:absolute;
        bottom:1em;
        left:0;
        width:100%; }

    .channelThumbs.big .mediaOverlay .details li {
        float:left;
        text-align:center;
        width:25%;
        padding:0 1em;
        color:#acbbc3; }

    @media (min-width: 992px) {

        .channelThumbs.big .mediaOverlay .details {
                font-size:0.8em; }

            .channelThumbs.big .mediaOverlay .details li {
                    padding: 0 0.75em; }

    }

    /*
    @media (min-width: 1600px) {

        .channelThumbs.big .mediaOverlay .details {
                font-size:0.9em; }

            .channelThumbs.big .mediaOverlay .details li {
                    padding: 0 1em; }

    }*/

    .channelThumbs.big .mediaOverlay .additionalInfo p {
        float:left; }

    .channelThumbs.big .mediaOverlay .additionalInfo .price {
        float:right;
    }


/******** Thumbs (Small) ********/

.channelThumbs.small article {
    position:relative;
    border: 1px solid #3B6297;
    margin-bottom:15px;
    margin-top:5px;
    overflow:hidden; }

.channelThumbs.small .mediaInfo {
    padding:1em; }

    .channelThumbs.small .mediaInfo h3 {
        margin:0 0 0.5em;
        min-height:20px;
        height:fit-content;
        font-size:1.2em;
        padding:0;
        overflow:hidden; }

    .channelThumbs.small .mediaInfo .text {
        margin-bottom:0.5em;
        height:41px;
        overflow:hidden; }

.channelThumbs.small .additionalInfo p {
    float:left;
    color:#acbbc3;
    margin-bottom:0; }

.channelThumbs.small .additionalInfo .price {
    float:right;
    margin: -1px; }


/*** Hover ***/

.channelThumbs.small .mediaCover .links {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    padding:15% 0 0;
    text-align:center;
    background:rgba(0,0,0,.7);
    visibility:hidden;
    opacity:0;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out; }

    .channelThumbs.small article:hover .links {
        visibility:visible;
        opacity:1; }

    .channelThumbs.small .mediaCover .links p {
        text-align:center;
        display:inline-block;
        padding:0.75em 1em; }

        .channelThumbs.small .mediaCover .links p i  {
            position:relative;
            top:0;
            left:0;
            padding:0;
            font-size:1.8em;
            background:transparent; }


/******** Thumbs (List) ********/

.channelThumbs.list li a:focus {
    background-color: transparent;
}
.channelThumbs.list>li>a:focus>article {
    border: 5px solid #3B6297;
}
.channelThumbs.list article {
    position:relative;
    box-shadow:0 0 2px #acbbc3;
    margin-bottom:20px;
    overflow:hidden; }

.channelThumbs.list .mediaCover {
    position:relative;
    float:left;
    width:50%; }

    .channelThumbs.list .mediaCover i {
        position:absolute;
        bottom:0.5em;
        left:0.5em; }

.channelThumbs.list .mediaInfo {
    float:left;
    width:50%;
    padding:1em; }

    .channelThumbs.list .mediaInfo h3 {
        margin:0;
        padding:0.5em 0 0.3em; }

        .channelThumbs.list .mediaInfo .text {
            margin-bottom:0.3em; }

    @media (min-width: 1500px) {

        .channelThumbs.list .mediaInfo .text {
            height:40px;
            overflow:hidden; }

    }

    .channelThumbs.list .mediaInfo .price {
        position:absolute;
        top:0.5em;
        right:0.5em; }

.channelThumbs.list .hasPrice {
    height:50px;
    width:50px;
    padding:0.5em; }

    .channelThumbs.list .hasPrice i {
        font-size:1.2em; }

.channelThumbs.list .additionalInfo p {
    color:#acbbc3;
    margin:0; }


/*** Hover ***/

.channelThumbs.list .mediaCover .links {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    padding:10% 0 0;
    text-align:center;
    background:rgba(0,0,0,.7);
    visibility:hidden;
    opacity:0;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out; }

    .channelThumbs.list article:hover .links {
        visibility:visible;
        opacity:1; }

    .channelThumbs.list .mediaCover .links p {
        text-align:center;
        border-radius:0.5em;
        -moz-border-radius:0.5em;
        -webkit-border-radius:0.5em;
        display:inline-block;
        padding:0.75em 1em; }

        .channelThumbs.list .mediaCover .links p i  {
            position:relative;
            top:0;
            left:0;
            padding:0;
            font-size:1.8em;
            background:transparent; }


/*********************************************************/
/*              Detail                                   */
/*********************************************************/

.viewChannel .description {
    margin:1em 0; }

.viewChannel .statistics li {
    float:left;
    padding:0 1em 0 0;
    color:#acbbc3; }

.viewChannel .access {
    margin:1em 0; }

    .viewChannel .access .countdown {
        margin-left:1.5em; }

#addChannelMedia.modal .scrollbar {
    height:500px;
    padding-bottom:1em;
    padding-top:1em;
    width:100% !important; }

.viewChannel .buyMedia  {
    float:none; }

.mediaDetail .viewChannel .buyMedia  {
    float:left; }


/******** Slider ********/

.viewChannel .swiper-container {
    max-height:155px; }

.viewChannel #slider .arrow-left,
.viewChannel #slider .arrow-right {
    margin-top:0;
    top:30%; }

.viewChannel #slider .mediaCover i {
    position:absolute;
    bottom:0.5em;
    left:0.5em; }


/****************************************************************/
/*              ALBUMS                                          */
/****************************************************************/

.albumListing {
    position:relative; }

    .albumListing .callToAction {
        position:absolute;
        top:0;
        right:0; }


/*********************************************************/
/*              Overview                                 */
/*********************************************************/
#albums-box .filter .filterView .btn.btn-default:focus {
    color: #FFFFFF;
    background-color: #3B6297;
}
.albumOverview {
    position:relative; }

.albumThumbs article,
.playlistThumbs article {
    position:relative;
    margin: 5px 5px 20px 0px;
    overflow:hidden;
    border: 1px solid #3B6297;
}

.albumThumbs>li>article:focus-within,
.playlistThumbs>li>article:focus-within {
    outline: 5px solid #3B6297;
}

.albumThumbs .mediaCover {
    float:left;
    width:50%; }

.albumThumbs .hasPrice {
    height:50px;
    width:50px;
    padding:0.5em; }

    .albumThumbs .hasPrice i {
        font-size:1.2em; }

.albumThumbs.list li article a div img {
    height: 153px;
    object-fit: cover;
}

.albumThumbs.small li article a div img {
    max-height: 228px;
    object-fit: cover;
}

.albumThumbs.big li div img {
    max-height: 303px;
    object-fit: cover;
}

/*** Hover ***/

.albumThumbs .mediaCover .links {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    padding:35% 0 0;
    text-align:center;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;
    background:rgba(0,0,0,.7);
    visibility:hidden;
    opacity:0;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out; }


    .albumThumbs  article:hover .links {
        visibility:visible;
        opacity:1; }

    .albumThumbs .mediaCover .links p {
        text-align:center;
        border-radius:0.5em;
        -moz-border-radius:0.5em;
        -webkit-border-radius:0.5em;
        display:inline-block;
        padding:0.75em 1em; }

        .albumThumbs .mediaCover .links p i  {
            position:relative;
            top:0;
            left:0;
            padding:0;
            font-size:1.8em;
            background:transparent; }

.albumThumbs .mediaInfo {
    float:left;
    width:50%;
    padding:1em; }

    .albumThumbs .mediaInfo h3 {
        margin-top:0;
        height:64px;
        font-size:1.3em;
        line-height:1.2em;
        overflow:hidden;
        text-overflow: ellipsis;
        white-space: nowrap; }

    .albumThumbs .mediaInfo p {
        color:#acbbc3; }


/******** Thumbs (Big) ********/

.albumThumbs.big > li {
    position:relative;
    margin-bottom:20px;
    overflow:hidden; }

.albumThumbs.big li{
    padding: .5em;
}

/*** Preview ***/

.albumThumbs.big .mediaCover {
    position:relative;
    width:100%;
    float:none;
    overflow:hidden; }

    .albumThumbs.big .mediaCover h3 {
        position:absolute;
        bottom:0;
        left:0;
        margin:0;
        padding:0.25em 0.5em;
        color:#fff;
        display:block;
        width:100%;
        height:28px;
        font-size:1.3em;
        line-height:1.3em;
        overflow:hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        background:rgba(0,0,0,.7); }

    .albumThumbs.big li:hover .mediaCover h3 {
        display:none; }

    .albumThumbs.big .mediaCover i {
        padding:0;
        background:transparent; }

.albumThumbs.big .hasPrice {
    height:50px;
    width:50px; }

/*** Hover ***/

.albumThumbs.big .mediaOverlay {
    position:absolute;
    bottom:7px;
    left:6px;
    height:0;
    width:97%;
    padding:1em;
    visibility:hidden;
    background:rgba(0,0,0,.7);
    -webkit-transition:height 1s;
    -moz-transition:height 1s;
    -o-transition:height 1s;
    transition:height 1s;
    color:#fff; }

    .albumThumbs.big li:hover .mediaOverlay {
        visibility:visible;
        height:96%; }

    .albumThumbs.big .mediaOverlay a {
        display:block;
        height:100%; }

    .albumThumbs.big .mediaOverlay h3 {
        color:#fff;
        margin:0;
        max-height:62px;
        font-size:1.3em;
        line-height:1.2em;
        overflow:hidden;
        text-overflow: ellipsis;
        white-space: nowrap; }

    .albumThumbs.big .mediaOverlay .text {
        color:#fff !important;
        font-size:0.8em;
        margin:1em 0 0.5em 0;
        overflow:hidden; }

        @media (min-width:320px) {

            .albumThumbs.big .mediaOverlay .text {
                max-height:60px;
                overflow:hidden; }

        }

        /*
        @media (min-width: 1600px) {

            .albumThumbs.big .mediaOverlay .text {
                height:65px; }

        }*/

    .albumThumbs.big .mediaOverlay .additionalInfo .uploader {
        float:left;
        margin:1em 0; }

        .albumThumbs.big .mediaOverlay .additionalInfo .userThumb {
            height:35px;
            width:35px; }

    .albumThumbs.big .mediaOverlay .additionalInfo .buyMedia {
        float:right;
        margin-top:1em; }

        .albumThumbs.big .mediaOverlay .additionalInfo .buyMedia .buy {
            margin-right:0.5em;
            background:#617ca3;
            border:1px solid #003f61;
            padding:0.2em 0.5em;
            text-align:center; }

            .albumThumbs.big .mediaOverlay .additionalInfo .buyMedia .buy i {
                color:#fff; }

    .albumThumbs.big .mediaOverlay .details {
        position:absolute;
        bottom:1em;
        left:0.5em;
        width:100%;
        opacity:0;
        -webkit-transition:opacity 1s .5s;
        -moz-transition:opacity 1s .5s;
        -o-transition:opacity 1s .5s;
        transition:opacity 1s .5s;
    }

        .albumThumbs.big li:hover .mediaOverlay .details {
            opacity:1;
        }

    .albumThumbs.big .mediaOverlay .details li {
        float:left;
        text-align:center;
        padding:0 1em;
        color:#acbbc3;
    }

    @media (min-width: 992px) {

        .albumThumbs.big .mediaOverlay .details {
                font-size:0.8em; }

            .albumThumbs.big .mediaOverlay .details li {
                    padding: 0 0.75em; }

    }

    /*
    @media (min-width: 1600px) {

        .albumThumbs.big .mediaOverlay .details {
                font-size:0.9em; }

            .albumThumbs.big .mediaOverlay .details li {
                    padding: 0 1em; }

    }*/


/******** Thumbs (Small) ********/

.albumThumbs.small .mediaCover {
    float:none;
    width:100%; }

    .albumThumbs.small .mediaCover .uploader {
        position:absolute;
        bottom:-0.75em;
        left:0.5em; }

        .albumThumbs.small .mediaCover .userThumb {
            height:35px;
            width:35px; }

        .albumThumbs.small .mediaCover .uploader span {
            color:#fff;
            font-size:0.9em;
            text-shadow:0 0 2px #000; }

    .albumThumbs.small h3 {
        margin:1em 0.7em 0;
        min-height:20px;
        height:fit-content;
        font-size:1.2em;
        line-height:1.2em;
        padding:0;
        overflow:hidden;
        white-space: nowrap;
        text-overflow: ellipsis; }

    .albumThumbs.small .additionalInfo {
        padding:0.5em 1em 0; }

        .albumThumbs.small .additionalInfo p {
            color:#acbbc3;
            float:left; }

        .albumThumbs.small .additionalInfo .price {
            float:right; }

/*** Hover ***/

.albumThumbs.small .mediaCover .links {
    border-radius:0.5em 0.5em 0 0;
    -moz-border-radius:0.5em 0.5em 0 0;
    -webkit-border-radius:0.5em 0.5em 0 0; }

.albumThumbs>li>article>a:focus {
    background-color: transparent;
    margin: 0;
}

.albumThumbs>li>article>a:focus .mediaInfo p,
.albumThumbs>li>article>a:focus .mediaInfo p i:before {
    color: #3B6297;
}

/*********************************************************/
/*              Detail                                   */
/*********************************************************/

.viewAlbum #innerNav {
    padding-bottom:1em; }

.viewAlbum #subNav {
    right:0 !important;
    width:100%;
    border-bottom:1px solid #ddd; }

    .viewAlbum #subNav ul {
        float:right; }

    .viewAlbum #subNav li a {
        background:#f5f6f7; }

    .viewAlbum #subNav li a:hover {
        background:#ddd; }

    .viewAlbum #subNav li.active a {
        border-right:1px solid #ddd;
        border-left:1px solid #ddd;
        border-bottom:1px solid #fff; }

.viewAlbum .mediaListing {
    margin-top:1em; }

.viewAlbum #innerNav {
    padding-bottom:0;
}

.viewAlbum #innerNav .mediaCover {
    padding-left: 0;
}
/*********************************************************/
/*              Create Album                             */
/*********************************************************/

#createAlbum .details {
    padding-left:1em; }

#addAlbumMedia.modal .scrollbar {
    height:500px;
    padding-bottom:1em;
    padding-top:1em;
    width:100% !important; }

#addAlbumMedia #addMediaSearchWrapper input[type="text"],
#addGroupMedia #addMediaSearchWrapper input[type="text"],
#addChannelMedia #addMediaSearchWrapper input[type="text"]
{
    width: 100%;
    padding: 5px;
    margin-bottom: 5px;
}

/****************************************************************/
/*              GROUPS                                          */
/****************************************************************/


/*********************************************************/
/*              Overview                                 */
/*********************************************************/

.groupOverview {
    position:relative; }

.groupListing {
  position: relative; }

.groupListing .filter {
    margin-bottom:1em; }

.groupListing article {
    position:relative; }

@media(min-width: 576px) {
    .groupListing article {
        margin:5px 5px 20px 5px;
        padding:13px; }
}

.groupListing .mediaCover {
    float:left;
    width:25%; }

    .groupListing .mediaCover i {
        position:absolute;
        bottom:0.5em;
        left:0.5em; }

.groupListing .groupInfo {
    float:left;
    width:75%;
    padding:0 0 0 1em; }

    .groupListing .groupInfo a {
        display: block;
    }

        .groupListing .groupInfo a:focus .icon-group:before {
            color: #3B6297;
        }

    .groupListing .groupInfo h3 {
        margin:0 0 0.25em;
        height:40px;
        font-size:1.3em;
        line-height:1.2em;
        overflow:hidden;  }

    .groupListing .groupInfo .text {
        height:59px;
        overflow:hidden; }

    .groupListing .groupInfo .details {
        margin-top:0.5em;
        margin-bottom:0;
        color:#3B6297; }


/*** Hover ***/

.groupListing .mediaCover .links {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    padding:25% 0 0;
    text-align:center;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;
    background:rgba(0,0,0,.7);
    visibility:hidden;
    opacity:0;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out; }

    .groupListing article:hover .links {
        visibility:visible;
        opacity:1; }

    .groupListing .mediaCover .links p {
        text-align:center;
        border-radius:0.5em;
        -moz-border-radius:0.5em;
        -webkit-border-radius:0.5em;
        display:inline-block;
        padding:0.75em 1em; }

        .groupListing .mediaCover .links p i  {
            position:relative;
            top:0;
            left:0;
            padding:0;
            font-size:1.8em;
            background:transparent; }


.groupThumbs > li > article {
    margin: 0 0 15px 0;
}

.groupThumbs>li>article:focus-within {
    border: 5px solid #3B6297;
    padding: 9px;
}
.groupThumbs>li>article a:focus .groupInfo .icon-group:before {
    color: #3B6297;
}

#bigThumbs .groupThumbs .mediaCover i:before {
    color: #3B6297;
}

.groupThumbs .mediaCover a {
    display: block;
}

.groupThumbs a:focus .groupInfo .details i:before {
    color: #3B6297!important;
}


/******** Thumbs (Big) ********/

.groupThumbs.big article {
    position:relative;
    margin-bottom:0;
    padding:0;
    overflow:hidden; }

/*** Preview ***/

.groupThumbs.big .mediaCover {
    position:relative;
    float:none;
    width:100%; }

    .groupThumbs.big .mediaCover h3 {
        position:absolute;
        bottom:0;
        left:0;
        margin:0;
        padding:0.25em 0.5em;
        color:#fff;
        display:block;
        width:100%;
        height:2em;
        font-size:1.3em;
        line-height:1.3em;
        overflow:hidden;
        background:rgba(0,0,0,.7);
        text-overflow:ellipsis;
        white-space:nowrap; }

    .groupThumbs.big li:hover .mediaCover h3 {
        display:none; }

    .groupThumbs.big .mediaCover i {
        top:0.5em;
        bottom:auto; }

/*** Hover ***/

.groupThumbs.big .mediaOverlay {
    width:100%;
    margin:0; }

    .groupThumbs.big .mediaOverlay a {
        height:100%;
        display:block; }

    .groupThumbs.big .mediaOverlay h3 {
        color:#fff;
        margin:0; }

    .groupThumbs.big .mediaOverlay .text {
        color:#fff !important;
        font-size:0.9em;
        margin:1em 0 0.5em 0;
        overflow:hidden; }

        @media (min-width:320px) {

            .groupThumbs.big .mediaOverlay .text {
                height:103px; }

        }

        /*
        @media (min-width: 1600px) {

            .groupThumbs.big .mediaOverlay .text {
                height:85px; }

        }*/

    .groupThumbs.big .mediaOverlay .additionalInfo .uploader {
        float:left;
        margin:1em 0; }

        .groupThumbs.big .mediaOverlay .additionalInfo .userThumb {
            height:35px;
            width:35px; }

    .groupThumbs.big .mediaOverlay .additionalInfo .buyMedia {
        float:right;
        margin-top:1em; }

        .groupThumbs.big .mediaOverlay .additionalInfo .buyMedia .buy {
            margin-right:0.5em;
            background:#617ca3;
            border:1px solid #003f61;
            padding:0.2em 0.5em;
            text-align:center; }

            .groupThumbs.big .mediaOverlay .additionalInfo .buyMedia .buy i {
                color:#fff; }

    .groupThumbs.big .mediaOverlay .details {
        position:absolute;
        bottom:1em;
        left:0;
        margin:0 1em;
        color:#acbbc3; }


    @media (min-width: 992px) {

        .groupThumbs.big .mediaOverlay .details {
                font-size:0.9em; }

    }

/******** Thumbs (small) ********/

.groupThumbs.small .mediaCover {
    float:none;
    width:100%; }

.groupThumbs.small h3 {
    min-height:20px;
    height:fit-content;
    font-size:1.2em;
    line-height:1.2em;
    margin-top:0.75em;
    overflow:hidden; }

.groupThumbs.small .details {
    margin-top:0.5em;
    color:#acbbc3; }

    .groupThumbs.small .details p {
        margin-bottom:0; }


/*********************************************************/
/*              Detail                                   */
/*********************************************************/

#groupStatistics i {
    color:#acbbc3;
    width:22px;
    display:inline-block;
    text-align:center;
    padding-right:0.5em; }

#groupStatistics li {
    margin-bottom:0.5em; }

@media (max-width:992px) {

    #groupStatistics li {
        font-size:0.9em; }

}


/*** Admin ***/

.groupDetail .admin article {
    text-align:center;
    margin-bottom:20px;
    width:115px; }

.groupDetail .admin .userThumb {
    height:115px;
    width:115px; }

.groupDetail .admin article a {
    color: #acbbc3;
    font-size: 0.8em;
}

.groupDetail article a p {
    margin-bottom: 0.3em
}

.groupDetail .admin .name {
    font-size:1em;
    color:#1a1c1e;
    display:block;
    margin:0.5em 0 0.2em;
    overflow:hidden; }

    .groupDetail .admin article:hover .name {
        color:#475d7b; }

.groupDetail .admin p {
    color:#acbbc3;
    overflow:hidden; }

.groupDetail .admin .online {
    padding:80% 0 0; }

.groupDetail .admin:hover .userThumb {
    box-shadow:0 0 3px #617ca3; }


/*********************************************************/
/*              Send Invite                              */
/*********************************************************/

#sendInvite #users,
#sendInvite #friends {
    margin-top:1em; }


/****************************************************************/
/*              FORUMS                                          */
/****************************************************************/




/*********************************************************/
/*              Forums                                   */
/*********************************************************/

.forumListing {
    position: relative;
    margin-bottom:1em; }

    .forumListing .top {
        padding:0;
        background:#dfe5eb; }

    .forumListing .top li {
        padding:0.5em;
        border-left:1px solid #fff;  }

        .forumListing .top li:first-child {
            border-left:none;  }

    .forumListing .top,
    .forumListing .forums .topic {
        display:table;
        width:100%; }

    .forumListing .title,
    .forumListing .stats,
    .forumListing .replies,
    .forumListing .new {
        display:table-cell;
        vertical-align:middle; }

    .forumListing .title {
        width:60%;
        padding-left:0.5em; }

        .forumListing .title a {
            display:block;
            font-size:1.2em;
            margin:0 0 0.25em; }

    .forumListing .stats {
        width:10%;
        text-align:center; }

    .forumListing .replies {
        width:10%;
        text-align:center; }

    .forumListing .new {
        width:20%;
        padding-left:0.5em; }

        .forumListing .new p {
            margin:0 0 0.25em; }

        .empty {
            margin-top: 30px;
        }

.topic {
    padding:1em 0;
    margin:0;
    border-bottom:1px solid #dfe5eb; }

/*********************************************************/
/*              Detail                                   */
/*********************************************************/

#forumThread .author,
#forumThread .title,
#forumThread .text,
#forumThread .toplink {
    float:left; }

#forumThread .author {
    width:10%; }

@media (min-width:320px) {

#forumThread .author {
    width:15%; }

}

@media (min-width:1300px) {

#forumThread .author {
    width:10%; }

}

    #forumThread .author .userCover {
        margin-top:0.5em; }

    #forumThread .author .userCover,
    #forumThread .author .userThumb {
        height:65px;
        width:65px; }

#forumThread .toplink {
    width:100%;
    font-size:0.9em;
    visibility:hidden; }

    #forumThread .threadComment:hover .toplink {
        visibility:visible; }

.threadComment {
    padding:1em 0;
    border-bottom:1px solid #dfe5eb; }


/******** Title ********/

.threadComment .title {
    font-size:0.8em;
    margin-bottom:0.5em;
    border-bottom:1px dotted #dfe5eb; }

    .threadComment .title p {
        float:left;
        color:#acbbc3; }

.threadComment .actions {
    float:right;
    visibility:hidden; }

    .threadComment:hover .actions {
        visibility:visible; }

    .threadComment .actions li {
        float:left;
        margin:0 0 0 0.5em; }
    .threadComment .text p{
      overflow-wrap: break-word; }

/****************************************************************/
/*              BLOGS                                           */
/****************************************************************/


/*********************************************************/
/*              Overview                                 */
/*********************************************************/

.blogOverview {
    position:relative; }

.blogOverview #blog .blogList,
.homePage #blog .blogList {
    margin:0 8px 0 53px;
    border-right: 5px solid transparent;
}

/******** Preview ********/

.blogList article {
    position:relative;
    box-shadow:0 0 2px #acbbc3;
    margin-bottom:20px; }

.blogList .blogTeaser {
    padding:1em;
    border: 5px solid transparent;
}
.blogList .blogTeaser:focus-within {
    border: 5px solid #3B6297;
}

    .blogList .blogTeaser a {
        display: block;
        border: 1px solid transparent;
    }
        .blogList .blogTeaser a:focus {
            display: block;
            border: 1px solid #3B6297;
        }

        .blogList .blogTeaser .details .author a:focus {
            background-color: #3B6297;
            color: #ffffff;
        }

    .blogList .blogTeaser h3 {
        margin-top:0.5em; }

    .blogList .blogTeaser .text {
        padding:0 0 1em;
        border-bottom:1px solid #dfe5eb; }

    .blogList .blogTeaser .userThumb {
        height:35px;
        width:35px; }

    .blogList .blogTeaser .details {
        display:table;
        margin:1em 0 0; }

        .blogList .blogTeaser .details li {
            display:table-cell;
            color:#acbbc3;
            padding:0 1em 0 0; }

.blogList .more {
    position:absolute;
    bottom:1.5em;
    right:1em; }
    #contentWrapper .blogList article:hover .button-wrap-form .more {
        background:#3B6297;
        color: #ffffff;
    }

/*********************************************************/
/*              Detail                                   */
/*********************************************************/

.blogDetail #actionNav {
    float:right;
    margin-top:0.5em; }

@media (max-width:1300px) {

    .blogDetail #actionNav {
        margin-top:0;
        margin-bottom:1em; }

}

.blogDetail .author {
    float:left; }

    .blogDetail .author .userThumb {
        height:35px;
        width:35px;
        margin:0 0.5em 0 0; }

    .blogDetail .author a {
        display:inline-block; }

.blogDetail .statistics {
    float:left;
    margin-left:1em; }

@media (max-width:1300px) {

    .blogDetail .statistics {
        font-size:0.9em; }

}

    .blogDetail .statistics li {
        float:left;
        color:#acbbc3;
        padding:0 0 0 1em;
        line-height:35px; }

.blogDetail .links {
    margin-top:1em; }

.blogDetail .links .share {
    float:left; }

        .blogDetail .share a {
            height:20px;
            width:20px;
            text-align:center;
            display:inline-block;
            border-radius:50%;
            -moz-border-radius:50%;
            -webkit-border-radius:50%; }

        #contentWrapper .blogDetail .share a i {
            color:#fff; }

        /*.blogDetail .share .facebook {
            background:#4e69a2; }

            .blogDetail .share .facebook:hover {
                background:#3b5998; }

        .blogDetail .share .twitter {
            background:#32bbef; }

            .blogDetail .share .twitter:hover {
                background:#057ed0; }

        .blogDetail .share .googleplus {
            background:#e24b40; }

            .blogDetail .share .googleplus:hover {
                background:#a93125; }*/


/*** Shared ***/

.mediaDetail .shared {
    padding:0.5em 0 1em; }


/******** Recommended ********/

.blogThumb {
    margin:0 0 1em;
    padding:1.5em 0 0;
    border-top:1px solid #dfe5eb; }

@media (min-width:320px) {

    .blogThumb {
        font-size:0.8em; }

}

@media (min-width:1300px) {

    .blogThumb {
        font-size:0.9em; }

}

    .blogThumb:first-of-type {
        border-top:none; }

.blogThumb .date {
    color:#acbbc3; }

.blogThumb .comments {
    float:right;
    color:#acbbc3; }


@media (min-width:320px) {

    .blogThumb h3 {
        font-size:1.3em !important; }

    .blogThumb .author {
        float:none; }

}

@media (min-width:1300px) {

    .blogThumb h3 {
        font-size:1.4em !important; }

}

/****************************************************************/
/*              COMMENT ACTIONS                                 */
/****************************************************************/

.cancelEditedComment, .saveEditedComment {
    float: right;
    margin-top: 0.5em;
    display: none;
}

.saveEditedComment {
    margin-right: 0.4em;
}

.commentTextarea {
    width: 100%;
    display: none;
}

.comment .icon-pencil.pencilEditComment {
    cursor: pointer;
    font-size: 1.1em;
}

.comment .deleteComment {
    position: relative;
    font-size: 1.4em;
    top: -1.5px;
    cursor: pointer;
}
/****************************************************************/
/*              NEWS                                            */
/****************************************************************/


/*********************************************************/
/*              Overview                                 */
/*********************************************************/

.newsList article {
    box-shadow:0 0 2px #acbbc3;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;
    padding:0.5em;
    margin-bottom:20px; }

    .newsList article:hover {
        box-shadow:0 0 3px #617ca3; }

.newsList .newsCover {
    float:left;
    width:33%;
    position:relative;
    padding:0 3em 0 0; }

.newsList .newsTeaser {
    float:left;
    width:67%;
    padding:0 0 0 0.5em; }

.newsList .date {
    position:absolute;
    top:5%;
    right:0;
    width:80px;
    height:80px;
    padding:0.8em 0;
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    background:#000;
    border:2px solid #fff; }

    .newsList .date span {
        display:block;
        text-align:center;
        color:#fff;
        font-family:'Roboto Bold', 'robotobold', sans-serif; }

    .newsList .date .day {
        font-size:1.8em;
        line-height:1.1em; }

    .newsList .date .month {
        font-size:0.7em; }

    .newsList .date .year {
        font-size:0.7em; }


/*********************************************************/
/*              Detail                                   */
/*********************************************************/

.newsDetail figure {
    margin:1em;
    width:40%;
    height:auto; }


/****************************************************************/
/*              CATEGORIES                                      */
/****************************************************************/

/*********************************************************/
/*              Overview                                 */
/*********************************************************/

.categoryThumbs article {
    box-shadow:0 0 2px #acbbc3;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;
    margin-bottom:20px; }

    .categoryThumbs article:hover{
        box-shadow:0 0 3px #617ca3; }

.categoryThumbs .head {
    padding:1em 1em 0.5em;
    height:85px;
    overflow:hidden; }

    .categoryThumbs .head h3 {
        margin-top:0;
        min-height:22px;
        height:auto;
        overflow:hidden;
        text-overflow: ellipsis;
        white-space: nowrap; }

    .categoryThumbs .head p {
        margin-bottom:0;
        height:41px;
        color:#1a1c1e;
        overflow:hidden; }

.categoryThumbs .mediaCover {
    position:relative;
    margin:0.5em;
    overflow:hidden; }

    .categoryThumbs .mediaCover .icons {
        border-radius:0.5em;
        -moz-border-radius:0.5em;
        -webkit-border-radius:0.5em;  }

.categoryThumbs .details {
    font-size:0.9em;
    background: #f9fafb;
    box-shadow:inset 0 1px 2px #acbbc3;
    border-radius:0 0 0.5em 0.5em;
    -moz-border-radius:0 0 0.5em 0.5em;
    -webkit-border-radius:0 0 0.5em 0.5em; }

    .categoryThumbs .details li {
        float:left;
        width:50%;
        padding:0.3em 0.5em;
        color:#607580;
        font-size: 0.9em;
        text-align:center; }

.categoriesDropdownSelect {
    position: relative;
    margin-right: 1rem;
    border: 1px solid #475d7b;
    color: #475d7b;
    font-size: .9em; }

.categoriesDropdownSelect[open] {
    z-index: 1; }

.categoriesDropdownSelectSummary {
    padding: .2em .5em;
    cursor: pointer;
    list-style: none; }

summary::-webkit-details-marker {
    display: none; }

.categoriesDropdownSelect[open] summary:before {
    content: '';
    display: block;
    width: 100vw;
    height: 100vh;
    background: transparent;
    position: fixed;
    top: 0;
    left: 0; }

.categoriesDropdownSelectSummary:focus {
    color: #fff !important;
    background: #475d7b;
    border: 1px solid #475d7b; }

.categoriesDropdownSelectSummary:after {
    content: '';
    display: inline-block;
    float: right;
    width: .5rem;
    height: .5rem;
    border-bottom: 1px solid currentColor;
    border-left: 1px solid currentColor;
    border-bottom-left-radius: 2px;
    transform: rotate(45deg) translate(50%, 0%);
    transform-origin: center center;
    transition: transform ease-in-out 100ms;
    margin: 3px; }

.categoriesDropdownSelectSummary:focus {
    outline: none; }

.categoriesDropdownSelect[open] summary:after {
    margin: 3px;
    transform: rotate(-45deg) translate(0%, 0%); }

.categoriesDropdownSelectList {
    background: #eef0f3;
    position: absolute;
    top: calc(100% + .5rem);
    left: 0;
    padding: 1rem;
    margin: 0;
    box-sizing: border-box;
    border-radius: 5px;
    max-height: 200px;
    overflow-y: auto; }

.categoriesDropdownSelectList > li {
    text-transform: capitalize; }

.categoriesDropdownSelectList a {
    text-decoration: none; }

.categoriesDropdownSelectList li ul li {
    padding-left: 1em; }

.categoriesNav {
    margin-left: 15px; }

/*** Hover ***/

.categoryThumbs .mediaCover .links {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    padding:20% 0 0;
    text-align:center;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;
    background:rgba(0,0,0,.7);
    visibility:hidden; }

    .categoryThumbs .article:hover .links {
        visibility:visible; }

    .categoryThumbs .mediaCover .links a {
        text-align:center;
        border-radius:0.5em;
        -moz-border-radius:0.5em;
        -webkit-border-radius:0.5em;
        display:inline-block;
        padding:0.75em 1em; }

        .categoryThumbs .mediaCover .links a i  {
            position:relative;
            top:0;
            left:0;
            padding:0;
            font-size:1.8em;
            background:transparent; }


/*********************************************************/
/*              Detail                                   */
/*********************************************************/
.categoryDetail .category-lead {
    margin-bottom: 20px;
    margin-right: 8px;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.4;
}

.categoryDetail .category-lead .mediaThumb {
    width:40%;
    height:auto;
    margin:0 0 1em 1em; }

/****************************************************************/
/*              PROFILE                                         */
/****************************************************************/

/******** User Info ********/

#innerNav #userInfo {
    background-color: rgba(0,0,0,.7);
    /*position:absolute;
    left:1em;
    bottom:-1em;*/
}

.vmp-profile-bg {
    margin-left: 100px;
    background-color: #747474;
}

.vmp-profile-bg-img {
    position: absolute;
    right: 0;
    padding-left: 100px;
}

.vmp-profile-bg-img.bg-img-relative-width {
    width: 100%;
    position: relative;
    padding-left: 0;
}

.user-img-wrapper {
    height: 200px;
}

@media (max-width: 600px) {
    #innerNav #userInfo {
        background-color: white;
    }

    .vmp-profile-bg-img {
        display: none;
    }
}

@media (max-width: 1001px) {
    .vmp-profile-bg-img {
        padding-left: 80px;
    }
}

.profileCoverImage {
    width: 100%;
}

@media (min-width:320px) {

    #innerNav #userInfo {
        /*position:absolute;
        left:1em;
        top:-1em;
        bottom:auto;*/
    }

}

@media (min-width:1300px) {

    #innerNav #userInfo {
        /*position:absolute;
        left:1em;
        top:auto;
        bottom:-1em;*/ }

}

    #innerNav #userInfo .userCover {
        float:left;
        margin-right:1em;
        margin-left: -100px;
    }

    #innerNav #userInfo .userCover .userThumb {
        height:200px;
        width:200px; }

    .profileCoverImage .mediaThumb {
        height: 200px;
    }

    @media (min-width:320px) {

        #innerNav #userInfo .userCover .userThumb {
            height:165px;
            width:165px; }

        .profileCoverImage .mediaThumb {
            height: 165px;
        }

    }

    @media (min-width:1300px) {

        #innerNav #userInfo .userCover .userThumb {
            height:200px;
            width:200px; }

    }

    #innerNav #userInfo .userCover .online {
        padding-top:85%; }

    #innerNav #userInfo ul {
        float:left; }

    @media (max-width:1300px) {

        #innerNav #userInfo ul {
            /*padding-top:70px;*/ }

    }

        #innerNav #userInfo ul li {
            color:#fff;
            text-shadow:0 0 5px #000;
            font-family:'Roboto Light', 'robotolight', sans-serif; }

        @media (max-width: 600px) {
            #innerNav #userInfo ul li {
                color: #546174;
                text-shadow: none;
            }
        }

        #innerNav #userInfo ul li.username p {
            margin-bottom: 0;
            display: block; }

        #innerNav #userInfo ul li p {
            margin-bottom: 0.2em;
            display: inline; }

    #innerNav #userInfo .username {
        font-size:2.3em; }

    #innerNav #userInfo .username p {
        margin: 0; }

/******** Action Links ********/

#innerNav #actionNav {
    position:absolute;
    right:1em;
    top:1em; }

    #innerNav #actionNav a {
        margin-left:1em; }

    #innerNav #actionNav .cke_2 a,
    #innerNav #actionNav .mceEditor a {
        margin-left:inherit; }


/******** Tabs / Content Nav ********/

#innerNav #subNav {
    position:absolute;
    right:0;
    bottom:0;
    color: #FFFFFF;
    padding-top: 1em;
    padding-right: 1em;
    width: 100%;
    background-color: rgba(0,0,0,0.7);
}



/*********************************************************/
/*              View                                     */
/*********************************************************/

/******** Profile ********/

#userStatistics i {
    color:#acbbc3;
    width:22px;
    display:inline-block;
    text-align:center;
    padding-right:0.5em; }

#userStatistics li {
    margin-bottom:0.5em; }

.li-indented {
    margin-left: 25px;
}
/*** Group List ***/

#groupList ul {
    display:table; }

    #groupList ul li {
        display:table-row; }

        #groupList ul li > div {
            display:table-cell;
            padding:0.5em;
            vertical-align:middle; }

#groupList .image {
    width:15%; }

#groupList .mediaCover {
    position:relative;
    float:none;
    width:auto; }

    #groupList .mediaCover img {
        width:80px; }

#groupList .details {
    width:45%; }

    #groupList .details a,
    #groupList .details span {
        display:block; }

#groupList .latestUse {
    width:20%;
    text-align:center; }

#groupList .type,
#groupList .action {
    width:10%;
    text-align:center; }

.viewProfile #innerNav .mediaThumb {
    width: 100%;
}

.viewProfile #profile #userInfos table.fields {
  border-collapse: collapse !important;
  width: 100%;
  margin-bottom: 20px;
}

.viewProfile #profile #userInfos table.fields tr th,
.viewProfile #profile #userInfos table.fields tr td {
  min-height: 20px;
  padding: 0 1em 0.5em 0;
  line-height: 1.428571429;
  vertical-align: top;
}

.viewProfile #profile #userInfos table.fields tr th {
  width: 15%;
}

.viewProfile #profile #userInfos table.fields tr td {
  padding: 0;
  width: 85%;
}

/*** User List ***/
.userList li a {
    color: #acbbc3;
    font-size: 0.8em; }

.userList article {
    text-align:center;
    margin-bottom:10px;
    height: 255px; }

    .userList article .name {
        font-size:1.2em !important;
        color:#1a1c1e;
        display:block;
        margin:0.5em 0 0.2em;
        overflow:hidden; }

        .userList article:hover .name {
            color:#475d7b; }

    .userList article p {
        color:#3B6297;
        margin-bottom: 0.3em;
        /*font-size:0.8em;*/
        /*height:30px;*/
        overflow:hidden; }

    .userList article .online {
        padding:80% 0 0; }

    .userList article:hover .userThumb {
        box-shadow:0 0 15px #617ca3;
    }

.userCover {
    position:relative;
    z-index: 89;
}

#usersSearchDiv
{
    margin-bottom: 15px;
}

/******** Blog ********/

#blog .blogList {
    margin:0 0 0 112px;
    border-left:2px solid #acbbc3; }

#blog .bottom {
    padding-right: 0.5em;
    border-right: 5px solid transparent;
}

@media (max-width:1300px) {

#blog .blogList {
    margin:0 0 0 90px; }

}

    #blog .blogList > li {
        position:relative;
        margin:0 0 0 -43px;
        padding:0 0 0 103px; }

    #blog .blogList .date {
        position:absolute;
        top:1.5em;
        left:2px;
        width:80px;
        height:80px;
        padding:0.8em 0;
        border-radius:50%;
        -moz-border-radius:50%;
        -webkit-border-radius:50%;
        background:#6b7075 url('../images/transDL-10.png') 0 50% repeat-x; }

        #blog .blogList li:hover .date {
            background-color:#40454a; }

        #blog .blogList .date span {
            display:block;
            text-align:center;
            color:#fff;
            font-family:'Roboto Bold', 'robotobold', sans-serif; }

        #blog .blogList .date .day {
            font-size:1.8em;
            line-height:1.2em; }

        #blog .blogList .date .month {
            font-size:0.8em; }

        #blog .blogList .date .year {
            font-size:0.8em; }

    #blog .blogList .more {
        bottom:0.8em; }


/******** Account ********/

#userAccountActivity {
    float:left; }

    #userAccountActivity .mediaThumb {
        height:50px;
        width:89px; }


/******** Settings ********/






/*********************************************************/
/*              Account                                  */
/*********************************************************/

/******** Recharge ********/

#recharge fieldset {
    float:left;
    width:60%;
    padding-right:1em; }

#recharge button {
    float:right;
    width:40%;
    margin-top:23px;
    vertical-align:baseline; }


/******** Amount ********/

#userCredits .creditAmount {
    padding:1em;
    border:1px solid #dfe5eb;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;
    text-align:center; }

#userCredits .creditAmount p {
    font-size:2.5em;
    font-family:'Roboto Medium', 'robotomedium', sans-serif  }


/******** Tables ********/

#account .filter {
    margin:1em 0;
    padding:0.75em 0.5em; }

#account .filterTimespan { }

#account .filter .datepicker,
#account .filter .until {
    float:left;
    margin-right:0.5em; }

#account .filter .datepicker {
    width:20%; }

#account .filter button {
    float:left; }

#account .filter .until {
    line-height:34px; }




/*********************************************************/
/*              Edit                                     */
/*********************************************************/

/******** Profile ********/

#editProfile .details {
    padding-left:2em; }

#editProfile .datepicker {
    width:25%; }

#editProfile .radio {
    display:inline-block;
    width:15%;
    vertical-align:bottom;
    margin-top:0; }

    #editProfile .radio label {
        font-family:'open_sansregular', sans-serif; }

.editAvatar {
    position:absolute;
    display:none;
    left:83%;
    top:15%;
    background-color:rgba(0,0,0,0.3);
    border-radius:3px;
    padding:4px; }

.editAvatar i {
    color:white;
    font-size:1.7em; }

.coverOverlay {
    display:none;
    background:rgba(0,0,0,0.3);
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    text-align:center;
    border-radius:.5em;
    -moz-border-radius:.5em;
    -webkit-border-radius:.5em
}

.editCover {
    position:absolute;
    top:5%;
    right:1%;
}

.editCover i {
    color:white;
    font-size:2.5em;
}

.editCover.editCoverCanFollow {
    top: 10%;
}

.manageImageModal.modal .modal-dialog {
    width:60%;
    max-width: unset;
}

@media (max-width: 1300px) {
    .manageImageModal.modal .modal-dialog {
        width:80%; }
}

.manageImageModal.modal .scrollbar,
.manageImageModal.modal .uploadImage,
.manageImageModal.modal .confirmRemoveImage {
    width:100% !important;
    height:500px;
    padding-top:1em;
    padding-bottom:1em;
    overflow:hidden; }

.manageImageModal.modal .uploadImage,
.manageImageModal.modal .confirmRemoveImage {
    text-align:center; }

.manageImageModal.modal .modal-dialog .cropper {
    display:inline-block;
}

.manageImageModal.modal .modal-dialog #preview {
    display:inline-block;
    width:25%;
    margin-left:30px;
    position:absolute;
    overflow:hidden;
    border-radius:50%; }

.avatarPreview {
    border-radius:50%;
}

.manageImageModal.modal .cropper-container {
    margin: auto; }

.manageImageModal.modal div[id^="actions"] {
    margin-top:10px;
    text-align:center; }

.manageImageModal.modal div[id^="uploadImage"]{
    background:none;
    border-radius:0;
    margin:0;
    padding:0; }

.manageImageModal.modal .browse {
    width:auto;
    height:300px;
    margin:auto;
    margin-bottom:10px;
    border:1px dashed #acbbc3;
    border-radius:.5em;
    cursor:pointer;
    padding:5px;
}

.manageImageModal.modal .browse .insideContainer {
    background:#f5f6f7;
    border-radius:.5em;
    height:100%;
}

.manageImageModal.modal .browse .insideContainer div {
    position:relative;
    top:25%;
}

.manageImageModal.modal .uploadImage .message {
    display:none;
    width:600px;
    margin:0 auto 10px;
}

.manageImageModal.modal .browse i {
    color:#acbbc3;
    font-size:4em;
    display:block;
}

.manageImageModal.modal .browse strong {
    font-size:1.5em;
}

.manageImageModal.modal .uploadImage .upload[disabled] {
    opacity:1;
    background:#acbbc3;
    text-shadow:none;
    border:none;
}

.manageImageModal.modal .btn-group {
    margin:0 5px; }

.manageImageModal.modal .btn-group i {
    color:#51585f; }

.manageImageModal.modal .modal-footer .left,
.manageImageModal.modal .modal-footer .back {
    float:left;
    display:inline-block; }

/******** Open IDs ********/

.changeOpenID .openIDs {
    width:60%; }

    .changeOpenID .openIDs ul {
        margin:0; }

.changeOpenID .openIDs .top {
    font-size:.8em; }

.changeOpenID .openIDs .links {
    padding:0.5em 0;
    border-bottom:1px solid #ccc; }

.changeOpenID .openIDs .link,
.changeOpenID .openIDs .action {
    float:left; }

.changeOpenID .openIDs .link {
    width:60%; }

.changeOpenID .openIDs .action {
    width:40%; }



/*********************************************************/
/*              Activity                                 */
/*********************************************************/

.userActivity .heading {
    position:relative;
    padding:0 0 0 20px;
    margin:0 0 1em;
    height:45px; }

    .userActivity .heading .userThumb {
        position:absolute;
        top:0;
        left:0;
        height:35px;
        width:35px; }

    .userActivity .heading header {
        float:right;
        display:block;
        width:100%;
        margin-top:5px;
        padding:0.5em 0.5em 0.5em 2.3em;
        background:#f5f6f7; }

        .userActivity .heading header h4 {
            float:left;
            margin:0;
            font-size:1em; }

            .userActivity .heading header h4 i {
                color:#acbbc3; }

            .userActivity .heading header h4 .icon-vimeo span {
                vertical-align:bottom;
                background-image:url("../images/icon_vimeo-GREY.png"); }

        .userActivity .heading header .time {
            float:right;
            font-size:0.8em;
            color:#acbbc3; }

.userActivity .content {
    padding:0 0 0 30px; }

    .userActivity .content h3 {
        margin-top:0;
        padding-right:4em; }


/*** Media ***/

.userActivity .mediaCover {
    position:relative;
    float:left;
    width:20%; }

@media (max-width: 600px) {
    .userActivity .mediaCover {
        float: none;
        width: 100%;
    }
}
    .userActivity .mediaCover i {
        position:absolute;
        bottom:0.5em;
        left:0.5em; }

.userActivity .mediaText {
    float:left;
    width:80%;
    padding:0 0 0 1em; }

.userActivity .media .content {
    position:relative;
}

.userActivity .media .content a {
    display: block;
}

.userActivity .media .content a .mediaCover img {
    border: 5px solid transparent;
}

.userActivity .media .content a:focus .mediaCover img {
    border-color: #3B6297;
}

.userActivity .media .price {
    position:absolute;
    top:0;
    right:1em; }


/*** Blog ***/

.userActivity .blogText {
    float:left;
    width:80%;
    padding-right:1em; }

.userActivity .blog .mediaThumb {
    position:relative;
    float:left;
    width:20%; }


/*** Group ***/

.userActivity .group .content {
    position:relative; }

.userActivity .group .memberCount {
    position:absolute;
    right:1em;
    top:0;
    color:#acbbc3; }


/******** Global ********/

.activityListing {
    position: relative; }

.activityListing .userActivity li {
    padding:0 0 1em;
    margin:1em 8px 0 8px;
    border-bottom:1px solid #dfe5eb;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
}

    .activityListing .userActivity li:first-child {
        margin:0 8px;
    }


/******** On Profile ********/

#activity .userActivity {
    margin:0 0 0 125px;
    border-left:2px solid #acbbc3; }

    @media (max-width: 600px) {
        #activity .userActivity {
            margin: 0 0 0 65px;
        }
    }

    #activity .userActivity li {
        position:relative;
        margin:0 0 0 -131px;
        padding:0 0 0 155px; }

    #activity .userActivity .date {
        position:absolute;
        top:1.2em;
        left:0;
        width:200px; }

        #activity .userActivity .date span {
            display:inline-block;
            width:120px;
            text-align:right;
            margin-left: 1px;
        }

        #activity .userActivity .date i {
            color:#acbbc3;
            margin-left: 2px;
        }

    #activity .userActivity article {
        padding:0.5em 1em 1em;
        margin:0 0 1em;
    }

    #activity .userActivity article article {
        padding: 0;
        margin: 0;
    }

    #activity .userActivity .heading {
        padding:0; }

        #activity .userActivity .heading header {
            padding:0.5em; }

    #activity .userActivity .content {
        padding:0; }


/*********************************************************/
/*              Login & Registration                     */
/*********************************************************/

#register,
#login {
    position:relative; }

.loginOptions,
.registerOptions {
    /*float:left;
    width:50%; */
    text-align:center;
    padding:2.5em 0; }

.samlAuth,
.facebookConnect,
.openID {
    display:inline-block;
    text-align:center;
    margin:.5em 0;
}

.samlAuth,
.facebookConnect i,
.openID i {
    margin-right:0.5em;
}

.samlAuth,
.facebookConnect .btn-facebook,
.openID .btn-openID {
    font-size:1.4em;
    margin:0 2em;
}

.loginOptions {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

.facebookConnect a,
.facebookConnect i,
.facebookConnect i:before {
    color: #ffffff;
}



.btn.btn-saml {
    color: #475d7b;
    text-shadow: none;
    border: 1px solid #475d7b;
    background: 0 0;
}

.userForm form {
    max-width:600px;
    margin:0 auto;
    padding:2em 2em 1em; }

    .userForm .form-group {
        position:relative; }

    .userForm legend {
        margin-top:0;
        border-bottom:none; }

    .userForm .control-label {
        display:none; }

    .userForm .additional .control-label {
      display: block;
    }

    .userForm .captchaImage {
        display:block;
        margin:0.5em 3em 0; }


/*** Login ***/

.userLogin .forgotPassword,
.userLogin .registerNow {
    float:right;
    margin-top:7px; }

.userLogin .forgotPassword{
  margin-right:15px; }

.userLogin .buttonpane .checkbox {
    float:left; }

/*** Register ***/








/*** or ***/


#register .or,
#login .or,
#userActions #loginDropdown .or,
#userActions #registrationDropdown .or {
    margin:0 auto 1.5em;
    max-width:600px;  }

/******** Header ********/

#new .image {
    float:left;
    width:20%; }

#new .details {
    float:left;
    width:80%; }

@media (min-width:320px) {

    #new .image {
        display:none; }

    #new .details {
        float:none;
        width:100%; }

}

@media (min-width:1300px) {

    .sendMail {
        max-width:800px;
        margin:0 auto; }

    #new .image {
        display:none; }

    #new .details {
        float:none;
        width:100%; }

}


/*********************************************************/
/*              List                                     */
/*********************************************************/

.chooseMessage {
    float:left;
    /*width:25% !important; */
}

.viewMessage {
    float:left;
    padding-left:2em;
    width:55%;}

@media (min-width:320px) {

.chooseMessage {
    float:left;
    /*width:30% !important;*/ }

.viewMessage {
    float:left;
    padding-left:2em;
    /*width:70% !important;*/ }

}

@media (min-width:1300px) {

.chooseMessage {
    float:left;
    /*width:25% !important;*/ }

.viewMessage {
    float:left;
    padding-left:2em;
    /*width:71% !important;*/ }

}


.chooseMessage li {
    border-bottom:1px solid #acbbc3; }

.chooseMessage section {
    margin:2px 0;
    position:relative; }

    .chooseMessage > ul {
        width: 100%;
    }

    .chooseMessage section:hover {
        background:#F5F6F7; }

    .chooseMessage section.new {
        border-left:4px solid #617ca3; }

    .chooseMessage section.active {
        background:#d8dfe9; }

.chooseMessage:not(.hasMark) .delete,
.chooseMessage:not(.hasMark) .user,
.chooseMessage:not(.hasMark) .group,
.chooseMessage:not(.hasMark) .details {
    display:table-cell;
    vertical-align:middle; }

.chooseMessage .group {
    height: 70px;
}

.chooseMessage .user,
.chooseMessage .group {
    width:55px;
    height:55px;
    border: 5px solid transparent;
    border-radius: 30px;
}
.chooseMessage .user:focus,
.chooseMessage .group:focus {
    border: 5px solid #3B6297;
}

    .chooseMessage .user .userThumb,
    .chooseMessage .group .mediaThumb {
        width:45px;
        max-width:45px !important;
        display:block; }

.chooseMessage .details {
    width:230px;
    padding:0 20px 0 10px; }

    .chooseMessage .details a {
        font-size:0.8em; }

    .chooseMessage .details a p {
        margin: 0;
        display: inline;
    }

    .chooseMessage .details a,
    .chooseMessage .details a h3 {
        font-size:1em;
        line-height:1.2em;
        margin:0;
        color:#1a1c1e;
        max-height:30px;
        overflow:hidden;
    }

    .chooseMessage .details a{
        max-width: 50%;
    }

    .chooseMessage .details .date {
        position:absolute;
        top:9px;
        right:10px;
        font-size:0.7em;
        color:#6b7075; }

.chooseMessage .replied {
    position:absolute;
    right:1em;
    top:50%; }

#inboxList {
    overflow-x: auto; }

#inboxList ul{
    display: block; }

/*********************************************************/
/*              Detail                                   */
/*********************************************************/

/******** Header ********/

.viewMessage header {
    position:relative;
    margin-bottom:1em;
    border-bottom:1px solid #acbbc3; }

    .viewMessage header .recipients a p{
        margin: 0;
        display: inline; }

    .viewMessage header h2 {
        margin-top:0; }

    .viewMessage header span {
        color:#607580; }

    .viewMessage header .userThumb {
        height:25px;
        width:25px; }


/******** Detail ********/

.viewMessage .scrollbar {
    border:none; }

.viewMessage .details.scrollbar  {
    width:100% !important;
    height:auto; }

.viewMessage .details .received,
.viewMessage .details .sent {
    margin-bottom:20px;
    display: flex;
    flex-direction: row;
}

.viewMessage .details .vmp-clm-wrp {
    width: 100%;
    margin-top: 30px;
}

.viewMessage .details .userThumb {
    height:65px;
    width:65px;
    max-width:65px !important;
    margin-top: 2px;
}

.viewMessage .details .user {
    font-size:0.9em;  }

.viewMessage .details .date {
    color:#6b7075;
    font-size:0.8em;  }

.viewMessage .details .image {
    /*width:15%;*/ }

.viewMessage .details .info,
.viewMessage .details .text {
    /*width:85%;*/
}

@media (min-width:320px) {

    .viewMessage .details .image {
        /*width:20%;*/ }

    .viewMessage .details .info,
    .viewMessage .details .text {
         /*width:80%;*/
    }

}

@media (min-width:1300px) {

    .viewMessage .details .image {
        /*width:15%;*/ }

    .viewMessage .details .info,
    .viewMessage .details .text {
        /*width:85%;*/ }

}


.viewMessage .details .info {
    padding-bottom:0.25em;
}

.viewMessage .details .text {
    margin-top:5px;
    background-color: #f5f6f7;
    padding: 1em;
}


/*** Received ***/

.viewMessage .received .image {
    text-align:left; }

.viewMessage .received .info,
.viewMessage .received .text {
    /*float:right;*/
}

.viewMessage .received .info {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    margin-left: 10px;
}

.viewMessage .received .info .user {
    margin-right: 1em;
    font-weight: bold;
    /*float:left;*/
}

.viewMessage .received .info .date {
    /*float:right;*/ }


/*** Sent ***/

.viewMessage .sent .image {
    float:right;
    text-align:right; }

.viewMessage .sent .info,
.viewMessage .sent .text {
    float:left; }

.viewMessage .sent .info .user {
    float:right; }

.viewMessage .sent .info .date {
    float:left; }


/*** Notification ***/

#notificationMessage .userThumb {
    height:35px;
    width:35px; }


/*** Notification - user request ***/

#notificationMessage .friendRequest #userList {
    float:left;
    width:15%; }

    #notificationMessage .friendRequest #userList .userThumb {
        height:65px;
        width:65px; }

#notificationMessage .friendRequest .wrap .quote {
    float:left;
    width:85%;
}


/*** Notification - group invite ***/

#notificationMessage .groupInvite .groupListing {
    float:left;
    width:65%; }

#notificationMessage .groupInvite .wrap .quote {
    float:left;
    width:35%; }

#userList .userList>li>article>a .userCover .userThumb {
    border: 5px solid transparent;
}

#userList .userList>li>article>a:focus .userCover .userThumb {
    border: 5px solid #3B6297;
}

/****************************************************************/
/*              COOKIE HINT                                     */
/****************************************************************/

.alert.cookieHint {
  margin-bottom: 0;
  color: #fcfcfc;
  background-color: #61686f;
  border-color: #5c5c5c;
  border-radius: 0;
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:1040;
  opacity:0.95;
}

.alert.cookieHint p a{
    color:#000;
}

.alert.cookieHint a.alert-link {
  background-color: #7c7c7c;
  /*border-radius: 5px;*/
  color: #fcfcfc;
  padding: 3px 10px;
  -webkit-padding-before: 5px;
  -webkit-padding-after: 5px;
  position:relative;
  top:2px;
    text-decoration: none;
}

.alert.cookieHint a.alert-link:hover {
  background-color: #8c8c8c;
}

.alert.cookieHint a.alert-link:focus {
    background-color: #000000;
}


.alert.cookieHint button.close {
  color: #fcfcfc;
  opacity: 0.7
}

.alert.cookieHint .cookieHolder{
    width:60%;
    margin:0 auto;
}

.alert.cookieHint .cookieHolder a.underlined:focus{
    background-color: #000000 ;
    color: #FFFFFF;
}

.alert.cookieHint .cookieBar{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.alert.cookieHint .vmp-more-btn{
    display: flex;
    border: none;
    margin: auto;
    background-color: transparent;
    justify-content: center!important;
}

.alert.cookieHint .vmp-more-btn:focus p{
    background-color: #000000;
}
.alert.cookieHint .cookieOptions{
    border:1px solid #b0b3b8;
    display: flex;
    flex-direction: row;
    margin-top:5px;
    width:auto;
    flex-grow: 2;
    justify-content: space-around;
}

.alert.cookieHint .cookieOptions .cookiesList{
    padding:10px;
    height:85px;
    overflow:auto;
}

.alert.cookieHint .cookieLinks{
    /*float:right;
    position:relative;
    top:9px;*/
    display: flex;
    flex-direction: row;
    margin-top:5px;
    flex-grow: 1;
    flex-wrap: wrap;
}

.alert.cookieHint .cookieLinks a{
    margin: 2px 0 6px 10px;
}

.alert.cookieHint .tabPill{
    padding:6px 5px;
    /*display:table-cell;
    width:130px;*/
}

.alert.cookieHint .tabPill:first-child input{
    cursor:none;
}

.alert.cookieHint .tabPill:nth-child(4){
    /*border-right:1px solid #b0b3b8;*/
    cursor:pointer;
}

.alert.cookieHint #showMore{
    cursor:pointer;
    height:35px;
    display: flex;
    flex-direction: row;
    justify-content: center;
}

.alert.cookieHint #showMore span{
    margin-left:5px;
    margin-right: 5px;
}

.alert.cookieHint #showMore .icon-chevron-down{
    margin-top:3px;
}

.alert.cookieHint .tabPill input[type="checkbox"],
.alert.cookieHint .cookiesList input[type="checkbox"]{
    position:relative;
    top:2px;
    cursor:pointer;
}

.alert.cookieHint .cookieDetails{
    clear:both;
    display:none;
    /*padding-top:20px;*/
}

.alert.cookieHint .detailsLeft{
    float:left;
    width:20%;
    border-top: 1px solid #b0b3b8;
    border-left: 1px solid #b0b3b8;
    border-bottom: 1px solid #b0b3b8;
    height: auto;
    max-height: 135px;
}

.alert.cookieHint .detailsLeft .tab{
    border-bottom:1px solid #b0b3b8;
    border-right:1px solid #b0b3b8;
    margin:0;
    padding:7px;
    cursor:pointer;
}

.alert.cookieHint .detailsLeft .tab:last-child{
    border-bottom:none;
}

.alert.cookieHint .detailsLeft .tab.active{
    border-right:none;
}

.alert.cookieHint .detailsLeft .tab:focus {
    background-color: #ffffff;
    color: #61686f;
}

.alert.cookieHint .detailsLeft .tab.active:focus{
    color: #ffffff;
    background-color: #61686f;
}


.alert.cookieHint .detailsRight{
    float:right;
    width:80%;
    border-right: 1px solid #b0b3b8;
    border-top: 1px solid #b0b3b8;
    border-bottom: 1px solid #b0b3b8;
    height: auto;
    max-height:135px;
    padding: 10px 45px;
    overflow:auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.alert.cookieHint .detailsRight p:first-child{
    margin-bottom:1em;
}

#cookieHintCloseButtonAll, #cookieHintCloseButton, #cookieHintCloseButtonRejectAll {
    background-color: #3b6297;
    color: white;
}

#cookieHintCloseButtonAll:hover, #cookieHintCloseButton:hover, #cookieHintCloseButtonRejectAll:hover {
    background-color: #dfe5eb;
    color: #3b6297;
}

#cookieHintCloseButtonAll:focus, #cookieHintCloseButtonRejectAll:focus, #cookieHintCloseButton:focus {
    background-color: #000000;
}

@media (max-width: 1500px)
{
    .alert.cookieHint .cookieHolder{
        width:70%;
        margin:0 auto;
    }
}

@media (max-width: 1300px)
{
    .alert.cookieHint .cookieOptions{
        float:none;
        width:100%
    }

    .alert.cookieHint .cookieLinks{
        margin-bottom:15px;
    }
}

@media (max-width: 992px)
{
    .alert.cookieHint{
        padding: 15px 0;
    }

    .alert.cookieHint .cookieHolder{
        width:90%;
        margin:0 auto;
    }
}

@media (max-width: 768px) {
    .alert.cookieHint .detailsLeft,
    .alert.cookieHint .detailsRight{
        height:132px;
        max-height:132px;
    }

    .alert.cookieHint .detailsLeft .tab{
        padding:6px;
    }
}

/****************************************************************/
/*              COOKIE CONSENT                                  */
/****************************************************************/

.cookieConsent{
    padding:0 10px;
}

.cookieConsent .withdrawConsent{
    cursor:pointer;
}

.cookieConsent .cookieCategory{
    margin-top:25px;
    padding-bottom:10px;
}

.cookieConsent .cookieCategory .categoryName{
    font-size:16px;
    font-weight:bold;
    color:#617ca3;
    margin-bottom:10px;
}

.cookieConsentModal .modal-body{
    padding-left:25px;
    padding-right:25px;
}

.cookieConsentModal input[type="checkbox"]{
    position:relative;
    top:2px;
}

.cookieConsentModal button{
    display:block;
    margin:20px auto 10px;
}

.cookieConsentModal p{
    color:#979b9f;
}

/****************************************************************/
/*              PUBLISH DATES                                   */
/****************************************************************/

#publication label{
  display:block;
  float:none !important;
  width:100% !important;
}

#publication span{
  margin-left: 5px;
  margin-top: 5px;
  vertical-align: top;
  display: inline-block;
}


/****************************************************************/
/*              DateTimePicker Ffixe                            */
/****************************************************************/
.bootstrap-datetimepicker-widget ul {
  height: auto;
}

/****************************************************************/
/*              Captcha CSS Fix                                 */
/****************************************************************/
#captcha div
{
    height: 100% !important;
}

/*additional files styles*/
.hide_input {
    display: none!important;
}

#show_input {
    cursor: pointer;
}

.max_size {
    color: #acbbc3;
}

.attachment {
    display: inline-block;
}

.delete_icon {
    padding-right: 5px;
    height: 20px;
    font-size: 20px;
}

/******** Breadcrumbs ********/

.breadcrumbs {
    padding-top: 15px;
    font-size: 1.1em;
}

.breadcrumbs.breadcrumb-indent {
    margin-left: 15px;
}

.document-hint {
    margin: 15px 15px 15px 0;
}

/******** REDESIGN *********/

input[type="checkbox"] {
    border-radius: 0;
}

.btn {
    border-radius: 0;
}

.btn-default.active.focus,
.btn-default.active:focus,

.btn-default:active.focus,
.btn-default:active:focus,
.btn-default:active:hover,
.open>.dropdown-toggle.btn-default.focus,
.open>.dropdown-toggle.btn-default:focus,
.open>.dropdown-toggle.btn-default:hover {
    color: #ffffff;
    background-color: #475d7b;
    /*border-color: #475d7b;*/
}
.btn-default.active:hover {
    color: #ffffff;
    background-color: #3B6297;
}

.btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus {
    outline: none;
    outline-offset: 0;
}

.btn-primary,
.btn-primary i,
#contentWrapper .empty a .icon-edit:before,
.btn-primary:visited {
    background-color: transparent;
    color: #475d7b;
}

#contentWrapper .empty a:hover .icon-edit:before {
    color: #ffffff;
}

.btn-primary, .btn-primary:visited {
    color: #475d7b;
    text-shadow: none;
    border: 1px solid #475d7b;
    background: transparent;
}

#userActions #loginDropdown, #userActions #registrationDropdown {
    background: #f5f6f7;
    box-shadow: -5px 5px 16px -2px #8a95a6;
}
#siteSidebar #siteNav li .sitemenu-submenu-wrap-form>button,
#siteSidebarMobile #siteNav li .sitemenu-submenu-wrap-form>button {
    color: #3B6297;
    padding: 8px 16px 8px 32px;
}
#siteSidebar #siteNav li .sitemenu-submenu-wrap-form>button.open-sub-menu,
#siteSidebarMobile #siteNav li .sitemenu-submenu-wrap-form>button.open-sub-menu {
    padding-left: 16px;
}
#siteSidebar #siteNav li.active .sitemenu-submenu-wrap-form>button i,
#siteSidebar #siteNav li.active .sitemenu-submenu-wrap-form>button i:before,
#siteSidebarMobile #siteNav li.active .sitemenu-submenu-wrap-form>button i,
#siteSidebarMobile #siteNav li.active .sitemenu-submenu-wrap-form>button i:before {
    color: #ffffff;
}

#contentWrapper #siteSidebar #siteNav>li.active>.sitemenu-wrap-form>button,
#contentWrapper #siteSidebarMobile #siteNav>li.active>.sitemenu-wrap-form>button {
    border-right: 5px solid #3B6297;
}

.hasSublinks .icon-chevron-right:before {
    transform: rotate(90deg);
}
.channelSlider .icon-chevron-right:before {
    transform: none;
    color: #aebcd0;
}

#siteNav .hasSublinks ul li:hover {
    background-color: #c4d4e1;
}

#searchHead .input-group label,
#searchHeadMobile .input-group label {
    color: #8a9eac!important;
}

.upload:hover {
    color: #40454a;
}

.upload:hover .icon-cloud-upload {
    color: #40454a;
}

#userControls .button.profile:hover .linkToProfile>a:first-child{
    /*color: #40454a;*/
}

#userControls .button.profile .linkToProfile a.actionLink:hover{
    /*color: #40454a;*/
}

#userControls .button.profile .linkToProfile a.actionLink:hover .icon-pencil{
    /*color: #40454a;*/
}

#profileLink .linkToProfile .links .actionLink[href="/logout"]:hover{
    color: #40454a;
}
#profileLink .linkToProfile .links .actionLink[href="/logout"]:hover .icon-off:before{
    color: #40454a;
}

#profileLink .linkToProfile .links .actionLink[href|="/user"]:hover{
    color: #40454a;
}

#userControls .profile:hover {
    background: none;
    /*background-image: none;*/
}

.form-control:focus {
    border-color: #617ca3;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px 2px rgba(172,187,195,.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px 2px rgba(172,187,195,.6);
}

.form-control[type="checkbox"] {
    height: 0;
    margin-bottom: 15px;
}

.form-control[type="checkbox"]:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
}

#header_login .input-group .form-control {
    background-color: #FFFFFF;
    border-radius: 0;
}

#header_login .input-group .input-group-addon {
    border-radius: 0;
    background-color: #dfe5eb;
}

#userActions .userLoginLink:hover {
    z-index: 9999;
    background: none;
}

#loginDropdown:before {
    content: '';
    border-width: 0 8px 8px 8px;
    border-color: transparent transparent #f5f6f7 transparent;
    border-style: solid;
    left: 50%;
    position: absolute;
    top: -8px;
}

.channelVisibility li {
    margin-bottom: 0;
}

/********************USER LINKS PULLDOWN***********************/

#userControls .profile #userLinks {
    /*box-shadow: 0 2px 2px #8a95a6;*/
    box-shadow: -5px 5px 16px -2px #8a95a6;
    display: flex;
    border-radius: 0;
}
#userControls .profile #userLinks:before {
    content: '';
    border-width: 0 8px 8px 8px;
    border-color: transparent transparent #f5f6f7 transparent;
    border-style: solid;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    top: -8px;
}

@media (max-width: 1000px) {
    #userControls .profile #userLinks:before {
        left: 94.5%;
    }
}

#userControls #profileLink {
    float: none;
}
#userControls #profileLink{
    display: flex;
    flex-grow: 1;
}
#userControls #furtherLinks {
    display: flex;
    flex-grow: 2;
}

#userControls #furtherLinks ul {
    display: flex;
    flex-direction: column;
    width: 50%;
}

#userControls #furtherLinks ul li {
    display: flex;
    justify-content: space-between;
}
#userControls #furtherLinks ul li span {
    display: flex;
    justify-content: center;
    align-self: center;
}

.usernameSearch {
    position: relative;
    float: right;
    margin-top: -23px;
    margin-right: 5px;
}

.selectIdp {
    font-size: 14px;
    padding: 6px 12px;
}

/************************LEFT NAVI********************************/

#siteSidebar #siteNav li .sitemenu-wrap-form>button,
#siteSidebarMobile #siteNav li .sitemenu-wrap-form>button {
    color: #3B6297;
    padding: 10px 16px 10px 32px;
}

#siteSidebar #siteNav>ul>li:hover>.sitemenu-wrap-form>button,
#siteSidebar #siteNav>ul>li:hover>.sitemenu-submenu-wrap-form>button,
#siteSidebarMobile #siteNav>ul>li:hover>.sitemenu-wrap-form>button,
#siteSidebarMobile #siteNav>ul>li:hover>.sitemenu-submenu-wrap-form>button/*,
#siteSidebar #siteNav>ul>li ul li:hover .sitemenu-wrap-form button,
#siteSidebar #siteNav>ul>li:hover>.sitemenu-wrap-form button .icon-chevron-right:before*/{
  color: #FFFFFF;
}

#categoryLinks,
#categoryLinksMobile {
    margin: 16px;
    border-bottom: 1px solid #acbbc3;
}

#categoryLinks li, #categoryLinks li ul li, #categoryLinks li.panel,
#categoryLinksMobile li, #categoryLinksMobile li ul li, #categoryLinksMobile li.panel {
    border-bottom: none;
    margin-left: 16px;
}

#categoryLinks h3,
#categoryLinksMobile h3 {
    font-weight: 600;
    font-size: 1.1em;
}

#categoryLinks .bottom,
#categoryLinksMobile .bottom {
    padding: 0 0 8px;
    border: none;
}

#categoryLinks .accordion,
#categoryLinksMobile .accordion {
    margin-bottom: 0;
}
#tagLinks {
    margin: 16px;
}
#tagLinks h3 {
    font-weight: 600;
    font-size: 1.1em;
    margin-bottom: 16px;
}

#siteHeader .button-wrap-form {
    height: 0;
}

#contentWrapper .button-wrap-form button {
    border: 1px solid #475d7b;
    background: transparent;
}
#contentWrapper .button-wrap-form button:hover {
    background: #3B6297;
}
#contentWrapper .button-wrap-form button.tag {
    border: none;
    background: #acbbc3;
}
#contentWrapper .button-wrap-form button.tag:hover,
#contentWrapper .button-wrap-form button.tag:focus {
    background: #3B6297;
}
/************************CONTENT*********************************/

.filter {
    background: transparent;
    margin-bottom: 21px;
    display: flex;
    justify-content: end;
    flex-wrap: wrap;
}
.nav.nav-tabs>li.active>button,
.nav.nav-tabs:not(#myTab)>li.active>a {
    color: #3B6297;
    background: #ffffff;
    border: none;
    font-weight: bold;
    padding: 0.5em 1em;
}
.nav.nav-tabs>li.active>button:focus,
.nav.nav-tabs:not(#myTab)>li.active>a:focus {
    /*color: #3B6297;*/
}

.btn.active, .btn.focus, .btn:active, .btn:focus {
    /*border: 1px solid #acbbc3;
    background: #dfe5eb;
    box-shadow: inset 2px 2px 3px rgba(172,187,195, 0.6);*/
}

.h2, h2 {
    font-weight: 600;
}

.emtpy {
    margin-left: 30px;
    font-style: italic;
    color: #8a9eac;
}
#siteContent #media-box .tab-content.viewListing {
    min-height: 206px;
}
.empty {
    margin-top: 21px;
    padding-bottom: 1em;
    font-style: italic;
    color: #8a9eac;
}

/*#siteContent h1:not(.no-indent) {*/
/*    margin-left: 8px;*/
/*    border-left: 5px solid transparent;*/
/*}*/

#siteContent>article.lead {
    border-left: 5px solid transparent;
}

#siteContent div.lead {
    margin-left: 0;
}

/*#siteContent h2:not(.no-indent) {*/
/*    margin-left: 8px;*/
/*    border-left: 5px solid transparent;*/
/*}*/
#siteContent>.nav.nav-tabs{
    border-bottom: none;
}
#siteContent .nav.nav-tabs a{
    text-decoration: none;
}

#siteContent .breadcrumbs .icon-chevron-right:before {
    content: ">";
    transform: none;
}

.bottom {
    padding: 0 8px .5em 0;
    border-bottom: 1px solid #acbbc3;
    border-right: 5px solid transparent;
    border-top: none;
}

.bottom .more {
    margin-top: 0;
}

.filterView.btn-group {
    background-color: transparent;
}

.btn-group>.btn {
    border: 1px solid #475d7b;
    border-radius: 0;
    background: transparent;
}

.btn.active {
    color: #FFFFFF;
    background-color: #3B6297;
}

.btn-group>.btn.active {
    box-shadow: none;
}
#userActions:hover [class*=" icon-"]:before,
#userActions:hover [class^=icon-]:before,
/*a:hover [class*=" icon-"]:before,
a:hover [class^=icon-]:before,*/
.userLoginLink:hover > a  {
    color: #475d7b;
}

#userActions:hover .icon-facebook:before,
a:hover .icon-facebook:before,
a:hover .icon-twitter:before {
    color:#ffffff;
}

#header_login [class*=" icon-"]:before,
#header_login [class^=icon-]:before/*,
.filterView.btn-group [class^=icon-]:before,
.filterView.btn-group [class*=icon-]:before*/ {
    color: #475d7b;
}

.btn:hover [class*=" icon-"]:before,
.btn:hover  [class^=icon-]:before,
.btn.active [class*=" icon-"]:before,
.btn.active [class^=icon-]:before{
    color: #FFFFFF;
}

/************************MEDIA THUMBS****************************/

.mediaThumbs.small .additionalInfo {
    display: flex;
    justify-content: flex-end;
    padding: 1em 1em 1em;
    line-height: 1.2em;
    white-space: nowrap;
}

.mediaThumbs.small .additionalInfo p {
    color: #617ca3;
}

.mediaThumbs.small li {
    margin-bottom: 20px;
}

.mediaThumbs.small h3 {
    float: left;
    width: 75%;
}

.mediaThumbs.small .details li {
    color: #3B6297;
}

#contentWrapper .glyphicon,#contentWrapper a [class*=" icon-"],#contentWrapper a [class^=icon-] {
    color: #3B6297;
}

.mediaThumbs.small .mediaCover i.tagged{
    position: absolute;
    top: 5px;
    right: 5px;
    padding: 0px;
}

#contentWrapper a .mediaCover .tagged{
    color: #FFFFFF;
    background-color: transparent;
    width: 12px;
    height: 35px;
    border-radius: 0;
}
#contentWrapper a .mediaCover .tagged:before {
    color: #FFFFFF;
}

#ContentWrapper a .icon-file {
    color: #FFFFFF;
}


.mediaCover > i:not(.icon-vimeo):not(.icon-shopping-cart) {
    background-color: #ffffff;
}
#addChannelMedia #addMedia .mediaCover i,
#channelContent #addMedia .mediaCover i {
    color: #3B6297;
}
#channelContent #addMedia .mediaCover .links .remove.confirm,
#addChannelMedia #addMedia .mediaCover .links .add {
    background-color: #FFFFFF;
}

@media(min-width: 576px) {
    .mediaThumbs.small>li>a {
        border: 3px solid transparent;
    }
}

.mediaThumbs.small .mediaCover .userThumb {
    width: 22px;
    height: 22px;
}

.mediaThumbs.small article .mediaCover .uploader span{
    color: #798388;
    text-shadow: none;
    margin-left: 4px;
}
.mediaThumbs.small article:hover .mediaCover .uploader span {
    color: #FFFFFF;
}

.mediaThumbs list > li:focus-within {
    outline: none;
}

#contentWrapper a:not(.actionLink) .icon-play:before,
#contentWrapper a:not(.actionLink) .icon-edit:not(.icon-owner):before,
#contentWrapper a:not(.actionLink) .icon-file:before,
#contentWrapper a:not(.actionLink) .icon-zoom-in:before {
    color: #FFFFFF;
}

#webTV a .icon-play:before {
    color: #475d7b;
}

#siteNav .hasSublinks ul li:not(:first-child) {
    border-top: none;
}

#siteNav .hasSublinks ul li {
    background-color: #d8e2ec;
}
#siteNav .hasSublinks ul li.active {
    background-color: #acbbc3;
}
/*************************MEDIA DETAIL PAGE************************/

.vmp-flex {
    display: flex;
}

.vmp-main-content {
    flex-grow: 2;
}
#mediaPlayer.vmp-page.col-lg-9,
#mediaPlayer.vmp-page.col-xlg-9 {
    width: 100%;

}


/************************ACTIVITIES*******************************/

.activityListing .userActivity li {
    border-bottom: 1px dashed #dfe5eb;
}

#activities-box {
    padding-bottom: 40px;
    border-bottom: 1px solid #acbbc3;
}

.vjs-menu-button-popup.vjs-captions-button .vjs-menu {
    width: 15em;
}

.vjs-control-bar .vjs-menu-button-popup .vjs-menu {
    left: 50%;
    transform: translateX(-50%);
}

/***********************USER PAGE*************************************/

#innerNav #userInfo .userCover .online {
    padding-top: 86%;
}

.mediaThumb {
    border-radius: 0;
}

.online span {
    background: #276235;
}

.nav-tabs>li>a {
    border-radius: 0;
    margin-right: 0;
    height: 38px;
}

#subNav .nav-tabs>li>a,
#subNav ul{
    color: #FFFFFF;
}

#button_profile:focus-within #userLinks {
    visibility: visible;
}

#subNav .nav-tabs {
    border-bottom: 1px solid #3B6297;
    display: flex;
    justify-content: flex-end;
}
.viewProfile #subNav .nav-tabs {
    border-color: #FFFFFF;
}
#subNav .nav-tabs>li>a {
    background: none;
    color: #ffffff;
}

#subNav .nav-tabs>li>a:hover {
    /*color: #1a1c1e;*/
    color: #ffffff;
    background-color: #728594;
    border-bottom: 1px solid #3B6297;
}
#subNav .nav-tabs>li>a:hover {
    border-color: #FFFFFF;
}
.viewProfile #subNav .nav-tabs>li>a:hover {
    border-color: #FFFFFF;
}

#subNav .nav-tabs>li.active>a,
#subNav .nav-tabs>li.active>a:focus,
#subNav .nav-tabs>li.active>a:hover {
    border-top: none;
}

#subNav .nav-tabs>li.active>a,
#subNav .nav-tabs>li.active>a:focus,
#subNav .nav-tabs>li.active>a:hover {
    padding: 0.5em 1em;
}
/***************************MODAL PUP-UP **************************************/
.modal-content {
    border-radius: 0;
}

.modal-content .modal-body {
    display: flex;
    flex-direction: column;
}

.modal-content .modal-body .close {
    align-self: flex-end;
}

.modal-content .modal-body .bootbox-body{
    border-top: 1px solid #e5e5e5;
}

.modal-content .modal-footer {
    border-top: none;
}
/*********************************MESSAGES***************************************/

.markAll {
    width: fit-content;
    display: flex;
    justify-content: flex-end;
    color: #617ca3;
    line-height: 1.3em;
    cursor: pointer;
}

.markAll:hover:before{
    color: #475d7b
}

#notification #inboxList {
    padding-right: 5px!important;
    padding-top: 3px;
}

#inboxList {
    background-color: #edeeef;
    border: none;
}




#inboxList ul li {
    border: none;
    cursor: pointer;
}

#inboxList section{
    display: flex;
    height: auto;
    padding: 10px 0;
    background-color: #dfe5eb;
    border-left: 4px solid #dfe5eb;
    border-radius: 5px;
    width: 100%
}

#inboxList section.active{
    display: flex;
    height: auto;
    background-color: #c5d0d5;
}

@media (max-width: 992px) {
    #inboxList section.active {
        display: block;
    }

    #inboxList section {
        flex-wrap: wrap;
        width: 95%;
        left: 2.5%;
    }

    #trash #inboxList {
        width: 100%;
    }

    #inboxMessage section.received {
        display: flex;
    }

    #inboxMessage .info a {
        position: absolute;
        top: 10px;
        left: 50px;
        overflow: visible;
    }

    #inboxMessage .image img {
        width: 35px;
        height: 35px;
    }

    #notification #inboxList section {
        display: flex;
    }

    #notification #inboxList .notifications-details a {
        max-width: 100%;
    }

    #notification #inboxMessage .vmp-nws-header h2 {
        font-size: 1.2em;
    }
}

.message-heading {
    display: flex;
    width: 100%;
}

#inboxList section.new {
    border-left: 4px solid #617ca3;
}

#inboxList section.new .details,
#inboxList section .details{
    display: flex;
    justify-content: space-between;
    padding: 0 5px;
    align-items: center;
}

#inboxList section.new .details span,
#inboxList section .details span{
    position: inherit;
    color: #3D526B;
    line-height:1.2em;
    font-size: 1em;
}

#inbox .mark-notification,
#inbox .delete {
    position: relative;
}

#inboxList.hasMark .mark-notification,
#inboxList.hasMark .delete {
    width: 100%;
    height: 50%;
}

#read-unread {
    display: flex;
    justify-content: start;
    margin-bottom: 1em;
}

#read-unread div {
    margin-right: 15px;
    padding-left: 5px;
    margin-bottom: 5px;
}

#read-unread span {
    color: #556F99;
    display: inline-block;
    padding-left: 2.5px;
    cursor: pointer;
}

#read-unread i,
.messageActionsList {
    color: #617ca3;
}

.message-action {
    margin-left: 5px;
}

.message-wrapper {
    margin: 0 5px;
    width: 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.message-wrapper {
    /*visibility: hidden;*/
}

.chooseMessage section:hover .message-wrapper {
    /*visibility: visible;*/
}

.align-middle-hv {
    position: relative !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.align-middle-hv-absolute {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.msg-user-flex {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.message-wrapper div.delete a {
    position: relative;
    left: 3px;
}

.loader-icon-messages {
    top: 25%;
    left: 50%;
    transform: translate(-25%, -50%);
    position: absolute;
    font-size: 1em;
    width: 1em;
    height: 1em;
    border-radius : 50%;
    text-indent: -9999em;
    -webkit-animation: loadIcon 1.1s infinite ease;
    animation: loadIcon 1.1s infinite ease;
    z-index: 1;
}

.chooseMessage .delete,
.chooseMessage .details,
.chooseMessage .group,
.chooseMessage .user {
    height: auto;
}

.chooseMessage .delete {
    flex-grow: 0;
}

.chooseMessage .details {
    flex-grow: 2;
    max-width: 90%;
}

.chooseMessage .details span,
.chooseMessage .details a,
.chooseMessage .details a h3 {
    line-height: 18px;
}

#bigThumbs [class*=" icon-"]:before,
#bigThumbs [class^=icon-]:before {
    color: #FFFFFF;
}


.btn-facebook,
.btn-facebook:visited {
    color:#fff;
    text-shadow:0 -1px 0 #3d4e7e;
    border:1px solid #3d4e7e;
    background:#4E69a2; }

    .btn-facebook:hover {
        color:#fff;
        border:1px solid #3d4e7e;
        background:#3b5998; }

    .btn-facebook:active,
    .btn-facebook:focus,
    .btn-facebook.active,
    .btn-facebook.focus {
        border:1px solid #3d4e7e;
        background:#4E69a2;
        box-shadow:inset 0 2px 4px #3d4e7e; }

    .btn-facebook i {
        color:#fff !important; }

.btn-openID,
.btn-openID:visited {
    color:#fff;
    text-shadow:0 -1px 0 #d07609;
    border:1px solid #ea8509;
    background:#f7931e; }

    .btn-openID:hover {
        color:#fff;
        border:1px solid #d07609;
        background:#ea8509; }

    .btn-openID:active,
    .btn-openID:focus,
    .btn-openID.active,
    .btn-openID.focus {
        border:1px solid #d07609;
        background:#f7931e;
        box-shadow:inset 0 2px 4px #d07609; }

    .btn-openID i {
        color:#fff !important; }

.btn-block.loading {
    border:1px solid #475d7b;
    color:#475d7b;
    padding:0.2em 0.75em;
    width: auto;
    background-color: #fff;
    display: flex;
    justify-content: space-between;
    margin: 0;
}

.btn-block.loading:hover {
    color:#fff;
    background-color: #475d7b;
}

#contentWrapper .shareSocial a [class^="icon-"]{
    color: #FFFFFF;
}

.channelList .channelTeaser .link p,
.channelList .channelTeaser .link p i,
.channelList .channelTeaser .link p i::before {
    color: #d8e2ec;
}


/***********************Share Media ************************************/
.shareMedia .bookmarks a {
    padding: 3px 8px;
    border: 1px solid #3B6297;
    margin-right: 3px;
}
.shareMedia .bookmarks a.vmp-shr-fcb {
    padding: 3px 12px;
}
.shareMedia .bookmarks a.vmp-shr-fcb:hover {
    background-color: #4e69a2;
    border: 1px solid #4e69a2;
}
.shareMedia .bookmarks a.vmp-shr-twt:hover {
    background-color: #32bbef;
    border: 1px solid #32bbef;
}
.shareMedia .icon-facebook,
.shareMedia .icon-twitter {
    /*border: 1px solid #617ca3;
    padding: 5px;*/
    width: 25px;
    height: 25px;
    min-width: 25px;
    min-height: 25px;
    max-width: 25px;
    max-height: 25px;
}

.shareMedia .icon-facebook {
    /*padding: 5px 8px;*/
}

.shareMedia .bookmarks a:first-child {
    margin-right: 10px;
}

.shareMedia .share-button:hover {
    background-color: #3B6297;
    color: #FFFFFF;
}
.share-wrapper .embedd label {
    margin-left: 20px;
}
.share-wrapper label input[type="checkbox"] {
    margin-left: -20px;
}

input[type="checkbox"],
.checkbox input[type="checkbox"] {
    position: absolute;
    margin-top: 2px;
    margin-right: 10px;
}

@media(min-width: 992px) {
    input[type="checkbox"]::before{
        width: 15px;
        height: 15px;
        border: 1px solid #475d7b;
        background-color: #ffffff;
        display: block;
        content: "";
        float: left;
        margin-right: 5px;
    }
    input[type="checkbox"]::after{
        width: 15px;
        height: 15px;
        display: block;
        content: "";
        float: left;
        margin-right: 5px;
        margin-top: -14px;
        margin-left: 5px;
    }
    input[type="checkbox"]:checked{
        background-color: #475d7b;
    }
    input[type="checkbox"]:checked:before{
        /*left: 9px;
        top: 5px;
        width: 5px;
        height: 10px;
        border: solid #ffffff;
        border-width: 0 3px 3px 0;
        transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        box-shadow: inset 0 0 0 3px #ffffff;*/
        background-color: #475d7b;
    }
    input[type="checkbox"]:checked:after{
        left: 9px;
        top: 5px;
        width: 5px;
        height: 10px;
        border: solid #ffffff;
        border-width: 0 3px 3px 0;
        transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
    }
}
#siteSidebar h2,
#siteSidebar #siteNav h2,
#siteSidebarMobile h2,
#siteSidebarMobile #siteNav h2 {
    margin-top: 20px;
    margin-bottom: 10px;
    padding: 0;
}
#siteSidebar h3,
#siteSidebar #siteNav h3,
#siteSidebarMobile h3,
#siteSidebarMobile #siteNav h3{
    font-weight: 600;
    font-size: 1.1em;
    margin-top: 20px;
    margin-bottom: 10px;
    padding: 0;
}
#siteSidebar #siteNav>h2,
#siteSidebar #siteNav>h3,
#siteSidebarMobile #siteNav>h2,
#siteSidebarMobile #siteNav>h3 {
    margin-left: 1em;
}

#siteSidebar #siteNav>h3,
#siteSidebar #siteNav>h2,
#siteSidebar #channelLinks>h3,
#siteSidebar #channelLinks>h2,
#siteSidebarMobile #siteNav>h3,
#siteSidebarMobile #siteNav>h2,
#siteSidebarMobile #channelLinks>h3,
#siteSidebarMobile #channelLinks>h2 {
    padding-bottom: 4px;
}

#siteSidebar .mediaThumb,
#siteSidebarMobile .mediaThumb {
    width: 100%;
}

#siteHeader,
#siteHeader a,
#siteHeader .glyphicon,
#siteHeader a [class*=" icon-"],
#siteHeader a [class^=icon-] {
  color: #3B6297;
}
#userControls .button.profile .profile-icon-wrp,
#userLinks #profileLink .profile-icon-wrp{
  border-color: #3B6297;

}
#userLinks #profileLink .profile-icon-wrp .icon-user,
#userControls .button.profile .profile-icon-wrp .icon-user{
  color: #3B6297;
}

.badge,
.tag,
#contentWrapper .button-wrap-form button.tag {
  background: #3B6297;
}

.badge:hover,
.tag:hover,
#contentWrapper .button-wrap-form button.tag:hover,
#userControls #furtherLinks ul li:hover .badge {
  background-color: #3B6297;
  background: #3B6297;
}
.vmp-bypass-list {
    margin-left: 4em;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.vmp-bypass{
    height: auto;
    width: auto;
}

.vmp-bypass a,
.vmp-bypass button {
    height: 0;
    width: 0;
    overflow: hidden;
    z-index: 1;
    padding: 0;
    display: block;
}
.vmp-bypass a:focus,
.vmp-bypass button:focus {
    height: auto;
    width: auto;
    overflow: auto;
    z-index: 10;
    padding: 0.3em;
    border: 1px solid #475d7b
}

/***** PDF Fullscreen *****/
#pdf_fullscreen_container{
    position:absolute;
    width:100vw;
    height:90vh;
    z-index:999999;
    top:0;
    left:0;
}

#exit_fullscreen_container
{
    position:absolute;
    width: 100%;
    height: 10vh;
    bottom: 0;
    z-index: 9999999;
    background-color: #617ca3;
}

#exit_fullscreen
{
    position: relative;
    right: 5%;
    width: 150px;
    height: 35px;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 15px;
    color: #333;
}

#exit_fullscreen .icon-fullscreen
{
    color: #333;
    margin-right: 5px;
}
/***** PDF Fullscreen End *****/

.vmp-fnt-btn-wrp{
    text-decoration: none;
    display: none;
    flex-direction: column;
    justify-content: center;
    height: 70px;
}

.vmp-fnt-btn-wrp .vmp-fnt-btn{
    text-decoration: none;
    display: flex;
    flex-direction: row;
}

.vmp-fnt-btn-wrp .vmp-fnt-btn .vmp-sml-icn{

}

.vmp-fnt-btn-wrp .vmp-fnt-btn .vmp-big-icn{
    font-size: 1.8em;
    margin-left: -6px;
}

.vmp-fnt-btn-wrp .vmp-fnt-mnu{
    display: flex;
    visibility:hidden;
    z-index:9998;
    position:absolute;
    top:54px;
    padding:1em;
    margin:1em 0 1em 0;
    background:#f5f6f7;
    border-radius:0.5em;
    -moz-border-radius:0.5em;
    -webkit-border-radius:0.5em;
    box-shadow: -5px 5px 16px -2px #8a95a6;
    flex-direction: column;
    width: 300px;
}
.vmp-fnt-btn-wrp .vmp-fnt-mnu div{
    margin-bottom: 1em;
}

.vmp-fnt-btn-wrp .vmp-fnt-mnu .vmp-fnt-value{
    background-color: transparent;
}

.vmp-fnt-btn-wrp .vmp-xpl-txt-wrp {
    width: 100%;
}

.vmp-fnt-btn-wrp .vmp-xpl-txt-wrp .vmp-xpl-txt {
    resize: none;
    width: 100%;
}

.vmp-fnt-btn-wrp .vmp-btn-wrp {
    display: flex;
    justify-content: flex-end;
}

.vmp-fnt-btn-wrp .vmp-btn-wrp button {
    border:1px solid #475d7b;
    color:#475d7b;
    padding:0.2em 0.75em;
    margin:0.5em 0 0 1em;
    display:inline-block;
    background: transparent;
}

.vmp-fnt-btn-wrp .vmp-btn-wrp  button:hover {
    background-color: #475d7b;
    color: #ffffff;
}

#siteHeader button:disabled ,
#contentWrapper button:disabled {
    color: #dfe5eb;
    border-color: #dfe5eb;
    background-color: transparent;
}

#siteHeader button:disabled:hover ,
#contentWrapper button:disabled:hover {
    color: #dfe5eb;
    border-color: #dfe5eb;
    background-color: transparent;
}

.buttonpane #uploadSubmit[disabled] {
    color: #cccccc;;
    border-color: #cccccc;;
    background-color: transparent;
}

#featured-media-box .bottom{
    border-right: 5px solid transparent;
    padding-right: 0.5em;
}

#featured-media-box .filter,
#continue_watching_videos .filter,
#groups-box .filter,
#albums-box .filter{
    display: flex;
    justify-content: flex-end;
}

#featured-media-box .vmp-desktop .bottom .button-wrap-form {
    margin-right: 0;
}

.vmp-nws-header{
    display: flex;
}

#inboxMessage h2 {
    margin-bottom: 10px;
}

.vmp-mnu-label{
    position: fixed;
    z-index: 99;
    padding: 5px;
    background-color: #3B6297;
    color: #FFFFFF;
}

.vmp-mnu-label.vmp-close{
    position: absolute;
    display: none;
}

/*************************EDIT VIDEO*****************************************/

.cut-media-ve-selection {
    display: flex;
    flex-direction: row;
}

.cut-media-ve-selection .btn.vmp-vid-edit,
#cut-ve-show-review{
    display: flex;
    justify-content: space-between;
    flex-grow: 6;
}

.cut-ve-trash-button{
    flex-grow: 1;
    margin-left: 1em;
}
.vmp-edit-status{
    height: 15px;
    width: 15px;
    background-color: #dfe5eb;
    border-radius: 50%;
    display: inline-block;
}
.btn-group>.btn.valid{
    background-color: #DDF4E2;
    color: #276235;
}
.valid .vmp-edit-status{
    background-color: #276235;
}
.btn-group>.btn.invalid{
}
.invalid .vmp-edit-status{
    background-color: #892027;
}

.btn-group>.btn.process{
    background-color: #fcf8e3;
    color: #8a6d3b;
}
.process .vmp-edit-status{
    background-color: #8a6d3b;
}


#media-box .bottom {
    border-right: 3px solid transparent;
    padding-right: 0.5em;
}

/***********************MOBILE***********************************************/


.vmp-accordion .ui-accordion-header{
    border: 1px solid #dfe5eb;
    background: #dfe5eb;
    color: #3B6297;
}


.vmp-accordion .ui-accordion-header.ui-state-active {
    border: 1px solid #3B6297;
    background: #3B6297;
    color: #FFFFFF;
}

@media (max-width: 576px) {
    .vmp-accordion .ui-accordion-content ul {
        --bs-gutter-x: 0;
    }
}

@media (min-width: 576px) {
    .vmp-accordion .ui-accordion-content {
        border: 1px solid #3B6297;
    }
}

@media (min-width: 1700px) {
    .vmp-mobile-xl {
        display: none;
    }
}

@media (max-width: 1500px) {
    .vmp-desktop-xl{
        display: none;
    }
}
@media (min-width: 1500px) {
    .vmp-mobile-l {
        display: none;
    }
}

@media (max-width: 1300px) {
    .vmp-desktop-l{
        display: none;
    }
}

@media (min-width: 1000px) {
    .vmp-mobile {
        display: none;
    }

    .upload-mobile,
    .userControls-profile-link {
        display: none !important;
    }

    .show-title-mobile,
    .userControls-profile-link,
    .logout-button-holder {
        display: none;
    }

    #read-unread {
        display: flex;
    }

    #msgActions {
        display: none;
    }
}

@media (max-width: 999px) {
    .vmp-mobile {}
    .vmp-desktop,
    .forumListing .vmp-desktop,
    #userControls .profile .linkToProfile.vmp-desktop,
    #button_profile,
    #userActions,
    #userControls .button.profile {
        display: none;
    }
    .alert.cookieHint .tabPill{
        padding-left: 3px;
        padding-right: 3px;
    }
    #searchHead {
        /*display: block;
        position: absolute;
        top: 55px;*/
    }
    #searchHead form,
    #searchHeadMobile form {
        margin-top: 5px;
    }
    #searchHead,
    #searchHeadMobile {
        height: 50px;
    }
    #headerContent,
    #userControls,
    #userControls .button,
    #headerContent .upload {
        height: auto;
    }

    #userControls,
    .logout-button-holder {
        display: block;
    }

    #side-menu-nav #siteSidebar,
    #side-menu-nav #siteSidebarMobile {
        display: block;
        width: 100%;
        position: initial;
    }

    .show-title-mobile {
        display: inline-block;
        position: relative;
    }

    .userControls-item-holder {
        height: 40px;
        display: flex;
        align-items: center;
    }

    .userControls-item-holder span.button,
    .userControls-item-holder section {
        display: inline-block;
        width: 40px;
        margin-left: 10px;
    }

    .open-mobile-menu {
        display: inline-block;
        cursor: pointer;
    }

    .mobile-menu-top-position {
        position: absolute;
        right: 0;
        top: 19px;
    }

    .open-mobile-menu i {
        font-size: 3em;
    }

    .user-menu-icon {
        position: relative;
        top: 5px;
        cursor: pointer;
    }

    .open-user-menu-thumb {
        max-width: initial !important;
    }

    .upload-desktop {
        display: none !important;
    }

    .sticky-search-menu {
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 100;
        background-color: #ECEFF2;
        left: 0;
    }

    #userControls {
        display: none;
    }

    #inbox #read-unread,
    #notification #read-unread {
        display: none;
    }

    #msgActions {
        display: block;
    }


    .message-wrapper {
        /*visibility: visible;*/
    }

    #inboxList {
        width: 100%;
    }

    #siteSidebar #siteNav li .sitemenu-wrap-form>button,
    #siteSidebar #siteNav li .sitemenu-submenu-wrap-form>button,
    #siteSidebarMobile #siteNav li .sitemenu-wrap-form>button,
    #siteSidebar #siteNav li .sitemenu-submenu-wrap-form>button {
        padding-left: 10px;
    }

    #userControls .button {
        padding-top: 0;
    }
    /*#headerContent i,*/
    #headerContent #userControls .button.profile .profile-icon-wrp .icon-user,
    /*#headerContent #userControls .button .wrap i,*/
    #userControls .button a.dropdown-toggle>i, #userControls .button ul.dropdown-menu li a>i, #userControls .button>i{
        font-size: 1em;
    }
    #userControls .button.profile .profile-icon-wrp {
        width: 30px;
        height: 30px;
    }
    #userControls .profile {
        padding-top: 9px;
    }
    #userLinks #profileLink .profile-icon-wrp {
        width: 40px;
        height: 40px;
    }
    #userControls #furtherLinks ul li a{
        line-height: 1.3em;
        padding: .5em 0.5em .5em 0;
        font-size: 12px;
    }
    #headerContent .upload {
        line-height: 50px;
    }
    #userControls #profileLink .linkToProfile {
        min-width: auto;
    }
    #userActions .userLoginLink,
    #userActions .userRegistrationLink{
        padding-top: 16px;
    }
    .vmp-profile-bg {
        margin-left: 80px;
    }
    #innerNav #userInfo .userCover{
        margin-left: -60px;
    }

    #siteSidebar, #siteSidebarMobile{
        display: none;
        position: absolute;
        z-index: 1000;
        box-shadow: 6px 16px 28px -5px rgba(60, 74, 92, 0.63);
    }
    #siteSidebar #siteNav li.active,
    #siteSidebarMobile #siteNav li.active {
        border-right: 1px solid #FFFFFF;
    }

    .channelOverview .callToAction,
    .blogOverview .callToAction,
    .albumOverview .callToAction{
        position: relative;
        top: 0;
        bottom:0;
        right: 0;
    }
    #blog {
        margin-top: 20px;
    }

    .vmp-accordion .bottom {
        border-bottom: none;
    }

    #innerNav #userInfo .userCover .userThumb {
        width: 120px;
        height: 120px;
    }
    .profileCoverImage .mediaThumb {
        height: 120px;
    }
    #innerNav .vmp-mnu-label {
        position: absolute;
    }
    #innerNav #subNav {
        right:0;
    }
    #subNav .nav-tabs>li.active>a,
    #subNav .nav>li>a,
    #subNav .nav-tabs>li.active>a:focus,
    #subNav .nav-tabs>li.active>a:hover {
        padding: 5px 6px;
        color: #FFFFFF;
    }
    #subNav .nav-tabs>li>a, #subNav ul {
        height: 30px;
    }
    #siteContent .nav.nav-tabs a{
        font-size: 12px;
    }
    .viewMessage header {
        display: flex;
        flex-direction: column-reverse;
    }
    .viewMessage header .recipients {
        position: relative;
    }

    /*#language {
        right: 3%;
    }*/
    #inboxList,
    #inboxMessage{
        display: flex;
        flex-direction: column;
    }
    #inboxMessage{
        flex-shrink: 3;
    }
    #inboxList section .details,
    #inboxList section.new .details {
        align-items: center;
        flex-wrap: wrap;
    }
    .chooseMessage .details a,
    .chooseMessage .details a h3 {
        width: auto;
    }
    #inboxList section .details span,
    #inboxList section.new .details span {
        font-size: 12px;
        padding-top: 1em;
    }
    .chooseMessage .group, .chooseMessage .user {
        height: auto;
    }
    .viewMessage .details .text p>a {
        word-wrap: break-word;
    }
}/*max-width: 1000px*/
@media (min-width: 600px) {
    .vmp-mobile-s{
        display: none;
    }
}
@media (max-width: 600px) {
    .vmp-desktop-s{
        display: none;
    }
    h1{
        font-size: 1.8em!important;
    }
    .alert.cookieHint .cookieOptions {
        flex-direction: column;
    }
    .alert.cookieHint .cookieLinks {
        align-items: flex-start;
    }
    .alert.cookieHint .tabPill {
        padding-left: 10px;
    }
    .alert.cookieHint .cookieLinks a{
        text-align: center;
    }
    #siteHeader .wrapper {
        flex-wrap: wrap;
    }
    #searchHead {
        /*display: flex;
        position: relative;
        top: 0;*/
    }
    #userControls .profile #userLinks{
        padding: 0.5em;
        margin-left: 0;
        flex-direction: column;
    }
    #userControls .profile #userLinks #profileLink{
        border-bottom: 1px solid #dfe5eb;
        margin-bottom: 5px;
        padding-bottom: 10px;
    }
    #userControls .profile #userLinks #furtherLinks ul:first-child{
        border-left: none;
    }
    #userControls .profile #userLinks:before {
        border: none;
    }
    .blogList article {
        display: flex;
        flex-direction: column;
    }
    .blogList .button-wrap-form{
        display: flex;
    }
    .blogList .more {
        position: relative;
        top: 0;
        bottom: 0;
        left: 1em;
        right: 0;
        margin-bottom: 1em;
    }
    #innerNav #subNav {
        bottom: auto;
        display: none;
        z-index: 99;
    }
    #innerNav .sub-nav-channel {
        display: block !important;
        position: inherit !important;
    }
    #subNav .nav-tabs>li>a,
    #subNav ul {
        height: auto;
    }
    #siteContent .nav.nav-tabs a {
        color: #3B6297;
        padding: 0.5em 1em;
    }
    #subNav .nav-tabs {
        display: flex;
        flex-direction: column;
        border-bottom: none;
        background-color: #eceff2;
        padding: 1em 0.5em 1em 1.5em;
    }
    .sub-nav-channel .nav-tabs-channel {
        flex-direction: row !important;
        background-color: #4b4b4b !important;
        padding: 0px !important;
        border-bottom: 1px solid #3B6297 !important;
    }
    .sub-nav-channel .nav-tabs-channel li a {
        color: #fff !important;
    }
    #subNav .nav-tabs li{
        text-align: end;
    }
    #subNav .nav-tabs li>a:hover{
        color: #3B6297;
        border: none;
    }
    #innerNav .vmp-mnu-label {
        right: 0;
        bottom: 0;
    }
    #innerNav .vmp-mnu-label.vmp-close {
        right: 0;
    }
    .viewMessage .details .received,
    .viewMessage .details .sent {
        flex-direction: column;
    }
    #inboxList section {
        flex-wrap: wrap;
    }
    #inboxMessage {
        flex-shrink: 2;
        padding-left: 0.5em;
    }
    #inboxList section .details,
    #inboxList section.new .details{
        flex-wrap: wrap;
    }
    #inboxList section .details span,
    #inboxList section.new .details span {
        font-size: 11px;
    }
    .chooseMessage .group .mediaThumb,
    .chooseMessage .user .userThumb {
        width: 35px;
    }
    .chooseMessage .group>span,
    .chooseMessage .user>span{
        font-size: 11px;
    }
    .viewMessage .details .userThumb {
        width: 50px;
        height: 50px;
    }
    .viewMessage .details .vmp-clm-wrp {
        margin-top: 10px;
    }
    .markAll {
        width: 40%;
    }
}/* max-width: 600*/
@media (min-width: 400px) {
    .vmp-mobile-xs {
        display: none;
    }
}
@media (max-width: 400px) {
    .vmp-desktop-xs{
        display: none;
    }
    #siteHeader #headerContent #button_profile,
    #siteHeader .upload,
    #siteHeader #headerContent #userControls>a{
        /*padding-left: 14px;*/
        /*padding-right: 14px;*/
    }
    #furtherLinks {
        flex-direction: column;
    }
    #userControls .profile #userLinks #furtherLinks ul{
        border-left: none;
        width: 100%;
    }
    #userControls .profile #userLinks #furtherLinks ul:first-child{
        border-bottom: 1px solid #dfe5eb;
    }
    .userRowEmail {
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100px;
    }
} /**Responsive 400**/

@media (min-width: 300px) {
    .vmp-mobile-xxs {
        display: none;
    }
}
@media (max-width: 300px) {
    .vmp-desktop-xxs{
        display: none;
    }
    #siteHeader #headerContent #button_profile,
    #siteHeader .upload,
    #siteHeader #headerContent #userControls>a{
        padding-left: 12px;
        padding-right: 12px;
    }
}/**Responsive 300**/

/******************************************GENERAL***************************************************/

#siteContent nav.tabbable .nav>li>a:focus{
    color: #FFFFFF;
    background-color: #3B6297;
    border: none;
    padding: 0.5em 1em;
    height: 38px;
}
#siteContent nav.tabbable .nav.nav-tabs>li>a:hover {
    color: #FFFFFF;
    background-color: #728594;
    border-bottom: 1px solid #3B6297;
}
#siteContent nav.tabbable .nav.nav-tabs>li.active>a {
    color: #ffffff;
    background-color: #3B6297;
}

.viewProfile #userContent nav.tabbable .nav.nav-tabs>li.active>a,
.viewProfile #userContent nav.tabbable .nav.nav-tabs>li>a:focus {
    border: 1px solid #3B6297;
}

.nav-tabs>li>a {
    border-radius: 0;
}

button:focus,
button.btn-default:focus,
#search:focus,
a:focus,
#siteSidebar #siteNav .hasSublinks>form>button:focus,
#siteSidebarMobile #siteNav .hasSublinks>form>button:focus,
#siteNav li .sitemenu-wrap-form>button:focus,
.filterMedia li button:focus,
#contentWrapper .button-wrap-form button:focus,
.btn-group>button.btn:focus{
    background-color: #3B6297;
    color: #FFFFFF;
}
a:focus i:before,
button:focus i:before {
    color: #FFFFFF;
}
.nav.nav-tabs>li.active>button{
    color: #ffffff;
    background: #3B6297;
    border: none;
}
.channelThumbs.small a:focus .mediaCover .icons,
.channelThumbs.categoryThumbs a:focus .mediaCover .icons,
.channelThumbs.small a:focus .mediaCover .icons,
.channelThumbs.list a:focus .mediaCover .icons,
.mediaThumbs.small a:focus .mediaCover .icons,
.mediaThumbs.categoryThumbs a:focus .mediaCover .icons,
.mediaThumbs.small a:focus .mediaCover .icons,
.mediaThumbs.list a:focus .mediaCover .icons {
    visibility: visible;
    opacity: 1;
}
.nav>li>a {
    padding: 0.5em 1em;
}
/****************************************HEADER*********************************************************/

a#siteLogo:focus {
    background-color: transparent;
    border: 5px solid #3B6297;
}

#siteHeader #headerContent>.vmp-fnt-btn-wrp:hover,
#siteHeader #headerContent>.upload:hover,
#siteHeader #userControls>.button:hover>.linkToProfile,
#siteHeader #headerContent>.language:hover,
#siteHeader #headerContent>.language:hover>a,
#siteHeader #headerContent>.language:hover>a>i,
#siteHeader #headerContent #userActions>.userLoginLink:hover,
#siteHeader #headerContent #userActions>.userLoginLink:hover>a,
#siteHeader #headerContent #userActions>.userLoginLink:hover>a i::before,
#siteHeader #headerContent #userActions>.userLoginLink:hover>i,
#siteHeader #headerContent #userActions>.userLoginLink:hover>i::before,
#siteHeader #headerContent #userActions>.userRegistrationLink:hover,
#siteHeader #headerContent #userActions>.userRegistrationLink:hover>a,
#siteHeader #userControls>.button:hover{
    background-color: #3B6297;
    color: #FFFFFF;
}

#siteHeader #headerContent>.vmp-fnt-btn-wrp:hover i:before,
#siteHeader #headerContent>.upload:hover i:before,
#siteHeader #userControls>.button:hover>.linkToProfile i:before,
#siteHeader #userControls>.button:hover>.linkToProfile a,
#siteHeader #userControls>.button:hover>.linkToProfile:hover a,
#siteHeader #userControls>.button:hover>span>i:before,
#siteHeader #userControls>.button:hover>i:before{
    color: #FFFFFF;
}

#siteHeader #headerContent>.vmp-fnt-btn-wrp:hover .vmp-fnt-mnu,
#siteHeader #userControls>.button:hover .icon-user:before{
    color: #3B6297;
}
#searchHead .input-group,
#searchHeadMobile .input-group,
#headerContent .upload .vmp-desktop,
#headerContent .upload .icon-cloud-upload,
#headerContent #button_profile .linkToProfile .scalable-font,
#headerContent #userControls .button.playlists .wrap .icon-indent-right,
#headerContent #userControls .button.notifications .wrap .icon-bell,
#headerContent #userControls .button.messages .wrap .icon-envelope-alt,
#headerContent #userControls #button_profile .profile-icon-wrp {
    position: relative;
}
#userControls .button i.context-icon {
    font-size: 1.9em;
}
#headerContent #userControls .button.notifications .wrap .icon-bell {
    font-size: 1.8em;
}
#headerContent a.upload {
    display:flex;
}
#headerContent #userControls .profile .linkToProfile a {
    padding-right: 0;
}
#siteHeader section#headerContent section#userControls a.button.notifications span.wrap span.badge {
    top: -9.5px!important;
}
#headerContent #userControls .button.playlists,
#headerContent #userControls .button.messages {
    padding-right: 20.25px;
    padding-left: 20.25px;
}
#headerContent #userControls .button.notifications {
    padding-right: 21.75px;
    padding-left: 21.75px;
}
#headerContent #userControls .button.settings {
    padding-right: 19.365px;
    padding-left: 19.365px;
}
#headerContent #userControls .button.clientSettings {
    padding-right: 22.02px;
    padding-left: 22.02px;
}
#headerContent #userControls #button_profile {
    padding-left: 12.05px;
    padding-right: 12.05px;
}
#headerContent a.upload {
    padding-left: 20px;
    padding-right: 20px;
}

@media (min-width: 1000px) {
    #headerContent a.upload {
        display: block;
    }
    #headerContent .upload .vmp-desktop {
        left: 4px;
        bottom: 4px;
    }
    #headerContent .upload .icon-cloud-upload {
        font-size: 24px;
    }
    #headerContent #button_profile .linkToProfile .scalable-font {
        /*bottom: 3.5px;*/
    }
    #headerContent #userControls .button.playlists .wrap .icon-indent-right {
        top: 1.2px;
    }
    #headerContent #userControls .button.messages .wrap .icon-envelope-alt {
        bottom: 1px;
    }
    #userControls .button.profile .profile-icon-wrp {
        width: 38px;
        height: 38px;
    }
}

@media (max-width: 490px) {
    #siteHeader .vmp-mobile:not(.mobile-hidden-search):not(.logout-button-holder) {
        display: flex;
        justify-content: center;
    }

    #side-menu-nav-user-links {
        margin-top: 50px;
    }
}

@media (max-width: 999px) {
    #headerContent #userControls .button.playlists .wrap .icon-indent-right {
        bottom:2.5px;
    }
    #headerContent #userControls .button.messages .wrap .icon-envelope-alt {
        bottom: 4.5px;
    }
    #headerContent #userControls #button_profile .profile-icon-wrp {
        bottom:1.5px;
        margin-right: 0;
    }
    #headerContent #userControls #button_profile {
        padding-right: 17.6px;
        padding-left: 17.6px;
    }
    #headerContent #userControls .button.notifications .wrap .icon-bell {
        bottom: 2.5px;
    }
    #headerContent a.upload .icon-cloud-upload {
        font-size: 1.4em;
        top: 11px;
    }
    #headerContent .language.dropdown .icon-globe,
    #headerContent #userActions .userLoginLink .icon-user {
        font-size: 1.8em;
    }
    #headerContent .userLoginLink {
        margin: 0;
    }
    #headerContent .language.dropdown {
        height: 50px;
    }
    #headerContent .language.dropdown .icon-globe {
        position: relative;
        bottom: 8px;
    }
    #headerContent #userActions .userLoginLink .icon-user {
        position: relative;
        bottom: 6px;
    }
    #userActions .userRegistrationLink {
        margin:0;
        display: none;
    }
     #headerContent a.upload {
         padding-right: 19.92px;
         padding-left: 19.92px;
     }
    #headerContent .language.dropdown {
        padding:0;
    }
    #headerContent .language.dropdown #language-dropdown-open-choices-button {
        padding-right: 22.57px;
        padding-left: 22.57px;
    }
    #headerContent #userActions {
        padding-right: 23.41px;
        padding-left: 23.41px;
    }
}

@media (max-width: 430px) {
    #headerContent #userControls .button.playlists,
    #headerContent #userControls .button.messages {
        padding-right: 14px;
        padding-left: 14px;
    }
    #headerContent #userControls .button.notifications {
        padding-right: 15.6px;
        padding-left: 15.6px;
    }
    #headerContent #userControls .button.settings {
        padding-right: 13.05px;
        padding-left: 13.05px;
    }
    #headerContent #userControls .button.clientSettings {
        padding-right: 15.9px;
        padding-left: 15.9px;
    }
    #headerContent #userControls #button_profile {
        padding-right: 12.3px;
        padding-left: 12.3px;
    }
    #headerContent a.upload {
        padding-right: 13.65px;
        padding-left: 13.65px;
    }
    #headerContent .language.dropdown #language-dropdown-open-choices-button {
        padding-right: 16.5px;
        padding-left: 16.5px;
    }
    #headerContent #userActions {
        padding-right: 17.4px;
        padding-left: 17.4px;
    }
}

#userLinks #profileLink .linkToProfile p{
    padding: 0 0.5em;
}

#userLinks #profileLink .linkToProfile p.vmp-usr-infoline{
    padding: 0 1em;
}


/****************************************Sidebar********************************************************/

#siteSidebar a:focus,
#siteSidebar #siteNav li .sitemenu-wrap-form>button:focus,
#siteSidebar #siteNav .hasSublinks button:focus .icon-chevron-right:before,
#siteSidebar button:focus,
#siteSidebarMobile a:focus,
#siteSidebarMobile #siteNav li .sitemenu-wrap-form>button:focus,
#siteSidebarMobile #siteNav .hasSublinks button:focus .icon-chevron-right:before,
#siteSidebarMobile button:focus{
    color: #FFFFFF;
}

/****************************************FOOTER*********************************************************/

#siteFooter a:focus {
    color: #FFFFFF;
}
#siteFooter .dropdown-menu>li>a:focus,
#siteFooter .dropdown-menu>li>a:hover {
    color: #FFFFFF;
    text-decoration: none;
    background-color: #3B6297;
}

#siteFooter .btn-group>.btn+.dropdown-toggle {
    min-height: 34px;
}

/****************************************UPLOAD*********************************************************/
#siteContent .mediaForm .tabbable .nav.nav-tabs>li>a {
    color: #3B6297;
    border: none;
    padding: 0.5em 1em;
    height: 38px;
    margin-right: 2px;
}

    #siteContent .mediaForm .tabbable .nav.nav-tabs>li>a:hover {
        color: #FFFFFF;
        background-color: #728594;
        border-bottom: 1px solid #3B6297;
    }
    #siteContent .mediaForm .tabbable .nav.nav-tabs>li>a:focus {
        color: #FFFFFF;
        background-color: #3B6297;
    }

#siteContent .mediaForm .tabbable .nav.nav-tabs>li.active>a {
    color: #ffffff;
    background-color: #3B6297;
}

#youtubeimport .checkbox input[type=checkbox],
#youtubeimport input[type=checkbox] {
    position: relative;
}

#fileUpload .description {
    color: #3B6297;
}
#fileUpload .vmp-adjust {
    color: #3B6297;
    background: transparent;
    border: 1px solid #3B6297;
    padding: 0.1em 1em;
    white-space: nowrap;
}

#fileUpload .vmp-adjust .icon-cog:before {
    color: #3B6297;
    background-color: transparent;
}
#fileUpload .vmp-adjust:focus,
#fileUpload .vmp-adjust:focus .icon-cog:before,
#fileUpload .vmp-adjust:hover,
#fileUpload .vmp-adjust:hover .icon-cog:before{
    color: #FFFFFF;
    background-color: #3B6297;
}

#fileUpload .fileUpload fieldset.browse:focus {
    border: 5px solid #3B6297;
    padding: 8px;
}

.upload-mark-links a:last-child {
    padding-left: 15px;
}

#videoUpload #uploadSubmit:focus {
    color: #FFFFFF;
    background-color: #3B6297;
}

#videoUpload fieldset.collapsible legend:focus {
    border: 1px solid #3B6297;
}

#start_date_picker:focus,
#start_date_picker:focus i:before,
#end_date_picker:focus i:before,
#end_date_picker:focus {
    background-color: #3B6297;
    color: #FFFFFF;
}
#youtubeimport_thumbnail_container #youtubeimport_link,
#vimeoimport_thumbnail_container #vimeoimport_link {
    display: block;
}
#youtubeimport_thumbnail_container #youtubeimport_link:focus,
#vimeoimport_thumbnail_container #vimeoimport_link:focus {
    border: 5px solid #3B6297;
}

#vimeoimport_thumbnail_container:focus-within,
#youtubeimport_thumbnail_container:focus-within {
    padding: 0;
    border: none;
}

.input-group-mf-checkbox {
    display: block;
}

/*********************************************SEARCH*************************************************/

#searchMedia .viewListing ul.mediaThumbs>li>a>article {
    padding: 0;
    margin: 5px 5px 15px 5px;
}

#searchMedia .viewListing ul.mediaThumbs>li>a:focus {
    background-color: transparent;
}

#searchMedia .viewListing ul.mediaThumbs>li>a:focus>article{
    border: 5px solid #3B6297;
    margin: 0 0 10px 0;
}
.pagination>li:first-child>a,
.pagination>li:first-child>span,
.pagination>li:first-child>a,
.pagination>li:first-child>span,
.pagination>li:last-child>a,
.pagination>li:last-child>span,
.pagingLinks .pagination>li>a,
.pagingLinks .pagination>li>span {
    border-radius: 0;
}

#basicSearchForm .input-group #search {
    height: auto;
}

/******************************************E-Lerning*************************************************/

.elearningListing li article,
.elearningListing li>a {
    margin: 5px 5px 5px 0px;
    display: block;
}

.elearningListing li article:focus-within,
.elearningListing li>a:focus {
    border: 5px solid #3B6297;
    background-color: transparent;
}

/******************************************WEBTV*****************************************************/

.webTVPlaylist .mediaCover .links>a:focus i::before {
    color: #000000!important;
}

/*****************************************ALBUM******************************************************/

.user-albums-box .btn-group>.btn.btn-default:focus {
    background-color: #3B6297;
}

#albums-box .empty a:focus {
    color: #FFFFFF;
}


/****************************************HISTORY*****************************************************/

.user-history .mediaThumbs>li>a:focus {
    background: transparent;
}
.user-history .mediaThumbs>li>a:focus>article {
    border: 5px solid #3B6297;
}

/****************************************COMMENTS****************************************************/
#userContent .btn:focus,
#userContent .btn:focus i:before,
#userContent .btn:hover,
#user-comments .btn:focus,
#user-comments .btn:focus i:before,
#user-comments .btn:hover {
    color: #FFFFFF;
}

#media-comments .comment .deleteMediaComment,
#user-comments .comment .deleteUserComment {
    position: relative;
    float: right;
    font-size: 1.3em;
    top: 2.5px;
    cursor: pointer;
}

#media-comments .deleteCommentAlert,
#user-comments .deleteCommentAlert,
#blog-comments .deleteCommentAlert {
    padding-top: 0;
}

#userContent #user-albums-box .filter .btn:focus {
    background-color: #3B6297;
}

#userContent .vmp-inp-lbl {
    padding-left: 17px;
}

#userContent .vmp-inp-lbl input {
    margin-left: -17px;
}

#userContent #addMedia .mediaCover i,
#addGroupMedia #addMedia .mediaCover i {
    color: #3B6297;
}

/***************************************MESSAGES*******************************************************/

#siteContent .messageListing .nav.nav-tabs>li>button:focus,
#siteContent .messageListing .nav.nav-tabs>li>button:focus i:before,
#siteContent .messageListing .nav.nav-tabs>li>a:focus,
#siteContent .messageListing .nav.nav-tabs>li>a:focus i:before,
#siteContent .messageListing .nav.nav-tabs>li.active>button,
#siteContent .messageListing .nav.nav-tabs>li.active>button i:before,
#siteContent .messageListing .nav.nav-tabs>li.active>a,
#siteContent .messageListing .nav.nav-tabs>li.active>a i:before{
    background-color: #3B6297;
    color: #FFFFFF;
}

#inboxList .details a h3 {
    padding: 0.3em;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#inboxList .details a:focus h3 {
    color: #FFFFFF
}

.chooseMessage .group,
.chooseMessage .user {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

#inboxMessage .btn.focus,
#inboxMessage .btn:focus,
#inboxMessage .btn:hover {
    color: #FFFFFF;
}

.messageListing #inbox .markAll,
.messageListing #notification .markAll {
    justify-content: start;
}

.markAll {

}
/********************************************PROFILE******************************************************/

.viewProfile #innerNav #subNav .nav.nav-tabs>li>a {
    border: 1px solid transparent;
}

.viewProfile #innerNav #subNav .nav.nav-tabs>li.active>a:hover {
    color: #3B6297;
}
.viewChannel #innerNav #subNav .nav.nav-tabs>li>a,
.viewLiveStream #innerNav #subNav .nav.nav-tabs>li>a {
    border: 1px solid transparent;
}
.viewChannel #innerNav #subNav .nav.nav-tabs>li>a:focus,
.viewLiveStream #innerNav #subNav .nav.nav-tabs>li>a:focus,
.viewProfile #innerNav #subNav .nav.nav-tabs>li>a:focus {
    border-color: #FFFFFF;
    background-color: transparent;
    color: #FFFFFF;
}

.viewChannel #innerNav #subNav .nav.nav-tabs>li.active>a:focus,
.viewLiveStream #innerNav #subNav .nav.nav-tabs>li.active>a:focus,
.viewProfile #innerNav #subNav .nav.nav-tabs>li.active>a:focus {
    color: #3B6297;
}

.viewChannel #innerNav #subNav .nav.nav-tabs>li.active>a:focus,
.viewLiveStream #innerNav #subNav .nav.nav-tabs>li.active>a:focus{
    border-color: transparent;
    background-color: #FFFFFF;
    color: #3B6297;
}

.viewProfile #innerNav #subNav .nav.nav-tabs>li>a:hover {
    border-color: #FFFFFF;
    background-color: transparent;
}

.viewProfile #innerNav #subNav .nav.nav-tabs>li.active>a:focus,
.viewProfile #innerNav #subNav .nav.nav-tabs>li.active>a:hover {
    background-color: #FFFFFF;
}

/********************************************E_LEARNING***************************************************/
.learning-menu-options a:focus span.btn.btn-primary {
    color: #FFFFFF;
    background-color: #3B6297;
}

#siteContent #featured-unit-box .btn.btn-primary:focus,
#siteContent #active-unit-box .btn.btn-primary:focus {
    color: #FFFFFF;
    background-color: #3B6297;
    border-color: #3B6297;
}

/******************************************+FORUM************************************************************/

.threadListing .actions>a:focus {
    color: #FFFFFF;
    background-color: #3B6297;
}

/******************************************Livestreams******************************************************/

#liveStreams .filter .filterMedia li.active>a,
#liveStreams .filter .filterMedia li.active>a:focus,
#liveStreams .filter .filterMedia li>a:focus {
        background-color: #3B6297;
        color: #FFFFFF;
}

.livestreamContent .vmp-live-str-wrp:focus-within {
    border: 5px solid #3B6297;
}

/*******************************************Activity*********************************************************/

.userActivity .content a .blogText,
.userActivity .content a .forumText {
    border: 5px solid transparent;
}
.userActivity .content a:focus .forumText,
.userActivity .content a:focus .blogText {
    border-color: #3B6297;
}
#activities-box .userActivity .media .content a:focus {
    background-color: transparent;
}

/*********************************************Blog***********************************************************/

#blog .blogList .blogTeaser>a {
    background-color: transparent;
}

/********************************************FORUM***********************************************************/

#forumThread a:focus,
#forumThread a:focus i:before {
    color: #FFFFFF;
    background-color: #3B6297;
}

.buttonpane button:focus {
    color: #FFFFFF;
    background-color: #3B6297;
}

/*********************************************PLUGIN CLIENT**************************************************/
#indexMedias > h2,
#indexWebcontent > h2,
#indexUsers > h2 {
    padding-top: 15px;
}

#indexMediasTable .administrationPagination button.currentPage,
#indexWebcontent .administrationPagination button.currentPage,
#indexUsersTable .administrationPagination button.currentPage,
#indexMediasTable .administrationPagination button,
#indexWebcontent .administrationPagination button,
#indexUsersTable .administrationPagination button {
    background-color: transparent;
    color: #3B6297;
    border: 1px solid #3B6297;
}

#indexMediasTable .administrationPagination button.currentPage:hover,
#indexWebcontent .administrationPagination button.currentPage:hover,
#indexUsersTable .administrationPagination button.currentPage:hover,
#indexMediasTable .administrationPagination button:hover,
#indexWebcontent .administrationPagination button:hover,
#indexUsersTable .administrationPagination button:hover,
#indexMediasTable .administrationPagination button.currentPage,
#indexWebcontent .administrationPagination button.currentPage,
#indexUsersTable .administrationPagination button.currentPage {
    background-color: #3B6297;
    color: #FFFFFF;
}

#indexMediasTable .administrationPagination button[disabled],
#indexWebcontent .administrationPagination button[disabled],
#indexUsersTable .administrationPagination button[disabled],
#indexMediasTable .administrationPagination button[disabled]:hover,
#indexWebcontent .administrationPagination button[disabled]:hover,
#indexUsersTable .administrationPagination button[disabled]:hover,
#indexMediasTable .administrationPagination button:disabled:hover,
#indexWebcontent .administrationPagination button:disabled:hover,
#indexUsersTable .administrationPagination button:disabled:hover {
    background-color: #dfe5eb;
    border: 1px solid rgba(60, 74, 92, 0.5);
    color: rgba(60, 74, 92, 0.5);
}
#administerMediaTable thead th[data-column="media.MEDIAKEY"],
#administerMediaTable thead th[data-column="media.TITLE"],
#administerMediaTable thead th[data-column="user.USERNAME"],
#administerMediaTable thead th[data-column="user.EMAIL"],
#administerMediaTable thead th[data-column="statictext.TITLE"],
#administerUserTable thead th[data-column="media.TITLE"],
#administerUserTable thead th[data-column="user.USERNAME"],
#administerUserTable thead th[data-column="user.EMAIL"],
#administerUserTable thead th[data-column="statictext.TITLE"],
#administerWebcontentTable thead th[data-column="media.TITLE"],
#administerWebcontentTable thead th[data-column="user.USERNAME"],
#administerWebcontentTable thead th[data-column="user.EMAIL"],
#administerWebcontentTable thead th[data-column="statictext.TITLE"]{
    min-width: 100px;
}
#siteContent .media-overview .nav.nav-tabs .active .nav-link {
    color: #FFFFFF;
    background-color: #3B6297;
}
.vmp-table-wrp {
    width: 100%;
    overflow: visible;
}
.vmp-media-opt {
    overflow-x: visible;
}
.administrationPagination{
    margin-top: 20px;
}

.footerDropdowns {
    display: flex;
    justify-content: flex-end;
    flex-direction: column;
}

.footerDropdowns .container section {
    display: flex;
    justify-content: flex-end;
}

/******************************************SCROLLBAR*****************************************************/

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}
::-webkit-scrollbar-track {
    background: rgba(60, 74, 92, 0.5);
    border-radius: 10px;
}
::-webkit-scrollbar-thumb {
    height: 10px;
    background: #3B6297;
    border-radius: 10px;
}

/**************** MEDIA SORTING ****************/
#media_sortable_message {
    padding: 0;
    width: 100%; }
/**************** MEDIA SORTING END ****************/


/***************************************PRESENTATION FILE ************************************************/

#siteContent .row form.edit .form-group input[type=checkbox] + label {
    margin: 8px 0 0 20px;
}

/**************** TINYMCE RESPONSIVENESS ****************/
table.mceLayout {
    width: 100% !important;
}

.mceToolbar td {
    display:table-row;
    float: left;
}
.mceToolbar td:nth-of-type(11){
    clear: left;
}

@media only screen and (min-width: 350px) {
    .mceToolbar td {
        display:table-cell;
        float: none;
    }
    mceToolbar td:nth-of-type(11){
        clear: none;
    }
}
/**************** TINYMCE RESPONSIVENESS END ****************/

/**************** MEDIA PLAYLISTS ****************/
.media-playlist {
    display: inline-block;
}

.media-playlist .playlist-wrapper {
    width: 300px;
    height: auto;
    position: absolute;
    background-color: lightgrey;
    z-index: 1;
    border-radius: .5em;
    border: 1px solid #ccc;
    background: #fff;
    box-shadow: 0 5px 5px #000;
    padding: 10px;
    right: 15px;
    visibility: hidden;
}

.media-playlist:hover .playlist-wrapper {
    visibility: visible;
    z-index: 99;
}

.add-playlist {
    display: inline-block;
    vertical-align: middle;
}

.create-playlist {
    margin-top: 10px;
    margin-bottom: 15px;
}

.addToPlaylist {
    margin-left: .5em;
}

.new-playlist i {
    padding: 12px;
    color: #475d7b;
    left: 0;
    position: absolute;
}

.new-playlist {
    border: 1px solid #475d7b;
    border-radius: .5em;
    position: relative;
    left: 50%;
    transform: translate(-50%);
    width: 200px;
    text-align: center;
    cursor: pointer;
    margin-bottom: 15px;
}

.new-playlist:hover {
    background-color: #475d7b;
}
.new-playlist:hover i,
.new-playlist:hover h4 {
    color: white;
}

.new-playlist-wrapper {
    border: 2px solid black;
    display: inline-block;
}

.expanding-menu-button {
    border: 2px solid #475d7b;
    color: #475d7b;
    font-size: 15px;
    display: block;
    width: 100%;
    padding: 5px 15px;
    margin-top: 20px;
    outline: none;
    cursor: pointer;
    background: #fff;
    text-align: left;
    transition: background 0.2s;
    background: #fdfdfd;
}

.expanding-menu-button:before {
    content: ' + ';
    transform: scale(1.5);
}

/*.expanding-menu-button--active {*/
/*    background: #475d7b;*/
/*    color: #fff;*/
/*    border: none;*/
/*}*/

.expanding-menu-button--active:before {
    content: ' - ';
}

.expanding-menu-content {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.5s;
    padding: 0 15px;
    font-family: sans-serif;
    border-bottom-left-radius: .5em;
    border-bottom-right-radius: .5em;
}

.input-create-btn {
    display: flex;
}

.playlist-list {
    max-height: 180px;
    margin-bottom: 5px;
}

.action-icons {
    float: right;
}

.playlist-list > div {
    -webkit-transition: background-color 500ms linear;
    -ms-transition: background-color 500ms linear;
    transition: background-color 500ms linear;
    margin-bottom: 2px;
    padding: 5px 0 5px 5px;
    border-radius: .5em;
    padding-top: 5px;
    cursor: pointer;
}

.loading-icon-wrapper {
    width:100%;
    height: 100%;
}

.loader-icon-playlist {
    font-size: 2px;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    top: 5px;
    right: 4px;
    position: relative;
    text-indent: -9999em;
    -webkit-animation: loadIcon 1.1s infinite ease;
    animation: loadIcon 1.1s infinite ease;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}

.loader-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.5em;
}

.loader-icon-main {
    width: 1.5em;
    height: 1.5em;
    font-size: 2px;
    border-radius: 50%;
    text-indent: -9999em;
    -webkit-animation: loadIcon 1.1s infinite ease;
    animation: loadIcon 1.1s infinite ease;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}

.loadingOverlay {
    display: flex;
    justify-content: center;
    align-items: center;
}

.loadingOverlay .loader-icon-main,
.loadingOverlay .loader-wrapper {
    width: 2em;
    height: 2em;
    font-size: 15px;
}

.playlist-wrapper .alert-dismissable button {
    right: 5px;
}

.playlist-wrapper .alert-dismissable {
    padding: 7px 0 7px 7px;
    font-size: 11px;
}

.playlist-list .icon-ok {
    margin-right: 5px;
}

.playlist-list i:not(.icon-ok):hover {
    color: #518bdb;
    cursor: pointer;
}

.playlist-list .action-icons {
    padding-right: 5px;
    color: #475d7b;
}

.playlist-list>div:hover {
    background-color: #dfe5eb;
}

.loader-icon-playlist-list {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.radio-buttons-playlist {
    margin-top: 5px;
}

@-webkit-keyframes loadIcon {
    0%,
    100% {
        box-shadow: 0em -2.6em 0em 0em #fff, 1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2), 2.5em 0em 0 0em rgba(184, 184, 184, 0.2), 1.75em 1.75em 0 0em rgba(184, 184, 184, 0.2), 0em 2.5em 0 0em rgba(184, 184, 184, 0.2), -1.8em 1.8em 0 0em rgba(184, 184, 184, 0.2), -2.6em 0em 0 0em rgba(184, 184, 184, 0.5), -1.8em -1.8em 0 0em rgba(184, 184, 184, 0.7);
    }
    12.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(184, 184, 184, 0.7), 1.8em -1.8em 0 0em #fff, 2.5em 0em 0 0em rgba(184, 184, 184, 0.2), 1.75em 1.75em 0 0em rgba(184, 184, 184, 0.2), 0em 2.5em 0 0em rgba(184, 184, 184, 0.2), -1.8em 1.8em 0 0em rgba(184, 184, 184, 0.2), -2.6em 0em 0 0em rgba(184, 184, 184, 0.2), -1.8em -1.8em 0 0em rgba(184, 184, 184, 0.5);
    }
    25% {
        box-shadow: 0em -2.6em 0em 0em rgba(184, 184, 184, 0.5), 1.8em -1.8em 0 0em rgba(184, 184, 184, 0.7), 2.5em 0em 0 0em #fff, 1.75em 1.75em 0 0em rgba(184, 184, 184, 0.2), 0em 2.5em 0 0em rgba(184, 184, 184, 0.2), -1.8em 1.8em 0 0em rgba(184, 184, 184, 0.2), -2.6em 0em 0 0em rgba(184, 184, 184, 0.2), -1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2);
    }
    37.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(184, 184, 184, 0.2), 1.8em -1.8em 0 0em rgba(184, 184, 184, 0.5), 2.5em 0em 0 0em rgba(184, 184, 184, 0.7), 1.75em 1.75em 0 0em #fff, 0em 2.5em 0 0em rgba(184, 184, 184, 0.2), -1.8em 1.8em 0 0em rgba(184, 184, 184, 0.2), -2.6em 0em 0 0em rgba(184, 184, 184, 0.2), -1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2);
    }
    50% {
        box-shadow: 0em -2.6em 0em 0em rgba(184, 184, 184, 0.2), 1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2), 2.5em 0em 0 0em rgba(184, 184, 184, 0.5), 1.75em 1.75em 0 0em rgba(184, 184, 184, 0.7), 0em 2.5em 0 0em #fff, -1.8em 1.8em 0 0em rgba(184, 184, 184, 0.2), -2.6em 0em 0 0em rgba(184, 184, 184, 0.2), -1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2);
    }
    62.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(184, 184, 184, 0.2), 1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2), 2.5em 0em 0 0em rgba(184, 184, 184, 0.2), 1.75em 1.75em 0 0em rgba(184, 184, 184, 0.5), 0em 2.5em 0 0em rgba(184, 184, 184, 0.7), -1.8em 1.8em 0 0em #fff, -2.6em 0em 0 0em rgba(184, 184, 184, 0.2), -1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2);
    }
    75% {
        box-shadow: 0em -2.6em 0em 0em rgba(184, 184, 184, 0.2), 1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2), 2.5em 0em 0 0em rgba(184, 184, 184, 0.2), 1.75em 1.75em 0 0em rgba(184, 184, 184, 0.2), 0em 2.5em 0 0em rgba(184, 184, 184, 0.5), -1.8em 1.8em 0 0em rgba(184, 184, 184, 0.7), -2.6em 0em 0 0em #fff, -1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2);
    }
    87.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(184, 184, 184, 0.2), 1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2), 2.5em 0em 0 0em rgba(184, 184, 184, 0.2), 1.75em 1.75em 0 0em rgba(184, 184, 184, 0.2), 0em 2.5em 0 0em rgba(184, 184, 184, 0.2), -1.8em 1.8em 0 0em rgba(184, 184, 184, 0.5), -2.6em 0em 0 0em rgba(184, 184, 184, 0.7), -1.8em -1.8em 0 0em #fff;
    }
}
@keyframes loadIcon {
    0%,
    100% {
        box-shadow: 0em -2.6em 0em 0em #fff, 1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2), 2.5em 0em 0 0em rgba(184, 184, 184, 0.2), 1.75em 1.75em 0 0em rgba(184, 184, 184, 0.2), 0em 2.5em 0 0em rgba(184, 184, 184, 0.2), -1.8em 1.8em 0 0em rgba(184, 184, 184, 0.2), -2.6em 0em 0 0em rgba(184, 184, 184, 0.5), -1.8em -1.8em 0 0em rgba(184, 184, 184, 0.7);
    }
    12.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(184, 184, 184, 0.7), 1.8em -1.8em 0 0em #fff, 2.5em 0em 0 0em rgba(184, 184, 184, 0.2), 1.75em 1.75em 0 0em rgba(184, 184, 184, 0.2), 0em 2.5em 0 0em rgba(184, 184, 184, 0.2), -1.8em 1.8em 0 0em rgba(184, 184, 184, 0.2), -2.6em 0em 0 0em rgba(184, 184, 184, 0.2), -1.8em -1.8em 0 0em rgba(184, 184, 184, 0.5);
    }
    25% {
        box-shadow: 0em -2.6em 0em 0em rgba(184, 184, 184, 0.5), 1.8em -1.8em 0 0em rgba(184, 184, 184, 0.7), 2.5em 0em 0 0em #fff, 1.75em 1.75em 0 0em rgba(184, 184, 184, 0.2), 0em 2.5em 0 0em rgba(184, 184, 184, 0.2), -1.8em 1.8em 0 0em rgba(184, 184, 184, 0.2), -2.6em 0em 0 0em rgba(184, 184, 184, 0.2), -1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2);
    }
    37.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(184, 184, 184, 0.2), 1.8em -1.8em 0 0em rgba(184, 184, 184, 0.5), 2.5em 0em 0 0em rgba(184, 184, 184, 0.7), 1.75em 1.75em 0 0em #fff, 0em 2.5em 0 0em rgba(184, 184, 184, 0.2), -1.8em 1.8em 0 0em rgba(184, 184, 184, 0.2), -2.6em 0em 0 0em rgba(184, 184, 184, 0.2), -1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2);
    }
    50% {
        box-shadow: 0em -2.6em 0em 0em rgba(184, 184, 184, 0.2), 1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2), 2.5em 0em 0 0em rgba(184, 184, 184, 0.5), 1.75em 1.75em 0 0em rgba(184, 184, 184, 0.7), 0em 2.5em 0 0em #fff, -1.8em 1.8em 0 0em rgba(184, 184, 184, 0.2), -2.6em 0em 0 0em rgba(184, 184, 184, 0.2), -1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2);
    }
    62.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(184, 184, 184, 0.2), 1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2), 2.5em 0em 0 0em rgba(184, 184, 184, 0.2), 1.75em 1.75em 0 0em rgba(184, 184, 184, 0.5), 0em 2.5em 0 0em rgba(184, 184, 184, 0.7), -1.8em 1.8em 0 0em #fff, -2.6em 0em 0 0em rgba(184, 184, 184, 0.2), -1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2);
    }
    75% {
        box-shadow: 0em -2.6em 0em 0em rgba(184, 184, 184, 0.2), 1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2), 2.5em 0em 0 0em rgba(184, 184, 184, 0.2), 1.75em 1.75em 0 0em rgba(184, 184, 184, 0.2), 0em 2.5em 0 0em rgba(184, 184, 184, 0.5), -1.8em 1.8em 0 0em rgba(184, 184, 184, 0.7), -2.6em 0em 0 0em #fff, -1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2);
    }
    87.5% {
        box-shadow: 0em -2.6em 0em 0em rgba(184, 184, 184, 0.2), 1.8em -1.8em 0 0em rgba(184, 184, 184, 0.2), 2.5em 0em 0 0em rgba(184, 184, 184, 0.2), 1.75em 1.75em 0 0em rgba(184, 184, 184, 0.2), 0em 2.5em 0 0em rgba(184, 184, 184, 0.2), -1.8em 1.8em 0 0em rgba(184, 184, 184, 0.5), -2.6em 0em 0 0em rgba(184, 184, 184, 0.7), -1.8em -1.8em 0 0em #fff;
    }
}

.article-playlist-wrapper {
    margin-bottom: 1.2em;
    border: 1px solid #dfe5eb;
    border-radius: .5em;
    -moz-border-radius: .5em;
    -webkit-border-radius: .5em;
}

.playlist-controls {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 15px;
}

.loop-holder {
    flex-basis: 50%;
    display: flex;
    justify-content: space-between;
}

.autoplay-holder {
    flex-basis: 50%;
    display: flex;
    justify-content: space-between;
}

.autoplay-holder h5 {
    margin: 0;
}

.playlist-header hr {
    margin: 5px 0;
}

.playlist-title {
    margin-top: 0;
    width: 100%;
}

#media-playlist {
    max-height: 380px;
    width: 105%;
    overflow: auto;
    position: relative; }

#media-playlist h3 {
    margin-top:0;
    font-size: 13px;
    white-space: normal;
    height: auto; }

#media-playlist .scrollbar {
    border:none;
    height:500px; }

#media-playlist .mediaOverlay h3 {
    padding-left: 7.5px;
    padding-right: 7.5px;
}

#media-playlist .number {
    background-color: lightgray;
    width: auto;
    height: 20px;
    border-radius: 10px;
    align-content: center;
    color: black;
    justify-content: center;
    text-align: center;
    min-width: 15px;
    display: inline-grid;
    padding:0 7.5px;
}

#media-playlist .number i {
    color: black;
    font-size: 12px;
    padding-right: 5px;
}

.share-playlist-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-left: 15px;
}

.share-playlist-container .playlist-button-holder {
    display: flex;
    align-items: baseline;
}

.share-playlist-container h3 {
    margin: 0;
}

.share-playlist-container .shareMedia {
    margin-right: 0;
}

.playlist-autoplay-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.playlist-autoplay-switch {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 19px;
    visibility: hidden;
    margin-right: 0;
}

.playlist-autoplay-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.playlist-autoplay-slider:before {
    position: absolute;
    content: "";
    height: 11px;
    width: 11px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked + .playlist-autoplay-slider {
    background-color: #475d7b;
}

input:focus + .playlist-autoplay-slider {
    box-shadow: 0 0 1px #475d7b;
}

input:checked + .playlist-autoplay-slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

.playlist-autoplay-slider.playlist-round {
    border-radius: 25px;
}

.playlist-autoplay-slider.playlist-round:before {
    border-radius: 50%;
}

.playlist-loop-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.playlist-loop-switch {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 19px;
    visibility: hidden;
    margin-right: 0;
}

.playlist-loop-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.playlist-loop-slider:before {
    position: absolute;
    content: "";
    height: 11px;
    width: 11px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked + .playlist-loop-slider {
    background-color: #475d7b;
}

input:focus + .playlist-loop-slider {
    box-shadow: 0 0 1px #475d7b;
}

input:checked + .playlist-loop-slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

.playlist-loop-slider.playlist-round {
    border-radius: 25px;
}

.playlist-loop-slider.playlist-round:before {
    border-radius: 50%;
}

/*.playlist-media {*/
/*    display: flex;*/
/*    justify-content: space-between;*/
/*    position: relative;*/
/*    top: 50%;*/
/*}*/

.playlist-media .media_sortable {
    width: 100%;
}

.playlist-media > ul > li h4 {
    margin: auto;
    height: 70px;
    margin-top: 35px;
}

.playlist-media-time {
    padding-right: 7.5px;
    padding-top: 2px;
}

.playlist-wrapper .alert {
    overflow-wrap: break-word;
}

.playlist-list > div > span {
    overflow: hidden;
    max-width: 80%;
    display: inline-block;
    text-overflow: ellipsis;
}

.playlist-names {
    width: 100%;
    padding: 10px;
    cursor: pointer;
}

.playlists-container {
    padding-left: 0;
}

.playlists-container .active {
    border-bottom: 1px solid #475d7b;
}

.playlist-name {
    font-size: 18px;
    color: #475d7b;
}

.playlist-details {
    display: flex;
    justify-content: space-between;
}

.playlist-names:hover .playlist-visibility {
    color: #475d7b;
}

.playlist-media-count,
.playlist-visibility {
    color: #5C707A;
    font-size: 12px;
}

.playlist-name .rename-icon,
.playlist-name .delete-icon {
    font-size: 15px;
    visibility: hidden;
    position: relative;
    top: 0;
    float: right;
}

.playlist-name .rename-icon {
    padding-right: 10px;
}

.playlist-name-input {
    max-width: 80%;
}

.playlist-names:hover {
    background-color: #dfe5eb;
}

.playlist-names i:hover {
    color: #000000;
}

.playlist-names:hover .rename-icon,
.playlist-names:hover .delete-icon {
    visibility: visible;
}

.playlist-media .sortable_item > a > article {
    background-color: #fdfdfd;
    margin-bottom: 0;
}

.playlist-media .sortable_item > a > article:hover {
    cursor: move;
}

.inputSwitch input {
    border: none;
    background-color: inherit;
}

.inputSwitch input:focus {
    border-bottom: 1px solid #475d7b;
}

.inputSwitch span {
    max-height: calc(1em * 3);
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
    width: 80%;
}

.playlists-container .loader-icon-playlist {
    font-size: 5px;
    left: 50%;
    top: -20px;
}

.media-playlist-container {
    display: flex;
    background-color: lightgray;
}

.playlist-media-info span {
    display: block;
    padding-left: 10px;
}

.playlist-media-info i {
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translate(0, -50%);
}

.playlist-media-info {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.create-new-playlist input[type=text] {
    width: 30%;
}

.currently-playing {
    font-weight: bold;
}

.no-playlists {
    padding-left: 10px;
    font-size: 18px;
}

.playlist-media,
.playlist-media li{
    padding-right: 0;
}

.playlist-media .media_sortable {
    width: 100%;
}

.playlist-media > .media_sortable > li {
    margin-bottom: 25px;
}

.user-image {
    padding-left: 7.5px;
}

.playlist-media-time {
    padding-right: 7.5px;
}

.playlists-overview .expanding-menu-button,
.playlists-overview .expanding-menu-content {
    border: 0;
    padding-left: 10px;
    padding-right: 10px;
}

.playlists-overview .expanding-menu-content {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.playlists-overview .expanding-menu-button:not(i),
.playlists-overview .expanding-menu-content h3{
    font-size: 18px;
}

.playlists-overview .expanding-menu-button:not(.expanding-menu-button--active) {
    border: 0;
}

.playlist-share-buttons {
    display: flex;
}

.playlist-share-buttons button {
    margin-left: 5px;
}

.playlist-share-buttons #sendPmButton i,
.playlist-share-buttons #copyLinkBtn i {
    margin-right: 4px;
}

.playlist-names:focus {
    outline: 2px solid #3B6297;
}

.playlist-send-pm-section .nav-tabs {
    border-bottom: none;
}

.playlist-add-title {
    margin-left: 0 !important;
}

@media (max-width:768px) {
    .create-new-playlist input[type="text"] {
        width: 100%
    }

    .playlist-media .mediaThumbs.list .details {
        padding: 0;
    }

    .playlist-media > .media_sortable > li {
        margin-bottom: 5px;
    }
}

@media (max-width:625px) {
    .share-playlist-container {
        display: block;
    }
    #sendPmButton {
        margin-left: 0;
    }
    .playlist-share-buttons {
        width: 100%;
        justify-content: space-between;
    }

    .playlist-media .media_sortable .mediaInfo h3 {
        font-size: 1em;
    }
}

@media (max-width:500px) {
    .addToPlaylist {
        width: 100%;
        margin-left: 0;
    }

    .input-create-btn {
        display: block;
    }

    .playlist-share-buttons {
        display: block;
    }

    .playlist-share-buttons .btn {
        width: 100%;
        margin: 0;
    }

    .playlist-share-buttons .shareMedia {
        float: none;
    }

    .share-playlist-container {
        margin-left: 0;
    }

    .playlist-media {
        padding-left: 0;
    }

    .playlists-container {
        padding-right: 0;
    }

    .playlist-media .mediaThumbs.list .details {
        font-size: .7em;
    }

    .playlist-media .media_sortable .mediaInfo .text {
        display: none;
    }
}
/**************** MEDIA PLAYLISTS END ****************/
.verify-medium,
.approve-media-transfer {
    display: contents;
}

/**************** MEDIA TRANSFER START ****************/

.media_transfer li {
    display: flex;
    align-items: flex-start;
}

.usernameTransferAutocomplete {
    z-index: 10040 !important;
}

input.transferConfirmCheckbox,
.transferWithdrawCheckbox {
    position: inherit !important;
}

/**************** MEDIA TRANSFER END ****************/

/************ COMMENTS SUGGESTIONS START ************/

.suggestionContainer {
    margin:0;
}

.tribute-container li.highlight {
    background: #4b6080;
}

/************* COMMENTS SUGGESTIONS END *************/

#side-menu-nav,
#side-menu-nav-user-links {
    position: fixed;
    top: 70px;
    height: auto;
    background-color: #ECEFF2;
    z-index: 9999999;
    display: none;
    max-height: 100vh;
    overflow: scroll;
}

#side-menu-nav {
    left: 0;
}

#side-menu-nav-user-links {
    right: 0;
}

@keyframes shadowAnimation {
    0% {
        box-shadow: 0 0 2px #3B6297;
    }

    25% {
        box-shadow: 0 0 4px #3b6297;
    }

    50% {
        box-shadow: 0 0 6px #3B6297;
    }

    75% {
        box-shadow: 0 0 4px #3B6297;
    }

    100% {
        box-shadow: 0 0 2px #3B6297;
    }
}

.shadow-animation {
    transform: none;
    animation: shadowAnimation 0.5s ease-in-out;
}