/*
Theme Name: OceanWP Child Theme
Theme URI: https://oceanwp.org/
Description: OceanWP WordPress theme. Sample child theme.
Author: OceanWP
Author URI: https://oceanwp.org/
Template: oceanwp
Version: 1.0
*/

/* Parent stylesheet should be loaded from functions.php not using @import */

/* colors #e100ff, #3e00fa */

b, strong {font-weight: 900}

/* body */
body {
	position: relative;
	overflow: hidden;
	background: url(/wp-content/uploads/2026/04/bg-pic-comp.png) 48.75% 49.3% / cover fixed no-repeat , rgb(26, 27, 41);
	min-height: 100vh;
}
body:before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(26, 27, 41, 0.9);
	overflow: hidden;
	z-index: -1
}

/* scroll bar */
::-webkit-scrollbar {width: 8px}
::-webkit-scrollbar-thumb {
    background: linear-gradient(125deg, #e100ff, #3e00fa);
    border-radius: 4px
}
::-webkit-scrollbar-track {background: rgba(26, 27, 41, 0.9)}

/* header menu navigation*/
#site-header {position: fixed !important}

#site-header-inner {
	top: 15px;
	background-color: rgb(58 58 58 / 55%);
	backdrop-filter: blur(10px);
	box-shadow: 0 0 30px 5px black;
	border-radius: 999px;
	padding: 5px 15px
}
#site-navigation-wrap .dropdown-menu >.current-menu-item >a, #site-navigation-wrap .dropdown-menu >.current-menu-ancestor >a, #site-navigation-wrap .dropdown-menu >.current-menu-item >a:hover, #site-navigation-wrap .dropdown-menu >.current-menu-ancestor >a:hover {
	color: transparent;
	background: linear-gradient(125deg, #e100ff, #3e00fa);
    -webkit-background-clip: text;
    background-clip: text;
	font-weight: 700
}
#site-header.center-header #site-navigation-wrap .middle-site-logo {width: 16%}
#site-header.center-header #site-navigation-wrap .left-menu, #site-header.center-header #site-navigation-wrap .right-menu {width: 42%}

