/***** top page *****/
.top_page 							{ position: relative; padding-top: 140px; background-color: #000;  margin-bottom: 90px;}
.top_page::before                   { content: ""; background: url(../images/megafunhouse_accueil_05.webp) no-repeat center; background-size: cover;  position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: 0.3;}
.top_page .titre_main				{  color: #fff;}
.top_page .texte                    { color: #fff; padding-top: 85px; }
.top_page .sous_titre				{ position: relative; margin-bottom: 10px; color: #fff;}
.top_page .bloc_grid                { margin: 0; align-items: start; gap: 75px;}
.top_page .bloc_grid .texte         { max-width: 600px; padding-right: 20px; padding-bottom: 250px;}
.top_page .bloc_grid::after         { content: ""; background: #fff; border-top: 10px solid #16c1f3 ; width: 40000px; height: 190px; bottom: 0; left: -5000px; position: absolute;} 
.top_page .bloc_grid .photo::after,
.top_page .bloc_grid .photo::before { display: none;}
.top_page.no_photo                  { margin: 0 0 50px;}
.top_page.no_photo .bloc_grid:after { display: none;}
.top_page.no_photo .texte           { padding-bottom: 70px;}
@media (max-width:1400px) {
.top_page .bloc_grid::after         { height: 50px;}
.top_page .bloc_grid .texte         { padding-bottom: 100px; padding-top: 50px;}
}

@media (max-width:1200px) {
.top_page .bloc_grid::after         { display: none;}
.top_page .bloc_grid .texte         { padding-bottom: 0;}
.top_page .bloc_grid                { gap: 30px; padding-bottom: 50px;}
}
@media (max-width:1000px) {
.top_page .bloc_grid .photo         { display: none;}
.top_page .bloc_grid .texte         { padding: 0; max-width: 100%;}
.top_page                           { margin-bottom: 50px;}
}
@media (max-width:600px) {
.top_page                           { padding-top: 180px;}
.top_page .titre_main				{ margin-bottom: 8px;}
.top_page .chapo 					{ margin: 15px 0 0 0;}
}




/***** breadcrumb *****/
.breadcrumb							{ line-height: 0; position: relative; padding-bottom: 35px;}
.breadcrumb li 						{ display: inline-block; font-size: 13px; line-height: 20px; margin-right: 30px; position: relative;}
.breadcrumb li:after				{ width: 1px; height: 9px; position: absolute; right: -15px; top: 6px; background: #fff; content: "";}
.breadcrumb li:last-child:after 	{ display: none;}
.breadcrumb li a 					{ color: #fff;}
.breadcrumb li a.active 			{ color: #16c1f3;}

@media (min-width:1201px) {
.breadcrumb a:hover                 { color: #16c1f3;}
}
@media (max-width:700px) { 
.breadcrumb							{ display: none;}
}




/***** page content *****/
.page 								{ position: relative; padding-bottom: 20px;}
.page p								{ margin-bottom: 15px;}
.page .ul_list li                   { margin-top: 0;}
.page .ul_list a, 
.page p a							{ border-bottom: 1px solid transparent; padding-bottom: 2px;}

@media (min-width:1201px) {
.page .ul_list a:hover,
.page p a:hover						{ color: #16c1f3; border-color: #16c1f3;}
}
@media (max-width:1200px) {
}
@media (max-width:1000px) {
}
@media (max-width:700px) {
.page 								{ padding-bottom: 10px;}
.page p								{ margin-bottom: 10px;}
.page .ul_list						{ margin-bottom: 10px;}
.page .ul_list li					{ padding-left: 35px; background-position: left 42%; background-size: 25px;}
.page .ul_list li:before			{ top: 15px; width: 5px; height: 5px;}
}


/***** bloc texte *****/
.bloc_texte							{ margin: 100px auto; position: relative;}
.bloc_texte :last-child				{ margin-bottom: 0;}
.bloc_texte img,
.bloc_texte video					{ width: 100%; height: auto; display: block;}

@media (max-width:1200px) { 
.bloc_texte							{ margin: 70px auto;}
}
@media (max-width:1000px) { 
.bloc_texte							{ margin: 60px auto;}
    
}
@media (max-width:700px) { 
.bloc_texte							{ margin: 35px 0;}
}

.bloc_grid  .photo img              { border: 10px solid #000;}
.bloc_grid  .photo::after           { content: ""; background: #000; width: 4000px; height:calc(100% + 10px); position: absolute; top: 0; right: calc(100% + 40px); } 
.bloc_grid .photo::before           { content: ""; width: 100%; height: 100%; width: 100%; background-color: #16c1f3; position: absolute; top: 10px; left: -10px;}
.bloc_grid.reverse .photo::after    { right: 0; left: calc(100% + 40px);}
.bloc_grid.reverse .photo::before   { left: auto; right: -10px;}
@media (max-width:1200px) {
.bloc_grid .photo::after            { right: calc(100% + 30px);}
}
@media (max-width:1000px) {
.bloc_grid .photo::after            { display: none ;}
}
@media (max-width:600px) {
.bloc_grid .photo img               { border-width: 5px;}
}


.marques                            { display: grid; grid-template-columns: 1fr 1fr 
; gap: 80px 0; margin: 100px 0;}
.marques .item                      { display: grid; grid-template-columns: 175px auto; gap: 30px; align-items: center; padding-right: 60px;}
.marques .item img                  { display: block; width: 100%; object-fit: cover;}
.marques .stitre                    { font: 500 18px/30px "barlow"; text-transform: uppercase; margin-bottom: 10px;}

.collection                         { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 40px; margin: 100px ; }
.collection .item img               { display: block; width: 100%; object-fit: cover; border: 10px solid #000;}

@media (max-width:1200px) {
.marques                             { gap: 40px;}
.marques .item                       { padding-right: 30px; grid-template-columns: 130px auto; gap: 15px;}
.collection                          { gap: 20px; margin: 50px 100px;}
}
@media (max-width:1000px) {
.marques                             { grid-template-columns: 1fr; margin: 50px 0; }
.marques .item                       {  grid-template-columns: 150px auto; gap: 20px;}
.collection                           { margin: 50px 50px; }              
}
@media (max-width:700px)  {
.collection .item img               { border-width: 5px;}
.collection                         { margin: 50px 30px; gap: 15px;}
}
@media (max-width:600px) {
.collection                         { grid-template-columns: 1fr;}
}

