$primaryColor: #0c3444;
$secondaryColor: #0d575c;
$accentColor: #fbab04;
$secondaryColor: #0da5b0;

.bgprimary{
 background-color: $primaryColor !important;
}

.bgsecondarylight{
    background-color: rgba($color: $secondaryColor, $alpha: .3) !important;
   }

.colorPrimary{
    color: $primaryColor !important;
}

.accentColor{
    color: $accentColor !important;
}

.white{
    color: white !important;
}

#myentete {

    h1 {
        color: white !important;
    }

    .over {
        position: absolute;
        width: 100%;
        height: 77vh;

        background-color: rgba($color: $primaryColor, $alpha: .6);
    }
}

.myic1{

}

.myic1:hover{
    color: white !important;
    transition: 1s;

}

#navbar {
    position: fixed;
    top: 0;
    width: 100%;
    height: 10vh !important;
    z-index: 999999999999999999;
    transition: 1s;

    a.navbar-item {
        color: rgba($color: $accentColor, $alpha: 1) !important;
        background-color: transparent;
        transition: 1s;
    }

    a.navbar-item:hover {
        color: rgba($color: white, $alpha: 1) !important;
        background-color: transparent;
        transition: 1s;
    }

    background-color: rgba($color: $secondaryColor, $alpha: .25);
}

.menu-scrolled {
    // a.navbar-item{
    //     color: white;
    // }
    transition: 1s;

    a.navbar-item {
        color: rgba($color: white, $alpha: .8) !important;

    }

    .navbar-item.navbar-link {
        color: rgba($color: white, $alpha: .8) !important;
    }

    background-color: rgba($color: $primaryColor, $alpha: .85) !important;

}

.navbar-link {
    color: $accentColor  !important;
    background-color: transparent;
}

.navbar-link:hover {
    color: $primaryColor  !important;
    background-color: transparent;
}

.menu-scrolled:hover {
    // a.navbar-item{
    //     color: white;
    // }
    transition: 0.35s;

    a.navbar-item {
        color: $accentColor  !important;
        background-color: transparent;
    }

    a.navbar-item:hover {
        color: $primaryColor  !important;
        background-color: transparent;
    }

    .navbar-item.navbar-link {
        color: $accentColor  !important;
        background-color: transparent;
    }

    .navbar-item.navbar-link:hover {
        color: $primaryColor  !important;
        background-color: transparent;
    }

    background-color:$primaryColor  !important;

}

.portEntete{
    height: 45vh;
    .overlay {
        position: absolute;
        width: 100%;
        height: 45vh !important;

        background-color: rgba($color: $primaryColor, $alpha: .6);
    }



}


#comp{

    // .overlay {
    //     position: absolute;
    //     width: 100%;
    //     // height: 45vh !important;

    //     background-color: rgba($color: $primaryColor, $alpha: .6);
    // }

    h3{
        color: white !important;
    }
}

.navbar-burger{
    color: $accentColor !important;
}
@media only screen and (max-width: 700px) {

    #myentete{

        background-position: center !important;
        background-size: cover !important;
        height: 100vh !important;
        h1,p{
            z-index: 99999999999 !important;
        }
        p{
            display: block;
            margin-left: auto;
            margin-right: auto;
            text-align: center;
        }
        .over{
            height: 100vh;
        }
        .actions{
            display: block;
            margin-left: auto;
            margin-right: auto;
        }
    }

    .portEntete{

        background-position: top !important;
        background-size: auto;
        background: $primaryColor !important;

        p.description{

            width: 100% !important;
            text-align: center !important;
        }
    }
}