/*-----------------------------------------------------------------------------------

    Template Name: Raees - Responsive Architecture / Architect Template
    Description: This is html5 template
    Version: 1.0

-----------------------------------------------------------------------------------
    
    CSS INDEX
    ===================
	1. Theme default css (css/shortcode/default.css)
    2. Menu css (css/shortcode/menu.css)
    3. Slider css (css/shortcode/slider.css)
	4. About us
	5. Specialization area
	6. Contact us button
	7. Our project
	8. Our working Way
	9. Our team
	10. Funfact area
	11. Testimonial area
	12. Blog area
	13. Frequently ask question
	14. Newsletter from
	15. Footer Area Css
	16. ScrollUp
    15. Footer area css
    16. ScrollUp
    17. Breadcrumbs
    18. blog page
    19. Contact page
    20. Blog details
	
-----------------------------------------------------------------------------------*/

/* ************ Google Font ************ */
@import url("https://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700i,900,900i|Oswald:200,300,400,500,600,700");

/* ************ 4. About us ************ */
.btn-check:focus + .btn,
.btn:focus {
  outline: 0;
  box-shadow: none;
}

/*************************
 Bootstrap Custom Container
************************/
.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .container,
  .container-sm {
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  .container,
  .container-md,
  .container-sm {
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  .container,
  .container-lg,
  .container-md,
  .container-sm {
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl {
    max-width: 1170px;
  }
}

@media (min-width: 1400px) {
  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: 1170px;
  }
}

.row {
  --bs-gutter-x: 30px;
  align-items: center;
}
.row.g-0 {
  --bs-gutter-x: 0px;
}

a {
  text-decoration: none;
}

.container .row div[class^="col-"] {
  position: relative;
}
.mx-n-15px {
  margin-left: -15px;
  margin-right: -15px;
}
.px-15px {
  padding-left: 15px;
  padding-right: 15px;
}
.mb-30px {
  margin-bottom: 30px;
}
.mb-n-30px {
  margin-bottom: -30px;
}
.download > a {
  text-decoration: underline;
}
.download > a i {
  margin-right: 10px;
}
.download > a {
  display: block;
  font-size: 16px;
  font-weight: 700;
  margin-top: 30px;
  overflow: hidden;
  text-decoration: underline;
  transition: all 0.3s ease 0s;
}
.about-right h2,
.about-right h4 span {
  color: #f15b26;
  margin: 0 0 30px;
}
.about-right h2 span {
  font-size: 72px;
  background-image: -webkit-gradient(
    linear,
    left top,
    right top,
    color-stop(0, #2168d4),
    color-stop(0.15, #598ec2),
    color-stop(0.3, #0290e6),
    color-stop(0.45, #155ecf),
    color-stop(0.6, #155ecf),
    color-stop(0.75, #6ca9d5),
    color-stop(0.9, #1952a3),
    color-stop(1, #0a69e7)
  );
  background-image: gradient(
    linear,
    left top,
    right top,
    color-stop(0, #2168d4),
    color-stop(0.15, #598ec2),
    color-stop(0.3, #0290e6),
    color-stop(0.45, #155ecf),
    color-stop(0.6, #155ecf),
    color-stop(0.75, #6ca9d5),
    color-stop(0.9, #1952a3),
    color-stop(1, #0a69e7)
  );
  color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
}
.about-right h2 a {
  float: right;
  background-color: #f15b26;
  color: #fff;
  padding: 5px 10px;
  border-radius: 5px;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.3s ease 0s;
  margin-right: 30px;
  line-height: 30px;
}
.about-right h4 {
  color: #303030;
  font-weight: 700;
  margin: 0 0 15px;
  font-size: 18px !important;
}
.about-right h4 span {
  font-weight: 900;
}
.about-left p {
  text-align: center;
  color: #303030;
  margin-top: 5px;
}

/* ************ 5. Specialization area ************ */
.specialization-single {
  padding-right: 50px;
}
.specialization-titel > h2 {
  color: #f15b26;
  margin: 0 0 25px;
}
.spcl-titel > img,
.working-titel > img {
  float: left;
}
.specialization-titel > p {
  margin: 0;
  padding-right: 40%;
}
.spcl-titel > h4,
.working-titel > h4 {
  color: #303030;
  font-size: 20px;
  font-weight: 600;
  line-height: 25px;
  padding-left: 48px;
}

/* ************ 6. Contact us button ************ */
.contact-btn-left > p {
  color: #303030;
  margin: 20px 0 0;
  padding-right: 22%;
}
.contact-btn > a {
  background: #000 none repeat scroll 0 0;
  color: #f15b26;
  display: inline-block;
  font-weight: 600;
  margin-top: 55px;
  padding: 10px 25px;
  text-transform: uppercase;
  transition: all 0.4s ease 0s;
}
.contact-btn.f-right > a:hover {
  background: #fff;
  color: #f15b26;
}

/* ************ 7. Our project ************ */
.project-banner {
  display: block;
  position: relative;
}
.pro-bnr-text {
  background: #fff none repeat scroll 0 0;
  margin-left: 45px;
  margin-right: 45px;
  opacity: 0.9;
  padding: 50px 35px 35px;
  position: absolute;
  text-align: center;
  top: 28%;
}
.pro-bnr-text > p {
  color: #303030;
}
.pro-bnr-text > h2 {
  margin: 0 0 25px;
}
.project-tab-menu {
  margin-top: 20px;
  text-align: right;
}
.project-tab-menu .nav.nav-tabs {
  border: none;
  justify-content: flex-end;
}
.project-tab-menu .nav.nav-tabs .nav-link {
  border: none;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
}
.project-tab-menu ul li a {
  color: #303030;
  display: block;
  font-weight: 700;
  padding: 30px 10px;
}
.project-tab-menu .nav.nav-tabs .nav-link.active,
.project-tab-menu .nav.nav-tabs .nav-link.active:hover {
  color: #f15b26;
}
.project-single {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.project-img {
  padding: 0 5px 10px;
  width: 216px;
}
/*Indicator Style Owl*/
.indicator-style .owl-theme .owl-nav {
  margin-top: 15px;
  text-align: left;
}
.indicator-style .owl-theme .owl-nav [class*="owl-"] {
  background: transparent none repeat scroll 0 0;
  border: 1px solid #ddd;
  border-radius: 0;
  color: #303030;
  cursor: pointer;
  display: inline-block;
  font-size: 14px;
  height: 30px;
  line-height: 28px;
  margin: 0 0 0 5px;
  padding: 0;
  text-align: center;
  width: 30px;
}
.indicator-style .owl-theme .owl-nav .owl-next[class*="owl-"] {
  margin-left: 0;
}
.indicator-style .owl-theme .owl-nav [class*="owl-"]:hover {
  background: #f15b26 none repeat scroll 0 0;
  color: #fff;
  text-decoration: none;
  border-color: #f15b26;
}

/* ************ 8. Our working Way ************ */
.working-wrapper {
  display: flex;
  flex-wrap: wrap;
}
.working-single {
  padding: 65px 30px 10px;
  position: relative;
  flex-basis: 20%;
  max-width: 20%;
}
.working-titel > h4 {
  padding-left: 40px;
}
.working-text p {
  color: #303030;
}
.working-single:nth-child(1) {
  background: #f15b26 none repeat scroll 0 0;
}
.working-single:nth-child(2) {
  background: #f0b901 none repeat scroll 0 0;
}
.working-single:nth-child(3) {
  background: #deac03 none repeat scroll 0 0;
}
.working-single:nth-child(4) {
  background: #f0b800 none repeat scroll 0 0;
}
.working-single:nth-child(5) {
  background: #f15b26 none repeat scroll 0 0;
}
.numbering {
  background: #000 none repeat scroll 0 0;
  color: #f15b26;
  font-family: oswald;
  font-size: 16px;
  font-weight: 900;
  height: 35px;
  left: 0;
  line-height: 35px;
  position: absolute;
  text-align: center;
  top: 0;
  width: 50px;
}

/* ************ 9. Our team ************ */
.team-titel > h4 {
  color: #f15b26;
  font-family: oswald;
  font-size: 24px;
  font-weight: 900;
  margin: 0 0 4px;
}
.team-titel > p {
  font-size: 16px;
  margin: 0 0 25px;
}
/* .our-team .col-md-4 {
  padding-left: 8px;
  padding-right: 8px;
} */
.pro-bnr-img > img {
  width: 100%;
}
.owl-carousel .owl-item {
  backface-visibility: hidden;
  float: left;
  margin-right: 10px;
  min-height: 1px;
}
.team-details {
  background: #f15b26 none repeat scroll 0 0;
  padding: 20px 0;
}
.team-details h5 {
  color: #303030;
  font-weight: 600;
  margin: 0 0 4px;
  transition: 0.3s;
}
.team-details span {
  color: #606060;
  transition: 0.3s;
}
.team-single {
  display: block;
  position: relative;
  transition: 0.4s;
}
/* ************ 10. Funfact area ************ */
.funfact-wrapper {
  display: flex;
  flex-wrap: wrap;
}
.funfact-single {
  max-width: 20%;
  flex-basis: 20%;
}
.funfact-count h3 {
  color: #474747;
  font-family: oswald;
  font-size: 34px;
  font-weight: 900;
  margin: 10px 0;
}
.funfact-count h5 {
  color: #303030;
  font-size: 16px;
  font-weight: 600;
  margin: 0;
}

/* ************ 11. Testimonial area ************ */
.testimonil-titel > h2 {
  color: #f15b26;
  margin: 0 0 20px;
}
.testimonial-single > p {
  color: #606060;
  font-style: italic;
  font-weight: 700;
  margin: 0;
}
.testimonial-single {
  background: #fafafa none repeat scroll 0 0;
  padding: 35px;
  position: relative;
  margin-bottom: 55px;
}
.testi-info h6 {
  color: #303030;
  display: block;
  font-size: 16px;
  font-style: italic;
  margin: 0 0 2px;
  position: relative;
}
.testi-info h6::after {
  border-top: 1px dashed;
  content: "";
  height: 0;
  left: 60%;
  position: absolute;
  top: 8px;
  width: 18px;
}
.testi-info span {
  color: #606060;
  font-size: 13px;
  font-style: italic;
  font-weight: 700;
}
.testi-img {
  bottom: -65px;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  text-align: center;
}
.testi-img > img {
  height: 111px;
  width: 111px !important;
  margin: auto;
}

/* ************ 12. Blog area ************ */
.blog-img h2 {
  background: #f15b26 none repeat scroll 0 0;
  color: #303030;
  display: block;
  font-family: oswald;
  font-size: 34px;
  font-weight: 900;
  height: 95px;
  left: 35px;
  line-height: 30px;
  margin: 0;
  padding-top: 20px;
  position: absolute;
  text-align: center;
  top: -20px;
  width: 75px;
}
.blog-img h2 span {
  color: #303030;
  display: block;
  font-size: 20px;
}
.blog-cnt-top {
  margin-bottom: 15px;
}
.blog-cnt-top h5 {
  color: #f15b26;
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 7px;
}
.blog-cnt-top h5 a:hover {
  color: #474747;
}
.blog-cnt-top > span {
  color: #606060;
  font-size: 12px;
  font-weight: 700;
}
.blog-area .owl-carousel .owl-stage-outer {
  padding-top: 20px;
}
/* ************ 13. Frequently ask question ************ */
.frequentialy-titel,
.frequentialy-accordion {
  padding-left: 40px;
}
.frequentialy-titel > h2 {
  margin: 0 0 20px;
  color: #f15b26;
}
.frequentialy-accordion {
  padding-top: 14px;
}
.frequentialy-accordion .panel-heading {
  padding: 0;
}
.frequentialy-accordion .card {
  background-color: transparent;
  border: 0;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
}
.frequentialy-accordion .card-header {
  border: none;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  padding: 0;
  background-color: transparent;
}
.frequentialy-accordion .card-header h5 .btn-link {
  color: #303030;
  display: block;
  font-size: 14px;
  font-weight: 600;
  padding: 15px 15px 15px 25px;
  position: relative;
  text-decoration: none;
  transition: all 0.3s ease 0s;
  width: 100%;
  text-align: left;
}
.frequentialy-accordion .card-header h5 .btn-link:before {
  content: "\f147";
  font-family: fontawesome;
  font-weight: 400;
  left: 0px;
  position: absolute;
  top: 0px;
  padding: 15px 15px 15px 0px;
  transition: all 0.3s ease 0s;
}
.frequentialy-accordion .card-header h5 .btn-link.collapsed:before {
  content: "\f196";
}
.frequentialy-accordion .card-body {
  padding: 0 15px 0 28px;
}
.frequentialy-accordion .card-body p {
  margin: 0;
}

/* ************ 14. Newsletter from ************ */
.from-box {
  display: block;
  margin: 0 auto;
  position: relative;
  width: 712px;
}
.from-box input {
  background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
  border: medium none;
  border-radius: 0;
  color: #fff;
  font-size: 14px;
  height: 40px;
  padding: 5px 20px;
}
.from-box .search-button {
  background: #303030 none repeat scroll 0 0;
  border: medium none;
  border-radius: 0;
  bottom: 0;
  color: #f15b26;
  font-family: lato;
  font-size: 14px;
  font-weight: 700;
  height: 40px;
  position: absolute;
  right: 0;
  text-transform: uppercase;
  transition: all 0.4s ease 0s;
  width: 160px;
}
/* Mail Chimp */
.mailchimp-submitting {
  color: #31708f;
}
.mailchimp-success {
  color: #3c763d;
}
.mailchimp-error {
  color: #a94442;
}

/* ************ 15. Footer area css ************ */
.footer-top-img {
  /* float: left; */
  margin-right: 95px;
  /* background: #fff; */
}
.footer-top-content {
  display: block;
  overflow: hidden;
  padding-top: 53px;
}
.footer-top-content > p {
  color: #919191;
  margin: 0 0 25px;
}
.footer-top-content ul li a {
  border: 1px solid #989898;
  color: #989898;
  display: block;
  height: 30px;
  line-height: 30px;
  margin-right: 16px;
  text-align: center;
  width: 30px;
  transition: 0.3s;
}
.footer-top-content ul li a:hover {
  color: #f15b26;
  border-color: #f15b26;
}
.fotter-single-area > h4 {
  color: #f15b26;
  display: block;
  font-size: 18px;
  font-weight: 600;
  margin: 0 0 30px;
  position: relative;
}
.contact-details li {
  font-size: 12px;
  font-weight: 300;
  margin-bottom: 20px;
  transition: all 0.3s ease 0s;
  display: block;
}
.contact-details li:last-child {
  margin: 0;
}
.contact-details ul li img {
  color: #fff;
  float: left;
  font-size: 14px;
  margin-right: 20px;
  margin-top: 10px;
}
.contact-details p {
  color: #919191;
  display: block;
  font-size: 13px;
  margin: -5px 0 0;
  overflow: hidden;
  padding-bottom: 0;
  padding-top: 0;
}
.footer-menu p {
  color: #919191;
  margin: 10px;
  font-size: 16px;
}
.footer-menu ul li {
  display: block;
}
.footer-menu ul li a {
  color: #919191;
  cursor: pointer;
  display: block;
  font-size: 13px;
  font-weight: 400;
  overflow: hidden;
  padding-bottom: 12px;
  transition: 0.3s;
}
.footer-menu ul li a:hover {
  color: #f15b26;
}
.post-single {
  margin-bottom: 25px;
}
.post-single:last-child {
  margin: 0;
}
.post-single > p {
  color: #919191;
  font-size: 13px;
  margin: 0 0 10px;
}
.post-single > a {
  color: #f15b26;
  font-family: lato;
  font-size: 12px;
  transition: all 0.3s ease 0s;
}
.post-single > a:hover,
.footer-bottom > p a {
  color: #919191;
}
.footer-bottom {
  padding: 18px 0;
  text-align: center;
}
.footer-bottom > p,
.footer-bottom > p a {
  color: #fff;
  font-size: 13px;
  margin: 0;
  transition: all 0.3s ease 0s;
}
.footer-bottom > p a:hover {
  color: #f15b26;
}
.footer-bottom i {
  color: red;
}
.testi-signal {
  width: 100px;
}
.testi-signal2 {
  width: 150px;
}
.testi-signal3 {
  width: 200px;
  height: 400px;
  border: 2px solid #f6f6f6;
  border-radius: 10px;
  padding: 10px;
}
.blog-content {
  margin-top: 10px;
}
.blog-content .date-text,
.blog-content .info-text {
  font-size: 14px;
  color: #999;
}
.blog-content h4 {
  font-size: 18px;
  font-weight: 700;
  margin-top: 10px;
}
/* ************ 15. 轮播图样式优化 ************ */
/* 轮播图容器定位和响应式设置 */
.slider.slider-for {
  position: relative;
  width: 100vw;
  height: 100vh;
  min-height: 500px;
  max-height: 900px;
}

/* 轮播图项目样式 */
.slider-item.slickslider {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

/* 轮播图图片响应式样式 */
.slider-item.slickslider img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* 轮播图箭头样式 */
.slick-prev,
.slick-next {
  border: 1px solid #f15b26;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  z-index: 5;
  font-size: 0;
  transition: all 0.3s ease;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: transparent !important;
}

.slick-prev:hover,
.slick-next:hover {
  background: rgba(241, 91, 38, 0.8) !important;
}

.slick-prev {
  left: 30px;
}

.slick-next {
  right: 30px;
}

.slick-prev i,
.slick-next i {
  color: #fff;
  font-size: 20px;
  line-height: 50px;
}

.slick-prev:before,
.slick-next:before {
  display: none;
}

/* 响应式媒体查询 */
/* 4K和超宽屏优化 */
@media (min-width: 4096px) {
  .slider.slider-for {
    max-height: 1900px;
  }
}
@media (min-width: 2560px) and (max-width: 4095px) {
  .slider.slider-for {
    max-height: 1200px;
  }
}

/* 2K屏幕优化 */
@media (min-width: 1920px) and (max-width: 2559px) {
  .slider.slider-for {
    height: 80vh;
    max-height: 1080px;
  }
}

/* 标准桌面屏幕 */
@media (min-width: 1200px) and (max-width: 1919px) {
  .slider.slider-for {
    height: 70vh;
    max-height: 900px;
  }
}

/* 平板设备 */
@media (min-width: 768px) and (max-width: 1199px) {
  .slider.slider-for {
    height: 60vh;
    min-height: 400px;
    max-height: 700px;
  }
}

/* 移动设备 */
@media (max-width: 767px) {
  .slider.slider-for {
    height: 50vh;
    min-height: 300px;
    max-height: 500px;
  }
}

/* ************ 16. ScrollUp ************ */
#scrollUp {
  background: #f15b26 none repeat scroll 0 0;
  border-radius: 0px;
  bottom: 15px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  color: #fff;
  font-size: 28px;
  height: 40px;
  line-height: 35px;
  position: fixed;
  right: 15px;
  text-align: center;
  transition: all 0.3s ease 0s;
  width: 40px;
  z-index: 200;
}
#scrollUp:hover {
  background: #555555;
}

/*---------------- 17. Breadcrumbs ------------------ */
.breadcrumbs-area {
  background-image: url("../img/bg/1.png");
  background-position: center center;
  background-size: cover;
}
.breadcrumbs-area {
  position: relative;
}
.breadcrumbs-area::before {
  background-color: #000;
  bottom: 0;
  content: "";
  left: 0;
  opacity: 0.6;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
}
h2.page-title {
  color: #fff;
  font-size: 30px;
  letter-spacing: 2px;
  margin-bottom: 15px;
  text-transform: uppercase;
  font-weight: 700;
}
.breadcrumbs > p {
  color: #ccc;
  display: inline-block;
  font-size: 16px;
  text-transform: uppercase;
}
.breadcrumbs > p > span {
  color: #f15b26;
}
/*---------------- 18. blog page------------------ */
h3.leave-comment-text {
  display: inline-block;
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 30px;
  padding-bottom: 10px;
  position: relative;
  text-transform: capitalize;
}

h3.leave-comment-text::before {
  background: #f15b26 none repeat scroll 0 0;
  bottom: 0;
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  right: 0;
  transition: all 0.4s ease 0s;
  width: 50%;
}
.blog-search > form {
  position: relative;
}
.blog-search input[type="text"] {
  background-color: #fff;
  border: 1px solid #f15b26;
  color: #666666;
  height: 40px;
  line-height: 28.8px;
  margin: 0;
  outline: medium none;
  padding: 5px 46px 5px 15px;
  position: relative;
  transition: all 0.4s ease 0s;
  width: 100%;
}

.blog-search button.submit {
  background-color: #f15b26;
  border: 1px solid #f15b26;
  color: #fff;
  font-size: 13px;
  height: 40px;
  padding: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: all 0.4s ease 0s;
  width: 45px;
}
.blog-search button.submit:hover {
  background-color: #464646;
  border: 1px solid #464646;
  color: #fff;
}

.blog-right-sidebar-top li {
  border-bottom: 1px solid #eee;
  display: block;
}
.blog-right-sidebar-top li a {
  transition: all 0.3s ease 0s;
  display: block;
  padding: 10px 0;
}
.blog-right-sidebar-top li a span {
  float: right;
}
.blog-right-sidebar-bottom li {
  display: inline-block;
  margin-bottom: 20px;
  margin-right: 14px;
}
.blog-right-sidebar-bottom a {
  border: 1px solid #f15b26;
  color: #666;
  display: inline-block;
  padding: 9px 15px;
  transition: all 0.4s ease 0s;
}
.blog-right-sidebar-bottom a:hover {
  background-color: #f15b26;
  border: 1px solid #f15b26;
  color: #fff;
}
.another-pages.text-center li {
  display: inline-block;
  margin: 0 5px;
}
.another-pages a.active {
  background-color: #f15b26;
  color: #fff;
}
.another-pages a {
  background-color: transparent;
  color: #333;
  display: inline-block;
  font-size: 20px;
  height: 30px;
  line-height: 27px;
  transition: all 0.3s ease 0s;
  width: 30px;
  border: 1px solid #f15b26;
  font-family: "Lato", sans-serif;
}
.another-pages a:hover {
  background-color: #f15b26;
  color: #fff;
}

/*---------------- 19. Contact page------------------ */
.contact-area .contact-details ul li img {
  margin-top: 0;
}
.contact-area .contact-details li {
  overflow: hidden;
}
.main-contact input,
.tnm-textarea textarea {
  background-color: #fff;
  border: inherit;
  border-radius: 0px;
  box-shadow: inherit;
  color: #666;
  font-size: 13px;
  height: 44px;
  outline: medium none;
  padding: 0 20px;
  transition: all 0.3s ease 0s;
  width: 100%;
}
.main-contact {
  margin-bottom: 15px;
}
.tnm-textarea textarea {
  height: 130px;
  padding: 15px 20px;
}
.submit input {
  background-color: #f15b26;
  border: 1px solid #f15b26;
  color: #fff;
  display: inline-block;
  font-size: 13px;
  font-weight: normal;
  margin-top: 35px;
  padding: 10px 40px 8px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.3s ease 0s;
}
.submit input:hover {
  background-color: transparent;
  color: #666;
  border: 1px solid #f15b26;
}
.form-control:focus {
  box-shadow: none;
  outline: 0 none;
}
.main-contact input::-webkit-input-placeholder,
.tnm-textarea textarea::-webkit-input-placeholder {
  /* Chrome */

  color: #666666;
  opacity: 1;
}
.main-contact input::-moz-placeholder,
.tnm-textarea textarea::-moz-placeholder {
  /* Firefox 19+ */

  color: #666666;
  opacity: 1;
}
#raees {
  height: 360px;
  width: 100%;
}
.submit {
  text-align: center;
}

/*----- 20. Blog details ------*/
.blog-3-column .blog-meta > span {
  padding-right: 15px;
}
.news-allreply {
  display: inline-block;
  float: left;
  text-align: center;
}
blockquote {
  background-color: #f6f6f6;
  border-left: 2px solid #f15b26;
  color: #666666;
  font-size: 14px;
  line-height: 26px;
  margin: 23px 0;
  padding: 14px 50px;
}
.blog-info-2 > p {
  color: #666;
}
h3.leave-comment-text {
  display: inline-block;
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 30px;
  padding-bottom: 10px;
  position: relative;
}
h3.leave-comment-text::before {
  background: #f15b26 none repeat scroll 0 0;
  bottom: 0;
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  right: 0;
  transition: all 0.4s ease 0s;
  width: 50%;
}
.nes-icon > a i {
  color: #666666;
  font-size: 14px;
  margin-top: 10px;
}
.news-allreply img {
  border-radius: 100%;
  width: 100%;
}
.blog-img-details {
  padding-left: 90px;
}
.blog-title > h3 {
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 6px;
  text-transform: capitalize;
}
.blog-title > span {
  color: #666666;
  display: block;
  margin-bottom: 7px;
}
.blog-middle-mrg {
  margin: 32px 0 33px 90px;
}
.leave-form input {
  background: transparent none repeat scroll 0 0;
  border: 1px solid #c1c1c1;
  color: #666666;
  font-size: 14px;
  height: 35px;
  margin-bottom: 30px;
  padding: 0 20px;
}
.leave-form input::-webkit-input-placeholder,
.text-leave textarea::-webkit-input-placeholder,
.main-input input::-webkit-input-placeholder,
.text-leave2 textarea::-webkit-input-placeholder {
  /* Chrome */

  color: #666666;
  opacity: 1;
}
.leave-form input::-moz-placeholder,
.text-leave textarea::-moz-placeholder,
.main-input input::-moz-placeholder,
.text-leave2 textarea::-moz-placeholder {
  /* Firefox 19+ */

  color: #666666;
  opacity: 1;
}
.leave-form input:focus,
.text-leave textarea:focus {
  border: 1px solid #f15b26;
}
.text-leave textarea {
  background: transparent none repeat scroll 0 0;
  border: 1px solid #c1c1c1;
  color: #666666;
  height: 165px;
  margin-bottom: 30px;
  padding: 20px;
  font-size: 14px;
}
.text-leave button.submit {
  background-color: #f15b26;
  border: 1px solid #f15b26;
  color: #fff;
  font-size: 12px;
  line-height: 30px;
  padding: 5px 20px 2px;
  text-transform: uppercase;
  transition: all 0.3s ease 0s;
}
button.submit:hover {
  background-color: transparent;
  color: #464646;
}
.nes-icon > a {
  border: 1px solid #ddd;
  color: #666;
  display: inline-block;
  margin-top: 8px;
  padding: 0 5px;
  text-transform: capitalize;
  transition: all 0.3s ease 0s;
}
.nes-icon > a:hover {
  border: 1px solid #f15b26;
  color: #fff;
  background-color: #f15b26;
}
.blog-meta > span {
  margin-right: 15px;
}
.blog-meta > span a {
  color: #444;
  transition: all 0.3s ease 0s;
}
.blog-meta > span a:hover {
  color: #f15b26;
}
.blog-meta > span i {
  padding-right: 5px;
}
.blog-info-2 {
  margin-top: 17px;
}
.blog-info-2 h3 {
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 1px;
  line-height: 25px;
  margin: 15px 0 20px;
  text-transform: uppercase;
}
.services-area.gray-bg {
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.section-title span {
  font-size: 16px;
  font-weight: 500;
  text-transform: uppercase;

  letter-spacing: 2px;
  display: inline-block;
  margin: 0 10px;
}
.section-title h5 {
  color: #f15b26;
  margin-bottom: 15px;
  font-weight: 700;
}
.section-title h2 {
  font-size: 48px;
  padding-bottom: 0;
  margin-bottom: 10px;
  position: relative;
}
.section-title h2::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 4px;
  width: 60px;
  background: #f15b26;
  margin: auto;
  transition: 0.3s;
  display: none;
}
section:hover .section-title h2::before {
  width: 100px;
}

.services-box .services-content2 {
  margin-top: -70px;
  padding-top: 105px;
  padding-left: 40px;
  padding-right: 40px;
  padding-bottom: 50px;
  transition: 0.3s;
}
.services-content2 h5 {
  font-size: 24px;
  margin-bottom: 15px;
  font-weight: 700;
}
.services-box .services-content2:hover {
  background: #fff;
  box-shadow: 0px 16px 32px #6666660f;
}
.services-box .ss-btn2 {
  width: 60px;
  height: 60px;
  background: #f15b26 0% 0% no-repeat padding-box;
  box-shadow: 0px 16px 32px #f15b2633;
  display: none;
  color: #fff;
  line-height: 60px;
  font-size: 31px;
  border-radius: 50%;
  position: absolute;
  left: 42%;
  bottom: -25px;
  transition: 0.3s;
}
.services-box .services-content2:hover .ss-btn2 {
  display: inline-block;
}
.about-title > span {
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  color: #fff;
  background: #f15b26;
  height: 30px;
  display: inline-block;
  text-align: center;
  line-height: 30px;
  margin-bottom: 30px;
}
.about-title h5 {
  color: #f15b26;
  font-size: 22px;
  margin-bottom: 15px;
  font-weight: 700;
}
.about-title h2 {
  font-size: 38px;
  line-height: 1.4;
}
.about-title p span {
  display: inline-block;
  height: 2px;
  width: 40px;
  background: #f15b26;
  margin-right: 20px;
  position: relative;
  top: -5px;
}
.about-title p {
  font-size: 18px;
  margin-bottom: 0;
}
.ab-ul {
  margin-top: 30px;
}
.ab-ul li {
  float: left;
  width: 50%;
  margin-bottom: 10px;
}
.ab-ul li .icon i {
  width: 40px;
  height: 40px;
  background: #ffffff 0% 0% no-repeat padding-box;
  border: 2px solid #eeeeee;
  border-radius: 50%;
  text-align: center;
  line-height: 40px;
  margin-right: 20px;
  color: #f15b26;
  float: left;
}
.banner-bg {
  display: inline-block;
}
.banner-shadow {
  display: inline-block;
  height: auto;
  box-shadow: 0px 5px 40px rgba(0, 140, 255, 0.5);
  border: 1px solid #71b9f3;
  border-radius: 4px;
}
.banner-shadow2 {
  display: inline-block;
  height: auto;
  box-shadow: 0px 5px 40px rgba(37, 37, 37, 0.5);
  border: 1px solid #bdbdbf;
  border-radius: 4px;
}
.area-top {
  padding-top: 100px;
  border-bottom: 1px solid #e6e6e6;
  padding-bottom: 100px;
}
.area-top p span {
  color: #f15b26;
}
.sub-title {
  display: block;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 10px;
}
.sub-title span {
  color: #f15b26;
}
.study-route {
  display: flex;
}
.study-route div {
  width: 50%;
}
.my-masonry {
  width: 100%;
}
.portfolio .button-group {
  padding-bottom: 0;
}
.button-group {
  padding-bottom: 15px;
}
.button-group button {
  border: none;
  background: none;
  transition: 0.3s;
  font-size: 14px;
  padding-bottom: 15px;
  cursor: pointer;
  outline: none;
  color: #777777;
  font-weight: 500;
  text-transform: uppercase;
  position: relative;
  padding-top: 15px;
  padding-left: 25px;
  padding-right: 25px;
  border-radius: 30px;
}
.button-group button:hover {
  color: #f15b26;
}
.button-group button.active {
  background: #f15b26;
  color: #fff;
  box-shadow: inset 0 -2px 0 #f15b26;
}
.portfolio .col3 .grid-item {
  /* width: 33.33%; */
  width: 25%;
  margin: 0;
  padding: 5px 15px;
}
.grid-item img {
  width: 260px;
  height: 150px;
}
.case-study-box:hover .case-study-content02 .ss-btn {
  display: inline-block;
}
.case-study-box .case-study-content02 {
  transition: all 0.5s ease 0s;
}
.case-study-box:hover .case-study-content02 {
  transform: translate(0, -62px);
}
.case-study-box {
  box-shadow: 0px 16px 32px #181e230a;
}
.case-study-content {
  padding: 30px 30px;
  background: #ffffff 0% 0% no-repeat padding-box;
  box-shadow: 0px 16px 32px #181e230a;
}
.case-study-content span {
  margin-bottom: 10px;
  color: #999;
  display: inline-block;
}
.topRec_List dl {
  background: #ff9001;
}
.topRec_List dl,
.maquee {
  width: 1200px;
  overflow: hidden;
  margin: 0 auto;
  color: #7c7c7c;
}
.topRec_List dd {
  float: left;
  text-align: center;
}
.topRec_List dl dd {
  width: 10%;
  height: 50px;
  line-height: 40px;
  color: white;
  font-size: 16px;
  padding-top: 9px;
}
.topRec_List dl dd:first-child + dd + dd + dd + dd {
  width: 20%;
  height: 50px;
  line-height: 40px;
}
.topRec_List p {
  margin-top: 10px;
  margin-left: 1100px;
}
.topRec_List ul {
  height: 195px;
}
.topRec_List li {
  overflow: hidden;
  line-height: 40px;
  text-align: center;
  font-size: 12px;
  border-bottom: 1px solid #ccc;
}
.topRec_List {
  background: #f0f0f0;
  padding-bottom: 88px;
}
.topRec_List li div {
  float: left;
  margin: 5px 0;
  font-size: 14px;
  color: #000;
}
.topRec_List li div {
  width: 10%;
}
.topRec_List li div.salary {
  background: #ff9001;
  border-radius: 20px;
  color: #fff;
}
.topRec_List li div:nth-child(5) {
  width: 20%;
}
@media (min-width: 576px) {
  .container {
    max-width: 540px;
  }
}
@media (min-width: 768px) {
  .container {
    max-width: 750px;
  }
}
@media (min-width: 992px) {
  .container {
    max-width: 970px;
  }
}
@media (min-width: 1200px) {
  .container {
    max-width: 1170px;
  }
}