/*
 Theme Name:   Twenty Sixteen Child
 Theme URI:    https://example.com/
 Description:  Child theme for the Twenty Sixteen theme
 Author:       Bluepie Records
 Author URI:   https://example.com/
 Template:     twentysixteen
 Version:      1.0.0
*/

/* Your custom styles go below this line */

/* ===== RESET ================================================== */
@media screen and (min-width: 44.375em) {

  body:not(.custom-background-image)::before,
  body:not(.custom-background-image)::after {
    content: none !important;
    display: none !important;
  }

}

body.custom-background {
  background-image: url("/wp-content/uploads/2023/10/KS-Website-Collaterals-Background-image.png");
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: scroll;
}


a, abbr, acronym, address, applet, article, aside, audio,b, blockquote,big, body, button, center, canvas, caption, cite, code, command,datalist, dd, del, details, dfn, dl, div, dt, em, embed,fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html,i, iframe, img, ins,kbd, keygen,label, legend, li, meter,nav,object, ol, output,p, pre, progress,q, s, samp, section, small, span, source, strike, strong, sub, sup,table, tbody, tfoot, thead, th, tr, tdvideo, tt,u, ul, var{background:transparent; border:0 none; margin:0; padding:0; line-height:16px; vertical-align:baseline; outline:none; font-size:100%; font-family:inherit; font-weight:normal; font-style:normal;} article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;} blockquote,q{quotes:none;} blockquote:before,q:before{content:'';content:none;} blockquote:after,q:after{content:'';content:none;} ins {text-decoration:none;} abbr[title], dfn[title] {border-bottom:1px dotted; cursor:help;} table {border-collapse:collapse; border-spacing:0;} hr {display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0;} input, select {vertical-align:middle; margin:0;} ol, ul, li {list-style:none;}
html {-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;} *, *:before, *:after {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -webkit-tap-highlight-color:rgba(255,255,255,0);}

/* ===== GLOBAL ================================================== */
@font-face {
    font-family: 'MenuFont';
    src: url('fonts/Switzer-Bold.ttf');
}

@font-face {
    font-family: 'AllFontMedium';
    src: url('fonts/Switzer-Black.ttf');
}

@font-face {
    font-family: 'AllFont';
    src: url('fonts/Switzer-Regular.ttf');
}

