Files
studio-up/tailwind/custom/base.css
2025-08-29 06:20:43 +02:00

73 lines
1.9 KiB
CSS
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
/**
* Custom styles to immediately follow Tailwinds `base` layer
*/
/**
* This uses the background and foreground colors declared in the `theme.json`
* file and is applied both to the front end and in the block editor.
*/
body {
@apply bg-background font-sans;
}
#topbar-footer {
@apply bg-primary h-[5vw] w-full;
background: url("assets/img/topbar-footer.jpg") no-repeat center top;
}
footer {
@apply bg-secondary w-full text-white;
.footer-menu {
@apply mb-4 flex flex-col gap-4 md:flex-row md:justify-center md:gap-8;
li {
@apply md:not-first:before:text-primary md:flex md:not-first:before:pr-5 md:not-first:before:content-["|"];
a {
@apply md:hover:text-primary block rounded-sm px-3 py-2 text-white hover:bg-gray-100 md:border-0 md:p-0 md:hover:bg-transparent;
}
}
}
.footer-text-and-icons {
@apply font-roboto flex w-full flex-col items-start justify-between gap-4 py-8 text-sm md:ml-0 md:flex-row md:items-center md:gap-8;
.w-1\/4 {
@apply w-full justify-start pl-8 md:w-1/4 md:justify-center md:pl-0;
}
}
}
#header-menu {
@apply flex flex-col rounded-lg border-0 p-4 font-medium lg:flex-row lg:space-x-5 lg:p-0 rtl:space-x-reverse;
}
#masthead {
@apply relative;
height: 75vh;
}
#nav-container {
@apply w-full py-16;
#site-navigation {
@apply container mx-auto flex flex-row items-center justify-between rounded-4xl bg-white p-0;
#menu {
@apply bg-secondary font-barlow flex w-3/4 justify-end rounded-4xl px-12 py-6 text-2xl font-bold text-white;
a {
@apply md:hover:text-primary block rounded-sm px-3 py-2 text-white hover:bg-gray-100 md:border-0 md:p-0 md:hover:bg-transparent;
}
}
#logo {
@apply mx-12 my-4;
}
}
}
#slide {
background: url("assets/img/bg-slider.jpg") no-repeat center top;
z-index: -1;
@apply absolute top-0 w-full bg-cover;
height: 75vh;
}
#text-slide {
@apply font-montserrat z-10 mt-32 flex flex-col items-center justify-center text-center text-7xl font-bold text-white;
}