:root {
  --orange:#ff5e14;
  --downriver:#0e2b5c;
  --gray: #f1f1f1;
  --black:#000000;
  --white: #ffffff;
  --azure-radiance : #088cef;
}
#project_single .project-image img{
  width: 100%;
  height: 100%;
}
.postpic img{
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
}
.blog-read-more-btn{
  background-color: var(--white);
  font: 14px/19px Roboto Slab;
  color: var(--downriver);
  padding: 10px 20px;
}
.latest-post-title:not(:hover){
  text-overflow: ellipsis;
}
.latest-post-title{
  font: bold 26px/34px Roboto Slab;
  color: var(--downriver);
  width: 100%;
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
}
.latest-post-title:hover span,
.latest-post-title:focus span {
  display: inline-block;
  animation-name: scroll-text;
  animation-duration: 4s;
  animation-timing-function: linear;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: normal;
}
@keyframes scroll-text {
  0% {
    transform: translateX(0%);
 }
  90% {
    transform: translateX(-100%);
 }
  95% {
    transform: translateX(0%);
 }
  100% {
    transform: translateX(0%);
 }
}
.latest-post-content{
  font: 16px/30px Assistant;
  color: var(--downriver);
}
.post-share{
  top: 10px;
  left: 10px;
}
.post-share .share-title i{
  background-color: var(--white);
  color: var(--orange);
  height: 30px;
  width: 30px;
  text-align: center;
  line-height: 30px;
  filter: drop-shadow(0px 20px 20px rgba(0,0,0,0.2));
}
.socila_share1 a:not(:first-child){
  background-color: var(--white);
  color: var(--orange);
  height: 30px;
  width: 30px;
  display: block;
  line-height: 30px;
  text-align: center;
}
.socila_share1 {
  display: none;
}
.post-share:hover  .socila_share1{
  display: block;
}
aside{
  /* border: 1px dashed #a1a1a1;
  margin-block-end: 7%;
  border-radius: 24px;
  padding: 15px 10px; */
}
aside form>label{
  font: bold 25px/55px Roboto Slab;
  position: relative;
}
aside form>label:after, aside h2:after{
  position: absolute;
  content: '';
  height: 2px;
  width: 40px;
  bottom: 0;
  left: 0;
  /* background-color: #03b2fb; */
}
aside form>div{
  margin-block-start: 10px;
  border-block-end: 1px solid #242424;
}
aside form>div input{
  border: none !important;
}
aside form button[type="submit"]{
  position: relative;
  font-size: 0;
  border: none;
  height: 20px;
  width: 20px;
  background: none;
}
aside form button[type="submit"]:after{
  content: '\f002';
  font-family:'FontAwesome';
  position: absolute;
  left: 3px;
  font-size: 16px;
  color: #0e2b5c;
  top: 0px;

}
.submit-btn{
  /* position: absolute; */
  right: 25px;
}
.search-field{
  padding: 10px 10px;
}
aside h2{
  position: relative;
  font: bold 30px/60px Roboto Slab;
  color: #242424;
}
aside :is(p, a, li, span){
  font: 16px/24px Assistant;
  color: #242424;
}
/* contact page */
#contact-page .main-cotainer{
  width: 100%;
    /* max-width: 70%; */
}
#contact-page .contact-left-content{
  background-color: var(--downriver);
  border-radius: 10px;
  padding: 30px 15px 15px;
  color: var(--white);
}
#contact-page .section-main-heading{
  font: bold 30px/40px Roboto Slab;
}
#contact-page .section-main-para{
  font: 16px/26px Assistant;
  max-width: 100%;
  width: 60ch;
  margin: 10px 0;
}
#contact-page .phone ,#contact-page .mail{
  display: block;
  font: 14px/26px Assistant;
  color: var(--white);
}
#contact-page form label{
  font: bold 20px/35px Roboto Slab;
  color: var(--black);
  display: block;
  margin-block-start: 10px;
}
#contact-page form :is(input, textarea){
  font: 14px/26px Assistant;
  padding: 5px 10px;

}
#contact-page form ::placeholder{
  color: var(--black);
}
#contact-page form textarea{
  height: 150px;
}
#contact-page form input[type="submit"]{
  font: 16px/26px Lato;
  background-color: var(--downriver);
  border: none;
  color: var(--white);
  padding: 5px 30px;
}
.navigation{
  text-align: center;
}
.navigation .current{
  background-color: var(--orange);
  color: var(--white);
  height: 32px;
  width: 32px;
  display: inline-block;
  border-radius: 5px;
  font: 16px/30px Open Sans;
}
.navigation a.page-numbers:not(.next),
.navigation a.page-numbers:not(.prev){
  font: 16px/30px Open Sans;
  height: 32px;
  width: 32px;
  color: #bfbfbf;
  display: inline-block;
}
.navigation .next.page-numbers, .navigation .prev.page-numbers {
  color: var(--downriver);
  font: 16px/30px Open Sans;
  border: 1px solid #bfbfbf;
  border-radius: 5px;
  height: 32px;
  display: inline-block;
  padding: 0 10px;
  width: max-content !important;
}
#services-page .postpic{
  text-align: center;
  background: #ff5e144f;
  padding: 25px 0;
}
#services-page .postpic img{
  width: unset;
  height: 220px;
  max-height: 300px;
  max-width: 100%;
}

