@import url(../fontello/fontello.css);
@import url(header.css);
@import url(menu.css);
@import url(footer.css);
@import url(slider.css);
@import url(login.css);
@import url(../masterPage/modal.css);
@import url(../masterPage/tarjetas.css);

body
{ width: 100%; }

#home
{ position:relative; display: block; width: 100%; height: auto; }

header
{ background: none; box-shadow: none; }

.head
{
    background:rgba(100,100,100,0.5); width: 100%; height:160px;
    box-shadow: 0em 0.3em 0.5em #000;
}

#content p
{
    font-size: 20pt;
    display: block;
    width: 100%;
    padding: 5%;
    text-align: justify;
}

.fixed
{
    position: fixed;
    width: 100%;
    top:0;
    left:0;
    z-index:100 ;
}

h1
{ margin: 27px 0; font-size: 1.7em; }

#menu
{
    bottom:0 ; display: inline-block;position: relative;z-index: 50; width: 100%; height:auto; background:rgba(0,0,0,0.3); 
}

#menu ul li 
{
    float: right; color:#FFF;
}

#menu ul li a
{ color:#555 ; }

footer {
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
  position: absolute;
  bottom: 0;
  left: 0;
  overflow: hidden;
  display: -webkit-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

#content
{
    width: 100%; height: auto;
    position: relative; display: block; float: left;
}

nav #menu
{
    width: 100%; height:80px; background:rgba(0,0,0,1); 
}



@media (min-width: 320px) {
  h1 {
    display: block;
    color: #fff;
  }
}

@media (min-width: 1024px) {
  .menu {
    background: none;
  }
  .menu a, #menu a {
    color: #fff;
    font-weight: bold;
  }
  
  .menu a:hover, #menu a:hover {
    background: rgba(0, 0, 0, 0.4); color:#FFF ;
  }
}
