body{
	display: flex;
  	min-height: 100vh;
  	flex-direction: column;
}

.body{
	 flex: 1;
}

.hero.has-image{
    position: relative;
}

.hero.has-image .hero-body{
    padding-bottom: 5rem;
    padding-top: 5rem;
}

.hero.has-image .hero-body{
    z-index: 1;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.hero.has-image .hero-body:before{
	content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1;
    background-color: rgba(0,0,0,0.5);
    height: 100%;
}

.hero.has-image .hero-body h1{
	z-index: 2;
    position: absolute;
    width: 100%;
    left:0;
    display: flex;
    text-align: center;
    align-content: center;
    height: 100%;
    justify-content: center;
    top: 0;
    align-items: center;
}

.content.padded{
	padding: 0 1.5rem;
}

.content.padded .hero-body{
	padding: 3rem 0;
}

.is-h100{
    height: 100%;
}

.reversed{
    flex-direction: row-reverse;
}

@media screen and (max-width: 1087px){ .reversed > .column{ padding: .75rem 0 } }    

body{
    font-family: 'Montserrat', sans-serif;
}
.is-script{
    font-family: 'Allura', cursive;
}
.cols .card{
    width:30%;
    margin:0 auto;
    margin-bottom: 20px;
}
.body{
    position: relative;
}
.body > div:not(.mandalas){
    z-index: 2;
    position: relative;
}
.tile > .card{width:100%}
a.card-image > figure{overflow:hidden}
a.card-image > figure:before{content: "";
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);
    transition: 0.25s top ease-out;
}
a.card-image > figure:hover:before{
    top: 0%;
}
a.card-image > figure > div{
    position: absolute;
    width: 100%;
    height: 100%;
    color:#fff;
    z-index: 3;
    font-size:2em;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 0;
}
a.card-image > figure > div:hover{
    opacity: 1;
    transition: 0.5s opacity ease-out;
    transition-delay: 0.2s;
}
a.card-image > figure > div > strong{
    font-size:1.25em;
    width: 2em;
    display: flex;
    height: 2em;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    position: relative;
}

a.card-image > figure > div > div{
    padding-top: 0.25em;
}

a.card-image > figure > div > strong:after{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    content: "";
    transform-origin: center;
    border-radius: 100%;
    opacity: 0;
    transform: scale(1.5);
    border: 0.1em solid #fff;
    transition-delay: 0.25s;
    transition: opacity 0.75s, border 0.75s, transform 0.75s;
}

a.card-image > figure > div:hover > strong:after{
    opacity: 1;
    transform: scale(0.9);
    border-width: 0.05em;
}
.mandalas{
    position: fixed;
    top:0;bottom:0;
    left:0;right:0;
    width:100%;height:100%;
    z-index: 1;
}
.mandala{
    position: absolute;
    width: 45vw;
    height: 45vw;
    top: -10%;
    right: -5%;
    max-height: 600px;
    max-width: 600px;
    background: url('/img/mandala.svg') no-repeat;    
    background-size: 100% 100%;
}
.mandala.bottom{
    top: auto;
    right: auto;
    bottom:-10%;
    left:-5%;
}
.body.homepage ~ .mandalas .mandala{top: -20%}
.body.homepage ~ .mandalas .mandala.bottom{top:auto;bottom:-20%}

nav.navbar, .navbar-menu, .navbar-dropdown{
    background-color:#5c5a5c    }
nav.navbar .navbar-item, nav.navbar .navbar-link{
    color: #d5f389;
}
.navbar-link::after{
    border-color: #d5f389;
}
.navbar.is-transparent .navbar-dropdown a.navbar-item:hover{
    color:#fff;
}

.button.is-link, .menu-list a.is-active{
    background-color:#d5f389;
    color:#5c5a5c    
}
.button.is-link.is-outlined{
    border-color:#d5f389;
    color:#d5f389;
}
.button.is-link.is-outlined:hover{
    background-color:#d5f389;
    border-color:#5c5a5c;
    color:#5c5a5c;
}
.body{
    background-color: #f7eeda   
}
.footer{
    background-color:#5c5a5c    
}
.footer .title, .footer, .footer a{
    color: #d5f389    
}

a.card-content, a.card-image{
    display:block;
    color: #4a4a4a;
}
@media screen and (max-width: 768px) {
    .card{
        width: 100% !important;
        position: static !important;
        max-width: 480px;
    }
    .mandalas{
        display:none;
    }
    nav h2.navbar-item{padding: 0 0.75rem}
    .navbar-menu.is-active{
        position: absolute;
        width: 100%;
    }
    .modal-card{
        margin: 0 auto;
    }
    .mycols{
        max-width: 410px;
        margin: 0 auto;
    }
    .full-width{
        max-width: 100%;
    }
}

.navbar.is-transparent .navbar-dropdown a.navbar-item.is-active {background-color: transparent;font-weight:600;color: inherit;padding-left: 1.5em}

@media screen and (max-width: 1087px){ .biopic img{max-height: 300px;} }
@media screen and (min-width: 1280px){ .no-large{display:none} }
@media screen and (max-width: 1279px){ .no-mobile{display:none} }
@media screen and (max-width: 415px) {
    nav h2.is-size-1 { font-size: 2rem!important}
}
.footer{
    z-index: 2;
    position: relative;
}