
.navbar{
    background-color: transparent;
    top:0;
}

.navbar-toggler{
	color:white!important;
	border:none!important;
	padding:2px!important;
}

.nav-link{
    color: white!important;
    font-size: 18px!important;
}

.nav-link:hover{
    color: rgba(255, 255, 255, 0.509)!important;
    transition: 0.7s;
}

header{
    height: 900px;
    background: linear-gradient(rgba(10, 10, 10, 0.2), rgba(10, 10, 10, 0.4),rgba(10, 10, 10, 0.6),
    rgba(10, 10, 10, 1.0),rgba(10, 10, 10,  1.0)),url(../assets/background.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

header hr{
    background-color: #ffffff;
    height: 3px;
    width: 55%;
    margin-top:5px;
}

header h1{
    margin-top: 250px;
    font-size: 95px!important;
    text-align: left;
}

header p{
    margin-top: 25px;
    font-size: 22px!important;
    text-align: left;
    color:#ffffff!important;
}

header .btn{
    margin-top: 12px;
    margin-right: auto;
    padding: 15px;
}
.section-about,.section-contact{
    background-color: #0e0e0e;
    padding: 80px!important;
}

.section-about .container{
    width: 80%;
}

#col-about1{
padding: 50px;
color: #ffffff;
}

#col-about1 h2{
    font-weight: 500;
    margin-top: -30px!important;   
    margin-bottom: 30px; 
    font-size: 50px;
}

#col-about1 p{
    text-align:left!important;
    margin-top: 45px;
}

.section-about img{
    width: 100%;
}

#projet,#contact{	
    padding-bottom:50px;
}

#projet{	
    border-bottom: 1px #ededed solid;
}

.section-projet{
    padding: 50px;
}

.section-projet .container{
    width: 70%;
    margin: auto;
}

.col-projet-intro{
    color: #0e0e0e;
}

.col-projet-intro h2{
   font-size: 50px!important;
}

.col-projet-intro hr{
    background-color: #0e0e0e!important;
    width: 10%!important;
    height: 2px!important;
    margin-top: -10px!important;
}

.col-projet{
    margin-bottom: 20px;
}

.col-projet img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.btn-primary{
    background-color: rgba(255, 255, 255, 0.874)!important;
    border: rgba(255, 255, 255, 0.936) 1px solid!important;
    color:rgb(0, 0, 0)!important;
    border-radius:0px!important;
    padding: 15px!important;
}

.btn-outline-light{
    border-radius: 0px!important;
    transition: 0.4s;
}

.btn-outline-light:hover,#projet .btn:hover{
    color: rgb(0, 0, 0)!important;
    transition: 0.8s;
}

#projet h2,#contact h2{
    font-weight: 500;
    font-size:40px;
    text-align:center;
    padding:20px;
    margin-bottom: 30px;
}

#projet hr{
    color: #ffffff;
    background-color: #ffffff;
    height: 1px;
    width: 40%!important;
    margin: 0px auto 50px;
}

#projet p{	
    margin-top:25px;
    margin-bottom: 50px;
    font-size :16px !important;
    text-align:center;
}

#col-projets1,#col-projets2, #col-projets3, #col-projets4{
    width:50%;		
    height:50%;
    margin-top:25px;
}

#col-projets1 img,#col-projets2 img,#col-projets3 img, #col-projets4 img{
    width:100%;		
    height:100%;	
    margin:0;
}

.section-contact{
    color: #ffffff;
}

.section-contact .container{
    width: 70%;
}

.section-contact h2{
    margin-top:0px;	
    font-size: 50px!important;
}

.section-contact p{
    margin-bottom:50px;	
}

.section-contact hr{
    margin: -15px auto 45px;
    width: 50%;
}

.form-control{
	border-radius:0px!important;
    background-color: transparent!important;
    color: white!important;
}

footer{
    background-color: #151515!important;
}

@media only screen and (max-width : 1200px) {
    
    header h1{
        word-wrap: break-word;
        font-size: 70px!important;
    }

    .section-about,.section-projet{
        padding: 50px 20px!important;
        width: 100%!important;
    }

    #col-about1 h2{
        margin-top: -60px!important;
    }

    section .container{
        padding: 10px!important;
        width: 100%!important;
    }

}


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


    .section-about,.section-projet{
        padding: 0px!important;
      
    }

    h2{
        margin-top: 15px!important;
        text-align: center;
        font-size: 25px;
    }

    
    #col-about1 h2{
        margin-top: 0px!important;
    }

    #col-about2,.section-projet{
        padding-bottom: 50px!important;
    }

    .section-contact{
        padding: 15px!important;
      
    }

    section .container{
        padding: 0!important;
    }

    header{
    height:1111px;
    }

    .navbar{
    background:rgba(250,250,250,0.35);
    margin-top:-15px!important;
    padding:20px 0!important;
    }

    #projet{
    width:100%;
    margin: auto;
    }

    #col-projets1,#col-projets2, #col-projets3, #col-projets4{
    width:100%;		
    height:100%;
    margin-top:25px;
    }

    #projet h3{
    font-size: 35px;
    margin-top: 90px;
    }

}
