/*----------------------RESET--------------------*/

html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,del, dfn, em, img, ins, kbd, q, samp,small, strong, sub, sup, var,b, i,
dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, figure, footer, header, hgroup, menu, nav, section, menu,time, mark, audio, video {margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}

article, aside, figure, footer, header,hgroup, nav, section { display:block; }

nav ul { list-style:none; }

blockquote, q { quotes:none; }

blockquote:before, blockquote:after,
q:before, q:after { content:''; content:none; }

a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }

ins { background-color:#ff9; color:#000; text-decoration:none; }

mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }

del { text-decoration: line-through; }

abbr[title], dfn[title] { border-bottom:1px dotted #000; cursor:help; }

/* tables still need cellspacing="0" in the markup */
table { border-collapse:collapse; border-spacing:0; }

hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }

input, select { vertical-align:middle; }

.chromeframe {margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0;}

body{line-height:1; font-size:62.5%; background:#fff; font-family: Arial, Helvetica, sans-serif;} /*---- 1.0 em = 10px---*/

/*----------------------RESET--------------------*/

/*----------------------FONTE--------------------*/


@font-face {
    font-family: 'Coolvetica';
    src: url('../fonts/coolvetica_rg-webfont.eot');
    src: url('../fonts/coolvetica_rg-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/coolvetica_rg-webfont.woff2') format('woff2'),
         url('../fonts/coolvetica_rg-webfont.woff') format('woff'),
         url('../fonts/coolvetica_rg-webfont.ttf') format('truetype'),
         url('../fonts/coolvetica_rg-webfont.svg#coolveticaregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	@font-face {
		font-family: 'Coolvetica';
		src:  url('../fonts/coolvetica_rg-webfont.svg#coolveticaregular') format('svg');
	};
}


/*----------------------FONTE--------------------*/


a{text-decoration:none; outline:none;}

a:hover{-moz-transition:all ease-in .3s; -webkit-transition:all ease-in .3s; transition:all ease-in .3s}

::selection{color:#F60; background:#eaeaea;}

::-moz-selection{color:#F60; background:#eaeaea;}

p{font:1.6em "Trebuchet MS", Arial; line-height:26px; color:#221f20;}

.container{max-width: 960px;}

/*----------------------TOPO--------------------*/

.topo{height: 218px; background: url(../img/topo-bg.jpg) no-repeat top; border-bottom: 7px solid #ed2200;}

.logo{display: block; float: left; text-indent: -9999px; height: 119px; width: 100%; background: url(../img/logo.png) no-repeat; margin: 20px auto 35px auto; background: url(../img/logo.png) no-repeat top;}

.menu{margin-left: 55px;}

.menu li{float:left; list-style: none; font: 1.9em "Coolvetica", Arial; text-transform: uppercase; margin-left: 15px; background: url(../img/bullet.png) no-repeat right; padding-right: 25px;}

    .menu li:last-child{background: none;}

    .menu a{color: #181516;}

/*----------------------INICIAL--------------------*/

.ppci-inicial, .seg-trab-inicial, .eng-inicial

.ppci-inicial{background: url(../img/ppci-bg.jpg) no-repeat top; height: 444px; padding-top: 60px;}

.seg-trab-inicial{background: url(../img/seg-trab-bg.jpg) no-repeat top; height: 444px; padding-top: 60px;}

.eng-inicial{background: url(../img/egn-bg.jpg) no-repeat top; height: 444px; padding-top: 60px;}

h1{font: 7.2em "Coolvetica", Arial;}

h2{font: 4.2em "Coolvetica", Arial; text-align: center;}

.nome-serv{font: 2.8em "Coolvetica", Arial; color: #ed2200;}

.txt-intro{font: 1.6em "Trebuchet MS", Arial; color: #221f20; clear: both; line-height: 24px;}

.traco-preto{background: url(../img/tracopreto.png) no-repeat; float: left; height: 5px; width: 80px; margin: 25px 0;}

.bt-acao{font: 2em "Coolvetica", Arial; color: #221f20; float: left; border: 1px solid #221f20; padding:12px 15px; margin-top: 25px;}

    .bt-acao:hover{background: #ED2200; color: #fff; text-decoration: none;}

h6{font: 3.2em Coolvetica, Arial; color: #221f20; margin: 60px 0 30px 0; text-align: center;}

.overview li{float: left; list-style: none; }

.overview img{height: 350px; width: auto; display: block; margin: auto;}

#slider1 {
    height: 1%;
    overflow: hidden;
    position: relative;
    padding: 0 50px 10px;
    margin-bottom: 60px;
}

#slider1 .viewport { height: 100px;     overflow: hidden;     position: relative;}

#slider1 .buttons {
    border-radius: 35px;
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 35px;
    height: 35px;
    color: #666;
    outline: none;
    text-align: center;
    line-height: 35px;
    text-decoration: none;
    font-size: 30px;
}

#slider1 .next {    right: 0;    left: auto;    top: 50%;}

#slider1 .buttons:hover {
    color: #C01313;
}

#slider1 .disable {
    visibility: hidden;
}

#slider1 .overview {
    list-style: none;
    position: absolute;
    padding: 0;
    margin: 0;
    width: 940px;
    left: 0;
    top: 0;
}

#slider1 .overview li {
    float: left;
    margin: 40px 35px 0 0;
    padding: 1px;
    height: 80px;
    width: auto;
 }


#slider2 {
    height: 1%;
    overflow: hidden;
    position: relative;
    padding: 0 50px 10px;
    margin-top: 30px;
}

#slider2 .viewport { height: 350px;     overflow: hidden;     position: relative;}

#slider2 .buttons {
    border-radius: 35px;
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 35px;
    height: 35px;
    color: #666;
    outline: none;
    text-align: center;
    line-height: 35px;
    text-decoration: none;
    font-size: 30px;
}

#slider2 .next {    right: 0;    left: auto;    top: 50%;}

#slider2 .buttons:hover {
    color: #C01313;
}

#slider2 .disable {
    visibility: hidden;
}

#slider2 .overview {
    list-style: none;
    position: absolute;
    padding: 0;
    margin: 0;
    width: 575px;
    left: 0;
    top: 0;
}

