
header {
	height: 50px;
	position: fixed;
	top: 0px;
	right: 0px;
	width: 100%;
	z-index: 10;
	background-color: white;
}
#contenu {
	width: 100%;
	position: relative;
	top: 50px;
	z-index: 1;
	height: 100%; 
}

#crois {
	background-color: ;
}

#croisel {
	background-color: white;
}

#cat {
	background-color: ;
}
#catsel {
	background-color: white;
}
#croi {
	background-color: ;
}


.fond_image img:hover{
opacity:0.5;

}

.piedtita
{
list-style: none;
   font-size: 16px;
   line-height: ;
   color: black;
   text-align: center;
   font-weight: bold ;
   font-family: Helvetica, Arial, sans-serif;
   }
.piedtitb
{
list-style: none;
   font-size: 14px;
   line-height: ;
   color: black;
   text-align: center;
   font-weight: ;
   font-family: Helvetica, Arial, sans-serif;
   }
/* Menu deb */
.menu {
    display: none;
	flex-basis: 100%;
}

.menu-checkbox:checked ~ .menu {
    display: block;
	background-color: white;
    margin: 0 .5em;
	outline: grey solid 3px;
}

.menu-checkbox {
	opacity: 0;
	position: absolute;
	top: -1000px;
}

.menu-checkbox:checked + .menu-toggle {
    outline: ;
	background: #f2f2f2;
}

.menu-toggle {
    padding: 0 .3em; 
}

