.theme-light {
  --color-primary: #e0e5ec;;
  --color-secondary: #fbfbfe;
  --contrast-color:;
  --font-color: #4c4a4a;
  --font-color-2: #222222;
  --contrast-color: #f27d7c;
  --shadow-outer: 9px 9px 16px rgba(163, 177, 198, 0.6), -3px -3px 7px rgba(255, 255, 255, 0.7);
  --shadow-inner:inset 3px 3px 7px rgba(136, 165, 191, 0.48), inset -3px -3px 7px #FFFFFF;

}
 
 
.theme-dark {
  
  --color-primary: rgb(31, 39, 51);
  --color-secondary: #2b2b31;
  --font-color:  #d8e8f6;
  --font-color-2: #f6f6f6;
  --contrast-color: #c59c35;
  --shadow-outer:  5px 5px 10px #171d26, -5px -5px 10px  #273140, inset 0px 0px 0px  #171d26, inset 0px 0px 0px  #273140;
;
  --shadow-inner:  0px 0px 0px  #171d26, 0px 0px 0px #273140, inset 5px 5px 10px  #171d26, inset -5px -5px 10px #273140;
}

.my-btn {
  border-radius: 1rem;
  display:inline-block;
  outline: none;
  padding: 14px 32px;
  justify-content: center;
  text-transform: uppercase;
  align-items: center;
  background:var(--color-primary);
  box-shadow: var(--shadow-outer);
  cursor: pointer;
  transition: background 300ms ease, box-shadow 300ms ease;
}

.my-btn:hover,
.my-btn:focus {
   box-shadow: var(--shadow-inner);
   color: var(--contrast-color)!important;
  transition: box-shadow 300ms ease;
}
 
.hover-a:hover {
  transform: translateY(-5%);
}
 

.outer-shadow{
    box-shadow: var(--shadow-outer);
}
.inner-shadow{
    box-shadow: var(--shadow-inner);
}
/*home section*/


.mydec{
	position: relative;
  font-size: 38px;
  font-weight: 400;
}
.mydec strong{
  font-size: 48px;
  font-weight: 600;
 color: var(--contrast-color);
}

.mydec::after{
position: absolute;
content: '';
bottom: 0px;
left: 0px;
width: 10%;
background:var(--contrast-color); 
height: 3px;
border-radius: 25px;
}
.typing{
  font-size: 26px!important;
  font-weight: 400;
  text-transform: ;
}
.home-desc{
  font-size: 20px;
  opacity: .8;
  font-weight: 100;
  text-transform: capitalize;
  padding-top: 16px;
  padding-bottom: 16px;
}
/*about section*/


/* ==========================================================================
  services Section Style
   ========================================================================== */
/* Services Item */


.service-a  {
  padding: 30px;
  border-radius: 4px;
  box-shadow: var(--shadow-outer);
  margin: 15px 0;
  cursor: pointer;
  text-align: center;
  transition: all .3s ease-in-out!important;
}

.service-a:hover{
   transform: translateY(-10px);

}
.service-a:hover h4{
   color: var(--contrast-color);}
 
.service-a div {
 margin-bottom: 28px;
 padding: 0px;
}
.service-a i {
 box-shadow: var(--shadow-inner);
 padding: 16px;
 font-size: 28px;
 color: var(--contrast-color);
 border-radius: 71% 29% 39% 61% / 63% 40% 60% 37%;
 font-weight: bold;
}
.service-a h4{
  font-weight: 400;
}
.service-a p{
  font-size: 16px;
}


.call-action{
  box-shadow: var(--shadow-outer);
}
.call-action a{
  margin-top: 10px;
  color: var(--font-color);
  border: 1px solid var(--contrast-color);
}

.progress{
    height: 3px;
    margin: 0;
    overflow: visible;
    border-radius: 50px;
    background: var(--color-primary)!important;
   
}
/* ==========================================================================
   Featured Section Start
   ========================================================================== */
.featured-box {
  margin-top: 15px;
  margin-bottom: 30px;
  padding: 26px;
  position: relative;
  transition: all .5s ease;
  cursor: pointer;
  box-shadow: var(--shadow-outer);
}
.featured-box:hover h4{
 color: var(--contrast-color);
}

.featured-box .featured-icon {
  float: left;
}

.featured-box .featured-icon i {
  font-size: 30px;
  color: var(--contrast-color);
  text-align: center;
  float: left;
  margin-right: 25px;
  margin-bottom: 85px;
  display: block;
}

.featured-box .featured-content {
  padding-left: 40px;
  position: relative;
}

.featured-box .featured-content .icon-o {
  font-size: 86px;
  color: var(--font-color);
  z-index: -100!important;
  font-weight: 400;
  opacity: .1;
  text-transform: capitalize;
  position: absolute;
  top: 0px;
  left: 50px;
  width: 100%;
}

.featured-box .featured-content h4 {
  font-size: 22px;
  font-weight: 400;
  margin-bottom: 10px;
  transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
}

.featured-box .featured-content p {
  font-size: 16px;
}
/*===========================
     Contact us 
===========================*/
.contact-tabs i{
  font-size: 28px;
  color: var(--contrast-color);
}
.contact-tabs{
  transition: all .4s ease;
}
.contact-tabs:hover {
 
  transform: translateY(-10%);
}

.contact-tabs h5{
padding: 10px;
margin: 0px;
}
.contact-tabs p{
  margin: 0px;
}