/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Apr 26 2026 | 18:26:27 */
/* ===========================================
            Fonts
=========================================== */
@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&family=Dancing+Script:wght@400..700&display=swap');

@font-face {
    font-family: 'Hearts';
    src: url('https://mimyselfandai.nl/wp-content/themes/assets/fonts/HF.otf');
}

.chakra-petch-light {
  font-family: "Chakra Petch", serif;
  font-weight: 300;
  font-style: normal;
}
.chakra-petch-regular {
  font-family: "Chakra Petch", serif;
  font-weight: 400;
  font-style: normal;
}
.chakra-petch-medium {
  font-family: "Chakra Petch", serif;
  font-weight: 500;
  font-style: normal;
}
.chakra-petch-semibold {
  font-family: "Chakra Petch", serif;
  font-weight: 600;
  font-style: normal;
}
.chakra-petch-bold {
  font-family: "Chakra Petch", serif;
  font-weight: 700;
  font-style: normal;
}
.chakra-petch-light-italic {
  font-family: "Chakra Petch", serif;
  font-weight: 300;
  font-style: italic;
}
.chakra-petch-regular-italic {
  font-family: "Chakra Petch", serif;
  font-weight: 400;
  font-style: italic;
}
.chakra-petch-medium-italic {
  font-family: "Chakra Petch", serif;
  font-weight: 500;
  font-style: italic;
}
.chakra-petch-semibold-italic {
  font-family: "Chakra Petch", serif;
  font-weight: 600;
  font-style: italic;
}
.chakra-petch-bold-italic {
  font-family: "Chakra Petch", serif;
  font-weight: 700;
  font-style: italic;
}
.chakra-petch-light {
  font-family: "Chakra Petch", serif;
  font-weight: 300;
  font-style: normal;
}
.chakra-petch-regular {
  font-family: "Chakra Petch", serif;
  font-weight: 400;
  font-style: normal;
}
.chakra-petch-medium {
  font-family: "Chakra Petch", serif;
  font-weight: 500;
  font-style: normal;
}
.chakra-petch-semibold {
  font-family: "Chakra Petch", serif;
  font-weight: 600;
  font-style: normal;
}
.chakra-petch-bold {
  font-family: "Chakra Petch", serif;
  font-weight: 700;
  font-style: normal;
}
.chakra-petch-light-italic {
  font-family: "Chakra Petch", serif;
  font-weight: 300;
  font-style: italic;
}
.chakra-petch-regular-italic {
  font-family: "Chakra Petch", serif;
  font-weight: 400;
  font-style: italic;
}
.chakra-petch-medium-italic {
  font-family: "Chakra Petch", serif;
  font-weight: 500;
  font-style: italic;
}
.chakra-petch-semibold-italic {
  font-family: "Chakra Petch", serif;
  font-weight: 600;
  font-style: italic;
}
.chakra-petch-bold-italic {
  font-family: "Chakra Petch", serif;
  font-weight: 700;
  font-style: italic;
}

