@charset "UTF-8";html{font-size:62.5%;box-sizing:border-box;scroll-behavior:smooth}body{width:100%;min-height:100vh;background-color:#dff1e7;color:#2b4246;font-family:Karla;font-weight:400;display:flex;align-items:center;justify-content:center}input,textarea,.form__type-item{border:none;border-radius:.4rem;padding:.8rem 1.2rem;outline:.1rem solid hsl(186,15%,59%)}input:focus,textarea:focus,.form__type-item:focus{outline-color:#0c7d69}@font-face{font-family:Karla;src:url(../assets/fonts/Karla-Bold.eot?#iefix) format("embedded-opentype"),url(../assets/fonts/Karla-Bold.woff) format("woff"),url(/My-practices-in-the-frontend-mentor/demo/junior/contact-form-main-demo/assets/Karla-Bold-DubzfTrE.ttf) format("truetype"),url(../assets/fonts/static/Karla-Bold.svg#Karla-Bold) format("svg");font-style:normal;font-weight:700}@font-face{font-family:Karla;src:url(../assets/fonts/Karla-Regular.eot?#iefix) format("embedded-opentype"),url(../assets/fonts/static/Karla-Regular.woff) format("woff"),url(/My-practices-in-the-frontend-mentor/demo/junior/contact-form-main-demo/assets/Karla-Regular-72GnZkvk.ttf) format("truetype"),url(../assets/fonts/static/Karla-Regular.svg#Karla-Regular) format("svg");font-style:normal;font-weight:400}*{padding:0;margin:0}*,*:before,*:after{box-sizing:border-box}a,a:link,a:visited,a:hover{text-decoration:none;cursor:pointer}aside,nav,footer,header,section,main{display:block}ul,ol{list-style:none}li{list-style-type:none}img{vertical-align:top;max-width:100%;height:auto}svg{max-width:100%;height:auto}address{font-style:normal}input,textarea,button,select{font-family:inherit;font-size:inherit;color:inherit;background-color:transparent}input::-ms-clear{display:none}button,input[type=submit]{display:inline-block;box-shadow:none;background:none;cursor:pointer}input[type=file]{max-width:100%}button{border:none}.form{background-color:#fff;padding:2.4rem;border-radius:1.8rem;font-size:1.6rem;display:flex;flex-direction:column;gap:2.4rem;transition:height .2s ease-in-out}@media (width <= 767.98px){.form{margin:5rem 0;width:35rem}}.form__title{font-weight:700;font-size:2.8rem}.form__names{display:flex;flex-direction:row;gap:1.2rem}@media (width <= 767.98px){.form__names{flex-direction:column}}.form__first-name,.form__last-name,.form__email{display:flex;flex-direction:column;gap:.8rem}.form__type{display:flex;flex-direction:column;position:relative;gap:1.2rem}.form__type-list{display:flex;flex-direction:row;justify-content:space-between}@media (width <= 767.98px){.form__type-list{flex-direction:column;gap:1.8rem}}.form__type-item{outline:.1rem solid hsl(186,15%,59%);width:100%;position:relative;width:20.5rem;display:flex;align-items:center;gap:.8rem;cursor:pointer;transition:all .2s ease-in-out}@media (width <= 767.98px){.form__type-item{width:100%}}.form__type-item input{outline:none}.form__type-item:not(:has(input:checked)){background-color:#fff}.form__type-item:has(input:checked){outline-color:#0c7d69;background-color:#dff1e7}.form__message{display:flex;flex-direction:column;gap:.8rem;min-height:10rem;resize:none}@media (width <= 767.98px){.form__message{min-height:20rem}}.form__agreement{display:flex;align-items:center;gap:1.2rem}.form__agreement input{outline:none}.form__agreement input:checked{accent-color:hsl(169,82%,27%)}.form__button-submit{background-color:#0c7d69;color:#fff;padding:1.2rem 0;border-radius:.8rem;transition:background-color .2s ease-in-out}@media (any-hover: hover){.form__button-submit:hover{background-color:#0c463b}}@media (any-hover: none){.form__button-submit:active{background-color:#0c463b}}.error__label{color:#d73c3c;font-size:1.4rem;display:none}.error__label.active{display:block}.form-success{display:flex;flex-direction:column;gap:1.8rem;position:absolute;top:-110px;color:#fff;background-color:#2b4246;padding:2.4rem;border-radius:1.2rem;transition:top .2s ease-in-out;z-index:10}.form-success.active{top:50px}.form-success__header{display:flex;flex-direction:row;align-items:center;gap:1.2rem}.form-success__title{font-size:1.8rem;font-weight:700}.form-success__main{font-size:1.4rem;font-weight:500}
