/* Fearless Radio CSS */
/* by xcellnet */
/* date 05/2021 */


/* img */
.img {
    border-radius:5px;
    border:2px solid #333;
}
/* top */
.top {
    margin-top:10px;
    margin-bottom: 10px;
}
/* logo */
.logo {
    padding: 5px;
}
.logo-img {
    align-content: center;
}
/* clock */
.clockdate-wrapper {
    background-color: #333;
    padding:10px;
    text-align:center;
    border-radius:5px;
    margin:0 auto;
}
.clockdate-wrapper p {
    background-color:#333;
    font-family: sans-serif;
    font-size:11px;
    text-shadow:0px 0px 1px #888;
    color:#fff;
    margin:0 auto;
    letter-spacing:10px;
}
#clock{
    background-color:#333;
    font-family: sans-serif;
    font-size:11px;
    text-shadow:0px 0px 1px #888;
    color:#fff;
    letter-spacing:10px;
}
#clock span {
    color:#fff;
    text-shadow:0px 0px 1px #888;
    font-size:11px;
    letter-spacing:10px;
}
#date {
    letter-spacing:10px;
    font-size:11px;
    font-family:arial,sans-serif;
    color:#fff;
    text-shadow:0px 0px 1px #888;
}
/*social media icon */
#social span{
    font-size: 32px;
}


/* content */
.ccx {
  position: relative;
  text-align: left;
  color: white;
  text-shadow:1px 1px 2px #333;
}

/* Bottom left text */
.bottom-left {
  position: absolute;
  bottom: 8px;
  left: 16px;
}
/* Top left text */
.top-left {
  position: absolute;
  top: 8px;
  left: 16px;
}
/* Top right text */
.top-right {
  position: absolute;
  top: 8px;
  right: 16px;
}

/* Bottom right text */
.bottom-right {
  position: absolute;
  bottom: 8px;
  right: 16px;
}

/* Centered text */
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* footer */
.footer {
    margin-top: 10px;
    letter-spacing:4px;
    font-size:10px;
    font-family:arial,sans-serif;
    color:#fff;
    text-shadow:0px 0px 1px #888;
    background-color: #333;
    border-radius:5px;
    padding:10px;
}