.nav-wrapper {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.cli{
list-style: none;
}
/* Menu fin */

/* Titres hors box deb */
.tith1
{
   font-size: 24px;
   line-height:;
   color: #0782ab;
   text-align: center ;
   font-weight: bold ;
   font-family: Barlow Condensed, sans-serif;
   }
.tith1bl
{
   font-size: 24px;
   line-height:;
   color: black;
   text-align: center ;
   font-weight: bold ;
   font-family: Barlow Condensed, sans-serif;
   }
.tith2
{
   font-size: 20px;
   line-height:;
   color: #4a758f;
   text-align: center ;
   font-weight: bold ;
   font-family: Helvetica, Arial, sans-serif;
   }   
.tith3
{
   font-size: 18px;
   line-height:;
   color: #4a758f;
   text-align: center ;
   font-weight: bold ;
   font-family: Helvetica, Arial, sans-serif;
   } 
   
/* Titres hors box fin */

/* Liens deb */
a.ca1
{text-decoration: none; color: black; font-size:; font-family: Helvetica, Arial, "Comic Sans MS", Times New Roman}
a:visited.ca1
{text-decoration: none; color: black; font-size:; font-family:  Helvetica, Arial, "Comic Sans MS", Times New Roman}
a:hover.ca1, a:active.ca1, a:focus.ca1
{text-decoration: none; font-weight:; color: red; font-size:; font-family:  Helvetica, Arial, "Comic Sans MS", Times New Roman}

a.ca2
{text-decoration: none; color: black; font-size: 15px; font-family: Helvetica, Arial, "Comic Sans MS", Times New Roman}
a:visited.ca2
{text-decoration: none; color: black; font-size: 15px; font-family:  Helvetica, Arial, "Comic Sans MS", Times New Roman}
a:hover.ca2, a:active.ca2, a:focus.ca2
{text-decoration: none; font-weight:; color: red; font-size: 15px; font-family:  Helvetica, Arial, "Comic Sans MS", Times New Roman}

a.ca3
{text-decoration: underline; color: red; font-size: 16px; font-family: Helvetica, Arial, "Comic Sans MS", Times New Roman}
a:visited.ca3
{text-decoration: none; color: red; font-size: 16px; font-family:  Helvetica, Arial, "Comic Sans MS", Times New Roman}
a:hover.ca3, a:active.ca3, a:focus.ca3
{text-decoration: underline; font-weight: bold; color: red; font-size: 16px; font-family:  Helvetica, Arial, "Comic Sans MS", Times New Roman}

a.ca4
{text-decoration: underline; color: black; font-size: 16px; font-family: Helvetica, Arial, "Comic Sans MS", Times New Roman}
a:visited.ca4
{text-decoration: none; color: black; font-size: 16px; font-family:  Helvetica, Arial, "Comic Sans MS", Times New Roman}
a:hover.ca4, a:active.ca4, a:focus.ca4
{text-decoration: underline; font-weight: ; color: red; font-size: 16px; font-family:  Helvetica, Arial, "Comic Sans MS", Times New Roman}

a:active.cb1, a:focus.cb1
{outline: red auto 3px;}

a.clssimg
{text-decoration: none; font-weight:bold; color: black; font-family: Helvetica, Arial, "Comic Sans MS", Times New Roman}
a:visited.clssimg
{text-decoration: none; font-weight:bold; color: black; font-family: Helvetica, Arial, "Comic Sans MS", Times New Roman}
a:hover.clssimg, a:active.clssimg, a:focus.clssimg
{text-decoration: none; font-weight:bold; color: red; font-family:  Helvetica, Arial, "Comic Sans MS", Times New Roman }

a.clssimg1
{text-decoration: none; color: black; font-family: Helvetica, Arial, "Comic Sans MS", Times New Roman}
a:visited.clssimg1
{text-decoration: none; color: black; font-family:  Helvetica, Arial, "Comic Sans MS", Times New Roman}
a:hover.clssimg1, a:active.clssimg1, a:focus.clssimg1
{text-decoration: none; color: grey; font-family: Helvetica, Arial, "Comic Sans MS", Times New Roman }

a.clssimg2
{text-decoration: none; color: red; font-family: Helvetica, Arial, "Comic Sans MS", Times New Roman}
a:visited.clssimg2
{text-decoration: none; color: red; font-family: Helvetica, Arial, "Comic Sans MS", Times New Roman}
a:hover.clssimg2, a:active.clssimg2, a:focus.clssimg2
{text-decoration: none; font-weight:bold; color: red; font-family: Helvetica, Arial, "Comic Sans MS", Times New Roman }

/* Liens fin */

/* test bouton deb */
a.bouton1{
width:200px;
display:block;
padding: 10px 30px; 
background: #FF0000 ; 
border-radius: 10px; text-decoration: none; color: white; font-family: Helvetica, Arial, "Comic Sans MS", Times New Roman
}
a.bouton1:hover {
background: #E30000; 
text-decoration: none; font-weight:; color: white; font-family: Helvetica, Arial, "Comic Sans MS", Times New Roman
}

a.bouton2{
width:200px;
display:block;
padding: 10px 30px; 
background: ; 
border: 2px red solid;
border-radius: 10px; text-decoration: none; font-weight:bold; color: black; font-family: Helvetica, Arial, "Comic Sans MS", Times New Roman
}
a.bouton2:hover {
background: ; 
text-decoration: none; font-weight:bold; color: red; font-family: Helvetica, Arial, "Comic Sans MS", Times New Roman
}


#cadre {
  border-radius: 10px;
}

/* test bouton fin */
#encad 
 {
background-color:;
border:1px solid red;
padding:0px;
/*arrondir les coins en haut à gauche et en bas à droite*/
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
}


img {
  max-width: 100%;
  height: auto;
}

img.haut {
  vertical-align: text-top;
}

/* Box1img1 deb */



#box1img1 {
float:none;
width:1800px;
height:716px;
background-color: ;
background-image: url("https://www.skipper-antilles.com/imagesn/ilet-cabrit-1800-716.jpg") ;
}

#box1img2 {
float:none;
width:1190px;
height:473px;
background-color: ;
background-image: url("https://www.skipper-antilles.com/imagesn/ilet-cabrit-1190-473.jpg") ;
}

#box1img3 {
float:none;
width:1000px;
height:397px;
background-color: ;
background-image: url("https://www.skipper-antilles.com/imagesn/ilet-cabrit-1000-397.jpg") ;
}

