.rub-tuto #blocgauche {
justify-content: space-between;
align-items:flex-start;
}

.lefty.bloc-blanc{
	max-width:50%;
}

.lefty h3{
text-align:left;
}

.lefty .btn-bar{
justify-content:left;
}

.background-floaty{
    position: sticky;
    top: 100px;
    height: 100%;
    text-align: center;
margin-top:30px;
margin-bottom:35px;
width:500px;
   background-image: url(/assets/fond_beige_texture.jpg);
    background-repeat: no-repeat;
    background-size: cover;
border-top-right-radius: 60px;
    border-bottom-left-radius: 60px;
}

.bloc-floaty{
    height: 100%;
    text-align: center;
    padding: 0 40px;
}

.bloc-blanc p, .fond-beige p, .fond-vert p {
    text-align: left;
}

.btn-bar ul {
  list-style: none; /* Retire les puces de tous les <li> contenus dans cet <ul> */
width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.btn-bar ul .btn{
    display: block;
}

.btn-bar-tuto{
padding-bottom:10px;
}

.btn-bar-tuto .btn{
	background: black;
	width:250px;
}

/*
.btn-bar-tuto li:nth-child(1) .btn{
    background: #fe75dc;
}
.btn-bar-tuto li:nth-child(2) .btn{
    background: #c053ff;
}
.btn-bar-tuto li:nth-child(3) .btn{
    background: #120048;
}

.btn-bar-tuto li:nth-child(4) .btn{
    background: #48dc2a;
}
.btn-bar-tuto li:nth-child(5) .btn{
    background: #ffc955;
}
.btn-bar-tuto li:nth-child(6) .btn{
    background: #41c0ee;
}
*/


#navbar, #leconteneur {
background:#f1eee7;
}

#bloccentre{
    padding: 0 10%;
}

#bloccentre, .titre-tuto{
background:white;
border-top-left-radius:160px;
margin:0;
}

.titre-tuto{
    padding: 80px 60px 10px 60px;
justify-content:flex-start
}

.titre-tuto h1{
	color:#80a894 !important;
	font-size:30px;
    font-family: "futura-pt", sans-serif;
text-transform:uppercase;
text-align:left;
margin-left:40px;
max-width: 800px !important;
}

.titre-tuto img{
width:80px;
height:80px;
}

.titre-tuto h1 span{
font-family: "futura-pt", sans-serif;
font-size:19px !important;
color:black;
text-transform: none;
display:block;
    letter-spacing: normal;
}

.searchbar-tuto{
    padding-top: 20px;
}

.searchbar-tuto i{
    border-bottom: 1px solid #80a894;
    padding: 5px;
padding-left: 10px;
    font-size: 25px;
    color: #80a894;
}

.searchbar-tuto input{
    border: none;
    border-bottom: 1px solid #80a894;
        padding: 5px 10px;
    width: 490px;
}

.searchbar-tuto input:active,
.searchbar-tuto input:focus{
border: none;
outline: none;
    border-bottom: 1px solid #80a894;
}


/* modals */

.activity-thumbnail {
    width: 100%;
    height: 100%;
	    display: flex;
    flex-wrap: wrap;
    align-items: center;
background-image: url(/assets/fond_beige_texture.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}


.tuto-content .activity-thumbnail:nth-child(2n + 1){
background-image: url(/assets/fond_vert_texture.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.activity-thumbnail img {
width: 300px;
    height: 300px;
    border-right: 10px solid #9d9268;
    border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
}

.activity-thumbnail:nth-child(2n + 1) img {
    border-right: 10px solid #80a894;
}


.tuto-description{
width: calc(100% - 400px);
padding:20px;
}

.tuto-description h2{
text-align: left;
}

.tuto-description p{
	text-align: left;
font-weight:400;
}


    .reservation-button {
	display:none;
}



.modal-content{
    overflow-y: scroll;
 scrollbar-width: thin;  
scrollbar-color: #888 transparent;  
scrollbar-width: none;
}



.modal-image {
	position:sticky;
	top:0;
}

.modal-text {
 max-width: 60%;
}

.modal-text ul{
	margin-top:10px;
}

.modal-text ul li{
font-weight:500;
text-align:left;
font-family: "futura-pt", sans-serif;
}




@media (max-width: 1400px) {

#bloccentre {
    padding: 0 5%;
}


.navbar-nav {
scrollbar-width: none;
    overflow-x: hidden;
    width: 100%;
    overflow-y: scroll;
    flex-wrap: nowrap;
padding-bottom:50px;
}

}

@media (max-width: 1200px) {

.modal-text {
    max-width: 100%;
}

.modal-image {
position:relative;
}

.rub-tuto #blocgauche {
justify-content: space-between;
align-items:stretch;
}

 #bloccentre.rub-tuto {
  padding: 0 !important;
  }

.background-floaty{
height:auto;
position:relative;
top:0;
margin-bottom:0;
border-radius:0;
border-top-left-radius: 60px;
}

.bloc-floaty {
height:auto;
margin-bottom:0;
border-radius:0;
    position: sticky;
    top: 60px;
    text-align: center;
margin-top:30px;
margin-bottom:35px;
    padding: 0 40px;

}

}





@media (max-width: 1000px) {

.lefty.bloc-blanc {
    max-width: 500px;
}


.bloc-floaty {
border-radius:0;
margin-bottom:0;
}



.titre-tuto h1 {
    margin-left: 15px;
    max-width: calc(100% - 95px) !important;
}

#bloccentre {
    padding: 0 1%;
}

#bloccentre, .titre-tuto {
border-top-left-radius: 80px;
}

.searchbar-tuto{
padding-top: 60px;
}

.searchbar-tuto input {
width:auto;
 
}


.activity-thumbnail{
margin:40px 0;
border-radius: 20px;

}

	.activity-thumbnail span.spip_documents,
.activity-thumbnail span.spip_documents > img,
.tuto-description{
    width: 100%;
}

.activity-thumbnail span.spip_documents > img{
border-right:none;
    border-bottom: 10px solid #9d9268;
border-bottom-left-radius: 0;
}

.activity-thumbnail:nth-child(2n + 1) span.spip_documents > img{
    border-bottom: 10px solid #80a894;
}

.tuto-description{
padding:25px 15px;
}


.background-floaty {
width: 300px;
}

.btn-bar-tuto .btn {
	width: 150px;
}

}

@media (max-width: 800px) {
.background-floaty {
        width: 250px;
    }

.background-floaty h3{
font-size:1.2em !important;
margin: 0px !imporant;
margin-top: 60px !important;
}

    .bloc-floaty{
	padding:0;
}

}


@media (max-width: 750px) {

.background-floaty, .lefty.bloc-blanc  {
        width: 100%;
		max-width:100%;
}

 .bloc-floaty{
	padding:10px;
}


}


@media (max-width: 600px) {
.titre-tuto{
    padding: 80px 25px 0 25px;
}

.titre-tuto h1{
		margin-left: 0;
        max-width: 100%  !important;
        font-size: 20px;
        margin-top: 25px;
}
}


@media (max-width: 600px) {
    strong {
        font-weight: 900;
    }
}