﻿@font-face {
    font-family: 'Graphik-Light';
    src: url('Fonts/Graphik-Light.otf');
    /*src: url('fonts/on-air-regular-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/on-air-regular-webfont.woff') format('woff'), url('fonts/on-air-regular-webfont.ttf') format('truetype'), url('fonts/on-air-regular-webfont.svg#OnAirRegular') format('svg');*/
    font-weight: normal;
    font-style: normal;

}

@layer theme {
    :root, :host {
        --color-joyrise: #f16721;
        --color-indigo-600: #f16721;
        --text-sml: 0.755rem;
    }
}
header {
    background: #fff
}
nav {
    background: #fff;
    width:100%;
}
html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: 'Graphik-Light';
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
}

.top-bg {
    background: #f16721; color: #f5b695;
}
.top-contact {
    background-color: #f5b695;
    width: 1px;
    height: .8rem;
    margin-top: .15rem;
    margin-right:15px
}
.text-orange-400 {
    color: #f5b695;
}
.text-orange-400 {
    color: #f5b695;
}
.group-hover\:text-orange-500:hover {
    color: #f16721;
    font-weight: 900
}
.group-hover\:text-orange-400:hover {
    color: #f5b695;
    font-weight: 900
}
.text-orange:hover {
    color: #f16721;
}
.text-sml {
    font-size: var(--text-sml);
}
.bg-green-900 {
    background: #141d15
}
.bg-orange-400 {
    background: #f5b69568
}
header {
    position: fixed;
    z-index: 51;
}
.header-top {
    transition: top 1s;
    position: fixed;
    top: 40px;

}
.topnav {
    position: fixed;
    top: 0;
    transition: top 1s;
    width: 100%;

}

.header-top.fixed {
    top: 0px;
    margin-top: 0px;
    animation-duration: 4s;
}


.topnav.fixed {
    top: -30px;
    opacity: 0.9;
    animation-duration: 4s;

}

.border-b {
    border-bottom:1px #f5b69543 solid;
}
.rounded-top {
    border-top-right-radius: 0.5rem;
    border-top-left-radius: 0.5rem;
}


.h-50-screen {
    height: 65vh;
}
@keyframes fade-in-left {
    from {
        opacity: 0;
        transform: translateX(-40px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.fade-in-left {
    opacity: 0;
    animation: fade-in-left 1s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
@keyframes fade-in {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-in {
    opacity: 0;
    animation: fade-in 1s ease-out forwards;
}

@keyframes fade-in-up {
    from {
        opacity: 0;
        transform: translateY(40px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-in-up {
    opacity: 0;
    animation: fade-in-up 1s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@media (width <= 48rem) {
    .text-sm {
        font-size: 0.675rem;
    }
    .header-top {
        top: 10px;
        position: fixed
    }
    .small-slide-img{
        height:80%;


    }
    .h-50-screen {
        height: 35vh;
    }
}