#box1img4 {
float:none;
width:760px;
height:302px;
background-color: ;
background-image: url("https://www.skipper-antilles.com/imagesn/ilet-cabrit-760-302.jpg") ;
}

#box1img5 {
float:none;
width:380px;
height:190px;
background-color: ;
background-image: url("https://www.skipper-antilles.com/imagesn/ilet-cabrit-380-190.jpg") ;
}


.box {
  background: skyblue;
 background-image: url("https://www.skipper-antilles.com/imagesn/ilet-cabrit - 2048-1536.jpg") ;
  background-image: -webkit-image-set(
    url("https://www.skipper-antilles.com/imagesn/Bahia-2048-512.jpg") 1x,
    url("https://www.skipper-antilles.com/imagesn/Bahia-2048-512.jpg") 2x);
  background-image: image-set(
    url("https://www.skipper-antilles.com/imagesn/Bahia-2048-512.jpg") 1x,
    url("https://www.skipper-antilles.com/imagesn/Bahia-2048-512.jpg") 2x);
  background-image: image-set(
    url("https://www.skipper-antilles.com/imagesn/Bahia-2048-512.jpg") 750w,
    url("https://www.skipper-antilles.com/imagesn/Bahia-2048-512.jpg") 2048w);
}

.box--decorated {
  color: black;
  border: solid 2px skyblue;
  text-align: center;
}


/* Box1 deb */
#box1 {
float:left;
width:100%;
background-color: ;
}

.box1texta
{
   font-size: 16px;
   line-height:;
   color: black;
   text-align: center;
   font-weight: ;
   font-family: Helvetica, Arial, sans-serif;
   }

  .box1textbla
{
   font-size: 16px;
   line-height: 1.5;
   color: black;
   text-align: center;
   font-weight: ;
   font-family: Helvetica, Arial, sans-serif;
   } 

  .box1textred
{
   font-size: 16px;
   line-height: 1.5;
   color: red;
   text-align: center;
   font-weight: ;
   font-family: Helvetica, Arial, sans-serif;
   } 
   
 #box1b {
float:left;
width:100%;
background-color: #798a94;
}  

#box1c {
float:left;
width:100%;
background-color: #507e9b;
}  
 

 
/* Box1 fin*/

/* Box2 deb */
#box2aj {
float:left;
width:50%;
text-align: center;
background-color: ;
}
#box2bj {
float:left;
width:50%;
text-align: center;
background-color: ;
}


#box2a {
float:left;
width:50%;
text-align: center;
background-color: ;
}
#box2b {
float:left;
width:50%;
text-align: center;
background-color: ;
}

#box2aa {
float:left;
width:100%;
text-align: center;
background-color: ;
}

#box2ab {
float:left;
width:100%;
text-align: center;
background-color: ;
}

.box2texta
{
   font-size: 16px;
   line-height: 1.5;
   color: black;
   text-align: left;
   font-weight: ;
   font-family: Helvetica, Arial, sans-serif;
   }
.box2textb
{
   font-size: 16px;
   line-height: ;
   color: black;
   text-align: left;
   font-weight: bold ;
   font-family: Helvetica, Arial, sans-serif;
   }
   
#box2a1{
float:left;
width:50%;
text-align: right;
background-color: ;
}
#box2b1 {
float:left;
width:50%;
text-align: left;
background-color: ;
}   
   
   
/* Box2 fin */

/* Box3 deb */

#box3a {
float:left;
width:33%;
background-color: #f2f2f2;
}
#box3b {
float:left;
width:34%;
}

#box3c {
float:left;
width:33%;
background-color: #f2f2f2;
}

#box3a2 {
float:left;
width:33%;
background-color: ;
}
#box3b2 {
float:left;
width:34%;
background-color: ;
}

#box3c2 {
float:left;
width:33%;
background-color: ;
}

#box3ap {
float:left;
width:33%;
background-color: #507e9b;
}
#box3bp {
float:left;
width:34%;
background-color: #507e9b;
}

#box3cp {
float:left;
width:33%;
background-color: #507e9b;
}

