/*---------------------------
   General
  ----------------------------*/

h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
    font-family: var(--bs-body-font-family);
    font-weight: 400 !important;
}

h6 {
    color: var(--bs-gray-300);
    text-transform: uppercase;
}

p, li {
    font-family: var(--bs-font-sans-serif);
    font-size: 1rem;
    font-weight: 300;
    margin-bottom: 0.5rem;
}

p a, a.link-underline {
    background-image: linear-gradient(to bottom, var(--bs-orange) 0%, var(--bs-orange) 100%) !important;
    border-color: var(--bs-orange) !important; /* overwriting existing style */
    font-weight: var(--semi);
    padding: 0 2px;
    padding-top: 5px;
}

p a:hover, a.link-underline:hover {
    background-image: linear-gradient(to bottom, var(--bs-orange) 0%, var(--bs-orange) 100%) !important;
}

.bg-white p a:hover {
    color: #000;
}

.btn {
    -webkit-border-radius: 0.5rem;
    -moz-border-radius: 0.5rem;
    border-radius: 0.5rem;
    -webkit-transition: border-color .3s ease-in-out;
    -o-transition: border-color .3s ease-in-out;
    transition: border-color .3s ease-in-out;
    /*
    -webkit-transition: background-size .3s ease-in,color .3s ease-in;
    -o-transition: background-size .3s ease-in,color .3s ease-in;
    transition: background-size .3s ease-in,color .3s ease-in;*/
}

.btn:hover {
    -webkit-transition: border-color .3s ease-in-out;
    -o-transition: border-color .3s ease-in-out;
    transition: border-color .3s ease-in-out;
    /*
    -webkit-transition: background-size .3s ease-in,color .3s ease-in;
    -o-transition: background-size .3s ease-in,color .3s ease-in;
    transition: background-size .3s ease-in,color .3s ease-in;*/
}


@media (max-width: 991px) {
    .btn {
        width: 100%;
    }
}

hr {
    margin: 5rem 0;
}

/*---------------------------
   Custom Font Styles
  ----------------------------*/

/*
ul.fw-light li {
    font-weight: 300 !important;
    font-family: var(--bs-font-sans-serif);
} */


/*---------------------------
   Navbar
  ----------------------------*/

.navbar.navbar-dark .nav-link:hover {
    border-color: var(--bs-lt-orange);
}

a.nav-link:active, .navbar.navbar-dark .nav-link.active {
    border-color: var(--orange);
}

li.nav-item {
    font-size: 1rem;
    margin-bottom: 0;
    text-align: center;
    padding: 10px 0;
}

li.nav-item:last-child {
    padding-bottom: 0;
}

/* Contact BTN */

@media (min-width: 992px) {
    .nav-contact {
        margin-top: 0.5rem;
        /*
        padding: 0.5rem 0.8rem !important;
        margin: 0.5rem 0 !important;
        border: 3px solid white !important;
        -webkit-border-radius: 0.5rem;
        -moz-border-radius: 0.5rem;
        border-radius: 0.5rem;
        */
    }
}
@media (max-width: 991px) {
    .navbar.navbar-dark .nav-link.active {
        color: var(--bs-orange);
        font-weight: semi-bold;
    }
}

.navbar .nav-item + .nav-item::before { 
    content: "";
} 

/*
.nav-contact:after {
    content: "\e0be";
    font-family: "Material Icons";
} */

/*
.nav-contact:hover {
    border-color: var(--bs-orange) !important;
    transition: border-color .2s linear;
}*/


/*---------------------------
   Home Page
  ----------------------------*/

.bg-cover {
    background-image: url('../img/bg-pattern.jpg');
    box-shadow: inset 0 0 0 1000px rgba(0,0,0,.2);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    /*position: relative;*/
    overflow: auto;
}

/*---------------------------
   Portfolio - Home Page
  ----------------------------*/

