You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

184 lines
3.2 KiB

.nav{
width: 100%;
height: 60px;
padding: 0px;
position: fixed !important;
top: 0px !important;
left: 0px;
z-index: 150;
&-light{
.nav___share{
box-shadow: 0px 8px 10px rgba(0, 0, 0, 0.1);
background-color: inherit !important;
border: none;
// border: 1px solid $green1 !important;
a{
color: $green1 !important;
}
}
}
&__container{
width: 100%;
font-family: numeralLight;
padding : 0px 5px;
a{
color: white;
}
&--buttons{
li{
text-align: center;
padding: 6px 0px;
border-radius: 6px;
min-width : 130px;
font-family: numeralLight;
a{
width : 100%;
height : 100%;
}
}
}
}
&___share{
border: 2px solid $gray5;
}
&___login{
box-shadow: 0px 8px 10px rgba(0, 0, 0, 0.1);
background-color: $green1;
}
&___logo{
margin-left: 20px;
img{
height: 50px;
}
}
&__search{
min-width: 60px !important;
img{
transform: translateY(2px);
width : 25px;
}
}
}
@media screen and (min-width: 1441px){
.nav{
&__container{
max-width: $maxWidth;
&--links{
li{
padding: 0px;
font-size: 14px;
}
}
&--buttons{
li{
a{
font-size: 14px;
padding: 5px 0px;
}
}
}
}
&___logo{
// padding-right: 0px !important;
span{
width: 2px;
height: 15px;
background-color: $gray6;
margin-right: 15px;
transform: translateY(-1px);
}
}
&___login{
margin-right: 15px;
}
}
}
@media screen and (min-width: 1008px) and (max-width: 1440px){
.nav{
&__container{
max-width: 1250px;
&--links{
li{
padding: 0px 20px;
font-size: calc(100vw / 115);
}
}
&--buttons{
li{
a{
font-size: calc(100vw / 115);
padding: 5px 0px;
}
min-width: 100px;
}
}
}
&___logo{
padding-right: 0px !important;
span{
width: 2px;
height: 15px;
background-color: $gray1;
margin-right: 15px;
// transform: translateY(-1px);
}
}
&___share{
margin-left: 12px;
}
}
}
@media screen and (min-width: 641px) and (max-width: 1007px){
.nav{
&__container{
max-width: 900px;
&--buttons{
li{
padding: 6px;
border-radius: 7px;
min-width : 70px;
text-align: center;
font-size: calc(100vw / 65);
font-family: numeralLight;
}
}
}
&___share{
margin-left: 15px;
}
}
}
@media screen and (max-width: 640px){
.nav{
&__container{
max-width: 500px;
&--buttons{
li{
padding: 8px 6px;
border-radius: 6px;
min-width : 60px;
text-align: center;
font-size: calc(100vw / 32);
font-family: numeralLight;
}
}
}
&___share{
display : none;
}
&___login{
}
&__search{
min-width : 50px !important;
& img{
width : 22px;
}
}
}
}