
/*MENU*/

nav header{
    width: 100%;
    height: 91px;
    background: transparent;
}

@media (max-width: 767px){
nav header{
    height: 60px;
}
}




body.nav-open {
  overflow: hidden;
}



#menu-components.menu-5 .content-holder {
  position: relative;
  z-index: 1;
  overflow: auto;
  box-shadow: 0 0 20px #000;
  -o-transition:transform .5s;
  -moz-transition:transform .5s;
  -webkit-transition:transform .5s;
  transition: transform 5s;
 
}

#menu-components.menu-5 main{
  padding-top: 100px;
}


#menu-components.menu-5 .menu-band{
  padding-top: 20px;
  padding-bottom: 20px;
  background: #0F0A0A  ;
  position: fixed;
  width: 100%;
  z-index: 200;
      border-bottom: solid 1px #464646;
}

@media (max-width: 767px){
  #menu-components.menu-5 .menu-band{
  padding-top: 5px;
  padding-bottom: 5px;
}    
}

.logo{
  height: 50px;
  margin-left: 25px;
font-family: 'Roboto Slab', serif;
}

span.logo-main a{
    line-height: 50px;
    color: #E33B89  ;
    font-family: 'Roboto Slab', serif;
    font-size:26px;
}

@media (max-width: 767px){
 
    .logo{
        margin-left: 15px;
    }
    
    .logo img{
        width:175px;
    }
}

span.logo-strap{
    line-height: 50px;
    color: #e52d5b ;
    font-family: 'Roboto Slab', serif;
    font-size:16px;
    font-weight:300;
    color: #fff;
    display: inline-block;
    margin-left: 7px;
}

/*
 #menu-components.menu-5 .nav-trigger:before{
     content:"MENU";
     display: inline-block;
     position:fixed;
     top: 42px;
     right: 80px;
     z-index: 2000;
     font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size:15px;
     color: #fff;
 }



 .nav-open #menu-components.menu-5 .nav-trigger:before{
     content:"CLOSE";
     color: #fff;
     display: inline-block;
     position:fixed;
     top: 42px;
     right: 80px;
     z-index: 2000;
 }
*/

@media (max-width: 767px){
 
#menu-components.menu-5 .nav-trigger:before,
.nav-open #menu-components.menu-5 .nav-trigger:before{
    display: none;
}
}


 #menu-components.menu-5 .nav-trigger {
  position: fixed;
  top:28px;
  right: 25px;
  height: 44px;
  width: 44px;
  overflow: hidden;
  color: #2E95AD ;
  white-space: nowrap;
  text-indent: 100%;
  z-index: 300;
}


@media (max-width: 767px){
 #menu-components.menu-5 .nav-trigger {
  top:15px;
  height: 30px;
  width: 30px;
     right:15px;
}    
}

#menu-components.menu-5 .nav-trigger span,
#menu-components.menu-5 .nav-trigger span::before,
#menu-components.menu-5 .nav-trigger span::after {
  position: absolute;
  height: 3px;
  width: 36px;
  background: #2E95AD;
}



#menu-components.menu-5 .nav-trigger span {
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%); 
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: background .3s;
  -moz-transition: background .3s;
  -o-transition: background .3s;
  transition: background .3s;
}

#menu-components.menu-5 .nav-trigger span::before,
#menu-components.menu-5 .nav-trigger span::after {
  content: '';
  top: 0;
  left: 0;
  -moz-transition: background .3s, transform .3s;
  -o-transition: background .3s, transform .3s;
  -webkit-transition: background .3s, transform .3s;
  transition: background .3s, transform .3s;
}

#menu-components.menu-5 .nav-trigger span::before {
  -ms-transform: translateY(-12px);
  -webkit-transform: translateY(-12px);
  transform: translateY(-12px);
}

#menu-components.menu-5 .nav-trigger span::after {
  -ms-transform: translateY(12px);
  -webkit-transform: translateY(12px);
  transform: translateY(12px);
}

#menu-components.menu-5 .nav-trigger:hover span, 
#menu-components.menu-5 .nav-trigger:hover span::before,
#menu-components.menu-5 .nav-trigger:hover span::after {
  background: white;
}

 .nav-open #menu-components.menu-5 .nav-trigger span {
  background: transparent;
}

.nav-open #menu-components.menu-5 .nav-trigger span::before,
.nav-open #menu-components.menu-5 .nav-trigger span::after {
  background: #2E95AD  ;
}


 .nav-open #menu-components.menu-5 .nav-trigger span::before {
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.nav-open #menu-components.menu-5 .nav-trigger span::after {
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

#menu-components.menu-5 .overlay {
  position: fixed;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0;
  visibility: hidden;
  -moz-transition: opacity .5s, visibility .5s;
  -o-transition: opacity .5s, visibility .5s;
  -webkit-transition: opacity .5s, visibility .5s;
  transition: opacity .5s, visibility .5s;
}

.nav-open #menu-components.menu-5 .overlay {
  opacity: .8;
  visibility: visible;
}

#menu-components.menu-5 .nav-container {
  position: fixed;
  z-index: 3;
  top: 0;
  right: 0;
  height: 100%;
  width: 90%;
  max-width: 480px;
  padding: 0px;
  background: #0F0A0A ;
  overflow: auto;
  -ms-transform: translateZ(0);
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -ms-transform: translateX(100%);
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
  -webkit-transition: transform .5s cubic-bezier(.07,.23,.34,1);
  -moz-transition: transform .5s cubic-bezier(.07,.23,.34,1);
  -o-transition: transform .5s cubic-bezier(.07,.23,.34,1);
  transition: transform .5s cubic-bezier(.07,.23,.34,1);
}

.nav-open #menu-components.menu-5 .nav-container {
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
}

#menu-components.menu-5 .nav-container h2 {
  font-size: 15px;
  font-weight: bold;
  text-transform: uppercase;
  color: #AAAAAA;
  margin: 1.5em 0;
}

 #menu-components.menu-5 .nav {
  list-style: none;
  padding: 24px;
  margin-top:91px;
}

#menu-components.menu-5 .nav li{
  line-height: 25px;
}

#menu-components.menu-5 .nav a{
display: block;
padding: 10px 0px 18px;
text-decoration: none;
color: #A9B4C2;
/*
-ms-transform: translateZ(0);
-webkit-transform: translateZ(0);
transform: translateZ(0);
*/
font-family: 'Roboto', sans-serif;
text-transform: uppercase;
letter-spacing: 2px;
font-size:16px;
line-height: 25px;
border-bottom: solid 1px #2d2d2d;
margin-bottom: 8px;
}

#menu-components.menu-5 .nav a.active-link{
color: #2E95AE ;
}

a i.services-arrow{
    float: right;
    font-size:25px;
}

ul.services-list{
margin-left: 10px;
font-size:14px;

}

ul.services-list a{
font-size:14px !important;
    color: #cdcdcd !important;
}



#menu-components.menu-5 .nav a:hover,
#menu-components.menu-5 .nav a:focus{
    background: transparent;
    
}



.content-holder{
    padding-top:91px;
}

@media (max-width: 767px){
 .content-holder{
    padding-top:61px;
}   
    
#menu-components.menu-5 .nav {
    margin-top: 61px;
}
    
}

