@charset "UTF-8";

:root{
    --main_color: #3e3edd;
    --second_color: skyblue;
    --color1: #ffffff;
    --color2: #020235;
    --color3: #0324a1;
    --font-main: monospace;
    --font-second: Arial, Helvetica, sans-serif;
    --espaço: 25px;
    --radius: 35px;
    --margin_fixed: 97px;
}
body{
    width: 100vw;
    height: 100vh;
    background-image: url(../../image/banner-18.jpg);
    background-size: cover;
    background-attachment: fixed;
    background-position: center center;
    padding: 5px 0px 10px 0px;
    background-color: var(--fundo);
} 
header#ins{
    position: relative;
}
main.increva_main{
    padding: 20px 0px;
    height: 100vh;
}
main > section >form {
    display: block;
    margin: auto;
    width: 450px;
    background-color: #f7d8d825;
    padding: 20px 0px;
    border-radius: var(--radius);
    animation: luzins 1.7s infinite;
}
@keyframes luzins {
    0%{
        box-shadow: 7px 7px 20px 15px #5c1076;
    }
    50%, 90%{
        box-shadow: 7px 7px 20px 12px #5c1076;
        }
    75%{
        box-shadow: 7px 7px 20px 10px #5c1076;
        }
    100%{
        box-shadow: 7px 7px 20px 14px #5c1076;
    }
}
/*CAIXA ENBUTIDA*/
main > section > form > article{
    padding: 15px;
    margin: 10px auto;
    border-radius: 15px;
    max-width: 280px;
    min-width: 100px;
    background-color: var(--main_color);
    box-shadow: 2px 3px 13px 4px #00000900;
}
main > section > form label{
    margin: 0px 7px;
}
main > section > form input#iname_main,input#iemail,input#itel{
    font-size: 17px;
    color: white;
    padding: 10px;
}
main > section > form input#iemail{
    margin-bottom: 15px;
}
main > section > form  input#iname_main,input#iemail,input#itel,select#icurso,select#iturma,select#iclasse,select#itipo,input#iorca{
    outline: 3px solid var(--color2);
    border: transparent;
    font-weight: bolder;
    background-color: transparent;
    border: 1px;
}
main > section > form  input#iemail,input#iname_main,input#itel,select#icurso,input#iorca{
    width: 70%;
    max-width: 100%;
    min-width: 40%;
}
main > section > form select#iturma,select#iclasse{
    width: 28%;
}
main > section > form  select#icurso{
    padding: 10px;
}
main > section > form select#iturma,select#iclasse,select#itipo,input#iorca{
    padding: 5px;
}
main > section > form #itipo{
    width: 50%;
}
/*HOVER*/
main > section > form  input#iemail:hover,input#iname_main:hover,select#icurso:hover,select#iturma:hover,select#iclasse:hover,select#itipo:hover,input#iorca:hover{
    transform: translate(3.5%);
    transition: .3s;
}
main > section > form   option{
    background-color: var(--color2);
    color: var(--second_color);
}
/*PROJECTO*/
main article#add{
    display: block;
    padding: 20px;
    margin-top: 10px
}
main  textarea#idesc{
    font-size: 17px;
    max-width: 210px;
    min-width: 210px;
    max-height: 148px;
    min-height: 148px;
    display: block;
    padding: 3.5px;
    margin: 10px auto;
    color: white;
    border: 3px solid var(--color2);
    font-family: var(--font-second);
    font-size: 15px;
    font-weight: bold;
    background: transparent;
}
main div#pay{
    margin-top: 12px;
}
main div#pay > input#iorca{
    color: white;
    font-weight: bold;
    font-size: 17px;
    padding: 8px;
}
main div#pay > span{
    margin-left: 5px;
    font-size: 16px;
    font-weight: bolder;
}

main  p#base{
    text-align: center;
    font-weight: bold;
    font-size: 17px;
}

article.other  legend,label{
    font-size: 16px;
    padding-bottom: 10px;
}
main > section > form > input#ienviar{
    display: block;
    margin: auto;
    border-radius: 10px;
    font-size: 15px;
    padding: 12px 22px;
    background-color: var(--main_color);
    color: var(--color2);
    font-weight: bolder;
    text-transform: capitalize;
    border: transparent;
    box-shadow: 2px 2px 7px 1px #00000067;
    cursor: pointer;
    transition: .3s;
}
main > section > form > input#ienviar:hover{
    transform: translate(2.5px);
}
footer{
    margin-top: 12%;
    width: 0px;
    height: 0px;
    background: transparent;
}
/*ICONES*/
.icon{
    transform: translate(0%,8px);
}
@media screen  and (max-width: 487px) {
    main > section >form {
        width: 95vw;
    }
    footer{
        margin-top: 47%;
    }
    
}