/**
 * @file
 * Subtheme specific CSS.
 */

/* OVERRIDES */

html {
  scroll-behavior: smooth;
}

iframe {
  border: none;
  }

body {
  overflow-x: hidden;
  text-rendering: auto;
}

body p {
  font-size: 1.2rem;
}

body, p, h4, h5, h6, a, li {
  font-family: inherit!important;

}


/* CUSTOM CLASSES */


.w-100{
    width: 100%;
}

.w-90{
    width: 90%;
}  

.centered{
  text-align: center;
}


/* GRID */
.row {
    margin-left:0!important;
    margin-right:0!important;
}

.row {
  display: flex;
  flex-wrap: wrap;
}
.row > [class*='col-'] {
  display: flex;
  flex-direction: column;
}


.col-lg-6, .col-md-6 {
   /*padding-left: 0px!important;*/
   /*padding-right: 0px!important;*/
    }

@media screen and (max-width: 979px) {
.col-12{
  padding-left: 0px!important;
  padding-right: 0px!important;
  padding-bottom: 2rem!important;
    }
}

/* REGIONS */


.featured-bottom {
   /*background-color: #222222;*/
}

.region-featured-bottom-first{
    flex-direction:column;
    padding: 1em 0;
}

.site-footer__top .region{
    width: 100%;
}

.site-footer .block {
    border: 0;
}

.region-footer-first{
    flex-direction:column;
}

.region-footer-second{
    flex-direction:column;
}

.region-footer-fifth{
    flex-direction:column;
}


/* FLUID CONTAINER */

.container-fluid{
  /*margin: 0!important;*/
    padding: 0!important;
}

.featured-top .container-fluid{
    max-width: 100%!important;
}

/* MEDIA QUERIES */

@media (max-width: 767px) {
  
    html, body {
    overflow-x: hidden;
    }
     
    .container-fluid{
    width:100%!important;
       /*max-width:95%!important;*/
    }    
}

@media (min-width: 768px) and (max-width: 1023px) {

    html, body {
    overflow-x: hidden;
    }
  
    .container-fluid{
       /*width:100%!important;*/
/*    max-width:96%!important;*/
    }
}

@media (min-width: 1024px) and (max-width: 1366px) {

    .navbar-expand-lg .navbar-collapse{
	justify-content:center!important;
    }

    .container-fluid{
       /*width:90%!important;*/
/*    max-width:90%!important;*/
    }
}

@media (min-width: 1367px) {

    .navbar-expand-lg .navbar-collapse{
	justify-content:center!important;
    }

    .container-fluid{
       /*width:94%!important;*/
/*    max-width:84%!important;*/
    }
}


/* NAVIGATON */
/* CONTROLS */

.nav-link{
    line-height: 2;
}


/* SEARCH FORM */

.search-block-form .container-inline{
    /*padding-top: 0.5rem;*/
}

/*SITE BRANDING*/

/* MEDIA QUERIES */
/* PARALLAX BACKGROUND */

@media screen and (max-width: 667px) {    
    .paral {
    min-height: 60vw;
    }

    .paral-last {
    min-height: 40vw;
    }
}

@media screen and (min-width: 668px) and (max-width: 1023px) {    
    .paral {
    min-height: 50vw;
    }

    .paral-last {
    min-height: 30vw;
    }    
}

@media screen and (min-width: 1024px) and (max-width: 1366px) {
    .paral {
    min-height: 32vw;
    }

    .paral-last {
    min-height: 20vw;
    }    
}

@media screen and (min-width: 1367px) {
    .paral {
    min-height: 30vw;
    }

    .paral-last {
    min-height: 20vw;
    }    
}


.background-parallax-1 {
  background: url(/sites/default/files/2023-05/We-Are-UbuntuFM.1280.jpg) left center no-repeat;
  background: -webkit-image-set(url(/sites/default/files/2022-12/We-Are-UbuntuFM.1280.webp) type('image/webp'));  
  background-size: cover;
  position: relative;
  width: 100%;
  min-height: 60vw;
}

.background-parallax-1-mobile {
  background: url(/sites/default/files/2023-05/We-Are-UbuntuFM.1280.jpg) left center no-repeat;
  background: -webkit-image-set(/sites/default/files/2022-12/We-Are-UbuntuFM.1280.webp) type('image/webp'));  
  background-size: cover;
  position: relative;
  width: 100%;
  min-height: 60vw;
}

