html { color: #222; font-size: 1em; line-height: 1.4; } ::-moz-selection { background: #b3d4fc; text-shadow: none; } ::selection { background: #b3d4fc; text-shadow: none; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
audio, canvas, iframe, img, svg, video { vertical-align: middle; } fieldset { border: 0; margin: 0; padding: 0; }
textarea { resize: vertical; } .browserupgrade { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; }

/* ==========================================================================
   Author's custom styles #f3523c  #b33c2d
   ========================================================================== */

.boton{display: block; width: 150px; border-radius: 50px; border: 2px solid #f7b731; color: #202020; text-align: center; padding: 8px 0; font-family: 'dm_sansbold'; margin: 0 auto; font-size: 14px}
.boton:hover{background: #f7b731; filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7b831', endColorstr='#fed130', GradientType=0 );
 color: #fff} 

section.hero{margin: 180px auto 0!important; display: block; height: 300px; width: 100%; background: url("../img/bann-servicios.jpg"); background-size: cover; background-position: center center; display: flex; justify-content: center; align-items: center; }
section.hero div.cont{width: 80%; margin: 0 auto}
section.hero div.cont p.tittle{font-size: 30px; color: #f7b731; text-align: center; font-family: 'dm_sansbold'}
section.hero div.cont p{font-size: 16px; color: #fff;  text-align: center; margin: 0 auto}

    .secAviso{width: 100%;}
    .secAviso p.title{text-align: left; font-size: 22px; margin: 30px auto;text-transform: uppercase; width: 90%; line-height: 1.2em;color: #333333!important; font-weight: bold;}
    .secAviso p{font-size: 14px; text-align: left; width: 90%; margin: 0px auto 50px; font-weight: normal;}
    .secAviso p span{color:#f7b731; margin-right: 5px}
  
/* == 768px MEDIA QUERY ========================================================================== */
@media only screen and (min-width:768px){

section.hero{margin: 120px auto 0!important; height: 180px; width: 100%; }
section.hero div.cont{width: 90%; margin: 0 auto}
section.hero div.cont p.tittle{font-size: 30px; text-align: left}
section.hero div.cont p{font-size: 16px; ; text-align: left}

    .secSoAviso{width: 100%;}
    .secAviso p.title{font-size: 22px;width: 90%;}
    .secAviso p{font-size: 14px;width: 90%}

}

/* == 1024px MEDIA QUERY ========================================================================== */
@media only screen and (min-width:1024px){
	section.hero{height: 250px}

section.hero div.cont{width: 80%; margin: 0 auto}
section.hero div.cont p.tittle{font-size: 35px;}
section.hero div.cont p{font-size: 24px;}

    .secSoAviso{width: 100%;}
    .secAviso p.title{font-size: 22px;width: 80%;}
    .secAviso p{font-size: 16px;width: 80%}

}

/* == 1280px MEDIA QUERY ========================================================================== */
@media only screen and (min-width:1280px){
section.hero div.cont{width: 75%; margin: 0 auto}
section.hero div.cont p.tittle{font-size: 45px;}
section.hero div.cont p{font-size: 24px;}
	
    .secSoAviso{width: 100%;}
    .secAviso p.title{font-size: 22px;width: 76%;}
    .secAviso p{font-size: 16px;width: 76%}

}

/* == 1600px MEDIA QUERY ========================================================================== */
@media only screen and (min-width:1600px){

section.hero div.cont{width: 76%; margin: 0 auto}
section.hero div.cont p.tittle{font-size: 45px;}
section.hero div.cont p{font-size: 24px;}
	
    .secSoAviso{width: 100%;}
    .secAviso p.title{font-size: 28px;width: 76%;}
    .secAviso p{font-size: 18px;width: 76%} 
}



/* ==========================================================================
   Helper classes
   ========================================================================== */

.hidden{display:none!important}.visuallyhidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}
.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{clip:auto;-webkit-clip-path:none;clip-path:none;height:auto;margin:0;overflow:visible;position:static;width:auto;white-space:inherit}.invisible{visibility:hidden}
.clearfix:before,.clearfix:after{content:" ";display:table}.clearfix:after{clear:both}@media print{*,:before,:after{background:transparent!important;color:#000!important;box-shadow:none!important;text-shadow:none!important}
a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href) ")"}abbr[title]:after{content:" (" attr(title) ")"}a[href^="#"]:after,a[href^="javascript:"]:after{content:""}pre{white-space:pre-wrap!important}
pre,blockquote{border:1px solid #999;page-break-inside:avoid}thead{display:table-header-group}tr,img{page-break-inside:avoid}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}}