/* error page */
#error-page .main-heading{
  font: 600 100px/100px Open Sans;
  background-color: var(--orange);
  color: var(--white);
  width: max-content;
  margin: auto;
  border-radius: 50%;
  padding: 30px;
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  position: relative;
}
#error-page .main-heading:after{
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  border-left: 70px solid transparent;
  border-right: 44px solid transparent;
  border-bottom: 34px solid var(--orange);
}
#error-page .sub-heading{
  font: bold 36px/76px Roboto Slab;
}
#error-page .error-para{
  font:20px/30px Assistant;
  width: 44ch;
  margin: auto;
  max-width: 100%;
}
.error-navigation *{
  font: bold 16px/40px Lato;
  color: var(--downriver);
  margin: 0 10px;
  cursor: pointer;
}

#error-page .overlay-searchform{
  position: fixed;
  inset: 30px;
  background-color: var(--orange);
  display: none;
  align-items: center;
  justify-content: center;
}
#error-page .overlay-searchform>i{
  position: absolute;
  right: 10px;
  top: 10px;
  font-size: 20px;
  color: var(--white);
}
#error-page .overlay-searchform form{
  width: 56%;
}
#error-page .overlay-searchform form label,
#error-page .overlay-searchform form input[type="search"]{
  width: 100%;
  padding: 15px;
}
#error-page .overlay-searchform form input[type="submit"]{
  font-size: 0;
  background: none;
  border: 0;
}
#error-page .overlay-searchform form i{
  right: 30px;
  position: absolute;
  top: 5px;
}

.nav-links{
  display: flex;
  flex-wrap: wrap;
  align-items:center;
  justify-content: space-between;
}

.nav-links .meta-nav{
  background-color: var(--orange);
  color: var(--white);
  padding: 10px;
}
.nav-links .post-title{
  color:var(--downriver);
}

/* about us page */
#about-us-page{
  padding: 50px 0;
}
#about-us-page .about-main-heading{
  width: 60%;
}
#about-us-page .card-container img{
  height: 50px;
  width: 50px;
}
#about-us-page .card-heading{
  font: 23px/30px Robot Slab;
  color: var(--orange);
}
#about-us-page .girl-image{
  border-radius: 50%;
  border: 1px solid var(--orange);
  padding: 5px;
}
#about-us-page .about-number{
  font: 600 15px/20px Assistant;
  color : var(--downriver);
}
#about-us-page .about-person-designation{
  color : var(--downriver);
  opacity: 0.6;
  font: 300 16px/20px Assistant;
}
#about-us-page .about-us-right-section{
  /* height: 80vh; */
   height: 537px;
}
#about-us-page .about-us-right-section img{
  height: 100%;
  max-width: 100%;
  width: 100%;
}
#about-us-page .right-text{
  top: 50%;
  left: 0px;
  transform: translateY(-50%);
  background-color: #ff5e14;
  border: solid var(--white);
  border-width: 15px 20px 15px 0px;
  text-align: start;
  padding: 10px 30px;
  color: var(--white);
}
#about-us-page .exp-year-text{
  font: 18px/24px Roboto Slab;
  width: min-content;
  margin: 0;
}
#about-us-page .section-small-heading, #faq-page .section-small-heading {
  font: bold 24px/30px Roboto Slab;
  color: var(--orange);
  position: relative;
}
#about-us-page .section-small-heading::before, #faq-page .section-small-heading::before{
  content: '';
  height: 35px;
  width: 35px;
  position: absolute;
  left: -20px;
  bottom: 6px;
  background-color: var(--gray);
  z-index: -1;
}
#about-us-page .section-main-heading, #faq-page .section-main-heading{
  font: bold 30px/45px Lato;
  color: var(--downriver);
}
#about-us-page .paragraph-blue, #faq-page .paragraph-blue{
  color: var(--downriver);
}
#about-us-page .about-learn-more-btn{
  background-color: var(--orange);
  width: max-content;
  padding: 10px 15px 12px;
  color: var(--white);
  font: 600 16px/21px Assistant;
}
#about-us-page .about-learn-more-btn i{
  background: var(--white);
  color: var(--orange);
  border-radius: 50%;
  font-size: 12px;
  padding: 3px;
}
#about-us-page .about-learn-more-btn {
  background-color: var(--orange);
  width: max-content;
  padding: 15px 25px 15px 20px;
}
.about-representative{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  text-align: center;
}
/* faq page */
#faq-page .accordion-item{
  border: none;
  border-bottom: 1px solid var(--downriver);
}
#faq-page .accordion-button:focus{
  box-shadow: unset;
}
#faq-page .accordion-button:not(.collapsed){
  background-color: #ff5e1469;
  color: var(--black);
}
#faq-page .right-border {
  border: 1px solid var(--downriver);
  padding: 15px 25px;
}
#faq-page .right-small-heading{
  font: bold 20px/30px sans serif;
}
#faq-page .right-border i{
  background-color: var(--orange);
  padding: 15px;
  border-radius: 50px;
  font-size: 20px;
  margin-inline-end: 10px;
  color: var(--white);
}



