body{
	margin : 2%;
	background-color: #FFFFF0;
}

header{
	background-color: #246D5F;
	border-radius: 15px;
	padding:1%;
}

#logo1{
	display:block;
	width: 25%;
	height : 25%;
	border-radius: 10px;
	margin:auto;
	float:center;
}

h1{

	font-family: "Segoe ui", Verdana, Arial, "Times New Roman";
	font-size: 3em;
	color: #FFFFFF;
	margin: 2%;
	text-align: center;
	display: block;
	

}

h2{
	font-family: Garamond, Arial, "Times New Roman";
	font-size: 1.8em;
	font-style: italic;
	color: #FFFFFF;
	margin-bottom: 4.2%;
	text-align: center;
	display: block;
	
}

h3{
	background-color: #246D5F;
	color:#ffffff;
	padding:1%;
	text-align: center;
	border-radius: 5px;

}

h4{
	text-align: center;
}

nav{
	margin:2%;
}
nav a{
	box-sizing:border-box;
	display:inline-block;
	width: 19%;
	line-height: 200%;
	color: #479030;
	background-color:#a2d890;
	text-decoration: none;
	margin:auto;
	padding:1% ;
	border-radius: 5%;
	font-family: Georgia, Arial, "Times New Roman";
	font-size: 0.9em;
	text-align: center;
}

nav>a:hover{
	background-color: #000000;
	color: #a2d890;
}

.active{
	background-color: #479030;
	color: #a2d890;
}

img{
	width: 40%;
	height: auto;
}

.flag{
	display:inline-block;
	float:right;
	width: 4%;
	padding:1%;
}	

.description{
	width:96%;
	display: inline-block;
	background-color: #B0BDAC;
	color:#0C2E5F;
	font-family: "Segoe ui", Verdana, Arial;
	font-size: 1.1em;
	text-align: justify;
	margin:0%;
	padding:2%;
	border-radius: 15px;
}



.ID{
	border: solid 1px #000000;
	display: block;
	width:25%;
	margin:auto;
	padding: 1%;
}

.links_to_services{
	display:inline-block;
	padding:2%;
	margin:0 center;

}

.links_to_services>a{
	margin:4%;
}

#Afrique{
	display: none;
}

/*Contact_us Page*/

#contact-form input[type="text"],
#contact-form input[type="email"],
#contact-form textarea,
#contact-form button[type="submit"] {
	font:400 12px/12px "Helvetica Neue", Helvetica, Arial, sans-serif;
}
#contact-form {
	text-shadow:0 1px 0 #FFF;
	border-radius:4px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	background:#F9F9F9;
	padding:4%;
}
#contact-form h3 {
	color:#FFFF00;
	display:block;
	margin:0;
	font-size:1.8em;
}
#contact-form h4 {
	margin:1% 0 4%;
	display:block;
	font-size:0.9em;
	font-style: italic;
}
#contact-form label span {
	cursor:pointer;
	color:#4C668C;
	display:block;
	margin:5px 0;
	font-weight:900;
}
#contact-form input[type="text"],
#contact-form input[type="email"],
#contact-form textarea {
	width:100%;
	box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	-webkit-box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	-moz-box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	border:1px solid #CCC;
	background:#FFF;
	margin:0 0 1%;
	padding:1.6%;
	border-radius:5px;
}
#contact-form input[type="text"]:hover,
#contact-form input[type="email"]:hover,
#contact-form textarea:hover {
	-webkit-transition:border-color 0.3s ease-in-out;
	-moz-transition:border-color 0.3s ease-in-out;
	transition:border-color 0.3s ease-in-out;
	border:1px solid #AAA;
}
#contact-form textarea {
	height:100px;
	max-width:100%;
}

#medovamisa {
	visibility:hidden;}

#contact-form button[type="submit"] {
	cursor:pointer;
	width:90%;
	border:none;
	background:#142E54;
	background-image:linear-gradient(bottom, #142E54 0%, #2C4770 52%);
	background-image:-moz-linear-gradient(bottom, #142E54 0%, #2C4770 52%);
	background-image:-webkit-linear-gradient(bottom, #142E54 0%, #2C4770 52%);
	color:#FFFFFF;
	margin:6%;
	padding:2%;
	border-radius:5px;
	font-size: 0.8em;
}
#contact-form button[type="submit"]:hover {
	background-image:linear-gradient(bottom, #286C12 0%, #479030 52%);
	background-image:-moz-linear-gradient(bottom, #286C12 0%, #479030 52%);
	background-image:-webkit-linear-gradient(bottom, #286C12 0%, #479030 52%);
	-webkit-transition:background 0.3s ease-in-out;
	-moz-transition:background 0.3s ease-in-out;
	transition:background-color 0.3s ease-in-out;
}
#contact-form button[type="submit"]:active {
	box-shadow:inset 0 1px 3px rgba(0,0,0,0.5);
}
#contact-form input:focus,
#contact-form textarea:focus {
	outline:0;
	border:1px solid #999;
}
::-webkit-input-placeholder {
    color:#888;
}
:-moz-placeholder {
    color:#888;
}
::-moz-placeholder {
    color:#888;
}
:-ms-input-placeholder {
    color:#888;
}
/*End of Form Contact_us*/

/*Login Page*/
#login_logo{
	width:40%;
	display:block;
	margin:0 auto;
}
#login_heading{
	display:block;
}


