@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Alkatra:wght@400..700&family=Anta&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Playwrite+AR:wght@100..400&display=swap');


.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {
   font-family: 'Roboto', sans-serif;
   margin-bottom: .5rem;
   /* font-weight: 500; */
   line-height: 1.2;
}

p {
   font-family: 'Roboto', sans-serif;
   font-size: 1rem;
}

.box-conteudo p{
   font-size: 1.2rem;

}

label {
   font-size: 1rem;
   font-weight: 700;
}

a {
   color: #212529;
   text-decoration: none;
}

a:hover {
   color: #101214;
   text-decoration: none;
}

body {
   background-image: url('/imagens/bg.jpg?0605');
   background-color: #8a3c94;
   background-size: cover !important;
   background-repeat: no-repeat !important;
   background-position: top !important;
   background-attachment: fixed;
   font-family: 'Fira Sans', sans-serif;
}



body .box-conteudo {

   background-color: rgba(255,255,255,0.95);
   border-radius: 40px;
   -webkit-box-shadow: 0px 0px 32px -12px rgba(0, 0, 0, 0.56);
   -moz-box-shadow: 0px 0px 32px -12px rgba(0, 0, 0, 0.56);
   box-shadow: 0px 0px 32px -12px rgba(0, 0, 0, 0.56);

   min-height:600px;
}



h1 {
   font-size: 1.8rem !important;
   font-weight: 700 !important;
}


h2 {
   font-size: 1.4rem !important;
   font-weight: 400 !important;
}

h3 {
   font-size: 1.2rem !important;
   font-weight: 700 !important;
}

.tit-interno_1 {
   color: #000023;
}

.tit-interno_2 {
   color: #FF8200;
}

.tit-interno_3 {
   color: #000023;
}


.tit_1 {
   color: #8A3C94;
   border-bottom: 1px solid #8A3C94;
}

.tit_2 {
   color: #000023;
   border-bottom: 1px solid #000023;
}

.btn-iniciar-cadastro {
   background-color: #8A3C94;
   border-radius: 25px;
   display: inline-block;
   cursor: pointer;
   border: 0;
   color: #ffffff;
   font-size: 15px;
   padding: 14px;
   width: 100%;
   text-decoration: none;
   font-weight: 600;
}

.btn-iniciar-cadastro:hover {
   background-color: #27274d;
   color: #ffffff;
   text-decoration: none;
}

.btn-iniciar-cadastro:active {
   position: relative;
   top: 1px;
}

.btn{
   border-radius:15px !important;
}

.btn-secondary {
   color: #fff;
   background-color: #8A3C94;
   border-color: #8A3C94;

}

.bt_escolas {
   aspect-ratio: 1 / 1; /* a perfect square */
   border-radius: 20px;
   background-color:#8A3C94;
   color:#FFF;
   display:flex;
   width:100%;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   text-align:center;
   padding:15px;
}
.bt_escolas span {
   background-color:#FF8200;
   color:#FFF;
   display:flex;
   border-radius: 10PX;
   width:100%;
   max-width: 140px;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   text-align:center;
   margin-bottom: 8px;
}

.bt_escolas:hover {
   background-color:#a163a9;
}

.bt_escolas.check{
   background-color:#FF8200;
}
.bt_escolas.check span {
   background-color:#8A3C94;
}

.bt_escolas.check::before{
   font-family: "Font Awesome 5 Free";
   content: "\f058";
   position: absolute;
   bottom: 5px;
   right: 25px;
   font-size: 1.5em;
}

.bt_escolas.check:hover {
   background-color:#ff9b33;
}


.bt_livros {
   aspect-ratio: 1 / 1; /* a perfect square */
   border-radius: 20px;
   background-color:#98aa00;
   color:#FFF;
   display:flex;
   width:100%;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   text-align:center;
   padding:15px;
   overflow:hidden;
   position:relative;
}

.bt_livros span {
   background-color:#FF8200;
   color:#FFF;
   display:flex;
   border-radius: 10PX;
   width:100%;
   max-width: 140px;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   text-align:center;
   margin-bottom: 8px;
}

.bt_livros:hover {
   background-color:#dae865;
}

.bt_livros.check{
   background-color:#FF8200;
}
.bt_livros.check span {
   background-color:#8A3C94;
}

