@charset "UTF-8";

[class*="col-"],


html {
    scroll-behavior: smooth;
}

body {
    background-color: black;
    color: white;
}

.img-responsive {
    max-width: 100%;
}

h1 {
    font-size: 2.8em;
    font-family: antique-olive, sans-serif;
    font-weight: 500;
    font-style: normal;
    line-height: 0.9;
    position: relative;
    z-index: 2;
}

h2 {
    font-size: 4.5em;
    font-family: antique-olive, sans-serif;
    font-weight: 500;
    font-style: normal;
    position: relative;
    letter-spacing: 0.1px
}


h3 {
    font-size: 26px;
    font-family: halyard-micro, sans-serif;
    font-weight: 300;
    font-style: normal;
}

h4 {
    font-family: halyard-micro, sans-serif;
    font-weight: 100;
}




h6 {
    font-size: 3em;
    font-family: antique-olive, sans-serif;
    font-weight: 400;
    font-style: normal;
    line-height: 1.1;
    z-index: 2;
}

h7 {
    font-family: halyard-micro, sans-serif;
    font-weight: 300;
    font-style: normal;
    font-size: 15px;
}

h5 /* body text */{
    font-family: degular, sans-serif;
    font-weight: 200;
    font-style: normal;
    font-size: 30px;
}

h10{ font-family: degular, sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 32px; line-height: 1.1;}


h8 /* title*/ {
    font-family: degular, sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 44px;
}



h9 {
    font-family: degular, sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 34px; line-height: 1.1
}

#pt {
    position: relative;
    z-index: 0
}


a:link {
    color: white;
    text-decoration: none
}

a:visited {
    color: white;
    text-decoration: none
}

a:hover {
    color: grey;
    text-decoration: none
}

a:active {
    color: blue;
    text-decoration: none
}



#typedeprojet {

    font-family: antique-olive, sans-serif;
    color: black;
    font-size: 1em;
    text-shadow: -0.5px -0.5px 0 #fff,
        0.5px -0.5px 0 #fff,
        -0.5px 0.5px 0 #fff,
        0.5px 0.5px 0 #fff;
    -webkit-text-stroke: 1px white;

}


@media only screen and (max-width: 576px) {


    h2 {
        font-size: 30px;
    }


}

@media only screen and (max-width: 800px) {

    h1 {
        font-size: 40px;
    }

    #title-works {
        margin-top: inherit;
    }

    h3 {
        font-size: 16px;
    }




    #typedeprojet {

        font-family: antique-olive, sans-serif;
        color: black;
        font-size: 30px;
        text-shadow: -0.5px -0.5px 0 #fff,
            0.5px -0.5px 0 #fff,
            -0.5px 0.5px 0 #fff,
            0.5px 0.5px 0 #fff;
        -webkit-text-stroke: 1px white;

    }


}


.strike {
    z-index: 0;
    position: relative;
    width: 100%;
    transform:
        translateY(400px) translateX(-300px) rotate(30deg);
}


.strike-2 {
    z-index: 0;
    position: relative;
    width: 115%;
    transform:
        translateY(350px) translateX(-100px) rotate(-55deg);
}

.strike-3 {
    z-index: 0;
    position: relative;
    width: 100%;
    transform:
        translateY(200px) translateX(-100px) rotate(20deg);
}

hr {
    border: 1px solid;
    padding: 0px;
    margin: 0px;

}
.shot{  border: 1px solid #dedede;
  padding: 10px;
  box-shadow: 5px 10px #dedede;}

hr.style1{
	border-top: 1px #8c8b8b;
}

#bleu {
    color: #3399cc
}

#red {
    color: #de3d2e
}

#yellow {
    color: #fced21
}

#green {
    color: #21b573
}

#white {
    color: white
}