:root {
	
	--font: 'Open Sans', sans-serif;
	--alternative-font: 'Great Vibes', cursive !important;
	
	--background-color: #f9eacd;
	--brand-color: #4a4241;
	--highlight-color: #b02b2c;
	
	--main-header-topbar-bg-color: #515251;
	--main-header-topbar-font-color: #ffffff;
	
}

/* *** */

a, .btn {

    transition: color 0.5s ease-out 0s;
	
}

/* *** */

div.title-separator {
    position: relative;
    margin: 2rem auto 4rem;
}

div.title-separator:before {
    
	content: '';
    display: block;
    margin: auto;
    left: 50%;
    height: 1px;
    width: 50px;
    bottom: -15px;
    background: var(--brand-color);
    transition: width .8s ease, background-color .8s ease;
    margin-bottom: 6px;
	
}

div.title-separator:after {
    
	width: 100px;
    display: block;
    margin: auto;
    content: "";
    height: 1px;
    background: var(--brand-color);
    bottom: 0px;
    left: 50%;
    transition: width .8s ease, background-color .8s ease;
	
}

.container:hover div.title-separator:before{
	
	width: 100px;
	
}

.container:hover div.title-separator:after{
	
	width: 50px;
	
}