.button-filled:hover .button-filled__g,
.article-url:hover .button-stroke__g,
.article-url:hover .button-black__g {
stroke: #ff7beb;
}
.button-filled {
cursor: pointer;
}
.article-image .article__inner .button svg,
.button,
.button svg,
article,
aside,
body .header .button-holder .button.burger-opener,
body.body-active-sidebar .header .button-holder .button.burger-closer,
details,
figcaption,
figure,
footer,
header,
hgroup,
img,
menu,
nav,
section {
display: block;
} .article h3,
.content-block li b,
.header-title,
.navbar h2,
.person h3,
.post-content.post-content--contacts ul strong {
font-family: Inter-Bold, sans-serif;
}
@font-face {
font-family: Inter-Regular;
src: url(//praxis-konzept.ch/wp-content/themes/praxis-theme-flake/fonts/Inter-Regular.woff2) format("woff2"), url(//praxis-konzept.ch/wp-content/themes/praxis-theme-flake/fonts/Inter-Regular.woff) format("woff"), url(//praxis-konzept.ch/wp-content/themes/praxis-theme-flake/fonts/Inter-Regular.ttf) format("truetype");
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: Inter-Bold;
src: url(//praxis-konzept.ch/wp-content/themes/praxis-theme-flake/fonts/Inter-Bold.woff2) format("woff2"), url(//praxis-konzept.ch/wp-content/themes/praxis-theme-flake/fonts/Inter-Bold.woff) format("woff"), url(//praxis-konzept.ch/wp-content/themes/praxis-theme-flake/fonts/Inter-Bold.ttf) format("truetype");
font-weight: 700;
font-style: normal;
}
a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
box-sizing: border-box;
}
a,
a:active,
a:focus,
a:focus-visible,
a:focus-within,
a:target,
a:visited {
color: #000;
text-decoration: underline;
}
a:hover {
text-decoration: none;
}
ol,
ul {
list-style: none;
}
blockquote,
q {
quotes: none;
}
blockquote:after,
blockquote:before,
q:after,
q:before {
content: "";
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
img {
max-width: 100%;
height: auto;
}
body {
background-color: #fff; color: #000;
font-family: Inter-Regular, sans-serif;
font-size: 27px;
line-height: 1.3;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: stretch;
min-height: 100vh;
overflow-x: hidden;
}
body.body-active-sidebar {
overflow: hidden;
}  h2 {
font-size: 160px;
line-height: 135px;
}
.container {
width: 100%;
max-width: 1233px;
margin: 0 auto;
padding: 0 10px;
}
.main {
flex-grow: 2;
display: flex;
flex-direction: column;
align-items: stretch;
justify-content: stretch;
}
.black {
background-color: #000;
color: #fff;
}
.yellow {
background-color: #fff60a;
}
.green {
background-color: #00ff3b;
}
.pink {
background-color: #ff7beb;
}
.blue {
background-color: #7bf5ff;
}
.orange {
background-color: #ff961c;
}
.beige {
background-color: #ffc7c7;
}
svg.button.button-link {
overflow: visible;
}
.button.burger {
position: relative;
z-index: 10001;
}
.button-filled__path,
.button-insta__path {
fill: #ffffff;
transition: fill 0.3s;
}
.button-filled--dark .button-filled__path {
fill: #000;
}
.button-filled--dark .button-filled__g {
stroke: #000;	
}
.button-filled--dark:hover .button-filled__g {
stroke: #ff7beb;
}
.button-filled__g,
.button-stroke {
fill: transparent;
stroke: #ffffff;
}
.button-filled__g,
.button-stroke__g {
transition: stroke 0.3s;
}
.button-insta:hover .button-insta__path {
fill: #ff7beb;
}
.button-black__g {
stroke: #000000;
transition: fill 0.3s;
} .button-link:hover .figure {
stroke: #ff7beb;
fill: #ff7beb;
}
.button-cross__fill--white {
fill: #ffffff;
}
.button-cross__stroke--pink {
stroke: #ff7beb;
transition: stroke 0.3s;
}
.button-cross:hover .button-cross__stroke--pink {
stroke: #ffffff;
}
.button-link .figure {
stroke: #e5e2e2;
fill: #e5e2e2;
transition: all 0.3s;
}
.header {
padding: 115px 0 114px;
background-color: #e5e2e2;
}
.header-title {
font-size: 42px;
line-height: 51px;
max-width: 515px;
margin-top: -1px;
}
.header-title--desktop {
display: block;
}
.header-title--mobile {
display: none;
}
.header-title h1 {
position: relative;
z-index: 999999999;
}
.header-title h1,
.header-title p,
.header-title h1 a,
.header-title p a {
font-size: 42px;
line-height: 51px;
display: inline-block;
}
.header-title h1 a,
.header-title h1 a:active,
.header-title h1 a:focus,
.header-title h1 a:focus-visible,
.header-title h1 a:focus-within,
.header-title h1 a:hover,
.header-title h1 a:target,
.header-title h1 a:visited {
color: #000;
text-decoration: none;
}
.header-title p a,
.header-title p a:active,
.header-title p a:focus,
.header-title p a:focus-visible,
.header-title p a:focus-within,
.header-title p a:hover,
.header-title p a:target,
.header-title p a:visited {
color: #000;
text-decoration: none;
}
.header .button-holder {
display: flex;
justify-content: flex-end;
}
.header .button-holder .button {
position: relative;
right: -7px;
} body .header .button-holder .button.burger-closer,
body.body-active-sidebar .header .button-holder .button.burger-opener {
display: none;
}
.articles-section {
padding-bottom: 175px;
}
.articles-section__row {
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
-webkit-column-gap: 35px;
-moz-column-gap: 35px;
column-gap: 35px;
}
.content-block ul {
margin-bottom: 35px;
}
.article {
display: inline-block;
break-inside: avoid;
margin-bottom: 35px;
width: 100%;
}
.article.mb-0 {
margin-bottom: 0;
}
.article h2 {
max-width: 325px;
}
.article h3 {
font-size: 27px;
}
.article > .article,
.contact-section .article {
margin-bottom: 0;
}
.article__inner {
padding: 37px 28px 21px 33px;
position: relative;
overflow: hidden;
}
.article-linked {
text-decoration: none;
}
.article-linked:hover, .article-linked:focus-visible, .article-linked:link, .article-linked:visited, .article-linked:focus, .article-linked:active, .article-linked:focus-visible {
text-decoration: none;
}
.contact-section.black .article-linked:hover, .contact-section.black .article-linked:focus-visible, .contact-section.black .article-linked:link, .contact-section.black .article-linked:visited, .contact-section.black .article-linked:focus, .contact-section.black .article-linked:active, .contact-section.black .article-linked:focus-visible {
color: #fff;
}
.contact-section.black .article-linked:hover {
text-decoration: none;
}
.article-linked__content {
padding: 66px 0 0 12px;
display: flex;
-moz-column-gap: 10px;
column-gap: 10px;
align-items: stretch;
}
.article-linked__text {
width: calc(70% - 5px);
padding-bottom: 15px;
}
.article-linked__text p {
padding-bottom: 24px;
}
.article-linked__text p:last-child, .article-linked__text p:only-child {
padding-bottom: 0;
}
.article-linked__button {
width: calc(30% - 5px);
display: flex;
justify-content: flex-end;
align-items: flex-end;
}
.article-text__content {
padding: 65px 40px 22px 104px;
position: relative;
}
.article-text__content .article-text__inner:before {
content: "";
position: absolute;
top: 27px;
left: 12px;
width: 64px;
height: 64px;
background-image: url(//praxis-konzept.ch/wp-content/themes/praxis-theme-flake/img/icon-line-desktop-black.svg);
background-size: cover;
}
.article-image .article__inner,
.content-gallery__inner {
position: relative;
height: 0;
overflow: hidden;
padding-top: 0;
padding-bottom: 100%;
}
.article-image .article__inner img,
.person-img img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
transition: transform .3s ease;
}
.article-image .article__inner:hover img {
transform: scale(1.1);
}
.article-image .article__inner .button {
content: "";
position: absolute;
bottom: 20px;
right: 27px;
z-index: 2;
display: block;
}
.article-linked .article__inner {
padding: 37px 28px 30px 33px;
}
.article-contact .article__inner {
padding: 246px 28px 48px 46px;
}
.article-contact__content {
padding-top: 19px;
}
.article-contact__content p a,
.article-contact__content p a:active,
.article-contact__content p a:focus,
.article-contact__content p a:focus-visible,
.article-contact__content p a:focus-within,
.article-contact__content p a:target,
.article-contact__content p a:visited {
color: #000;
text-decoration: none;
}
.article-contact__content p a:hover {
text-decoration: underline;
}
.navbar h2 a,
.navbar h2 a:hover,
.navbar ul li a {
text-decoration: none;
color: #000;
}
.footer {
background-color: #fff;
padding: 19px 0 62px;
}
.footer-content {
display: flex;
justify-content: flex-start;
-moz-column-gap: 35px;
column-gap: 35px;
font-size: 14px;
line-height: 27px;
color: #9b9b9b;
}
.footer-content__column {
width: calc(50% - 18px);
padding-left: 46px;
}
.footer-content__wrapper {
display: flex;
align-items: center;
}
.footer-content__wrapper ul {
display: flex;
align-items: center;
}
.footer-content__wrapper ul li {
padding-left: 11px;
position: relative;
}
.footer-content__wrapper ul li:before {
content: "/";
position: absolute;
left: 3px;
top: 50%;
transform: translateY(-50%);
font-size: 12px;
line-height: 1;
}
.footer-content__wrapper ul a {
color: inherit;
text-decoration: none;
}
.footer-content__wrapper ul a:hover {
text-decoration: underline;
}
.footer-content__wrapper ul a:focus,
.footer-content__wrapper ul a:focus-visible,
.footer-content__wrapper ul a:focus-within,
.footer-content__wrapper ul a:target,
.footer-content__wrapper ul a:visited {
color: inherit;
text-decoration: none;
}
.navbar {
position: fixed;
left: 0;
top: 0;
width: 100%;
z-index: 10000;
height: auto;
min-height: 100vh;
display: none;
pointer-events: none;
}
.navbar-wrapper {
position: relative;
}
.navbar-overlay {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1;
background-color: #e5e2e2;
opacity: 90%;
}
.map-holder,
.person-img {
position: relative;
overflow: hidden;
}
.navbar-inner {
width: 70.42%;
background-color: #ffc7c7;
padding: 110px 10px 10px 18.4%;
transition: transform 0.3s;
height: 100%;
position: absolute;
z-index: 2;
left: 0;
top: 0;
}
.navbar-fly {
position: relative;
top: 0;
left: 0;
width: 100%;
min-height: 100vh;
z-index: 3;
padding-top: 382px;
transition: transform 0.3s;
}
.navbar-fly, 
.navbar-fly .container, 
.navbar-fly ul {
pointer-events: none;
}
.navbar-fly ul li, 
.navbar-fly ul li a {
pointer-events: auto;
}
.navbar h2 {
font-size: 42px;
line-height: 51px;
padding-bottom: 377px;
opacity: 0;
pointer-events: none;
}
.navbar h2 a:active,
.navbar h2 a:focus,
.navbar h2 a:focus-visible,
.navbar h2 a:focus-within,
.navbar h2 a:target,
.navbar h2 a:visited {
text-decoration: none;
color: #000;
}
.navbar ul {
font-size: 55px;
line-height: 66px;
display: flex;
flex-direction: column;
align-items: start;
}
.navbar ul li {
padding-bottom: 21px;
display: inline-block;
position: relative;
z-index: 15;
}
.navbar ul li a:active,
.navbar ul li a:focus,
.navbar ul li a:focus-visible,
.navbar ul li a:focus-within,
.navbar ul li a:target,
.navbar ul li a:visited {
text-decoration: none;
color: #000;
}
.navbar ul li a:hover,
.navbar ul li.current_page_item a,
.navbar ul li.current-menu-item a {
text-decoration: underline;
color: #000;
}
.body-active-sidebar .navbar { position: fixed;
top: 0;
left: 0;
right: 0;
height: 100vh;
overflow: auto;
pointer-events: auto;
display: block;
}
.content-section.persons-section {
padding-bottom: 104px;
}
section.pb-0 {
padding-bottom: 0;
}
.content-row,
.persons-row {
flex-wrap: wrap;
display: flex;
}
.persons-block {
width: 100%;
max-width: 797px;
}
.persons-block h2 {
font-size: 55px;
line-height: 70px;
}
.persons-row {
-moz-column-gap: 35px;
column-gap: 35px;
padding-top: 26px;
}
.person {
width: calc(50% - 18px);
padding-bottom: 76px;
}
.person-img {
height: 0;
padding-bottom: 100%;
margin-bottom: 29px;
}
.person h3 {
font-size: 27px;
line-height: 35px;
}
.person p a,
.person p a:active,
.person p a:focus,
.person p a:focus-visible,
.person p a:focus-within,
.person p a:target,
.person p a:visited {
color: #000;
text-decoration: none;
}
.person p a:hover,
.post-content.post-content--contacts ul a:hover {
text-decoration: underline;
}
.person p a:hover {
color: #000;
} .contact-row {
display: flex;
-moz-column-gap: 35px;
column-gap: 35px;
justify-content: flex-start;
align-items: stretch;
flex-wrap: wrap;
}
.contact-column,
.content-column {
width: calc(50% - 18px);
}
.map-block {
width: 100%;
max-width: 798px;
}
.map-holder {
height: 0;
padding-bottom: 100%;
margin-top: 170px;
margin-bottom: 28px;
}
.map-holder img,
.map-holder > * {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.content-section {
background-color: #fff;
flex-grow: 2;
padding-top: 59px;
padding-bottom: 148px;
}
.content-section.content-section--post {
padding-bottom: 35px;
}
.button-back {
margin-right: 22px;
margin-bottom: 55px;
}
.content-block h2 {
font-size: 55px;
line-height: 70px;
margin-bottom: 20px;
}
.content-block.content-block--post {
padding-top: 95px;
}
.header-content {
display: flex;
justify-content: space-between;
}
.contact__list,
.post-content.post-content--contacts ul {
margin-top: 69px;
}
.post-content.post-content--contacts ul a {
text-decoration: none;
color: #000;
}
.content-section.content-section--post .content-block h2 {
line-height: 1.18;
margin-bottom: 33px;
}
.content-section.content-section--post .post-content p {
line-height: 1.48;
}
.content-section.content-section--post .post-content {
margin-bottom: 54px;
}
.content-row {
-moz-column-gap: 35px;
column-gap: 35px;
}
.post-content .wp-block-gallery.wp-block-gallery-1,
.content-gallery {
display: flex;
-moz-column-gap: 35px;
column-gap: 35px;
row-gap: 35px;
flex-wrap: wrap; }
.content-gallery__item,
.post-content .wp-block-gallery.has-nested-images.content-gallery figure.wp-block-image:not(#individual-image) {
width: calc(50% - 18px);
max-width: calc(50% - 18px);
}
.content-gallery__inner img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.content-gallery__inner video {
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
width: 100%;
height: auto;
} .content-buttons .nav-links {
display: flex;
align-items: center;
-moz-column-gap: 70px;
column-gap: 70px;
}
.content-buttons__holder { display: flex;
justify-content: flex-end;
}
strong, b {
font-family: Inter-Bold, sans-serif;
}
@media (min-width: 768px) {
.post-content p {
max-width: calc(50% - 18px);
} }
@media (max-width: 991px) {
body {
font-size: 21px;
line-height: 1.24;
}
h2 {
font-size: 140px;
line-height: 120px;
}
.container {
padding: 0;
}
.header {
padding: 60px 20px 117px 30px;
}
.header-title {
font-size: 21px;
line-height: 25px;
padding-top: 19px;
padding-right: 20px;
max-width: 280px;
}
.header-title h1,
.header-title p,
.header-title h1 a,
.header-title p a {
font-size: 21px;
line-height: 25px;
display: inline-block;
}
.articles-section__row,
.footer-content {
-moz-column-gap: 16px;
column-gap: 16px;
}
.article {
margin-bottom: 16px;
}
.article h3 {
font-size: 21px;
line-height: 25px;
}
.article__inner {
padding: 26px 20px 21px;
}
.article-text__content {
padding: 65px 21px 8px 95px;
-webkit-hyphens: auto;
hyphens: auto;
word-wrap: break-word;
}
.article-text__content :before {
width: 59px;
height: 59px;
}
.article-image .article__inner .button {
bottom: 30px;
right: 20px;
}
.article-contact .article__inner {
padding: 233px 28px 33px 25px;
}
.footer-content__column {
padding-left: 25px;
width: calc(50% - 8px);
}
.persons-section {
padding-top: 67px;
padding-bottom: 0;
}
.persons-row {
padding-top: 18px;
}
.persons-block h2 {
font-size: 33px;
line-height: 40px;
padding: 0 28.5px;
}
.person {
padding-bottom: 130px;
}
.person-img {
margin-bottom: 24px;
}
.person h3 {
font-size: 21px;
line-height: 26px;
padding: 0 26px;
}
.person p {
padding: 0 26px;
}
.content-block {
padding: 0 29px;
}
.post-content p {
padding-left: 29px;
padding-right: 29px;
}
.post-content.post-content--contacts ul {
margin-top: 52px;
padding-left: 29px;
padding-right: 29px;
}
.navigation.post-navigation {
padding-right: 20px;
}
.content-buttons .nav-links {
column-gap: 22px;
}
.content-section.content-section--post .post-content {
margin-bottom: 78px;
}
.content-section.content-section--post {
padding-top: 29px;
padding-bottom: 31px;
}
.navbar ul {
font-size: 33px;
line-height: 66px;
}
.navbar ul li {
padding-bottom: 4px;
}
.navbar-fly {
padding-left: 28px;
padding-top: 249px;
}
}
@media (max-width: 767px) {
.articles-section {
padding-bottom: 0;
}
.articles-section__row {
display: flex;
flex-direction: column;
-moz-column-gap: 0;
column-gap: 0;
}
.article,
.content-column:last-child,
.content-gallery__item:last-child {
margin-bottom: 0;
}
.article.t-d-n {
display: none;
}
.article-000 {
order: -14;
}
.article-006 {
order: -13;
}
.article-001 {
order: -12;
}
.article-002 {
order: -11;
}
.article-007 {
order: -10;
}
.article-008 {
order: -9;
}
.article-003 {
order: -8;
}
.article-004 {
order: -7;
}
.article-009 {
order: -6;
}
.article-010 {
order: -5;
}
.article-0044 {
order: -4;
}
.article-011 {
order: -3;
}
.article-0101 {
order: -2;
}
.article-012 {
order: -1;
}
.footer {
padding: 15px 0 40px;
}
.contact-row,
.content-row,
.footer-content,
.persons-row {
-moz-column-gap: 0;
column-gap: 0;
}
.contact-column,
.footer-content__column,
.person {
width: 100%;
}
.navbar-inner {
padding-left: 20px;
}
.contact-section {
padding-bottom: 0;
}
.content-section {
padding-top: 67px;
padding-bottom: 76px;
}
.page-template-template-contacts .content-section {
padding-bottom: 0;
}
.content-block h2 {
font-size: 33px;
line-height: 40px;
margin-bottom: 11px;
}
.content-block ul {
margin-bottom: 26px;
}
.content-column {
width: 100%;
margin-bottom: 26px;
}
.post-content .wp-block-gallery.wp-block-gallery-1 {
-moz-column-gap: 0;
column-gap: 0;
row-gap: 0;
}
.content-gallery {
-moz-column-gap: 0;
column-gap: 0;
}
.content-gallery__item,
.post-content .wp-block-gallery.has-nested-images.content-gallery figure.wp-block-image:not(#individual-image) {
width: 100%;
max-width: 100%;
}
.content-buttons {
right: 29px;
top: -81px;
}
.contact__list {
margin-top: 53px;
}
.button-back {
margin-right: 49px;
margin-bottom: 24px;
}
.content-block.content-block--post {
padding-top: 75px;
}
.content-section.content-section--post .content-block h2 {
margin-bottom: 30px;
}
.content-section.content-section--post .post-content p {
line-height: 1.23;
}
.map-holder {
margin-top: 73px;
margin-bottom: 0;
}
.article-linked__text {
padding-bottom: 0;
}
.header-title--desktop {
display: none;
}
.header-title--mobile {
display: block;
}
}
@media (max-width: 430px) {
.burger.burger-opener.button.button-filled svg,
.burger.burger-closer.button.button-cross svg {
width: 60px !important;
height: 60px !important;
}
.header-title h1, .header-title p, .header-title h1 a, .header-title p a {
font-size: 16px;
line-height: 19px;
}
.header-title {
max-width: 230px;
}
}