#slider2 .overview li {
    float: left;
    padding: 1px;
    height: 350px;
    width: 500px;
    position: relative;
 }

.legenda{position: absolute; bottom:5px; left:3%; width: 87%; background: #fff; padding:10px; font: 1.4em "Trebuchet MS", Arial; color: #666; opacity: .9;}



/*----------------------EMPRESA--------------------*/

.tit-pag{width: 100%; height: 89px; margin-bottom: 25px; }

.empresa{background: url(../img/empresa-header.jpg) no-repeat top;}

h4{color: #fff; font: 4em Coolvetica, Arial; text-align: center; line-height: 89px;}

.texto-destaque{font: 2.8em Coolvetica, Arial; text-align: center; color: #636262; margin:40px 0 60px 0;}

.box, .box-large{background: #fff; box-shadow: 3px 0 9px rgba(0,0,0,.4); padding: 35px 25px; width: 31%; margin-bottom: 40px  }

h5{font:2.4em Coolvetica, Arial; color: #221f20; text-align: center; padding-bottom: 25px; background: url(../img/traco-vermelho.png) no-repeat bottom; margin-bottom: 25px;}

.box p{font: 1.4em "Trebuchet MS", Arial; color: #221f20; line-height: 24px; margin-bottom: 10px;}

/*----------------------SERVIÇOS--------------------*/

.seguranca-do-trabalho{background: url(../img/seg-trab-pag.jpg) fixed no-repeat top; padding: 55px 0;}

.ppci{background: url(../img/ppci-pag.jpg) fixed no-repeat top; padding: 55px 0;}

.engenharia-civil{background: url(../img/eng-pag.jpg) fixed no-repeat top; padding: 55px 0;}

.pericias{background: url(../img/pericias-pag.jpg) fixed no-repeat top; padding: 55px 0;}

.box-large{width: 620px;}

.texto p{font: 1.6em "Trebuchet MS", Arial; color: #221f20; line-height: 26px; margin-bottom: 20px;}

.texto h3{font:bold 1.8em "Trebuchet MS", Arial;  color: #221f20; margin-bottom: 10px; ;}

.texto li{font: 1.6em "Trebuchet MS", Arial; color: #221f20; line-height: 26px; margin-left: 15px;}

/*----------------------FOOTER--------------------*/

footer{background: #c3cccc url(../img/rodape-bg.jpg) no-repeat top; height: 200px; padding-top: 30px;}

footer{font: 2em Coolvetica, Arial; color:#221f20; line-height: 24px;}

.telefones{padding-top: 30px; padding-left: 50px;}

.endereco{padding-top: 26px; padding-left: 85px;}

/*----------------------DIVERSOS--------------------*/

.aligncenter{text-align: center;}

.alerta{ color:#fff; background: #f00; text-align:center; margin-bottom:10px; padding:10px; border:1px dotted #f00;}

.bottom10{margin-bottom:10px;}

.bottom20{margin-bottom:20px;}

.bottom40{margin-bottom:40px;}

.branca{color: #fff; border-color:#fff;}

.centralizado{position:relative; float:none; display:block; clear:both; margin:0 auto;}

.clear{clear:both;}

.confirmado{color:#fff; background: #65a03c; text-align:center; margin-bottom:10px; padding:10px; border:1px dotted #65a03c;}

.displaynone{display:none;}

.left{float:left;}

.left10{margin-left:10px;}

.over-div{background: #fff; display: block; max-width: 650px; margin:40px auto; position: relative;  padding:50px;}

.right{float:right;}

.right10{margin-right:10px;}

.right20{margin-right: 20px;}

.top10{margin-top:10px;}

.top20{margin-top:20px;}

.top40{margin-top:40px;}

.vermelha{color: #ed2200;}

/*----------------------MENU MOB--------------------*/

.barra-mob{background: #ED2200; width: 40%;  clear: both; position: relative; z-index: 300; border-radius: 3px; } 

    .barra-mob a{color: #fff; text-shadow: 0 1px 1px rgba(0,0,0,.3);}

        .barra-mob a:hover{text-decoration: none;}    
    
#menu-mob-bt{font: 1.8em Coolvetica, Arial; text-align: center; line-height: 45px; padding-right: 0; display: block;  }   

.menu-button{float: left; margin-top:8px; }

.menu-button span{  background: #fff none repeat scroll 0 0;
    display: block;
    height: 3px;
    margin: 4px 15px 0 0;
    width: 25px;
    box-shadow: 0 1px 1px rgba(0,0,0,.3);}

    .pushy {
        background: #ED2200 none repeat scroll 0 0;
        box-shadow: -10px 0 6px -9px rgba(0, 0, 0, 0.2) inset;
        font-size: 0.9em;
        font-weight: bold;
        height: 100%;
        overflow: auto;
        position: fixed;
        top: 0;
        width: 50px;
        z-index: 99999;
        left: -70px;
        transform: translate3d(-250px, 0px, 0px);    
        transition: transform 0.2s cubic-bezier(0.16, 0.68, 0.43, 0.99) 0s;        
    }    
    .pushy-open {
        transform: translate3d(70px, 0px, 0px);
        width: 95%;
        opacity: .9;
    }    
    
    #menu-mob li{  border-bottom: 1px solid rgba(255,255,255,.3); margin:0 15px;}

    .pushy a {
        color: #fff;
        display: block;
        font: 2em Coolvetica, Arial;
        padding: 15px 20px;
        text-decoration: none;
         text-transform: uppercase;
    }    

.fone{font: 2.8em Coolvetica, Arial; text-align: center; margin-top: 20px; background: #ddd; padding: 10px;}

 .overlay-close {width: 30px;	height: 30px;	position: absolute;	right: 20px;	top: 10px;	overflow: hidden;	border: none;	background: url(../img/cross.png) no-repeat center center;	text-indent: 200%;	color: transparent;	outline: none;	z-index: 100;}   

/*----------------------DIVERSOS--------------------*/

/* overlay at start */
.mfp-fade.mfp-bg {
  opacity: 0;

  -webkit-transition: all 0.15s ease-out;
  -moz-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}
/* overlay animate in */
.mfp-fade.mfp-bg.mfp-ready {
  opacity: 0.8;
}
/* overlay animate out */
.mfp-fade.mfp-bg.mfp-removing {
  opacity: 0;
}

/* content at start */
.mfp-fade.mfp-wrap .mfp-content {
  opacity: 0;

  -webkit-transition: all 0.15s ease-out;
  -moz-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}
/* content animate it */
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
}
/* content animate out */
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}

/*----------------------FORM------------------------*/
fieldset { border: 0; }

input[type=text], input[type=email], select, textarea{ box-shadow:0px 1px 1px rgba(0, 0, 0, 0.1); height: 40px; box-shadow:2px 3px 2px rgba(0, 0, 0, 0.1);}

input:focus, textarea:focus { border-color: #006c72; }

label { font: 1.4em "Trebuchet MS", Helvetica, sans-serif; display: block; margin-bottom: 3px; color: #666; }

textarea { overflow: auto; font: 1.2em Arial, Helvetica, sans-serif; color: #333; line-height: 1.6em; }

.enviar { background: #ED2200 url(../img/seta.png) no-repeat right; display:block; margin:auto; text-transform: uppercase; font:1.8em "Trebuchet MS", Arial; color: #fff; text-shadow: 0 1px 1px rgba(0,0,0,.3); padding:10px 35px 10px 20px; border: 0; margin-top:25px; margin-bottom: 30px; border-radius: 3px; box-shadow: 0 1px 1px rgba(0,0,0,.3); }    
}


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

/* Image replacement */
.ir {background-color: transparent;  border: 0;    overflow: hidden;    /* IE 6/7 fallback */    *text-indent: -9999px;}

.ir:before {content: "";    display: block;    width: 0;    height: 150%;}

/* Hide from both screenreaders and browsers */
.hidden {display: none !important;    visibility: hidden;}

/* Hide only visually, but have it available for screenreaders */
.visuallyhidden {border: 0;    clip: rect(0 0 0 0);    height: 1px;    margin: -1px;    overflow: hidden;    padding: 0;    position: absolute;    width: 1px;}

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard */
.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus {clip: auto;     height: auto;    margin: 0;    overflow: visible;    position: static;    width: auto;}

/* Hide visually and from screenreaders, but maintain layout */
.invisible {    visibility: hidden;}

.clearfix:before,.clearfix:after {    content: " "; /* 1 */    display: table; /* 2 */}

.clearfix:after {    clear: both;}

.clearfix {    *zoom: 1;}


/*------------------------RESPONSIVE DESIGN-----------------------------*/


@media only screen and (max-width: 800px) {
    
}


@media only screen and (max-width: 760px){
    
}


@media only screen and (max-width: 480px){
    
    .topo{display: none;}
    
    .seg-trab-inicial{background-position:left; height: auto; padding-bottom: 40px;}
    
    .eng-inicial, .ppci-inicial{background-position: right;}
    
    h1{font-size: 5em;}
    
    .box-large, .box{width: auto; height: auto;}
  
    #barra-mobile{display: block; } 
    
    #menu-mob{padding-top: 30px;}   
    
    footer{background-position: right; height: auto; background-repeat: repeat-y;}
    
    .endereco{padding-left: 55px; margin-bottom: 30px;}
}


@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}


/*----------------------PRINT--------------------*/

@media print {
* { background: transparent !important; color: #444 !important; text-shadow: none; }
  a, a:visited { color: #444 !important; text-decoration: underline; }
  a:after { content: " (" attr(href) ")"; }
  abbr:after { content: " (" attr(title) ")"; }    .ir a:after { content: ""; }  /* Don't show links for images */    pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }    img { page-break-inside: avoid; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3{ page-break-after: avoid; }
}