/* Desktop view - Chrome */
@media (min-width: 1450px) and (max-width: 1920px) {
    #jiffy_header {
        margin-top: 100px;
    }

    #jiffy_content_start p {
        margin-left: -19px;
        width: 101%;
        text-align: justify;
        font-family: "Open Sans" !important;
    }

    #jiffy_content_start h2 {
        text-align: center;
        font-size: 24px;
        line-height: 34px;
        font-weight: bold;
        color: #de4235;
        margin-top: -2px;
        margin-bottom: 30px;
        font-family: "Open Sans" !important;
    }
   
    #jiffy_header h1 {
        margin-left: 86px;
        font-size: 28px;
        color: #222222 !important;
        font-weight: 400;
        font-family: "Open Sans" !important;
    }

    #jiffy_header a {
        color: #d83b2d;
        text-decoration: none;
    }

    #jiffy_header a:hover {
        color: #ea9040;
    }

    #jiffy_header p {
        color: #222222;
        font-size: 15px !important;
        line-height: 22px;
        font-weight: 450 !important;
        margin-left: 324px;
        font-family: "Open Sans" !important;
    }

    .highlighted {
        background-color: #de4235;
        color: white !important;
    }

    .toggle-button,
    .close-button {
        cursor: pointer;
        padding: 5px;
        background-color: transparent;
        color: grey;
        border: none;
        border-radius: 3px;
        margin-left: 5px;
    }

    .close-button {
        display: none;
        /* initially hide close button */
    }

    #first_card {
        margin-left: -12px;
        margin-right: 10px;
        color: #666666;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
        height: 250px;
    }

    .jiffy_first_img {
               width: 20%;
        height: 46%;
        margin: 10px;
    }

    .jiffy_description {
        text-align: center;
        font-size: 14px;
        font-weight: 400;
        color: #666666;
        font-family: "Open Sans" !important;
        margin-top: 90px;
        margin-right: 30px;
        margin-left: 20px;

        
    }

  

    .download-button {
        padding: 10px 20px;
      background-color: #D83B2D;
        color: white;
        border: none;
        font-size: 18px;
        text-decoration: none;
    }

    .button_container {
        display: flex;
        justify-content: flex-end;
        /* Move items to the end of the flex container (left for row direction) */
        align-items: center;
        /* Vertically center the flex items */
        margin-top: -80px;
        margin-right: 30px;
     
    }

    .scenarios_title {
        color: #de4235;
        font-size: 26px;
        font-family: "Open Sans" !important;
    }

    #second_card {
        /* margin-left: 10px;
    margin-right: 10px; */
        margin-left: -12px;
        margin-right: 10px;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
    }

    .list_item {
        list-style-type: disc;
        color: gold;
        text-align: justify;
        font-size: 13px;
        padding: 10px;
        color: #666666;
        font-family: "Open Sans" !important;
    }

    .scenarios_content {
        text-align: justify;
        font-size: 13px;
        padding: 10px;
        color: #666666;
        font-family: "Open Sans" !important;
    }

    .jimmy_button {
        border: 1px solid black;
        padding: 5px;
        display: inline-block;
        vertical-align: middle;
        background-color: #de4235;
        color: white;
        white-space: nowrap;
    }

    .red-text {
        color: red;
        font-size: 13px;
        margin-right: 10px;
        font-family: "Open Sans" !important;
    }

    .second_card_img {
        max-width: 140%;
        height: auto;
        margin: 60px;
    }

    #third_card {
        margin-left: -12px;
        margin-right: 10px;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
        background-color: #140e0e1f;
    }

    .calibri_content {
        text-align: justify;
        font-size: 13px;
        padding: 10px;
        color: #666666;
        font-family: "Open Sans" !important;
    }

    .jimmy_button_calibri {
        border: 1px solid black;
        padding: 5px;
        display: inline-block;
        vertical-align: middle;
        /*background-color: #de4235;*/
        color: white;
        white-space: nowrap;
        font-family: "Open Sans" !important;
    }

    .red-text_calibri {
        color: red;
        font-size: 13px;
        margin-right: 10px;
        font-family: "Open Sans" !important;
    }

    .third_card_img {
        max-width: 140%;
        height: auto;
        margin: 60px;
    }

    #fourth_card {
    margin-left: -10px;
        max-width: 100%;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
        background-color: #140e0e1f;
        margin-bottom: 20px;
        margin-top: 20px;
    }

    .stuff_title {
        color: #de4235;
        font-size: 26px;
        font-family: "Open Sans" !important;
    }

    .stuff_content {
        text-align: justify;
        font-size: 13px;
        padding: 10px;
        color: #666666;
        font-family: "Open Sans" !important;
    }

    .fourth-image-class {
        max-width: 140%;
        height: auto;
        margin: 60px;

    }
  .features ul {
    list-style-type: none; /* No bullets */
    padding: 0;
    margin: 0; /* Remove default margin */
}

