93 lines
2.0 KiB
SCSS
Raw Normal View History

2019-05-14 19:59:47 +02:00
header{
2019-04-05 00:19:26 +02:00
z-index: 999;
position: relative;
2019-05-01 19:59:32 +02:00
@include inlineflex();
2019-07-13 17:08:11 +02:00
justify-content: center;
2019-05-01 19:59:32 +02:00
width: 100%;
2019-05-27 17:03:03 +02:00
border-bottom: 1px solid $light-blue;
2019-06-03 15:22:10 +02:00
height: 105px;
2019-04-03 15:29:46 +02:00
nav{
@include inlineflex();
2019-05-31 23:37:11 +02:00
justify-content: space-around;
2019-04-03 15:29:46 +02:00
height: 100px;
2019-05-01 19:59:32 +02:00
width: 70%;
2019-05-31 23:37:11 +02:00
flex-wrap: nowrap;
2019-05-01 19:59:32 +02:00
.logo{
display: flex;
a{
display: block;
margin: auto;
}
2019-04-05 00:19:26 +02:00
}
2019-05-01 19:59:32 +02:00
&.dropmenu{
a{
padding: 10px;
}
& > ul{
@include inlineflex();
2019-07-13 17:08:11 +02:00
flex-wrap: nowrap;
2019-05-14 19:59:47 +02:00
& > li{
text-align: center;
2019-06-13 17:51:41 +02:00
max-width: 241px;
2019-05-27 17:03:03 +02:00
&>a{
2019-06-03 15:22:10 +02:00
white-space: nowrap;
2019-05-27 17:03:03 +02:00
line-height: 6rem;
border-top: 1px solid $light-blue;
border-bottom: 3px solid $green;
}
padding: 0 20px;
2019-04-05 00:19:26 +02:00
& > ul{
2019-05-01 19:59:32 +02:00
display: none;
2019-05-27 17:03:03 +02:00
margin-top: -1.5rem;
2019-05-14 19:59:47 +02:00
li{
background-color: white;
text-align: center;
a{
display: block;
padding: 10px;
2019-05-27 17:03:03 +02:00
position: relative;
&:before{
content: "";
position: absolute;
width: 100%;
height: 3px;
bottom: 0;
left: 0;
background-color: $green;
visibility: hidden;
-webkit-transform: scaleX(0);
transform: scaleX(0);
transition: all 0.3s ease-in-out 0s;
}
2019-05-14 19:59:47 +02:00
}
}
2019-05-01 19:59:32 +02:00
}
&:hover{
& > ul{
2019-04-05 00:19:26 +02:00
display: block;
2019-05-27 17:03:03 +02:00
li:hover{
a:hover:before {
visibility: visible;
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
2019-05-01 19:59:32 +02:00
}
2019-04-05 00:19:26 +02:00
}
}
}
}
}
.reso{
@include inlineflex;
2019-07-13 17:08:11 +02:00
flex-wrap: nowrap;
2019-05-01 19:59:32 +02:00
a{
display: block;
width: 35px;
margin: auto 5px;
}
2019-04-05 00:19:26 +02:00
}
2019-04-02 19:54:29 +02:00
}
}