/* ******************************************************************************************** */

@font-face {
    font-family: 'fontello';
    src: url(../fontello/font/fontello.ttf);
}

/* Setting Up Font Families ******************************************************************* */
.f-prime {
    font-family: $font-prime !important;
    word-wrap: normal;
}
.f-second {
    font-family: $font-second !important;
}
.f-third {
    font-family: $font-third !important;
}

/* Setting Up Font Colors ********************************************************************* */
.primes {
    color: $color-prime !important;
}
.seconds {
    color: $color-second !important;
}
.thirds {
    color: $color-third !important;
}
.fourths {
    color: $color-quad !important;
}

.white {
    color: #FFFFFF !important;
}
.black {
    color: #000000 !important;
}

.shadows {
    text-shadow: 1px 2px 4px rgba(0, 0, 0, 0.33) !important;
}
.upper {
    text-transform: uppercase !important;
}

/* Setting Up Background Colors *************************************************************** */
.prime-bg-color {
    background-color: $color-prime !important;
}
.secondary-bg-color {
    background-color: $color-second !important;
}
.third-bg-color {
    background-color: $color-third !important;
}

/* Setting Up Base for Lists ****************************************************************** */
ol {
    &.listbad {
        li {
            padding:1%;
        }
    }
}
ul {
    &.listpad {
        li {
            padding:1%;
        }
    }
}

/* Fontello Related List Styling ************************************************************** */
.icon {
    list-style-type:none;
    padding:0;
    li {

        &::before {
            font-family: "fontello";
            text-decoration:none;
            content: "\e819 \00a0";
            display:inline-block;
            speak:none;
        }
    }
}
.dashed {
    list-style-type:none;
    padding:0;
    li {

        &::before {
            content: "-\00a0";
            display:inline-block;
        }
    }
}
.checked {
    list-style-type:none;
    padding:0;
    li {

        &::before {
            font-family: "fontello";
            text-decoration:none;
            content: "\e80f \00a0";
            display:inline-block;
            speak:none;
        }
    }
}

/* FontAwesome List Icon Styling ************************************************************** */
.icon-li, .checkmark-li, .dashed-li {
    list-style-type: none;
    padding: 0px;
    &::before {
        display: inline-block;
    }
    li {
        &::before {
            text-decoration: none;
            padding-right: 0.5rem;
            speak: none;
        }
    }
}
.icon-li {
    li {
        &::before {
            font-family: "FontAwesome-Brands";
            content: fa-content($fa-var-twitter);
        }
    }
}
.checkmark-li {
    li {
        &::before {
            font-family: "FontAwesome-Solids";
            content: fa-content($fa-var-check);
        }
    }
}
.dashed-li {
    li {
        &::before {
            font-family: "FontAwesome-Solids";
            content: fa-content($fa-var-grip-lines);
        }
    }
}

/* Overlay Service Boxes with FontAwesome Icons Styling *************************************** */
.user-icon, .envelope-icon, .twitter-icon, .search-icon {
    @extend %fa-icon;
}
.user-icon {
  @extend .fas;
  &:before {
    content: fa-content($fa-var-user);
  }
}
.envelope-icon {
    @extend .fas;
    &:before {
        content: fa-content($fa-var-envelope);
    }
}
.twitter-icon {
    @extend .fab;
    &:before {
        content: fa-content($fa-var-twitter);
    }
}
.search-icon {
    @extend .fas;
    &:before {
        content: fa-content($fa-var-search);
    }
}

/* Accordion Styling ************************************************************************** */
#accordion .card-header button, .accordion .card-header button {
	white-space: normal;
	text-align: left;
}
#accordion {
	.card {
		border: 0px;
		margin: 0.25rem;
		.card-header {
			background-color: lighten($color-prime, 25%);
			border: 0px;
			padding: 0.5rem;
			h5 {
				button {
					font-family: $font-prime;
					font-weight: normal;
					letter-spacing: 1px;
					text-transform: uppercase;
					text-align: left;
					color: white !important;
					text-decoration: none;
					&:hover {
						text-decoration: none;
					}
				}
			}
		}
		.card-body {
			font-family: $font-second;
			font-weight: normal;
			font-size: 0.9rem !important;
			color: #555555 !important;
			p {
				font-family: $font-second;
				font-weight: normal;
				font-size: 0.9rem !important;
				color: #555555 !important;
			}
		}
	}
}

/* H3 Link to Contact Form ******************************************************************** */
.req-form {
	color: $color-quad !important;
    transition: all 0.5s ease;
	&:hover {
		color: $color-prime !important;
	}
}

/* Setting Up Breadcrumb Styling ************************************************************** */
.breadcrumb {
    background-color: transparent;
    border-left: 6px solid darken($color-third, 15%);
    border-bottom: 1px solid darken($color-third, 15%);
    background: none;
    padding: 0.33rem 1rem;
    font-family: $font-third;
    font-size: 0.88rem;
    font-weight: normal;
    text-transform: uppercase;
    color: $color-second !important;
    a {
        color: $color-second !important;
    }
}
.breadcrumb-item {
    font-family: $font-third;
    font-size: 0.88rem;
    font-weight: normal;
    &::before {
        color: darken($color-third, 15%) !important;
    }
    +.active {
        color: darken($color-third, 15%) !important;
    }
}

#sidebar {
    background-color: rgba($color-prime, 0.5);
    box-sizing: border-box;
}

/* ******************************************************************************************** */