Files
damuyunHome/css/ainong/style.css

3283 lines
59 KiB
CSS
Raw Normal View History

2024-07-04 15:22:53 +08:00
/* Template Name: Crezo - Multipurpose Template
Author: Themesdesign
Version: 1.0.0
Updated: April 2021
File Description: Main Css file of the template
*/
/*********************************/
/* INDEX */
/*================================
* 01. Variables *
* 02. Bootstrap Custom *
* 03. Components *
* 04. General *
* 05. Helper *
* 06. Menu *
* 07. Home / Landing *
* 08. About *
* 09. Services *
* 11. C.T.A *
* 14. Work / Portfolio *
* 14. Team *
* 14. Testimonial *
* 15. Blog / News *
* 16. Maintenance *
* 17. Contact *
* 18. Footer *
================================*/
@import url("https://fonts.googleapis.com/css?family=Montserrat:400,500,600,700|Open+Sans&display=swap");
h1 {
font-size: 42px;
}
h2 {
font-size: 36px;
}
h3 {
font-size: 30px;
}
h4 {
font-size: 24px;
}
h5 {
font-size: 18px;
}
h6 {
font-size: 14px;
}
.bg-primary {
background-color: #4782d3 !important;
}
.text-primary {
color: #4782d3 !important;
}
a.text-primary:hover {
color: #3274ce !important;
}
.bg-secondary {
background-color: #838c97 !important;
}
.text-secondary {
color: #838c97 !important;
}
a.text-secondary:hover {
color: #757f8b !important;
}
.bg-success {
background-color: #28a745 !important;
}
.text-success {
color: #28a745 !important;
}
a.text-success:hover {
color: #23923d !important;
}
.bg-warning {
background-color: #ffc107 !important;
}
.text-warning {
color: #ffc107 !important;
}
a.text-warning:hover {
color: #edb100 !important;
}
.bg-info {
background-color: #17a2b8 !important;
}
.text-info {
color: #17a2b8 !important;
}
a.text-info:hover {
color: #148ea1 !important;
}
.bg-danger {
background-color: #dc3545 !important;
}
.text-danger {
color: #dc3545 !important;
}
a.text-danger:hover {
color: #d32535 !important;
}
.bg-dark {
background-color: #35404e !important;
}
.text-dark {
color: #35404e !important;
}
a.text-dark:hover {
color: #2b343f !important;
}
.bg-muted {
background-color: #707070 !important;
}
.text-muted {
color: #707070 !important;
}
.text-mutedAbout {
color: rgba(255, 255, 255, 0.6) !important; line-height: 2;
}
a.text-muted:hover {
color: #636363 !important;
}
.bg-light {
background-color: #f8f9fa !important;
}
.text-light {
color: #f8f9fa !important;
}
a.text-light:hover {
color: #e9ecef !important;
}
.bg-navy {
background-color: #243b55 !important;
}
.text-navy {
color: #243b55 !important;
}
a.text-navy:hover {
color: #1c2f43 !important;
}
.bg-custom {
background-color: #a3c85e !important;
}
.text-custom {
color: #a3c85e !important;
}
a.text-custom:hover {
color: #98c24b !important;
}
.list-inline-item:not(:last-child) {
margin-right: 0px;
margin-bottom: 0px;
}
.rounded {
border-radius: 5px !important;
}
.rounded-top {
border-top-left-radius: 5px !important;
border-top-right-radius: 5px !important;
}
.rounded-left {
border-top-left-radius: 5px !important;
border-bottom-left-radius: 5px !important;
}
.rounded-bottom {
border-bottom-left-radius: 5px !important;
border-bottom-right-radius: 5px !important;
}
.rounded-right {
border-top-right-radius: 5px !important;
border-bottom-right-radius: 5px !important;
}
.display-1 {
font-size: 80px !important;
}
.display-2 {
font-size: 72px !important;
}
.display-3 {
font-size: 64px !important;
}
.display-4 {
font-size: 56px !important;
}
@media (max-width: 768px) {
.display-1 {
font-size: 56px !important;
}
.display-2 {
font-size: 50px !important;
}
.display-3 {
font-size: 42px !important;
}
.display-4 {
font-size: 36px !important;
}
}
.small, small {
font-size: 90%;
}
.modal-open {
padding-right: 0 !important;
}
.btn-primary {
background-color: #4782d3 !important;
border: 1px solid #4782d3 !important;
color: #ffffff !important;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .btn-primary.focus {
background-color: #2d68ba !important;
border-color: #2d68ba !important;
color: #ffffff !important;
}
.btn-outline-primary {
border: 1px solid #4782d3;
color: #4782d3;
background-color: transparent;
}
.btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary.focus, .btn-outline-primary:not(:disabled):not(.disabled):active {
background-color: #4782d3;
border-color: #4782d3;
color: #ffffff;
}
.btn-secondary {
background-color: #838c97 !important;
border: 1px solid #838c97 !important;
color: #ffffff !important;
}
.btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active, .btn-secondary.active, .btn-secondary.focus {
background-color: #69727e !important;
border-color: #69727e !important;
color: #ffffff !important;
}
.btn-outline-secondary {
border: 1px solid #838c97;
color: #838c97;
background-color: transparent;
}
.btn-outline-secondary:hover, .btn-outline-secondary:focus, .btn-outline-secondary:active, .btn-outline-secondary.active, .btn-outline-secondary.focus, .btn-outline-secondary:not(:disabled):not(.disabled):active {
background-color: #838c97;
border-color: #838c97;
color: #ffffff;
}
.btn-success {
background-color: #28a745 !important;
border: 1px solid #28a745 !important;
color: #ffffff !important;
}
.btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success.active, .btn-success.focus {
background-color: #1e7e34 !important;
border-color: #1e7e34 !important;
color: #ffffff !important;
}
.btn-outline-success {
border: 1px solid #28a745;
color: #28a745;
background-color: transparent;
}
.btn-outline-success:hover, .btn-outline-success:focus, .btn-outline-success:active, .btn-outline-success.active, .btn-outline-success.focus, .btn-outline-success:not(:disabled):not(.disabled):active {
background-color: #28a745;
border-color: #28a745;
color: #ffffff;
}
.btn-warning {
background-color: #ffc107 !important;
border: 1px solid #ffc107 !important;
color: #ffffff !important;
}
.btn-warning:hover, .btn-warning:focus, .btn-warning:active, .btn-warning.active, .btn-warning.focus {
background-color: #d39e00 !important;
border-color: #d39e00 !important;
color: #ffffff !important;
}
.btn-outline-warning {
border: 1px solid #ffc107;
color: #ffc107;
background-color: transparent;
}
.btn-outline-warning:hover, .btn-outline-warning:focus, .btn-outline-warning:active, .btn-outline-warning.active, .btn-outline-warning.focus, .btn-outline-warning:not(:disabled):not(.disabled):active {
background-color: #ffc107;
border-color: #ffc107;
color: #ffffff;
}
.btn-info {
background-color: #17a2b8 !important;
border: 1px solid #17a2b8 !important;
color: #ffffff !important;
}
.btn-info:hover, .btn-info:focus, .btn-info:active, .btn-info.active, .btn-info.focus {
background-color: #117a8b !important;
border-color: #117a8b !important;
color: #ffffff !important;
}
.btn-outline-info {
border: 1px solid #17a2b8;
color: #17a2b8;
background-color: transparent;
}
.btn-outline-info:hover, .btn-outline-info:focus, .btn-outline-info:active, .btn-outline-info.active, .btn-outline-info.focus, .btn-outline-info:not(:disabled):not(.disabled):active {
background-color: #17a2b8;
border-color: #17a2b8;
color: #ffffff;
}
.btn-danger {
background-color: #dc3545 !important;
border: 1px solid #dc3545 !important;
color: #ffffff !important;
}
.btn-danger:hover, .btn-danger:focus, .btn-danger:active, .btn-danger.active, .btn-danger.focus {
background-color: #bd2130 !important;
border-color: #bd2130 !important;
color: #ffffff !important;
}
.btn-outline-danger {
border: 1px solid #dc3545;
color: #dc3545;
background-color: transparent;
}
.btn-outline-danger:hover, .btn-outline-danger:focus, .btn-outline-danger:active, .btn-outline-danger.active, .btn-outline-danger.focus, .btn-outline-danger:not(:disabled):not(.disabled):active {
background-color: #dc3545;
border-color: #dc3545;
color: #ffffff;
}
.btn-dark {
background-color: #35404e !important;
border: 1px solid #35404e !important;
color: #ffffff !important;
}
.btn-dark:hover, .btn-dark:focus, .btn-dark:active, .btn-dark.active, .btn-dark.focus {
background-color: #202730 !important;
border-color: #202730 !important;
color: #ffffff !important;
}
.btn-outline-dark {
border: 1px solid #35404e;
color: #35404e;
background-color: transparent;
}
.btn-outline-dark:hover, .btn-outline-dark:focus, .btn-outline-dark:active, .btn-outline-dark.active, .btn-outline-dark.focus, .btn-outline-dark:not(:disabled):not(.disabled):active {
background-color: #35404e;
border-color: #35404e;
color: #ffffff;
}
.btn-muted {
background-color: #707070 !important;
border: 1px solid #707070 !important;
color: #ffffff !important;
}
.btn-muted:hover, .btn-muted:focus, .btn-muted:active, .btn-muted.active, .btn-muted.focus {
background-color: #575757 !important;
border-color: #575757 !important;
color: #ffffff !important;
}
.btn-outline-muted {
border: 1px solid #707070;
color: #707070;
background-color: transparent;
}
.btn-outline-muted:hover, .btn-outline-muted:focus, .btn-outline-muted:active, .btn-outline-muted.active, .btn-outline-muted.focus, .btn-outline-muted:not(:disabled):not(.disabled):active {
background-color: #707070;
border-color: #707070;
color: #ffffff;
}
.btn-light {
background-color: #f8f9fa !important;
border: 1px solid #f8f9fa !important;
color: #ffffff !important;
}
.btn-light:hover, .btn-light:focus, .btn-light:active, .btn-light.active, .btn-light.focus {
background-color: #dae0e5 !important;
border-color: #dae0e5 !important;
color: #ffffff !important;
}
.btn-outline-light {
border: 1px solid #f8f9fa;
color: #f8f9fa;
background-color: transparent;
}
.btn-outline-light:hover, .btn-outline-light:focus, .btn-outline-light:active, .btn-outline-light.active, .btn-outline-light.focus, .btn-outline-light:not(:disabled):not(.disabled):active {
background-color: #f8f9fa;
border-color: #f8f9fa;
color: #ffffff;
}
.btn-navy {
background-color: #243b55 !important;
border: 1px solid #243b55 !important;
color: #ffffff !important;
}
.btn-navy:hover, .btn-navy:focus, .btn-navy:active, .btn-navy.active, .btn-navy.focus {
background-color: #152231 !important;
border-color: #152231 !important;
color: #ffffff !important;
}
.btn-outline-navy {
border: 1px solid #243b55;
color: #243b55;
background-color: transparent;
}
.btn-outline-navy:hover, .btn-outline-navy:focus, .btn-outline-navy:active, .btn-outline-navy.active, .btn-outline-navy.focus, .btn-outline-navy:not(:disabled):not(.disabled):active {
background-color: #243b55;
border-color: #243b55;
color: #ffffff;
}
.btn-custom {
background-color: #a3c85e !important;
border: 1px solid #a3c85e !important;
color: #ffffff !important;
}
.btn-custom:hover, .btn-custom:focus, .btn-custom:active, .btn-custom.active, .btn-custom.focus {
background-color: #8cb53e !important;
border-color: #8cb53e !important;
color: #ffffff !important;
}
.btn-outline-custom {
border: 1px solid #a3c85e;
color: #a3c85e;
background-color: transparent;
}
.btn-outline-custom:hover, .btn-outline-custom:focus, .btn-outline-custom:active, .btn-outline-custom.active, .btn-outline-custom.focus, .btn-outline-custom:not(:disabled):not(.disabled):active {
background-color: #a3c85e;
border-color: #a3c85e;
color: #ffffff;
}
.btn {
padding: 9px 27px;
outline: none;
text-decoration: none;
font-size: 13px;
letter-spacing: 0.7px;
transition: all 0.3s;
font-weight: 400;
border-radius: 5px;
text-transform: uppercase;
}
.btn:focus {
box-shadow: none !important;
}
.btn.btn-sm {
padding: 7px 16px;
font-size: 10px;
}
.btn.btn-lg {
padding: 14px 30px;
font-size: 16px;
}
.btn.searchbtn {
padding: 6px 20px;
}
.btn.btn-light {
color: #35404e !important;
background: #f8f9fa;
border: 1px solid #dee2e6;
}
.btn.btn-light:hover, .btn.btn-light:focus, .btn.btn-light:active, .btn.btn-light.active, .btn.btn-light.focus {
background-color: #dae0e5 !important;
color: #35404e;
}
.btn.btn-outline-light {
border: 1px solid #dee2e6;
color: #35404e !important;
background-color: transparent;
}
.btn.btn-outline-light:hover, .btn.btn-outline-light:focus, .btn.btn-outline-light:active, .btn.btn-outline-light.active, .btn.btn-outline-light.focus {
background-color: #f8f9fa;
}
button:not(:disabled) {
outline: none;
}
.alert-primary {
background-color: #3f7cd1;
color: #ffffff;
border-color: #4782d3;
}
.alert-primary .alert-link {
color: #193a68;
}
.alert-outline-primary {
background-color: #ffffff;
color: #4782d3;
border-color: #4782d3;
}
.alert-secondary {
background-color: #7d8792;
color: #ffffff;
border-color: #838c97;
}
.alert-secondary .alert-link {
color: #3b4046;
}
.alert-outline-secondary {
background-color: #ffffff;
color: #838c97;
border-color: #838c97;
}
.alert-success {
background-color: #269f42;
color: #ffffff;
border-color: #28a745;
}
.alert-success .alert-link {
color: #0a2c12;
}
.alert-outline-success {
background-color: #ffffff;
color: #28a745;
border-color: #28a745;
}
.alert-warning {
background-color: #fcbd00;
color: #ffffff;
border-color: #ffc107;
}
.alert-warning .alert-link {
color: #6d5200;
}
.alert-outline-warning {
background-color: #ffffff;
color: #ffc107;
border-color: #ffc107;
}
.alert-info {
background-color: #169aaf;
color: #ffffff;
border-color: #17a2b8;
}
.alert-info .alert-link {
color: #062a30;
}
.alert-outline-info {
background-color: #ffffff;
color: #17a2b8;
border-color: #17a2b8;
}
.alert-danger {
background-color: #da2c3d;
color: #ffffff;
border-color: #dc3545;
}
.alert-danger .alert-link {
color: #66121a;
}
.alert-outline-danger {
background-color: #ffffff;
color: #dc3545;
border-color: #dc3545;
}
.alert-dark {
background-color: #313b48;
color: #ffffff;
border-color: #35404e;
}
.alert-dark .alert-link {
color: black;
}
.alert-outline-dark {
background-color: #ffffff;
color: #35404e;
border-color: #35404e;
}
.alert-muted {
background-color: #6b6b6b;
color: #ffffff;
border-color: #707070;
}
.alert-muted .alert-link {
color: #242424;
}
.alert-outline-muted {
background-color: #ffffff;
color: #707070;
border-color: #707070;
}
.alert-light {
background-color: #f2f4f6;
color: #ffffff;
border-color: #f8f9fa;
}
.alert-light .alert-link {
color: #9fadba;
}
.alert-outline-light {
background-color: #ffffff;
color: #f8f9fa;
border-color: #f8f9fa;
}
.alert-navy {
background-color: #21364e;
color: #ffffff;
border-color: #243b55;
}
.alert-navy .alert-link {
color: black;
}
.alert-outline-navy {
background-color: #ffffff;
color: #243b55;
border-color: #243b55;
}
.alert-custom {
background-color: #9fc556;
color: #ffffff;
border-color: #a3c85e;
}
.alert-custom .alert-link {
color: #516924;
}
.alert-outline-custom {
background-color: #ffffff;
color: #a3c85e;
border-color: #a3c85e;
}
.alert {
padding: 6px 15px;
border-radius: 5px;
font-size: 14px;
}
.alert.alert-light {
background-color: #f8f9fa;
color: #35404e;
border-color: #dee2e6;
}
.alert.alert-pills {
border-radius: 30px;
display: inline-block;
}
.alert.alert-dismissible {
padding-right: 30px;
}
.alert.alert-dismissible .close {
top: -5px;
right: -10px;
font-size: 16px !important;
}
.shadow {
box-shadow: 0 0 5px rgba(0, 0, 0, 0.15) !important;
}
.border {
border: 1px solid #e9ecef !important;
}
.border-top {
border-top: 1px solid #e9ecef !important;
}
.border-bottom {
border-bottom: 1px solid #e9ecef !important;
}
.border-left {
border-left: 1px solid #e9ecef !important;
}
.border-right {
border-right: 1px solid #e9ecef !important;
}
.badge-primary {
background-color: #4782d3 !important;
color: #ffffff !important;
}
.badge-outline-primary {
background-color: transparent !important;
color: #4782d3 !important;
border: 1px solid #4782d3 !important;
}
.badge-secondary {
background-color: #838c97 !important;
color: #ffffff !important;
}
.badge-outline-secondary {
background-color: transparent !important;
color: #838c97 !important;
border: 1px solid #838c97 !important;
}
.badge-success {
background-color: #28a745 !important;
color: #ffffff !important;
}
.badge-outline-success {
background-color: transparent !important;
color: #28a745 !important;
border: 1px solid #28a745 !important;
}
.badge-warning {
background-color: #ffc107 !important;
color: #ffffff !important;
}
.badge-outline-warning {
background-color: transparent !important;
color: #ffc107 !important;
border: 1px solid #ffc107 !important;
}
.badge-info {
background-color: #17a2b8 !important;
color: #ffffff !important;
}
.badge-outline-info {
background-color: transparent !important;
color: #17a2b8 !important;
border: 1px solid #17a2b8 !important;
}
.badge-danger {
background-color: #dc3545 !important;
color: #ffffff !important;
}
.badge-outline-danger {
background-color: transparent !important;
color: #dc3545 !important;
border: 1px solid #dc3545 !important;
}
.badge-dark {
background-color: #35404e !important;
color: #ffffff !important;
}
.badge-outline-dark {
background-color: transparent !important;
color: #35404e !important;
border: 1px solid #35404e !important;
}
.badge-muted {
background-color: #707070 !important;
color: #ffffff !important;
}
.badge-outline-muted {
background-color: transparent !important;
color: #707070 !important;
border: 1px solid #707070 !important;
}
.badge-light {
background-color: #f8f9fa !important;
color: #ffffff !important;
}
.badge-outline-light {
background-color: transparent !important;
color: #f8f9fa !important;
border: 1px solid #f8f9fa !important;
}
.badge-navy {
background-color: #243b55 !important;
color: #ffffff !important;
}
.badge-outline-navy {
background-color: transparent !important;
color: #243b55 !important;
border: 1px solid #243b55 !important;
}
.badge-custom {
background-color: #a3c85e !important;
color: #ffffff !important;
}
.badge-outline-custom {
background-color: transparent !important;
color: #a3c85e !important;
border: 1px solid #a3c85e !important;
}
.badge {
padding: 5px 8px;
border-radius: 3px;
letter-spacing: 0.5px;
font-size: 12px;
font-weight: 500;
}
.badge.badge-light {
color: #35404e !important;
background-color: #f8f9fa !important;
}
.badge.badge-outline-light {
color: #35404e !important;
border: 1px solid #bdc6d0 !important;
background-color: transparent !important;
}
.badge:focus, .badge.focus {
box-shadow: none !important;
}
.badge.badge-pill {
border-radius: 10px;
}
.nav-pills .nav-link {
color: #35404e !important;
margin: auto 15px;
border: 1px solid #dee2e6;
padding: 5px;
}
.nav-pills .nav-link.active {
background-color: #a3c85e;
color: #ffffff !important;
border-color: #a3c85e !important;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.nav-pills a .title {
font-size: 16px;
}
.page-next-level .page-next {
letter-spacing: 0.5px;
}
.page-next-level .page-next li {
margin-right: 5px;
}
.page-next-level .page-next li:after {
content: "\f0142";
font-size: 13px;
color: #ffffff;
font-family: 'Material Design Icons';
}
.page-next-level .page-next li:last-child {
margin-right: 0;
}
.page-next-level .page-next li:last-child:after {
display: none;
}
.page-next-level .page-next li a,
.page-next-level .page-next li span {
font-size: 12px;
padding-right: 8px;
transition: all 0.5s ease;
font-weight: 500;
}
.page-next-level .page-next li a:hover {
color: #a3c85e !important;
}
.page-next-level .page-next li span:last-child {
padding-right: 0px;
}
.avatar.avatar-ex-sm {
height: 36px;
width: 36px;
}
.avatar.avatar-small {
height: 70px;
width: 70px;
}
.avatar.avatar-medium {
height: 110px;
width: 110px;
}
.avatar.avatar-large {
height: 140px;
width: 140px;
}
.faq-container .question {
font-size: 20px;
}
.faq-content .card {
border-radius: 12px !important;
}
.faq-content .card .faq .card-header {
padding-right: 40px !important;
}
.faq-content .card .faq .card-header.card-header-2 {
border-bottom: 0;
}
.faq-content .card a.faq[data-toggle=collapse] {
background-color: #ffffff;
color: #a3c85e;
transition: all 0.5s;
}
.faq-content .card a.faq[data-toggle=collapse]:before {
content: '\F0143';
display: block;
font-family: 'Material Design Icons';
font-size: 18px;
color: #35404e;
position: absolute;
right: 20px;
top: 50%;
transform: translateY(-50%);
transition: all 0.5s ease;
color: #a3c85e;
}
.faq-content .card a.faq[data-toggle=collapse].collapsed {
background-color: #ffffff;
color: #35404e;
transition: all 0.5s;
}
.faq-content .card a.faq[data-toggle=collapse].collapsed:before {
top: 15px;
transform: rotate(180deg);
color: #35404e;
}
.faq-content .card .faq-question {
font-size: 16px;
}
.pagination {
font-size: 14px;
}
.pagination li:first-child a {
border-left-width: 1px !important;
border-radius: 5px 0 0 5px;
}
.pagination li:last-child a {
border-radius: 0 5px 5px 0;
}
.pagination li a {
float: left;
color: #35404e;
border: 1px solid #e9ecef;
border-left-width: 0 !important;
background: #ffffff;
}
.pagination li a:hover {
color: #a3c85e;
background: #e9ecef;
border-color: #e9ecef;
}
.pagination .active a {
color: #ffffff !important;
background: #a3c85e !important;
border-color: #a3c85e !important;
cursor: not-allowed;
}
.pagination.pagination-radious > li {
margin: auto 3px;
}
.pagination.pagination-radious > li > a {
border: 1px solid #e9ecef !important;
}
.pager .disabled > a,
.pager .disabled > a:focus,
.pager .disabled > a:hover {
color: #35404e !important;
cursor: not-allowed;
background: #ffffff;
}
.pager a {
transition: all 0.5s ease;
}
.pager a:hover {
color: #ffffff !important;
background: #a3c85e;
}
.progress-box .title {
font-size: 15px !important;
}
.progress-box .progress {
height: 9px;
overflow: visible;
background: #eff1f4;
}
.progress-box .progress .progress-bar {
height: 4px;
border-radius: 10px;
margin: auto 5px;
animation: animate-positive 3s;
overflow: visible !important;
}
.progress-box .progress .progress-value {
position: absolute;
top: -25px;
right: -15px;
font-size: 13px;
}
@keyframes animate-positive {
0% {
width: 0;
}
}
.progress-box.skill-data {
width: 130px;
height: 130px;
}
.progress-box.skill-data canvas {
position: absolute;
top: 0;
left: 0;
width: 130px;
height: 130px;
}
.progress-box .pie-chart-value {
line-height: 130px;
font-size: 20px;
}
.form-group {
margin-bottom: 20px;
}
.form-group label {
font-size: 14px;
font-weight: 700;
}
.form-group img {
position: absolute;
top: 5px;
left: 5px;
}
.form-group .form-control {
box-shadow: none;
border: 2px solid #e9ecef;
height: 42px;
font-size: 13px;
border-radius: 5px;
transition: all 0.5s ease;
}
.form-group .form-control:focus, .form-group .form-control.active {
border-color: #a3c85e;
}
.form-group textarea {
height: 120px !important;
}
.form-group textarea.form-control {
line-height: 25px;
}
.form-control:disabled, .form-control[readonly] {
background-color: transparent;
opacity: 1;
}
.custom-control-input:checked ~ .custom-control-label:before {
color: #ffffff;
border-color: #a3c85e;
background-color: #a3c85e;
}
.custom-control-input:focus ~ .custom-control-label::before,
.form-control:focus {
box-shadow: none;
border-color: #a3c85e;
}
.custom-control-input:not(:disabled):active ~ .custom-control-label::before {
background-color: rgba(163, 200, 94, 0.3) !important;
border-color: rgba(163, 200, 94, 0.3) !important;
}
.custom-control-label {
cursor: pointer;
}
.custom-control-label:before, .custom-control-label:after {
top: 2px;
}
.custom-switch .custom-control-label:after {
top: 4px;
}
.blockquote {
font-size: 16px;
}
.blockquote.blockquote-2 {
border-left: 8px solid #e9ecef;
}
.blockquote.blockquote-2:before {
content: "\201C";
color: #e9ecef;
font-size: 80px;
position: absolute;
left: 20px;
top: -10px;
}
.blockquote.blockquote-2:after {
content: '';
}
.blockquote.blockquote-3 {
border-left: 8px solid #a3c85e;
}
.blockquote.blockquote-5 {
border-right: 8px solid #e9ecef;
}
/******BOXED*********/
.boxed-element .boxed-style-1,
.boxed-element .boxed-style-hover-one,
.boxed-element .boxed-style-scall,
.boxed-element .boxed-style-float,
.boxed-element .boxed-style-hover {
transition: all 0.5s ease;
}
.boxed-element .boxed-style-hover:hover {
background-color: #a3c85e !important;
color: #ffffff;
}
.boxed-element .boxed-style-hover-one:hover {
box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.boxed-element .boxed-style-scall:hover {
transform: scale(1.05);
}
.boxed-element .boxed-style-float:hover {
transform: translateX(-35px);
}
.dropcap {
position: relative;
top: 4px;
float: left;
margin-right: 10px;
padding: 0;
line-height: 52px;
font-size: 60px;
text-transform: uppercase;
}
.dropcap.d-boxed, .dropcap.d-circle {
height: 80px;
width: 80px;
line-height: 80px;
}
.icon-list-demo div {
cursor: pointer;
line-height: 45px;
white-space: nowrap;
text-overflow: ellipsis;
display: block;
font-size: 14px;
overflow: hidden;
}
.icon-list-demo div:hover {
color: #a3c85e;
}
.icon-list-demo div:hover i {
font-size: 30px;
text-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.icon-list-demo i {
text-align: center;
vertical-align: middle;
font-size: 24px;
width: 50px;
height: 50px;
line-height: 50px;
margin-right: 12px;
color: #35404e;
border-radius: 3px;
display: inline-block;
transition: all 0.2s;
font-weight: 600;
}
.subcribe-form input {
padding: 14px 150px 14px 20px;
width: 100%;
color: #35404e !important;
border: none;
outline: none !important;
background-color: rgba(255, 255, 255, 0.8);
}
.subcribe-form button {
position: absolute;
top: 6px;
right: 6px;
outline: none !important;
}
.subcribe-form form {
position: relative;
max-width: 600px;
margin: 0px auto;
}
#preloader {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: linear-gradient(45deg, #ffffff, #ffffff);
z-index: 9999999;
}
#preloader #status {
position: absolute;
left: 0;
right: 0;
top: 50%;
transform: translateY(-50%);
}
#preloader #status .spinner {
width: 40px;
height: 40px;
position: relative;
margin: 20px auto;
}
#preloader #status .spinner .double-bounce1,
#preloader #status .spinner .double-bounce2 {
width: 100%;
height: 100%;
border-radius: 50%;
background-color: #35404e;
opacity: 0.8;
position: absolute;
top: 0;
left: 0;
animation: sk-bounce 2.0s infinite ease-in-out;
}
#preloader #status .spinner .double-bounce2 {
animation-delay: -1.0s;
}
@keyframes sk-bounce {
0%, 100% {
transform: scale(0);
}
50% {
transform: scale(1);
}
}
.social-icon li{ position: relative;}
.social-icon li .ewm{display: none; width: 117px; height: 117px; border-radius: 6px; overflow: hidden;position: absolute;top:-36px; left: 0;z-index: 99;}
.social-icon li:hover .ewm{display: block; }
.social-icon li a {
color: #35404e;
border: 1px solid #35404e;
display: inline-block;
height: 32px;
text-align: center;
font-size: 15px;
width: 32px;
line-height: 32px;
transition: all 0.4s ease;
overflow: hidden;
position: relative;
}
.social-icon li a:hover {
background-color: #a3c85e;
border-color: #a3c85e !important;
color: #ffffff !important;
}
.social-icon.social li a {
color: #adb5bd;
/* border-color: #adb5bd; */
}
.back-to-top {
z-index: 99;
position: fixed;
bottom: 30px;
right: 30px;
width: 33px;
height: 33px;
line-height: 33px;
display: none;
color: #35404e;
background-color: #ced4da;
transition: all 0.5s ease;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.back-to-top i {
font-size: 18px;
}
.back-to-top:hover {
background-color: #a3c85e;
color: #ffffff;
}
.back-to-home {
position: absolute;
top: 4%;
right: 2%;
z-index: 1;
}
.back-to-home a {
font-size: 22px;
width: 40px;
height: 40px;
line-height: 40px;
background: #a3c85e;
}
.timeline-page .timeline-item .date-label-left,
.timeline-page .timeline-item .duration-right {
font-weight: 500;
background-color: #f8f9fa;
}
.timeline-page .timeline-item .date-label-left:after,
.timeline-page .timeline-item .duration-right:after {
border: 2px solid #dee2e6;
content: "";
position: absolute;
top: 5px;
width: 10px;
height: 10px;
border-radius: 50%;
z-index: 1;
background-color: #a3c85e;
transform: rotate(45deg);
}
.timeline-page .timeline-item .date-label-left:after {
right: -37px;
}
.timeline-page .timeline-item .duration-right:after {
left: -37px;
}
.timeline-page:after {
background-color: #ced4da !important;
content: "";
height: 95%;
left: 0;
margin: auto;
position: absolute;
right: 0;
top: 0;
width: 2px;
}
.video-box iframe {
width: 100%;
position: relative;
padding: 0;
height: 300px;
border: none;
}
.grids .inner-grid {
background-color: rgba(112, 112, 112, 0.15);
margin-bottom: 10px;
padding: 10px 20px;
}
.history .history-box {
z-index: 1;
transition: all 0.3s ease;
}
.history .history-box:after {
content: "";
left: -30px;
width:1px;
background: #aece71;
position: absolute;
top: 20px;
bottom: -30px;
z-index: -1;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.history .history-box:last-child {
margin-bottom: 0px;
}
.history .history-box:last-child:after {
display: none;
margin-bottom: 0px;
}
.history .history-box .icon {
width: 25px;
height:25px;
line-height: 45px;
position: absolute;
left: -41px;
top: 1px;
border: 7px solid #ffffff;
border-radius: 100px;
}
.historybox{box-shadow: 0 2px 20px rgb(174 185 204 / 24%); border-radius: 10px;}
.history .history-box label {
font-size: 14px !important;
margin: 0px 0 10px -33px;
height: 46px;
line-height: 46px;
}
.history .history-box span {
font-size: 14px;
vertical-align: top;
}
.history .history-box .history-box-icon i {
position: absolute;
font-size: 150px;
top: 3px;
right: 30px;
z-index: -1;
opacity: 0;
transition: all 0.5s ease;
}
.history .history-box:hover .history-box-icon i {
opacity: 0.1;
}
@media only screen and (min-width: 250px) and (max-width: 767px) {
.timeline-page:after {
margin: 0;
}
.timeline-item .duration {
float: left !important;
margin: 0 0 30px 15px !important;
text-align: left !important;
position: relative;
}
.timeline-item .duration:after {
left: -20px !important;
}
.timeline-item .duration .event {
text-align: left !important;
margin-left: 15px;
}
.timeline-page .timeline-item .event-description-left {
text-align: left !important;
margin: 0 0 0 15px;
}
}
@media print {
#topnav,
.footer {
display: none !important;
}
}
body {
font-family: "Open Sans", sans-serif;
overflow-x: hidden !important;
font-size: 15px;
color: #35404e;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
font-family: "Montserrat", sans-serif;
line-height: 1.5;
font-weight: 600;
}
a {
text-decoration: none !important;
}
::selection {
background: #3f4c5d;
color: #ffffff;
}
p {
line-height: 1.6;
}
.section {
padding: 100px 0;
position: relative;
}
.section-two {
padding: 60px 0;
position: relative;
}
.bg-overlay {
background-color: rgba(37, 41, 52, 0.7);
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
width: 100%;
height: 100%;
}
.bg-overlay-custom {
background-image: linear-gradient(135deg, #a3c85e, #4782d3, #a3c85e);
opacity: 0.6;
}
.title-heading {
line-height: 26px;
}
.title-heading .heading {
font-size: 42px;
letter-spacing: 1px;
}
.title-heading .para-desc {
font-size: 16px;
}
.section-title {
position: relative;
}
.section-title .title {
letter-spacing: 0.5px;
font-size: 24px;
}
.para-desc {
max-width: 700px;
}
.mt-100 {
margin-top: 100px;
}
.mb-60 {
margin-bottom: 60px;
}
.mover {
animation: mover 1s infinite alternate;
}
@keyframes mover {
0% {
transform: translateY(0);
}
100% {
transform: translateY(5px);
}
}
@media (min-width: 768px) {
.margin-top-100 {
margin-top: 100px;
}
.margin-top-100 .heading {
font-size: 35px;
}
}
@media (max-width: 768px) {
.section {
padding: 60px 0;
width: 100%;
}
.section img{ width: 100%;}
.title-heading .heading {
font-size: 32px !important;
}
.section-title .title {
font-size: 24px;
}
.mt-60 {
margin-top: 60px;
}
}
.tagline {
position: absolute;
background: #35404e;
font-size: 13px;
width: 100%;
z-index: 99;
}
.tagline .phone {
vertical-align: top;
margin-right: 20px;
padding: 11px 0;
font-size: 15px;
}
.tagline .phone a {
transition: all 0.5s ease;
}
.tagline .phone a:hover {
color: #a3c85e !important;
}
.tagline .phone i {
margin-right: 8px;
}
.tagline .top_socials li {
width: 30px;
vertical-align: top;
}
.tagline .top_socials li a {
display: block;
line-height: 40px;
transition: all 0.5s ease;
font-size: 15px;
padding: 2px 0;
}
.tagline .top_socials li a:hover {
color: #a3c85e !important;
}
#topnav {
position: fixed;
right: 0;
left: 0;
top: 0;
z-index: 1030;
/* background-color: #ffffff; */
/* background: rgba(255,255, 255, 0.9); */
background: rgba(0,0, 0, 0.5);
box-shadow: 0 0px 10px rgba(53, 64, 78, 0.3);
border: 0;
transition: all .5s ease;
min-height: 62px;
}
#topnav .navigation-menu {
float: right;
list-style: none;
margin: 0;
padding: 0;
}
#topnav .navigation-menu > li {
float: left;
display: block;
position: relative;
margin: 0 10px;
}
#topnav .navigation-menu > li > a {
display: block;
font-size: 13px;
/* color: #35404e; */
color: rgba(255, 255, 255, 0.9);
font-weight: 500;
text-transform: uppercase;
letter-spacing: 1px;
transition: all .3s ease;
line-height: 20px;
padding-left: 10px;
padding-right: 15px;
}
#topnav .navigation-menu > li:last-of-type > a {
padding-right: 0;
}
#topnav .navigation-menu > li .submenu li a i {
margin-right: 10px;
font-size: 14px;
}
#topnav .navigation-menu .dropdown {
margin-right: 0;
}
#topnav .logo {
float: left;
line-height: 70px;
transition: all .3s ease;
color: #35404e;
text-transform: uppercase;
font-weight: 700;
font-size: 24px;
}
#topnav .menu-extras {
float: right;
}
#topnav .has-submenu.active .submenu li.active > a {
color: #a3c85e;
}
#topnav .has-submenu.active a {
color: #a3c85e;
}
#topnav .has-submenu.active .menu-arrow {
border-color: #a3c85e;
}
#topnav .navbar-toggle {
border: 0;
position: relative;
padding: 0;
margin: 0;
cursor: pointer;
}
#topnav .navbar-toggle .lines {
width: 25px;
display: block;
position: relative;
margin: 28px auto;
height: 15px;
}
#topnav .navbar-toggle span {
height: 2px;
width: 100%;
background-color: #ffffff;
display: block;
margin-bottom: 5px;
transition: transform .5s ease;
}
#topnav .navbar-toggle span:last-child {
margin-bottom: 0;
}
#topnav .navbar-toggle.open span {
position: absolute;
}
#topnav .navbar-toggle.open span:first-child {
top: 6px;
transform: rotate(45deg);
}
#topnav .navbar-toggle.open span:nth-child(2) {
visibility: hidden;
}
#topnav .navbar-toggle.open span:last-child {
width: 100%;
top: 6px;
transform: rotate(-45deg);
}
#topnav .navbar-toggle.open span:hover {
background-color: #a3c85e;
}
.has-submenu {
position: relative;
}
#topnav .navbar-toggle:hover,
#topnav .navbar-toggle:focus,
#topnav .navigation-menu > li > a:hover,
#topnav .navigation-menu > li > a:focus {
background-color: transparent;
}
.menu-arrow,
.submenu-arrow {
position: absolute;
border: solid #35404e;
border-width: 0 1px 1px 0;
display: inline-block;
}
.menu-arrow {
padding: 2px;
transform: rotate(45deg);
right: -2px;
top: 33px;
}
.submenu-arrow {
padding: 3px;
transform: rotate(-45deg);
right: 20px;
top: 18px;
}
.search-bar {
background-color: rgba(53, 64, 78, 0.02) !important;
border: 2px solid #e9ecef !important;
box-shadow: none !important;
font-size: 14px;
height: 42px;
padding-left: 20px;
padding-right: 20px;
}
.btn-search {
display: none;
}
.dropdown-menu-search {
width: 270px;
padding: 15px;
border-top: 2px solid #a3c85e;
}
.noti-icon {
font-size: 12px !important;
}
.navigation-menu .dropdown-toggle::after {
display: none;
}
.navbar-sticky {
background-color: #ffffff;
}
.navbar-sticky.small.small {
top: 0px !important;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.15) !important;
}
@media (min-width: 992px) {
#topnav .navigation-menu > li > a {
padding-top: 25px;
padding-bottom: 25px;
min-height: 62px;
border-top: 2px solid transparent;
}
#topnav .navigation-menu > li.last-elements .submenu {
left: auto;
right: 0;
}
#topnav .navigation-menu > li.last-elements .submenu > li.has-submenu .submenu {
left: auto;
right: 100%;
margin-left: 0;
margin-right: 10px;
}
#topnav .navigation-menu > li .submenu {
position: absolute;
top: 100%;
left: 0;
z-index: 1000;
padding: 10px 0;
list-style: none;
min-width: 180px;
visibility: hidden;
opacity: 0;
margin-top: 10px;
transition: all .2s ease;
background-color: #ffffff;
box-shadow: 0 0 7px 0 rgba(53, 64, 78, 0.1);
border-top: 2px solid #a3c85e;
}
#topnav .navigation-menu > li .submenu.megamenu {
white-space: nowrap;
width: auto;
}
#topnav .navigation-menu > li .submenu.megamenu > li {
overflow: hidden;
width: 180px;
display: inline-block;
vertical-align: top;
}
#topnav .navigation-menu > li .submenu > li .submenu {
left: 100%;
top: 0;
margin-left: 10px;
margin-top: -1px;
}
#topnav .navigation-menu > li .submenu li {
position: relative;
}
#topnav .navigation-menu > li .submenu li ul {
list-style: none;
padding-left: 0;
margin: 0;
}
#topnav .navigation-menu > li .submenu li a {
display: block;
padding: 10px 20px;
clear: both;
white-space: nowrap;
font-size: 14px;
letter-spacing: 0.03em;
color: #35404e;
}
#topnav .navigation-menu > li:hover > a {
color: #a3c85e !important;
border-top: 2px solid #a3c85e;
}
#topnav .navigation-menu > li:hover > .menu-arrow {
border-color: #a3c85e;
}
#topnav .navbar-toggle {
display: none;
}
#topnav #navigation {
display: block !important;
}
#topnav.scroll-active .navigation-menu > li > a {
padding-top: 25px;
padding-bottom: 25px;
}
#topnav.scroll {
top: 0;
}
#topnav.scroll .navigation-menu > li > a {
padding-top: 20px;
padding-bottom: 20px;
}
#topnav .navigation-menu > li .submenu li a:hover,
#topnav .navigation-menu .has-submenu .submenu > li:hover > a {
color: #a3c85e;
}
}
@media (max-width: 991px) {
#topnav .container {
width: auto;
}
#topnav .navigation-menu {
float: none;
max-height: 400px;
}
#topnav .navigation-menu > li {
float: none;
}
#topnav .navigation-menu > li > a {
color: #35404e;
padding: 10px 20px;
}
#topnav .navigation-menu > li > a:after {
position: absolute;
right: 15px;
}
#topnav .navigation-menu > li .submenu {
display: none;
list-style: none;
padding-left: 20px;
margin: 0;
}
#topnav .navigation-menu > li .submenu li a {
display: block;
padding: 6px 15px;
clear: both;
white-space: nowrap;
font-size: 14px;
letter-spacing: 0.03em;
color: #35404e;
transition: all 0.3s;
}
#topnav .navigation-menu > li .submenu.open {
display: block;
}
#topnav .navigation-menu > li .submenu .submenu {
display: none;
list-style: none;
}
#topnav .navigation-menu > li .submenu .submenu.open {
display: block;
}
#topnav .navigation-menu > li .submenu.megamenu > li > ul {
list-style: none;
padding-left: 0;
}
#topnav .navigation-menu > li .submenu.megamenu > li > ul > li > span {
display: block;
position: relative;
padding: 10px 15px;
text-transform: uppercase;
font-size: 12px;
letter-spacing: 2px;
color: #35404e;
}
#topnav .navigation-menu .submenu.open .has-submenu.open > a {
color: #a3c85e;
}
#topnav .navbar-toggle span {
/* background-color: #35404e; */
background-color: rgba(255, 255, 255, 0.7)
}
#topnav .navbar-header {
float: left;
}
#topnav .logo {
padding: 11px 0;
}
#topnav .logo .logo-light {
display: none;
}
#topnav .logo .logo-dark {
display: block;
}
#topnav .has-submenu.active a {
color: #a3c85e;
}
.menu-arrow {
top: 15px;
right: 20px;
}
.submenu-arrow {
transform: rotate(45deg);
position: absolute;
right: 20px;
top: 12px;
}
.logo {
padding: 0 !important;
line-height: 0;
}
#topnav .navigation-menu > li > a:hover,
#topnav .navigation-menu > li .submenu li a:hover,
#topnav .navigation-menu > li.has-submenu.open > a,
#topnav .menu-extras .menu-item .search > a:hover {
color: #a3c85e;
}
#navigation {
position: absolute;
top: 70px;
left: 0;
width: 100%;
display: none;
height: auto;
padding-bottom: 0;
overflow: auto;
border-top: 1px solid #dee2e6;
border-bottom: 1px solid #dee2e6;
background-color: #ffffff;
}
#navigation.open {
display: block;
overflow-y: auto;
}
}
@media (min-width: 768px) {
#topnav .navigation-menu > li.has-submenu:hover > .submenu {
visibility: visible;
opacity: 1;
margin-top: 0;
}
#topnav .navigation-menu > li.has-submenu:hover > .submenu > li.has-submenu:hover > .submenu {
visibility: visible;
opacity: 1;
margin-left: 0;
margin-right: 0;
}
.navbar-toggle {
display: block;
}
}
@media (min-width: 426px) {
.navbar-sticky {
/* top: 44px !important; */
top: 0;
}
}
@media (max-width: 425px) {
.navbar-sticky {
top: 0px !important;
}
.tagline {
display: none !important;
}
}
/* Searchbar */
.toggle-search {
font-size: 24px !important;
}
.search-wrap {
background-color: #ffffff;
color: #35404e;
z-index: 9997;
position: absolute;
top: 0;
display: flex;
width: 100%;
height: 70px;
padding: 0 15px;
transform: translate3d(0, -100%, 0);
transition: .3s;
}
.search-wrap form {
display: flex;
width: 100%;
}
.search-wrap .search-bar {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
}
.search-wrap .search-input {
flex: 1 1;
border: none;
outline: none;
box-shadow: none;
background-color: transparent;
}
.search-wrap .close-search {
width: 36px;
height: 64px;
line-height: 64px;
text-align: center;
color: inherit;
font-size: 24px;
}
.search-wrap .close-search:hover {
color: #ffc107;
}
.search-wrap.open {
transform: translate3d(#35404e);
}
.navbar-custom {
padding: 20px 0px;
width: 100%;
border-radius: 0px;
z-index: 999;
margin-bottom: 0px;
transition: all 0.5s ease-in-out;
}
.navbar-custom .navbar-nav li a {
line-height: 26px;
color: #ffffff;
font-size: 15px;
transition: all 0.5s;
background-color: transparent !important;
padding: 6px 0;
margin: 0 15px;
}
.navbar-custom .navbar-nav li:last-of-type > a {
margin-right: 0;
}
.navbar-custom .navbar-nav .nav-link {
padding-right: 0px;
padding-left: 0px;
}
.navbar-custom .navbar-toggles {
padding: .25rem .75rem;
font-size: 18px;
background: 0 0;
border: 1px solid transparent;
color: #ffffff;
outline: 0;
}
.navbar-custom .navbar-toggles-icon {
display: inline-block;
width: 1.5em;
height: 1.5em;
vertical-align: middle;
}
.nav-social li a {
color: #ffffff;
}
.navbar-toggler {
font-size: 24px;
margin-top: 5px;
margin-bottom: 0px;
color: #ffffff;
}
.logo {
color: #ffffff !important;
font-weight: 700;
font-family: "Montserrat", sans-serif;
text-transform: uppercase;
font-size: 26px;
}
.navbar-custom .navbar-nav li.active a,
.navbar-custom .navbar-nav li a:hover,
.navbar-custom .navbar-nav li a:active {
color: #a3c85e !important;
}
.navbar-toggle {
font-size: 24px;
margin-top: 5px;
margin-bottom: 0px;
color: #ffffff;
}
.nav .open > a,
.nav .open > a:focus,
.nav .open > a:hover {
background-color: transparent;
border-color: #337ab7;
}
.menu-toggle {
padding: 4.5px 10px !important;
}
.menu-toggle span {
line-height: 27px;
}
.nav-sticky.navbar-custom {
margin-top: 0px;
padding: 10px 0px;
background-color: #ffffff;
box-shadow: 0 10px 33px rgba(53, 64, 78, 0.1);
color: #35404e !important;
}
.nav-sticky.navbar-custom.sticky-dark {
background-color: #ffffff !important;
}
.nav-sticky.navbar-custom .navbar-toggles {
padding: .25rem .75rem;
border: 1px solid transparent;
outline: 0;
}
.nav-sticky .navbar-nav {
margin-top: 0px;
}
.nav-sticky .navbar-nav li a {
color: #ffffff !important;
color: #35404e !important;
}
.nav-sticky .navbar-brand {
color: #35404e !important;
}
.nav-sticky .nav-social li a {
color: #35404e !important;
}
@media (max-width: 768px) {
.nav-sticky.navbar-custom .logo {
color: #ffffff !important;
}
.nav-sticky.navbar-custom.sticky-dark {
background-color: #35404e !important;
}
}
@media (min-width: 200px) and (max-width: 767px) {
.navbar-custom {
margin-top: 0px;
padding: 10px 0px !important;
background-color: #35404e !important;
box-shadow: 0 10px 33px rgba(53, 64, 78, 0.1);
color: #ffffff !important;
}
.navbar-custom .navbar-nav li a {
transition: all 0.4s;
color: #ffffff !important;
margin: 0px;
}
.navbar-custom .navbar-nav li.active a {
border-color: transparent;
}
.navbar-custom > .container {
width: 90%;
}
.navbar-nav {
margin-top: 0px;
}
.navbar-toggler {
font-size: 24px;
margin-top: 0px;
margin-bottom: 0px;
color: #ffffff !important;
padding: 4px 0 !important;
}
.nav-sticky.navbar-custom .logo {
color: #ffffff !important;
}
.nav-sticky.navbar-custom.sticky-dark {
background-color: #35404e !important;
}
}
.bg-home {
padding: 350px 0;
background-size: cover !important;
align-self: center;
position: relative;
background-position: center center;
}
.bg-home-half {
background-size: cover;
background-position: center center;
align-self: center;
position: relative;
padding: 280px 0 180px;
}
.bg-halfAbout {
padding-top: 178px;
height:1080px;
align-self: center;
position: relative;
}
.bg-half {
padding: 200px 0 210px;
background-size: cover;
align-self: center;
position: relative;
}
.bg-half2 {
padding: 350px 0 210px;
background-size: cover;
align-self: center;
position: relative;
}
.bg-full {
height: 100vh;
background-size: cover !important;
align-self: center;
position: relative;
background-position: center center;
}
/****SLIDER****/
.home-slider {
position: relative;
}
.home-slider .carousel-control-next,
.home-slider .carousel-control-prev {
width: 5%;
}
.home-slider .carousel-item,
.home-slider .carousel {
height: 100vh;
width: 100%;
}
.home-slider .carousel-item {
background-position: center center;
background-size: cover;
}
/*******BUSINESS-4*******/
.business-home-shape {
display: block;
position: absolute;
width: 100%;
height: auto;
bottom: -1px;
left: 0;
}
.business-home-shape img {
width: 100%;
height: auto;
}
/*******RESUME-1********/
.mouse-down a {
position: absolute;
top: 90px;
right: 0;
left: 0;
}
.mouse-down a i {
font-size: 16px;
height: 55px;
width: 28px;
line-height: 55px;
border: 2px solid #e9ecef;
}
/*********** ONE PAGE DEMO **************/
.about-op-head {
padding-top: 20px;
}
/***SERVICES***/
.onepage-services-icon i {
font-size: 35px;
}
.onepage-services .nav-tabs {
border-color: transparent;
}
.onepage-services .nav-tabs .nav-link {
text-transform: uppercase;
color: #35404e;
padding: 16px 10px;
border-bottom: 2px solid #a3c85e;
margin-left: 10px;
margin-right: 10px;
}
.onepage-services .nav-tabs .nav-item.show .nav-link,
.onepage-services .nav-tabs .nav-link:hover,
.onepage-services .nav-tabs .nav-link:focus,
.onepage-services .nav-tabs .nav-link.active {
border-color: transparent;
border-bottom: 2px solid #a3c85e;
transition: all 0.5s;
}
.about-img img {
max-width: 200px;
border: 5px solid #ffffff;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
@media (max-width: 767px) {
.bg-home, .bg-full, .bg-home-half, .bg-half {
padding: 100px 0;
height: auto;
}
}
.about-image-boxed {
z-index: 1;
}
.about-image-boxed:before {
content: "";
position: absolute;
left: 0;
right: 40px;
top: 0;
z-index: -1;
border: 8px solid #a3c85e;
bottom: 40px;
}
.feature .fe-head span {
position: absolute;
top: 0px;
right: 15px;
font-size: 100px;
opacity: 0;
transition: all 0.5s ease;
}
.feature:hover .fe-head span {
opacity: 0.1;
}
.feature-three {
position: relative;
background-color: transparent;
padding: 80px 0;
}
.feature-three.bg-gradient {
background: #1c2f43;
}
.types-of-service {
border-bottom: 2px solid #e9ecef !important;
transition: all 0.3s ease;
}
.types-of-service .icon i {
font-size: 24px;
height: 60px;
width: 60px;
line-height: 60px;
border-radius: 50%;
border: 1px solid #e9ecef;
transition: all 0.5s ease;
}
.types-of-service .service-icon i {
transition: all 0.5s ease;
font-size: 30px;
}
.types-of-service .service-head .title {
font-size: 18px;
}
.types-of-service .feature-hover-icon {
position: absolute;
font-size: 120px;
right: 0;
left: 0;
bottom: 30px;
opacity: 0;
color: #a3c85e;
transition: all 0.5s ease;
}
.types-of-service:hover {
border-bottom: 2px solid #a3c85e !important;
}
.types-of-service:hover .service-icon i {
margin-top: 25px;
}
.types-of-service:hover .icon i {
background: #a3c85e;
color: #ffffff;
}
.types-of-service:hover .feature-hover-icon {
opacity: 0.2;
}
@media (min-width: 200px) and (max-width: 767px) {
.feature-three {
text-align: center !important;
padding: 60px 0;
}
}
.watch-video a.watch {
font-size: 14px;
font-weight: 700;
}
.watch-video a .play-icon-circle {
height: 36px;
width: 36px;
background-color: #a3c85e;
line-height: 36px;
}
.watch-video a .play-icon-circle.play-iconbar {
font-size: 16px;
}
.watch-video a .play-icon-circle.play {
top: 77%;
}
.play-btn {
height: 78px;
width: 78px;
font-size: 30px;
line-height: 76px;
border-radius: 50%;
display: inline-block;
color: #ffffff;
}
.play-icon {
position: absolute;
bottom: 50%;
transform: translateY(50%);
right: 0;
left: 0;
text-align: center;
}
.play-icon i {
height: 75px;
-webkit-text-stroke: 2px #a3c85e;
-webkit-text-fill-color: transparent;
width: 75px;
font-size: 25px;
line-height: 75px;
display: inline-block;
}
.play-icon i:hover {
-webkit-text-stroke: 2px #a3c85e;
-webkit-text-fill-color: #a3c85e;
}
.bg-animation-right:after, .bg-animation-left:after {
position: absolute;
right: 0px;
top: 0px;
width: 45%;
height: 100%;
content: "";
background: #243b55 none repeat scroll 0 0;
z-index: 2;
}
.bg-animation-left:after {
left: 0px;
}
.call-back-cta, .client-counter {
z-index: 99;
position: relative;
}
.call-back-cta .contact-form,
.client-counter-border {
background-color: transparent;
border: 8px solid #ffffff;
}
@media (max-width: 768px) {
.bg-animation-right:after,
.bg-animation-left:after {
width: 50%;
}
}
@media (max-width: 767px) {
.bg-animation-right:after,
.bg-animation-left:after {
display: none;
}
}
.container-filter li a {
font-size: 14px;
font-weight: 500;
letter-spacing: 1px;
cursor: pointer;
line-height: 30px;
transition: all 0.6s ease;
}
.container-filter li a:hover, .container-filter li a.active {
color: #ffffff !important;
background-color: #a3c85e;
border-color: #a3c85e !important;
}
.portfolio-box .overlay-work {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
opacity: 0;
transition: all 0.5s ease;
background-color: rgba(255, 255, 255, 0.7);
}
.portfolio-box .overlay-work .work-content {
position: absolute;
bottom: 50%;
transform: translateY(50%);
right: 0;
left: 0;
}
.portfolio-box .overlay-work .work-content .work-icon {
height: 45px;
width: 45px;
line-height: 45px;
transform: translateY(40px);
transition: all 0.5s ease;
}
.portfolio-box .overlay-work .work-content .work-icon:hover {
background: #a3c85e !important;
}
.portfolio-box:hover .overlay-work {
opacity: 1;
transform: scale(1);
}
.portfolio-box:hover .overlay-work .work-content .work-icon {
transform: translateY(0px);
}
.team-box .team-info {
z-index: 1;
}
.team-box .team-members-overlay {
position: absolute;
right: 10px;
top: 5px;
opacity: 0;
transition: all 0.5s ease;
transform: translateX(100px);
}
.team-box .team-overlay {
position: absolute;
bottom: 0;
left: 0;
right: 0;
top: 0;
transition: all 0.5s ease;
background-color: rgba(53, 64, 78, 0.9);
transform: translateX(250px);
opacity: 0;
}
.team-box .team-overlay .team-content {
position: relative;
top: 50%;
transform: translateY(-50%);
}
.team-box:hover .team-members-overlay,
.team-box:hover .team-overlay {
opacity: 1;
transform: translateX(0);
}
.team-list {
transition: all 0.5s ease;
}
.team-list img {
width: 50%;
}
.team-list .content {
width: 50%;
}
.team-list .content .follow {
position: absolute;
bottom: 24px;
}
@media (max-width: 768px) {
.team-list img,
.team-list .content {
width: 100%;
float: none !important;
}
.team-list img .follow,
.team-list .content .follow {
position: relative;
bottom: 0;
}
}
.owl-theme .owl-dots .owl-dot span {
background: #a3c85e !important;
}
.customer-testi {
cursor: e-resize;
}
.customer-testi .content:before {
content: "";
position: absolute;
top: 30px;
left: 0;
margin-left: 13px;
box-sizing: border-box;
border: 8px solid #35404e;
border-color: transparent #ffffff #ffffff transparent;
transform-origin: 0 0;
transform: rotate(135deg);
box-shadow: 2px 2px 2px -1px rgba(53, 64, 78, 0.15);
}
.owl-theme .owl-dots .owl-dot span {
border-radius: 2px;
background: #c4db97 !important;
transition: all 0.5s ease;
}
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots.clickable .owl-dot:hover span {
background: #a3c85e !important;
}
.owl-carousel .owl-item img {
display: block;
width: auto;
}
.slick-slider {
overflow-x: hidden !important;
cursor: pointer;
}
.blog-post .content .title {
font-size: 16px;
font-weight: 500;
}
.blog-post .content .title,
.blog-post .post-meta .like,
.blog-post .post-meta .comment,
.blog-post .post-meta .readmore {
transition: all 0.5s ease;
}
.blog-post .content .title:hover,
.blog-post .post-meta .like:hover,
.blog-post .post-meta .comment:hover,
.blog-post .post-meta .readmore:hover {
color: #a3c85e !important;
}
.sidebar {
position: sticky;
top: 80px;
}
.sidebar .widget h4 {
font-size: 16px;
margin-bottom: 15px;
font-weight: 600;
color: #35404e;
}
.sidebar .widget.widget_categories a:hover {
color: #a3c85e !important;
}
.sidebar .widget .tagcloud > a {
background: #f8f9fa;
font-size:14px;
letter-spacing: 1px;
margin: 5px 5px 5px 0;
padding: 5px 10px;
text-transform: uppercase;
transition: all 0.5s ease;
}
.sidebar .widget .tagcloud > a:hover {
background: #a3c85e !important;
color: #ffffff !important;
}
.sidebar .widget-search form {
position: relative;
}
.sidebar .widget-search input[type="text"],
.sidebar .searchform input[type="text"] {
box-shadow: none;
border-radius: 2px;
padding: 12px 15px;
height: 49px;
font-size: 14px;
display: block;
width: 100%;
color: #35404e;
background-color: #ffffff;
border: 1px solid #e9ecef;
outline: none !important;
padding-right: 45px;
}
.sidebar .widget-search input[type="submit"],
.sidebar .searchform input[type="submit"] {
position: absolute;
background-color: transparent;
border: none;
outline: none !important;
top: 5px;
right: 10px;
text-indent: -999px;
opacity: 0;
width: 40px;
height: 40px;
}
.sidebar .searchform:after {
content: "\F0349";
position: absolute;
font-family: "Material Design Icons";
right: 16px;
color: #35404e;
top: 15px;
font-size: 20px;
line-height: 20px;
pointer-events: none;
}
.comments-area .media-list .media .media-body h6 {
font-size: 13px;
}
.comments-area .media-list .media .media-body a {
color: #525252;
}
.comments-area .media-list .media .media-body p {
line-height: 24px;
}
.comments-area .media-list .media .media-body .media-heading {
font-size: 15px;
}
#countdown .count-down {
display: inline-block;
color: #ffffff;
text-align: center;
width: 100px;
}
#countdown .count-down .count-number {
font-size: 40px;
}
#countdown .count-down .count-head {
transform: translateY(-5px);
text-transform: uppercase;
}
.error-page .title {
font-size: 90px !important;
}
@media (min-width: 768px) {
.error-page .title {
font-size: 160px !important;
}
}
.rongyu img{padding: 0 8px;}
.map {
line-height: 0;
}
.mapBox{background: rgba(0,0, 0, 0.2);height: 300px;}
.map iframe {
width: 100%;
height: 400px;
}
.error {
margin: 8px 0px;
display: none;
color: #dc3545;
}
#ajaxsuccess {
font-size: 16px;
width: 100%;
display: none;
clear: both;
margin: 8px 0px;
}
.error_message {
padding: 10px;
margin-bottom: 20px;
text-align: center;
border: 2px solid #dc3545;
color: #dc3545;
border-radius: 5px;
font-size: 14px;
}
.contact-loader {
display: none;
}
#success_page {
text-align: center;
margin-bottom: 50px;
}
#success_page h3 {
color: #28a745;
font-size: 22px;
}
.footer {
padding: 60px 0;
position: relative;
}
.footer .footer-head .title {
color: #e9ecef;
text-transform: uppercase;
letter-spacing: 1px;
}
.footer .footer-news .form-control {
background-color: #313b48;
border: 1px solid #495057;
color: #f8f9fa;
}
.footer .footer-news .form-control:focus {
box-shadow: none;
}
.footer .footer-news.foot-white .form-control {
color: #adb5bd;
}
.footer .footer-news input::placeholder {
color: #adb5bd;
}
.footer .text-foot {
color: #adb5bd;
}
.footer .footer-item li {
margin-bottom: 10px;
}
.footer .footer-item li a {
color: #adb5bd;
}
.footer .footer-item li a:hover {
color: #a3c85e !important;
}
.footer .footer-item li:last-child {
margin-bottom: 0;
}
.footer.footer-bar {
border-top: 1px solid #495057;
}
/*# sourceMappingURL=style.css.map */
/* 页脚 */
.footerbox {
/* height: 546px;
background: url(../images/banner/foot.jpg) 0 center no-repeat;
background-size: 100% 100%;
padding-top: 28px; */
}
.footTitle {
color: #fff;
font-size: 16px;
border-bottom: 2px solid #3ebb96;
width: 88px;
padding: 0 8px 8px;
margin-bottom: 25px;
}
.footer-upper .column h2 {
margin: 10px 0 10px;
font-size: 14px;
color: rgba(255, 255, 255, 1);
}
.footer-upper .column h2 a {
color: rgba(255, 255, 255, 0.5);
padding-left: 10px;
}
.footer-upper .links-widget li {
margin-bottom: 4px;
color: rgba(255, 255, 255, 0.5);
}
.footer-bottom .copyright {
height: 94px;
line-height: 94px;
font-size: 14px;
border-top: 1px solid rgba(255, 255, 255, 0.1);
color: rgba(255, 255, 255, 0.3);
margin-top: 30px;
}