#box3tar20pc {
float:left;
width:20%;
background-color: ;
}
#box3tar60pc {
float:left;
width:60%;
background-color: ;
}


.box3tita
{
list-style: none;
   font-size: 16px;
   line-height: ;
   color: black;
   text-align: left;
   font-weight: bold ;
   font-family: Helvetica, Arial, sans-serif;
   }

.box3titb
{
list-style: none;
   font-size: 16px;
   line-height: ;
   color: black;
   text-align: left;
   font-weight: bold ;
   font-family: Helvetica, Arial, sans-serif;
   }   
   
.box3clula{
text-align: ;
}


/* Box3 fin */

/* vignettes deb vers carousel  */
.flotte {
float:left;
}

.imagesmin img { margin-right:10px; }
/* vignettes fin vers carousel  */


/* Box5 deb */

.box5tita{
   font-size: 17px;
   line-height:;
   color: black;
   text-align: center;
   font-weight: bold;
   font-family: Helvetica, Arial, sans-serif;
}



.box5clula{
text-align: left;
font-family: Helvetica, Arial, sans-serif;
}

.box5cla{
   font-size: 16px;
   line-height:1,2;
   color: black;
   text-align: center;
   font-weight: ;
   font-family: Serif, Helvetica, Arial, sans-serif;
 }

#box5a {
float:left;
width:20%;
background-color: #f2f2f2;
}
#box5b {
float:left;
width:20%;
}

#box5c {
float:left;
width:20%;
background-color: #f2f2f2;
}

#box5d {
float:left;
width:20%;
}
#box5e {
float:left;
width:20%;
background-color: #f2f2f2;
}


#box51a {
float:left;
width:30%;
text-align: center;
background-color:;
}
#box51b {
float:left;
width:5%;
}

#box51c {
float:left;
width:30%;
text-align: center;
background-color:;
}

#box51d {
float:left;
width:5%;
}
#box51e {
float:left;
width:30%;
text-align: center;
background-color:;
}

/* Box5 ldor deb */

#box52a {
float:left;
width:20%;
background-color:;
}
#box52b {
float:left;
width:20%;
}

#box52c {
float:left;
width:20%;
background-color:;
}

#box52d {
float:left;
width:20%;
}
#box52e {
float:left;
width:20%;
background-color:;
}
/* Box5 ldor fin */

/* Box5 fin */

/* Box7 deb */
#box71a {
float:left;
width:22%;
text-align: center;
background-color:;
}
#box71b {
float:left;
width:4%;
}
#box71c {
float:left;
width:22%;
text-align: center;
background-color:;
}
#box71d {
float:left;
width:4%;
}
#box71e {
float:left;
width:22%;
text-align: center;
background-color:;
}
#box71f {
float:left;
width:4%;
}
#box71g {
float:left;
width:22%;
text-align: center;
background-color:;
}

/* Box7 fin */




@media screen and (min-width: 1200px)  

 {
    .menu {
        display: block;
		flex-basis: auto;
        max-height: 1000px;
		background-color: white;
        margin: 0;
        padding: 0;
    }

    .menu-toggle,
    .menu-checkbox {
        display: none;
    }
	 
.menu li {
        border: none;
        display: inline-block;
    }

.menu li a {
		padding: .5em;
}
 
}


@media screen and (min-width: 1200px) 

{             
#sac{ display:none;}  
#banteli{ display:none;}   
#banmeli{ display:none;}  
       
}

@media screen and (max-width: 1199px) 

{
#saci{ display:none;}          
#bantel{ display:none;}          
#banmel{ display:none;}
          
}

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

} 



