@import url(http://fonts.googleapis.com/css?family="Esteban");

html, body { height: 100%; }

/* Links */
a {
/*  border-bottom: 1px solid #e5cfcf;*/
  color: #b31b1b;
  text-decoration: none;
  }
  
a:visited {
  color: #b37474;
  }
  
a:hover {
  color: #f00;
  border-color: #f00;
  }
  
a:active {
  color: #b31b1b;
  border-color: #e5cfcf;  
  }

body {
  padding: 0;
  margin: 0;
  color: #325050;
/*  background: #fff;*/
  font-family: 'verdana', 'arial', 'Open Sans light', sans-serif;
  font-size: 80%;
}

/* Header */
#header {

}

/* language */
.lang {
  content: 'English';
  
}
.lang img {
  border-bottom:1px solid #666;
  border-left:1px solid #666;
  border-right:1px solid #666;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  /* margin-top: 10%;*/
  margin-left: 80%;
  height: 30px;
}

.esire-look{
  color: #000; 
  font-family:'Times New Roman', 'Esteban', serif;
  font-size: 25px;
  } 
.esire-look-red {
color: #f00;
}

/* ESIRE-Logo Defintion */

#esire {
  height: 123px;
  margin: 0;
  width: 220px;
  font-family: "times new roman", "Esteban", serif;
  letter-spacing: 0.6px; 
  font-size: 20px;
  }
 
#esire sup {
  font-size: 20px;
  }
  
#esire a {
  float: left;
  padding: 50px 0px 0px 0px; /* top right bottom left*/
  border: 1px solid #f00;
  margin: 3px 3px 0px 3px;
  width: 33px;
  font-size: 45px;
  font-weight: bold;
  color: #fff;
  background: #f00;
  text-decoration: none;
  text-align: center;
  }
  
#esire a:hover {
  color: #f00;
  background: #fff;
  border: 1px solid #f00;
  }

/* ***************************** */
/*  linkrow under logo  */
.linkrow:before { 
  margin-left: 3px;
  letter-spacing: 0.5px;
  position: relative;
  content:'Die Immobilienagentur'; 
  }
.e:hover ~ .linkrow:before {
   content:'El Sayed International Real Estate';
   white-space:nowrap;
   letter-spacing: -2.3px; 
}  
.s:hover ~ .linkrow:before {
   content:'Service';
}
.i:hover ~ .linkrow:before {
   content:'Impressum';
}
.r:hover ~ .linkrow:before {
   content:'Referenzen';
}
.m:hover ~ .linkrow:before {
   content:'E-Mail';
}


/* ***************************** */

/* navigation */
#navigation {
  margin: 10px 0px 0px 0px;
  padding: 5px;
  border-bottom: 1px solid #f00;
  border-top: 1px solid #f00;
  font-size: 15px;
  font-weight: bold;
  }
  
#navigation a {
  color: #f00;
  text-decoration: none;
  display: inline;
  }

#navigation ul {
  padding: 0;
  width: 100%;
}

#navigation ul a li {
  margin-top: 1%;
  background: #f0eee4;
  list-style-type: none;
  padding: 10px;
}

#navigation ul a:hover li {
  background: #f0eee4;
}

#navigation ul a:active li {
  background: #ff9e7d;
}
#social-plugin {
  margin-top:5%;
  margin-right:1%;
  box-shadow: 0px 2px 7px #292929; 
  background-color:#fff;"
}

#uppercase {
  float: left;
  padding: 4px 1px 0px 1px;
  margin: -10px 1px 0px 0px;
  width: 15px;
  color: #fff;
  font-family: "times new roman", "Esteban", serif;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  border-top: 1px solid #f00;
  border-right: 1px solid #f00;  
  border-left: 1px solid #f00;
  background-color: #f00; 
  display: inline-block;
  }

/*#navigation ul a .lang {
  padding: 0px;
  text-align: center;
}*/

.aktuelles {
  background-color: #f00 !important; 
  color: #fff; 
  text-decoration: bold;
  letter-spacing: 1px; 
  text-align: center; 
  font-size: 25px;  
}
  
/* ***************************** */


/* Content */
#content {
  top: 10px;
}

.aktuellh2 {
  visibility: hidden;
  font-size: 25px;
}

#content a {
  boarder: 0px;
  text-decoration: none;
}

#content a img {
  width: 100px;
  margin: 0% 3% 3% 0%;
  float: left;
}
.secondhead {
  font-size: 12px; 
  width:70%;
  }
/* ***************************** */

