.footer-top { background: #1F1F1F none repeat scroll 0 0; border-bottom: 1px solid #5b5b5b; padding: 55px 0; } .footerTopMessLeft { font-size: 40px; font-weight: normal; color: #ffffff; line-height: 50px; } .footerTopMessRight { padding: 20px 0; width: 100%; } .footer-top-area { background: #1F1F1F none repeat scroll 0 0; padding: 30px 0 40px; } .footer-widget .footerWidgetLine { width: 56px; height: 2px; background-color: var(--button); margin-bottom: 15px; } .footer-widget .footerWidgetTitle { font-family: 'Playfair Display', 'Open Sans', sans-serif; color: var(--primaryColor); display: block; font-size: 16px; font-weight: 600; text-transform: uppercase; line-height: 20px; margin-bottom: 15px; } ul.footer-menu a h5, ul.footer-menu a li { color: #777777; display: block; font-size: 14px; font-weight: 400; line-height: 40px; margin: 0; } ul.footer-menu a:last-child h5, ul.footer-menu a:last-child li { padding-bottom: 0; border: 0 } ul.footer-menu a h5:hover, ul.footer-menu a li:hover { color: var(--button); } .footer-widget img { width: 150px; height: 60px; object-fit: cover; } .footer-widget p { color: #777777; font-size: 14px; font-weight: 500; line-height: 25px; margin-top: 22px; } .widget-icon {} .widget-icon a { color: #777777; display: inline-block; font-size: 18px; margin-right: 10px; position: relative; text-align: center; } .widget-icon a i { font-size: 20px; color: #B3B5B9; } .widget-icon a i:hover { color: var(--button); } .footer-bottom-area { background: #1F1F1F; } .footer-company-info { font-size: 14px; color: #777777; line-height: 18px; margin-bottom: 20px; display: flex; } .footer-company-info a { color: #777777; } .footer-company-info a:hover { color: var(--button); } .footer-company-info i { font-size: 18px; flex: 0 0 18px; margin-right: 10px; } .footerInput { position: relative; width: 100%; display: flex; } .footerInput input { width: 70%; height: 40px; border: none; border-top-left-radius: 20px; border-bottom-left-radius: 20px; padding-left: 10px; } .footerInput .footerInputBtn { padding: 0 10px; line-height: 40px; border: none; border-radius: 0; border-top-right-radius: 20px; border-bottom-right-radius: 20px; background: var(--button); } .footerBottom { display: flex; justify-content: space-between; border-top: 1px solid #444444; font-size: 14px; color: #777777; text-align: center; padding: 27px 0; } .footerButton { background-color: aquamarine; } .inquiryButton { background: var(--button) none repeat scroll 0 0; box-shadow: 0 4px 12px 0 rgb(0 0 0 / 15%); bottom: 80px; font-size: 20px; height: 40px; line-height: 40px; position: fixed; right: 30px; text-align: center; transition: all 0.3s ease 0s; width: 40px; color: #fff; cursor: pointer; z-index: 1; } .inquiryButton i { font-size: 20px; } .messenger { background: #0073FF none repeat scroll 0 0; box-shadow: 0 4px 12px 0 rgb(0 0 0 / 15%); bottom: 130px; font-size: 20px; height: 40px; line-height: 40px; position: fixed; right: 30px; text-align: center; transition: all 0.3s ease 0s; border-radius: 50%; width: 40px; color: #fff; cursor: pointer; z-index: 1; } .whatsapp { background: #00BF3C none repeat scroll 0 0; box-shadow: 0 4px 12px 0 rgb(0 0 0 / 15%); bottom: 180px; font-size: 20px; height: 40px; line-height: 40px; position: fixed; right: 30px; text-align: center; transition: all 0.3s ease 0s; border-radius: 50%; width: 40px; color: #fff; cursor: pointer; z-index: 1; } .whatsapp i { color: #fff; font-size: 30px; height: 40px; line-height: 40px; } .messenger i { color: #fff; font-size: 30px; height: 40px; line-height: 40px; } @media (min-width: 992px) { .footer-top-area .col-lg-3:last-child { margin-top: 0px !important; } } @media (max-width: 991px) { .xspd0 { padding: 0; } .footerBottom { text-align: left; flex-wrap: wrap; flex-direction: column-reverse; padding: 0; } .footerBottom .copyright_info { flex: 0 0 100%; width: 100%; margin-bottom: 20px; } .footerBottom .widget-icon { flex: 0 0 100%; width: 100%; padding: 20px 0; } .footerTopMessLeft { font-size: 40px; font-weight: normal; color: #ffffff; line-height: 50px; } .footerTopMessRight { padding: 20px 0 30px; width: 100%; } .footerInput .footerInputBtn { padding: 0 16px; } .footer-top { padding: 30px 0 10px; } .footer-top-area { padding: 30px 0; } .footer-company-info { margin-bottom: 20px; } .footer-company-info i { margin-bottom: 10px; } ul.footer-contact li:last-child { margin: 0; padding: 0; } .footer-top-area .col-lg-3 { margin-bottom: 30px; } .footer-top-area .col-lg-3:last-child { margin-bottom: 0px; } .footer-bottom-area { text-align: center; } } .messageTip { min-width: 380px; box-sizing: border-box; border-radius: 4px; border: 1px solid #ebeef5; position: fixed; left: 50%; top: 20px; transform: translateX(-50%); background-color: #edf2fc; overflow: hidden; padding: 15px 15px 15px 20px; display: flex; align-items: center; z-index: 2022; opacity: 0; visibility: hidden; } .messShow3s { animation: show3s 3s; animation-iteration-count: 1; } .messageTip i { margin-right: 10px; } .messageError { background-color: #fef0f0; border-color: #fde2e2; color: #f56c6c; } .messageError i { color: #f56c6c; } .messageSuccess { background-color: #f0f9eb; border-color: #e1f3d8; color: #67c23a; } .messageSuccess i { color: #67c23a; } @keyframes show3s { 0% { top: 10px; opacity: 0; } 5% { top: 20px; opacity: 1; visibility: visible; } 95% { top: 20px; opacity: 1; visibility: visible; } 100% { top: 10px; opacity: 0; } }