﻿:root {
    --light-right: #eff5f5;
    --dark-green: #1AB69D;
    --dark-orange: #eb6440;
}

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,900;1,900&family=Quicksand:wght@300..700&display=swap');

html {
    scroll-behavior: smooth;
}

.navbar-transparent {
    background-color: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(10px);
    transition: background-color 0.3s ease, backdrop-filter 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
* {
    font-family: "Plus Jakarta Sans", sans-serif;
}

a{
    text-decoration: none;
}

.sans-serif{
    font-family: sans-serif;
}

.lowongan {
    background-color: var(--dark-green);
    padding: 0.8em 1.2em;
    color: white;
    font-size: 1.2rem;
    margin-top: 2em;
    border-radius: 10px;
    font-weight: 700;
    transition: 300ms all ease;
    z-index: 3;
}

.lowongan:hover {
        filter: brightness(1.25);
        color: #22393a;
    }

   

section {
    min-height: 100vh;
    padding: 4em 0;
}

    section h1 {
        font-weight: 800;
        font-size: 3rem;
        text-align: center;
        /*margin-bottom: 1em;*/
    }


.animate-up {
    overflow-y: hidden;
}

    .animate-up span {
        position: relative;
        animation: float-up 1s ease-in-out;
    }

.animate-float {
    position: relative;
    animation: float 600ms linear infinite alternate;
}

.icon-svg {
    width: 30px;
}

@keyframes float-up {
    0% {
        top: 100%;
    }

    100% {
        top: 0%;
    }
}

@keyframes float {
    0% {
        top: 0;
    }

    100% {
        top: 10px;
    }
}
@font-face {
    font-family: 'Font Awesome 5 Pro';
    font-style: normal;
    font-weight: 300;
    src: url(../webfonts/fa-light-300.eot);
    src: url(../webfonts/fa-light-300.eot?#iefix) format("embedded-opentype"),url(../webfonts/fa-light-300.woff2) format("woff2"),url(../webfonts/fa-light-300.woff) format("woff"),url(../webfonts/fa-light-300.ttf) format("truetype"),url(../webfonts/fa-light-300.svg#fontawesome) format("svg")
}

.fal {
    font-family: 'Font Awesome 5 Pro';
    font-weight: 300
}

.fa, .fab, .fad, .fal, .far, .fas {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1
}

.fa-lg {
    font-size: 1.33333em;
    line-height: .75em;
    vertical-align: -.0667em
}

.fa-xs {
    font-size: .75em
}

.fa-sm {
    font-size: .875em
}

.fa-1x {
    font-size: 1em
}

.fa-2x {
    font-size: 2em
}

.fa-3x {
    font-size: 3em
}

.fa-4x {
    font-size: 4em
}

.fa-5x {
    font-size: 5em
}

.fa-6x {
    font-size: 6em
}

.fa-7x {
    font-size: 7em
}

.fa-8x {
    font-size: 8em
}

.fa-9x {
    font-size: 9em
}

.fa-10x {
    font-size: 10em
}

.fa-fw {
    text-align: center;
    width: 1.25em
}

.fa-ul {
    list-style-type: none;
    margin-left: 2.5em;
    padding-left: 0
}

    .fa-ul > li {
        position: relative
    }

.fa-li {
    left: -2em;
    position: absolute;
    text-align: center;
    width: 2em;
    line-height: inherit
}

.fa-border {
    border: solid .08em #eee;
    border-radius: .1em;
    padding: .2em .25em .15em
}

.fa-pull-left {
    float: left
}

.fa-pull-right {
    float: right
}

.fa.fa-pull-left, .fab.fa-pull-left, .fal.fa-pull-left, .far.fa-pull-left, .fas.fa-pull-left {
    margin-right: .3em
}

.fa.fa-pull-right, .fab.fa-pull-right, .fal.fa-pull-right, .far.fa-pull-right, .fas.fa-pull-right {
    margin-left: .3em
}

.fa-spin {
    -webkit-animation: fa-spin 2s infinite linear;
    animation: fa-spin 2s infinite linear
}

.fa-pulse {
    -webkit-animation: fa-spin 1s infinite steps(8);
    animation: fa-spin 1s infinite steps(8)
}

@-webkit-keyframes fa-spin {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes fa-spin {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

.fa-rotate-90 {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.fa-rotate-180 {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.fa-rotate-270 {
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg)
}

.fa-flip-horizontal {
    -webkit-transform: scale(-1,1);
    transform: scale(-1,1)
}

.fa-flip-vertical {
    -webkit-transform: scale(1,-1);
    transform: scale(1,-1)
}

.fa-flip-both, .fa-flip-horizontal.fa-flip-vertical {
    -webkit-transform: scale(-1,-1);
    transform: scale(-1,-1)
}

:root .fa-flip-both, :root .fa-flip-horizontal, :root .fa-flip-vertical, :root .fa-rotate-180, :root .fa-rotate-270, :root .fa-rotate-90 {
    -webkit-filter: none;
    filter: none
}

.fa-stack {
    display: inline-block;
    height: 2em;
    line-height: 2em;
    position: relative;
    vertical-align: middle;
    width: 2.5em
}

.fa-stack-1x, .fa-stack-2x {
    left: 0;
    position: absolute;
    text-align: center;
    width: 100%
}

.fa-stack-1x {
    line-height: inherit
}

.fa-stack-2x {
    font-size: 2em
}

.fa-inverse {
    color: #fff
}

.fa-500px:before {
    content: "\f26e"
}

.fa-search:before {
    content: "\f002"
}

.fa-search-dollar:before {
    content: "\f688"
}

.fa-search-location:before {
    content: "\f689"
}

.fa-search-minus:before {
    content: "\f010"
}

.fa-search-plus:before {
    content: "\f00e"
}

.fa-searchengin:before {
    content: "\f3eb"
}