/**
0. Common styles - wrappers for all containers
    0.1 side bar table for portfolio projects: can be used for other pages as well
1. Page title(s) - common for all pages ()
2. My Projects Page
3. Project Registration pages (including payment page)
3. Credit actions, Measures
4. Score pages
5. Analytics Pages
6. Manage pages
7. Project Registration
8. Portfolio Pages
**/



/** Mobiles **/
@media (max-width: 767px) {

    /** 0. Common styles - wrappers for all containers/Tables: Starts **/
    .materialSpinner--wrapper{
        left: 44%;
    }

    .mobileView__rightArrow{
        background: url(../../assets/images/mob_nav_arrow_right.svg) no-repeat;
        width: 20px;
        height: 20px;
        background-size: 20px;
        margin-top: 6px;
        margin-left: 5px;
        float: right;
    }

    .noProjects-addProjects--container{
        width: 100%;
        margin-top: 60px;
    }

    /** 0. Common styles - wrappers for all containers/Tables: Ends **/

    /** 0.1 side bar table for portfolio projects: can be used for other pages as well : Starts**/
    .sideBar--projectsDetailsModal .modal-dialog{
        width: 95%;
    }

    .score--progressBar{
        width: 35px;
    }

    .score--progressBar__marginRight {
        min-width: 30px;
    }

    /** 0.1 side bar table for portfolio projects: can be used for other pages as well : Ends**/

    /* 8. Portfolio Pages: Starts */
    .ellipsis--addProject{
        float: right;
    }

    .ellipsis--addProject .dropdown > button{
        background: none;
        border: none;
    }

    .ellipsis--addProject .dropdown > button .fa-ellipsis-v{
        float: right;
        margin-top: 15px;
    }

    .ellipsis--addProject ul.dropdown-menu{
        right: 0;
        left: inherit;
        padding-left: 10px;
        padding-top: 7px;
        padding-bottom: 7px;
        min-width: 100px;
        margin-right: 5px;
        font-weight: 400;
    }

    .portfolioNav{
        padding-left: 0px;
        margin-bottom: -2px;
    }

    .portfolioNav .portfolioNav--item{
        margin-right: 25px;
    }

    .portfolioWidgets--wrapper{
        margin-left: -20px;
        margin-right: -20px;
    }

    .portfolioWidgets--wrapper .portfolioWidget {
        width: 100%;
        height: 75px;
        margin-bottom: 0px;
        border-bottom: 1px solid #ddd;
    }

    .portfolioWidget--label{
        float: left;
        padding-top: 5px;
    }

    .portfolioWidget-data--wrapper{
        float: right;
        margin-top: 0px;
        padding-top: 5px;
    }

    .portfolioWidget-data--value{
        float: left;
        margin-right: 10px;
        margin-left: 0px;
    }

    .portfolioWidget-data--units{
        margin-left: 0px;
    }

    .portfolioWidget-data--units .dropdown button{
        padding-left: 0px;
    }

    .sideBar--projectsDetailsModal .portfolioWidget-data--units{
        margin-top: 8px;
    }

    .portfolioContent--wrapper{
        margin-left: -20px;
        margin-right: -20px;
        border-radius: 0px;
        padding: 0px 10px;
        padding-top: 20px;
    }

    .projectList--toolsAndInfoWrapper {
        margin-bottom: 0px;
    }

    .projectList--numOfProjectsWrapper{
        float: left;
        clear: right;
    }

    .scoreCategory--Wrapper{
        float: left;
        margin-top: 10px;
    }

    .scoreCategory--Wrapper > div {
        margin-right: 40px;
        margin-bottom: 5px;
    }

    .arcFilter--wrapper__scoreView{
        margin-right: 0px;
        margin-bottom: 5px;
        margin-left: 10px;
    }

    .arcFilter--wrapper__scoreSortView {
        margin-right: 10px;
    }

    .arcTbl-mob .projectNameScore,
    .arcTbl-mob .projectNameCarbon{
        width: 80%;
        float: left;
    }

    .arcTbl-mob .projectNameScore .arcTbl--projectName,
    .arcTbl-mob .projectNameCarbon .arcTbl--projectName{
        float: left;
    }

    .arcTbl-mob .arcTbl--row .progress {
        margin-bottom: 10px;
        height: 25px;
        background: none;
        border-radius: 0px;
        margin-top: 30px;
    }

    .arcTbl-mob .arcTbl--row .project--score{
        padding-top: 3px;
        font-size: 14px;
    }

    .arcTbl-mob .projectNameScore .progressBar--score,
    .arcTbl-mob .projectNameCarbon .progressBar--carbon{
        border-left: none;
        clear: left;
    }

    .arcTbl-mob .arcTbl--row .progressBar--score .project--score{
        text-align: center;
        padding: 3px 0px 0px 0px;
    }

    .arcTbl .arcTbl--row .progressBar--score .progress-bar{
        width: 14%;
        border-radius: 4px;
        margin-right: 5px;
    }
    .arcTbl .arcTbl--row .progressBar--carbon .progress-bar{
        width: 28%;
        border-radius: 4px;
        margin-right: 5px;
    }

    .arcTbl-mob .arcTbl--projectScoreWrapper{
        float: right;
        margin-top: 15px;
    }

    .arcTbl-mob .carbon--totalRawGhgValue{
        float: right;
        width: initial;
        margin-top: 0px;
        padding-top: 22px;
    }

    .arcTbl-mob .carbon--progressBar__marginRight {
        margin-right: 0.05pc;
        min-width: 18%;
        max-width: 45%;
    }

    .arcTbl--pagination {
        width: 100%;
        position: relative;
        margin-top: -10px;
        padding-bottom: 20px;
    }

    .arcTbl--noOfRows {
        width: 50%;
    }

    .arcTbl--pageCounter{
        width: 25%;
        margin-left: 0px;
    }

    .arcTbl--paginationNav{
        width: 25%;
        text-align: right;
    }
    /* 8. Portfolio Pages: Ends */
    .model_vertical_divider {
        display: none;
    }
}

/** Tablets **/
@media (min-width: 768px) and (max-width: 991px) {
    .model_vertical_divider {
        display: none;
    }
}

/** Desktops **/
@media (min-width: 992px) and (max-width: 1199px) {
    
}

/** Big Monitors **/
@media (min-width: 1200px) {
    
}
