@media screen and (max-width: 1500px) {
  .dots {
    display: flex;
    flex-direction: column !important;
  }
  .dashed-line {
    border: none !important;
  }
  .dashed-line .dots-columns {
    flex-direction: column;
    width: 50%;
    margin: 0 auto !important;
  }
  .dashed-line .dots-columns .timeline-bloc-content {
    margin-bottom: 3rem;
  }
}

@media screen and (max-width: 1480px) {
  .solutions-bloc-content {
    display: flex;
    flex-direction: column;
  }
}

@media only screen and (max-width: 1020px) {
  .hidden {
    display: block !important;
  }
  .main-wrapper,
  .main-wrapper-2 {
    padding: 1rem 0;
  }
  #header .header-container .header_logo {
    width: 10rem;
  }
  .header-element {
    display: none;
  }
  .header {
    display: flex;
  }
  .logo-text,
  .terms-p p {
    font-size: 0.6rem;
  }
  .terms-bloc .terms-content {
    line-height: 1.7;
  }
  .terms-bloc {
    padding-top: 3rem;
    width: 85%;
  }
  .terms-bloc h1 {
    font-size: 1.2rem;
    padding-bottom: 1rem;
  }
  .terms-content p {
    font-size: 0.9rem;
  }
  .terms-bloc .terms-txt {
    text-align: left;
  }
  .terms-bloc h2 {
    font-size: 1rem;
    padding-bottom: 1rem;
  }
  .terms-bloc .horizontal {
    padding-bottom: 1rem;
  }
  .homepage-slider-text h2 {
    font-size: 1rem;
  }
  .mobile-menu.hidden {
    display: block;
    align-self: center;
  }
  #footer .footer-elements nav {
    font-size: 0.9rem;
  }
  #footer nav .footer-element {
    padding: 1rem 0;
  }
  #footer .copyright {
    font-size: 0.8rem;
  }
  .swiper-main .container {
    padding: 0;
  }
  #slider #precedent,
  #slider #suivant {
    font-size: 2rem;
  }
  #slider #slide {
    width: 100%;
    margin: 0 auto;
  }
  .contact-us-section .container {
    width: auto;
  }
  .contact-us-section .form-title {
    font-size: 1.2rem;
    margin: 3rem auto;
  }
  .contact-us-section .form {
    margin: 2rem auto;
    background-color: #fff;
    -webkit-box-shadow: 0 9px 20px 3px #a5a5a5;
    padding: 0;
    border-radius: 11px;
  }
  .contact-us-section .container {
    padding: 0 1rem;
  }
  .contact-us-section .contact-info {
    padding: 3rem 0;
    flex-direction: column;
  }
  .contact-us-section #contact-icon {
    padding-bottom: 3rem;
  }
  .contact-us-section .contact-info-bloc {
    font-size: 0.9rem;
  }
  .grid .form-group {
    width: 90%;
  }
  .grid .btn {
    width: 80%;
    font-size: 1.2rem;
    margin: 0 auto 2rem auto;
  }
  .main-wrapper,
  .main-wrapper-2 {
    flex-direction: column;
  }
  .main-wrapper .third-content,
  .main-wrapper .third-content-bloc,
  .main-wrapper-2 .third-content,
  .main-wrapper-2 .third-content-bloc {
    width: auto;
    padding: 1rem;
    box-shadow: none;
  }
  .main-wrapper .third-content .third-content-list,
  .main-wrapper .third-content-bloc .third-content-list,
  .main-wrapper-2 .third-content .third-content-list,
  .main-wrapper-2 .third-content-bloc .third-content-list {
    line-height: 1.4;
    font-size: 1rem;
  }
  .main-wrapper .third-content .third-content-list h2,
  .main-wrapper .third-content-bloc .third-content-list h2,
  .main-wrapper-2 .third-content .third-content-list h2,
  .main-wrapper-2 .third-content-bloc .third-content-list h2 {
    font-size: 1.1rem;
  }
  .main-wrapper .third-content .third-content-list .list-el,
  .main-wrapper .third-content-bloc .third-content-list .list-el,
  .main-wrapper-2 .third-content .third-content-list .list-el,
  .main-wrapper-2 .third-content-bloc .third-content-list .list-el {
    line-height: 1.7;
    padding-bottom: 2rem;
  }
  .main-wrapper .third-content .third-content-list .wrapper-list,
  .main-wrapper .third-content-bloc .third-content-list .wrapper-list,
  .main-wrapper-2 .third-content .third-content-list .wrapper-list,
  .main-wrapper-2 .third-content-bloc .third-content-list .wrapper-list {
    text-align: left;
  }
  .main-wrapper .forth-content,
  .main-wrapper-2 .forth-content {
    margin: 0 auto;
    width: 50%;
  }
  .last-content {
    flex-direction: column;
    padding: 2rem 0;
  }
  .last-content .last-content-row {
    width: 80%;
    padding-bottom: 5rem;
    margin: 0 auto;
  }
  .last-content .last-content-row .last-content-icon {
    width: 3rem;
  }
  .last-content .last-content-row .last-content-title {
    font-size: 0.9rem;
  }
  .last-content .last-content-row .info {
    font-size: 1rem;
  }
  .swiper-index {
    width: auto;
    height: auto;
  }
  .swiper-index .swiper-slide p {
    font-size: 1.2rem;
    width: 80%;
  }
  .swiper-index .swiper-button-next {
    display: none;
  }
  .swiper-index .swiper-button-prev {
    display: none;
  }
  .bloc-cloud-top {
    padding-top: 3rem;
  }
  .terms-bloc .terms-p p {
    font-size: 1rem;
  }
  .slider-bloc .solutions-data-img .solution-layout {
    height: 25rem;
    margin: 0;
  }
  .slider-bloc .solutions-data-img .solution-p {
    font-size: 1.2rem;
    width: 80%;
  }
  #cloud-content {
    margin: 0;
  }
  #cloud-content .public-cloud, #cloud-content .private-cloud {
    width: 100%;
    margin: 0;
  }
  .solutions-bloc h1 {
    font-size: 2rem;
  }
  #cloud-content .cloud-solution-h2 {
    font-size: 1.2rem;
    padding: 1rem;
  }
  #cloud-content .cloud-text {
    padding: 1rem 0;
    font-size: 1rem;
  }
  #cloud-content .private-cloud {
    padding: 0;
  }
  #cloud-content .img-cloud-content {
    padding: 1rem;
  }
  #cloud-content .cloud-solution-text {
    max-width: 100%;
    padding: 0 1.5rem;
  }
  .features-content h1 {
    font-size: 1.3rem;
    padding: 0;
  }
  .features-content .columns {
    flex-direction: column;
  }
  .features-content .columns .column {
    margin: 0 auto;
  }
  .features-content .columns .column p {
    font-size: 1.1rem;
    text-align: center;
    padding: 2rem 0;
  }
  #footer {
    padding: 0.5rem;
  }
  .card-shadow .solutions-H {
    font-size: 1.2rem;
  }
  .card-shadow ul {
    font-size: 1.1rem;
    padding: 1.5rem;
  }
  .container.news {
    height: 100%;
    padding: 0;
    margin: 0;
  }
  .container.news .swiper-button-prev, .container.news .swiper-rtl .swiper-button-next,
  .container.news .swiper-button-next, .container.news .swiper-rtl .swiper-button-prev {
    height: 0;
  }
  .container.news .swiper-button-next:after, .container.news .swiper-button-prev:after {
    font-size: 2rem;
    color: gray;
    opacity: 0.7;
  }
  .container.news .swiper-slide img {
    border-radius: 0;
  }
  .container.news .desc {
    border-radius: 0;
  }
  .contact-us-section .form {
    box-shadow: none;
  }
  .login {
    padding: 5rem 0 0 0;
    box-shadow: none;
    width: 80%;
  }
  .login h2 {
    font-size: 1.2rem;
  }
  .modal .modal-content {
    width: 85%;
    margin-top: 10rem;
    font-size: 1.1rem;
  }
  .modal .modal-content .close-btn {
    right: -1rem;
    top: -1rem;
  }
  .news .swiper-slide img {
    width: 100%;
    height: 20rem;
  }
  .solutions-bloc h2 {
    font-size: 1.2rem;
  }
  .timeline-news {
    margin: 0.5rem -7rem;
  }
  .timeline-bloc-content {
    margin-top: 3rem;
  }
  .solutions-bloc-content .first-bloc, .solutions-bloc-content .second-bloc {
    width: 93%;
    padding: 0;
  }
  .solutions-bloc h1 {
    padding-bottom: 0;
  }
}

@media only screen and (max-width: 1024px) {
  #footer .footer-element {
    padding-bottom: 1rem;
  }
  .swiper-button-prev,
  .swiper-button-next {
    display: none !important;
  }
  .main-wrapper,
  .main-wrapper-2 {
    flex-direction: column;
    width: 100%;
  }
  .main-wrapper .third-content,
  .main-wrapper .third-content-bloc,
  .main-wrapper-2 .third-content,
  .main-wrapper-2 .third-content-bloc {
    width: 85%;
    display: flex;
    margin: 0 auto;
  }
  .main-wrapper .forth-content,
  .main-wrapper-2 .forth-content {
    margin: 0 auto;
    padding-top: 2rem;
  }
  .features-content .columns {
    flex-direction: column;
    margin: 0 auto;
    width: 100%;
    justify-content: center;
  }
  .dots-columns {
    display: flex;
    flex-direction: column !important;
  }
  .dots-columns .timeline-bloc-content {
    margin-bottom: 3rem;
  }
  .dots-columns .timeline-news {
    text-align: center;
    width: 100%;
  }
  .dashed-line .dots-columns {
    margin: 0;
  }
}

@media screen and (max-width: 600px) {
  .dashed-line .dots-columns {
    width: auto;
  }
}