/*Início CSS para PC */

@media only screen and (min-width: 1160px) {
    /* .container16 .teste {
	margin-left: 0;
	margin-right: 0;
	width: 50%;
} */
    .m-only {
        display: none;
        visibility: hidden;
    }
    .header_height {
        height: 128px;
    }
}

/*Menu Mobile*/

@media only screen and (max-width: 1159px) {
    .header h1 {
        font-weight: bold;
        color: #000000;
        margin-left: 10px;
        padding-top: 22px;
    }
    .header nav ul li {
        line-height: 60px;
        width: auto;
    }
    .bg_mobile_btn {
        background-color: #000;
        width: 4rem;
        height: 4rem;
        z-index: 999;
        display: block;
        float: right;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .mobile_btn {
        z-index: 999;
        display: block;
        color: #EDEDF0;
        width: 36px;
        height: auto;
        border-top: 3px solid;
        margin: 0 auto;
        float: right;
        position: relative;
        cursor: pointer;
        -webkit-backface-visibility: hidden;
    }
    .mobile_btn::after,
    .mobile_btn::before {
        content: '';
        display: block;
        height: 3px;
        margin-top: 6px;
        background: currentColor;
        position: relative;
        transition: transform .2s ease;
    }
    .mobile_btn.active {
        border-top-color: transparent;
        margin-top: -10px;
    }
    .mobile_btn.active::after {
        margin-top: 0px;
        top: 2px;
        transform: rotate(45deg);
    }
    .mobile_btn.active::before {
        margin-top: 0px;
        top: 6px;
        transform: rotate(135deg);
    }
    .menu_nav.mobile_menu {
        position: fixed;
        background: #ffffff;
        margin-top: 112px;
        padding: 10px 20px 10px 10px;
        top: 0;
        right: 0px;
        opacity: 0;
        visibility: hidden;
        transform: translate3d(60px, 0px, 0px);
        transition: .3s;
        -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
    }
    .menu_nav.mobile_menu.active {
        opacity: 1;
        visibility: visible;
        transform: translate3d(0px, 0px, 0px);
    }
    .menu_nav.mobile_menu ul {
        display: flex;
        flex-direction: column;
        text-align: right;
    }
    .menu_nav.mobile_menu li {
        display: block;
    }
    .menu_nav.mobile_menu li a {
        width: 100%;
        text-align: center;
    }
    .menu_nav.mobile_menu li a i {
        font-size: 2.5rem;
        padding-top: 15px;
    }
}

/* Início CSS para tablet */

@media only screen and (min-width: 768px) and (max-width: 1159px) {
    body {
        padding-top: 112px;
    }
    .header_height {
        height: 112px;
    }
    header,
    header .header {
        height: 4rem;
    }
    header .container12 {
        width: 100%;
    }
    .introducao {
        height: calc(100vh - 112px);
    }
    .introducao .container12 {
        margin: 0 10px;
    }
    .form_inscricao label {
        font-size: .8rem;
    }
}

/*Início CSS para celular*/

/*Início CSS para celular*/

@media only screen and (max-width: 767px) {
    .introducao {
        height: -webkit-fill-available;
        background: url("../img/ssm-2021.jpg") no-repeat center; /* Define o fundo */
        background-size: contain; /* Faz com que a imagem de fundo apareça inteira */
        position: relative;
    }
    .w-only,
    .t-only {
        display: none;
        visibility: hidden;
    }
    body {
        padding-top: 64px;
    }
    .header_height {
        height: 64px;
    }
    header,
    header .header {
        height: 4rem;
        top: 0;
    }
    header .container12 {
        width: 100%;
    }
    .menu_nav.mobile_menu {
        margin-top: 64px;
    }
    
    /* Botão de inscrição */
    .introducao a.btn {
        padding: 6px 10px;
        position: absolute;  /* Define uma posição absoluta para o botão */
        bottom: -100px;        /* Move o botão para 10px da parte inferior */
        left: 50%;
        transform: translateX(-50%); /* Centraliza horizontalmente o botão */
        z-index: 2;          /* Garante que o botão esteja sobre o conteúdo */
    }
    
    .introducao h1,
    .introducao h1 span {
        font-size: 2rem;
        font-weight: 600;
        line-height: 2.2rem;
    }
    .introducao h1 i {
        font-size: 1.5rem;
        line-height: 1rem;
    }
    .introducao h2 {
        font-size: 1.5rem;
        padding-top: 50px;
    }
    .introducao h3 {
        font-size: 2rem;
        margin-right: 1rem;
    }
    .introducao p {
        font-size: 1rem;
        padding-top: 20px;
    }
    .sobre,
    .percursos,
    .parceiros,
    .ed_anteriores {
        padding: 60px 0;
    }
    h1.titulo {
        padding-bottom: 50px;
        font-size: 1.5rem;
    }
    .ed_anteriores a {
        font-size: 2rem;
    }
    .copy p {
        padding: 20px 0;
        font-size: .8rem;
    }
    /* Inscrição */
    .inscricao {
        padding: 60px 0;
    }
    .img_form {
        height: 300px;
        width: 100%;
        border-radius: 8px 8px 0 0;
    }
    .bg_form {
        background: white;
        height: 600px;
        border-radius: 8px 8px 0 0;
    }
    .form_inscricao h2 {
        font-size: 1.5rem;
        padding-bottom: 30px;
    }
    .form_inscricao .column8,
    .form_inscricao .column4 {
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }
    .form_inscricao label {
        font-size: .8rem;
    }
    .form_inscricao input,
    .form_inscricao select {
        margin: 3px 0 0 0;
    }
    .loading {
        left: 0;
    }
    .loading-spinner {
        margin-top: 300px;
    }
    .msg {
        width: 100%;
        margin-top: 450px;
        left: 0;
        height: 0;
    }
}