@font-face       { 	font-family: 'SH Pinscher';
					src: url('Fonts/SHPinscher-Regular.otf');}


/*video de fond */

#wrap-video-bg{
  overflow: hidden;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index:-1;
}

#wrap-video-bg video{
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
  
}

/*titre de la page SAVARAH  */
#navtitre a
{
	text-decoration : none;
	color: lightgreen;
  }


/*ligne de navigation */
#nav {
	width: 800px;
    display: flex;
    justify-content: center;
    list-style: none;
    padding: 0px;
    margin-top : 0%;
}
#nav li {
	padding: 10px;
text-align: center;
font-size : xxx-large;
 border: double;
 color :lightgreen;
 line-height : 50px;
 margin-top : 0px;
}

#nav li a {
	text-decoration : none;
	color :lightgreen;
	 margin-top : 50px;
}

#nav li:first-child, #nav li:last-child {
flex :1;
}

#nav li:nth-child(2) {
flex: 2;
}


/*corps*/
 }
  body {
    background : url('image/galaxy.jpg');
    background-size: cover;
    }
  }

a { 			font-family: 'SH Pinscher';
				font-size: 1.1em }

h1 {			text-align: center; 
				font-family: 'SH Pinscher';
				font-size: 5.5em;
				color: lightgreen; }

h2
{ 
 
	font-family: 'SH Pinscher';
	font-size: 2em;
    margin-top : 10%;
}

p

{ 
	font-family: 'SH Pinscher';
	font-size: 1.1em; 
	text-align : center ;
}


ol
{ 
	font-family: SH Pinscher;
	font-size: 1.1em;
}




/* Change the link color to #111 (black) on hover */
li a:hover {
  background-color: #111; padding : 10px;
}
body 
{ 
	color:white ;
  
  }


  }

video, object {
left:0;
top:0;
margin:0;
padding:0;
width:100%;
position:fixed;
z-index:-1;
}



section
{
    -webkit-column-count:2; /* Opera, Safari, Google Chrome */
    -moz-column-count: 2; /* Firefox */
    column-count: 2; /* Internet Explorer */
}

 
.centré
{
	text-align: center; 
	font-family: 'SH Pinscher';
	font-size: 1.1em;
  margin-top : 100px;
}
.premier
{
  margin: 0 auto;
  width: 100px; 
  text-align : justify;
  font-family: 'SH Pinscher';
}



.flotte
{
    float: right;
    margin-right: 17em;
}

.href
{
	target: blank;
}

.contenu {
margin-left : auto;
font-family: 'SH Pinscher';
font-size: 1.1em;
text-align:left;
height:80px;
line-height: 20px;
}

/* page Sahara-about */

.bio
{
  display : flex;
  flex-direction : row-reverse;
  flex-wrap : wrap;
  margin-top : 8%;
  margin : 20px auto ;
  width: 100%;
  border: 0px solid #fff700;
   background: rgba(2, 54, 54, 0.5);
    -pie-background:  rgba(2, 54, 54, 0.5);
  
  
  }

.bio h1
{
  font-family: 'SH Pinscher';
	font-size: 2.6em;
  font-style: italic;
  text-align: justify;
  position: relative;
  margin-top : 2.5%;
  margin-left : 1.5%;
 
  
  }

.bio h2
{
  font-family: 'SH Pinscher';
	font-size: 2.6em;
  font-style: italic;
  text-align: left;
  position: relative;
  color : lightgreen;
  margin-top : 2.5%;
  margin-left : 1.5%;
 
  
  }
.bio p
{
  font-family: 'SH Pinscher';
	font-size: 2.6em;
  font-style: italic;
  text-align: justify;
  color : lightgreen;
  position: relative;
  margin-top : 2.5%;
  margin-left : 0;
  text-indent: 3%;
 
  
  }

.bio p a
{
  font-family: 'SH Pinscher';
	font-size: 1.1em;
  position : relative;
  font-style: normal;
  margin-top : 0%;
  
 
  
  }


.bio p a: a, a:visited {
    /* Les liens "au repos" et déjà visités antérieurement */
    color: #333102; /* couleur blanche */ ; font-size: 1.1em ;
}

.bio p a:hover, a:focus, a:active {
    /* Les liens au survol, au focus, et actifs : on leur donne la couleur rouge pour l'exemple */
    color: #efd807; font-size: 1.1em ;
}

bio p.contact 
{ 
  
  font-family: 'SH Pinscher';
	font-size: 2.6em;
  font-style: italic;
  text-align: left;
  color : lightgreen;
  position: relative;
  margin-top : 2.5%;
  margin-left : 0;
  text-indent: 3%;

}

.biotext
{
	width: 199%;
  box-sizing : border-box;
  padding : 0px;
  }

.biophoto
{ width: 100%;
 }
.biophoto img
{
  width: 100%;
  font-size: 1em;
  color : Black;
  border: 1px solid #fff700;
  text-align : right;
  
   }

/* fichiers pros div class folder */

.folder {
  display : flex;
  justify-content : center ;
  padding-left : 0%;
  padding-top : 4%;
 }

.folder ul {
  display : inline;  
  padding : 0px; 
 margin-top : -29px;}

.folder ul li {
  display : inline;
  text-decoration : none;   }

.folder li span { 
	font-family: 'SH Pinscher';
	font-size: 1.6em;
}

.folder img 
{
width : 10%;
  }

.folder a a:hover, a:focus, a:active
{ 
	 /* Les liens "au repos" et déjà visités antérieurement */
    color: #ffffff; /* couleur blanche */ ; font-size: 1.1em ; font-family: 'SH Pinscher';
}

a, a:visited {
    /* Les liens "au repos" et déjà visités antérieurement */
    color: #ffffff; /* couleur blanche */ ; font-size: 1.1em ; font-family: 'SH Pinscher';
}

a:hover, a:focus, a:active {
    /* Les liens au survol, au focus, et actifs : on leur donne la couleur rouge pour l'exemple */
    color: #efd807; font-size: 1.1em ; font-family: 'SH Pinscher';
}

 /* Fixed/sticky icon bar (horizontally aligned 50% from the top of the screen) */
.icon-bar {
display : flex ;
position : fixed ;
margin-left : -5%;
    transform: translateY(890%);
   
}

/* Style the icon bar links */
.icon-bar a {
padding-left : 28% ;
background-color : black ;
  transition: all 0.3s ease;
  color: white;
  font-size: 50px;
}

/* Style the social media icons with color, if you want */
.icon-bar a:hover {
  background-color: #000;
}

.facebook {
  background: 	 #ffffff00;
  color: lightgreen;
}

.soundcloud {
  background: 	 #ffffff00;
  color: lightgreen;
}

.instagram {
  background: 	 #ffffff00;
  color: lightgreen;
}



.youtube {
  background: 	 #ffffff00;
  color: lightgreen;
}