Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- .header__burger {
- position: relative;
- display: flex;
- flex-direction: column;
- align-items: flex-end;
- justify-content: center;
- width: 40px;
- height: 40px;
- cursor: pointer;
- pointer-events: initial;
- z-index: 600;
- }
- .header__burger:not(.header__burger_opened):hover .header__burger-line:nth-child(1) {
- transform: scaleX(0.75);
- }
- .header__burger:not(.header__burger_opened):hover .header__burger-line:nth-child(2) {
- transform: scaleX(1.25);
- }
- .header__burger_opened .header__burger-line {
- background-color: #ffffff;
- }
- .header__burger_opened .header__burger-line:nth-child(1) {
- transform: scaleX(0.75);
- }
- .header__burger_opened .header__burger-line:nth-child(2) {
- transform: scaleX(1.25);
- }
- .header__burger_opened:hover .header__burger-line:nth-child(1) {
- transform: scaleX(1);
- }
- .header__burger_opened:hover .header__burger-line:nth-child(2) {
- transform: scaleX(1);
- }
- .header__burger-line {
- display: block;
- width: 100%;
- background-color: #333333;
- height: 2px;
- margin: 4px 0;
- transition: all 0.6s cubic-bezier(0.785, 0.135, 0.15, 0.86);
- transform-origin: right center;
- transform: translateZ(0);
- }
- .header__burger-line:nth-child(1) {
- max-width: 40px;
- }
- .header__burger-line:nth-child(2) {
- max-width: 30px;
- }
- .header_white .header__burger-line {
- background-color: #ffffff;
- }
- .backgroundblendmode .blend-difference .header__burger-line {
- background-color: #ffffff;
- }
- @media screen and (max-width: 991px) {
- .header__burger-line {
- margin: 3px 0;
- }
- .header__burger-line:nth-child(1) {
- max-width: 30px;
- }
- .header__burger-line:nth-child(2) {
- max-width: 25px;
- }
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement