/* ---------------------------------------------------------------- Canvas: Movers -----------------------------------------------------------------*/ /* Root Settings -----------------------------------------------------------------*/ :root { --themecolor: #0F66DD; --themecolorrgb: 25,102,221; --headerbg: var(--themecolor); --primary-menu-font-size: 15px; } /* Animated Setting -----------------------------------------------------------------*/ .animated { -webkit-animation-duration: .4s; animation-duration: .4s; } @-webkit-keyframes fadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 30px, 0); transform: translate3d(0, 30px, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes fadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 30px, 0); transform: translate3d(0, 30px, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @media (max-width: 991.98px) { .menu-item > .menu-link { color: #FFF !important; } } .menu-container > .menu-item.current > .menu-link, .menu-container > .menu-item:hover > .menu-link { color: #FFF !important; } /* -- SVG CSS -- */ .svg-separator { position:absolute; width:100%; padding:0; margin:0; bottom: 0; left: 0; display: flex; justify-content: center; flex-direction: column; z-index: 1; } .svg-separator.top { top: -1px; bottom: auto; } .svg-separator.rotate { transform: rotate(180deg); } .svg-separator svg { display: block; background: 0 0; position: relative; left: 0; right: 0; bottom: 0; z-index: 1; width: 100%; } .svg-separator svg::before { content: ''; width: 100%; height: 200px; background-color: #FFF; } .section-gradient { background: var(--themecolor, #0F66DD); background: -moz-linear-gradient(top, var(--themecolor, #0F66DD) 30%,#FFF 80%); background: -webkit-linear-gradient(top, var(--themecolor, #0F66DD) 30%,#FFF 80%); background: linear-gradient(to bottom, var(--themecolor, #0F66DD) 30%,#FFF 80%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0F66DD', endColorstr='#FFF',GradientType=0 ); } .svg-themecolor { fill: var(--themecolor, #0F66DD); } .lightthemecolor { background-color: rgba(var(--themecolorrgb), 0.08); background-color: rgba(var(--themecolorrgb), 0.08); } #slider .nav .nav-item:first-child { border-top-left-radius: 0.25rem; } #slider .nav .nav-item:last-child { border-top-right-radius: 0.25rem; } #slider .nav-link { border: 1px solid rgba(255, 255, 255, .1); } #slider .nav-link:not(.active) { color: #FFF; background-color: rgba(255, 255, 255, .15); } #slider .nav-link:hover:not(.active) { border-color: rgba(255, 255, 255, .25); background-color: rgba(25,102,221, 0.7); background-color: rgba(var(--themecolorrgb), 0.7); } #slider .form-control, #slider .custom-select { font-size: 14px; height: calc(1.5em + 0.75rem + 6px); } a.btn-link i { position: relative; top: 1px; -webkit-transition: transform .3s ease; -o-transition: transform .3s ease; transition: transform .3s ease; } a.btn-link:hover i { transform: translateX(4px); } .svg-curve { position: absolute; left: 0; bottom: 0; } .row-eq-height [class^=col] { display: flex; flex-direction: column; } .row-eq-height [class^=col] > div { flex-grow: 1; padding: 30px 60px; } .testi-content { position: relative; border-left: 3px solid rgba(198,192,156, 0.1); border-left: 3px solid rgba(25,102,221, 0.1); border-left: 3px solid rgba(var(--themecolorrgb), 0.1); } .testi-content p { font-size: 18px; font-weight: 400; font-style: normal; z-index: 1; } .device-xs .testimonial .testi-content p, .testimonial.small .testi-content p { font-size: 15px; } .toggle { margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px solid #EEE; } .toggle-header { align-items: center; } .toggle-header .toggle-open { display: block !important; font-size: 20px; line-height: 1; height: 20px; transform: rotate(45deg); transition: transform .3s ease; } .toggle-closed { display: none !important; } .toggle-active .toggle-open { display: block !important; transform: rotate(90deg); color: var(--themecolor, #0F66DD); } .grid-bg { position: absolute; left: 50%; bottom: 0; z-index: -1; transform: translateX(-50%); } /* Play Icon -----------------------------------------------------------------*/ .play-video i { position: relative; padding-left: 6px; width: 60px; height: 60px; line-height: 61px; border-radius: 50%; z-index: 1; background-color: rgba(255, 255, 255, 0.85); text-align: center; font-size: 24px; color: #111; transition: all .3s ease; box-shadow: 0 0 1px 15px rgba(255,255,255,.04); -webkit-backface-visibility: hidden; } .play-video:hover i { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); } .feature-box .fbox-icon { background-color: transparent; background-image: url('../images/2.jpg'); background-repeat: no-repeat; background-position: center center; color: var(--themecolor, #0F66DD); background-size: 70px 70px; width: 80px; height: 80px; } .feature-box .fbox-icon i { background: transparent; color: var(--themecolor, #0F66DD); line-height: 80px; } .map-title { position: absolute; min-width: 70%; top: 50%; left: 50%; transform: translate(-50%, -50%); margin-top: -70px; } .map-title .iconlist li:not(:first-child) { margin-top: 8px; } .map-title .iconlist li img { position: relative; margin-top: -2px; width: 16px; margin-right: 15px; } .map-title .iconlist a { font-size: 13px; color: #888; } .device-xs .map-title { margin-top: 40px; } .counter-section { position: relative; border-top: 1px dashed #E5E5E5; padding-top: 40px; margin-top: 0px; } .counter-dots { position: absolute; display: block; height: 16px; width: 16px; top: -40px; left: 50%; margin-left: -10px; margin-top: -9px; background-color: var(--themecolor, #0F66DD); border: 4px solid #FFF; border-radius: 50%; -webkit-box-shadow: -1px 0 10px -1px rgba(0,0,0,.2); box-shadow: -1px 0 10px -1px rgba(0,0,0,.2); } .device-xs .counter-dots { display: none; } .device-xs .counter-section { border-top: 0; margin-top: 120px; } .counter + h5 { opacity: .5; } .section-map .map-image { opacity: .2; } footer .list-unstyled li a, .copyright-links a { color: #999; } #header.dark .primary-menu { border-top-color: rgba(255, 255, 255, .1); } #header, #header.dark:not(.transparent-header), #header #header-wrap, #header.dark.sticky-header:not(.transparent-header) #header-wrap:not(.not-dark) { background-color: var(--headerbg, #0F66DD); } #header.dark:not(.transparent-header) { border-bottom-color: rgba(255, 255, 255, .1); } #header.dark:not(.sticky-header) #header-wrap { border-top: 1px solid rgba(255, 255, 255, .1); } #header-wrap .header-buttons { margin-left: 1rem; padding-left: 1.5rem; border-left: 2px solid rgba(255, 255, 255, 0.4); } .header-extras li:not(:first-child) { border-left: 2px solid rgba(255, 255, 255, 0.2); padding-left: 30px; margin-left: 30px; } .header-extras.flex-column li:not(:first-child) { border-left: 0; padding-left: 0; margin-left: 0; } .header-extras li .he-text span { font-size: 15px; } .header-extras li i { margin-top: 5px !important; } /* Responsive Device more than 992px (.device-md >) -----------------------------------------------------------------*/ @media (min-width: 992px) { .menu-link { font-weight: 500 !important; text-transform: none; letter-spacing: 0; font-size: var(--primary-menu-font-size, 0.9375rem); transition: color .3s ease; } .menu-container > .menu-item > .menu-link::after { opacity: 0; content: ''; position: absolute; background: #FFF; height: 3px; bottom: 0; left: 50%; width: 0; transform: translateX( -50% ); -webkit-transition: all 0.25s ease; -o-transition: all 0.25s ease; transition: all 0.25s ease; } .menu-container > .menu-item.current > .menu-link::after, .menu-container > .menu-item:hover > .menu-link::after { opacity: 1; width: 100%; } .sub-menu-container { border-top: 0 !important; width: 280px; } .sub-menu-container .menu-item > .menu-link { font-family: 'Poppins', sans-serif; font-size: 0.875rem; } .sub-menu-container .menu-item > .menu-link::after { display: none; } .heading-block h3 { font-size: 36px; } .heading-block h3 + span { font-size: 17px; } .counter-section { margin-top: -140px; } } @media (max-width: 991.98px) { .toggle-header, .toggle-active .toggle-header, .toggle-content { padding-left: 0; } .toggle-title i.toggle-open { right: 0; } #header-wrap .header-buttons { margin-left: 0.75rem; padding-right: 1.2rem; } }