/* Toolbar / Top Nav */

/**importing bootstrap inside of a wrapper class to avoid conflicts with admin and group site styles**/
/**vendor**/
@import "../select2/select2.css";

@primaryColor: #000;
@coloredBackgroundTextColor: #000;
@navSubmenuBackgroundColor: #fff;

.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important;
}

.oplb-bs {
    @import "./bootstrap/bootstrap.less";
    @import "./variables.less";

	a {
		text-decoration: underline;

		&:hover {
			text-decoration: none;
		}
	}

    #wpadminbar{
        position: absolute;
        font-family: "Open Sans",Helvetica,Arial,sans-serif;
        background: #444;
        font-size: 14px;
        line-height: 1.42857;
        color: #fff;
        height: 50px;
        top: 63px;
        min-width: 0;
        z-index: 99997;
        p,
        a{
            text-shadow: none !important;
        }
        .bold{
            font-weight: 700;
        }
        .fa {
            font-size: 14px;
            line-height: 49px;
            margin: 0 4px;
        }
		.btn-default {
			&:hover {
				color: @80gray;
			}
		}
        #wp-toolbar{
			display: flex;
			justify-content: space-between;
            line-height: normal;
            margin: 0 auto;
            max-width: none;
            #wp-admin-bar-root-default{
                .ab-icon{
                    &.dashicon-icon{
                        font: 400 28px/1 dashicons;
                        height: auto;
                        position: absolute;
                        left: 0;
                        right: 0;
                        top: 0;
                        width: auto;
                        margin:0 auto;
                        &:before{
                            top: 11px;
                        }
                        &:hover,
                            &:focus{
                            color: @white;
                        }
                    }
                }
            }
            > ul{
                > li{
                    position: relative;
					height: 50px;

					&.ab-empty-item{
						padding: 18px 14px 17px;
					}
                    > .ab-item{
                        color: #ffffff;
                        cursor: pointer;
                        text-align: center;
						height: 50px;
                        line-height: 49px;
                        margin-right: 0;
                        padding: 0 14px;
                        font-size: 14px;
                        text-decoration: none;
                        &:before{
                            margin: 0;
                            content: '';
                        }
                        .fa-caret-down{
                            font-size: 12px;
                            padding-left: 8px;
                        }
                        @media(max-width: 992px){
                            font-size: 13px;
                        }
                        &.ab-empty-item{
                        }
                    }
                    > .fa{
                        font-family: FontAwesome;
                        font-size: 14px;
                        width: 14px;
                        margin: 0 auto;
                    }
                    .toolbar-item-count{
                        background: #ff7a7a;
                        color: #000;
                        border-radius: 8px;
                        display: inline-block;
                        font-size: 10px;
                        font-weight: 400;
                        height: 16px;
                        line-height: 164%;
                        text-align: center;
                        vertical-align: middle;
                        width: 16px;
                        opacity: 1;
                        &.sub-count{
                            position: absolute;
                            right: 8px;
                            top: 13px;
                        }
                    }
                    &.hover,
                    &:hover{
                        > a,
                        > .ab-item{
                            background: #333;
                            color: @lightHighlight;
                        }
                    }
                    @media (max-width: @screen-xs-max){
                        position: static;
                        &.hamburger{
                            .ab-item{
                                padding: 0;
                                .navbar-toggle{
                                    border-radius: 0;
                                    margin: 7px 1px 0;
                                    padding: 10px 5px 17px;
                                    &.network-menu.active{
                                        background: #737373;
                                    }
                                    &.mol-menu.active{
                                        background: #a2a2a2;
                                    }
                                }
                            }
                        }
                    }
                }
                @media (max-width: @screen-xs-max){
                    padding-left: 1%;
                }
            }
            .admin-bar-menu{
                li{
                    font-size: 14px;
                    a{
                        background: #fff;
                        color: #333;
                        padding: 6px 12px;
                        text-decoration: none;
                        &:hover,
                            &:focus{
                            background: @navLinkBackgroundColor;
                            color: @navLinkTextColor;
                        }
                    }
                    @media (max-width: @screen-xs-max){
                        background: rgba(239, 239, 239, 0.8);
                        a{
                            background: rgba(255,255,255,0.42);
                            font-weight: bold;
                            width: 75%;
                        }
                    }
                }
            }
            .ab-sub-wrapper{
                background: #fff;
                border: 1px solid @70gray;
                border-top: none;
                border-radius: 0 0 4px 4px;
				margin-top: 1px;
				left: -1px;
                width: 600%;
                .ab-submenu{
                    padding: 0;
                    background: #fff;
                    border-radius: inherit;
                    p{
                        color: #333;
                        margin-bottom: 8px;
                        font-size: 12px;
                        &:last-child{
                            margin-bottom: 0;
                        }
                    }
                    li{
                        &:last-child{
                            border-radius: 0 0 4px 4px;
                            border-bottom: none;
                            a:not(.btn){
                                border-radius: 0 0 4px 4px;
                                border-bottom: none;
                            }
                        }
                    }
                    .submenu-title{
                        background: @navSubmenuBackgroundColor;
                        margin-bottom: 16px;
                        color: #333;
                        .ab-item{
                            padding: 5px 10px;
                            font-size: 14px;
                        }
                    }
                    .menu-bottom-link{
                        background: @navSubmenuBackgroundColor;
                        padding: 9px 16px;
                        text-align: right;
                        border-radius: inherit;
                        a{
                            color: @80gray;
                            font-size: 12px;
                            text-decoration: underline;
                            &:hover,
                                &:focus {
                                text-decoration: none;
                            }
                        }
                    }
                    .nav-content-item{
                        padding-bottom: 16px;
                        margin-top: 16px;
                        border-bottom: 1px solid #e5e5e5;
                        .ab-item{
                            width: 90%;
                            margin: 0 auto;
                            .actions{
                                .btn{
                                    float: left;
                                    font-size: 14px;
                                    margin-right: 2%;
                                    position: relative;
                                    width: auto;
                                }
                            }
                        }
                        .activity-row{
                            overflow: hidden;
                        }
                        .inline-links{
                            a{
                                display: inline;
                            }
                        }
                        a{
                            text-decoration: underline;
                            &:hover,
                                &:focus {
                                text-decoration: none;
                            }
							&.btn {
								text-decoration: none;
							}
                        }
                    }
                }
                @media (max-width: @screen-xs-max){
                    background: transparent;
                    left: -1%;
                    right: 0;
                    top: 1px;
                    border: none;
                    border-radius: 0;
                    margin: 0;
                    .ab-submenu{
                        background: rgba(255, 255, 255, 0.42);
                        padding-left: 1%;
                        .ab-item{
                            padding: 6px 12px;
                            float: none;
                        }
                    }
                }
            }
			.ab-top-menu {
				display: flex;
				align-items: stretch;
			}
            .ab-top-secondary{
                .menupop{
                    .ab-sub-wrapper{
                        right: -1px;
                    }
                }
            }
            #wp-admin-bar-mobile-centered{
                margin: 0 auto;
                overflow: hidden;

				&.ab-top-menu {
					display: none;
				}

                #wp-admin-bar-my-openlab-mobile{
                    float: none;
                    .ab-item{
                        text-align: right;
                    }
                    .very-small-size{
                        display: none;
                    }
                    @media(max-width: @screen-xxs-max){
                        .small-size{
                            display: none;
                        }
                        .very-small-size{
                            display: block;
                        }
                    }
                }
            }
            #wp-admin-bar-menu-toggle{
                .ab-item{
                    height: 44px;
                    margin: 0;
                    padding: 6px 0 0;
                    .navbar-toggle{
                        border-radius: 0;
                        margin: 0 1px;
                        padding: 10px 5px 17px;
                        .icon-bar{
                            background: @white;
                            height: 3px;
                        }
                    }
                }
            }
            #wp-admin-bar-my-hamburger{
                .icon-bar{
                    background: @lightHighlight;
                    height: 3px;
                }
            }
            #wp-admin-bar-my-hamburger-mol{
                .icon-bar{
                    background: @yellow;
                    height: 3px;
                }
            }
            #wp-admin-bar-query-monitor{
                .ab-item{
                    padding-bottom: 0;
                    @media (max-width: @screen-xs-max){
                        padding-top: 0;
                    }
                }
                @media (max-width: @screen-xs-max){
                    display: none !important;
                }
            }
            #wp-admin-bar-openlab{
                > .ab-item{
					background-size: 150px Auto;
                    padding: 50px 0 0;
                    width: 150px;
                    overflow: hidden;
                    height: 0;
                    @media (max-width: 479px){
                        width: 37px;
                        background-position: -11% 58%;
                    }
                }
                .ab-sub-wrapper{
                    width: 170px;
                }
            }
            #wp-admin-bar-my-openlab,
            #wp-admin-bar-site-name
            {
                border-left: 1px #000 solid;
                border-right: 1px #000 solid;
                .ab-sub-wrapper{
                    width: 170%;
                }
            }
            #wp-admin-bar-site-name{
                border-left: none;
		max-width: 320px;
            }
            #wp-admin-bar-my-openlab,
            #wp-admin-bar-network-menu-mobile{
                @media(max-width: @screen-xs-max){
                    border: none;
                    > .ab-item{
                        padding: 7px 0 0;
                        display: none;
                        width: 0;
                    }
                    .ab-sub-wrapper{
                        top: 50px;
                    }
                }
            }
            #wp-admin-bar-network-menu-mobile{
                .ab-sub-wrapper{
                    border: none;
                    border-top: 9px solid #a2a2a2;
                }
            }
            #wp-admin-bar-my-openlab{
                @media (max-width: @screen-xs-max){
                    .ab-sub-wrapper{
                        border: none;
                        border-top: 9px solid #d1d1d1;
                    }
                }
            }
            #wp-admin-bar-my-account{
				max-width: 220px;
				.ab-sub-wrapper{
					left: auto;
					width: 150%;
					min-width: 250px;
					p {
						color: #333;
						&.actions{
							padding-top: 6px;
						}
					}
				}

				& > .ab-item {
					white-space: nowrap;
				}
            }
            #wp-admin-bar-dashboard-link,
            #wp-admin-bar-new-content,
            #wp-admin-bar-comments{
                @media(max-width: @screen-xs-max){
                    a{
                        position: relative;
                        margin: 0 4px;
                        padding: 0 14px;
                    }
                    &.hover,
                    &:hover,
                        &:focus{
                        background: transparent;
                        a{
                            background: transparent;
                            color: @white;
                        }
                        > .ab-sub-wrapper{
                            display: none;
                        }
                    }
                }
            }
            #wp-admin-bar-dashboard-link,
            #wp-admin-bar-comments{
                a{
                    .dashicon-icon{
                        padding-top: 2px;
                        &.dashicons-admin-home{
                            &:before{
                                top: 10px;
                            }
                        }
                    }
                }
            }
            #wp-admin-bar-comments{
                a{
                    .dashicon-icon{
                        &:before{
                            left: 3px;
                        }
                    }
                }
            }
            #wp-admin-bar-activity{
                border-right: 1px solid #000000;
            }
            #wp-admin-bar-top-logout,
            #wp-admin-bar-bp-login,
            #wp-admin-bar-bp-register{
                background: #000;
				white-space: nowrap;
            }
            #wp-admin-bar-bp-register,
            #wp-admin-bar-top-logout{
                border-left: 1px #666666 solid;
                border-right: 1px #666666 solid;
            }
            #wp-admin-bar-bp-login{
                background: transparent;
                position: relative;
                > a{
                    background: @black;
                    border-right: 1px #666666 solid;
                    max-height: 49px;
                }
                .ab-sub-wrapper{
                    background: transparent;
                    border: none;
                    color: #333;
                    width: 350% !important;
                    left: -250%;
                    margin-top: 1px;
                    top: auto;
                    .ab-submenu{
                        background: @white;
                        border: none;
                        border-radius: 0 0 4px 4px;
                        -webkit-box-shadow: 0 3px 5px rgba(0,0,0,0.2);
                        box-shadow: 0 3px 5px rgba(0,0,0,0.2);
                    }
                    #sidebar-login-form{
                        padding: 3% 5%;
                        .forgetmenot{
                            label{
                                line-height: 21px;
                            }
                        }
                        .sidebar-wp-submit{
                            margin-bottom: 5px;
                        }
                        .lost-pw{
                            line-height: 24px;
                        }
                    }
                }
                @media (max-width: @screen-xs-max){
                    .ab-submenu{
                        background: #fff;
                    }
                }
                &.login-form-active{
					max-width: 70px;
                    .ab-submenu{
                        border: 1px solid @70gray;
                        border-top: none;
                    }
                }
            }
            #wp-admin-bar-updates{
                @media (max-width: 767px){
                    display: none;
                }
            }
            #wp-admin-bar-customize{
                display: none;
            }
        }
    }
    &.navbar-default{
        background: transparent;
        border: none;
        margin-bottom: 80px;
        .header-mobile-wrapper{
            background: #fff;
            position: relative;
        }
        .main-nav-wrapper{
            border-bottom: 1px solid @10gray;
            @media(max-width: @screen-xs-max){
                top: 114px;
                border-bottom: none;
            }
        }
        .container-fluid{
            margin: 0 auto;
            .navbar-right{
                &.search{
                    .btn{
                        height: 34px;
                        padding: 0 2%;
                        vertical-align: top;
                    }
                }
            }
        }
        &.navbar-location-footer{
            margin-bottom: 0;
        }
    }
    /**sitewide header elements on admin and group sites (mobile only)**/
    &.navbar-location-oplb-bs{
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        z-index: 210;
    }
    /**sitewide header**/
    .navbar-header{
        header{
            margin: 0;
            border-right: 1px solid @10gray;
            a{
                display: block;
                width: 185px;
                overflow: hidden;
            }
            @media(max-width: @screen-sm-max){
				height: 63px;
                width: 136px;
                margin: 0;
                a{
					background-repeat: no-repeat;
                    background-size: 100%;
                    background-position: 0 8px;
					height: 100%;
					width: 100%;

					img {
						height: auto;
						margin-top: 8px;
						width: 100%;
					}
                }
            }
        }
    }
    /**sitewide search**/
    .search{
        position: relative;
        z-index: 999999;
        &.search-form{
            z-index: 999998;
        }
        .search-form-wrapper{
            background: #fff;
            display: none;
            position: absolute;
            right: 0;
            top: 65px;
            width: 336px;
            border: 1px solid @10gray;
            border-radius: @border-radius-no-top-right;
            .form-group{
                margin-left: 18px;
                padding: 5px 0;
				width: 100%;
            }
			#search-terms-desktop-header {
				width: 258px;
			}
            @media (max-width: @screen-xs-max){
                position: relative;
                top: 0;
                width: 100%;
                .form-group{
                    margin-bottom: 0;
                    .form-control{
                        display: inline-block;
                        vertical-align: top;
                        &.search-terms-mobile{
							width: calc(100% - 6% - 62px);
                        }
                    }
                }
            }
        }
        .search-trigger-wrapper{
            height: 59px;
            position: absolute;
            right: 0;
            text-align: center;
            width: 30px;
            cursor: pointer;
            color: @70gray;
            &:hover{
                color: #000;
            }
            .search-trigger{
                display: block;
                outline: none;
                padding: 0 0 0 4px;
                &:focus{
                    outline: thin dotted;
                }
            }
            span{
                line-height: 4.5;
            }
            &.search-live{
                background: none repeat scroll 0 0 #ffffff;
                border-bottom: 1px solid #ffffff;
                border-bottom-left-radius: 0;
                border-bottom-right-radius: 0;
                border-left: 1px solid #dddddd;
                border-right: 1px solid #dddddd;
                box-sizing: padding-box;
                height: 67px;
                z-index: 999999;
                span{
                    color: #000;
                }
            }
            @media(max-width: @screen-xs-max){
                span{
                    line-height: 4;
                }
                &.search-live{
                    height: 64px;
                }
            }
        }
        @media(max-width: @screen-xs-max){
            &.search-trigger{
                z-index: 1;
            }
        }
    }
    .search-mode-mobile{
        .search-submit{
            height: 35px;
            padding: 0 3%;
            vertical-align: top;
            @media (max-width: @screen-xxs-max){
            }
        }
    }
    .see-all {
        font-size: 12px;
		a {
            text-decoration: underline;
			&:hover {
				text-decoration: none;
			}
		}
    }

    /**footer - also a sitewide component**/
    &#openlab-footer{
        position: absolute;
        bottom: 0;
        right: 0;
        left: 0;
        &.placeholder{
            position: relative;
            visibility: hidden;
        }
        .container-fluid {
            max-width: 1155px;
        }
        .semibold{
            font-weight: 600;
        }
        .bold{
            font-weight: 700;
        }
        .regular{
            font-weight: 400;
        }
        .deco{
            text-decoration: underline;
        }
        .cuny-logo{
            max-width: 74px !important;
        }
		.cboxol-footer-logo img{
			margin-left: -5px;
		}
        p,
        a{
            font-size: 14px;
        }
        p,
        a,
        h2{
            text-shadow: none !important;
        }
        .footer-wrapper{
            color: #333333;
            font-family: "Open Sans",Helvetica,Arial,sans-serif;
            font-size: 14px;
            line-height: 1.42857;
            background: #f0f0f0;
            margin: 0 auto;
            padding-top: 30px;
            width: 100%;
            @media (max-width: @screen-xs-max){
                width: 95%;
				.cboxol-footer-middle-para {
					padding-left: 7.5px;
					padding-right: 7.5px;
				}
            }
        }
        .row{
			display: table;
			padding-bottom: 40px;
            h2{
                color: #333;
                margin: 0 auto 22px;
				text-size: 20px;
                @media (max-width: @screen-xs-max){
                    margin: 0 auto 8px 7.5px;
                }
            }
			[class*="col-"] {
				border-radius: 0;
			}
			.footer-section {
				float: none;
				display: table-cell;
				padding: 0 30px;
				border-right: 1px solid #aaa;

				@media (max-width: @screen-xs-max){
					border-right: none;
					display: block;
					padding-left: 0;
					padding-right: 0;
					padding-bottom: 30px;
				}

				&:first-child {
					padding-left: 0;
				}

				&:last-child {
					border-right: none;
					padding-right: 0;
				}

				.cboxol-footer-image {
					width: 100%;
					@media (max-width: @screen-xs-max){
						width: 76px;
					}
				}

				&.footer-right {
					margin-left: 7.5px;
				}
			}
	    h3{
		font-size: 13px;
		text-decoration: underline;
	    }
        }
		.footer-widget {
			width: 45%;
			float: left;
			padding: 0 5% 30px 0;
		}
        .col-logos{
            display: inline-block;
            p{
                color: #444;
                float: right;
                width: 72%;
            }
            a{
                img{
                    padding-top: 5px;
                    margin-right: 15px;
                }
                &.citytech-logo{
                    width: 12%;
                }
                &.cuny-logo{
                    width: 14%;
                }
            }
            h2{
                span{
                    vertical-align: middle;
                    &:first-child{
                        padding-right: 5px;
                    }
                }
            }
            @media (max-width: @screen-xs-max){
                border-bottom: 1px solid @30gray;
                padding: 0 0 18px;
                margin-bottom: 20px;
                h2{
                    span{
                        display: block;
                        font-size: 18px;
                        &:last-child{
                            font-size: 11px;
                        }
                    }
                }
                a{
                    &.citytech-logo{
                        width: 9%;
                        min-width: 63px;
                    }
                    &.cuny-logo{
                        min-width: 74px;
                    }
                }
                p{
                    font-size: 11px;
                    margin-bottom: 8px;
                    width: 100%
                }
            }
        }
        .col-links{
            color: @80gray;
            .first-header{
                margin-bottom: 19px;
            }
            .second-header{
                margin: 22px 0 18px;
            }
            .statement{
                margin-bottom: 3px;
            }
            a{
                color: @80gray;
                font-weight: inherit;
            }
            @media (max-width: @screen-xs-max){
                .horiz-divider{
                    display: none;
                }
                a{
                    display: block;
                }
            }
        }
        .col-copyright{
	    padding-right: 0;
	    ul {
		font-style: italic;
		padding-left: 0;
		list-style-type: none;
		font-size: 13px;
	    }
	    img {
		margin-left: 8px;
	    }
            @media (max-width: @screen-xs-max){
                margin-top: 20px;
                margin-bottom: 24px;
            }
        }
        .horiz-bar-wrapper{
            float: left;
            width: 2%;
            .horiz-bar{
                background: none repeat scroll 0 0 @30gray;
                margin-left: 35%;
                padding-top: 135px;
                width: 1px;
            }
            @media (max-width: @screen-xs-max){
                display: none;
            }
        }
        .row-copyright{
            margin-bottom: 100px;
            margin-top: 17px;
            p,
            span,
            a{
                color: @80gray;
                @media (max-width: @screen-xs-max){
                    font-size: 8px;
                }
            }
            @media (max-width: @screen-xs-max){
                margin-bottom: 0;
                p{
                    margin-bottom: 20px;
                }
            }
        }
        @media (max-width: @screen-xs-max){
            .row-footer,
            .row-copyright{
                margin: 0;
            }
        }
    }
    /**go to the top button (mobile only)**/
    #go-to-top{
        background: rgba(209, 209, 209, .42);
        bottom: 5%;
        display: none;
        font-size: 13px;
        font-style: italic;
        padding: 6px 12px;
        position: fixed;
        right: 0;
        text-align: center;
        z-index: 10;
    }
    /**group site only**/
    &.adminbar-manual-bootstrap{
        #wpadminbar{
            top: 0;
            height: auto;
            &:before{
                border-bottom: 1px solid @black;
                bottom: -1px;
                content: "";
                left: 0;
                position: absolute;
                right: 0;
                z-index: -1;
            }
            #wp-toolbar{
                > ul{
                    > li{
                        > .ab-item{
                            min-height: 49px;
                            &.ab-empty-item{
                                padding-bottom: 16px;
                            }
                        }
                        &.hamburger{
                            .ab-item {
                                .navbar-toggle{
                                    padding-bottom: 14px;
                                }
                            }
                        }
                    }
                }
                #wp-admin-bar-openlab{
                }
                #wp-admin-bar-top-logout{
                    border-bottom: 1px solid @black;
                }
                #wp-admin-bar-bp-login{
                    .ab-sub-wrapper{
                        position: absolute;
                    }
                }
                #wp-admin-bar-network-menu-mobile,
                #wp-admin-bar-my-openlab{
                    @media (max-width: @screen-xs-max){
                        > .ab-item{
                            display: none;
                        }
                    }
                }
                #wp-admin-bar-customize{
                    display: none;
                }

            }
            @media (max-width: @screen-xs-max){
                top: 63px;
                border-bottom: none;
                &:before{
                    bottom: 0;
                }
            }
        }
        &.admin-area{
            #wp-admin-bar-new-content,
            #wp-admin-bar-comments{
                @media (max-width: @screen-xs-max){
                    display: none;
                }
            }
        }
    }
}
//for proper placement of footer
html{
    position: relative;
    height: auto;
}
/**for content placement on group sites and admin**/
body{
    &.adminbar-special{
        padding-top: 50px;
        @media (max-width: 767px){
            padding-top: 110px;
        }
    }
    .page-table{
        display: table;
        width: 100%;
        .page-table-row{
            display: table-row;
            height: 0;
            &.expanded{
                height: 100%;
            }
        }
    }
    .screen-reader-shortcut{
        &:focus{
            top: 0;
        }
    }
}
/**behind menu background**/
#behind_menu_background{
    display: none;
    position: absolute;
    top: 97px;
    bottom: 0;
    left: 0;
    right: 0;
    &.active{
        z-index: 9999;
        background: #000;
        opacity: 0;
    }
}
.wp-admin #behind_menu_background{
    top: 59px;
}

/* Block editor */
#editor {
	.editor-post-publish-panel,
	.edit-post-editor-regions {
		top: 110px;
	}
}

.interface-interface-skeleton,
.block-editor-editor-skeleton {
	top: 112px;
}

.block-editor-block-toolbar {
	overflow: hidden;
}

@media (min-width: 782px) {
	#editor {
		.editor-post-publish-panel,
		.edit-post-editor-regions {
			top: 74px;
		}
	}
	.edit-post-sidebar {
		top: 128px;
	}
	.block-editor__container {
		min-height: calc(100vh - 79px);
	}
	.interface-interface-skeleton,
	.block-editor-editor-skeleton {
		top: 72px;
	}
}
@media screen and (min-width: 600px) and (max-width: 781px) {
	.edit-post-header {
		top: 110px;
	}
}
