@charset "UTF-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Roboto:s400,700,900');

html {
    max-width: 100%;
    overflow-x: hidden;
}

body {
    max-width: 100%;
    overflow-x: hidden;
    font-family:'Roboto', sans-serif;font-size: 18px;
}
.clear{clear: both;height: 10px;}
.section.estados {
  background: #f5f5f5;
}
.section-name p {
  font-weight: 900;
  color: #222;
  font-size: 30px;
  line-height: 1em;
}

.estados h3{background: #222;color:#fff;display: inline-block;padding: 4px 15px;font-weight: 700;line-height: 1.5em;float:left;width:110px;margin-right:5px;}

.estados ul li{float: left;}
.estados ul li a{color: #111;font-weight: 400;margin-right: 5px;border:1px solid #ddd;padding:4px 38px;display: block;}
.estados ul li a:hover{background: #e5e5e5;}



@media screen and (max-width: 799px) { /* Mobile */
  body{font-size: 13px;}
  .clear{height: 0px;}
  .estados h3{float:none;width: 85px;margin:10px 0 10px;}
  .section-name p {font-size: 20px;}
  .estados ul li{margin-bottom: 5px;}
  .estados ul li a{padding:4px 11px;}

}

@media screen and (min-width: 800px) and (max-width: 1071px) { /* Tablet */

    .estados ul li a{padding:4px 11px;}
}

@media screen and (min-width: 1040px){
.container {
    max-width: 960px;
    width: 960px;}
    .estados ul li a{padding:4px 25px;}
}

@media screen and (min-width: 1232px){
.container {
    max-width: 1152px;
    width: 1152px;}
}

@media screen and (min-width: 1473px){
.container {
    max-width: 1344px;
    width: 1344px;}
}