/* Footer */
#footer {
  margin: auto;
  text-align: center;
  padding: 30px 0px 0px 0px;
}

#pageup {
  padding: 30px 0px 0px 0px;
  text-align: center;
}
#pageup a {
  text-decoration: none; 
  color: black;
}
#pageup a:hover {
  text-decoration: none; 
  color: black;
}

/* ***************************** */
/* ***************************** */
  
@media
  only screen and (max-width:800px) and ( orientation:landscape ),
  only screen and (max-width:800px) and ( orientation:portrait ) {
#esire {
  margin: 0 auto;
  width: 225px;
  font-family: "Esteban", serif;
  letter-spacing: 0px; 
  font-size: 20px;
  }
    
}

@media only screen and (min-width:801px) and (max-width:1366px) {

body {
  font-size: 14px;
  background: #FFF; /*#FEE0C6;*/
}
#header {
  position: absolute;
  top:0;
  left:0;
  width:100%;
  height: 270px;
  background-attachment: fixed, fixed, scroll;
  background-image: url(img/.png), url(img/.png), url(img/header/02.jpg);
  background-position: 0 0,0 0,0 0%;
  background-repeat: repeat, repeat, repeat;
  background-size: auto, auto, cover;
}

.lang img {
  position: absolute;
  top: 0px;
  height: 30px;
/*  border-top:2px solid #666;*/
  border-right:2px solid #666;
  border-bottom:2px solid #666;
  border-left:2px solid #666;
/*  border-top-left-radius: 5px;
  border-top-right-radius: 5px;*/
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  /* margin-top: 10%;*/
  right: 2%;
}
.lang img:hover {
  height: 40px;
}

/* ESIRE-Logo Defintion */
#esire {
  position: absolute;
  float:left;
  right: 74%;
  top: 80px;
/*  border:1px solid #fff;*/
  padding: 0 0 1% 0;
  margin: 0 0 0 2% ;
/*  -webkit-box-shadow: 0 8px 6px -6px black;
  -moz-box-shadow: 0 8px 6px -6px black;
  box-shadow: 0 8px 6px -6px black;
*/  
  }

/* for higher resolutions */
#high {
  position: absolute;
  top:270px;
  clear: left;
  display: block;
  width: 100%;
/*  padding-bottom: 3em;*/
/*  min-height: 100%;*/
  border-top: 2px solid grey;
  background-color: #FFF;/*#FEF6E4;*/
/*  background-attachment: scroll;
  background-image: url(img/high/sand.png);
  background-position: -10px -10px;
  background-repeat: repeat;
  background-size: auto;*/
}

/* ***************************** */

/* navigation */
#navigation {
  position: absolute;
  float: left;
  clear: both;
  width: 30%;
  top: 0px;
/*  background: #00f;*/
  border-bottom: 0px;
  border-top: 0px;
  margin: 0 0 0 0;
  padding: 0;
/*  width: 225px;*/
  }
  
#navigation a {
  font-size: 15px;
  font-weight: bold;  }

#navigation ul {
/*  border: 1px solid #666;
  border-radius: 5px;*/
  position:relative;
  float: right;
  width: 225px;
  margin-right: 12%;
  /*margin-left: 6%;*/

}

#navigation ul a li {
  margin-top: 5%;
  margin-right:1%;
  background: #FCF8DC;
  padding: 20px;
  padding-bottom: 10px;
  box-shadow:0px 2px 7px #292929;
  -moz-box-shadow: 0px 2px 7px #292929;
  -webkit-box-shadow: 0px 2px 7px #292929; 
/*  -moz-box-shadow: inset -3px -3px 5px #CDAA7D, inset 3px 3px 5px #F4A460;
  -webkit-box-shadow: inset -3px -3px 5px #CDAA7D, inset 3px 3px 5px #F4A460;
  box-shadow: inset -3px -3px 5px #CDAA7D, inset 3px 3px 5px #F4A460;*/
}

#navigation ul a:hover li {
  background: #f0eee4;
}

#navigation ul a:active li {
  background: #ff9e7d;
}

/* ***************************** */


/* Content */
#content {
/*  position: absolute;*/
  float: right;
  top: 0px;
/*  left:30%;*/
  clear: both;
  width:70%;
  background: #FFF;/*#FEF6E4;*/
  border: 0px solid #666;
  /*border-radius: 5px;*/
  padding: 1% 1.5% 5% 1.5%;
}
#content a img {
  width: 30%;
  margin: 0% 3% 3% 0%;
  border-radius: 5px;
}
.aktuellh2 {
  visibility: visible;
  color: #fff;
  border-radius: 5px;
  background: #f00;
}
/* ***************************** */

