body{
    margin:0;
    padding:0;
    background-color:black;
    overflow-x:hidden;
}
ul.lb.menu {
	position:relative;
}

ul.lb.menu li {
	position:relative;
	text-shadow:-1px 0 2px white, 1px 0 2px white, 0px 0 0px cyan, 0px 0 0px red;
	color:transparent;
	transition:0.5s;
}


li span {
	position:absolute;
	left:1.65em;
	background-color:black;
	opacity: 1;
	animation :  glitch 0.25s linear alternate infinite, flash 0.7s steps(5,start) infinite;
}

li:hover {
	animation : flash 0.001s steps(5,start) infinite;
}

@keyframes glitch {
	from {clip-path: polygon(0 0, 100% 0, 100% 40%, 0 40%);}
	to {clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);}
}

@keyframes flash {
	0%{opacity:1}
	50%{opacity:0}
	100%{opacity:0}
}

.fx_topo{
    width:100%;
    display: grid;
    grid-template-columns: 200px 1fr 300px;
    grid-column-gap: 10px;
    height:150px;
    margin-bottom:20px;
}
.logo img{
    max-width:200px;
    max-height:150px;
}
.menu{
  display: flex;
  justify-content: center;
  align-items: center;       
  MARGIN-TOP:20PX;
}
.fx_ber {
	width:calc(100% - 20px);
	padding: 10px;
	text-align: center;
	position: relative;
    background: linear-gradient(to right, #6A3E0C 0%, #A76A1E 50%, #584118 100%);
	color: #ADADAD;
	display: block;
	margin: auto;
	text-decoration: none;
    font-size:2em;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top:5px;
    margin-bottom:5px;
}            
.fx_tit {
	width:calc(100% - 20px);
	padding: 5px;
	text-align: center;
	position: relative;
    background: linear-gradient(135deg,  #54ecf1 0%,#e090ff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	color: #000;
	display: block;
	margin: auto;
	text-decoration: none;
    font-size:1.5em;
    display: flex;
    justify-content: center;
    align-items: center;
}            
.grid_2{
    width:100%;
    display: grid;
    grid-template-columns: repeat(2, 49%);
    grid-column-gap: 5px;
    padding:5px;
}
.grid_3{
    width:100%;
    display: grid;
    grid-template-columns: repeat(3, 33%);
    grid-column-gap: 5px;
    grid-row-gap: 5px;
    padding:5px;
}
.grid_4{
    width:100%;
    display: grid;
    grid-template-columns: repeat(4, 24.5%);
    grid-column-gap: 5px;
    grid-row-gap: 5px;
    padding:5px;
}
.grid_6{
    width:100%;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-column-gap: 5px;
    padding:5px;
}
.grid_cita{
    width:100%;
    display: grid;
    grid-template-columns: 400px 1fr;
    grid-column-gap: 5px;
    padding:5px;
}
.grid_livro{
    width:100%;
    display: grid;
    grid-template-columns: 200px 1fr;
    grid-column-gap: 5px;
    padding:5px;
}
.cx_musica{
    padding:5px;
    background: linear-gradient(135deg, rgba(235,241,246,1) 0%,rgba(171,211,238,1) 50%,rgba(137,195,235,1) 51%,rgba(213,235,251,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    color:black;
}
.gira{
    animation: girarHorizontal 2s linear infinite;
}
@keyframes girarHorizontal {
  from {
    transform: rotateY(0deg);
  }
  to {
    transform: rotateY(360deg);
  }
}
.player{
    margin-top:5px;
}
.download{
    color:blue;
    float:right;
}
.citacao{
    text-align:center;
    font-style: italic;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size:1.5em;
    color:rgba(249, 198, 26, 0.88);
}
.citacao i{
    margin-left:10px;
    margin-right:10px;
    
}
.l_t_2{
    color:rgba(249, 198, 26, 0.88);
    font-size:2em;
    font-weight: 700;
}
.l_sinop{
    font-size:1.3em;
    font-style: italic;
    padding:20px;
}
.l_saiba{
    font-style: italic;
    color:rgba(249, 198, 26, 0.88);
    float:right;
    margin-top:10px;
    margin-right:25px;
}
.dados_contos{
    font-size:0.7em;
    color:blue;
}

.c{
    display:none
}
@keyframes s{
    0%{transform:rotate(0)}
    100%{transform:rotate(360deg)}
}
#loader{
    display:-webkit-box;
    display:-webkit-flex;
    display:-moz-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    margin:0 auto
}
#loader div{
    width:20px;
    height:20px;
    margin-top:1px;
    margin-right:1px;
    float:left;
    -webkit-animation:1s linear var(--delay) loader infinite;
    -moz-animation:1s linear var(--delay) loader infinite;
    -o-animation:1s linear var(--delay) loader infinite;
    animation:1s linear var(--delay) loader infinite;
    -webkit-transition:transform .2s ease-out;
    -o-transition:transform .2s ease-out;
    -moz-transition:transform .2s ease-out;
    transition:transform .2s ease-out
}
#loader .c0{
    background-color:pink
}
#loader .c1{
    background-color:orange
}
#loader .c2{background-color:red}
#loader .c3{background-color:#dfdfdf}
#loader .c4{background-color:olive}
#loader .c5{background-color:#32cd32}
#loader .c6{background-color:#41ff00}
#loader .c7{background-color:#0ff}
#loader .c8{background-color:#91cfff}
#loader .c9{background-color:#00f}
#loader .c10{background-color:purple}
#loader .c11{background-color:#f0f}
#loader .c12{background-color:#bb7232}
#loader .c13{background-color:#ff0}
#loader .c14{background-color:#2db6b7}
#loader .c15{background-color:#000}
@-webkit-keyframes loader{
    0%,15%{-webkit-transform:scale(.5); transform:scale(.5)}
    30%,70%{-webkit-transform:scale(1);transform:scale(1)}
    100%,85%{-webkit-transform:scale(.5);transform:scale(.5)}
}
@-moz-keyframes loader{
    0%,15%{-moz-transform:scale(.5);transform:scale(.5)}
    30%,70%{-moz-transform:scale(1);transform:scale(1)}
    100%,85%{-moz-transform:scale(.5);transform:scale(.5)}
}
@-o-keyframes loader{
    0%,15%{-o-transform:scale(.5);transform:scale(.5)}
    30%,70%{-o-transform:scale(1);transform:scale(1)}
    100%,85%{-o-transform:scale(.5);transform:scale(.5)}
}
@keyframes loader{
    0%,15%{-webkit-transform:scale(.5);-moz-transform:scale(.5);-o-transform:scale(.5);transform:scale(.5)}
    30%,70%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}
    100%,85%{-webkit-transform:scale(.5);-moz-transform:scale(.5);-o-transform:scale(.5);transform:scale(.5)}
}