/* buttons style */
.wp-block-button__link {
	font-size: 17px;
	color: white !important;
	transition: 1.5s;
	transition: background .5s ease;
	transition: all .3s ease;
	background: linear-gradient(125deg, #e100ff, #3e00fa);
	padding: 20px 28px
}
.wp-block-button__link:hover {
	transition: 1.5s;
	transition: background 1.5s ease;
	transition: all .3s ease;
	background: linear-gradient(325deg, #e100ff, #3e00fa)
}
.button-category {gap: 40px}
.button-category .wp-block-button {
	border-radius: 25px;
	background: linear-gradient(325deg, #e100ff, #3e00fa);
	padding: 1px;
	height: 250px;
	width: 450px
}
.button-category .wp-block-button__link {
	display: grid;
	font-size: 45px;
	border-radius: 25px;
	padding: 50px;
	box-shadow: 1px 3px 18px 5px rgb(0 0 0 / 45%);
	text-shadow: 2px 2px 15px white, 3px 3px 1px black;
	text-shadow: -2px -2px 5px white, 3px 3px 1px black
}
.button-category .button-songs .wp-block-button__link {background: url(/wp-content/uploads/2026/05/category-songs-bg2.webp) top center / cover no-repeat}
.button-category .button-clips .wp-block-button__link {background: url(/wp-content/uploads/2026/05/category-clips-bg2.webp) top center / cover no-repeat}
.button-category .button-drawer .wp-block-button__link {background: url(/wp-content/uploads/2026/04/Kelsie-Kimberlin-EP-The-Drawer-AI-lyric-video.webp) top center / cover no-repeat}
.button-category .button-standwithukraine .wp-block-button__link {background: url(/wp-content/uploads/2026/04/Kelsie-Kimberlin-standwithukraine-video.webp) top center / cover no-repeat}
.button-category .button-masterpiece .wp-block-button__link {background: url(/wp-content/uploads/2026/04/Kelsie-Kimberlin-Masterpiece-mix-video.webp) top center / cover no-repeat}
.button-category .button-new_video_mix .wp-block-button__link {background: url(/wp-content/uploads/2026/04/Kelsie-Kimberlin-New-music-video-mix.webp) top center / cover no-repeat}

/* hero blocks */
.home-hero, .bio-hero, .clips-hero, .songs-hero {
	position: relative;
	padding: 250px 0 200px 0
}
.home-hero:before, .bio-hero:before, .clips-hero:before, .songs-hero:before {
	content: '';
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	background: url(/wp-content/uploads/2026/04/Kelsie-Kimberlin-bg3.webp) top center / cover fixed no-repeat;
	overflow: hidden;
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	z-index: -1;
}
.bio-hero:before {background: url(/wp-content/uploads/2026/04/Kelsie-Kimberlin-biography-page-bg.webp) top center / cover fixed no-repeat}
.clips-hero:before {background: url(/wp-content/uploads/2026/04/Clips-hero-block-bg.webp) top center / cover fixed no-repeat}
.songs-hero:before {background: url(/wp-content/uploads/2026/04/Kelsie-Kimberlin-songs-page-bg.webp) top center / cover fixed no-repeat}

.home-hero h1, .bio-hero h1, .clips-hero h1, .songs-hero h1 {
	font-size: 135px;
	line-height: .8;
	margin-bottom: 150px
}
.home-hero h1 span, .bio-hero h1 span, .clips-hero h1 span, .songs-hero h1 span {
	font-size: 65px;
	letter-spacing: 35px;
	font-family: 'Aguafina Script';
	text-align: left;
	color: transparent;
    background: linear-gradient(325deg, #e100ff, #3e00fa);
	background-size: 500%;
    -webkit-background-clip: text;
    background-clip: text;
	animation: RotateGradientText 3s linear infinite;
}
.background-overlay-black::after {
	content: '';
	position: absolute;
	background-color: #000000;
    opacity: 0.5;
	height: 100%;
    width: 100%;
	top: 0;
	left: 0;
	overflow: hidden;
	width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
	z-index: -1
}

.hhome-hero_video-bg {
	position: relative;
	height: 100vh;
	overflow: hidden;
	justify-content: center;
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important
}
.home-hero_video-bg video {
	position: absolute;
	top: 50%;
	left: 50%;
	height: 100%;
	object-fit: cover;
	transform: translate(-50%, -50%);
	width: 100vw !important;
	max-width: 100vw !important;
	z-index: -1
}

/* 404 */
.error404-content h1 {font-size: 200px !important}


/* biography */
.biography-block {}

/* iframe, image, archive block */
.responsive-video-wrap iframe, .wp-block-image img, .blog-entry.grid-entry .blog-entry-inner, .blog-entry.grid-entry .blog-entry-inner img, p iframe, .single .thumbnail img {border-radius: 25px}
.blog-entry.col {padding: 15px 15px 5px !important}
.blog-entry.grid-entry .thumbnail {
	margin: -25px -25px 20px
}
.blog-entry.grid-entry .blog-entry-inner {
	border: none;
	box-shadow: 1px 1px 0px 0px rgb(225 0 255 / 45%), -1px -1px 0px 0px rgb(62 0 250 / 45%), 1px 3px 18px 5px rgb(0 0 0 / 45%);
	padding: 25px 25px 15px
}
.blog-entry.post ul.meta, .blog-entry.grid-entry .blog-entry-readmore {margin: 0}
.blog-entry.grid-entry .blog-entry-readmore a {text-transform: uppercase}

/* media text block */
.wp-block-media-text .wp-block-media-text__media {
	border-radius: 25px;
	box-shadow: -5px 5px 28px 5px rgb(225 0 255 / 40%), 5px -5px 28px 5px rgb(62 0 250 / 40%)
}
.wp-block-media-text .wp-block-media-text__media img {border-radius: 25px}



/* spaces */
.pb40 {padding-bottom: 40px}

.mt160 {margin-top: 160px}

.mb160 {margin-bottom: 160px}

/* animation */
@keyframes RotateGradientText {
	0% {background-position: 0% 50%}
	50% {background-position: 100% 50%;}
	100% {background-position: 0% 50%}
}


/* mobile */
@media (max-width: 1366px) {
	#site-header.center-header #site-navigation-wrap .middle-site-logo {width: 10%}
	#site-header.center-header #site-navigation-wrap .left-menu, #site-header.center-header #site-navigation-wrap .right-menu {width: 45%}
}
@media (max-width: 1280px) {
	#site-navigation-wrap .dropdown-menu >li >a {padding: 0 15px !important}
}
@media (max-width: 1080px) {
	#site-navigation-wrap .dropdown-menu >li >a {font-size: 16px !important}
}
@media (max-width: 959px) {}
@media (max-width: 820px) {
	.button-category {justify-content: center}
}
@media (max-width: 768px) {
	#mobile-dropdown {top: 123%}
	.grid-mobile-one_col {grid-template-columns: repeat(1, minmax(0, 1fr)) !important}
	.grid-mobile-two_col {grid-template-columns: repeat(2, minmax(0, 1fr)) !important}
}
@media (max-width: 480px) {
	.home-hero, .bio-hero, .clips-hero, .songs-hero {padding: 200px 0 60px 0}
	.home-hero h1, .bio-hero h1, .clips-hero h1, .songs-hero h1 {font-size: 55px}
	.home-hero h1 span, .bio-hero h1 span, .clips-hero h1 span, .songs-hero h1 span {
		font-size: 35px;
		letter-spacing: 15px;
	}
	.button-category .wp-block-button {width: 100%}
	.wp-block-media-text>.wp-block-media-text__content {padding: 20px 0 0 0}
	.error404-content h1 {font-size: 100px !important}
	
	.mtm60 {margin-top: 60px}
	
	.mbm60 {margin-bottom: 60px}
}