*{margin:0; padding:0; border:0; text-decoration:none;}

input[type='submit'], input[type='reset'], button[type='submit'], button[type='reset'], [onClick], li{cursor:pointer; outline:none;}

header, nav, section, article, footer, aside{ display:block; position:relative; }

/* h1, h2, h3, h4, h5, h6, h7, p, span{ cursor:default; } */

::-webkit-scrollbar {background:white; width:0.9rem; border-radius:0.5rem; z-index:50; position:relative;}
::-moz-scrollbar {background:white; width:0.9rem; border-radius:0.5rem; z-index:50; position:relative;}
::-webkit-scrollbar-thumb {background:black;} 
::-moz-scrollbar-thumb {background:black;} 
::-webkit-scrollbar-track {background:rgba(0,0,0,0.3);} 
::-moz-scrollbar-track {background:rgba(0,0,0,0.3);} 

.up{ cursor:pointer; position:fixed; bottom:5px; right:15px; z-index:9999; width:60px; height:60px; text-align:center; border-radius:50% 50% 0; background:black; display:none;}
.up:before{ font:lighter 2.5rem/60px 'FontAwesome'; text-align:center; content:'\f102'; color:white; }
.up:hover:before{ color:grey; }

html{ font-size: 62.5% !important; } 
body{  }
header{  }
section{ background: white; padding: 40px 0; box-sizing: border-box;  }
article{ background: white; }
footer{ background: white; }

/*  */

