/*
Theme Name: Chaplin Child
Template: chaplin
Version: 2.6.7
Aanpassingen: https://www.wordpress-design.nl
------------------------------ */

/* COLORS
#1e2833 donkerblauw 
#a3adc8 lichtblauw 
#ed1b2f rood
*/

/* SCROLLING TEXT BANNER */

/*
@media screen and (max-width: 668px /*788px*/) {
     .coblocks-column-row-123202312447 {
          display: none;
     }
}
*/

body {
	background: #a3adc8 !important;
	color: #1e2833 !important;
}

/* WEBFONT */

@font-face {
  font-family: 'MonaSans';
  src:
    url('https://hetburgercomite.nl/wp-content/themes/chaplin-child/fonts/MonaSans.woff2') format('woff2 supports variations'),
    url('https://hetburgercomite.nl/wp-content/chaplin-child/fonts/MonaSans.woff2') format('woff2-variations');
  font-weight: 200 900;
  font-stretch: 75% 125%;
}

body,
p,
h1,h2,h3,h4,h5,h6 {
font-family: 'MonaSans';
font-feature-settings: "ss01" on, "ss03" on, "ss05" on; 
}

h1 {
  font-weight: 500;
  font-stretch: 125%;	
}

p {
  font-weight: 500;
  font-stretch: 125%;
  letter-spacing:1px;
}



/* SCROLLING TEXT */

.scrolling_text {
    margin-top: -3em;
    width: 100%;
    overflow: hidden;
    display: flex;
    white-space: nowrap;
    background: transparent;
    padding-top: 13px;
    padding-bottom: 10px;
    border-top: 3px #1e2833 solid;
    border-bottom: 3px #1e2833 solid;
}

.text span {
    font-family: 'MonaSans';
    margin: 0 20px;
    font-weight: normal;
}

@keyframes animate_text {
    from {
      transform: translate3d(0, 0, 0);
    }
    to {
      transform: translate3d(-100%, 0, 0);
    }
}

.text {
    font-family: 'MonaSans';
    font-size: 20px;
    font-weight: normal;
    text-transform: uppercase;
    color: #1e2833;
    letter-spacing: 0.2em;
    animation: animate_text 30s linear infinite !important; 
   }
/* EINDE SCROLLING TEXT */





/* STYLE */

html {
	font-size: 62.5%; /* 1rem = 10px */
}

body { 
     font-family: 'MonaSans' !important;
     font-weight: normal !important;
	font-size: 1.7rem;
	color: #61456a;
	scrollbar-gutter: stable;
}

h1, h2, h3, h4, h5, h6, h1.entry-title {
     font-family: 'MonaSans' !important;
	font-feature-settings: "lnum";
	font-variant-numeric: lining-nums;
	font-weight: normal !important;
	line-height: 1.25;
	margin: 4rem 0 2.5rem;
}

h2, .heading-size-2 { font-weight: normal; font-size: 4.2rem; } /* 2.8 */ 
h3, .heading-size-3 { font-weight: normal; font-size: 3.0rem; } /* 2.4 */

/* Font Sizes in Entry Content -------------------------------- */
:root .has-small-font-size    { font-size: .842em; }
:root .has-regular-font-size,
:root .has-normal-font-size   { font-size: 1em; }
:root .has-medium-font-size   { font-size: 1.1em; }
:root .has-large-font-size    { font-size: 1.25em; }
:root .has-larger-font-size   { font-size: 1.5em; }

a.post-edit-link {
	display: none;
}


/* SITE-HEADER */

#site-header {
	text-align: center;
}

.header-inner {
	max-height: 7rem;
}

.header-inner .section-inner {
	max-height: 7.4rem;
}

@media ( max-width: 700px ) {
     .header-inner {
          margin-top: 2rem !important;
     }
}

.cover-header .entry-header {
	text-align: center;
}

.site-logo .custom-logo img {
     margin-right: 2rem;
	min-height: 4rem;
	margin-left: -2.6rem !important;
     animation-name: spin !important;
     animation-duration: 15000ms !important;
     animation-iteration-count: infinite !important;
     animation-timing-function: linear !important;
}

@keyframes spin {
     from {
         transform:rotate(360deg);
     }
     to {
          transform:rotate(0deg);
     }
}


/* CONTENT */

.header-titles {
     margin-left: 0rem !important;
}

.entry-title {
     text-align: center ;
}

p {
	font-family: 'MonaSans';
}

.entry-content p {
	font-family: 'MonaSans';
	font-size: 2.1rem;
}	

.post-2 h1.entry-title {
	display: none;
}

.post-2 h2.welkombij {
     margin-top: 6rem;
}

.footer-copyright {
     display: none; 
}

/* SHAPE DIVIDERS */

.is-style-waves svg {
     fill: #61456a; 
}

.is-style-waves .wp-block-coblocks-shape-divider__alt-wrapper {
     margin-top: -1px;
     background-color: #61456a;
}

/* To The Content ---------------------------- */

.to-the-content-wrapper {
	margin-top: 2.5rem;
}

.to-the-content {
	align-items: center;
	display: flex;
	text-decoration: none;
}

.to-the-content .icon {
     transition: transform 330ms ease-in-out !important;
	margin-left: auto;
	margin-right: auto;
}

.to-the-content .icon svg {
	height: 6rem !important; /* was 3.2 */
	width: 6rem !important; /* was 3.2 */	
	color: #61456a;
}

.to-the-content:hover .icon { 
	transform: scale( 1.4 );
}

.to-the-content .text {
	display: none;
}


