.style-bubble-tag{
    display: inline-block;
    width: auto !important; 
    border-radius: 20%;
}

.style-card-header{
    height:10vw;
    width:100%;
    background-repeat: no-repeat;
    background-size:cover;
}

.style-div-bg-img{
    background-repeat: no-repeat;
    background-size:cover; 
}

.style-card-icon{
    height:15vh;
    width:15vh;
    border-radius:50%;
    background-repeat: no-repeat;
    background-size:cover;
}

.style-hero-media{
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
.style-hero-ratio{
    width:100%;
    aspect-ratio: 6 / 3;
}

.style-ratio-1-1{
    width:100%;
    aspect-ratio: 1; 
}

.style-text-embed-img{
    width:33%;
}


/*Third Party Social Styling*/
.color-icon-amazon
.color-icon-apple,
.color-icon-spotify,
.color-icon-youtube{ color: #AAB; }

.color-icon-amazon:hover{ color: #FFA500; }
.color-icon-apple:hover{ color: #BF40BF; }
.color-icon-spotify:hover{ color: #1DB954; }
.color-icon-youtube:hover{ color: #ed302f; }

.style-podcast-icon{
    font-size: 20pt;
}

.interactive-card-link{
    padding:0px;
    margin:0px;
    text-decoration: none;
}

#navbar .nav-item,
#navbar .nav-item:visited{
    color: #000;

    padding: 2px 15px;
    margin: 0px 0px;
    border-radius: 20%;
    display:inline-block;
    width: auto;
    border-width: 2px;
    border-style: solid;
    
}
#navbar .nav-item:hover,
#navbar .nav-item:active{
    
    border-color:  #ffefdb;
    
}

#navbar a{
    text-decoration: none;
    padding: 0px;
    margin-left: 5px;
    margin-right: 5px;
}



.font-size-xl{ font-size: 20pt; }
.font-size-large{ font-size: 16pt; }
.font-size-medium{ font-size: 10pt; }
.font-size-small{ font-size: 8pt; }

.font-style-heading{
    font-family: 'Avantgarde', 'TeX Gyre Adventor', 'URW Gothic L', sans-serif;
    font-style: normal;
    font-weight: 300;
}

.font-style-paragraph{
    font-family: 'OCR A Std', monospace;
    font-style: normal;
    font-weight: 100;
}

.text-style-wordbreak{ word-wrap: break-word; }

body{
    /*background-color: #fbf7f5 !important;*/
    background-color: #000 !important;
}

.color-grey-bg{ background-color: #fbf7f5; }

.color-cream-bg{ background-color: #fffaf0; }
.color-smokey-bg{ background-color: #000; }

.font-style-color-cream{ color: #fffaf0;}
.font-style-color-smoke,
.font-style-color-smoke:hover,
.font-style-color-smoke:visited{
    color: #023;
    text-decoration: none;
}

.font-antistyle-link,
.font-antistyle-link:active,
.font-antistyle-link:link,
.font-antistyle-link:hover,
.font-antistyle-link:visited{
    text-decoration: none !important;
}

/* Dark Colors */
.bg-color-earth-green{ background-color: #6f826a; }
.bg-color-gold{ background-color: #d4af37; }
.bg-color-navy-blue{ background-color: #000435; }
.bg-color-earth-green-translucent{ background-color: rgba(111, 130, 106, 0.7); }
.bg-color-gold-translucent{ background-color: rgba(212, 175, 55, 0.7); }
.bg-color-navy-blue-translucent{ background-color: rgba(0, 4, 53, 0.7); }
.bg-color-cream-translucent{ background-color: rgba(255, 250, 240, 0.7); }

/*SVG Colors. Generator used: https://angel-rs.github.io/css-color-filter-generator/ */
.filter-pastel-red{ filter: brightness(0) saturate(100%) invert(50%) sepia(63%) saturate(510%) hue-rotate(314deg) brightness(102%) contrast(105%); }
.filter-pastel-blue{ filter: brightness(0) saturate(100%) invert(89%) sepia(4%) saturate(3060%) hue-rotate(162deg) brightness(105%) contrast(90%); }
.filter-pastel-green{ filter: brightness(0) saturate(100%) invert(91%) sepia(5%) saturate(1984%) hue-rotate(69deg) brightness(103%) contrast(84%); }
.filter-cream{ filter: brightness(0) saturate(100%) invert(92%) sepia(34%) saturate(213%) hue-rotate(30deg) brightness(111%) contrast(108%); }

.bg-color-pastel-red{ background-color: #ff746c; }
.bg-color-pastel-blue{ background-color: #b3ebf2; }
.bg-color-pastel-green{ background-color: #adebb3; }
.grid-style-child-bottom{
    position: absolute;
    bottom: 0;
}

.grid-style-child-right{
    position: absolute;
    right: 0;
}

.layout-rounded-border1{
    border-radius: 10%;
}

.layout-rounded-border2{
    border-radius: 50%;
}

.layout-bg-image-cover{ background-size: cover; }