h1, h2, h3, h4, h5, h6, h7, h8, h9{
  font-family: "Hearts";
}
body{
  font-family: "Chakra Petch", serif;
  font-weight: 400;
  font-style: normal;
}
div.site-branding{
  font-family: "Dancing Script", serif;
}
/* ===========================================
            Scrollbar
=========================================== */
html{
  --scrollbarBG:rgba(255,255,255,1);
  --thumbBG:rgba(151,107,185,.9);
  scrollbar-color:rgba(151,107,185,.9) rgba(255,255,255,1);
  scrollbar-width:thin;
  scroll-behavior:smooth;
}
body::-webkit-scrollbar,
textarea::-webkit-scrollbar{
  width:11px;
}
body::-webkit-scrollbar-track,
textarea::-webkit-scrollbar-track{
  background:var(--scrollbarBG);
}
body::-webkit-scrollbar-thumb,
textarea::-webkit-scrollbar-thumb{
  background-color:var(--thumbBG) ;
  border-radius:6px;
  border:3px solid var(--scrollbarBG);
}
/* ===========================================
            Layout
=========================================== */
div .homepageimg{
  text-align: center !important; 
}
span.site-logo a{
  display: none!important;
  width: 0px !important;
  box-sizing: content-box;
}
div.site-title{
  text-shadow:-1px 1px 3px #000;
}
body.custom-background {
  background: linear-gradient(to top, #976bb9, #d5c3e3, #FFF)!important;
}
.dfield, .fapp{
  z-index:1!important;
}
.wp-block-file__button{
  padding: 5px 10px;
  font-weight: bold;
  background-color:#976BB9;
  color: #FFF !important;
  transition: all .15s ease-in-out;
  border: 1px solid #976BB9;
}
.wp-block-file__button:hover{
  color: #000 !important;
  background-color: #d5c3e3 !important;
  border: 1px solid #976BB9;
}
nav{
  width:100%;
}
ul#menu-main{
  width: 100%;
  display: block;
  background: linear-gradient(to right, rgba(0, 0, 0, .9), rgba(0, 0, 0, .02))!important;
}
ul#menu-main li.menu-item a{
  color:#000 !important;
  display:inline-block;
  font-family: "Chakra Petch", serif;
  font-style:normal;
  text-align:center;
  text-decoration:none;
  font-weight:600;
  font-size:14px!important;
  text-transform:uppercase;
  text-align: center;
  padding:2px 30px;
  z-index:999!important;
  margin: 2px;
  cursor:pointer;
  background:#d5c3e3 !important;
  border:1px #976BB9 solid;
  /*border-radius:5px;*/
  transition:all .15s ease-in-out;
  align-content:center;
  line-height: 35px;
  box-shadow:0px 5px 8px rgba(0,0,0,0.6);
}
ul#menu-main li.menu-item a:hover{
  color:#FFF !important;
  background:#976BB9 !important;
  border:1px #d5c3e3 solid;
  text-decoration:none;
  box-shadow:0px 1px 3px rgba(0,0,0,0.6);
}
ul .sub-menu li{
  background: rgba(0, 0, 0, 0) !important; 
}
div#content, .thumbnail-post-content, div.article article.post, div.widget_block, div.postauthor, div#commentsAdd{
  border-radius: 10px !important;
}
div#content header:after, div.article span.entry-meta:after, div.postauthor h4:after, div#respond h4:after, hr{
  height: 33px;
  width: 250px;
  margin: 15px auto 10px auto;
  background-image: url('https://mimyselfandai.nl/wp-content/themes/assets/img/border.png')!important;
  background: transparent;
}
#fbuilder{
  z-index: 998!important;
}
/* ===========================================
            Contactforms
=========================================== */
span.wpcf7-list-item {
  display: block;
  text-align: left;
}
input[type=checkbox] {
  width: auto
}
textarea{
    resize:none;
    font-size:18px;
    padding:5px;
    color:#976BB9;
    vertical-align:middle;
    background:#FFF;
    border:1px solid rgba(151,107,185,.9) !important;
    -webkit-transition:all 0.25s ease-in-out;
    -moz-transition:all 0.25s ease-in-out;
    transition:all 0.25s ease-in-out;
    font-family:"Chakra Petch", serif !important;
    border-radius:5px;
    width:90% !important;
}
input{
    font-size:18px;
    padding:5px;
    color:#976BB9;
    border:1px solid rgba(151,107,185,.9) !important;
    vertical-align:middle;
    background:#FFF;
    -webkit-transition:all 0.25s ease-in-out;
    -moz-transition:all 0.25s ease-in-out;
    transition:all 0.25s ease-in-out;
    font-family:"Chakra Petch", serif;
    border-radius:5px
}
input:active,
input:focus,
[type=text]:active,
[type=text]:focus{
  color:#3C2A4A !important;
  cursor:text;
  background:#D5C3E3 !important;
  outline:0;
}
textarea:active,
textarea:focus,
input[type=number]:active,
input[type=number]:focus{
  cursor:text;
  background:#D5C3E3 !important;
  border:1px solid rgba(151,107,185,.9) !important;
  color:#3C2A4A !important;
  outline:0}
