Refatorando o espaçamento da base.less

index.html

@@ -45,30 +45,30 @@
     </table>
 
     <!-- action="salvar.html" -->
-    <form class="frm" >
-      <h2 class="frm__titulo">Registre seu interesse</h2>
+    <form class="form" >
+      <h2 class="form__titulo">Registre seu interesse</h2>
 
-      <div class="frm__infor">
-        <label class="frm__infor__label">Nome:</label>
-        <input type="text" name="nome" class="frm__infor__input"/>
+      <div class="form__infor">
+        <label class="form__infor__label">Nome:</label>
+        <input type="text" name="nome" class="form__infor__input"/>
       </div>
-      <div class="frm__infor">
-        <label class="frm__infor__label"  for="campo_sobrenome">
+      <div class="form__infor">
+        <label class="form__infor__label"  for="campo_sobrenome">
           Sobrenome:
         </label>
-        <input id="campo_sobrenome" type="text" name="sobrenome" class="frm__infor__input"/>
+        <input id="campo_sobrenome" type="text" name="sobrenome" class="form__infor__input"/>
       </div>
 
-       <div class="frm__infor">
-        <label for="campo_email" class="frm__infor__label">
+       <div class="form__infor">
+        <label for="campo_email" class="form__infor__label">
           Email:
         </label>
-        <input id="campo_email" type="email" name="email" class="frm__infor__input"/>
+        <input id="campo_email" type="email" name="email" class="form__infor__input"/>
       </div>
 
 
-      <div class="frm__infor">
-        <label class="frm__infor__label">
+      <div class="form__infor">
+        <label class="form__infor__label">
           <input id="check" type="checkbox" name="autoriza" /> Receber novidades.
         </label>
       </div>

styles/base.less

@@ -14,7 +14,7 @@ html {
 }
 
 
-body{
+body {
     header {
         background-color: #EAD945;
         position: fixed;
@@ -23,28 +23,28 @@ body{
         right: 0;  
         left: 0;
 
-        h1{
+        h1 {
             text-align: center;
             
         }
     }
 
-    main{
+    main {
         margin: 24px 40px;
         padding-top:160px;
 
-        h2{
+        h2 {
             text-align: center;
             
         }
 
-        .titulo{
+        .titulo {
             margin-top: 0;
             margin-bottom: 34px;
             
         }
 
-        table{
+        table {
             margin: auto;
             width: 100%;
             background: #edce73;
@@ -53,40 +53,35 @@ body{
             padding-bottom: 20px;
           
           }
-          //form.frm;
-          //form .frm__infor;
-        form{
+        
+        //classe do form  
+        .form {
             margin-top:50px;
-            //trocar o nome abaixo
-            &.frm{
-                border: 1px solid #007bff5e;
-            }
-            .frm{
+            border: 1px solid #007bff5e;
 
-            
-                &__infor{
+                &__infor {
                     margin-top: 10px;
                     padding-top: 10px;
                     padding-bottom: 10px;
 
                     //label do checkbox
-                    label:last-child{
+                    label:last-child {
                         font-weight:600;
                         color:red;
                     }
                     //input do checkbox
                     
-                    input[type="checkbox"]{
+                    input[type="checkbox"] {
                         width: 16px;
                         height: 16px;
                     }
 
-                    &__label{                       
-                       font-size: 18px;
+                    &__label {                       
+                    font-size: 18px;
 
                     }
 
-                    &__input{
+                    &__input {
                         width: 289px;
                         height: 30px;
                         background: whitesmoke;
@@ -94,38 +89,38 @@ body{
                         margin-top: 3px;
                     }
                 }
-            
+
+                button {
+                    background: white;
+                    font-size: 19px;
+                    letter-spacing: 2.2px;
+                    margin-top: 45px;
+                    border: none;
+                    width: 100%;
+                    height: 40px;
+                }
             }    
-            
-            button{
-                background: white;
-                font-size: 19px;
-                letter-spacing: 2.2px;
-                margin-top: 45px;
-                border: none;
-                width: 100%;
-                height: 40px;
-            }
-        }
-    }
+       }
 
-    footer{
+       footer {
         margin-top: 20%;
         padding:10% 10%;
         text-align: center;   
         background:chocolate;
       
-        p, span{
+        p, span {
             color:#ffd045;
             font-size: 10px;
 
         }
-        span{
+
+        span {
             font-weight: bold;
             color:#ffde7c;
         }
+    }
+}
+
 
 
-      }
-}