.bt_livros.check::before{
   font-family: "Font Awesome 5 Free";
   content: "\f058";
   position: absolute;
   bottom: 5px;
   right: 25px;
   font-size: 1.5em;
}

.bt_livros.check:hover {
   background-color:#ff9b33;
}






.bt_pagina {
   aspect-ratio: 1 / 1; /* a perfect square */
   border-radius: 20px;
   background-color:#4a70a5;
   color:#FFF;
   display:flex;
   width:100%;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   text-align:center;
   padding:15px;
}

.bt_pagina span {
   background-color:#FF8200;
   color:#FFF;
   display:flex;
   border-radius: 10PX;
   width:100%;
   max-width: 140px;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   text-align:center;
   margin-bottom: 8px;
}

.bt_pagina:hover {
   background-color:#759acc;
}

.bt_pagina.check::before{
   font-family: "Font Awesome 5 Free";
   content: "\f058";
   position: absolute;
   bottom: 5px;
   right: 25px;
   font-size: 1.5em;
}

.bt_pagina.check:hover {
   background-color:#ff9b33;
}






.btn-acessar-cadastro {

   background-color: #FF8200;
   border-radius: 15px;
   display: inline-block;
   cursor: pointer;
   color: #ffffff;
   font-size: 15px;
   padding: 14px;
   width: 100%;
   text-decoration: none;
   font-weight: 600;
   border: none;
   outline: none;
}



.btn-acessar-cadastro:hover {
   background-color: #886927;
   color: #ffffff;
   text-decoration: none;
}



.btn-acessar-cadastro:active {
   position: relative;
   top: 1px;
}


.btn-salvar-cadastro {

   background-color: #8A3C94;
   border-radius: 15px;
   display: inline-block;
   border: 0;
   cursor: pointer;
   color: #ffffff;
   font-size: 15px;
   padding: 14px;
   width: 100%;
   text-decoration: none;
   font-weight: 600;
}



.btn-salvar-cadastro:hover {
   background-color: #a83e2b;
   color: #ffffff;
   text-decoration: none;
}



.btn-salvar-cadastro:active {
   position: relative;
   top: 1px;
}



.pagination-lg .page-link {

   border-color: #fff;

   color: #fff;

   background-color: #d71920;

   border-radius: 5px;

   font-weight: 500;

   padding: 24px 20px;

   line-height: 0;

}



.form-control:focus {

   color: #495057;

   background-color: #fff;

   border-color: #d35b2f1c;

   outline: 0;

   box-shadow: 0 0 0 0.2rem #d35b2f5c !important;

}



.custom-select:focus,
.tokenfield.focus {

   color: #495057;

   background-color: #fff;

   border-color: #d35b2f1c;

   outline: 0;

   box-shadow: 0 0 0 0.2rem #d35b2f5c !important;

   -webkit-box-shadow: 0 0 0 0.2rem #d35b2f5c !important;

}



.btn-info.focus,
.btn-info:focus {

   color: #fff;

   background-color: #fff;

   border-color: #d35b2f1c;

   outline: 0;

   box-shadow: 0 0 0 0.2rem #d35b2f5c !important;

   -webkit-box-shadow: 0 0 0 0.2rem #d35b2f5c !important;

}



.box-titulo {

   border-bottom: 1px solid #d71920;

   color: #d71920;

   padding-top: 30px;

   padding-bottom: 10px
}



/* radio-buttom */

.inputGroup {

   background-color: transparent;

   display: block;

   margin: 10px 0;

   position: relative;

}

.inputGroup label {

   background-color: #efefef;

   padding: 9px 30px;

   width: 100%;

   display: block;

   text-align: left;

   color: #3C454C;

   cursor: pointer;

   position: relative;

   z-index: 2;

   -webkit-transition: color 200ms ease-in;

   transition: color 200ms ease-in;

   overflow: hidden;

   border-radius: 0px;

}



.inputGroup label:before {

   width: 100%;

   height: 50px;

   border-radius: 50%;

   content: '';

   background-color: #fec63e;

   position: absolute;

   left: 5%;

   top: 50%;

   -webkit-transform: translate(-50%, -50%) scale3d(1, 1, 1);

   transform: translate(-50%, -50%) scale3d(1, 1, 1);

   -webkit-transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);

   transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);

   opacity: 0;

   z-index: -1;

}

