.ks_contact_container { > .row { > .col-lg-8 { flex: 100%; max-width: 100%; padding: 0; > .text-center.my-3 { display: none; } } > .col-lg-4 { display: none; } } + .mt-2 { margin-top: 0 !important; } } .ks-contact-page { background: #f3f3f3; .ks-contact-cover { padding: 50px 0; background-position: bottom; background-color: rgba(0, 0, 0, 0.45); background-blend-mode: color; background-size: cover; background-repeat: no-repeat; color: $white; .theme__heading { color: #fff; } } .ks-contact-form-container { box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22); animation: moveupfull 0.6s ease-in-out 0.9s forwards; opacity: 0; .ks-form-info { margin-bottom: 15px; } } .ks-contact-icon { width: 80px; height: 80px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: auto; border: 3px solid $white; transition: 0.3s ease-in-out; @media (max-width: 575px) { width: 90px; height: 90px; } &-img { width: 50px; } } .ks-contact-info { transition: 0.3s ease-in-out; margin-top: 5px; @media (max-width: 575px) { margin-bottom: 15px; } &-title { font-size: 20px; font-weight: bold; } } .ks-contact-details { font-size: 16px; a { color: $white; } .fa { display: none; } } .ks-contact-form { input, textarea { font-size: 16px; transition: 0.3s ease-in-out; border-radius: 0; padding: 0; &:focus { box-shadow: none !important; } &:placeholder-shown { color: $black; font-weight: bold; font-size: 16px; + label { transform: translateY(-32px); opacity: 0; position: relative; z-index: -1; } } + label { font-size: 13px; font-weight: 600; margin-top: 5px; transition: 0.3s ease-in-out; transform: translateY(-60px); } &:focus { box-shadow: 0px 1px 0px black; } } textarea { height: 100px !important; + label { transform: translateY(-140px); } } .o_website_form_send { min-width: auto; font-size: 20px; } } .ks-contact-social { border-left: 1px solid #ccc; background: rgba(0, 0, 0, 0.83); color: $white; a { color: $white; .fa { color: $black; animation: moveleft 0.3s ease-in-out forwards; opacity: 0; width: 36px; height: 36px; font-size: 18px; line-height: 37px; transition: all ease-in-out 0.3s; } #git_hub, #insta{ font-size: 22px !important; } &:hover { .fa-facebook { background: #3c5a99 !important; color: #fff !important; border-radius: 20% !important; } .fa-twitter { background: #28aae1 !important; color: #fff !important; border-radius: 20% !important; } .fa-linkedin { background: #0077b5 !important; color: #fff !important; border-radius: 20% !important; } .fa-youtube { background: #f00f00 !important; color: #fff !important; border-radius: 20% !important; } .fa-instagram { background: #FD1D1D !important; color: #fff !important; border-radius: 20% !important; } #insta{ background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%) !important; filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f09433', endColorstr='#bc1888',GradientType=1 ) !important; color: #fff !important; } #git_hub{ background: #141f1e !important; color: #fff !important; } } } .list-unstyled { @media (max-width: 768px) { display: flex; flex-wrap: wrap; li { margin-right: 20px; } } } } .ks-contact-info-box { flex-direction: column; width: 100%; text-align: center; margin-bottom: 20px; } } .ks-col-full { flex: 100%; max-width: 100%; padding: 0; } #oe_structure_website_crm_contact_us_thanks_1 { + .container { padding: 40px 10px; h1 { @extend .theme__heading; margin-bottom: 24px; text-align: center; } .col-lg-4 { display: none; } .col-lg-8 { text-align: center; margin: auto; } } } @media(max-width: 767px){ .address-inner-sec ul.list-style-none { padding-left: 0; } }