.ia_tag{
    margin-top:-70px;
    padding:5px;
    background: rgba(0,0,0,0.4) none no-repeat scroll 0 0;
    color:black;
    text-shadow: 2px 2px 2px #737373;
}
.centro{
  display: flex;
  justify-content: center; /* Centraliza na horizontal */
  align-items: center;     /* Centraliza na vertical */
}
.txt_p{
    font-size:0.7em;
}
.social{
    text-align:center;
    font-size:30px;
}
.social i{
    margin:5px 7px 5px 7px;
    transform: perspective(100px) rotateY(40deg);
  transition: all 1s ease;
}
.social i:hover{
    color:rgba(249, 198, 26, 0.88);
    transform: perspective(100px) rotateY(-40deg);
  transition: all 0.5s ease;
}

.newsletter {
  height: 40px;
  width:100%;
  margin-top: 0;
  position: relative;
  
}
.newsletter input {
  field-sizing: content;
  min-width:30%;
  border-radius: 5px;
  height: 40px;
  padding: 10px 0 10px 15px;
  text-transform: lowercase;
  outline: none;
  background-color:#E6FBFF;
  transition: all 0.5s ease;
}
.newsletter input:focus {
  background-color: #F7E6FF;
  color:#000;
  transition: all 0.5s ease;
}
.newsletter button{
    height: 40px;
    padding:5px;
    font-size:1.5em;
    background: linear-gradient(135deg,  #54ecf1 0%,#e090ff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	color: #000;
}
.rodape{
    width:calc(100% - 20px);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-column-gap: 10px;
    background:#000;
    color:rgba(249, 198, 26, 0.88);
    text-align:center;
    padding:15px;
    align-items: center;
}
.rodape img:hover{
    transform: perspective(100px) rotateY(20deg);
    transition: all 0.5s ease;
}
.rodape img{
    transition: all 0.5s ease;
}
.pag{
    text-align:center;
    font-size:30px;
    color:silver;
}
.pag a:hover{
    font-size:36px;
    color:red;
}

.pag_select{
    font-size:36px;
    color:gold;
}
.capitulos{
    height:90vh;
    overflow-y:auto;
    position:sticky;
    top: 0;
    color:#000;
    background: #FFFFFF;
    background: -moz-linear-gradient(-45deg, #FFFFFF 0%, #FFFFFF 50%, #DCDCDC 100%);
    background: -webkit-linear-gradient(-45deg, #FFFFFF 0%, #FFFFFF 50%, #DCDCDC 100%);
    background: linear-gradient(135deg, #FFFFFF 0%, #FFFFFF 50%, #DCDCDC 100%);
    -webkit-box-shadow: inset 1px 1px 6px 0px #9E9E9E; 
    box-shadow: inset 1px 1px 6px 0px #9E9E9E;
    padding:20px;
    margin:10px;
    font-size:1.4em;
}
.clear { clear: both; }
.busca{
    margin:20px;
    font-size:1.5em;
    color:silver;
}
.termo{
    margin-left:20px;
    font-size:3em;
    color:gold;
}