/*-
 * ================================================================================
 * eCOMP Portal
 * ================================================================================
 * Copyright (C) 2017 AT&T Intellectual Property
 * ================================================================================
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 * 
 *      http://www.apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 * ================================================================================
 */
@sidebar-width: 200px;
@transition-duration: 0.25s;
@overlayer-opacity: 0.65;


.close-button {
  .a24r;
  font-size: 3em;
  line-height: 18px;
  position: absolute;
  cursor: pointer;
  vertical-align: middle;
  top: @second-level-top;
  left: 0;
  -webkit-font-smoothing: antialiased;
  height: 53px;
  z-index: 101;
}
.ecomp-sidebar-container {
  position: absolute;
  display: block;
  left: 0;
  z-index: 100;
  transition: left @transition-duration;
  margin-top: -15px;

  .ecomp-sidebar-main {
    position: absolute;
    margin-top: 65px;
    width: @sidebar-width;
    height: 100vh;
    .bg_u;
    box-shadow: 0 4px 5px rgba(0, 0, 0, .2);

    padding-right: 10px;
    padding-left: 10px;

    .accordion-container{
      margin-top: 45px;
      overflow-y:auto;
      overflow-x:hidden;
    }
    .att-accordion-font{
      font-size: .875rem;
      color: #666;
      display: inline-block;
      font-family: arial;

    }

    .att-accordion-active{
      color: #199DDF !important;
    }

    .sub-item{
      .att-accordion-font;
      cursor: pointer;
      height: 37px;
      line-height: 37px;
      padding-left: 20px;
      padding-bottom: 10px;
      vertical-align: middle;
      width: 100%;
    }
    .sub-item:hover{
      .att-accordion-active;
    }

    .parent-item{
      .att-accordion-font;
      border-bottom: 1px solid #bbb;
      cursor: pointer;
      height: 37px;
      line-height: 37px;
      padding-bottom: 10px;
      vertical-align: middle;
      width: 100%;
    }
    .parent-item:hover{
      .att-accordion-active;
    }

  }
}

.open-sidebar {
  left: 0;
}

.close-sidebar {
  left: -@sidebar-width;
}

.content-overlayed {
  position: fixed;
  top: 110px;
  right: 0;
  bottom: 0;
  left: 0;
  background: none repeat scroll 0 0 rgb(242, 242, 242);
  z-index: 9999;
}
.fade-animation{
  opacity: @overlayer-opacity;
  transition: opacity @transition-duration ease-in-out;
}
.fade-animation.ng-hide {
  opacity:0;
  transition: opacity @transition-duration ease-in-out;
}

#contentId{
	padding-left:210px
}