@import url('https://fonts.googleapis.com/css2?family=Anton&family=Meow+Script&display=swap');
* {
    margin: 0;
    padding: 0;
}

body {    
    background-image: url(img/pattern.png);
    background-repeat: repeat;
    color: #fff;
    overflow-x: hidden;
}

nav {
    background-color: #000;
    box-shadow: 0 4px 6px -1px rgba(255, 0, 0, 0.6);
}

nav>div>a,
nav>div>div>ul>li>a{
    text-shadow: 3px 2px 2px red;
}

.home {
    background-image: url(img/home.png);
    background-repeat: no-repeat;
    background-size: contain;
}

a {
    color: red;
    text-decoration: none;
    font-family: 'Anton';
    text-shadow: 3px 2px 2px white;
}

p {
    font-family: 'Anton';
}

span {
    color: red;
    font-family: 'Anton';
    text-shadow: 3px 2px 2px white;
}

img {
  height: auto;
  display: block;
}

.img-size-custom {
    max-width: 20%;
    height: auto;
}

.img-size-custom-2 {
    max-width: 40%;
    height: auto;
}

.logo-size-custom {
    max-width: 20%;
    height: auto;
}

.mb-custom {
    margin-bottom: 4.5rem;
}

.img-projet-pro1 {
    margin-left: -25%;
    width: 110%;
}

.img-projet-pro2 {
    margin-left: -120%;
    width: 200%;
}

.img-projet-pro2Bis {
    margin-left: 30%;
    width: 170%;
}

.img-projet-pro3 {
    width: 180%;
}

.img-projet-pro4 {
    margin-left: -45%;
    width: 150%;
}

.img-projet-pro5 {
    width: 151%;
}

.img-projet-univ1 {
    margin-left: 13%;
    width: 130%;
}

.img-projet-univ2 {
    margin-left: -40%;
    width: 120%;
}

.img-projet-univ3 {
    margin-left: 15%;
    width: 130%;
}

.img-projet-univ4 {
    margin-left: -40%;
    width: 120%;
}

.img-projet-perso1 {
    margin-left: 23%;
    width: 100%;
}

.img-projet-perso2 {
    margin-left: -40%;
    width: 120%;
}

.img-projet-perso3 {
    margin-left: 22%;
    width: 105%;
}

@media only screen and (max-width : 767px) {
    body{
        background-color: black;
        background-image: none;
    }

    .container{
        padding-right: calc(var(--bs-gutter-x) * 0.2);
    }
    
    .home {
    background-image: url(img/home-mobile.png);
    background-repeat: no-repeat;
    background-size: contain;
}
    
    .img-size-custom {
    max-width: 150px;
    height: auto;
}

.img-size-custom-2 {
    max-width: 200px;
    height: auto;
}

.logo-size-custom {
    max-width: 35px;
    height: auto;
}
    
    .img-projet-pro1 {
    margin-left: -15%;
    width: 120%;
}

.img-projet-pro2 {
    margin-left: -72%;
    width: 150%;
}

.img-projet-pro2Bis {
    margin-left: 0%;
    width: 135%;
}

.img-projet-pro3 {
    margin-left: 10%;
    width: 135%;
}

.img-projet-pro4 {
    margin-left: -37%;
    width: 135%;
}

.img-projet-pro5 {
    margin-left: -8%;
    width: 135%;
}

.img-projet-univ1 {
    margin-left: 8%;
    width: 130%;
}

.img-projet-univ2 {
    margin-left: -34%;
    width: 120%;
}

.img-projet-univ3 {
    margin-left: 5%;
    width: 135%;
}

.img-projet-univ4 {
    margin-left: -40%;
    width: 135%;
}

.img-projet-perso1 {
    margin-left: 4%;
    width: 120%;
}

.img-projet-perso2 {
    margin-left: -30%;
    width: 120%;
}

.img-projet-perso3 {
    margin-left: -2%;
    width: 120%;
}

.overflow-mobile{
    overflow: hidden;
}
}
