.cox-box-content{border-radius: 8px; border: 1px solid rgba(24, 160, 251, 0.20); background: #FFF; box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.04);
    font-weight: 900; padding:7px 20px; text-align: center; line-height: 28px;}
    .cox-box-icon { position: relative;  bottom: -3px;}
    .cos-head {  padding: 29px 0;}
    .cos-head:after {content:""; width:100%; height:35px; bottom:0; position: absolute; 
        background-image: url(https://kissflow.com/hubfs/ArasiyalArivu/aa-chapter-grey-dot.svg);
        background-repeat: no-repeat;
        background-position: center bottom;}
    .cox-bottom-boxs .cox-box:before {
        content: "";  width: 100%;  height: 36px;  top: 0;  position: absolute;   background-image: url(https://kissflow.dev/hubfs/Arasiyal%20Arivu/Vector%206.svg);
        background-repeat: no-repeat;  background-position: center top;   left: 0;}
    .cox-bottom-boxs .cox-box {    padding-top: 52px;}
    .cox-bottom-boxs:before { content: "";  width: 83%;  height: 2px;   position: absolute;  background-image: url(https://kissflow.dev/hubfs/Arasiyal%20Arivu/Vector%203.png);
        background-repeat: repeat-x;  background-size: contain;  background-position: center;  top: 0;  left: 90px;}
    .cox-bottom-boxs { gap: 15px;}
    .cox-box:first-child {
        order: 2;
    }
    .cox-box:nth-child(2) {
        order: 3;
    }
    .cox-box:nth-child(3) {
        order: 1;
    }
    .cox-box:nth-child(4) {
        order: 4;
    }
    .cox-box-content span {   font-size: 14px;}
    
    @media only screen and (min-width: 100px) and (max-width: 1199px) {
      .cox-bottom-boxs:before{width: 80.4%;}
      @media only screen and (max-width: 991px) { 
        .cox-bottom-boxs .cox-box {   max-width: 25%;}
        .cox-bottom-boxs:before {   width: 75.4%;}
        .cox-box-content { padding: 7px 12px;  word-break: break-word;}
      }
        @media only screen and (max-width: 767px) { 
      .cox-bottom-boxs {gap: 0; display: inline-flex; flex-wrap: wrap; justify-content: space-between;}
      .cox-bottom-boxs .cox-box {  width: 49.5%;  padding-right: 40px; padding-top: 30px;}
      .cox-bottom-boxs .cox-box:nth-child(2n) { padding-right: 0; padding-left: 40px;}
     /* .cox-bottom-boxs .cox-box::before { background-image: url(https://kissflow.dev/hubfs/Arasiyal%20Arivu/Vector%206.png);
      background-position: right 55%; height: 114%; left: inherit; top: 0; right: 0;  bottom: 0;}
      .cox-bottom-boxs .cox-box:nth-child(2n)::before{ background-image: url(https://kissflow.dev/hubfs/Arasiyal%20Arivu/Vector%20right.png); background-position: left 55%;}
      .cox-bottom-boxs::before {background-image: url(https://kissflow.dev/hubfs/Arasiyal%20Arivu/Vector%203-1.png); background-repeat: repeat-y;
    background-size: contain; height: 95%; left: 49.8%; width: 2px;    top: -25px;}
      .cox-bottom-boxs .cox-box:nth-child(4)::before { background-position: left 63%;}
      .cox-bottom-boxs .cox-box:nth-child(3)::before { background-position: right 63%;}*/
      .cos-head::after, .cox-bottom-boxs .cox-box:before {content:none;}
          .cox-bottom-boxs .cox-box {   max-width: 49.5%;}
          .cox-box:first-child, .cox-box:nth-child(2), .cox-box:nth-child(3), .cox-box:nth-child(4) {   order: inherit;}
          .cox-box-content {   padding: 7px 20px;}
          .chapter-officers-section .container {  max-width: 100%;}
          .cos-head {   padding: 29px 0 0;}
          .cox-cen {   width: auto; max-width: 90%;  display: flex;   align-items: center;   justify-content: right;    flex-wrap: revert;    flex-direction: column;}
         .cox-bottom-boxs:before {  background-image: url(https://kissflow.dev/hubfs/Arasiyal%20Arivu/Group%2035808.svg);   background-repeat: repeat-y;
        background-size: contain;   height: 94%;   left: 0;   top: 0;   width: 100%;}
          .cox-bottom-boxs .cox-box:nth-child(2n) .cox-cen {   margin: 0 0 0 auto;}
      }
      @media only screen and (max-width: 540px) { 
        .cox-box-content {   padding: 7px 10px;}
      }
      @media only screen and (max-width: 495px) { 
        .cox-bottom-boxs:before{height: 94%;}
       /* .cox-bottom-boxs .cox-box:nth-child(2n):before, .cox-bottom-boxs .cox-box:nth-child(4):before{background-position: left 50%; height: 100%;}
        .cox-bottom-boxs .cox-box:before, .cox-bottom-boxs .cox-box:nth-child(3):before { background-position: right 50%; height: 100%;}*/
        .cos-head {    padding: 29px 0 0 0;}
        .cox-box-content span {  font-size: 12px;}
        .cox-box-content{font-size: 14px;   line-height: 23px;}
        .cox-cen{max-width: 100%;}
        .cox-bottom-boxs .cox-box {   max-width: 45%;}    
       }
      @media only screen and (max-width: 440px) { 
        .cox-bottom-boxs .cox-box {  max-width: 47%;  padding-top: 14px; padding-right: 30px;}
        .cox-box-content { font-size: 12px;   line-height: 21px;}
        .cox-bottom-boxs .cox-box:nth-child(2n) {  padding-left: 30px;}
        .cox-box-content span {  font-size: 8px;}
      }
      @media only screen and (max-width: 395px) { 
        .cox-box-content {  font-size: 11px;  line-height: 18px;}
        .cox-bottom-boxs .cox-box {   max-width: 50%;}
      }
       @media only screen and (max-width: 373px) { 
        .cox-bottom-boxs:before {  content:none;}
         .cox-bottom-boxs .cox-box:nth-child(2n) {  padding-left: 5px;}
         .cox-cen { align-items: stretch;   width: 100%;}
         .cox-bottom-boxs .cox-box{padding-right: 5px;}
      }
    }