﻿/* ================================================================================ */
/**
* @PALMA style.css
* @brief Fichier de style CSS de PALMA OKAPI TOURS
* @author J.MUTANINA
* @date 09-10-2014
*
* Ce fichier et tout son contenu sont protégés par le droit d'auteur et sont soumis
* à licence. Toute utilisation, copie, ou distribution de ce fichier, de son contenu 
* ou de sa documentation est formellement interdite en dehors de tout accord préalable 
* avec son auteur.
*/
/* ================================================================================ */
/*! code  css de la page d'index et des entêtes et footer de toutes les pages du site de Palma Okapi Tours*/

/*! Code css du corps de la page d'index*/		
body {
	   background-repeat:no-repeat;
	   margin:0;
	   padding:0;
	   height:auto;
	   width:100%
	
     } 
html {
	   background-repeat:no-repeat;
       margin:0;
	   padding:0;
	
     }
/*! fin du code du corps (body)*/

/*! famille de caractère sur tous le site web.*/
html, body, input, select, textarea, button { font-family: segoe UI,Verdana, Arial, Helvetica, sans-serif; }
/*! Code Css du bloc d'entete de la page contenant le logo type avec le liens de retour vers l'index (page d'acceuil)*/	  
.entete {
		   max-width:1024px;
		   min-width:300px;
		   height:106px;
		   margin:auto;
	       margin-top:-2px;
		   background-color:white;
        } 
/*! Bloc contenant le logo de Palma Okapi*/		
#logo {
		   height:100px;
		   width:200px;
		   float:left;
		  
		   
        } 
/*! fin conde du logo*/	

/*! Pas des bordures pour */	
.entete img {
		   border:none;
		  
        }
/*! fin bordure des images de l'entête*/		

/*! style pour le menu superieur (Icone des reseaux sociaux) */	
.hautmenu {
		   max-width:950px;
		   min-width:300px;
		   min-height:auto;
		   float:right;
		   height:100px;
		   background-repeat:0px;
		   margin:auto;
		   margin-top:-10px;
		   padding-bottom:12px;
           padding-left:20px;
           
          }
		  
.hautmenu a{
		   margin:auto;
          }
		  
.hautsmenu a {
		   height:90px;
           width:100px;
		   margin-bottom:0px;
		   margin-left:2px;
           background-repeat:no-repeat;
		   z-index:4000;
		   
          }
		  
.hautmenu img{
		   border:none;
		   margin-bottom:-65px;
         }

.hautmenu .tour1 a {
		   background-image:url(t1.png);	
		   background-repeat:no-repeat;
		   padding-bottom:58px;
		   margin-left:14px;
          }
		  
.hautmenu .tour1 a:hover {
		   background-image:url(tup1.png);
           		   
          }
		 
.hautmenu .tour2 a {
		   background-image:url(t2.png);	
		   background-repeat:no-repeat;
		   padding-bottom:58px;
		   outline: none;
          }
		  
.hautmenu .tour2 a:hover {
		   background-image:url(tup2.png);	
		   outline: none;
          }
		  
.hautmenu .tour3 a {
		   background-image:url(t1.png);	
		    background-repeat:no-repeat;
		   padding-bottom:58px;
		   margin-left:-2px;
          }
		  
.hautmenu .tour3 a:hover {
		   background-image:url(tup1.png);	
          }
/*! Fin du menu supérieur (reseaux sociaux)*/	

/*! Code du menu principale de toutes les pages*/	