.background-parallax-2 {
  background: url(/sites/default/files/2023-05/ubuntufm-wordcloud.jpg) left center no-repeat;
  background: -webkit-image-set(url(/sites/default/files/2022-12/ubuntufm-wordcloud.webp) type('image/webp'));  
  background-size: cover;
  position: relative;
  width: 100%;
  /*height: 600px;*/
  min-height: 60vw;
}

.background-parallax-3 {
  background: url(/sites/default/files/2023-05/baobabs.jpg) left center no-repeat;
  background: -webkit-image-set(url(/sites/default/files/2022-12/baobabs.webp) type('image/webp'));  
  background-size: cover;
  position: relative;
  width: 100%;
  min-height: 50vw;
}

.background-parallax-4 {
  background: url(/sites/default/files/2023-05/thetruth.1920.jpg) left top no-repeat;
  background: -webkit-image-set(url(/sites/default/files/2022-12/thetruth.webp) type('image/webp'));  
  background-size: cover;
  position: relative;
  width: 100%;
  min-height: 50vw;
}

.background-parallax-5 {
  background: url(/sites/default/files/2022-11/UBFM.radio_.1920.700.jpg) left top no-repeat;
  background: -webkit-image-set(url(/sites/default/files/2023-05/UBFM.radio_.1920.700.webp) type('image/webp'));  
  background-size: cover;
  position: relative;
  width: 100%;
  min-height: 50vw;
}


/* NAVBAR */

#navbar-main{
  /*background-color: rgba(221, 81, 33, 0.4)!important;*/
}

.navbar-dark .navbar-nav .nav-link{
  /*color: rgba(255, 255, 240, 0.9)!important;*/
}

.navbar-brand{
    width: 30%;
    margin-right: 0!important;
}

.navbar-toggler {
    margin: 0 auto;
    width: 100%;
}

.navbar-collapse{
    text-align: center;
}

/* SIDEBAR */

.sidebar .block {
    border-style: none;
}

.sidebar h2{
  font-size: 1.5rem;
  text-shadow: none;
}

@media screen and (max-width: 979px) {

  .sidebar h2{
    font-size: 1.5rem;
    text-shadow: none;
    padding-top: 1rem;
   }

  .sidebar .block{
      display: inline;
      padding: 0;
  }
}

@media screen and (min-width: 980px) {
  .sidebar .block{
      display: grid;
  }
}

/* BLOCKS */
   
#block-downloadradioappsidebar{
     
.row .col-sm-6{
  text-align:center;
 }
}

#block-fblikebox .content{
  padding-bottom: 1rem;
}


/* NODE CONTENT */

.node--unpublished {
    background: url('/sites/default/files/unpublished.png');
    height: 300px;
  }

#block-tags-in-themes{
    display: flex;
}


/* BOOTSTRAP CARDS */

.card{
    border: none!important;
    background: transparent!important;  
    padding: 1%;
}

/* BOOTSTRAP JUMBOTRON */


.jumbotron{
  /*background-color: rgba(0, 0, 0, 0.3)!important;*/
  /*margin-bottom: 0!important;*/
}

.jumbotron h2{
  text-align:center;
  margin-bottom:2rem;
}

@media screen and (max-width: 979px) {
.jumbotron {
    padding: 0.3rem;
    margin-bottom: 0;
    background: transparent;
    }    
}

@media screen and (min-width: 980px) {
.jumbotron {
/*    padding: 4rem;*/
    margin-bottom: 0;
    background: transparent;
    }
}

@media screen and (min-width: 1440px) {
.jumbotron {
/*    padding: 6rem;*/
    margin-bottom: 0;
    background: transparent;
    }
}

div[class^="jumbotron paral"] p{
/*font-size: 2rem;*/
/*line-height: 3rem;*/
   /*color:red; */
}

/* BOOTSTRAP SLIDER CAROUSEL*/
.carousel {
    width: 100%;
    background-color: #292929;
}

.carousel-caption{
    right: 2%;
    left: 35%;
    text-align: right;
}

.carousel-caption a{
  /*font-size: 3vw;*/
}

#views-bootstrap-radio-channels-block-3 h3 a {
  /*color: #f4254e;*/
}


/* CUSTOM TEXT CLASSES */
/* EDITOR STYLES */

hr, p.hr {
    margin-top: 1rem;
    margin-bottom: 1rem;
    padding-top: 1rem;
    border: 0;
}    

.textshadow {
    text-rendering: optimizeLegibility;
    text-shadow: 1px 1px 1px #000;
}

.display-5{
    font-size:2.5rem;
    line-height:1.1;
   }

blockquote, .view-audio-content .views-row {
    margin: 1.5em 10px;
    padding: 0.5em 10px;
    /*quotes: "\201C";*/
}