.features ul li {
    margin-bottom: 10px;
    padding-left: 40px; /* Adjusted for the position of the custom check mark */
    position: relative; /* Needed to position the pseudo-element */
}

.features ul li::before {
    content: ''; /* Empty content for pseudo-element */
    background: url("https://excelsquare.com/wp-content/uploads/2015/12/tik2.png") no-repeat; /* Use the custom image for the check mark */
    background-size: contain; /* Ensure the image fits within the pseudo-element */
    width: 30px; /* Adjust width of the image */
    height: 30px; /* Adjust height of the image */
    position: absolute;
    left: 0; /* Adjust as needed */
    top: 0; /* Adjust if needed to vertically align */
}


}

/* Desktop view - Microsoft Edge */

@media (min-width: 1200px) and (max-width: 1366px) {
    #jiffy_header {
        margin-top: 100px;
    }

    #jiffy_content_start p {
        margin-left: -24px;
        width: 102%;
        text-align: justify;
        font-family: "Open Sans" !important;
    }

    #jiffy_content_start h2 {
        text-align: center;
        font-size: 24px;
        line-height: 34px;
        font-weight: bold;
        color: #de4235;
        margin-top: 2px;
        margin-bottom: 30px;
        font-family: "Open Sans" !important;
    }
    #jiffy_font {
        margin-left: 80px;
    }
    #jiffy_header h1 {
        margin-left: 86px;
        font-size: 28px;
        color: #222222 !important;
        font-weight: 400;
        font-family: "Open Sans" !important;
    }

    #jiffy_header p {
        color: #222222;
        font-size: 15px !important;
        line-height: 22px;
        font-weight: 450 !important;
        margin-left: 240px;
        font-family: "Open Sans" !important;
    }
    #jiffy_header a {
        color: #d83b2d;
        text-decoration: none;
    }

    #jiffy_header a:hover {
        color: #ea9040;
    }
    .highlighted {
        background-color: #de4235;
        color: white !important;
    }

    .toggle-button,
    .close-button {
        cursor: pointer;
        padding: 5px;
        background-color: transparent;
        color: grey;
        border: none;
        border-radius: 3px;
        margin-left: 5px;
    }

    .close-button {
        display: none;
        /* initially hide close button */
    }

    #first_card {
       margin-left: -18px;
        max-width: 101%;
        margin-right: -15px;
    }

    .jiffy_first_img {
                width: 24%;
        height: 34%;
        margin: 10px;
    }

    .jiffy_description {
        text-align: center;
        /* text-align: justify;  */
        font-size: 14px;
        font-weight: 400;
        font-family: "Open Sans" !important;
        margin-top: 60px;
        color: #666666;
    }

    .right-side {
        text-align: right;
        font-family: "Open Sans" !important;
    }

    .download-button {
        /* /* display: inline-block; */
        padding: 10px 20px;
        background-color: #D83B2D;
        color: white;
        border: none;
        margin-right: 6px;
        font-size: 18px;
        text-decoration: none;


    }

    .button_container {
        display: flex;
        justify-content: flex-end;
        /* Move items to the end of the flex container (left for row direction) */
        align-items: center;
        /* Vertically center the flex items */
        margin-top: -80px;
        margin-right: 30px;
    }

    .scenarios_title {
        color: #de4235;
        font-size: 26px;
        font-family: "Open Sans" !important;
    }

    #second_card {
        margin-left: -18px;
        max-width: 101%;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
    }

    .list_item {
        list-style-type: disc;
        text-align: justify;
        font-size: 13px;
        padding: 10px;
        color: #666666;
        font-family: "Open Sans" !important;
    }

    .scenarios_content {
        text-align: justify;
        font-size: 13px;
        padding: 10px;
        color: #666666;
        font-family: "Open Sans" !important;
    }

    .jimmy_button {
        border: 1px solid black;
        padding: 5px;
        display: inline-block;
        vertical-align: middle;
        background-color: #de4235;
        color: white;
        white-space: nowrap;
    }

    .red-text {
        color: red;
        font-size: 13px;
        font-family: "Open Sans" !important;
    }

    .second_card_img {
        max-width: 100%;
        height: auto;
        margin: 30px;
    }

    #third_card {
       margin-left: -18px;
        max-width: 101%;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
        background-color:#140e0e1f;
        font-family: "Open Sans" !important;
      
    }

    .calibri_content {
        text-align: justify;
        font-size: 13px;
        padding: 10px;
        color: #666666;
        font-family: "Open Sans" !important;
    }

    .jimmy_button_calibri {
        border: 1px solid black;
        padding: 5px;
        display: inline-block;
        vertical-align: middle;
        background-color: #de4235;
        color: white;
        white-space: nowrap;
    }

    .red-text_calibri {
        color: red;
        font-size: 13px;
        margin-right: 10px;
        font-family: "Open Sans" !important;
    }

    .third_card_img {
        max-width: 140%;
        height: auto;
        margin: 60px;
         background-color:#140e0e1f;
    }

    #fourth_card {
           margin-left: -18px;
            box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
            background-color: #00000009;
            margin-bottom: 20px;
            margin-top: 20px;
            width: 101%;
            font-family: "Open Sans" !important;

        /* margin-left: 17px;
            
            box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
            background-color: #00000009;
            font-family: "Open Sans" !important;
            max-width: 105%; */
    }

    .stuff_title {
        color: #de4235;
        font-size: 26px;
    }

    .stuff_content {
        text-align: justify;
        font-size: 13px;
        padding: 10px;
        color: #666666;
        font-family: "Open Sans" !important;
    }

    .third_card_img {
        max-width: 140%;
        height: auto;
        margin: 60px;
    }
    .features ul {
    list-style-type: none; /* No bullets */
    padding: 0;
    margin: 0; /* Remove default margin */
}