.contnavbar{height:50px;
            width:100%;
			min-width:1070px;
            background-color:#99d40a;
			background:-webkit-linear-gradient(#99d40a,#5fa231);
	               background:-moz-linear-gradient(#99d40a,#5fa231);
	               background:-ms-linear-gradient(#99d40a,#5fa231);
	               background:-o-linear-gradient(#99d40a,#5fa231);
	               background:linear-gradient(#99d40a,#5fa231);
	               filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#99d40a',endColorstr='#5fa231', GradientType=0);
			box-shadow: 0px 1.75px 1.75px 0px black;
			text-shadow: 0px 0.5px 0 rgba(0,0,0,.3);
            position:fixed;
            z-index:3000;		
            color:#333333;}

#menu{height:50px;
      width:1070px;
	  min-width:500px;
	  margin:auto;
      background-color:#99d40a;
			background:-webkit-linear-gradient(#99d40a,#5fa231);
	               background:-moz-linear-gradient(#99d40a,#5fa231);
	               background:-ms-linear-gradient(#99d40a,#5fa231);
	               background:-o-linear-gradient(#99d40a,#5fa231);
	               background:linear-gradient(#99d40a,#5fa231);
	               filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#99d40a',endColorstr='#5fa231', GradientType=0);
	  margin:auto;
	  position:relative;
      color:#333333;}

#menu ul{list-style-type:none;
        line-height:50px;
		width:1070px;
		min-width:500px;
        margin-left:20px;
        font-size:14px;}

#menu ul li{display:inline;
         padding:15px;
		
        }

#menu a{text-decoration:none;
        color:#fff;
        display:block;
        float:left;
        padding-left:18px;
        padding-right:18px;
        border-right:1px #719e04 solid;
		}

#menu li a:hover{text-decoration:none;
               color:#fff;
               background:#4e4f4f;
			   list-style:none;}

#active {text-decoration:none;
         color:#fff;
         background:#462c13;}
		 
#active2 {text-decoration:none;
         color:green;
		 font-style:underline;
		 background-color:#e4e4e4;
         }

#menu li a:active {text-decoration:none;
                color:#fff;
               }
			   
			   
#active a:hover{text-decoration:none;
         color:#fff;
		 }
		 
#haut{position:fixed;
      width:100%;
	  height:auto;
	  z-index:100000;
	  margin-top:0px;
	  background-color:white;
		 }
		 
#menu div{line-height:35px;
         float:left;
         margin-left:10px;
         padding-left:5px;
         padding-right:5px;
		 }		 
/*! fin du code du menu principal*/	 

/*! Code du grand diaporma de la page d'accueil*/
.ban {
		   max-width:100%;
		   text-align:center;
		   min-width:300px;
		   margin-top:65px;
		   height:400px;
		   position:relative;
		   border:none;
          }
		  
/*! Code du grand diaporama de la page d'acceuil*/	
/*! Contenaire d'image*/	  
.imcont {
		   max-width:1440px;
		   text-align:center;
		   box-shadow: 0px 2px 2px 0px gray;
		   height:389px;
		   margin:auto;
		   margin-top:19px;
		   border:none;
          } 
/*! Code de la taille de l'image du diaporama*/		  
.ban img {
		   max-width:1423px;
		   height:390px;
		   margin:0px;
		   margin-left:20px;
		   min-width:300px;
		   margin:0;
		   
          } 

/*! fin du code pour le grand diaporama de la page d'acceuil */			  
		 
/*! code du corps de la page du site web*/		  

.corp {
		   max-width:1024px;
		   min-width:300px;
		   padding-top:8px;
		   
		   height:auto;
		   margin:auto;
		   margin-top:1px;
		   
		   z-index:10000;
		   
          } 
.all{
		   max-width:1024px;
		   min-width:350px;
		   height:auto;
		   margin:auto;		   
          }
.contenu {
		   max-width:1024px;
		   min-width:300px;
		   height:auto;
		   margin:auto;		   
          }
/*! code du menu se trouvant apres la presentation*/			  
.basmenu {
		   max-width:880px;
		   min-width:300px;
		   min-height:auto;
		   height:120px;
		   background-color:#f0f1f2;
		   background-repeat:0px;
		   box-shadow: 0px 1.75px 1.75px 0px #d5d6d7;
		   margin:auto;
           padding-left:80px;
           padding-bottom:40px;
           
          }
		  
.ligne {
		   padding-top:2px;
           
          }
		  
.basmenu a {
		   background-image:url(1.png);	
           width:100px;
           height:40px;
           background-repeat:no-repeat;
           padding-top:100px;
		   padding-bottom:80px;
		   margin-right:0px;
		   
          }
		  
.basmenu img{
		   border:none;
         }
		 
/*! code du corps du premier liens du menu illustré dans le bas de la page d'accueil */			 
.basmenu .voyage a {
		   background-image:url(phone.png);	
		   background-repeat:no-repeat;
          }
		  
.basmenu .voyage a:hover {
		   background-image:url(phone2.png);	
          }
		  
		  
.basmenu .activite a {
		   background-image:url(act1.png);	
		   background-repeat:no-repeat;
          }
		  
.basmenu .activite a:hover {
		   background-image:url(act2.png);	
          }
		  
.basmenu .hotel a {
		   background-image:url(hot1.png);	
		   background-repeat:no-repeat;
          }
		  
.basmenu .hotel a:hover {
		   background-image:url(hot2.png);	
          }
		  
.basmenu .restaurant a {
		   background-image:url(resto1.png);	
		   background-repeat:no-repeat;
          }
		  
.basmenu .restaurant a:hover {
		   background-image:url(resto2.png);	
          }

.basmenu .shooping a {
		   background-image:url(mag1.png);	
		   background-repeat:no-repeat;
          }
		  
.basmenu .shooping a:hover {
		   background-image:url(mag2.png);	
          }

.basmenu .zooparcs a {
		   background-image:url(zoop1.png);	
		   background-repeat:no-repeat;
          }
		  
.basmenu .zooparcs a:hover {
		   background-image:url(zoop2.png);	
          }

.basmenu .hopital a {
		   background-image:url(hosto1.png);	
		   background-repeat:no-repeat;
          }
		  
.basmenu .hopital a:hover {
		   background-image:url(hosto2.png);	
          }
/*fin du code du menu de apres la presentation*/

/*code du bloc contenant les produits de palma Okapi Tours*/
.produits {
		   max-width:950px;
		   min-width:300px;
		   min-height:auto;
		   height:120px;
		   border:solid #cccdce 1px 0px 1px ;
		   border-top:solid #cccdce 1px;
		   margin:auto;
           padding-left:0px;
           padding-bottom:40px;
		   Padding-left:35px;
           
          }	
.produits img{
		   border:none;
          }	
/*fin du code du bloc contenant les produits de palma Okapi Tours*/

/*Grand titre de la page d'accueil souhaitant la bienvenue*/			  
.titre h1{
		   margin:0px;
		   padding:0px;
		   margin-bottom:2px;
		   margin-left:30px;
		   font-size:16px;
		   Padding:4px;
		   font-style:normal;
		   padding-left:15px;
		   color:white;
		   width:140px;
		   font-family:helvetica;
		   background-color:#462c13;
		   text-shadow: 0px 0.5px 0 rgba(0,0,0,.3);	
          } 
/*code pour les differents paragraphes qui se trouverons sur le site web.*/		  
.corp p{
		   margin-left:40px;
		   text-align:justify;
		   margin-right:40px; 
          } 

.corp .contenu p.contacter{
		   margin-left:40px;
		   text-align:justify;
		   letter-spacing:1px;
		   margin-right:40px;
		   color:gray;
		   font-size:16px;
		   
          } 
		  
.corp .contenu h1{
		   margin-left:40px;
		   font-family:helvetica;
		   font-size:28px;
		   color:#042d4a;
		   margin-top:0px;
		   margin-bottom:0px;
          } 
		  
		  
.copyright {
		   max-width:1024px;
		   min-width:300px;
		   background-color:#fafafa;
		   height:90px;
		   margin:auto;
		   border-top:solid #cccdce 1px;
		   text-align:center;
          } 
		  
.copyright p {
		   font-family:arial;
		   font-size:12px;
		   color:#7a7c7d;
          } 
/*! fin du code la la structure general du site web*/

/*Code pour le corps de la page destination*/
.destinations{
		   width:1024px;
		   height:auto;
		   background-color:#ffffff;
		   border-top:solid #cccdce 1px;
          } 
/*Code des sous-blocs de la page destination*/		  
.nature {
		   width:1024px;
		   height:auto;
		   margin:auto;
           border-top:solid #cccdce 1px;
          }
		  
.sousnature	{
		   width:1024px;
		   height:600px;
		   padding-left:45px;
		   margin:auto;
          }	
	
		  
.image1 {
		   width:295px;
		   height:200px;
		   margin:auto;
		   margin-right:30px;
		   float:left;
		   position:relative;
          }
		  
.image1 h2{
		  
		   font-size:15px;
		   font-family:helvetica;
		   color:#99d40a;
		   margin-top:0px;
		   margin-bottom:8px;
		   padding-bottom:8px;
		   height:30px;
          }
		 
		  
.intro1 {
		   width:295px;
		   height:auto;
		   margin:auto;
		   margin-right:30px;
		   margin-top:8px;
		   padding-top:8px;
		   padding-bottom:16px;
           border-top:solid #cccdce 1px;
		   float:left;
		   font-size:13px;
          }
.iyi {
		   width:295px;
		   height:auto;
		   margin-right:30px;
		   margin-top:8px;
		   padding-top:8px;
		   padding-bottom:16px;
           border-top:solid #cccdce 1px;
		   float:left;
		   font-size:13px;
          }
		  
.intro1 p {
		   width:295px;
		   height:auto;
		   margin:auto;
		   margin-right:16px;
		   text-align:left;
		   font-size:13px;
          }
/*fin destination*/
		  
/*Code de la baniere des sous pages de destination*/		  

.bancity	{
		   width:1024px;
		   height:300px;
		   background-color:gray;
		   margin:auto;
		   margin-top:12px;
          }


.destban	{
		   width:1024px;
		   height:300px;
		   background-color:gray;
		   margin:auto;
		   margin-top:12px;
		   background-image:url(kundelungu.jpg);
          }
		  
.destban3	{
		   width:1024px;
		   height:300px;
		   background-color:gray;
		   margin:auto;
		   margin-top:12px;
		   background-image:url(upemba.jpg);
          }	
.makwacha	{
		   width:1024px;
		   box-shadow:0 3px 3px rgba(0,0,0,.3);
		   height:300px;
		   background-color:gray;
		   margin:auto;
		   margin-top:12px;
		   background-image:url(makwacha.jpg);
          }
		  
.velosafari	{
		   width:1024px;
		   box-shadow:0 3px 3px rgba(0,0,0,.3);
		   height:300px;
		   background-color:gray;
		   margin:auto;
		   margin-top:12px;
		   background-image:url(velosafari.jpg);
          }
.tourkatanga{
		   width:1024px;
		   box-shadow:0 3px 3px rgba(0,0,0,.3);
		   height:300px;
		   background-color:gray;
		   margin:auto;
		   margin-top:12px;
		   background-image:url(katangatour.jpg);
          }
/*Code du menu contextuel des sous page de la page destination*/		  
.contextemenu	{
		   width:984px;
		   height:28px;
		   background-color:rgb(247, 247, 247);
		   margin:auto;
		   border:solid #cccdce 1px 0px 1px ;
		   border-top:solid #cccdce 1px;
		   font-family:segoe Ui, Helvetica;
		   padding-left:40px;
		   padding-top:8px;
          }
		  
.contextemenu	a{
		   text-decoration:none;
		   border-right:solid #cccdce 1px;
		   padding:4px;
		   padding-right:8px;
		   color:gray;
          }
		  
.contextemenu a{
		   text-decoration:none;
		   border-right:solid #cccdce 1px;
		   padding:8px;
		   margin-left:0px;
		   padding-right:8px;
		   margin-left:-4px;
          }
		  
.contextemenu a:visited{
		   color:gray;
          }
/*fin du menu contextuel*/

/*contenaire d*/		  
.destcontenu {
		   width:1024px;
		   height:auto;
		   padding-bottom:40px;
		   margin:auto;
           border-top:solid #cccdce 1px;
          }
.destcontenu h1 {
		   margin-left:40px;
          }
.destcontenu a {
		  color:gray;
          }
		  
.contenairedest 	{
		   width:1024px;
		   height:auto;
		   margin:auto;
           border-top:solid #cccdce 1px;
          }  
		  
.culture {
		   width:1024px;
		   height:600px;
		   margin:auto;
           border-top:solid #cccdce 1px;
		   background-color:#ffffff;
          }

/*! code de la zone de navigation secondaire à gauche de la page animaux*/			  
.nav-gauche {
			width:270px;
			height:180px;
			background-color: rgba(151,209,11,.5);
			box-shadow:0 3px 3px rgba(0,0,0,.3);
			text-shadow: 0px 0.5px 0 rgba(0,0,0,.3);
			font-family:segoe Ui light;
			float:left;
			list-style:none;
			z-index:1000;
			padding-top:8px;
			text-align:left;
			}
			
.nav-gauche ul li a {
					 color:#ffffff;
					 text-decoration:none;
					 list-style:none;
					 margin-top:0px;
					 padding-top:1px;
					 padding-bottom:4px;
					 padding-left:30px;
					 padding-right:85px;
					 margin-top:5px;
			}
			
.nav-gauche ul li  { width:270px;
                  text-decoration:none;
                  height:30px;
				  box-shadow:0 1px 2px rgba(0,0,0,.2);
				  margin-right:0px;
				  float:left;
				  background-color:rgba(151,209,11,.5);
                  margin-top:1px;				  
			}
			
			
.nav-gauche ul li:hover {
         
			background-color:rgba(151,209,11,.2);
			color:#ffffff;
			text-decoration:none;
			list-style:none;
			}
 .nav-gauche ul li.act{ background-color:#916b06;
                      text-decoration:none;
					  
                  }
				  
 .nav-gauche ul li.act:hover { background-color:#916b06;
                            list-style:none;
							text-decoration:none;
                  }
			
.nav-gauche ul  {
         
			margin-left:0px;
			text-decoration:none;
			list-style:none;
			}
			
.partenaires{
		   width:1024px;
		   height:600px;
		   background-color:#ffffff;
		   border-top:solid #cccdce 1px;
          } 
		  
.partenaires img{
		   border:none;
          } 

		  
.logopart {
		   width:962px;
		   height:600px;
		   margin:auto;
		   box-shadow: 0px 1.75px 1.75px 0px #d5d6d7;
		   background-color:#ffffff;
          } 

/*! corps de la page contacts*/
.truc	{
		   width:1024px;
		   height:670px;
		   background-color:#ffffff;
          } 
		  
#geolocalisation	{
		   width:1024px;
		   height:300px;
		   background-color:#cdcdcd;
		   text-align:center;
		   margin:auto;
		   margin-top:45px;
          }

	


.login p { 
         color:gray;
		 text-align:justify;
		 margin-left:10px;
		 padding-right:5px;
		 font-family:lane-narrow;
	}
	
		
#log  input {
		padding-top:7px;
		padding-bottom:7px;
		padding-left:10px;
		padding-right:10px;
		font-size:18px;
		text-align:justify;
	    margin=auto;
        } 
		
