/*
Theme Name:Child Theme for Divi
Theme URI: https://developer.wordpress.org/themes/advanced-topics/child-themes/
Description: Child Theme For Divi
Template: Divi
Version: 1.0
*/

/* Start your custom CSS bellow this comment
============================================ */

.contentBox {
            text-align: center;
            font-family: 'Inter', sans-serif;
        }
        .contentBox h1 {
            color: #1C508C;
            font-weight: 600;
        }
        .gridBox {
            max-width: 950px;
            margin: 0 auto;
            color: #515151;
            font-weight: 600;
            font-size:15px;
            display: grid;
            /* grid-template-columns: repeat(6, minmax(0, 1fr));
            grid-template-rows: repeat(2, minmax(0, 1fr)); */
            grid-template-columns: repeat(6, 1fr);
            grid-template-rows: repeat(2, 1fr);
            column-gap: 20px;
        }
        @media screen and (max-width: 1200px) {
            .gridBox {
/*                 grid-template-columns: repeat(4, minmax(0, 1fr));
                grid-template-rows: repeat(3, minmax(0, 1fr)); */
                grid-template-columns: repeat(4, 1fr);
                grid-template-rows: repeat(3, 1fr);
                column-gap: 0px;
            }
        }
        @media screen and (max-width: 700px) {
            .contentBox h1 {
                font-size: 25px;
            }
            .gridBox {
                /* grid-template-columns: repeat(2, minmax(0, 1fr));
                grid-template-rows: repeat(6, minmax(0, 1fr)); */
                grid-template-columns: repeat(2, 1fr);
                grid-template-rows: repeat(6, 1fr);
            }
        }
        .gridBox div p {
            color: #515151;
            max-width: 140px;
            margin: 20px auto;
        }


@font-face {
        font-family: 'Space Grotesk';
        src: url('your-font-file-url.woff2') format('woff2'),
             url('your-font-file-url.woff') format('woff'),
             url('your-font-file-url.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
    }
.timelineBox {
        /* font-family: sans-serif; */
        background: #1C508C !important;
        background-color: #1C508C !important;
  border-radius:30px;
        color: white;
        padding: 40px;
        text-align: center;
      }
      .timelineBox h2,
      .timelineBox h1 {
        font-weight: 500;
        font-family: 'Space Grotesk', sans-serif;
      }
        .timelineBox h1 {
            font-size: 22px;
        }
        .timelineBox h2 {
            font-size: 18px;
        }
      .cd-container {
        width: 90%;
        max-width: 1080px;
        margin: 0 auto;
        background: transparent;
        padding: 0 10%;
        border-radius: 2px;
      }
      .cd-container::after {
        content: "";
        display: table;
        clear: both;
      }
      /* --------------------------------
        Timeline components
        -------------------------------- */
      #cd-timeline {
        position: relative;
        padding: 2em 0;
      }
      #cd-timeline::before {
        content: "";
        position: absolute;
        top: 50%;
        transform: translate(0%, -50%);
        left: 0px;
        height: 100%;
        max-height: 79%;
        width: 2px;
        border-radius: 4px;
        background: #FFFFFF;
      }
      @media only screen and (min-width: 1170px) {
        #cd-timeline {
          margin-top: 3em;
          margin-bottom: 3em;
        }
        #cd-timeline::before {
          left: 50%;
          margin-left: -2px;
        }
      }
      .cd-timeline-block {
        position: relative;
        margin: 2em 0;
      }
      .cd-timeline-block:after {
        content: "";
        display: table;
        clear: both;
      }
      .cd-timeline-block:first-child {
        margin-top: 0;
      }
      .cd-timeline-block:last-child {
        margin-bottom: 0;
      }
      @media only screen and (min-width: 1170px) {
        .cd-timeline-block {
          margin: 2.5em 0;
        }
        .cd-timeline-block:first-child {
          margin-top: 0;
        }
        .cd-timeline-block:last-child {
          margin-bottom: 0;
        }
      }
      .cd-timeline-img {
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
        left: 2px;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        border: 1px solid white;
        box-shadow: 0 0 0 15px #1C508C
      }
      .cd-timeline-img {
        background: #1C508C;
        text-align: center;
        align-content: center;
      }
      @media only screen and (min-width: 1170px) {
        .cd-timeline-img {
          width: 40px;
          height: 40px;
          left: 50%;
          top: 50%;
          transform: translate(0%, -50%);
          margin-left: -23px;
          box-shadow: 0 0 0 15px #1C508C
        }
      }
      .cd-timeline-content {
        position: relative;
        margin-left: 30px;
        margin-right: 10px;
        background: #3E6A9D;
        border: 1px solid #7897BA;
        border-radius: 12px;
        padding: 10px;
        text-align: left;
      }
      .cd-timeline-content h2 {
        color: rgba(255, 255, 255, 0.9);
        margin-top: 0;
        margin-bottom: 5px;
        font-size: 18px;
      }
      .cd-timeline-content p {
        color: rgba(255, 255, 255, 0.7);
        font-size: 13px;
        font-size: 0.8125rem;
      }
      .cd-timeline-content p {
        margin: 1em 0;
        line-height: 1.6;
      }
      @media only screen and (min-width: 768px) {
        .timelineBox h1 {
            font-size: 36px;
        }
        .timelineBox h2 {
            font-size: 28px;
        }
        .cd-timeline-content h2 {
          font-size: 20px;
          font-size: 1.25rem;
        }
        .cd-timeline-content p {
          font-size: 14px;
          line-height: 20px;
        }
      }
      @media only screen and (min-width: 1170px) {
        .cd-timeline-content {
          color: white;
          margin-left: 0;
          padding: 0 0.9em;
          padding-top: 1.0em;
          padding-bottom: 0;
          width: 36%;
          margin: 0 5%;
        }
        .cd-timeline-content::before {
          top: 24px;
          left: 100%;
          border-color: transparent;
        }
        .cd-timeline-block:nth-child(even) .cd-timeline-content {
          float: right;
        }
        .cd-timeline-block:nth-child(even) .cd-timeline-content::before {
          top: 24px;
          left: auto;
          right: 100%;
          border-color: transparent;
        }
      }
.timelineBox h2,
      .timelineBox h1 {
        color: #fff;
      }