blockquote:before {
    content: open-quote;
    font-size: 4em;
    line-height: 0.1em;
    margin-right: 0.25em;
    vertical-align: -0.4em;
}

.highlight{
    font-size:1.6em;
    margin-top:0.5em;
    margin-bottom:0.5em;
}

.quote{
    padding: 1.5rem 1.5rem;
    margin: 0.5rem 0;
    font-size: 110%;
    line-height: inherit;
  }
  
.question{
    padding: 1rem 0;
    font-size: 120%;
    line-height: 120%;
  }
  
.slug-jumbotron{
	font-size: 2rem;
	margin-top:1%;
	padding: 0.8rem;
	background:transparent!important;
}

.bold{
    padding: 0.5rem 0;
    /*margin: 0 0 20px;*/
    font-size: 128%;
    font-weight: 700;
    line-height: 120%;
  }

.colofon{
    margin-top: 1rem;
    margin-bottom: 1rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
    border: 0;
    font-size: 1rem;
}

.display-6 {
    font-size: 2.5rem;
    font-weight: 300;
    line-height: 1.2;
}


@media all and (max-width: 1024px) {
  .tiny {
    font-size: 0.8em;
    font-weight: 300;
    text-transform: uppercase; }

  .tinyBold {
    font-size: 1.0em;
    font-weight: 700;
    text-transform: uppercase; }

  .small {
    font-size: 1.2em;
    font-weight: 300;
    text-transform: uppercase; }

  .smallBold {
    font-size: 1.4em;
    font-weight: 700;
    text-transform: uppercase; }

  .medium {
    font-size: 1.6em;
    font-weight: 300;
    text-transform: uppercase; }

  .mediumBold {
    font-size: 1.8em;
    font-weight: 700;
    text-transform: uppercase; }

  .normal {
    font-size: 2.0em;
    font-weight: 300;
    text-transform: uppercase; }

  .normalBold {
    font-size: 2.2em;
    font-weight: 700;
    text-transform: uppercase; }

  .large {
    font-size: 2.6em;
    font-weight: 300;
    text-transform: uppercase; }

  .largeBold {
    font-size: 2.8em;
    font-weight: 700;
    text-transform: uppercase; }

  .blocktitle {
    font-size: 3.6em;
    font-weight: 500;
    text-transform: uppercase; }

  .blocktitleBold {
    font-size: 3.8em;
    font-weight: 700;
    text-transform: uppercase; }

  .author {
    font-size: 0.9em;
    font-weight: 300;
    font-style: italic;}
    
  .blocktext{
    display: table;
    width: 100%;
    /*padding: 0 4% 2% 4%;*/
    line-height: 1.05;
    font-family: "Oswald", sans-serif;
    text-transform: uppercase;
    position: relative; }
    
  .blocktext-flex {
    display: flex;
    width: 100%;
    margin-top: 8rem;
    /*padding: 0 4% 2% 4%;*/
    line-height: 1.05;
    font-family: "Oswald", sans-serif;
    text-transform: uppercase;
    position: relative; }
    
    blockquote p {
    display: inline;
    font-size: 1rem;}
  }

@media all and (min-width: 1025px) {
  .tiny {
    font-size: 1em;
    font-weight: 300;
    text-transform: uppercase; }

  .tinyBold {
    font-size: 1.2em;
    font-weight: 700;
    text-transform: uppercase; }

  .small {
    font-size: 1.4em;
    font-weight: 300;
    text-transform: uppercase; }

  .smallBold {
    font-size: 1.6em;
    font-weight: 700;
    text-transform: uppercase; }

  .medium {
    font-size: 1.8em;
    font-weight: 300;
    text-transform: uppercase; }

  .mediumBold {
    font-size: 2.0em;
    font-weight: 700;
    text-transform: uppercase; }

  .normal {
    font-size: 2.2em;
    font-weight: 300;
    text-transform: uppercase; }

  .normalBold {
    font-size: 2.4em;
    font-weight: 700;
    text-transform: uppercase; }

  .large {
    font-size: 2.8em;
    font-weight: 300;
    text-transform: uppercase; }

  .largeBold {
    font-size: 3.0em;
    font-weight: 700;
    text-transform: uppercase; }

  .blocktitle {
    font-size: 3.8em;
    font-weight: 500;
    text-transform: uppercase; }

  .blocktitleBold {
    font-size: 4em;
    font-weight: 700;
    text-transform: uppercase; }

  .author {
    font-size: 0.9em;
    font-weight: 300;
    font-style: italic;}
    
  .blocktext-flex{
    display: flex;
    width: 100%;
    margin-top: 8rem;
    /*padding: 0 4% 2% 4%;*/
    line-height: 1.05;
    font-family: "Oswald", sans-serif;
    text-transform: uppercase;
    position: relative; }

  .blocktext{
    display: table;
    width: 100%;
    /*padding: 0 4% 2% 4%;*/
    line-height: 1.05;
    font-family: "Oswald", sans-serif;
    text-transform: uppercase;
    position: relative; }
    
    blockquote p {
    display: inline;
    font-size: 1.4rem;}
  }
    
