Untitled diff

Created Diff never expires
1 removal
77 lines
20 additions
96 lines
.nav-toggle-btn_label {
position: absolute;
left: 50%;
transform: translate(-50%, 0);
bottom: 3px;
font-size: 10px;
transition: all 500ms ease-in-out;
}

.nav-open .nav-toggle-btn_label {
opacity: 0;
}

.nav-toggle-btn {
.nav-toggle-btn {
position: fixed;
position: fixed;
top: 5px;
top: 5px;
left: 10px;
left: 10px;
z-index: 102;
z-index: 102;
height: auto;
height: auto;
-webkit-transition: all 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}
}


.nav-toggle-btn {
.nav-toggle-btn {
cursor: pointer;
cursor: pointer;
padding: 15px 40px 28px 10px;
height: 43px;
width: 50px;
margin: 0;
margin: 0;
background: #ddd;
background: #ddd;
}
}


.nav-open .nav-toggle-btn {
.nav-open .nav-toggle-btn {
top: 0;
top: 0;
left: 240px;
left: 240px;
}

.nav-toggle-btn .nav-toggle-btn_sen {
left: 10px;
top: 15px;
}
}


.nav-toggle-btn .nav-toggle-btn_sen,
.nav-toggle-btn .nav-toggle-btn_sen,
.nav-toggle-btn .nav-toggle-btn_sen:before,
.nav-toggle-btn .nav-toggle-btn_sen:before,
.nav-toggle-btn .nav-toggle-btn_sen:after {
.nav-toggle-btn .nav-toggle-btn_sen:after {
cursor: pointer;
cursor: pointer;
height: 3px;
height: 3px;
width: 30px;
width: 30px;
background: #333;
background: #333;
position: absolute;
position: absolute;
display: block;
display: block;
content: '';
content: '';
}
}


.nav-toggle-btn .nav-toggle-btn_sen:before {
.nav-toggle-btn .nav-toggle-btn_sen:before {
top: -7px;
top: -7px;
}
}


.nav-toggle-btn .nav-toggle-btn_sen:after {
.nav-toggle-btn .nav-toggle-btn_sen:after {
bottom: -7px;
bottom: -7px;
}
}


.nav-toggle-btn .nav-toggle-btn_sen,
.nav-toggle-btn .nav-toggle-btn_sen,
.nav-toggle-btn .nav-toggle-btn_sen:before,
.nav-toggle-btn .nav-toggle-btn_sen:before,
.nav-toggle-btn .nav-toggle-btn_sen:after {
.nav-toggle-btn .nav-toggle-btn_sen:after {
transition: all 500ms ease-in-out;
transition: all 500ms ease-in-out;
}
}


.nav-open .nav-toggle-btn .nav-toggle-btn_sen {
.nav-open .nav-toggle-btn .nav-toggle-btn_sen {
background-color: transparent;
background-color: transparent;
}
}


.nav-open .nav-toggle-btn .nav-toggle-btn_sen:before,
.nav-open .nav-toggle-btn .nav-toggle-btn_sen:before,
.nav-toggle-btn.active .nav-toggle-btn_sen:after {
.nav-toggle-btn.active .nav-toggle-btn_sen:after {
top: 7px;
top: 7px;
}
}


.nav-open .nav-toggle-btn .nav-toggle-btn_sen:before {
.nav-open .nav-toggle-btn .nav-toggle-btn_sen:before {
transform: rotate(45deg);
transform: rotate(45deg);
-moz-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
-o-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
bottom: 0;
bottom: 0;
}
}


.nav-open .nav-toggle-btn .nav-toggle-btn_sen:after {
.nav-open .nav-toggle-btn .nav-toggle-btn_sen:after {
transform: rotate(-45deg);
transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}
}