input[type=text],
input[type=email],
input[type=tel],
input[type=url],
input[type=number],
textarea{
    width:85%;
    background:#FFF;
}
input[type=text]:hover,
input[type=email]:hover,
input[type=tel]:hover,
input[type=url]:hover,
input[type=number]:hover,
textarea:hover{
    border:1px solid rgba(151,107,185,.9) !important;
}
input[type=submit]{
    width:250px;
    font-style:normal;
    font-size:14px;
    text-align:center;
    text-transform:uppercase;
    text-decoration:none;
    font-weight:bold;
    color:#FFF;
    text-shadow:1px 1px 1px rgba(0,0,0,0.5) !important;
    padding:10px 25px;
    z-index:20;
    display:inline-block;
    cursor:pointer;
    background:#976BB9 !important;
    border:1px rgba(151,107,185,.9) solid;
    border-radius:5px;
    box-shadow:0px 5px 8px rgba(0,0,0,0.6);
    transition:all .15s ease-in-out;
    align-content:center;
}
input[type=submit]:hover{
    color:#000;
    background:#d5c3e3 !important;
    text-decoration:none;
    box-shadow:0px 1px 3px rgba(0,0,0,0.6);
}
form#search-form{
    left:0;
    right:0;
}
input[type=number]{
    font-size:18px;
    padding:10px;
    color:#976BB9;
    border:1px solid rgba(151,107,185,.9) !important;
    vertical-align:middle;
    background:#FFF;
    -webkit-transition:all 0.25s ease-in-out;
    -moz-transition:all 0.25s ease-in-out;
    transition:all 0.25s ease-in-out;
    font-family:"Chakra Petch", serif !important;
    border-radius:5px;
    width:85%;
}
select{
    font-size:18px;
    padding:10px;
    color:#976BB9;
    border:1px solid rgba(151,107,185,.9) !important;
    vertical-align:middle;
    background:#FFF;
    -webkit-transition:all 0.25s ease-in-out;
    -moz-transition:all 0.25s ease-in-out;
    transition:all 0.25s ease-in-out;
    font-family:"Chakra Petch", serif !important;
    border-radius:5px;
    width:88%;
}
button.wp-block-search__button[type=submit]{
    width:80px;
    font-style:normal;
    font-size:13px;
    text-align:center;
    text-transform:uppercase;
    text-decoration:none;
    font-weight:bold;
    color:#FFF;
    text-shadow:1px 1px 1px rgba(0,0,0,0.5) !important;
    padding:10px 5px;
    z-index:20;
    display:inline-block;
    cursor:pointer;
    background:#976BB9 !important;
    border:1px rgba(151,107,185,.9) solid;
    border-radius:5px;
    transition:all .15s ease-in-out;
    align-content:center; 
}
button.wp-block-search__button[type=submit]:hover{
    color:#000;
    background:#d5c3e3 !important;
    text-decoration:none;
}

input[type=checkbox]{
  border-radius: 5px;
  border: solid 1px #976BB9;
}
input[type=checkbox]:checked{
  background:#976BB9;
  border: solid 1px #d5c3e3;
}
/* ===========================================
            Contact Form 7
=========================================== */
.wpcf7{
    width:100%;
    margin:0 auto;
}
.wpcf7-form{
    font-size:14px;
    font-size:0.875rem;
    margin-bottom:20px;
}
.wpcf7-form p{
    margin-bottom:15px;
}
.wpcf7-text{
    padding:10px;
}
.wpcf7-textarea{
    width:85%;
    padding:10px;
}
div.wpcf7-response-output{
    margin:20px 0 15px;
}
/* ===========================================
            Media queries
=========================================== */
@media screen and (max-width: 720px) {
  ul #menu-main a, ul #menu-main li a{
    font-weight: 400;
    text-shadow: none;
    color:#000;
  }
  input[type=submit]{
    width: 100%;
  }
}