body {font-family: 'Quicksand', sans-serif; margin: 0px; padding:0px; font-size:14px}

h1 {width:328px; height: 108px; margin:20px 0px; background: url(../img/dis/logo.png) no-repeat;}
h1 span {display:none;}

nav {position:absolute; top:20px; right: 0px; text-align: right; padding:0px 40px 0px 70px; background:url(../img/dis/menu.png) no-repeat top left; height:108px; }
nav ul {list-style: none; padding:40px 0px; margin:0px;}
nav ul li {display:inline-block; padding:5px 10px 5px 40px;}
nav ul li a {color:white; text-decoration: none;}
nav ul li a.active, nav ul li a:hover  {color:red;}

.contenidos {padding:12px 0px;}
.contenidos .back1, .contenidos .back2, .contenidos .back3 {width:422px;}
.contenidos .back1 {height:128px; background: url(../img/dis/back1.png) no-repeat;}
.contenidos .back2 {background:url(../img/dis/back2.png);}
.contenidos .back3 {height:66px; background:url(../img/dis/back3.png) no-repeat;}
.contenidos .back1 h2 {padding:30px 60px; margin:0px; font-size:2.5em; color:white; font-weight:normal;}
.contenidos .back1 h2 span {color:red;}
.contenidos .back2 p {padding:20px 60px 0px; margin:0px; color:#c4c0c0; line-height:23px;}

footer { background: rgba(0,0,0,0.7); position: absolute; bottom: 0px; width: 100%; text-align: center; color:white;}
footer p.bazhar {position:absolute; left:40px; top:0px; padding:5px 0px 5px 40px; background-image: url(../img/dis/bazhar.png); background-size:contain; background-repeat:no-repeat; display: inline-block;}
footer p.reg {position:absolute; right:40px; top:0px; padding: 5px;}
footer ul {list-style: none; padding:15px 0px 15px 250px; margin:0px;}
footer ul li.fb {background-image: url(../img/dis/fb.png);}
footer ul li.ig {background-image: url(../img/dis/ig.png);}
footer ul li.ma {background-image: url(../img/dis/ma.png);}
footer ul li.vi {background-image: url(../img/dis/vi.png);}
footer ul li.te {background-image: url(../img/dis/te.png);}
footer ul li {display:inline-block; padding:5px 10px 5px 40px; background-size:contain; background-repeat:no-repeat; }
footer a {color:white; text-decoration: none;}
footer ul a {border-right:1px solid white; margin-right: 10px}
footer ul a:last-child {border-right:0px;}
footer ul a:hover {color:#c4c0c0;}
footer p.bazhar a {color:white; text-decoration: none;}
footer p.bazhar a:hover {color:#c4c0c0;}

@media (max-width: 1400px) {
  .contenidos .back1 h2 {padding:20px 50px;}
  .contenidos .back2 p {padding:0px 50px;}
  .contenidos .back2 p:last-child {padding-top:20px;}
  .contenidos .back1 {background-position:bottom right; background-size:100%; height:auto;}
  .contenidos .back3 {background-position:top left; background-size:100%; height:30px;}
  footer {font-size: 0.9em}
  footer ul {padding:5px 0px 5px 250px; margin:0px;}
  footer p.bazhar, footer p.reg {padding-top:10px; margin: 0px;}
}

@media (max-width: 1280px) {
  .contenidos .back2 p {line-height:20px;}
  footer {position:relative; left:0px; right:0px; padding:5px 0px; margin-top: 20px}
  footer ul { padding:10px 0px;}
  footer p.bazhar, footer p.reg {position:relative; left:0px; right:0px; padding:5px 0px 10px; margin: 0px;}
  footer p.reg {display: inline-block;}
  footer p.bazhar {padding:5px 0px 5px 30px; margin-left: 50px}
}

@media (max-width: 991px) {
  h1 {width:100%; background: url(../img/dis/logocel.png) no-repeat;}
  .contenidos {width: 100%; margin-top:400px;}
  .contenidos .back1, .contenidos .back2, .contenidos .back3 {width:100%;}
  .contenidos .back1 {background:url(../img/dis/back1cel.png) no-repeat bottom right; background-size:cover; height:auto;}
  .contenidos .back2 {background:black;}
  .contenidos .back3 {background:url(../img/dis/back3cel.png) no-repeat bottom left; background-size:cover; height:80px;}
  .contenidos .back1 h2 {padding:20px 40px 10px;}
  .contenidos .back2 p {padding:10px 40px;}
  footer ul a {display:block; margin-right:0px; margin-bottom:15px; border: 0px;}
  footer p.reg {display:block;}
  footer p.bazhar {margin-left:0px}
}

@media (max-width: 500px) {
  .contenidos .back3 {height:40px;}
}