body{ font-family:Arial; font-size:15px; color:#fff; background:#060606}
:focus{ outline:0 none;}
:focus,
a{ text-decoration:none; color:#faffd7 !important;}
a:hover{ text-decoration:none; color:#cc1f10;}
b, strong{ font-weight:bold;}
i, em{ font-style:italic;}
h1,h2,h3,h4,h5,h6{font-weight:normal; line-height:normal; font-family: 'MenuFont'}
h1 { font-size:28px;}
h2 { font-size:24px;}
h3 { font-size:22px;}
h4 { font-size:18px;}
p{ font-family:AllFont; margin-bottom:15px; line-height:20px; color:#EFE8D1; letter-spacing:.5px; font-size:16px}
::-webkit-input-placeholder { color:#999;}
:-moz-placeholder { color:#999;}
::-moz-placeholder { color:#999;}
:-ms-input-placeholder { color:#999;}
.clear{clear:both;}
.floatL{float:left;}
.floatR{float:right;}
.full-width{float:left; width:100%;}
.hide{ display:none!important;}
.container { width:100%; max-width:1200px; margin:0 auto; display:table; padding:0px }

.social-icon{ float:right;}
.social-icon li{ float:left;}
.social-icon li a{ width:36px; height:36px; float:left;}
.social-icon li img{ -webkit-transition:all 1s ease; -moz-transition:all 1s ease; -ms-transition:all 1s ease; -o-transition:all 1s ease; transition:all 1s ease; border-radius:50%; }
.social-icon li img:hover{ filter:grayscale(100%); -webkit-filter: grayscale(100%); filter:gray;}
.footer .social-icon li img{ width:30px }

.header-right .social-icon li img{ max-width:100% }

/* ===== HEADER ================================================== */
.header{ padding:0px; background-color:#C36855;}
.header img{ display:block; max-width:100%;}
.header .logo{ float:left;}
.header .header-right{ float:right; padding-right:10px}
.header-right{ padding:0px}

.header .navigation{ margin:20px 0 10px; float:left; clear:both; font-family: 'MenuFont';}
.header .navigation ul li{ float:left; margin-left:20px;}
.header .navigation li a{ font-family: 'MenuFont'; font-size:18px; display:block; line-height:normal; text-transform:uppercase; margin-left:15px;}
.header .navigation li:hover a,
.header .navigation li.current-menu-item a{font-weight: bold; color:#ffffff !important; }

.header .navigation li ul{ display:none; position: absolute;}
.header .navigation li:hover ul li{ float:none; margin-left:10px; border-bottom:1px solid #85776b}
.header .navigation li:hover ul li a{ padding:15px 8px 8px 0px; color:#000; font-size:20px; background:#d4d4d4; }
.header .navigation li:hover ul li a:hover{ color:#cc1f10; }
.header .navigation li:hover ul{ display:block; overflow: hidden; margin-bottom:20px; background:#d4d4d4; z-index: 1;}

.home-content .Featured_videos{float:left;width:100%;margin-bottom:38px;}
.home-content .Featured_videos .vidio{float:left;width:100%;margin-top:7px;}
.home-content .Featured_videos .Show_vidio{float:left;width:100%;height:425px;}

/* ===== BANNER ================================================== */
.flexslider {position: relative;}
.loading .flexslider{ max-height:500px; overflow:hidden;}
.flex-viewport { -webkit-transition: all 1s ease;-moz-transition: all 1s ease;-ms-transition: all 1s ease;-o-transition: all 1s ease;  transition: all 1s ease;}
.flexslider .slides img { width:100%; display:block;}
.flex-direction-nav a { display:block; width:33px; height:59px; position:absolute; top:50%; margin-top:-16px; z-index:10; overflow:hidden; cursor:pointer; font-size:0; line-height:0;}
.flex-direction-nav .flex-prev{ background:url(images/previous.png) no-repeat; left:3%;}
.flex-direction-nav .flex-next{ background:url(images/next.png) no-repeat; right:3%;}


.latest-episode .flexslider{background:none;border:0px;box-shadow:0 0px 0px rgba(0, 0, 0, 0.0);}
.latest-episode .bigimg .flex-direction-nav{display:none;}
.latest-episode .bigimg ul li iframe{height:437px;}
.latest-episode .silder-small ul li .slider-thumb-content{background:#fff;margin-right:10px;border:1px solid #c6c6c6;cursor:pointer;}
.latest-episode .silder-small ul li img{border-radius:0;padding:6px 2px 6px 6px;width:154px;height:80px;}
.latest-episode .silder-small .flex-direction-nav li{border:0px;}
.latest-episode .silder-small li p{padding:0px 10px 10px 10px;min-height:64px;font-size:14px;line-height:18px;}
.latest-episode .silder-small .flex-direction-nav a{top:23%;margin:0px;}
.latest-episode .dj-silder .flex-viewport{width:676px;margin:0 auto 0 55px;}
.latest-episode .dj-silder .flex-viewport ul{margin-bottom:0px;}
.latest-episode .flex-direction-nav a{transition:all 0.0s ease 0s;}
.latest-episode .silder-small ul li.flex-active-slide .slider-thumb-content{border-color:#B20205;}
.latest-episode .silder-small ul li.flex-active-slide p{color:#B20205;}
.latest-episode .flex-direction-nav a{background:url(images/arrow1.png) no-repeat scroll 0 0;cursor:pointer;display:block;height:74px;margin:0 60px;right:0px;opacity:1;position:absolute;text-indent:-9999px;top:50%;width:40px;z-index:10;}
.latest-episode .flex-direction-nav .flex-next{right:10px;background-position:-45px 0;}
.latest-episode .flex-direction-nav .flex-next{background:url(images/next.png) no-repeat; left:3%;}
.latest-episode .flex-direction-nav .flex-prev{background:url(images/previous.png) no-repeat; left:3%;}
.latest-episode .flexslider:hover .flex-next{opacity:1;right:10px;}
.latest-episode .flexslider:hover .flex-prev{opacity:1;left:0px;}
@media(max-width:768px){.latest-episode .dj-silder .flex-viewport{width:86%;margin:0 auto;}
.latest-episode .silder-small ul li img{width:143px;}
.music-button img{width:70%;}
.sidebar.music-button{text-align:center;}
}

/* ===== VIDEO ON HOME PAGE ================================================== */
.home-content{ padding:40px 0px;background-color: #434343}
.home-content .musicFrame iframe { margin-bottom:-30px}

.widgets-container{ margin: 0 auto 30px; display: table; width:100%; padding:0 40px;}
.widgets-container li{ float: left; width:32.142857142857146%; margin-right:1.7857142857142856%;}
.widgets-container li:last-child{ margin-right:0;}

/* ===== CONTENT PAGE ================================================== */
.content-page{ padding:20px;background-color:#434343 }
.music-main{ padding:40px;background-color:#434343;}
.content-page h2,
.music-main h2{ padding: 0 0 5px; margin: 0 0 20px; font-family:MenuFont; color: #EFE8D1; text-transform:uppercase; font-size:32px;text-align:left;}
.content-page h3{ padding-bottom: 10px; color:#cc1f10;}
.content-page .page-content-text img{ margin:0px 5px 0px 0px; float:right}
.content-page .page-content-text img.alignright{ float:right; margin:0 0 5px 20px;}
.content-page .page-content-text li{ list-style: disc; margin:0 0 5px 18px;}

.content-page p{ text-align:justify }
.content-page p a:hover{ color: #95C095 }

.content-page .contact-page-content img{ padding:0; border:0;}

.content-page .media-page ul.logos{ float: left; width: 100%; padding: 0 0 20px;}
.content-page .media-page .comp-cards li{ float: left; width:25%; padding:10px;}
.content-page .media-page .comp-cards li img{ display:block; width:100%;}
.media-page .logos li,
.media-page .comp-cards li{ list-style:none; margin:0px; }

/* ===== MUSIC PAGE ================================================== */
.shop-detail li{float: left; width: 185px; padding: 0 5px 20px 5px;}
.shop-detail li img{ width:100% }

.social-shop-icons .icons-container{ display:table; margin:10px auto 0px auto; padding:3px 3px 0px 3px; }
.social-shop-icons .icons-container a img{ width:30px; border-radius:5px }

/* ===== VIDEO PAGE ================================================== */
.video{ padding:5% 0px }
.video h2{ padding: 0 0 5px; margin: 0 0 20px; font-family:MenuFont; color: #95C095; text-transform:uppercase; font-size:18px}

/* ===== CONTACT PAGE ================================================== */
.contact-page-content h3, #contactPage h3{ font-family:MenuFont; color: #EFE8D1; text-transform:capitalize; font-size:22px; padding:15px 0px}
.contact-page-content p a:hover{ color: #95C095 }
@media (min-width:767px){

}
/* ===== GALLERY PAGE ================================================== */
.gallery-page{ background-color: #434343; padding:20px;}
.gallery-page h2{ padding: 0 0 5px; margin: 0 0 20px; font-family:MenuFont; color: #EFE8D1; text-transform:uppercase; font-size:28px;text-align:left;}

/* ===== MEDIA PAGE ================================================== */
.media-page{ padding:40px; background-color:#434343;}
.media-page h2{ padding: 4% 0 0 0; margin: 0 0 20px; font-family:MenuFont; color: #EFE8D1; text-transform:uppercase; font-size: 28px; text-align: left;}
.media-page a:hover{ color: #95C095 }
#bands img{ padding:10px 40px }

.wp-block-columns {margin-left: 165px;}
.wp-block-image figcaption {font-size: 11px;}

/* search page */
header.page-header { float: left; width: 100%; padding-top: 11px;}
.search-field{ margin-left:10px; padding-left:10px; height:30px; color:#000; border:none;}
.search-submit{  background:#fff; padding:0px 10px 3px 10px; line-height:27px; color:#000; cursor:pointer; } 
.search-submit:hover{ background:#ccc;} 
.page-title{border-bottom: 1px solid #c2c2c2; font-size:24px; padding: 0 0 5px; margin: 0 0 20px;}

/* ===== FOOTER ================================================== */
.footer{ background: #C36855;padding: 3px; margin: 0;}
.footer ul{ margin:10px auto; display:table; float:right}
.footer .nav li{ float:left; font-family:MenuFont;}
.footer .nav li a{ font-size:14px; display:block; border-right:2px solid #fff; line-height:normal; text-transform:uppercase; padding:0px 5px}
.footer .nav li:last-child a{ border:0;}
.footer .nav li a:hover,
.footer .nav li.current-menu-item a{ color:#ffffff; background:none}
.footer .social-icon{ float:none; margin-top:34px;}
.footer-copy{ padding:25px 0; text-align:center; font-size:16px; font-family:AllFont; text-transform:capitalize}
.footer-copy a:hover{ color:#ffffff; }
.footer ul ul{ display:none; visibility:hidden}

/* ===== Music ================================================== */
.music-main .catalog-item { float: left;padding:0;  border-bottom: 1px solid rgba(255,255,255,0.3); margin: 0 0 20px;width:290px;}
.music-main .catalog-item img {display: block; padding:6px 0; margin:0; max-width: 170px;-webkit-border-radius: 4px;-moz-border-radius: 4px; border:0; border-radius: 4px;}
.music-main .catalog-item div {border-top: 1px solid rgba(255,255,255,0.3);width: 100%;float: left;margin:5px 0 0;}
.music-main .catalog-item a.amazon {background: url(images/amazon.png) 0 0 no-repeat; width:35px; height:35px; float: left; margin:6px 10px 6px 0px;}
.music-main .catalog-item a.itune { background: url(images/itunes.png) 0 0 no-repeat;width:35px; height:35px;float: left; margin:6px 10px 6px 0px;}
.music-main .catalog-item a.spotify{ background: url(images/spotify-1.png) 0 0 no-repeat;width:35px; height:35px;float: left; margin:6px 10px 6px 0px;}
.music-main .catalog-item div a{margin-right:10px;}
.music-main .catalog-item a.deezer{ background: url(images/deezer.png) 0 0 no-repeat;width:35px; height:35px;float: left; margin:6px 10px 6px 0px;}

/* ===== RESPONSIVE ================================================== */

/** Home Page Video Section Css Start **/
.clearfix:before, .clearfix:after {content:""; display:table;}
.clearfix:after {clear:both;}
.col-row{ margin:0 -15px; }
.col-row .col-2{ width:31%; padding:0 15px; float: left; }
/** Home Page Video Section Css End **/
.navbar-toggle{
  position: relative;
  z-index: 10000;
  cursor: pointer;
}

@media (min-width:768px){
.header .navigation{ display:block!important;}
.header .navbar-toggle { display:none;}
}
@media (max-width:1200px){
.container{ width:96%;}
.header .navigation ul li{ margin-left:8px;}
.header .navigation li a{ padding:8px 8px 0;}
}
@media (max-width:767px){
.container{ width:100%;}
.header{ padding:15px;}
.header .header-right{ width:100%;}
.header .logo{ width:100%; padding:0 0 20px;}
.header .logo img{ margin:0 auto;}
.header .navbar-toggle{ float:left; margin:15px 0 0; cursor:pointer;}
.header .navbar-toggle span{ background:#bebdbd; height:3px; width:30px; display:block; margin-top:4px;}
.header .navigation{ width:100%; float:left; background:#202020; padding:10px; margin-top:10px; display:none;}
.header .navigation.active{ display:block;}
.header .navigation ul li{ width:100%; margin-top:5px; margin-left:0px;}
.header .navigation li a{ padding:10px 10px 2px;}
.home-content{ padding:15px;}

.col-row .col-2{ width: 100% }

}

@media (max-width:500px){
  ul.widgets-container li{width:100%; margin-bottom:10px}
.footer{ padding:15px;}
.footer .nav li{ width:50%;}
.footer .nav li a{ padding:0 0 8px 20px; border:0;}
}

.sideHeadingLink{ font-size: 14px; float: right; background: #660805; padding: 5px 10px;   border-radius: 3px; }
.sideHeadingLink:hover{ color: #660805; background:#ffffff }

/* Desktop: show menu */
#site-navigation { display: block; }

/* Mobile: hide until toggled */
@media (max-width: 991px){
  #site-navigation { display: none; }
  #site-navigation.is-open { display: block; }
}
@media screen and (min-width: 44.375em) {
  body:not(.custom-background-image)::before,
  body:not(.custom-background-image)::after {
    pointer-events: none !important; /* critical for Firefox */
  }
}

@media screen and (min-width: 44.375em) {
  body:not(.custom-background-image)::before,
  body:not(.custom-background-image)::after {
    pointer-events: none !important;
  }
}

.koptiq-header{
  background:#C36855;
  position: relative;
  z-index: 9999;
}

.koptiq-header__inner{
  max-width:1200px;
  margin:0 auto;
  padding:0px 16px;
  display:flex;
  align-items:center;
  gap:18px;
}

.koptiq-brand img{
  width:56px;
  height:56px;
  border-radius:50%;
  display:block;
  object-fit:cover;
}


.koptiq-nav{
  flex:1;
  display:flex;
  justify-content: flex-start;
  margin-left: 50px;
  font-family: 'MenuFont';
  
}

.koptiq-nav ul{
  margin:0;
  padding:0;
  list-style:none;
  display:flex;
  gap:22px;
  align-items:center;
}

.koptiq-nav a{
  color:#fff;
  text-decoration:none;
  text-transform:uppercase;
  font-weight:800;
  letter-spacing:.5px;
  padding:10px 6px;
}

.koptiq-nav a:hover{ opacity:.85; }


.koptiq-social{
  display:flex;
  align-items:center;
  gap:10px;
}


.koptiq-social a{
  width:35px;
  height:35;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
}


.koptiq-toggle{
  display:none;
  background:transparent;
  border:0;
  padding:10px;
  cursor:pointer;
  position:relative;
  z-index: 10000; 
}

.koptiq-toggle span{
  display:block;
  width:26px;
  height:2px;
  background:#fff;
  margin:5px 0;
}


@media (max-width: 900px){

  .koptiq-header__inner{
    display:grid;
    grid-template-areas:
      "logo logo"
      "toggle social";
    row-gap: 10px;
    align-items:center;
  }
.koptiq-brand img{
    width: 300px;
    height: 300px;
}
  .koptiq-brand{
    grid-area: logo;
    justify-self: center;  
  }

  .koptiq-toggle{
    display:block;
    grid-area: toggle;
    justify-self: start;
  }

  .koptiq-social{
    grid-area: social;
    justify-self: start;
    margin-left: -71px;
  }

  /* Dropdown menu */
  .koptiq-nav{
    display:none;
    position:absolute;
    left:-24px;
    right:0;
    top: 356px;        
    background:#202020;
    padding:10px 16px;
    z-index: 9999;
    justify-content:flex-start;
    width: calc(100% - 50px);
  }

  .koptiq-nav.is-open{ display:block; }

  .koptiq-nav ul{
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
  }

  .koptiq-nav a{
    display:block;
    width:100%;
    padding:10px 0;
  }
}


@media screen and (min-width: 44.375em){
  body:not(.custom-background-image)::before,
  body:not(.custom-background-image)::after{
    pointer-events: none !important;
  }
}

.home-content{
  padding-bottom:100px;
}

.media-row{
  display:grid;
  gap:30px;
  margin-bottom:12px;
}

.media-row-2{
  grid-template-columns: repeat(2, 1fr);
}
.media-row-spotify{
  grid-template-columns: repeat(2, 1fr);
}

.media-row-3{
  grid-template-columns: repeat(3, 1fr);
}

.media-card{
  width:100%;
}

/* iframe sizing */
.yt-frame,
.sp-frame{
  width:100%;
  border:0;
  display:block;
}


.yt-400{ height:400px; }
.yt-300{ height:300px; }

.sp-510{ height:510px; }
.sp-200{ height:200px; }
.sp-152{ height:152px; }


.stack{
 display:flex;
  flex-direction:column;
  gap:12px;              
  height:510px; 
}
.stack iframe{
  flex:1;                
  width:100%;
  height:auto;           
  min-height:150px;      
  border:0;
  border-radius:12px;
  overflow:hidden;
  display:block;
}



/* Responsive */
@media (max-width: 991px){
  .media-row-2{ grid-template-columns: 1fr; }
  .media-row-spotify{ grid-template-columns: repeat(2, 1fr); }
  .media-row-3{ grid-template-columns: repeat(2, 1fr); }
  .yt-vid-2{margin-top: 20px;}

}

@media (max-width: 600px){
  .yt-400{ height:260px; }
  .yt-300{ height:220px; }
  .media-row-3{ grid-template-columns: 1fr; }
}