li.col-sm-6.col-xl-4 {
	padding: 0.5rem;
    margin: 0.25rem 0;
}

figure.img-scale {
    margin-bottom: 0;
    padding-bottom: 0.5rem;
    background-color: var(--bg-med);
    /*border: 1px solid var(--bs-gray-400);*/

    -webkit-border-radius: 0.6rem;
    -moz-border-radius: 0.6rem;
    border-radius: 0.6rem;

    /*box-shadow: 2px 2px 4px 0px rgba(151,154,157,0.20);
    -webkit-box-shadow: 2px 2px 4px 0px rgba(151,154,157,0.20);
    -moz-box-shadow: 2px 2px 4px 0px rgba(151,154,157,0.20);
    */
}

figure.img-scale:hover {
    /*border: 2px solid var(--bs-gray-200);*/
}

.img-scale .img-wrap {
    width: 100%; /* Remove +1 overlap of border */
    -webkit-border-radius: 0.5rem 0.5rem 0 0;
    -moz-border-radius: 0.5rem 0.5rem 0 0;
    border-radius: 0.5rem 0.5rem 0 0;
}

.link-body-emphasis .content {
    margin: 0px;
    display: grid;
    margin-left: 1rem;
}

.link-body-emphasis .content span {
    font-size: 16px;
    margin-top: 0.5rem;
    color: RGBA(var(--bs-secondary-rgb), var(--bs-link-underline-opacity, 1)) !important;
}


/*---------------------------
   About
  ----------------------------*/

.work-experience{
    margin-bottom: 2rem;
}

.work-experience p, .work-experience h6 {
    margin-bottom: 0.5rem;
}


/*---------------------------
   Projects
  ----------------------------*/

.project-info {
    border: 1px solid var(--bs-gray-600);
    padding: 20px 0;
    margin: 0;
}

.youtube-video {
  aspect-ratio: 16 / 9;
  width: 100%;
}


/*-- Carousel --*/

.carousel-control-prev i, .carousel-control-next i {
    background-color: rgba(255,255,255,0.5);
    color: #000000;
}

.carousel-indicators {
    background-color: initial;
}

.carousel-indicators [data-bs-target] {
    background-color: var(--semi-black);
    height: 4px;
    opacity: 0.4;
}

.carousel-indicators .active {
    opacity: 1 !important; /*same as original css, but made !important*/
}

/*---------------------------
   Footer
  ----------------------------*/

.footer-copyright {
    font-size: 0.75rem;
    padding: 1rem;
    border-top: 1px solid var(--bs-gray-dark);
}

div#contact > i.material-icons, .nk-btn-center svg, a.nk-btn {
    vertical-align: baseline;
    color: var(--white);
    margin: 0 1rem;
    -webkit-transition: background-size .3s ease-in,color .3s ease-in;
    -o-transition: background-size .3s ease-in,color .3s ease-in;
    transition: background-size .3s ease-in,color .3s ease-in;
}

div#contact > i.material-icons:hover, .nk-btn-center svg:hover, a.nk-btn:hover {
    color: var(--bs-orange);
    -webkit-transition: background-size .3s ease-in,color .3s ease-in;
    -o-transition: background-size .3s ease-in,color .3s ease-in;
    transition: background-size .3s ease-in,color .3s ease-in;
}

/* To fix
a.nk-btn.light.nk-btn-center:after {
    content: "";
    position: absolute;
    bottom: -6px;
    width: 40px;
    color: var(--bs-orange);
    border-bottom: var(--line-border);
    -webkit-transition: .5s transform, .5s opacity;
    -o-transition: .5s transform, .5s opacity;
    transition: .5s transform, .5s opacity;
} */



/*---------------------------
   Transitions
  ----------------------------*/

body {
    opacity: 1;
    transition: 1s opacity;
}
body.fade-out {
    opacity: 0;
    transition: none;
}

html {
  background-color: black;
}