.features ul li {
    margin-bottom: 10px;
    padding-left: 40px; /* Adjusted for the position of the custom check mark */
    position: relative; /* Needed to position the pseudo-element */
}

.features ul li::before {
    content: ''; /* Empty content for pseudo-element */
    background: url("https://excelsquare.com/wp-content/uploads/2015/12/tik2.png") no-repeat; /* Use the custom image for the check mark */
    background-size: contain; /* Ensure the image fits within the pseudo-element */
    width: 30px; /* Adjust width of the image */
    height: 30px; /* Adjust height of the image */
    position: absolute;
    left: 0; /* Adjust as needed */
    top: 0; /* Adjust if needed to vertically align */
}

}

/* iPad view */
@media only screen and (min-width: 768px) and (max-width: 1023px) {
    #jiffy_header {
        margin-top: 100px;
    }

    #jiffy_content_start h2 {
        text-align: center;
        font-size: 24px;
        line-height: 34px;
        font-weight: bold;
        color: #de4235;
        margin-top: -2px;
        margin-bottom: 30px;
        font-family: "Open Sans" !important;
    }

    #jiffy_content_start {
        text-align: justify;
    }

    #first_card {
        width: 101%;
        margin-left: -4px;
    }

    .jiffy_first_img {
        width: 40%;
        height: 15%;
        margin: -10px;
    }

    .jiffy_description {
        text-align: center;
        /* text-align: justify;  */
        font-size: 14px;
        font-weight: 400;
        font-family: "Open Sans" !important;
        margin-left: 5px;
    }

    .right-side {
        text-align: right;
        font-family: "Open Sans" !important;
    }

   .download-button {
        display: inline-block;
        padding: 10px 20px;
        background-color: #D83B2D;
        color: white;
        border: none;  
        font-size: 18px;
        text-decoration: none;
        margin-bottom: 35px;
    }

    .toggle-button,
    .close-button {
        cursor: pointer;
        padding: 5px;
        background-color: transparent;
        color: grey;
        border: none;
        border-radius: 3px;
        margin-left: 5px;
    }

    .close-button {
        display: none;
        /* initially hide close button */
    }

    #jiffy_header p {
        display: none;
        font-family: "Open Sans" !important;
    }

    #jiffy_header h1 {
        text-align: center;
        font-family: "Open Sans" !important;
        font-size: 28px;
        color: #222222;
    }

    .scenarios_title {
        color: #de4235;
        font-size: 22px;
        font-family: "Open Sans" !important;
    }

    #second_card {
        margin-left: 0px;
        margin-left: -3px;
        width: 101%;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
    }

    .list_item {
        list-style-type: disc;
        text-align: justify;
        font-size: 13px;
        padding: 10px;
        color: #666666;
        font-family: "Open Sans" !important;
    }

    .scenarios_content {
        text-align: justify;
        font-size: 13px;
        padding: 10px;
        color: #666666;
        font-family: "Open Sans" !important;
    }

    .jimmy_button {
        border: 1px solid black;
        padding: 5px;
        display: inline-block;
        vertical-align: middle;
        background-color: #de4235;
        color: white;
        white-space: nowrap;
    }

    .red-text {
        color: red;
        font-size: 13px;
        font-family: "Open Sans" !important;
    }

    .second_card_img {
        max-width: 50%;
        height: auto;
        margin-top: 100px;
    }

    #third_card {
        margin-left: 0px;
        margin-left: -4px;
        width: 101%;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
        background-color: #140e0e1f;
        margin-bottom: -17px;
    }

    .calibri_content {
        text-align: justify;
        font-size: 13px;
        padding: 10px;
        color: #666666;
        font-family: "Open Sans" !important;
    }

    .jimmy_button_calibri {
        border: 1px solid black;
        padding: 5px;
        display: inline-block;
        vertical-align: middle;
        background-color: #de4235;
        color: white;
        white-space: nowrap;
    }

    .red-text_calibri {
        color: red;
        font-size: 13px;
        margin-right: 10px;
        font-family: "Open Sans" !important;
    }

    .third_card_img {
        max-width: 140%;
        height: auto;
        margin: 60px;
    }

    #fourth_card {
        margin-left: 1px;
       margin-left: -4px;
        width: 101%;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
        background-color: #00000009;
        margin-bottom: 20px;
        margin-top: 20px;
    }

    .stuff_title {
        color: #de4235;
        font-size: 22px;
        font-family: "Open Sans" !important;
    }

    .stuff_content {
        text-align: justify;
        font-size: 13px;
        padding: 10px;
        color: #666666;
        font-family: "Open Sans" !important;
    }

    .fourth-image-class {
        max-width: 140%;
        height: auto;
        margin: 60px;
        margin-top: 20px;
    }
    .features ul {
    list-style-type: none; /* No bullets */
    padding: 0;
    margin: 0; /* Remove default margin */
}

