:root{
--primary:#ffd600;
--approach:#fff8e7;
--bg:#ffffff;
--text:#000000;
}

/* GLOBAL */

body{
font-family:'Inter',sans-serif;
background:var(--bg);
color:var(--text);
}

section{
padding-top:100px;
padding-bottom:100px;
}

.container{
max-width:1200px;
}

/* NAVBAR */

.navbar{
background:#313131;
padding:18px 0;
transition:.3s;
}

.navbar.scrolled{
box-shadow:0 5px 20px rgba(0,0,0,0.08);
}

.navbar-brand{
font-weight:800;
font-size:24px;
letter-spacing:-0.5px;
}

.nav-link{
font-weight:500;
margin-left:25px;
color:#ffffff !important;
}

.nav-link:hover{
color:var(--primary)!important;
}

/* BUTTON */

.btn-yellow{
background:var(--primary) !important;
color:#000 !important;
font-weight:600;
padding:14px 32px;
border-radius:10px;
border:none;
transition:.3s;
text-transform: uppercase;
}
.btn-white{
background:#FFF;
color:#000;
font-weight:600;
padding:14px 32px;
border-radius:10px;
border:none;
transition:.3s;
}

.btn-yellow:hover{
transform:translateY(-3px);
box-shadow:0 12px 25px rgba(0,0,0,0.15);
background:var(--primary) !important;
}
.btn-blue{
     background: #6b9fe8;
    color: #000;
    font-weight: 600;
    padding: 10px 10px;
    border-radius: 10px;
    border: none;
    transition: .3s;
    font-size: 11px;

}

.btn-purple{
  background: #a890d3;
 color: #000;
 font-weight: 600;
 padding: 10px 10px;
 border-radius: 10px;
 border: none;
 transition: .3s;
 font-size: 11px;
 float: right;

}

/* HERO */

.hero{
padding-top:140px;
padding-bottom:120px;
}

.hero h1{
font-size:64px;
font-weight:800;
line-height:1.1;
letter-spacing:-1px;
margin-bottom:24px;
text-align: center;
}

.hero p{
font-size:18px;
color:#333;
margin-bottom:30px;
max-width:500px;
text-align: center;
margin: auto;
}

.hero img{
border-radius:12px;
}

/* APPROACH */

.approach{
background:var(--approach);
padding: 30px;

}
.approach img{width:100%;}
.approach .glyphicon{    position: relative;
  top: 20px;
}
#myCarouselC .glyphicon{    position: relative;
  top: 140px;
}
.item.active{background-color: transparent !important;}

.carousel-control.left,.carousel-control.right{
  background-image: none !important;
}
#myCarouselC {
  position: relative;
  margin: 12px;    padding: 39px;}
.approach-title{
font-size:32px;
font-weight:700;
margin-bottom:60px;
}

.approach-card{
background:#fff;
padding:40px;
border-radius:16px;
transition:.35s;
height:100%;
}

.approach-card:hover{
transform:translateY(-10px);
box-shadow:0 25px 45px rgba(0,0,0,0.08);
}

.approach-card h4{
font-weight:600;
margin-bottom:15px;
}

.approach-card p{
color:#444;
}
.green{background-color:#90d5a4;margin: 15px; border-radius: 15px;text-align: left;  padding-left: 60px;}
.blue{background-color: #6597db; margin: 15px; border-radius: 15px; text-align: left;  padding-left: 60px;}
.pink{background-color: #e89fc4;margin: 15px; border-radius: 15px;text-align: left;  padding-left: 60px;}
.left-corner{font-size: 11px;}
.left-corner b{font-weight: 700;font-size: 16px;}
.green h4,.blue h4,.pink h4{font-weight: 700;    font-size: 20px;}
/* CTA */

.cta h2{
font-size:32px;
font-weight:700;
margin-bottom:20px;
}

.cta p{
color:#444;
margin-bottom:30px;
}
.carousel-inner img{width:100%;}

/* FOOTER */

footer{
padding:40px 0;
border-top:1px solid #eee;
color:#666;
}

/* ANIMATION */

.animate{
opacity:0;
transform:translateY(40px);
transition:all .8s ease;
}

.animate.show{
opacity:1;
transform:translateY(0);
}

/* RESPONSIVE */

@media(max-width:991px){

.hero h1{
font-size:36px;

}

section{
padding-top:70px;
padding-bottom:70px;
}

}
.bgblack{
    background: url("../bgbblack.jpg") 2900px 1900px;;
    color: #fff;
}
.bgblack p{ color: #FFF;}
.fixed-top{color:#000;}
.approachText{
    margin-top: 35px;}
* {box-sizing:border-box}

/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

/* Hide the images by default */
.mySlides {
  display: none;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  animation-name: fade;
  animation-duration: 1.5s;
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

footer {
  background: #000;
  color:#fff;
}

.rightNav{float:right}


.panel-default>.panel-heading {
  color: #333;
  background-color: #fff;
  border-color: #342f2f !important;
  border-radius: 15px;
  border: 1px solid;
}
.panel-default
 {
    border-color: #ffffff;
}

.contactForm{
  background: #fff;
  border-radius: 20px;
  padding: 30px;
}
.contactForm input {
  border: 0px;
  border-bottom: 1px solid #ccc;
  padding-bottom: 6px;
  margin-bottom: 7px;
  margin-top: 15px;
}
.navbar {
    margin-bottom: 0px !important;}
.sideBox{ background-color: #fff;
  padding: 20px;min-height: 200px;max-height: 200px; 
  border-radius: 15px;
  margin-top: 25px;}
.midBox{
  border-bottom: 5px solid var(--primary);
  background-color: #fff;
  padding: 20px;
  min-height: 250px;
  border-radius: 15px;
}
.successStory{
  min-height: 400px;
}
.midBox h5 {
  font-size: 18px !important;
  font-weight: bold;
  margin-bottom: 28px;
}
.smallBox h6 {
  font-size: 16px !important;
  font-weight: bold;
  margin-bottom: 28px;
}
.smallC{
  font-size: 11px !important;
}
.footer ,.footer:hover{
 
  color: #fff;
    padding: 20px;
}