h1, h2{ font-family: 'Oswald', sans-serif; font-weight: 300; color: #555; }
p, span, a, input, button{ font: normal 16px 'Lato', sans-serif; color: #555; }
a:hover{ color: indianred; }
/*p, span, a{ font: normal 14px 'open sans', sans-serif; color: #555; }*/

/*  */

button, h1, p, span, .btd, .bts, .imp, .social>.fa{ -webkit-transition:all ease-out 150ms; -moz-transition:all ease-out 150ms; -ms-transition:all ease-out 150ms; -o-transition:all ease-out 150ms; }

/*  */

.flex, .flex2 { display: flex;
                flex-wrap: wrap;
                }
.itens{align-items: center; }
.center{ justify-content: center; }
.space{ justify-content:space-between; }

/*  */

.stage{ width: 90%; margin: 0 auto; }

/* topo */

.fixo{ width: 100%; padding: 10px 0; box-sizing: border-box; z-index:99999; top:0; position:fixed; background: white; -webkit-transition:all ease-out 300ms; }
.logo img{ height: 100px; width: auto; }

.small{  border-bottom: 1px dotted #ccc; padding:3px 0 !important; }
.small .logo img{ height:80px; -webkit-transition:all ease-out 300ms; }

.large img{ height:100px; -webkit-transition:all ease-out 300ms; }

/* banner */

.destaque{ height: 680px; position: relative;  margin-top: 120px; }

.botoes{ flex-direction: column; display: flex; }
.btd{ outline: none; width: 250px; height: 180px; margin: 4px; color: white; text-align: center; text-transform: uppercase; border: 1px solid white; padding: 15px; background: rgba(0,0,0,0.2); cursor: pointer; display: flex; flex-wrap: wrap; justify-content: center; align-content: space-around; }
.btd>.fa{ font-size: 50px; width: 100%; color: white; } 
.btd p{ color: white; }
.btd span{ display: block; text-transform: none; color: white; }
.btd:hover{ background: white; color: #555; box-shadow: 0 3px 5px -3px rgba(0,0,0,0.8); }
.btd:hover p{ color: #555; }
.btd:hover span{ color: #555; }
.btd:hover>.fa{ color: #555; }

.dots{ position:absolute; z-index:900; width:100%; height:100%; opacity:0.7; top:0; overflow:hidden; background:url(../banner/dots4.png); } 
.dots2{ position:absolute; z-index:900; width:100%; height:100%; opacity:0.5; top:0; overflow:hidden; background:url(../banner/dots7.png); } 

.banner { width: 100%; height: 800px; z-index: -1; position: fixed; top: 0; }
.banner .foto{ width:100%; height: 800px; }

.slogan{ display: flex; flex: 1; }
.slogan h1{font-size: 40px; font-weight: 400; color: white; text-align: center; text-transform: uppercase; text-shadow: 2px 2px 2px #4d4d4d; }

.sombra{ box-shadow: 0 3px 5px -3px rgba(0,0,0,0.8); }

/*  */

.bts{ outline: none; height: 200px; text-align: center; background: transparent; text-transform: uppercase; border: 1px solid black; padding: 15px; margin: 5px 20px; cursor: pointer; display: flex; flex-wrap: wrap; justify-content: center; align-content: space-around; flex-grow: 1; flex-basis: 200px; }
.bts>.fa{ font-size: 60px; width: 100%; color: #555; } 
.bts span{ text-transform: none; }
.bts:hover{ background: black; color: white; box-shadow: 0 3px 5px -3px rgba(0,0,0,0.8); }
.bts:hover>.fa{ color: white; }
.bts:hover>p{ color: white; }
.bts:hover>span{ color: white; }

/* notcias */

.noticias { overflow: hidden; padding: 60px 0 20px; text-align: center; }
.noticias h1 { font-size: 45px; text-transform: uppercase; padding-bottom: 25px; }
.notUni { overflow:hidden; width:98%; margin: auto; text-align: left; }
.notUni>h1 { font-size: 30px; text-align: left; padding: 0; line-height: 35px; }
.notUni .data { font-size:14px; margin:10px 0; padding: 10px; background: #555; color: white; border-radius:2px; display: inline-block; }
.notUni .descricao { font-size:16px; text-align:justify; margin:0; }
.notUni a { margin-top:10px; font-size:12px; text-transform: uppercase; text-decoration:none; float:right; background: salmon; color: white; border-radius:2px; padding:10px; }
.notUni a:hover { background: indianRed }
.owl-page span { background: salmon !important; }

/* programacao */

.prog{ background: whiteSmoke; width:100%; padding: 40px 0; box-sizing: border-box; }

.prog h1{ font-size: 35px; font-weight: 300; text-transform: uppercase; margin-right: 20px; }
.prog h1>span{ display: block; text-transform: uppercase; font-size: 14px; }

form[name='online']{ flex-grow: 1; margin: 15px 0; }
input[name='cliente_documento'], input[name='user_mail'], input[name='user_senha']{ height: 70px; flex-grow: 1; border: solid 1px #ccc; resize: none; box-sizing: border-box; margin:5px; border-radius: 3px; text-indent: 15px; font-weight: 300; outline: none; }
button[name='send'], button[name='reset'], button[name='admin']{ height: 55px; margin: 5px; padding: 0 20px; background: #555; color: white; border-radius: 3px; text-transform: capitalize; }
button[name='admin']{ background: salmon !important; }
button[name='admin']:hover{ background: indianRed !important; }
button[name='send']:hover, button[name='reset']:hover { background: black; color: white; }

.icoProg{ width: 100px; height: 100px; text-align: center; border: 10px solid #555; border-radius: 50%; margin-right: 25px; }
.icoProg>.fa { line-height: 100px; color: #555; }

/* conteudo */

.conteudo{ text-align: justify; border-bottom: 1px dotted #ccc; }
.conteudo h1{ font-size: 42px; font-weight: 300; text-transform: uppercase; letter-spacing: -1px; }
.conteudo h1 span{ font-size: 14px; display: block; letter-spacing: 0; }
.conteudo p{ padding: 20px 0 60px; }

.coluna { margin: 0 30px; text-align: justify; }

.coluna:nth-of-type(1) {flex-grow: 3; flex-basis: 300px;}
.coluna:nth-of-type(3) {flex-grow: 1; flex-basis: 100px;}

.imp{ display: inline-block; padding:5px !important; margin: 1px 0; border-radius: 3px; text-transform: capitalize; align-self: flex-start; }
.imp:hover{ background: salmon; color: white; }

/* social */

.social{ display: flex; justify-content: center; flex-wrap: wrap; }
.social p{ color: #b0b0b0; font-size: 16px; font-variant: small-caps; padding-right: 10px; width: 100%; text-align: center; }
.social>.fa{ background: #f4f4f4; color: #b0b0b0; margin: 10px 3px 20px; border-radius: 50%; width: 40px; height: 40px; text-align: center; line-height: 40px; font-size: 20px; cursor: pointer; }
.social>.fa:hover{ background: salmon; color: white; }

/* rodape */

.end{ display: flex; align-items: center; }
.end p, .end a{ padding: 0 10px; box-sizing: border-box; }
.end a:hover{ color: salmon; }
.end>.fa{ color: salmon; border: 2px solid salmon; border-radius: 50%; width: 40px; height: 40px; text-align: center; line-height: 40px; }

.rodape{ text-align:center; padding:20px 0; border-top: 1px dotted #ddd; }

/*  */

.separador{ padding: 35px 0; border-bottom: 1px dotted #ddd; }


@media screen and (max-width:1366px) { 

}

@media screen and (max-width:1280px) {

}

@media screen and (max-width:1024px) {

}

@media screen and (max-width:850px) { 
    .stage{ width: 95%; }
}

@media screen and (max-width:786px) {

}

@media screen and (max-width:599px) { 
    .destaque{ justify-content: center !important; }
    .slogan{ display: none; }
    .coluna { margin: 0; }
}

@media screen and (max-width:419px) {
    .destaque{ margin-top: 205px; }
    .flex2{ display: block; }
}

@media screen and (max-width:320px) {

}