@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: 400px;
    margin: auto;
    display: flex;
    justify-content: center;
    list-style: none;
    padding: 0px;

}
#nav li {
	padding: 10px;
text-align: center;

 
}

#nav li a {
	text-decoration : none;
	color: lightgreen;
 
}

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

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

.bandcamplogo iframe
{
	margin-left : 40%;
  width: 20%;
  height: 50px;
}


/*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: 3em;
				color: lightgreen; }

h2
{ 
 
	text-align: center; 
				font-family: 'SH Pinscher';
				font-size: 2em;
				color: lightgreen; 
    margin-top : 10%;
}

h3
{ 
 
	text-align: center; 
				font-family: 'SH Pinscher';
				font-size: 1.5em;
				color: lightgreen; 
    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;
}

.youtubevideo iframe

 {
width : 560px;
height : 315px;
}


/* page Sahara-about */

.home
{
  margin-top : 10%;
  margin : 20px auto ;
  width: 80%;
  border: 2px solid #000000;
   background: rgba(2, 54, 54, 0.8);
    -pie-background:  rgba(2, 54, 54, 0.8);
  
  
  }


.home h2
{
  font-family: 'SH Pinscher';
	font-size: 2em;
  text-decoration : overline;
  text-align: center;
  color : white;
  position: relative;
  margin-top : 4%;

 
 
  
  }


.home h1 {			
text-align: center; 			
font-family: 'SH Pinscher';
font-style :normal ;
font-size: 3em;
color: lightgreen; }

.home p
{
  font-family: 'SH Pinscher';
	font-size: 1.1em;

  text-align: center;
  color : white;
  position: relative;
  margin-top : 5%;
  margin-left : 3.5%;
 
  
  }

.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 ;
}

.biotext
{
	width: 60%;
  box-sizing : border-box;
  padding : 20px;
  }

.biophoto
{ width: 40%;
 }
.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 : 60%;
 }

.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.0em;
}

.folder img 
{
width : 5%;
  }

.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';
}

.player 
{
border: 0; 
width: 40%; 
height: 406px;
}

#footer 

{
border: 0;  
height: 10px;
}


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

/* Style the icon bar links */
.icon-bar a {
  display: block;
  text-align: center;
  padding: 16px;
  transition: all 0.3s ease;
  color: lightgreen;
  font-size: 20px;
}

/* 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;
} 