/*ANCHORS (links)*/

/* Remove the gray background color from active links in IE 10. */
a {
  background: transparent; }

/* Improve readability when focused and also mouse hovered in all browsers. */
a:active,
a:hover {
  outline: 0; }


  a, li a{
        text-decoration: none;
     }
    
    a:active, .nav-item:active {
      -webkit-transition: all 0.6s ease;
      -moz-transition: all 0.6s ease;
      -ms-transition: all 0.6s ease;
      -o-transition: all 0.6s ease;
      transition: all 0.6s ease;
      }
      
    a:visited {
      -webkit-transition: all 0.6s ease;
      -moz-transition: all 0.6s ease;
      -ms-transition: all 0.6s ease;
      -o-transition: all 0.6s ease;
      transition: all 0.6s ease;
      }
      
    a:hover, .nav-item:hover {
      -webkit-transition: all 0.6s ease;
      -moz-transition: all 0.6s ease;
      -ms-transition: all 0.6s ease;
      -o-transition: all 0.6s ease;
      transition: all 0.6s ease;
      }
      
    a:focus {
      -webkit-transition: all 0.6s ease;
      -moz-transition: all 0.6s ease;
      -ms-transition: all 0.6s ease;
      -o-transition: all 0.6s ease;
      transition: all 0.6s ease;
      }

a:hover,a:focus,
.nav-tabs > li > a:hover, .nav-tabs > li > a:focus{
      -webkit-transition: all 0.6s ease;
      -moz-transition: all 0.6s ease;
      -ms-transition: all 0.6s ease;
      -o-transition: all 0.6s ease;
      transition: all 0.6s ease;
      background-color: transparent;
      /*color: #15ced8;*/
      }


/* LISTS */

.list-group-item{
    background: transparent!important;
}

body ul{
  font-size: 1.1rem;
}

/*.linkicon--round .icon {
    width: 1.5em;
    height: 1.5em;
}*/

/* TAGS */

.views-field-field-featured{
    float: left;
}

.views-field-field-featured .tag-list{
    padding-right: 0.5em;   
}

.views-field-field-tags .tag-list {
    display: inline-flex;
}

.views-field-field-tags .aos-animate{
    padding-right: 0.5em;
}

.field__flags__item {
  display: inline-flex;
}

.flag{
  zoom:175%;
}

/* AUDIO */

audio{
  display: block;
}


/* IMAGES */

img {
    max-width: 100%;
    border-radius: 1%;    
}

.field--name-field-image-caption {
  margin-top: -1em;
}

/* BLOX */

.blox_img img {
  width: 100%;
}

.blox_iframe iframe{
  width: 100%!important;
}

/* STORE WIDGET */

.cvECsa{
  max-width:fit-content!important;
}


/* NODE CONTENT */

.summary-jumbotron{
    margin-top: 1%;
    padding: 1rem;
    /*border-radius: 0.5rem;*/
    background-color: #341200;
}

.slug-jumbotron{
    margin-top: 1%;
    padding: 0.8rem;
    /*border-radius: 0.5rem;*/
    background-color: #952200;
}

/* VIEWS */

.view-audio-content .views-row {
    margin: 1.5em 10px;
    padding: 0.5em 10px;
    font-size: 1.5rem;
    /*quotes: "\201C";*/
}

.view-audio-content .views-row:before {
    /*content: open-quote;*/
    font-size: 4em;
    line-height: 0.1em;
    margin-right: 0.25em;
    vertical-align: -0.4em;
}

.view-blox-sidebar .row, .view-video-content .row, .view-spotify-sidebar .row, .view-video-sidebar .row, .view-tiktok-sidebar .row, .view-twitter-content .row{
    display: inline!important;
}

.view-video-content .row, .view-cover-video .row {
    display: block!important;
}

.view-soundcloud-content .views-row, .view-content .views-row{
    width:100%;
}

