header,
footer,
main,
.editor-styles-wrapper .is-root-container {
& h1,
h2,
h3,
h4,
h5,
h6 { text-wrap-style: balance;
&:first-child {
margin-top: 0;
}
}
& .wp-block-heading {
margin-top: 0.5em;
}
& p {
margin-top: 0.5em;
} & iframe,.wp-block-group.has-background,.has-background.wp-block-column,.has-background.wp-block-media-text,.has-background.wp-block-group, .wp-block-columns.has-background {
border-radius:  0.5em;
}
& :not(.wp-block-embed__wrapper)>iframe {
position:relative;
display:block;
} & .wp-block-separator {
width: 100px;
margin: .5rem auto;
}
& .wp-block-spacer {
max-height: auto;
}
& ul:has(> [class*="icon-"]){
list-style-type: none;
padding: 0;
} & [class*="arrow-after"] {  
& a{
text-decoration:none;
font-weight:500;
&:hover{
text-decoration: underline;                                  
}
}
&:after {
content:"";      
position: absolute;       
width:1em;
height:1em;  
padding-left:0;  
background-position: center right;
background-repeat: no-repeat;   
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-arrow.svg); 
}
}
& .wp-block-group{
height: 100%;
} & .wp-block-gallery.has-nested-images:not(.is-cropped) figure.wp-block-image:not(#individual-image) {
margin-bottom: auto; 
margin-top: auto; 
}
&>figure img{
border-radius: 0.5em;
} & [class*="icon-"] {
padding-left: 1.5em;
background-position: top left;
background-repeat: no-repeat;
background-size: 0.825em;
&.icon-lock {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-lock.svg);
}    
&.icon-shield {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-shield.svg);
}    
&.icon-signage {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-signage.svg);
}    
&.icon-transfer {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-transfer.svg);
}
&.icon-authentiek {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-authentiek.svg);
}
&.icon-digitaal {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-digitaal.svg);
}
&.icon-duimpje {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-duimpje.svg);
}
&.icon-duurzaam {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-duurzaam.svg);
}
&.icon-efficient {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-efficient.svg);
}
&.icon-goedkoop {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-goedkoop.svg);
}
&.icon-handtekening {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-handtekening.svg);
}
&.icon-goedkoop {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-goedkoop.svg);
}
&.icon-links {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-links.svg);
}
&.icon-makkelijk {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-makkelijk.svg);
}
&.icon-pijlen {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-pijlen.svg);
}
&.icon-rechtsgeldig {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-rechtsgeldig.svg);
}
&.icon-slotje {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-slotje.svg);
}
&.icon-bewijslast {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-bewijslast.svg);
}
&.icon-rechts {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-rechts.svg);
}
&.icon-schild {
background-image: url(//www.aangetekendmailen.nl/wp-content/themes/aangetekend/images/icon-schild.svg);
}
}
.wp-block-rank-math-toc-block {
h2 {
color: var(--wp--preset--color--blauw);
}
&>nav>ul {
margin-left: 0;
padding-left: 0;
list-style-type: none;
&>li {
margin-bottom: .5em;
& ul {
font-size: 0.95em;
list-style-type: square;
& li {
margin-top: .3em;
}
}
}
}
} & .wp-block-group.has-background:not([style*="radius"]) {
position: relative;
background-image: linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(255, 255, 255) 100%);
z-index: 5;
&::before {
content: "";
position: absolute;
top: 150px;
left: 0;
background-color: inherit;
border-radius: 100px;
width: calc(100% + 100px);
height: calc(100% + 50px);
transform: perspective(50px) rotateY(0.8deg) translateX(-100px);
pointer-events: none;
}
&.is-content-justification-right {
&::before {
content: "";
position: absolute;
top: 150px;
right: 0;
background-color: inherit;
border-radius: 100px;
width: calc(100% + 100px);
height: calc(100% + 50px);
transform: perspective(50px) rotateY(-0.8deg) translateX(100px);
pointer-events: none;
}
}
&.wp-block-group-is-layout-constrained>* {
padding-inline: 12px 24px;
}
}
&:has(.is-selected) .wp-block-group.has-background:not(:has(.is-selected), .is-selected)::before {
opacity: 0.6;
}
& .wp-block-image.aligncenter>figcaption {
display: block;
font-size: var(--wp--preset--font-size--x-small);
font-weight: 300;
} .wp-block-media-text.is-image-fill-element,
.wp-block-media-text.is-image-fill {
& .wp-block-media-text__media {
height: auto;
position: relative;
display: block;
aspect-ratio: 1 / 1;
border-radius: clamp(16px, 5vw, 32px);
transform-origin: left;
transform: perspective(80px) rotateY(5deg) scaleY(1) scaleX(1);
transition: ease-out 1s; &.in-view {
transform: perspective(100px) rotateY(5deg) scaleY(1) scaleX(1);
} &.editor-media-container__resizer {
transform: perspective(100px) rotateY(5deg) scaleY(1) scaleX(1);
}
}
&.has-media-on-the-right .wp-block-media-text__media {
transform-origin: right;
transform: perspective(80px) rotateY(-5deg) scaleY(1) scaleX(1); &.in-view {
transform: perspective(100px) rotateY(-5deg) scaleY(1) scaleX(1);
} &.editor-media-container__resizer {
transform: perspective(100px) rotateY(-5deg) scaleY(1) scaleX(1);
}
}
& .wp-block-media-text__content {
padding: 16px 0;
}
}
.wp-block-media-text:not(.is-image-fill, .has-media-on-the-right).has-background img {
border-radius:0.5em 0 0 0.5em;
}
.wp-block-media-text:not(.is-image-fill).has-media-on-the-right.has-background img {
border-radius:0 0.5em 0.5em 0;
} .wp-block-media-text.is-image-fill-element figure img {
border-radius:1.5em;
}
.archive-block{
display: grid;
grid-template-columns: 1fr;
gap: 1em;
margin-bottom:2em;
& .item {
position: relative;
display: grid;
grid-template-columns: 1fr 3fr;    
text-decoration: none!important;   
border-radius:10px;       
& .image{
aspect-ratio: 1 /1;
border-radius:10px;
overflow:hidden;        
}
& img {
width: 100%;
height: auto;
aspect-ratio: 1 /1; 
object-fit: cover;            
transition: transform .2s;         
}
&.post-type-partners .image img{
object-fit: contain; 
padding:0.5em;   
}
& .content {
display:flex;
flex-direction: column;
padding:0.5em 1em;
&>*{
margin:0;
}
& date{
font-size: var(--wp--preset--font-size--x-small);
font-weight: 300;          
}
& h4{
color: var(--wp--preset--color--blauw);
}
}        
}
}
& .gform_required_legend{
display:none;
}
& .gform_validation_errors {
& .gform-icon{
padding-left: 0;
}
}
& .wp-block-columns.animate-on-hover{
& .wp-block-column{
padding:1em;
border-radius: 0;               
&:first-child{
border-radius: 8px 0 0 8px;
}
&:last-child{
border-radius: 0 8px 8px 0;
}
&:hover{
text-decoration: none;
border-radius: 10px;                
border-right: 4px rgba(0,0,0,0.1) solid;
transform: scale(1.05);
z-index: 5;
transition: all 0.2s ease-out;
}
}
}
} @media screen and (max-width: 600px) {
main,
.editor-styles-wrapper .is-root-container {
overflow:hidden;
& .wp-block-spacer{
max-height: 30px;
}
& .wp-block-button {
width: 100%;
max-width: 480px;
& a.wp-block-button__link {
width: 100%;
max-width: 480px;
}
}
&>.wp-block-media-text:first-child figure {
display: none;
}
& .wp-block-columns:has(.wp-block-column:nth-child(2) .wp-block-image:only-child) {
flex-direction: column-reverse;
margin-inline: 0;
}
& .wp-block-media-text.is-image-fill {
margin-inline: auto;
& .wp-block-media-text__media {
border-radius: 0 !important;
transform: perspective(200px) rotateY(3deg) scaleX(1) scaleY(0.9)!important; 
transform-origin: top right !important; 
}    
& .wp-block-media-text__content {
padding: 1em;
}
}
.wp-block-media-text>.wp-block-media-text__content {
padding: 16px 12px;
}
& .wp-block-group.has-background:not([style*="radius"]) {   
&::before {
content: "";
position: absolute;
top: -16px;
left: 0;
background-color: inherit;
border-radius: 0;
width: 100vw;             
transform: none;
pointer-events: none;
}
}
}
}
@media screen and (min-width: 920px) {
main,
.editor-styles-wrapper .is-root-container {
.archive-block{
grid-template-columns: 1fr 1fr 1fr;
margin-bottom:2em;
& .item {
grid-template-columns: 1fr;            
& .image{  
border-radius:10px 10px 0 0!important;
aspect-ratio: 486 / 288;     
& img{
aspect-ratio: 486 / 288;   
}      
}            
& .content {
padding:2em;
& h4 {
font-size: var(--wp--preset--font-size--large)!important;
}
}   
& .image{
border-radius:10px;
overflow:hidden;        
}
& img {
width: 100%;
height: auto;
aspect-ratio: 1 /1; 
object-fit: cover;            
transition: transform .2s;         
}
& .content {
display:flex;
flex-direction: column;
padding:0.5em 1em;
&>*{
margin:0;
}
& date{
font-size: var(--wp--preset--font-size--x-small);
font-weight: 300;          
}
}        
}
& .item {
&:hover .image {
& img{             
transform: scale(1.05);               
}   
}
}
}
}
}