@media screen and (max-width: 990px)
{ 
#box2a
{
            width :100% ;
}

#box2b
{
            width :100% ;
}
#box2ab{ display:none;} 
#box2b0{ display:none;} 

#box510{ display:none;}
#box51a
{
            width :100% ;
}
#box51b{ display:none;}
#box51c
{
            width :100% ;
}
#box51d{ display:none;}
#box51e
{
            width :100% ;
} 

#box71a
{
            width :100% ;
}
#box71b{ display:none;}
#box71c
{
            width :100% ;
}
#box71d{ display:none;}
#box71e
{
            width :100% ;
}
#box71f{ display:none;}
#box71g
{
            width :100% ;
}
 
#box3a2
{
            width :100% ;
}
 
#box3b2
{
            width :100% ;
}
 
#box3c2
{
            width :100% ;
} 


#box3a
{
            width :100% ;
}
 
#box3b
{
            width :100% ;
}
 
#box3c
{
            width :100% ;
}



#box5a
{
            width :100% ;
}
 
#box5b
{
            width :100% ;
}
 
#box5c
{
            width :100% ;
}
 
#box5d
{
            width :100% ;
}

#box5e
{
            width :100% ;
}

 
}




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

#box52a
{
            width :100% ;
}
 
#box52b
{
            width :100% ;
}
 
#box52c
{
            width :100% ;
}
 
#box52d
{
            width :100% ;
}

#box52e
{
            width :100% ;
} 


#box3ap
{
            width :100% ;
}
 
#box3bp
{
            width :100% ;
}
 
#box3cp
{
            width :100% ;
}

#box3tar20pc{ display:none;}

#box3tar60pc
{
            width :100% ;
}

#box2a
{
            width :100% ;
}

#box2b
{
            width :100% ;
}
#box2ab{ display:none;} 
 
#box2a1
{
            width :100% ;
}

#box2b1
{
            width :100% ;
} 

 

}

@media screen and (min-width: 1801px) 
{               
#box1img2{ display:none;}  
#box1img3{ display:none;}  
#box1img4{ display:none;}
#box1img5{ display:none;}       
}


@media (1191px <= width <= 1800px )

{              
#box1img1{ display:none;}  
#box1img3{ display:none;}  
#box1img4{ display:none;}
#box1img5{ display:none;}       
}

@media (1001px <= width <= 1190px )

{              
#box1img1{ display:none;}  
#box1img2{ display:none;}  
#box1img4{ display:none;}
#box1img5{ display:none;}       
}

@media (761px <= width <= 1000px )

{             
#box1img1{ display:none;}  
#box1img2{ display:none;}  
#box1img3{ display:none;}
#box1img5{ display:none;}       
}

@media screen and (max-width: 760px) 
{ 
#box2aj { width :100% ;}
#box2bj { width :100% ;}               
#box1img1{ display:none;}  
#box1img2{ display:none;}  
#box1img3{ display:none;}
#box1img4{ display:none;}       
}

/* Box videos */


html { 
  margin:0;
  padding:0;
  background: url(https://www.skipper-antilles.com/imagesn/ilet-cabrit-1800-716.jpg) no-repeat center fixed; 
  -webkit-background-size: cover; 
  background-size: cover; 
}

#box1vide {
float:left;
width:100%;
background-color: ;
}


#box53a {
float:left;
width:10%;
text-align: center;
background-color: ;
}

#box53b {
float:left;
width:35%;
text-align: center;
background-color: ;
}

#box53c {
float:left;
width:10%;
text-align: center;
background-color: ;
}

#box53d {
float:left;
width:35%;
text-align: center;
background-color: ;
}
#box53e {
float:left;
width:10%;
text-align: center;
background-color: ;
}


.boxopac1 {
  background-color: #000;
  color: #fff;
  opacity: 0.4;
 } 
 
.boxopac2 {
  background-color: rgb(0 0 0 / 0.5);
  color: #fff;
}

.boxopac3 {
  background-color: #fff;
  color: #000;
  opacity: 0.3;
 } 
 
.boxopac4 {
  background-color: rgb(255 255 255 / 0.3);
  color: #fff;
}

@media screen and (max-width: 990px)
{ 
#box53b
{
            width :100% ;
}

#box53d
{
            width :100% ;
}
#box53a{ display:none;} 
#box53c{ display:none;} 
#box53e{ display:none;} 
}