0
respostas

Formulario nao responsivo

body { border: 0%; background-image: url(../Imagens/Scania2.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; justify-content: center; align-items: center; height:auto; overflow-x: hidden; perspective: 2px; position: absolute; transform-style: preserve-3d; flex-direction: column; background-attachment: fixed; }

@import url('https://fonts.cdnfonts.com/css/north');

#Menu ul { transition: 2s; float: right; font-size: 25px; max-width: 1500px; list-style-type: none; padding: 0; background-color: rgba(255,255,255,0); font-family: 'North', sans-serif; display: inline-flex; }

#Menu ul li { display: inline; list-style-type: none; margin: 0 1em; }

#Menu ul Li a { color: black; padding: 20px; text-decoration: none; display: inline-block; transition: background .6s; border-radius: 40px; }

#Menu ul li a:hover { background-color: rgb(255, 255, 255); }

.container_form {

width: 750px;
position: fixed;
margin: 65%;
display: flex;
flex-direction: column;
background:#ffffff; 
box-shadow: 2px 2px 1.2px 0px #e3e3e3; 
border-radius:30px; 
opacity: 70%;
padding:5em;

} .container_form h1 {

font-family:'North', sans-serif;
font-size: 1.5em;
text-align: center;
color: #000000;
border-bottom: 1px #f0eded solid;
margin-bottom: 10px;

} .form_grupo {

font-size: small;
width: 90%;
margin: 0 auto;
margin-bottom: 30px;
position: relative;
font-family: 'North', sans-serif;

} .form_grupo .legenda { width: 100%; float: left; margin-top: 15px; margin-bottom: 15px; font-weight: bold; } /* SUBMIT */ .submit { width:100%; float:left; } .submit_btn { float: center; display: block; padding: 25px 50px; border: none; outline: none; background-color: rgb(255, 0, 0); color: rgb(255, 255, 255); font-family: 'North', sans-serif; font-size: 20px; font-family:'North', sans-serif; border-radius: 30px; margin: 20px auto; cursor: pointer; transition: all 0.3s; } .submit_btn:hover { background-color: rgb(0, 0, 255); transform: scale(1.03); } .dropdown { display: block; margin: 0 auto; font-size: 20px; font-family: 'North', sans-serif; color: #222222; border-radius: 4px; border: 1px #f2f2f2 solid; background: #fdfdfd; outline: none; padding-left: 10px; width: 100%; } .form_new_input { display: none; } .radio_label, .check_label { float: left; width: 100%; padding-left: 30px; cursor: pointer; margin-bottom: 8px; } .radio_new_btn { position: absolute; left: 0; transform: translateY(3px); height: 20px; width: 20px; border-radius: 50%; border: 0.2em solid #4c4c4c; } .radio_new_btn::after { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 8px; height: 8px; border-radius: 50%; background-color: #6fcffb; visibility: hidden; } .check_new_btn { position: absolute; left: 0; height: 20px; width: 20px; border: 0.2em solid #4c4c4c; } .check_new_btn::after { content: ""; height: 8px; width: 8px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: #6fcffb; visibility: hidden; } .form_new_input:checked ~ .radio_label .radio_new_btn::after, .form_new_input:checked ~ .check_label .check_new_btn::after {

visibility: visible;

} .form_new_input:checked ~ .radio_label, .form_new_input:checked ~ .check_label { color: #6fcffb; } .form_grupo { width: 100%; margin-bottom: 20px; position: relative; } .form_input { font-size: 16px; font-family: 'North', sans-serif; padding: 8px 15px; border-radius: 4px; border: 1px #f2f2f2 solid; background: #fdfdfd; outline: none; width: 100%; transition: all 0.3s; } .form_message, .form_message .message_input { width: 100%; float:left; } .form_message_label { width: 100%; float: left; margin-top: 15px; margin-bottom: 15px; font-weight: bold;

}

@media screen and (max-width: 768px) { .Menu, .container_form{ display: block; } .container_form,.form_grupo,.check-btn,.form_new_input,.submit .input-padrao { width: 100%; } }