.features ul li {
    margin-bottom: 10px;
    padding-left: 40px; /* Adjusted for the position of the custom check mark */
    position: relative; /* Needed to position the pseudo-element */
}

.features ul li::before {
    content: ''; /* Empty content for pseudo-element */
    background: url("https://excelsquare.com/wp-content/uploads/2015/12/tik2.png") no-repeat; /* Use the custom image for the check mark */
    background-size: contain; /* Ensure the image fits within the pseudo-element */
    width: 30px; /* Adjust width of the image */
    height: 30px; /* Adjust height of the image */
    position: absolute;
    left: 0; /* Adjust as needed */
    top: 0; /* Adjust if needed to vertically align */
}

}

/* Mobile view */
@media only screen and (max-width: 767px) {
    #jiffy_header {
        margin-top: 100px;
    }

    #jiffy_content_start h2 {
        text-align: center;
        font-size: 24px;
        line-height: 34px;
        font-weight: bold;
        color: #de4235;
        margin-top: -2px;
        margin-bottom: 30px;
        font-family: "Open Sans" !important;
    }

    #jiffy_content_start {
        text-align: justify;
        font-family: "Open Sans" !important;
    }

    #jiffy_header h1 {
         text-align: center;
        font-family: "Open Sans" !important;
        font-size: 28px; 
        color: #222222;
    }

    #jiffy_header p {
        display: none;
    }

    .toggle-button,
    .close-button {
        cursor: pointer;
        padding: 5px;
        background-color: transparent;
        color: grey;
        border: none;
        border-radius: 3px;
        margin-left: 5px;
    }

    .close-button {
        display: none;
        /* initially hide close button */
    }

    #first_card {
        width: 101%;
       margin-left: -2px;
    }

    .jiffy_first_img {
        width: 60%;
        height: 30%;
        text-align: center;
        margin-left: 70px;
    }

    .jiffy_description {
        text-align: center;
        /* text-align: justify;  */
        font-size: 14px;
        font-weight: 400;
        font-family: "Open Sans" !important;
    }

    .right-side {
        text-align: center;
        font-family: "Open Sans" !important;
    }

    .download-button {
        display: inline-block;
        padding: 10px 20px;
        background-color: #D83B2D;
        color: white;
        border: none;

        font-size: 18px;
        text-decoration: none;
    }

    .scenarios_title {
        color: #de4235;
        font-size: 20px;
        font-family: "Open Sans" !important;
    }

    #second_card {
        margin-left: 0px;
         margin-right: 1px;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
    }

    .list_item {
        list-style-type: disc;
        text-align: justify;
        font-size: 13px;
        padding: 10px;
        color: #666666;
        font-family: "Open Sans" !important;
    }

    .scenarios_content {
        text-align: justify;
        font-size: 13px;
        padding: 10px;
        color: #666666;
        font-family: "Open Sans" !important;
    }

    .jimmy_button {
        border: 1px solid black;
        padding: 5px;
        display: inline-block;
        vertical-align: middle;
        background-color: #de4235;
        color: white;
        white-space: nowrap;
    }

    .red-text {
        color: red;
        font-size: 13px;
        font-family: "Open Sans" !important;
    }

    .second_card_img {
        max-width: 50%;
        height: auto;
        margin-top: 30px;
    }

    #third_card {
        margin-left: 0px;
        margin-right: 1px;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
        background-color: #140e0e1f;
    }

    .calibri_content {
        text-align: justify;
        font-size: 13px;
        padding: 10px;
        margin-top: 10px;
        color: #666666;
        font-family: "Open Sans" !important;
    }

    .jimmy_button_calibri {
        border: 1px solid black;
        padding: 5px;
        display: inline-block;
        vertical-align: middle;
        background-color: red;
        color: white;
        white-space: nowrap;
    }

    .red-text_calibri {
        color: red;
        font-size: 13px;
        margin-right: 10px;
        text-align: justify;
        font-family: "Open Sans" !important;
    }

    .third_card_img {
        max-width: 140%;
        height: auto;
        margin: 10px;
    }

    #fourth_card {
       
        margin-top: 20px;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
        background-color: #00000009;
        margin-bottom: 20px;
        display: flex;

    }

    .stuff_title {
        color: #de4235;
        font-size: 18px;
        font-family: "Open Sans" !important;
    }

    .stuff_content {
        text-align: justify;
        font-size: 13px;
        padding: 10px;
        color: #666666;
        font-family: "Open Sans" !important;
    }

    .fourth-image-class {
        /*max-width: 120%;*/
        height: auto;
        /*margin: 20px;*/
    }

    .features {
      margin-left: 10px;
    }
    .features ul {
    list-style-type: none; /* No bullets */
    padding: 0;
    margin: 0; /* Remove default margin */
}

.features ul li {
    margin-bottom: 10px;
    padding-left: 40px; /* Adjusted for the position of the custom check mark */
    position: relative; /* Needed to position the pseudo-element */
}

.features ul li::before {
    content: ''; /* Empty content for pseudo-element */
    background: url("https://excelsquare.com/wp-content/uploads/2015/12/tik2.png") no-repeat; /* Use the custom image for the check mark */
    background-size: contain; /* Ensure the image fits within the pseudo-element */
    width: 30px; /* Adjust width of the image */
    height: 30px; /* Adjust height of the image */
    position: absolute;
    left: 0; /* Adjust as needed */
    top: 0; /* Adjust if needed to vertically align */
}

}