#login_fields input[type="text"],
#login_fields input[type="password"]{
	width:50%;
	box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	-webkit-box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	-moz-box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	border:1px solid #CCC;
	background:#FFF;
	margin:0 0 1% 25%;
	padding:1.7%;
	border-radius:5px;
}

#login_fields button[type="submit"] {
	cursor:pointer;
	width:50%;
	border:none;
	background:#142E54;
	background-image:linear-gradient(bottom, #142E54 0%, #2C4770 52%);
	background-image:-moz-linear-gradient(bottom, #142E54 0%, #2C4770 52%);
	background-image:-webkit-linear-gradient(bottom, #142E54 0%, #2C4770 52%);
	color:#FFFFFF;
	margin:0 0 1% 27%;
	padding:1.7%;
	border-radius:5px;
}

#login_fields button[type="submit"]:hover {
	background-image:linear-gradient(bottom, #286C12 0%, #479030 52%);
	background-image:-moz-linear-gradient(bottom, #286C12 0%, #479030 52%);
	background-image:-webkit-linear-gradient(bottom, #286C12 0%, #479030 52%);
	-webkit-transition:background 0.3s ease-in-out;
	-moz-transition:background 0.3s ease-in-out;
	transition:background-color 0.3s ease-in-out;
}
#login_fields button[type="submit"]:active {
	box-shadow:inset 0 1px 3px rgba(0,0,0,0.5);
}

#no_client{
	text-align: center;
	padding: 3%;
}

#no_client > a{
	color:blue;
	font-family: Georgia, Arial, Garamond;
}
/*End of Login Page*/



footer{
	background-size: 20%;
	background-color: #246D5F;
	padding: 1%;
	border-radius: 15px;
}

table{
	font-family: Georgia, Verdana, Arial;
	font-weight: 500;
	font-size: 0.70em;
	line-height:1.5;
	width:75%;
	margin: 0 auto;
	text-align: left;
	padding:1%;
	color:#A1D890;	
}

a{
	color:#ffffff;
	text-decoration: none;
}

th{
	font-family: Garamond, Arial, "Times New Roman";
	font-size: 150%;
	color: #6DA398;
	text-align: center;
	margin:2%;
	margin-bottom: 1px;

}


#logo2{
	display:none;
}

#copyright, #madeby{
	color: #FFFFF0;
	display: block;
	margin: auto;
	font-size: 0.8em;
	text-align: center;
}


@media screen and (min-width: 600px){

	#logo1{
		float:left;
		margin:1%;
		width:20%;
}
	
	h1{
		font-size: 3em;
	}

	h4{
		text-align: left;
	}
	
	nav{
		font-size: 1.4em;
	}
	.description{
		width:96%;
		padding: 2%;
		font-size: 1.3em;
	}

	.ID{
	width:20%;
	float:left;
	padding: 1%;
	margin: 2%;
	}

	img{
		width:70%;
		height: auto;

	}
	
	#Afrique{
		display: block;
		width:60%;
		margin:2% 20% 1% 20%;
	}

.links_to_services{
	width:90vw;
}

	#security1{
		display: inline-block;
		width: 35%;
		margin-left:2%;
		float: left;
	}

	#economy1{
		display: inline-block;
		width: 35%;
		margin-right:2%;
		float: right;
	}

	table{
		font-size: 0.9em;
	}

	#logo2{
		display: none;
	}

	#copyright, #madeby{
	font-size: 1em;
}


}


@media all and (min-width: 980px){

	body{
		margin: 2% 10% 2% 10%;
	}
	

	h1{
		font-size: 4em;
	}

	
	nav{
    	display:inline-block;
    	width: 17%;
    	min-width: 125px;
    	margin-right:1%;
    	float:left;
    	background-color: #246D5F;
		border-radius: 15px;
		padding:0.5%;
  }

	nav a{
		font-size: 0.9em;
		display: block;
		width:80%;
		line-height: 45px;
		margin:10% 10%;
		padding: 5%;
	}
	.content{
		width:78%;
	}
	
	.description{
		
		margin: 1% 1% 1% 1%;
	}
	
	.Flex{
		display:flex;
		margin: 0.5%;
}
	#Afrique{
		display: inline-block;
		width: 43%;
		margin:1%;
	}

	.links_to_services{
		width:20vw;
		padding:2%;
		margin:auto;
		float:right;
	}

	#security1{
		display: block;
		margin:10%;
		width: 80%;
	}

	#economy1{
		display: block;
		margin:10%;
		width: 80%;
	}

	footer{
		clear:left;
	}

	#logo2{
		display: inline;
		width: 20%;
		height : auto;
		float:right;
		border-radius: 10px;
	}

	 
	
}

@media screen and (min-width: 1400px){
	body{
		margin: 2% 18% 2% 18%;
	}
	.links_to_services{
		width:16vw;
	}
}