﻿/***********autor / HeBa elkady***********/
@font-face {
    font-family: "Droid Arabic Kufi";
    src: url("DroidKufi-Regular.eot?#iefix") format("embedded-opentype"), url("DroidKufi-Bold.ttf") ;
    font-weight: 400;
}
@font-face {
    font-family: "Droid Arabic Kufi";
    src: url("DroidKufi-Regular.eot?#iefix") format("embedded-opentype"), url("DroidKufi-Bold.ttf") format("truetype");
    font-weight: 700;
}

       body {
         background: #1269b6; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiMxMjY5YjYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMDYxMTJkIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L3JhZGlhbEdyYWRpZW50PgogIDxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-radial-gradient(center, ellipse cover, #1269b6 0%, #06112d 100%); /* FF3.6+ */
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#1269b6), color-stop(100%,#06112d)); /* Chrome,Safari4+ */
background: -webkit-radial-gradient(center, ellipse cover, #1269b6 0%,#06112d 100%); /* Chrome10+,Safari5.1+ */
background: -o-radial-gradient(center, ellipse cover, #1269b6 0%,#06112d 100%); /* Opera 12+ */
background: -ms-radial-gradient(center, ellipse cover, #1269b6 0%,#06112d 100%); /* IE10+ */
background: radial-gradient(ellipse at center, #1269b6 0%,#06112d 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1269b6', endColorstr='#06112d',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */                font-family: "Droid Arabic Kufi";
                text-align:right;
                color:#fff
	    }
.logo {
    position:absolute;
    right: 10px;
    top: 20px;
}
       img, a img {  max-width: 100%;
  height: auto;  vertical-align: middle;
}
		.mapTooltip {
			position:fixed;
			background-color : #fff;
			moz-opacity:0.70;
			opacity: 1;
			filter:alpha(opacity=70);
			border-radius:10px;
			padding : 10px;
			z-index: 1000;
			max-width: 200px;
			display:none;
			color:#343434;
		}
		
		.cityFrance {
			background-color:#343434;
			border-radius:10px;
			width:400px;
		}
		
		.mapLegend {
		}
        .areaLegend {
    
    text-align: center;
    position:absolute;
    bottom:0
}.title {
    margin-top: -26px;
    vertical-align: middle;
}
.map {
    height:600px
}
.display {
    display: inline-block;
}
.text_center {
    text-align:center;
    margin-bottom:30px;
    margin-top:30px
}
.title-x {
    position:absolute;
    bottom:0;
    background:#fff;
    color:#000;
    right:0
}
.motif-headline {
    background: url("../images/motif-headline.png") no-repeat scroll center center;
    padding: 20px 27px;
}
a {
    color:#fff
}
		
		h2 {
			font-size:22px;
		 margin:10px 0;
            text-align:center
		 
		}
		
		.container {
			margin:auto;
			width:80%;
		}
		
		 
	 

        @media screen and (max-width: 940px) {
    .map {
 
            height:250px
		}
}

        @media (max-width: 768px) {
     .map {
 
            height:200px
		}
        .title-x {
                font-size:11px
            }
            .logo {display:none            }
            .title {
                 font-size:11px
            }
}
 
          @media (max-width: 475px) {
     .map {
 
            height:100px
		}
            .title-x {
                font-size:10px
            }
            .logo {display:none            }
            .title {
                 font-size:10px
            }
}
 