/*
 * Copyright (c) 2012-2013 Arbaoui Mehdi
 * http://www.depotwebdesigner.com
 */
body {
	padding:5px;
	font-family: Georgia;
}

#navigation {
	width:980px;
	font-size:14px;
	position: relative;
/*	left:27px; */
	margin: auto;
}

#navigation a {
	color:#fff;
	text-decoration:none;
}

#navigation nav {
	box-shadow: 0 0 16px -1px #211b96;
	text-transform: uppercase;
	background: #5248dc;
	height:58px;
	border-left:1px solid #5a4ee4;
	border-right:1px solid #5a4ee4;
	z-index:3;
	position: relative;
	width:95%;
	left:2.4%;
}

nav a {
	padding:4px 20px;
	border-radius:15px; 
}

nav a:hover { background:#2b1daa; }

.active-menu {
	padding:5px 25px;
	background:#695bf4;
	margin-right:15px;
}

#navigation ul {
	padding:0;
	margin:0;
	position: absolute;
	top:40%;
	right:30px;
}

#navigation ul li {
	float:left;
	list-style: none;
	margin-left:0;
}

#logo {
	position:absolute;
	top:30%;
	left:5%;
	font-size:22px;
	z-index:4;
	font-style: italic;
	text-shadow: 1px -2px 4px #221596;
}

.dark-color {
	position: relative;
	width:100%;
	height: 79px;
	background:#2b1daa;
}

.light-color {
	background: #5248dc;
	z-index: 3;
	position: relative;
	width:102%;
	top:13%;
	left:-1%;
}

.arrows {
	position:absolute;
	width:100%;
	height: 100%;
}

 .arrows span {
	position: absolute;
	width:0;
	height:0;
	border-top: 39px inset transparent;
	border-bottom: 39px inset transparent;
}

.ar-left {
	left:0;
	border-left: 10px solid #e4ebe9;
	z-index:2;
}

.ar-right {
	right:0;
	border-right: 10px solid #e4ebe9;
	z-index:2;
}

.ar-left2, .ar-right2 {
	border-top: 30px inset transparent !important;
	border-bottom: 30px inset transparent !important;
	top:9.7%;
	z-index:4;
}

.ar-left2 {
	left:-1.1%;
	border-left: 12px solid #e4ebe9;
}

.ar-right2 {
	right:-1%;
	border-right: 12px solid #e4ebe9;
}