/* ------------------------------------------------
  Project:   Softino - Software Landing Page HTML5 Template
  Author:    ThemeHt
------------------------------------------------ */
/* ------------------------
    Table of Contents

  1. General
  2. Typography
  3. Helper class
  4. Text color
  5. Background color
  6. Border Radius
  7. Banner
  8. Background Position & Size
  9. Countdown
  10. Terms and Conditions
  11. Privacy Policy
  12. Clients Logo
  13. Contact
  14. Video
  15. Image Box
  16. Side Background
  17. Error Page
  18. List Icon
  19. Bg Animated Image
  20. How It Work
  21. Spinner
  22. Hexagon
  23. Timeline
  24. Other


/* ------------------------
    General
------------------------*/
@import url('https://fonts.googleapis.com/css?family=Heebo:300,400,500,700,800,900');
@import url('https://fonts.googleapis.com/css?family=Charm:400,700');

body {font-family: 'Heebo', sans-serif; font-weight: normal; font-style: normal; font-size: 15px; line-height: 1.5; color:#5f5f5f; letter-spacing: 1px; overflow-x: hidden;}


/* ------------------------
    Typography
------------------------*/
h1, h2, h3, h4, h5, h6{font-weight:normal; margin-top: 0px; margin-bottom: 0px; text-transform: capitalize; letter-spacing: 2px; font-family: 'Nunito', sans-serif;}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; }
h1 { font-size: 60px; font-style: normal; line-height: 70px; font-weight: bold; text-transform: capitalize; color: #1c1d3e; letter-spacing: 0;}
h2 { font-size: 40px; font-style: normal; line-height: 46px; font-weight: 600; color: #1c1d3e; text-transform: capitalize; margin-bottom: 10px; position: relative;}
h3 { font-size: 30px; font-style: normal; line-height: 36px; font-weight: 500;}
h4 { font-size: 24px; font-style: normal; margin-bottom: 10px; font-weight: 500; line-height: 30px; color: #1c1d3e;}
h5 { font-size: 20px; font-style: normal; margin-bottom: 10px; font-weight: 500; line-height: 26px; color: #1c1d3e;}
h6 { font-size: 18px; font-style: normal; line-height: 24px; margin-bottom: 10px; color: #1c1d3e;}
ul { margin: 0px; padding: 0px; }
u {text-decoration-style: wavy;}

body.home-2 h1, body.home-2 h2, body.home-2 h3, body.home-2 h4, body.home-2 h5, body.home-2 h6{font-family: 'Ubuntu', sans-serif;}
body.home-3 h1, body.home-3 h2, body.home-3 h3, body.home-3 h4, body.home-3 h5, body.home-3 h6{font-family: 'Titillium Web', sans-serif;}
body.home-4 h1, body.home-4 h2, body.home-4 h3, body.home-4 h4, body.home-4 h5, body.home-4 h6{font-family: 'Work Sans', sans-serif;}
body.home-5 h1, body.home-5 h2, body.home-5 h3, body.home-5 h4, body.home-5 h5, body.home-5 h6{font-family: 'Cabin', sans-serif;}
body.home-6 h1, body.home-6 h2, body.home-6 h3, body.home-6 h4, body.home-6 h5, body.home-6 h6{font-family: 'Dosis', sans-serif;}


/* ------------------------
    Helper class
------------------------*/
p{line-height: 1.7;}
.lead{font-weight: normal; font-size: 16px; line-height: 30px;}
.o-x-hidden{overflow-x: hidden;}
.z-index-0{z-index: 0; position: relative;}
.z-index-1{z-index: 1; position: relative;}
h1 span{color: #2575fc;}
section{padding: 80px 0;}
.section-title{margin-bottom:50px; position: relative;}
.section-title p{font-size: 16px;}
.align-item-middle{display: -webkit-flex; /* Safari */  -webkit-align-items: center; /* Safari 7.0+ */  display: flex; align-items: center;}
.align-item-middle > div{width: 100%;}
.la{line-height: inherit;}
.rounded {border-radius: 7px !important;}

.font-w-3{font-weight: 300;}
.font-w-4{font-weight: 400;}
.font-w-5{font-weight: 500;}
.font-w-6{font-weight: 600;}
.font-w-7{font-weight: 700;}
.font-w-8{font-weight: 800;}
.font-w-9{font-weight: 900;}

.line-h-2{line-height: 1.6;}
.line-h-3{line-height: 1.7;}
.line-h-4{line-height: 1.8;}
.line-h-5{line-height: 1.9;}

.letter-space-1{letter-spacing: 5px;}
.letter-space-2{letter-spacing: 10px;}
.letter-space-3{letter-spacing: 15px;}


/* ------------------------
    Text color
------------------------*/
.text-theme{color: #2575fc;}
.text-black{color:#1c1d3e !important;}
.text-grey{color:#999999;}
.text-rgba{color: rgba(255,255,255,0.8);}


/* ------------------------
    Background color
------------------------*/
.white-bg{background-color: #ffffff !important;}
.dark-bg{background-color: #02060b;}
.grey-bg{background-color: #f3f5ff;}
.theme-bg{background-color: #2575fc;}
.transparent-bg{background-color: inherit !important;}
.grediant-bg{background-color: rgb(0,91,234); background-color: linear-gradient(90deg, rgba(0,91,234,1) 0%, rgba(37,117,252,1) 80%);}


/* ------------------------
    Banner
------------------------*/
.fullscreen-banner{position: relative; min-height: 800px;}
[data-bg-img]{background-size: cover; background-position: center center; background-repeat: no-repeat;}
.align-center{position: absolute; top: 50%; width: 100%; z-index: 9;}
.align-end{position: absolute; bottom: 0; width: 100%; z-index: 9;}
.fullscreen-banner .owl-carousel, .fullscreen-banner .owl-stage-outer, .fullscreen-banner .owl-stage, .fullscreen-banner .owl-item{height: 100%;}
.hero-bg {left: 0; position: absolute; top: 0;}
.fullscreen-banner .img-side{top: 50%; transform: translateY(-50%); left: -5%; height: auto;}

.banner h5{background: #ffb58c; text-transform: uppercase; padding: 7px 15px; display: inline-block; border-top-left-radius: 7px; border-bottom-right-radius: 7px;}
.home-6 .banner .bnr-box{background: #5c2ec2;}

/* -------------------------------
   Background Position & Size
-------------------------------*/
.bg-cover{background-size: cover;}
.bg-contain{background-size: contain;}
.bg-pos-l{background-position: left;}
.bg-pos-r{background-position: right;}
.bg-pos-rt{background-position: right top;}
.bg-pos-lt{background-position: left top;}
.bg-pos-rb{background-position: right bottom;}
.bg-pos-lb{background-position: left bottom;}


/* ------------------------
    Countdown
------------------------*/
.countdown{margin:50px 0; padding:50px 0; display: table; width: 100%; border-top: 2px dashed rgba(255,255,255,0.5); border-bottom: 2px dashed rgba(255,255,255,0.5);}
.countdown > li{font-weight: 700; text-align: center; list-style-type: none; display: table-cell; width: auto;}
.countdown > li span{font-size:70px; font-weight:700; line-height:60px; display: inline-block;}
.countdown > li p{font-size:20px; display: inline-block; line-height:30px; margin-bottom: 0; color: #1c1d3e;}
.coming-soon .subscribe-form{margin: 0 auto;}


/* ------------------------
    Terms and Conditions
------------------------*/
.terms-and-conditions p{margin-bottom:25px;}
.terms-and-conditions ul.list{margin-bottom:20px; display:block;}
.terms-and-conditions ul.list li i{padding-right:12px; font-size:15px;}


/* ------------------------
    Privacy Policy
------------------------*/
.privacy-policy p{margin-bottom:25px;}
.privacy-policy ul.list{margin-bottom:20px; display:block;}
.privacy-policy ul.list li i{padding-right:12px; font-size:15px;}


/* ------------------------
    Clients Logo
------------------------*/
.clients-logo {background: #fff; padding: 50px 10px; width: 100%; text-align: center; border-radius: 7px;}


/* ------------------------
    Contact
------------------------*/
.contact-media{background: #ffffff; text-align: center; padding: 50px 30px; border-radius: 7px; border-bottom: 3px solid #2575fc;}
[class*='col-']:nth-child(2) .contact-media{border-bottom: 3px solid #005bea;}
.contact-media i{line-height: 70px; font-size: 70px; color: #2575fc; margin-bottom: 30px; display: inline-block;}
.contact-media span{font-size: 16px; color: #1c1d3e; font-weight: bold; text-transform: uppercase; display: block; margin-bottom: 15px;}
.contact-media p{margin-bottom: 0; line-height: 24px;}
.contact-media a{color: #1c1d3e;}
.contact-media a:hover{color: #2575fc;}

.form-group{margin-bottom: 20px; position: relative;}
 label{font-size: 14px; color: #1c1d3e}
.form-control{height: 50px; border-radius: 5px; font-size: 13px; color: #1c1d3e; background: #fafaff; border: 1px solid transparent;}
.theme-bg .form-control .dark-bg .form-control{background: none; border:5px solid rgba(255,255,255,0.1);}
.dark-bg .form-control, .theme-bg .form-control{color: #ffffff;}
.grey-bg .form-control{background: #ffffff}
textarea.form-control{height: 150px; border-radius: 5px;}
.form-control:focus{box-shadow: none; background: none; border-color: #2575fc;}
.theme-bg .form-control:focus{border-color: #2575fc;}
select.form-control {-moz-appearance: none; -webkit-appearance: none; appearance: none; height: 50px !important;}
iframe{width: 100%; border: none; pointer-events: auto;}
.iframe-h{height: 500px !important;}
.iframe-h-2{height: 600px !important;}
.map iframe {border: 0px; width: 100%; height: 100%; z-index: 1; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%);}

.help-block.with-errors {position: absolute; color: red; right: 15px; font-size: 10px; line-height: 14px;}

.form-control::-webkit-input-placeholder {color: #555;}
.form-control::-moz-placeholder {color: #555;}
.form-control:-ms-input-placeholder {color: #555;}
.form-control:-moz-placeholder {color: #555;}
.dark-bg .form-control::-webkit-input-placeholder,
.theme-bg .form-control::-webkit-input-placeholder {color: #ffffff;}

.dark-bg .form-control::-moz-placeholder, .theme-bg .form-control::-moz-placeholder{color: #ffffff;}
.dark-bg .form-control:-ms-input-placeholder, .theme-bg .form-control:-ms-input-placeholder{color: #ffffff;}
.dark-bg .form-control:-moz-placeholder, .theme-bg .form-control:-moz-placeholder{color: #ffffff;}


/* ------------------------
    Video
------------------------*/
.video-btn {position: relative; display: inline-block;}
.video-btn .play-btn {font-size: 30px; background: #2575fc; color: #fff; line-height: 50px; width: 70px; height: 70px; border: 10px solid rgba(0,0,0,0.1); -webkit-border-radius: 100%;
 border-radius: 100%; text-align: center; cursor: pointer; z-index: 9; position: relative; display: inline-block; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out; -webkit-transition-property: color, background, border-color; transition-property: color, background, border-color; }
.video-btn-pos{position: absolute; position: absolute; left: 50%; top: 50%; width: auto !important; z-index: 99;}
.theme-bg .video-btn .play-btn, .dark-bg .video-btn .play-btn{background: #ffffff; border-color: #ddd; color: #2575fc;}
.html5-video {height: 100%; left: 0; opacity: 1; overflow: hidden; position: absolute; top: 0; width: 100%; z-index: -2;}
.html5-video video {width: 100%;}
.video-btn .spinner-eff {left: 50%; top: 50%;}


/* ------------------------
    Image Box
------------------------*/
.img-box{background: #ffffff; padding-top: 50px; overflow: hidden; position: relative; border-radius: 7px;}
.img-box img{width: 100%;}
.box-loader {border-radius: 100%; margin: 0 auto; position: absolute; top: 15px; left: 15px;}
.box-loader span{display: inline-block; width: 10px; height: 10px; border-radius: 100%; background: #2575fc; margin: 0 5px; opacity: 0;}
.box-loader span:nth-child(1){animation: opacitychange 1s ease-in-out infinite;}
.box-loader span:nth-child(2){animation: opacitychange 1s ease-in-out 0.33s infinite;}
.box-loader span:nth-child(3){animation: opacitychange 1s ease-in-out 0.66s infinite;}


/* ------------------------
    Side Background
------------------------*/
.img-side img{max-width: 100%}
.img-side.img-right {right: 0;}
.img-side.img-left {left: 0;}
.img-side {padding: 0; position: absolute!important; top: 0px; height: 100%; overflow: hidden; z-index: 9;}
.image-column {position: absolute; left: 0px; top: 50%;}
.image-column.right {left: inherit; right: 0;}


/* ------------------------
    Error Page
------------------------*/
.error-page {font-size: 350px; font-weight: bold; line-height: 250px; font-family: 'Charm', cursive;}
.error-page > span {display: inline-block; position: relative; color: #2575fc;}
.error-page > span {display: inline-block; position: relative; vertical-align: middle;}
.error-page > span:nth-of-type(1) {color: #2575fc; animation: colordancing 4s infinite;}
.error-page > span:nth-of-type(3) {color: #00c9ff; animation: colordancing2 4s infinite;}
.error-page > span:nth-of-type(2) {width: 250px; height: 120px; border-radius: 999px;}
.error-page > span:nth-of-type(2):before,
.error-page > span:nth-of-type(2):after {border-radius: 0%; content:""; position: absolute; top: 0; left: 0; width: inherit; height: inherit; border-radius: 999px; box-shadow: inset 30px 0 0 rgba(0,201,255, 0.4),
inset 0 30px 0 rgba(5,248,161, 0.4), inset -30px 0 0 rgba(255,8,68, 0.4), inset 0 -30px 0 rgba(255,81,47, 0.4); animation: shadowsdancing 4s infinite;}
.error-page > span:nth-of-type(2):before {-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg);}
.screen-reader-text {position: absolute; top: -9999em; left: -9999em;}


/* ------------------------
    List Icon
------------------------*/
.list-icon li{position: relative; padding-left: 30px;}
.list-icon li i{position: absolute; left: 0; top: 0; color: #2575fc; font-size: 22px; line-height: 20px;}
.list-icon-2 li{padding-left: 20px; position: relative;}
.list-icon-2 li:before{content: ""; background: #2575fc; position: absolute; top: 8px; left: 0; width: 10px; height: 2px; border-radius: 4px;}
.custom-li{display: inline-block;}
.custom-li li {float: left; margin-bottom: 15px; width: calc(100% / 2);}


/* ------------------------
    Bg Animated Image
------------------------*/
.info-img:before {position: absolute; left: 0; top: 0; height: 330px; width: 100%; content: ""; background-image: url(../images/pattern/07.png); z-index: -1;}
.bg-effect::after {background: #fafaff; top: 0; content: ""; left: 25%; position: absolute; right: 0; z-index: -1; height: 100%; border-top-left-radius: 50%;}
.bg-effect.right::after{left: 0; right: 25%; border-top-left-radius: 0; border-top-right-radius: 50%;}
.bg-effect-2::before {background: #fff; top: -50px; content: ""; height: 120px; left: 0; overflow: visible; position: absolute; transform: skewY(4deg); width: 100%;}
.bg-effect-3::after {background: #fff; bottom: -50px; content: ""; height: 120px; left: 0; overflow: visible; position: absolute; transform: skewY(-4deg); width: 100%;}
.bg-effect-4::after {background: #2575fc; border-bottom-left-radius: 30px; border-top-left-radius: 30px; content: ""; height: 80%; right: -20%; position: absolute; top: 10%; transform: rotate(-5deg); width: 70%; z-index: -1;}
.bg-animation {position: absolute; top: -100px; left: 0;}
.wave-shape {position: absolute; width: 100%; height: auto; left: 0; top: 0;}
.wave-bg > use {animation: move-forever 20s linear infinite;}
.wave-bg > use:nth-child(1) {animation-delay: -2s;}
.wave-bg > use:nth-child(2) {animation-delay: -2s; animation-duration: 10s;}
.wave-bg > use:nth-child(3) {animation-delay: -4s; animation-duration: 8s;}
.wave-animation {display: block; width: 100%; height: 8em; max-height: 100vh; margin: 0; position: absolute; bottom: -40px;}


/* ------------------------
    How It Work
------------------------*/
.work-process{position: relative;}
.step-num {background: #fff; border-radius: 50%; box-shadow: 0 12px 20px 0 rgba(117, 178, 240, 0.4); color: #005bea; display: inline-block; font-size: 18px; font-weight: 600; height: 50px; right: 0; line-height: 55px; position: absolute; text-align: center; top: 0; width: 50px;}
.theme-bg .work-process h4, .theme-bg .work-process p{color: #ffffff;}
.step-icon {background: #ffffff; width:140px; height:140px; position: relative; border: 3px solid #fafaff; border-radius: 50%; line-height: 140px; font-size: 40px; text-align: center; color: #1c1d3e;}
.step-icon span {position: relative;}
.step-icon span::after, .step-icon span::before {border-radius: 50%; content: ""; height: 40px; position: absolute; width: 40px; z-index: -1;}
.step-icon span::after {background: #cdf3f6; height: 25px; left: -10px; top: 5px; width: 25px;}
.step-icon span::before {background: #d4f8e6; bottom: 0; right: -10px;}
.dark-bg .step-icon{color: rgba(255,255,255,0.9); background: none;}
.dark-bg .step-desc h4{color: #2575fc;}
.dark-bg .step-icon{border-color: rgba(255,255,255,0.1);}
.dark-bg .step-desc p{color: rgba(255,255,255,0.7);}
.step-num-box{position: relative; display: inline-block; margin-bottom: 20px;}
.work-process .box-loader{position: absolute; top: 30%; right: -15%; left: inherit;}
.work-process.style-2 {padding: 0; display: flex; align-items: center;}
.work-process.style-2:before{display: none;}
.work-process.style-2 .step-num-box {margin-bottom: 0; margin-right: 30px;}
.work-process.style-3 {padding: 70px 30px 0;}
.work-process.style-3 .step-num {background: none; box-shadow: none; color: rgba(255, 255, 255, 0.1); font-size: 120px; height: auto; left: 50%; line-height: 120px; margin-bottom: 0; position: absolute; top: 0; transform: translateX(-50%); width: auto;}
#svg-container {position: absolute; width: 100%; left: 52%;  z-index: -1; transform: translateX(-50%); width: 75%;}
#svgC {margin: 0 auto; width: 100%;}


/* ------------------------
    Spinner
------------------------*/
.spinner-eff {position: absolute; width: 200px; height: 200px; bottom: 0;}
.spinner-eff .spinner-circle {border-radius: 100px; position: absolute; left: 0; right: 0; margin: auto; transform: scale(1); transform-origin: center center;}
.spinner-eff .circle-1 {width: 100%; height: 100%; background-color: #60f691;  top: 0; animation: pulse 1.6s linear 0s infinite;}
.spinner-eff .circle-2 {width: 66.6%; height: 66.6%; background-color: #0cca4a; top: 16.5%; animation: pulse-2 1.6s linear 0s infinite;}


/* ------------------------
    Hexagon
------------------------*/
.hexagon-bg{position: absolute; left: 50%; top: 0; width: 100%; display: flex;}
.hexagon-bg.style-2{top: 50%;}
.hexagon {position: relative; margin: 0 auto; width: 10em; height: 17.32em; border-radius: 1em/.5em; background: #fafaff; transition: opacity .5s;}
.hexagon:before, .hexagon:after {position: absolute; width: inherit; height: inherit; border-radius: inherit; background: inherit; content: '';}
.hexagon:before {-webkit-transform: rotate(60deg); transform: rotate(60deg);}
.hexagon:after {-webkit-transform: rotate(-60deg); transform: rotate(-60deg);}
.hexagon:nth-child(2n+2){margin-top: 20px;}
.hexagon-bg.style-2 .hexagon{background: #ff0844; opacity: 0.050}


/* ------------------------
    Timeline
------------------------*/
.timeline {position: relative; margin: 0 auto;}
.timeline:after {content: ''; position: absolute; width: 5px; background: #fafaff; left: 50%; top: 0; bottom: 0; margin-left: -2px;}
.timeline--first:after {top: 20px;}
.timeline-title {text-align: center; position: relative; z-index: 1; padding-bottom: 20px;}
.timeline-title h2 {background: #ffffff; color: #2575fc; display: inline-block; padding: 10px 20px; border-radius: 7px; font-size: 24px; line-height: 30px;}
.timeline-inner {padding: 10px 30px 40px 30px; width: 50%; position: relative; background-color: inherit;}
.timeline-right {margin-left: 50%;}
.timeline-content {padding: 20px 30px; background: #ffffff; position: relative; border-radius: 7px;}
.timeline-content h3{font-size: 20px; color: #1c1d3e; font-weight: bold;}
.timeline-inner::before {content: ""; display: block; position: absolute; top: 0; right: -16px; margin: auto; height: 32px; width: 32px; border: 3px solid #2575fc; border-bottom: 3px solid transparent !important; border-radius: 50%; z-index: 9; background: #ffffff;
-webkit-animation: loader-3-1 1.5s cubic-bezier(0.770, 0.000, 0.175, 1.000) infinite; animation: loader-3-1 1.5s cubic-bezier(0.770, 0.000, 0.175, 1.000) infinite;}
.timeline-inner::after {content: ""; position: absolute; top: 0; right: -3px; margin: auto; width: 6px; height: 6px; background: #005bea; border-radius: 50%; z-index: 9;
-webkit-animation: loader-3-2 1.5s cubic-bezier(0.770, 0.000, 0.175, 1.000) infinite; animation: loader-3-2 1.5s cubic-bezier(0.770, 0.000, 0.175, 1.000) infinite;}
.timeline-right.timeline-inner::before{right: inherit; left: -16px;}
.timeline-right.timeline-inner::after{right: inherit; left: -3px;}
.timeline-content:before, .timeline-content:after{content: ""; background: #2575fc; border-radius: 7px; width: 0; height: 3px; position: absolute;}
.timeline-content:before{top: 0; left: 0;}
.timeline-content:after{bottom: 0; right: 0;}
.timeline-inner:hover .timeline-content:before, .timeline-inner:hover .timeline-content:after{width: 10%;}


/* ------------------------
    Other
------------------------*/
#canvas {width: 100%; height: 100%; position: absolute; top: 0; left: 0; opacity: 0.5;}
#confetti {width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
.blink-img{position: absolute; left: 50%; top: 50%; width: 100%;}
.morph-wrap {position: absolute; top: 0; left: -20%; bottom: 0; width: 70%; pointer-events: none; z-index: -1; transform: rotate(-90deg);}
.morph {position: relative; height: 130%; fill: #ffe2e1; flex: none; width: 150%;}
.login-form img{height: 100px;}
.remember-checkbox label{margin-bottom: 0;}
.round-shape {position: absolute; right: 10%; bottom: 0; height: 300px; width: 300px; border-radius: 50%; background: none; border:50px solid #359090; animation: heartbeat 0.5s cubic-bezier(0.245, 0.325, 0.51, 1.305) infinite alternate; opacity: 0.050;}

/* Landing Page Theme Overrides - Gradient KIAS */

/* Primary Color Overrides (#359090) */
.text-theme,
a,
a:hover,
a:focus,
.btn-theme,
.navbar-nav .nav-link:hover,
.navbar-nav .nav-item .nav-link.active,
.contact-media i,
.list-icon li i,
.error-page>span,
h1 span {
    color: #359090 !important;
}

.theme-bg,
.scroll-top a,
.video-btn .play-btn,
.btn-theme,
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
    background-color: #359090 !important;
}

.theme-bg {
    background-color: #359090 !important;
}

/* Gradients */
.grediant-bg,
.grediant-overlay:before {
    background: #359090 !important;
    background: linear-gradient(90deg, #359090 0%, #267084 100%) !important;
}

/* Border Colors */
.theme-bg .form-control:focus,
.form-control:focus {
    border-color: #359090 !important;
}

/* Secondary/Accent Colors */
.box-loader span,
.timeline-inner::before,
.timeline-content:before,
.timeline-content:after {
    background-color: #359090 !important;
    border-color: #359090 !important;
}

.timeline-title h2 {
    color: #359090 !important;
}

/* Button Overrides */
.btn-theme {
    background-color: #359090;
    border-color: #359090;
    color: #fff !important;
}

.btn-theme:hover {
    background-color: #267084;
    border-color: #267084;
    color: #fff !important;
}

/* Scroll Top */
.scroll-top a {
    background: #359090 !important;
}

.scroll-top a:hover {
    color: #359090 !important;
    background: #ffffff !important;
}

/* Selection */
::selection {
    background: #359090;
    color: #fff;
}

::-moz-selection {
    background: #359090;
    color: #fff;
}

/* Preloader Colors */
.loader .loader-box:nth-child(1)::before {
    background: #359090 !important;
}

.loader .loader-box:nth-child(2)::before {
    background: #8dc794 !important;
}

.loader .loader-box:nth-child(3)::before {
    background: #267084 !important;
}

.loader .loader-box:nth-child(4)::before {
    background: #3a9b94 !important;
}

/* Contact Icons */
.contact-media i {
    color: #359090 !important;
}

/* Footer Links */
.footer-social ul li a:hover,
.media-icon li a {
    color: #359090 !important;
}

/* Navbar Dropdown */
.nav-item.dropdown .dropdown-menu a:hover,
.navbar-nav .dropdown-menu .dropdown-submenu .dropdown-toggle.show,
.navbar-nav .dropdown-menu .dropdown-submenu .dropdown-toggle:focus {
    color: #359090 !important;
}
/* Refined Landing Page Theme Overrides - Gradient KIAS v2 */

/* --- Teal #359090 (Primary) Replacements for #2575fc --- */

/* Accordions */
.accordion-button:hover,
.accordion-button:not(.collapsed),
.dark-bg .accordion .accordion-button:hover,
.dark-bg .accordion .accordion-button:not(.collapsed) {
    background-color: #359090 !important;
    color: #ffffff !important;
}

.accordion .accordion-button:after {
    background: #359090 !important;
}

/* Team, Posts, Comments, Icons */
.team-member .team-description h5,
.team-link:hover,
.team-description .team-icon li a:hover,
.team-description .team-icon li i,
.post .post-desc h4 a:hover,
.post-meta ul li i,
.post.style-2:hover .post-categories,
.post-author span,
.comment-reply a:hover {
    color: #359090 !important;
}

/* Backgrounds & Decorations */
.team-member.style-3:before,
.team-member.style-3:after,
.tab .nav-tabs .nav-link.active i::after,
.tab .nav-tabs.active>a:focus i::after,
.post .post-image::before,
.post .post-image::after,
.post-categories,
.post-title:after,
.post.style-3 .post-meta:after,
.testimonial-caption::before,
.round-shape {
    background-color: #359090 !important;
    border-color: #359090 !important;
}

/* Tabs */
.tab .nav-tabs .nav-link.active,
.tab .nav-tabs .nav-link:hover,
.tab .nav-tabs.active>a:focus,
.tab .nav-tabs>a:hover {
    background: #359090 !important;
    color: #ffffff !important;
}

.tab.style-2 .nav-tabs .nav-link.active h5,
.tab.style-2 .nav-tabs.active>a:focus h5 {
    color: #359090 !important;
}


/* --- Darker Teal #267084 (Secondary) Replacements for #005bea --- */

/* Featured Items, Contact Media, Steps, Categories */
.featured-item.style-6:hover .featured-icon i,
.step-num,
.post-categories:hover,
.comment-date,
.widget-categories li i,
.featured-item.style-1:hover .featured-icon i,
.featured-item.style-2:hover .featured-icon i,
.featured-item.style-6:hover .featured-icon i,
.btn.btn-white:hover,
.btn.btn-white.btn-border:hover,
.btn-simple:hover,
.price-table.style-2 .price-title {
    color: #267084 !important;
}

[class*='col-']:nth-child(2) .contact-media {
    border-bottom-color: #267084 !important;
}

/* Background Elements */
.timeline-inner::after,
.tab.style-2 .nav-tabs .nav-link i::after,
.post-title:before,
.post.style-3 .post-meta:before,
.testimonial-caption:before,
.anti-02 {
    background: #267084 !important;
}

.counter span {
    color: #267084 !important;
}

/* Gradients */
.anti-03 {
    background: linear-gradient(to right, #267084, #359090) !important;
}


/* --- Light Green #8dc794 (Success/Accent) Replacements for #00c9ff --- */

/* Selection & Error Page */
::-moz-selection {
    background: #8dc794 !important;
    color: #fff !important;
}

::selection {
    background: #8dc794 !important;
    color: #fff !important;
}

.error-page>span:nth-of-type(3) {
    color: #8dc794 !important;
}

/* Header 3 Elements */
.header-3 #header-wrap.fixed-header .navbar-toggler span {
    background-color: #8dc794 !important;
}

.header-3 .navbar-nav .nav-link:hover::before,
.header-3 .navbar-nav .nav-item .nav-link.active::before,
.header-3 .navbar-nav .nav-link:focus::before {
    color: #8dc794 !important;
}

/* Specific Animation/Shape overrides */
.round-shape {
    border-color: #359090 !important;
}
/* Final Aggressive Theme Overrides - Gradient KIAS v3 */

/* --- RESPONSIVE & MOBILE OVERRIDES --- */

@media (max-width: 992px) {
    .navbar-toggler span {
        background: #359090 !important;
    }

    .header-3 #header-wrap.fixed-header .navbar-toggler span {
        background: #359090 !important;
    }

    .navbar-nav .nav-link:hover,
    .navbar-nav .nav-link:focus,
    .navbar-nav .nav-link.active,
    .nav-item .nav-link.show,
    .navbar-nav .nav-link:hover::before,
    .navbar-nav .nav-link:focus::before {
        color: #359090 !important;
        text-shadow: none !important;
    }
}

/* --- GLOBAL COLOR FORCING --- */

/* Buttons - Catch All */
.btn-primary,
.btn-theme,
button[type="submit"],
.btn {
    background-color: #359090;
    border-color: #359090;
    color: #fff;
}

.btn-primary:hover,
.btn-theme:hover,
button[type="submit"]:hover,
.btn:hover {
    background-color: #267084 !important;
    border-color: #267084 !important;
    color: #fff !important;
}

/* Text Colors - Catch All */
.text-primary,
.text-theme {
    color: #359090 !important;
}

/* Backgrounds - Catch All */
.bg-primary,
.theme-bg {
    background-color: #359090 !important;
}

/* Shadows - Remove Blue Shadows */
.box-shadow,
#header-wrap.fixed-header,
.navbar-nav ul,
.btn,
.icon-btn,
.timeline-content,
.price-table,
.featured-item,
.team-member {
    box-shadow: 0px 0px 15px 0px rgba(53, 144, 144, 0.15) !important;
    /* Teal Shadow */
}

/* Specific Element Fixes from previous checks */
.round-shape {
    border-color: #359090 !important;
    background: none !important;
    /* Ensure no blue bg leaks */
}

/* Scroll Top */
.scroll-top a {
    background: #359090 !important;
}

.scroll-top a:hover {
    background: #fff !important;
    color: #359090 !important;
}

/* Preloader (Again, just to be safe) */
.loader .loader-box::before {
    background: #359090 !important;
}

/* ======================================================
   KIAS University Theme - Enhanced Gradient Styling
   Color Palette:
   - Primary: #359090 (Teal)
   - Secondary: #267084 (Dark Teal)
   - Accent: #3a9b94 (Medium Teal)
   - Highlight: #8dc794 (Light Green)
   - Light: #f1f1f1
====================================================== */

/* --- Gradient Backgrounds for Sections --- */
.grey-bg {
    background: linear-gradient(135deg, #f1f1f1 0%, rgba(53, 144, 144, 0.05) 50%, #f1f1f1 100%) !important;
}

/* Hero/Banner Gradient Effect */
.fullscreen-banner::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(38, 112, 132, 0.03) 0%, rgba(53, 144, 144, 0.05) 50%, rgba(141, 199, 148, 0.03) 100%);
    pointer-events: none;
    z-index: 0;
}

/* Theme Background Gradient */
.theme-bg {
    background: linear-gradient(135deg, #267084 0%, #359090 50%, #3a9b94 100%) !important;
}

/* Dark Background with Gradient */
.dark-bg {
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%) !important;
}

/* --- Button Gradients --- */
.btn.btn-theme {
    background: linear-gradient(90deg, #267084 0%, #359090 50%, #3a9b94 100%) !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(53, 144, 144, 0.3) !important;
    transition: all 0.3s ease !important;
}

.btn.btn-theme:hover {
    background: linear-gradient(90deg, #1f5a6a 0%, #267084 50%, #359090 100%) !important;
    box-shadow: 0 6px 20px rgba(53, 144, 144, 0.4) !important;
    transform: translateY(-3px) !important;
}

/* Secondary Button Style */
.btn.btn-border {
    border: 2px solid #359090 !important;
    color: #359090 !important;
    background: transparent !important;
}

.btn.btn-border:hover {
    background: linear-gradient(90deg, #267084 0%, #359090 100%) !important;
    color: #ffffff !important;
    border-color: transparent !important;
}

/* --- Header Gradient Effect --- */
#header-wrap.fixed-header {
    background: linear-gradient(90deg, #ffffff 0%, rgba(255, 255, 255, 0.98) 100%) !important;
    box-shadow: 0 2px 30px rgba(53, 144, 144, 0.15) !important;
}

/* --- Section Dividers with Gradient --- */
section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent 0%, #359090 50%, transparent 100%);
    opacity: 0;
    pointer-events: none;
}

/* --- Featured Items Gradient Hover --- */
.featured-item:hover::before {
    background: linear-gradient(180deg, #267084 0%, #359090 50%, #3a9b94 100%) !important;
}

/* --- Price Table Gradient Active --- */
.price-table.active {
    background: linear-gradient(135deg, #267084 0%, #359090 50%, #3a9b94 100%) !important;
}

.price-table.active .price-title,
.price-table.active .price-value h2,
.price-table.active .price-value h2 span,
.price-table.active .price-value span,
.price-table.active .price-list ul li,
.price-table.active h3 {
    color: #ffffff !important;
}

/* --- Contact Media Gradient Border --- */
.contact-media {
    border-bottom: 3px solid transparent !important;
    border-image: linear-gradient(90deg, #267084, #359090, #8dc794) 1 !important;
}

/* --- Timeline Gradient --- */
.timeline:after {
    background: linear-gradient(180deg, #359090 0%, #267084 50%, #3a9b94 100%) !important;
}

/* --- Progress Bar Gradient --- */
.ht-progress-bar .progress .progress-bar {
    background: linear-gradient(90deg, #267084 0%, #359090 50%, #8dc794 100%) !important;
}

/* --- Testimonial Gradient Accent --- */
.testimonial.style-4:after {
    background: linear-gradient(135deg, #267084 0%, #359090 100%) !important;
}

/* --- Footer Gradient --- */
.footer.theme-bg {
    background: linear-gradient(135deg, #267084 0%, #359090 50%, #3a9b94 100%) !important;
}

/* --- Card Hover Effects with Gradient Shadow --- */
.featured-item:hover,
.team-member:hover,
.post:hover,
.price-table:hover {
    box-shadow: 0 15px 40px rgba(53, 144, 144, 0.2) !important;
}

/* --- Accordion Gradient Header --- */
.accordion-button:not(.collapsed) {
    background: linear-gradient(90deg, #267084 0%, #359090 100%) !important;
}

/* --- Tab Active Gradient --- */
.tab .nav-tabs .nav-link.active {
    background: linear-gradient(90deg, #267084 0%, #359090 100%) !important;
}

/* --- Video Play Button Gradient --- */
.video-btn .play-btn {
    background: linear-gradient(135deg, #267084 0%, #359090 100%) !important;
    box-shadow: 0 5px 25px rgba(53, 144, 144, 0.4) !important;
}

.video-btn .play-btn:hover {
    background: linear-gradient(135deg, #359090 0%, #8dc794 100%) !important;
}

/* --- Scroll to Top Gradient --- */
.scroll-top a {
    background: linear-gradient(135deg, #267084 0%, #359090 100%) !important;
    box-shadow: 0 5px 20px rgba(53, 144, 144, 0.3) !important;
}

/* --- Selection Gradient Effect --- */
::selection {
    background: #359090 !important;
    color: #ffffff !important;
}

::-moz-selection {
    background: #359090 !important;
    color: #ffffff !important;
}

/* --- Links with Gradient Underline on Hover --- */
a:hover {
    color: #359090 !important;
    text-decoration: none !important;
}

/* --- Form Focus Gradient Border --- */
.form-control:focus {
    border-color: #359090 !important;
    box-shadow: 0 0 0 0.2rem rgba(53, 144, 144, 0.15) !important;
}

/* --- Page Title Gradient Overlay --- */
.page-title {
    position: relative;
}

.page-title::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(38, 112, 132, 0.02) 0%, rgba(53, 144, 144, 0.03) 50%, rgba(141, 199, 148, 0.02) 100%);
    pointer-events: none;
    z-index: 0;
}

/* --- Counter Gradient Text --- */
.counter span:first-child {
    background: linear-gradient(90deg, #267084, #359090) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* --- Wave Shape Gradient --- */
.wave-bg use {
    fill: rgba(53, 144, 144, 0.1) !important;
}

/* --- Decorative Elements Gradient --- */
.title-effect .bar {
    background: linear-gradient(90deg, #267084 0%, #359090 50%, #8dc794 100%) !important;
}

.title-effect-2 .ellipse {
    background: linear-gradient(135deg, #267084 0%, #359090 100%) !important;
}

/* --- Step Icon Gradient --- */
.step-num {
    background: linear-gradient(135deg, #ffffff 0%, #f8f8f8 100%) !important;
    color: #359090 !important;
    box-shadow: 0 12px 20px 0 rgba(53, 144, 144, 0.3) !important;
}

/* --- Owl Carousel Dots Gradient --- */
.owl-theme .owl-dots .owl-dot.active span {
    background: linear-gradient(90deg, #267084 0%, #359090 100%) !important;
}

/* --- Widget Search Button Gradient --- */
.widget-searchbox .search-btn {
    color: #359090 !important;
}

/* --- Tags Hover Gradient --- */
.widget .widget-tags li a:hover,
.post-tags li a:hover {
    background: linear-gradient(90deg, #267084 0%, #359090 100%) !important;
    color: #ffffff !important;
}

/* --- Pagination Active Gradient --- */
.pagination > li.active .page-link,
.page-link:hover,
.page-link:focus {
    background: linear-gradient(90deg, #267084 0%, #359090 100%) !important;
    border-color: #359090 !important;
}