@media screen and (max-width: 500px) {
        body { 
            background: url('briare.jpg') no-repeat center center fixed; 
        }
        #resumeModal {
            width: 1000;
        }
        #map {
            height: 200px;
            width: 80%;
            margin-top: 10px;
        }
    }
    @media screen and (min-width: 501px) {
        body {
        }
        #resumeModal {
            width: 90%;
        }
        #map {
            height: 400px;
            width: 70%;
            margin-top: 20px;
        }
	.styleAgendas {
	    width: 11%;
	}
    }
    body {
        background-color: #DAAB3A;
        margin-top: 100px;
    }
    .styleTitre {
        background-color: #93441A;
    }
    .styleTitre a{
	color: #FFF;
    }
    .styleForm {
        background-color: #DAAB3A ;
	color: #020;
	border: 1px solid;
    }
    .styleChercher {
        background-color: #93441A ;
	color: #FFF;
	padding: 2px 15px 2px 15px;
	border-radius: 4px;
	border: none;
    }
    .styleElargir {
        background-color: #93441A ;
	color: #FFF;
	padding: 10px;
	border-radius: 3px;
    }
    .styleIntro {
        background-color: #DAAB3A ;
	color: #134;
	padding: 20px 2em 20px 2em;
	border-radius: 10px;
	border: solid;
	border-color: #93441A;
    }
    .styleAgendas {
        background-color: #B67332 ;
	border-radius: 30px;
	margin: 5px 5px 5px 5px ;
    }
    .styleEvenement {
        background-color: #EEE6D8 ;
	border-radius: 20px;
        padding: 5px 2em 5px 2em;
    }
    #map {
        z-index: 0;
        margin-left: auto;
        margin-right: auto;
        padding-top: 40%;
    }
    #resumeModal {
        margin-left: auto;
        margin-right: auto;
    }
    #resume{
        background-color: #C0C0C0;
        margin: 5px 5px 25px 5px;
        width: 100%;
        height: 20em;
    }
    .infoBoxThumbnail {
        object-fit: cover;
        width: 220px;
        height: 150px;
    }
    img {
        width: 220px;
        height: auto;
    }
    .dsioEl-header__date {
        display: none;
    }
    #map {
        z-index: 0;
        height: 400px;
        margin-left: auto;
        margin-right: auto;
        padding-top: 40%;
    }
    a {
        text-decoration: none;
        font-size: 1.2em;
        target: new;
        target-name: new;
        target-new: tab;
    }
    .card{
        padding: 5px 5px 5px 5px;
    }
    .styleAgendas img {
        width: 100%;
    }
    
    h5 a {
        color: green;
    }
    .description a {
        color: red;
        font-size: 20px;
    }
    input {
        border: none;
    }
    .modal-content {
        width: 100%;
    }