/* banner  css */
.title-box .container1{
  position: absolute;
  height: 100%;
  display: flex;
  align-items: center;
  background: #fff;
  width: 30%;
  padding-inline-start: 3%;
}
.above_title  h1{
  font: bold 35px/60px Roboto Slab;
  border-bottom: 2px solid #000;
}
.title-box .above_title a{
  opacity: 0.6;
}
.title-box .above_title a, .title-box .above_title .current{
  font: bold 16px/24px Lato;
  color: #121212;
  text-transform: uppercase;
  margin-inline: 5px;
}
.single-author-image img {
    width: 20%;
    border-radius: 50%;
}
.content_boxes{
  background-color: #fff;
    transform: translateY(-8%);
    padding: 0px;
    border: none;
}
#single_post .single-page-metabox {
    justify-content: center !important;
}
#single_post .feature-box img{
  width: 100%;
  height: auto;
}
.single-page-title {
    font: normal normal bold 36px Muli;
    color: #242424;
}
.single-page-metabox, .single-author-image span {
    font: normal normal normal 16px Muli;
    color: #242424;
}
.single-page-metabox .entry-comments, .single-page-metabox .entry-date {
    color: #BCBCBC;
    background-color: var(--color-white);
}
.single-post-content p {
    font: normal normal normal 20px/40px Muli;
    color: #242424;
    padding-bottom: 33px;
}
.meta-box-question {
    font: 400 30px/55px Muli;
    color: #242424;
}
.share_icon {
    padding-top: 20px;
    padding-bottom: 10px;
}
.share_icon i.fab.fa-facebook-f {
    background-color: #3c5a99;
}
.socila_share a .fa-facebook-f {
    padding: 9px 13px;
}
.socila_share a i {
    padding: 9px;
    border-radius: 50%;
    color: #fff;
    font-size: 16px;
}
.share_icon i {
    padding: 10px 10px 10px 8px;
    margin: 0 0;
    color: #ffffff;
    background-color: #333333;
    border-radius: 50%;
    width: 35px;
    margin: 0px 4px;
}
.share_icon i.fab.fa-twitter {
    background-color: #55acee;
}
.socila_share a i {
    padding: 10px;
    border-radius: 50%;
    color: #fff;
    font-size: 16px;
}
.link-img {
    background-color: #b9b7b7;
    padding: 8px 8px;
    border-radius: 50px;
}
.emoji-image {
    width: 20px;
    height: 20px;
}
.navigation {
    font-size: 14px;
    margin: 10px 0px;
}
.single-post-nav .nav-previous, .single-post-nav .nav-next {
    width: 250px;
}
.single-post-social-box li {
    list-style-type: none;
    margin-right: 15px;
    float: left;
    padding: 20px 0 30px;
}
.navigation span, .navigation a {
    display: block;
    float: left;
    padding: 10px 15px 0px 15;
    margin-bottom: 10px;
    margin-right: 10px;
    color: #5b5b5b;
    -webkit-transition: background .15s ease-in-out;
    -moz-transition: background .15s ease-in-out;
    -ms-transition: background .15s ease-in-out;
    -o-transition: background .15s ease-in-out;
    transition: background .15s ease-in-out;
    font-weight: normal;
}
.navigation a {
    padding: 0px;
}
#single_post .nav-next {
    float: right;
}
.single-post-comment {
    margin-top: 20%;
    width: 40%;

}
[type=submit]:not(:disabled) {
    color: #fff;
    background-color: #f95e15;
    border-color: #fa7578;
    padding: 10px 5px;
}

input#author, #email, #url {
    border-color: #e0e0e1;
    padding: 10px;
    border-bottom: 1px solid #e0e0e1 !important;
    border-radius: 0;
    width: 50%;
    border: none;
}
p.comment-form-author, .comment-form-email {
    /* width: 50%; */
    margin-left: 0;
    display: block;
    padding-top: 20px;
}
label {
    display: unset;
}
#comment{
  width: 100%;
}
.single-page-metaimage img{
  width: 100%;
}
.single_cat{
    background-color: #f95e15;
    padding: 10px 10px;
}