/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/

body{
  margin: 0;
  padding: 0;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: #222;
  background-color: #ffffff;
}
.container {
  margin:0 auto;
  max-width:1180px;
  width:100%;
}


.btn-primary {
  display: inline-block;
  background: #ff366b;
  color: #fff;
  padding: 10px 16px;
  text-decoration: none;
  border-radius: 0;
  margin-bottom: 0;
  font-weight: 600;
  border: 2px solid rgba(255, 215, 225, 1);
}
.second-primary {
  display: inline-block;
  color: #ff366b;
  text-decoration: none;
  border-radius: 0;
  margin-bottom: 0;
  font-weight: 700;
  letter-spacing: 0;
  font-size: 14px;
}
.description{
  color: rgba(83, 83, 83, 1);
  font-size: 16px;
  font-weight: 400;

}

.heading-h2 {
  font-size:32px;
  font-weight:700;
  margin:0px;
  color:#000000;
}

.heading-h3 {
  font-size:24px;
  font-weight:600;
  margin:0px;
}
p{
  color: #535353;
  font-size: 16px;
  margin: 10px 0;
}
header {
  border-bottom: 1px solid rgba(0, 0, 0, 0.2) !important;
  border-right: none !important;
  border-left: none !important;
  border-top: none !important;
}

@media (min-width:300px) and (max-width:520px) {
  .btn-primary {
    margin-bottom: 10px !important;
  }
}

@media (min-width:300px) and (max-width:767px) {
  .heading-h2 {
    font-size: 24px;
  }
  .container {
    padding: 0 20px !important;
  }
  .hero-section .container {
    padding: 0 0px;
  }
  .portfolio-card {
    width: inherit !important;
    flex: inherit;
    margin-bottom: 30px; !important;
  }
  .portfolio-cards {
    display: block!important;
  }
  .box1 {
    display: block!important;
  }
  .right-image-box{
    max-width: 280px!important;
    margin: 60px auto 0!important;
  }
  .cta-image {
    max-width: 260px!important;
    margin: 0 auto!important;
  }
  .leftcontent-form {
    display: block!important;
  }
  .contact-form {
    margin-top:40px!important;
  }
  .banner-left-img {
    max-width: 320px!important;
    margin: 60px auto 0!important;
  }

  .one-line-box {
    display: block !important;
  }
  .repater-module {
    width: 100%!important;
    margin-bottom: 30px!important;
  }
  .service-content {
    padding: 20px 0px!important;
  }

  .students-box {
    margin-top: 90px!important;
  }
  .hero-image img {
    max-width: 320px;
    height: auto;
    margin-bottom: 40px;
  }
  .services-section {
    padding: 40px 0px !important;
  }
  .clients-header {
    margin-bottom: 0px !important;
  }
  .cta-section {
    padding: 0px !important;
  }
  .contact-section {
    padding: 40px 0px !important;
  }
  .details-section {
    padding: 0px !important;
  }
  .work-section {
    padding: 40px 0px !important;
  }
  .work-card {
    padding: 30px !important;
  }
  .work-cards {
    margin: 0px !important;
  }
  .left-bg-img {
    width: 100% !important;
  }
  .hero-section {
    overflow: hidden;
  }
  .text-with-image {
    padding-top: 0px !important;
  }
  .clients-section {
    padding: 40px 0px !important;
  }
  .imageWithtextSection {
    padding: 40px 0 !important;
  }
}
@media (min-width:767px) and (max-width:991px) {
  .cta-image {   
    flex: inherit!important;
  }
  .students-box {
    margin-top: 90px!important;
  }
  .services-section {
    padding: 60px 0px !important;
  }
  .work-card h3 {
    margin: 80px 0 0 !important;
  }
  .left-bg-img {
    width: 100% !important;
  }
  .hero-content h1 {
    margin-top: 0px !important;
  }
  .new-saptrate-secton {
    margin-top: 0px !important;
  }
}
@media (min-width:767px) and (max-width:1100px) {

  .heading-h2 {
    font-size: 28px;
    line-height: normal;
  }
  .container {
    padding: 0 20px;
  }
  .clients-logos .logo-item:nth-child(5), .clients-logos .logo-item:nth-child(6), .clients-logos .logo-item:nth-child(7), .clients-logos .logo-item:nth-child(8) {
    border-bottom: 1px solid #ffd7e1 !important;
  }
  .clients-logos .logo-item:nth-child(5) {
    border-bottom: 1px solid #ffd7e1 !important;
    border-right:  1px solid #ffd7e1 !important;
  }
  .portfolio-cards, .portfolio-header {
    flex-direction: inherit!important;
  }
  .brand-text img {
    max-width: 400px!important;
    height: auto!important;
  }
  .service-content {
    padding: 20px 0px!important;
  }
  .clients-section {
    padding: 60px 20px 20px!important;
  }
  .portfolio-section {
    padding: 60px 0px !important;
  }
  .details-section {
    padding: 0px !important;
  }

}
@media (min-width:991px) and (max-width:1200px) {
  /*  .text-with-image {
  height: 450px!important;
} */
  #hs_cos_wrapper_dnd_area-module-2 .banner-left-img {
    max-width: 500px !important;
    width: 100% !important;
  }
  .hero-content h2 {
    font-size: 60px !important;
    line-height: 80px !important;
  }
  .students-box {
    position: inherit !important;
    bottom: 100px !important;
  }
  .details-section {
    padding: 0px !important;
  }
}
@media (min-width:1101px) and (max-width:1266px) {

  .container {
    padding: 0 20px;
  }
  .clients-logos .logo-item:nth-child(5), .clients-logos .logo-item:nth-child(6), .clients-logos .logo-item:nth-child(7), .clients-logos .logo-item:nth-child(8) {
    border-bottom: 1px solid #ffd7e1 !important;
  }
  .clients-logos .logo-item:nth-child(5) {
    border-bottom: 1px solid #ffd7e1 !important;
    border-right:  1px solid #ffd7e1 !important;
  }
  .portfolio-section .portfolio-cards .circle-img {
    right: -20px !important;
  }
  .work-section {
    padding: 80px 0px!important;
  }

}