/* COMMON */
#content {
    margin: 0;
    background-color: #e5e8ee;
}

#content .page {
    box-sizing: border-box;
    background-color: #FFFFFF;
    border-left: 1px solid #c4c7cc;

    min-height: 100%;
    position: relative;
    width: 990px;
    padding: 15px;
    padding-top: 75px;
    padding-bottom: 0;
    overflow: hidden;
}

.curriculaList {
    list-style: none;
    overflow: hidden;
    margin: 0;
    padding: 0;
    min-width: 100px;
}

    .curriculaList li {
        float: left;
        padding: 1px 5px;
        background-color: #dfeffc;
        color: #2e6e9e;
        margin-right: 5px;
        border: 1px solid #c5dbec;
        border-radius: 5px;
        margin-bottom: 5px;
        min-width: 34px;
    }

.pager {
    margin: 0 auto;
    text-align: center;
}

    .pager ul {
        list-style: none;
        padding: 0;
        display: inline-block;
    }

    .pager li {
        float: left;
        margin-right: 5px;
    }


/* PROFILES */

.areaA {
    float: left;
    overflow: hidden;
    width: 725px;
    margin-right: 30px;
}

.areaB {
    float: left;
    overflow: hidden;
    width: 200px;
}

#profileList .profile {
    background: #f8f9fb;
}

    #profileList .profile:nth-child(2n+1) {
        background: #e6eaf0;
    }

.profile {
    overflow: hidden;
    min-height: 50px;
    padding: 5px;
}

.profile-topLine {
    line-height: 10px;
}

.profile-img {
    float: left;
    margin-right: 10px;
    max-height: 78px;
}

.profile-name {
    font-size: 16px;
    line-height: 12px;
    display: inline-block;
    margin-right: 5px;
    float: left;
}

.profile-desc {
    color: #555555;
}


/* PROFILE */

.profilePage {
    padding: 110px 0 0 0 !important;
}

.profilePage-cover {
    height: 300px;
    background-image: url(../images/profileCoverDefaultImage.png);
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
    background-size: 100%;
    margin-bottom: 10px;
    position: relative;
}

.profilePage-changeCover {
    position: absolute;
    top: 15px;
    right: 15px;
    display: none;
}

.profilePage-cover:hover .profilePage-changeCover {
    display: block;
}

.profilePage-pageHeader {
    margin: -15px;
    background-color: #eaeef3;
    border-bottom: 1px solid #c4c7cc;
    background-image: url(../images/vertical-gradient-blue-1x60.png);
    background-repeat: repeat-x;
    background-position: bottom;
    position: relative;
    margin-bottom: 15px;
    padding: 7px 0 5px 25px;
}

    .profilePage-pageHeader a.backButton {
        float: left;
        margin-right: 45px;
    }

.profilePage .columnA {
    width: 730px;
    margin-right: 20px;
    float: left;
    position: relative;
    border-right: 1px dotted #d1d1d2;
    padding: 0 20px 0 15px;
    box-sizing: border-box;
}

.profilePage .columnB {
    width: 220px;
    float: left;
}

    .profilePage .columnB h2:first-child {
        margin-top: -3px;
    }

.profilePage-header {
    margin-bottom: 30px;
    overflow: hidden;
    padding-bottom: 5px;
}

.profilePage-image {
    float: left;
    margin-right: 15px;
}

.profilePage-description {
    width: 570px;
    padding: 5px;
    box-sizing: border-box;
    float: left;
    min-height: 150px;
    border: 1px solid #dadada;
    box-shadow: #dadada 1px 1px 8px;
}

.profilePage-description p {
    margin-top: 0;
    line-height: initial;
}

.profilePage-imageInfo {
    position: absolute;
    top: 105px;
    width: 100px;
    overflow: hidden;
}

#publishedResourcesCurricula {
    margin-bottom: 15px;
}

    #publishedResourcesCurricula a {
        margin-right: 10px;
    }

#publishedTopResources ol {
    list-style-position: inside;
    padding: 0;
    margin: 0;
    margin-bottom: 20px;
}

    #publishedTopResources ol > li {
        line-height: 9px;
        margin-bottom: 6px;
    }


#publishedTopResources a {
    margin-right: 5px;
    display: inline-block;
}

#publishedTopResources .curriculaList {
    position: relative;
    top: 8px;
    display: inline-block;
}


#memberOfDiscussions ul {
    list-style: none;
    padding: 0;
    margin: 0;
    list-style-type: square;
    list-style-position: inside;
}

.resourceListContainer h3 {
    margin-bottom: 0px;
}

.userList-user {
    float: left;
    margin-right: 10px;
    width: 79px;
}

    .userList-user img {
        max-width: 100%;
    }


.resourceList {
    margin-bottom: 30px;
    overflow: hidden;
}

    .resourceList .resource {
        background: #f8f9fb;
    }

        .resourceList .resource:nth-child(2n+1) {
            background: none;
        }


.resource {
    display: block;
    overflow: hidden;
    padding: 10px 5px 10px 0;
    max-height: 75px;
    box-sizing: border-box;
}

    .resource .resource-topLine {
        line-height: 14px;
        overflow: hidden;
    }

    .resource .resource-title {
        font-size: 18px;
        display: inline-block;
        float: left;
        margin-right: 10px;
    }

    .resource .resource-desc {
        color: #333333;
    }

    .resource img {
        height: 50px;
        border: 1px solid #dadada;
        float: left;
        margin-right: 15px;
    }


/* EDIT PROFILE */

.editUserPage .tabPanel {
    width: 770px;
    border: 1px solid #dadada;
    padding: 10px;
    min-width: 606px;
    margin-top: -4px;
}

    .editUserPage .tabPanel > label {
        display: block;
        margin-bottom: 10px;
        position: relative;
        padding-left: 200px;
    }

        .editUserPage .tabPanel > label > span {
            display: block;
            position: absolute;
            left: 0;
            max-width: 170px;
        }


#changeCoverModal.loading {
    background-image: url(../images/ajax-spinner.gif);
    background-repeat: no-repeat;
    background-position: center;
}

    #changeCoverModal.loading * {
        display: none;
    }
