:root {
  --secondary: #f8e742;
  --main: #033d1e;
}
footer{
    background-color: var(--main);
    color: #fff;
}
footer .headline {
    border-bottom: 1px solid rgba(255,255,255,.1);
}
footer .headline h2, footer .headline h3, footer .headline h4, footer .headline h5, footer .headline h6 {
    border-bottom: 2px solid var(--secondary);
}
.social-icons li a {
	background-color: rgba(255,255,255,.2);
  background-color:var(--secondary);
  color:var(--main);
  border-radius: 5px;
}
dl.headlines.headlines-footer dd .text-muted {
	color: rgba(255,255,255,.5);
}
footer a,
dl.headlines.headlines-footer dd a {
	color: #ddd;
    color: rgba(255,255,255,.7);
}
footer a:focus,
footer a:hover,
dl.headlines.headlines-footer dd a:focus,
dl.headlines.headlines-footer dd a:hover {
	color: #fff;
}
header {
  background-color:var(--main);
}
header .sf-menu a {
  color:white;
}
header .sf-menu ul li a {
  color:black;
}
header .container .header-nav-top .login p a {
    color: var(--secondary);
}
header .container .header-nav-top .login p {
    color: var(--secondary);
}
.sf-menu.sf-arrows .sf-with-ul:after {
    border-top-color: var(--secondary);
}
section#content .content-header {
    background-color: var(--main);
}
section#content .content-header h2 {
  color:white;
}
section#content .content-header .breadcrumb>.active {
    color: white;
}
section#content .content-header .breadcrumb>.active {
    color: white;
}
section#content .content-header .breadcrumb a {
    color: var(--secondary);
}
#carousel-homepage.carousel .carousel-inner .item {
    height: 480px;
}

address:before {
    font-style: italic;
    font-weight:bold;
    font-size: 16px;
    content: "\"La Confrérie creates everlasting memories and friendships, while encouraging personal development and embracing inclusiveness\" \a ";
}



/*<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
.fa {
  padding: 50px;
  font-size: 30px;
  width: 50px;
  text-align: center;
  text-decoration: none;
  margin: 5px 2000px;
}

.fa:hover {
    opacity: 0.7;
}

.fa-facebook {
  background: #3B5998;
  color: white;
}


.fa-linkedin {
  background: #007bb5;
  color: white;
}

.fa-youtube {
  background: #bb0000;
  color: white;
}

.fa-instagram {
  background: #125688;
  color: white;
}

.fa-snapchat-ghost {
  background: #fffc00;
  color: white;
  text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}

</style>
</head>
<body>

<h2>Style Social Media Buttons</h2>

<!-- Add font awesome icons -->
<a href="#" class="fa fa-facebook"></a>
<a href="#" class="fa fa-linkedin"></a>
<a href="#" class="fa fa-youtube"></a>
<a href="#" class="fa fa-instagram"></a>

      
</body>
</html>*/