.view-voting-sidebar .row, .view-featured-images .row {
    margin-left: 0!important;
    margin-right: 0!important;
}

/* VIEWS: SPOTIFY SIDEBAR */

.video-embed-field-responsive-video{
  height: 490px;
}

.view-spotify-sidebar .video-embed-field-responsive-video iframe{
  position: relative;
  height: 480px;
}

.view-tiktok-sidebar .video-embed-field-responsive-video {
  position: relative;
  height: 740px;
}

#block-views-block-related-content-block-1 .col-auto,
#block-views-block-related-content-block-2 .col-auto{
    padding: 0;
}

#block-views-block-video-sidebar-block .views-field-field-media-video-embed-field, .hr{
    padding: 5px 0;
}

.field--name-field-media-video-embed-field .field__label{
    display: none;
}

.views-field-field-image-caption{
    padding: 0.6rem;
    border-radius: 0.5rem;
    background-color: transparent;
    color: #292929;
    }

.view-featured-images .views-row{
    padding-bottom: 10px;
}
.field--name-field-media-video-embed-field .field__label{
    display: none;
}

/* FEATURED BOTTOM */

@media screen and (max-width: 979px) {
.region-featured-bottom-first{
    padding: 0.3rem;
    margin-bottom: 0;
    background: transparent;
    }
}

@media screen and (min-width: 980px) {
.region-featured-bottom-first{
    padding: 4rem;
    margin-bottom: 0;
    background: transparent;
    }
}

@media screen and (min-width: 1440px) {
.region-featured-bottom-first{
    padding: 6rem;
    margin-bottom: 0;
    background: transparent;
    }
}


/* FOOTER */


.wn-footer {
    width: 100%;
    padding: 2.5rem 0;
    text-align: center;
}
 
.wn-footer a {
}

/* COMMENT */
   
@media (max-width: 979px) {
    .comment__meta {
     position:absolute;
    }
}

/* COLLAPSIBLOCK */

.collapsiblockTitle button, .collapsiblockTitleCollapsed button {
    background-size:10px!important;
    }

.collapsiblockTitle h2 {
    color: ivory;
    margin-left: 2%;
    }

.collapsiblockTitle h2:hover {
    color: #f4264e;
    margin-left: 2%;
    }

#collapse-article_comments_block-content .row{
   display:block;

   }

/* PAYPAL BUTTON */
    
#donate-button-container .row > [class*='col-'] {
   flex-direction: inherit;
}


/* IFRAME WIDGET */

.rumble-container{
    overflow: hidden;
    position: relative;
    }    

@media screen and (max-width: 979px) {
.rumble-container iframe {
    border: 0;
    height: 320px;
    left: 0;
   /*position: absolute;*/
    top: 0;
    width: 100%;
    } 
}

@media screen and (min-width: 980px) {
.rumble-container iframe {
    border: 0;
   /* height: auto;*/
    left: 0;
   /*position: absolute;*/
    top: 0;
    width: 100%;
    } 
}

/* MUSIC PARTNERS */

#block-ubuntufm-music-partners .table {
color:inherit;
}

#block-ubuntufm-music-partners .table tr{
border-top:none!important;
border-style:none;
text-align:center;
}

#block-ubuntufm-music-partners .table td{
border-top:none!important;
border-style:none;
text-align:center;
}

#block-ubuntufm-music-partners p {
margin:0;
font-size:1rem;
}

/* RADIO WIDGET */

.player-container{
    overflow: hidden;
    position: relative;
}    

.player-container iframe {
    border: 0;
    height: auto;
    left: 0;
   /*position: absolute;*/
    top: 0;
    width: 100%;
} 

    #Player{
    /*min-width: 95%;*/
    width: 100%;
    height:400px;    
} 

@media (min-width: 1024px) and (max-width: 1366px) {
.sidebar_first .orbL{
    width:300px!important;
    }
}

@media (min-width: 1367px) and (max-width: 1439px) {
.sidebar_first .orbL{
    width:330px!important;
    }
}

@media (min-width: 1440px) {
.sidebar_first .orbL{
    width:420px!important;
    }
}

.orbL { width:100%!important; }

.orbLtn, .orbILi ,.orbILi>a {
    font-family: "Roboto", sans-serif;
    font-size: 1.1rem!important;
}

ul.orbIL { overflow:hidden;}

.playlist-container {
    overflow: hidden;
    position: relative;
}  

.playlist-container iframe {
    border: 0;
    height: auto;
    left: 0;
    top: 0;
    width: 100%;
}
    
    #Playlist{
    width: 100%;
    height:260px;
} 