/* MENU */

.home .header-navigation-wrapper {
     background: rgba(235,221,200,0.5);
     padding-right: 20px;
     padding-left: 5px;
     border-radius: 5px;
     max-height: 63px;
	border: 0px white solid;
}

.header-navigation-wrapper {
     background: none;
}

.main-menu-alt-container {
      margin-left: 15px;
}

.menu-item a {
     font-family: 'MonaSans';
     color: #61456a;
     font-weight: normal;
     display: inline;
     position: relative;
     overflow: hidden;
     text-decoration: none !important;
     text-transform: uppercase;
     font-size: 1.8rem;
}

@media (max-width: 1200px) {        
          .menu-item-705 { display: none; }
}

@media (max-width: 1100px) {        
          .menu-item-705 { display: none; }
}

.menu-item a:after {
     content: "";
     position: absolute;
     z-index: -1;
     left: 0;
     right: 100%;
     bottom: -5px;
     background: #61456a;
     height: 3px;
     transition-property: left right;
     transition-duration: 0.3s;
     transition-timing-function: ease-out;
}

.menu-item a:hover:after,
.menu-item a:focus:after,
.menu-item a:active:after {
     right: 0;
}

/* MENU MODAL */

/* <div class="menu-modal-toggles">
     <a href="#" class="toggle nav-toggle nav-untoggle"> 
          <div class="toggle-text">Sluiten</div>
     </a>
</div> */

.menu-modal {
	background-image: radial-gradient(#ebddc8, #e6e3e8) !important;
}

.menu-modal-inner { 
	background-color: none !important;
}

.menu-modal-toggles a.toggle { /* header (tekst sluiten) */
     font-size: 2.4rem;
     background: transparent !important;
}

.menu-modal .toggle-text { /* header (kruisje) */
     font-size: 2.4rem !important;
     font-weight: normal !important;
     margin-left: -50px !important;
}

.menu-modal .bars .bar { /* kruisje) */
     border: 2px #61456a solid !important;
}

.main-menu .ancestor-wrapper { 
     border-bottom: 2px #61456a solid; 
}

.main-menu .ancestor-wrapper a { 
     font-size: 1.6rem;
     font-weight: normal !important;
     text-align: center;
}

.menu-modal li.menu-item.menu-item-type-custom.menu-item-object-custom.menu-item-191 { 
     border-top: 2px #61456a solid; 
}

.menu-wrapper .menu-bottom {
     margin-bottom: 50px;
}

.menu-wrapper.section-inner .menu-copyright { 
     color: #61456a; 
     font-weight: normal;
}


/* Navigation Toggle ------------------------- */

.header-toggles {      
     display: flex;
	flex-shrink: 0;
	justify-content: flex-end;
	margin: 0 -2.6rem 0 2rem;
	overflow: hidden;
}

.header-toggles .toggle {
     text-decoration: none;
}

.header-toggles .toggle:hover,
.header-toggles .toggle:focus {
	text-decoration: none;
}

.toggle-text {
     font-family: 'Alice-Regular' !important;
     font-size: 2rem !important;
	font-weight: normal;
	color: #61456a;
	border-bottom: 2px transparent solid;
}

.toggle-text:hover {
     border-bottom: 2px #61456a solid;    
}

.nav-toggle .bar {
	background: #61456a !important;
}

.menu-modal-inner  .header-toggles {
     background: #fff !important;
     border-radius: 0;
}



figcaption {
     display: none;
}



/* IMAGES WITH GRADIENT BORDERS */

.wp-block-gallery img {
	display: flex;
	align-items: center;
	width: 90%;
	margin: auto;
	position: relative;
	padding: 0.5em;
	box-sizing: border-box;
	$border: 5px;
  	color: #fff;
  	background: linear-gradient(to top right, #61456a 60%, #ae9254) !important;
  	background-clip: padding-box;
  	border: solid $border transparent;
  	border-radius: 0.5em;

  		&:before {
		    	content: '';
		    	position: absolute;
		    	top: 0; right: 0; bottom: 0; left: 0;
		    	z-index: -1;
		    	margin: -$border;
		    	border-radius: inherit;
  		}
}



/* FOOTER */

#site-footer {
     background-color: #61456a;
     height: auto;
     border: 1px #61456a solid !important;
     margin-top: 0 !important;
}

#site-footer a {
     text-decoration: none;
     color: #beb4c1;
     border-bottom: 1px #beb4c1 solid;
}

#site-footer a:hover {
     border-bottom: 2px #beb4c1 solid;
}

.footer-widgets-outer-wrapper {
     margin-top: 0 !important;
     padding: 5rem 0 10rem 0 !important;
     border-top: 0 !important;
}

.column-one,
.column-two {
     width: 50%;
     height: 4rem !important;
} 

.widget, 
.widget_block {
     border: 0;
}

.column-one { /* copyright */
     height: 3em;
     color: #beb4c1 !important;
     font-size: 2rem !important;
     font-weight: normal;
}

.column-one span { /* copyright teken */
     font-size: 2.5rem;
}

.column-two { /* credits + docs */
     height: 3rem;
     color: #beb4c1 !important;
     font-size: 2rem !important;
     font-weight: normal;
     text-align: right;
}

.column-two img { /* credits - hartje */     
     height: 2.5rem;
     width: auto;
     display: inline;
     margin: 0 5px -5px;
}

.column-two .docs a {
     font-size: 1.6rem;
}





#site-footer .section-inner:nth-child(2), 
.footer-menu,
.footer-credits,
.theme-credits {
     display: none !important;
}