.header{
	width: 100%;
	height: 70px;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100;
	opacity: 1;
	background-color: #242C52ed;
	box-shadow: 0px 1px 19px 1px rgba(0,0,0,.5);
}
.header__content{
	width: 1280px;
	display: flex;
	margin: auto;
	position: relative;
	height: 70px;
	color: white;
}
.header__cell{
	flex-grow: 1;
	flex-basis: 0;
	margin: auto;
}
.header__logo{
	padding-top: 4px;
}
.header__logo img{
	height: 60px;
	width: auto;
}
.header__phone_center{
	text-align: center;
}
.header__phone_right{
	text-align: right;
	flex: none;
	display: flex;
}
@media (max-width: 1280px){
	.header__content {
		width: 960px;
	}
}
@media (max-width: 960px){
	.header__content{
		width: auto;
		padding-left: 10px;
		padding-right: 10px;
	}
	.header__logo{
		-padding-left: 10px;
	}
}

.menu-phone{
	margin: auto;
	font-size: 2rem;
	display: flex;
	padding-left: 20px;
}
.menu-phone a{
	text-decoration: none;
	color: white;
}
.menu-phone i, svg{
	margin: auto 10px;
}

*, *:before, *:after{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

/*| Navigation |*/
.header__menu {
	visibility: hidden;
	padding-left: 140px;
   	display: inline-block;
	margin: auto;
}
nav{
  -width: 100%;
}
nav ul{
    list-style: none;
    position: relative;
    -float: right;
    -margin-right: 40px;
    display: inline-table;
}
    nav ul li{
      float: left;
      -webkit-transition: all .2s ease-in-out;
      -moz-transition: all .2s ease-in-out;
      transition: all .2s ease-in-out;
    }

    nav ul li:hover{background: rgba(255,255,255,.3);}
    nav ul li:hover > ul{display: block;}
    nav ul li{
      float: left;
      -webkit-transition: all .2s ease-in-out;
      -moz-transition: all .2s ease-in-out;
      transition: all .2s ease-in-out;
    }
      nav ul li a{
        display: block; 
        padding: 27px 20px;
		color: white;
        font-size: 14px;
        letter-spacing: 1px;
        text-decoration: none;
        text-transform: uppercase;
		  text-align: center;
      }
      nav ul ul{
        display: none;
        background: rgba(50,50,50,0.9);
        position: absolute; 
        top: 100%;
        box-shadow: -3px 3px 10px -2px rgba(0,0,0,.1);
        border: 1px solid rgba(0,0,0,.1);
      }
        nav ul ul li{float: none; position: relative;}
          nav ul ul li a {
            padding: 15px 30px; 
            border-bottom: 1px solid rgba(0,0,0,.05);
          }
          nav ul ul ul {
            position: absolute; 
            left: 100%; 
            top:0;
          }

.mobile-menu-icon {
	display: none;
	vertical-align: top;
	position: absolute;
	right: 0;
	top: 0;
	height: 70px;
	width: 70px;
}
.mobile-menu-icon span {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -11px;
	margin-top: -1px;
	display: inline-block;
	width: 22px;
	height: 2px;
	background: #fff;
	transition: all .2s ease;
}
.mobile-menu-icon.active span:before {
	-webkit-transform: translateY(0) rotate(
			-45deg);
	transform: translateY(0) rotate(
			-45deg);
}
.mobile-menu-icon.active span:after {
	-webkit-transform: translateY(0) rotate(
			45deg);
	transform: translateY(0) rotate(
			45deg);
}
.mobile-menu-icon.active span {
	background: transparent;
}
.mobile-menu-icon span:before {
	-webkit-transform: translateY(-300%);
	transform: translateY(-300%);
}
.mobile-menu-icon span:before, .mobile-menu-icon span:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	transition: all .2s ease;
}
.mobile-menu-icon span:after {
	-webkit-transform: translateY(300%);
	transform: translateY(300%);
}
.mobile-menu-icon span:after {
	-webkit-transform: translateY(300%);
	transform: translateY(300%);
}
.mobile-menu-icon span:after {
	-webkit-transform: translateY(300%);
	transform: translateY(300%);
}

@media screen and (max-width: 760px) {
	.mobile-menu-icon {
		display: inline-block;
		visibility: hidden;
	}
	.header__phone_center, .header__phone_right{
		flex-direction: column;
	}
	.menu-phone{
		font-size: 1.4rem;
	}
	.header__menu{
		padding-left: 0px;
		margin-top: 70px;
		background-color: black;
		width: 100%;
		-webkit-transform: translateX(100%);
		transform: translateX(100%);
		transition: -webkit-transform .3s ease;
		transition: transform .3s ease;
	}
	.header__menu.active{
		-webkit-transform: translateX(0);
		transform: translateX(0);
		transition: -webkit-transform .3s ease;
		transition: transform .3s ease;
	}
	.header__menu nav ul{
		display: grid;
	}
}

@media screen and (max-width: 460px) {
	.header__phone_center, .header__phone_right{
		display: none;
	}
	.header__logo{
		text-align: center;
	}
}