/* Custom Styles */
@import url('https://fonts.googleapis.com/css?family=Montserrat&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Mukta+Mahee:wght@200;300;400;500;600;700;800&display=swap');
html {
	scroll-behavior: smooth;
}
body * {
	font-family: 'Montserrat', sans-serif;
}
h1, h2, h3, h4, h5 {
	font-family: "Mukta Mahee", sans-serif;
	/* font-weight: 400; */
	color: #555555;
}
h1.has-x-large-font-size,
h2.has-x-large-font-size,
h3.has-x-large-font-size,
h4.has-x-large-font-size,
h5.has-x-large-font-size {
	font-size: 4vw !important;
	line-height: 1em;
	margin: auto auto .5em !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	font-weight: 800;
}
p {
	color: #333333;
	text-indent: 0 !important;
	line-height: 1.75em;
}
.site-footer-container {
	background: #333333;
}
ul, ol {
	margin: 0;
	line-height: 1.5em;
}
li {
	margin-block-start: 1em;
}
.display-none {
	display: none;
}
.border-radius > figure {
	padding-left: 1rem;
	padding-right: 1rem;
}
.border-radius > figure img {
	filter: grayscale(1);
	border-radius: 24px;
	margin-bottom: 1em;
}
.wp-duotone-grayscale img {
	transition-duration: .5s;
}
.wp-duotone-grayscale img:hover {
	filter: grayscale(0) !important;
	transition-duration: .5s;
}
.centered .site-header .site-header-container {
  	position: absolute;
  	z-index: 9;
  	border: none;
}
.site .site-header .site-header-container {
    border-bottom: unset;
}
.site .site-header .site-header-container .site-branding .custom-logo-link .custom-logo {
	/* background-color: white;
	border-radius: 100px;
	padding: .75em;
	margin: 1em; */
    margin-top: 65px;
    width: 50%;
}
.site-branding img:hover {
  /* Start the shake animation and make the animation last for 0.5 seconds */
  /* animation: shake 3s; */

  /* When the animation is finished, start again */
  /* animation-iteration-count: infinite; */
}
.site-main .hentry .entry-content {
	padding-bottom: 0;
}

.wp-block-cover {
/* 	border-radius: 24px; */
  overflow: hidden;
}
#Tabs-Generator, 
#Chord-Diagram-Editor {
	border-radius: 24px;
}
@media only screen and (min-width: 720px) {
.display-on-mobile {
		display: none;
	}
}
@media only screen and (min-width: 1200px) {
	#Tabs-Generator .wp-block-image {
		margin-left: 10%;
		margin-right: -9%;
		margin-bottom: -9%;
		padding-bottom: 13%;
	}
	#Chord-Diagram-Editor .wp-block-image {
		margin-left: -9%;
		margin-right: 10%;
		margin-bottom: -9%;
		padding-bottom: 13%;
	}
}
p.has-text-align-left.align-justify,
p.has-text-align-center.align-justify,
p.has-text-align-right.align-justify {
	text-align: justify;
}
/* Mobile */

@media only screen and (max-width: 900px) {
	.site .site-header .site-header-container .site-branding .custom-logo-link .custom-logo {
		width: 40vh;
		height: 40vh;
	}
	.site-title, .site-description {
		display: none !important;
	}
	.small-on-mobile {
		text-align: center;
	} 
	.small-on-mobile img {
		max-width: 250px;
		margin: auto;
	}
	.align-center-on-mobile,
	.align-center-on-mobile.has-text-align-left {
		/* text-align: center; */
		text-align: justify;
		margin: auto;
	}
	.align-center-on-mobile.wp-block-buttons {
		justify-content: center !important;
		margin: auto;
	}
}
@media only screen and (max-width: 780px) {
	h1.has-medium-font-size,
	h2.has-medium-font-size,
	h3.has-medium-font-size,
	h4.has-medium-font-size,
	h5.has-medium-font-size {
		font-size: var(--wp--preset--font-size--small) !important;
		line-height: 1em;
		margin-bottom: .5em !important;
	}
	h1.has-large-font-size,
	h2.has-large-font-size,
	h3.has-large-font-size,
	h4.has-large-font-size,
	h5.has-large-font-size {
		font-size: var(--wp--preset--font-size--medium) !important;
		line-height: 1em;
		margin-bottom: .5em !important;
	}
	h1.has-x-large-font-size,
	h2.has-x-large-font-size,
	h3.has-x-large-font-size,
	h4.has-x-large-font-size,
	h5.has-x-large-font-size {
		font-size: 16vw !important;
        margin: auto auto .5em !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
	}
	.wp-block-button {
		font-size: var(--wp--preset--font-size--small);
	}
	.wp-block-spacer {
		height: 1em !important;
	}
	p.has-medium-font-size {
		line-height: 1.5em;
		font-size: var(--wp--preset--font-size--small) !important;
	}
	p.has-large-font-size {
		font-size: var(--wp--preset--font-size--medium) !important;
	}
	p.has-x-large-font-size {
		font-size: var(--wp--preset--font-size--large) !important;
	}
}
@media only screen and (max-width: 500px) {
	#Tabs-Generator, 
	#Chord-Diagram-Editor {
		min-height: 300px !important;
	}
}

.wp-block-cover.contained > .wp-block-cover__inner-container > * {
    margin: auto;
    max-width: 1100px; 
}

.site-footer-container {
	background: none !important;
}

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-20deg); }
  20% { transform: translate(-3px, 0px) rotate(10deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(10deg); }
  50% { transform: translate(-1px, 2px) rotate(-20deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-20deg); }
  80% { transform: translate(-1px, -1px) rotate(10deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-20deg); }
}