/* Footer */
#footer {
  clear: both;
  z-index: 10;
  width: 100%;
  border-top: 2px solid grey;
  background: #FEE0C6;
  padding: 0 0 0 0;
}


/* ***************************** */
}
@media only screen and (min-width:1367px) {

body {
  font-size: 100%;
  background: #FEE0C6;
}
#header {
  position: absolute;
  top:0;
  left:0;
  width:100%;
  height: 270px;
  background-attachment: fixed, fixed, scroll;
  background-image: url(img/header/.png), url(img/header/.png), url(img/header/02.jpg);
  background-position: 0 0,0 0,0 0;
  background-repeat: repeat, repeat, repeat;
  background-size: auto, auto, cover;
}

.lang img {
  position: absolute;
  top: 0px;
  height: 30px;
/*  border-top:2px solid #666;*/
  border-right:2px solid #666;
  border-bottom:2px solid #666;
  border-left:2px solid #666;
/*  border-top-left-radius: 5px;
  border-top-right-radius: 5px;*/
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  /* margin-top: 10%;*/
  right: 2%;
}
.lang img:hover {
  height: 40px;
}

/* ESIRE-Logo Defintion */
#esire {
  position: absolute;
  float:left;
  right: 74%;
  top: 80px;
/*border:1px solid #fff;*/
  padding: 0 0 1% 0;
  margin: 0 0 0 2% ;
/*  -webkit-box-shadow: 0 8px 6px -6px black;
  -moz-box-shadow: 0 8px 6px -6px black;
  box-shadow: 0 8px 6px -6px black;
*/  
  }

/* for higher resolutions */
#high {
  position: absolute;
  top:270px;
  clear: left;
  display: block;
  width: 100%;
/*  padding-bottom: 3em;*/
/*  min-height: 100%;*/
  border-top: 2px solid grey;
  background-color: #FEF6E4;
  background-attachment: scroll;
/*  background-image: url(img/high/sand.png); */
/*  background-position: -10px -10px;*/
/*  background-repeat: repeat;*/
/*  background-size: auto;*/
}

/* ***************************** */

/* navigation */
#navigation {
  position: absolute;
  float: left;
  clear: both;
  width: 30%;
  top: 0px;
/*  background: #00f;*/
  border-bottom: 0px;
  border-top: 0px;
  margin: 0 0 0 0;
  padding: 0;
/*  width: 225px;*/
  }
  
#navigation a {
  font-size: 15px;
  font-weight: bold;  }

#navigation ul {
/*  border: 1px solid #666;
  border-radius: 5px;*/
  position:relative;
  float: right;
  width: 225px;
  margin-right: 12%;
  /*margin-left: 6%;*/

}

#navigation ul a li {
  margin-top: 5%;
  margin-right:1%;
  background: #FCF8DC;
  padding: 20px;
  padding-bottom: 10px;
  box-shadow:0px 2px 7px #292929;
  -moz-box-shadow: 0px 2px 7px #292929;
  -webkit-box-shadow: 0px 2px 7px #292929; 
/*  -moz-box-shadow: inset -3px -3px 5px #CDAA7D, inset 3px 3px 5px #F4A460;
  -webkit-box-shadow: inset -3px -3px 5px #CDAA7D, inset 3px 3px 5px #F4A460;
  box-shadow: inset -3px -3px 5px #CDAA7D, inset 3px 3px 5px #F4A460;*/
}

#navigation ul a:hover li {
  background: #f0eee4;
}

#navigation ul a:active li {
  background: #ff9e7d;
}

/* ***************************** */


/* Content */
#content {
/*  position: absolute;*/
  float: right;
  top: 0px;
/*  left:30%;*/
  clear: both;
  width:70%;
  background: #FEF6E4;
  border: 0px solid #666;
  /*border-radius: 5px;*/
  padding: 1% 1.5% 5% 1.5%;
}
#content a img {
  width: 30%;
  margin: 0% 3% 3% 0%;
  border-radius: 5px;
}
.aktuellh2 {
  visibility: visible;
  color: #fff;
  border-radius: 5px;
  background: #f00;
}
/* ***************************** */

/* Footer */
#footer {
  clear: both;
  z-index: 10;
  width: 100%;
  border-top: 2px solid grey;
  background: #FEE0C6;
  padding: 0 0 0 0;
}


/* ***************************** */

/* ***************************** */
}