#log {
		width:450px;
		height:auto;
		margin-right:40px;
		float:right;
		
        }
	

.login textarea	{
		padding:50px;
        } 
	
/*! bouton de connexion*/		
.btnconnexion { 
         
		 color:#e6e8ee;
		 padding:10px;
		 font-size:18px;
		 border:0px;
		 margin-top:10px;
		 box-shadow:0 0.75px 3px rgba(0,0,0,.3);
		 text-shadow: 0px 0.5px 0 rgba(0,0,0,.3);	
		 background-color:#99d40a;
			background:-webkit-linear-gradient(#99d40a,#5fa231);
	               background:-moz-linear-gradient(#99d40a,#5fa231);
	               background:-ms-linear-gradient(#99d40a,#5fa231);
	               background:-o-linear-gradient(#99d40a,#5fa231);
	               background:linear-gradient(#99d40a,#5fa231);
	               filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#99d40a',endColorstr='#5fa231', GradientType=0);		 
	}
	
.btnannulation { 
         
		 color:#e6e8ee;
		 padding:10px;
		 font-size:18px;
		 border:0px;
		 margin-top:10px;
		 box-shadow:0 0.75px 3px rgba(0,0,0,.3);
		 background-color:#e41309;	
         background:-webkit-linear-gradient(#e41309,#b30b03);
	               background:-moz-linear-gradient(#e41309,#b30b03);
	               background:-ms-linear-gradient(#e41309,#b30b03);
	               background:-o-linear-gradient(#e41309,#b30b03);
	               background:linear-gradient(#e41309,#b30b03);
	               filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e41309',endColorstr='#b30b03', GradientType=0);		 		 
	}	

/*! titre du bloc des contacts*/
.titrecontacts {
		   background-color:#916b06; 
		   width:250px;
		   height:30px;
		   float:right;
		   margin-top:30px;
		   margin-right:255px;
		   box-shadow:0 1px 3px rgba(0,0,0,.3);
          }
		  
.titrecontacts h2 {
		  font-size:18px;
          color:#ffffff;
		  padding-top:0px;
		  margin:0px;
		  margin-left:40px;
          font-family:segoe UI light;	
          text-shadow: 0px 0.5px 0 rgba(0,0,0,.3);		  
          }
/*! fin du code des blocs des contacts*/	
  
.contacts { 
         
		 margin-top:20px;
		 margin-right:40px;
		 padding-left:30px;
		 height:250px;
		 Width:450px;
		 padding-bottom:70px;
         float:right;
		 color:gray;
		 font-family:segoe UI semi-light;
		 border-left:1px #e6e8ee solid;
       
	}
.machin { 
         
		 width:460px;
		 height:300px;
		
		 float:left;
		 padding-left:40px;
       
	}
	
.contacts p { 
         margin-left:10px;         
	}
	

		  
.compte { 
         
		 width:400px;
		 height:35px;
		 margin-right:-40px;
		 float:right;
		 position:relative;
		 padding-right:20px;
	}
.contenucontacts {
		   max-width:300px;
		   position:relative;
		   min-width:400px;
		   height:550px;
		   margin:auto;	
		   margin-top:60px;
		   padding-top:30px;
		   padding-left:20px;
		   background-color:#ffffff;         
          }	
		  
.contacts h2 {
		  font-size:18px;
		  padding-top:0px;
		  margin:0px;
		  margin-left:10px;
          font-family:helvetica;	
          text-shadow: 0px 0.5px 0 rgba(0,0,0,.3);		  
          }		  

	

	