.inputGroup label:after {

   width: 20px;

   height: 20px;

   content: '';

   border: 2px solid #D1D7DC;

   background-color: #fff;

   background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.414 11L4 12.414l5.414 5.414L20.828 6.414 19.414 5l-10 10z' fill='%23fff' fill-rule='nonzero'/%3E%3C/svg%3E ");

   background-repeat: no-repeat;

   background-position: -5px -5px;

   border-radius: 50%;

   z-index: 2;

   position: absolute;

   // right: 30px;

   left: 5px;

   top: 50%;

   -webkit-transform: translateY(-50%);

   transform: translateY(-50%);

   cursor: pointer;

   -webkit-transition: all 200ms ease-in;

   transition: all 200ms ease-in;

}

.inputGroup input:checked~label {

   color: #fff;

}

.inputGroup input:checked~label:before {

   -webkit-transform: translate(-50%, -50%) scale3d(56, 56, 1);

   transform: translate(-50%, -50%) scale3d(56, 56, 1);

   opacity: 1;

}

.inputGroup input:checked~label:after {

   background-color: #FF8200;

   border-color: #FF8200;

}

.inputGroup input {

   width: 32px;

   height: 32px;

   -webkit-box-ordinal-group: 2;

   order: 1;

   z-index: 2;

   position: absolute;

   right: 30px;

   top: 50%;

   -webkit-transform: translateY(-50%);

   transform: translateY(-50%);

   cursor: pointer;

   visibility: hidden;

}



.form {

   padding: 0 16px;

   max-width: 550px;

   margin: 50px auto;

   font-size: 18px;

   font-weight: 600;

   line-height: 36px;

}







*,

*::before,

*::after {

   box-sizing: inherit;

}



html {

   box-sizing: border-box;

}



code {

   background-color: #9AA3AC;

   padding: 0 8px;

}



/* radio-buttom */



.atividade-data {

   margin: 0 10px 10px 0 !important;

}



.btn-info {

   color: #fff;

   background-color: #d71920 !important;

   border-color: #d71920 !important;

}



.fa,
.fa-question-circle {

   cursor: pointer;

   color: #212529;

   font-size: 15px;

}



.fa,
.fa-question-circle:hover {

   color: #0f1113;

}



.alert-danger {

   border-width: 4px !important;

   border-color: #aa0000 !important;

}



// EXTRAS



// Formulário

// Todas as etapas

.tokenfield.input-lg,
.input-group-lg .tokenfield {

   min-height: auto;

   padding-bottom: 1px;

   padding-top: 6px;

}



.chosen-container {

   font-size: 16px;

}



.chosen-container-single .chosen-single {

   height: 36px;

   border: 1px solid #ced4da;

}



.chosen-container-single .chosen-single span {

   line-height: 36px;

}



// Quarta etapa

.inputCollapse {

   background-color: #efefef;

   padding: 9px 30px 9px 15px;

   width: 100%;

   display: block;

   text-align: left;

   color: #3C454C;

   cursor: pointer;

   position: relative;

   z-index: 2;

   -webkit-transition: color 200ms ease-in;

   transition: color 200ms ease-in;

   overflow: hidden;

   border-radius: 0px;

   font-size: 0.9rem;

   font-weight: 700;

   margin-bottom: 10px;

}



.inputCollapse.closed::before {

   content: "+";

   font-size: 24px;

   position: absolute;

   right: 15px;

   top: 0px;

}



.inputCollapse.opened::before {

   content: "-";

   font-size: 24px;

   position: absolute;

   right: 15px;

   top: 0px;

}



.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
   color: #333;
   border-color: #CCC #CCC #fff;
}

.nav-tabs {
   border-bottom: 1px solid #CCC;
}

/* Preloader */

#preloader {

   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: #fff;
   /* change if the mask should have another color then white */
   z-index: 1035;
   /* makes sure it stays on top */
}

#status {
   width: 200px;
   height: 200px;
   position: absolute;
   left: 50%;
   /* centers the loading animation horizontally one the screen */
   top: 50%;
   /* centers the loading animation vertically one the screen */
   background-image: url(/imagens/loader.gif);
   /* path to your loading animation */
   background-repeat: no-repeat;
   background-position: center;
   margin: -100px 0 0 -100px;
   /* is width and height divided by two */
}