* {margin: 0; padding: 0}
body {background: #2b2b2b;}
html, body {direction: rtl; width: 100%; height: 100%;}
@font-face { font-family: 'DroidKufiBold'; src:url(../fonts/droidkufi-bold.eot); src:url(../fonts/droidkufi-bold.eot?#iefix) format('embedded-opentype'), url(../fonts/droidkufi-bold.woff) format('woff'), url(../fonts/droidkufi-bold.ttf) format('truetype'), url(../fonts/droidkufi-bold.svg#webfontRl4nowrT) format('svg'); font-weight:400; font-style:normal }
@font-face { font-family: 'DroidKufiLight'; src:url(../fonts/droidkufi-regular.eot); src:url(../fonts/droidkufi-regular.eot?#iefix) format('embedded-opentype'), url(../fonts/droidkufi-regular.woff) format('woff'), url(../fonts/droidkufi-regular.ttf) format('truetype'), url(../fonts/droidkufi-regular.svg#webfontRl4nowrT) format('svg'); font-weight:400; font-style:normal }
@font-face { font-family: 'MasrawyIcons'; src:url(../fonts/masrawyicons.eot?ref=1.1); src:url(../fonts/masrawyicons.eot?#iefix) format("embedded-opentype"), url(../fonts/masrawyicons.woff?ref=1.1) format("woff"), url(../fonts/masrawyicons.ttf?ref=1.1) format("truetype"), url(../fonts/masrawyicons.svg?ref=1.1) format("svg"); }

.clear { clear: both; }
 a {text-decoration:none !important}
h1, h2 {font-family: 'DroidKufiBold';}
p, h3, a {font-family: 'DroidKufiLight'; color: #fff; line-height: normal;}
span {font-family: 'DroidKufiBold'; font-weight: bold;}

.headContainer { background: #2b2b2b; z-index: 0; position: relative; }

/*.headContainer { background: url(../imgs/bg.jpg) center center; background-size: cover; position: relative; z-index: 0; }*/
/*.headContainer:before { width: 100%; height: 100%; position: absolute; top: 0; right: 0; content: ''; background: rgba(0, 0, 0, 0.7); z-index: -1 }*/
.intro {position: relative; padding: 8rem 0 4rem 0; text-align: center; font-family: 'DroidKufiLight';}
.title { text-align: center; color: #fff; font-size: 4rem; }
.description { text-align: center; margin-bottom: 4rem; font-size: 2rem; }
.textContent { width: 80%; margin: auto; text-align: justify; padding: 3rem; line-height: normal; font-size: 1.6rem; }
.textContent:nth-child(2n+1) {background: rgba(0, 0, 0, 0.3);}
.textContent:nth-last-child(2) {margin-bottom: 2rem;}
.enter { text-decoration: none; background: #bd111c; color: #fff; font-size: 2rem; padding: 0px 20px;}
.enter:hover {color: #fff}
.hideElement {opacity:0;}
.textContent img {width: 100%}


@media screen and (max-width: 600px) {
    .title {font-size: 3rem}
    .description {font-size: 2rem;}
}


@media screen and (max-width: 400px) {
    .textContent {text-align: center;}
}

.note {
    width: 71%;
    margin: 34px auto 34px auto;
    font-size: 1.8rem;
    background: #1e1e1e;
    padding: 11px;
    border-right: 3px solid red;
    text-align: justify;
}

.map {width: 100%; margin: 24px auto 24px auto;}
.map img {width: 100%}

.one h1 {font-size: 2rem; color: #fff}


.redGuide {width: 80%; max-width: 728px; height: 90px; overflow: hidden; margin: 24px auto; border: 1px solid red;}