/*
{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Fira Sans', sans-serif;
}
    */
.section-contact{
    min-height: 100vh;
    padding-top: 100px;
    padding-bottom: 100px;
    background-image: linear-gradient(175deg,#eee 50%,#ff9fdb 50% , #9b75d7 );

.container{
        max-width: 1280px;
        margin: 0 auto;
        padding-left: 32px;
        padding-right: 32px;

        @media(min-width: 768px){
            padding-left: 64px;
            padding-right: 64px;
        }

        @media(min-width: 1024px){
            padding-left: 128px;
            padding-right: 128px;
        }
        h1{
            color: #666;
            font-size: 36px;
            text-transform: uppercase;
            text-align: center;
            margin-bottom: 16px;
        }

        p{
            color: #888;
            font-size: 18px;
            line-height: 1.5;
            margin-bottom: 32px;
        }
        form{
            display: grid;
            grid-template-columns: 1fr;
            grid-gap:16px;
            background-color: #fff;
            padding: 32px;
            border-radius: 16px;
            box-shadow:0px 6px 12px rgba(0, 0, 0, 0.2);
           

            @media (min-width:768px) {
                grid-template-columns: repeat(2,1fr);      
        }
        .form-group{
            label{
                display: block;
                margin-bottom: 5px;
                color:#888;
                font-size: 14px;
            
            }
            .form-element{
                appearance:none;
                outline: none;
                border: none;
                display: block;
                width: 100%;
                border-radius: 8px;
                padding: 12px 16px;
                background-color: #f3f3f3;
                transition: 0.4s;

                &:focus{
                    box-shadow: 0px 0px 6px rgba(0,0,0,0.2);
                }
            }
            textarea{
                resize:none;
                min-height: 100px;
        
            }   
            
        }
        .submit-group{
            grid-column: 1 /-1;
            text-align: right;


            input[type="submit"] {
                appearance: none;
                border:none;
                outline: none;
                background: none;
        
                padding: 12px 16px;
                background-color: #ff9fdb;
                border-radius: 8px;
                color:#fff;
                cursor: pointer;
                transition: 0.4s;
        
                &:hover{
                    background-color: #9b75d7;
                }
        }

        }
    }
    
     
    }
}

/*
    .container{
        max-width: 1180px;
        margin: 0auto;
        padding-left: 20px;
        padding-right: 20px;
    
        @media(min-width: 768px){
            padding-left: 64px;
            padding-right: 64px;
        }
        @media(min-width: 1024px){
            padding-left: 128px;
            padding-right: 128px;
        }
        h1{
            color: #666;
            font-size: 36px;
            text-transform: uppercase;
            text-align: center;
            margin-bottom: 16px;
        }
        p{
            color: #888;
            font-size: 18px;
            line-height: 1.5;
            margin-bottom: 32px;
        }
        form{
        display: grid;
        grid-template-columns: 1fr;
        grid-gap:14px;
        background-color: #fff;
        padding: 32 px;
        border-radius: 16px;
        box-shadow:0px 6px 12px rgba(0, 0, 0, 0.2);
        border-top-right-radius: 3%;
        

       @media (min-width:768x) {
        grid-template-columns: repeat(2,1fr);   

            }
            .form-group{
                &.full{
                    grid-column: 1 /-2;
                }
               
                label{
                    display: block;
                    margin-bottom: 5px;
                    color:#888;
                    font-size: 14px;
                    margin-left: -5%;
                }

            .form-element{
            outline:none;
            border: none;
            display: block;
            width: 120%;
            border-radius: 8px;
            padding: 12px 16px;
            background-color: #f3f3f3;
            transition: 0.4s;
            margin-left: -5%;


            
                &:focus{
                    box-shadow: 0px 0px 6px rgba(0,0,0,0.2);
                    background-color: #fff;
                }

            }

            }

    textarea{
        resize:none;
        min-height: 100px;

    }

}
.submit-form{

    grid-column: 1 /-1;
    text-align: center;

    input[type="submit"] {
        appearance: none;
        border:none;
        outline: none;
        background: none;

        padding: 12px 16px;
        background-color: #ff9fdb;
        border-radius: 8px;
        color:#fff;
        cursor: pointer;
        transition: 0.4s;

        &:hover{
            background-color: #9b75d7;
        }
}
}
}
}
*/