/** Shopify CDN: Minification failed

Line 21:13 Expected identifier but found whitespace
Line 21:15 Unexpected "{"
Line 21:24 Expected ":"
Line 22:12 Expected identifier but found whitespace
Line 22:14 Unexpected "{"
Line 22:23 Expected ":"
Line 22:47 Expected ":"
Line 35:19 Expected identifier but found whitespace
Line 35:21 Unexpected "{"
Line 35:30 Expected ":"
... and 13 more hidden warnings

**/



  .custom-section {
  
  text-align: {{ section.settings.alignment }};
  font-size: {{ section.settings.font_size }}px;
  padding-left: 20px;
}

.custom-section p {
  /* Style for paragraph text */
  margin: 10px 0; /* Example margin for top and bottom */
  /* Add any other paragraph styles you need */
}


        .custom-section1 {

        text-align: {{ section.settings.alignment }};
        font-size: {{ section.settings.font_size }}px;
        padding-left: 20px !important;
          padding-right: 20px !important;
      }

      .custom-section1 p {
        margin: 10px 0;
      }

      *{
          margin: 0;
          padding: 0;
          box-sizing: border-box;
      }
      body{
          font-family: 'Montserrat', sans-serif;
          font-size: 14px;

      }
      .wrapper{
          display: grid;
          grid-template-columns: repeat(3,1fr);
          grid-gap: 15px;
          /* margin: 30px; */
          padding: 0px 20px;
          margin-top: 55px;
          margin-bottom: 40px !important;

      }
      .pricing-table{
         box-shadow: 0px 0px 18px #ccc;
         text-align: center;
         padding: 30px 0px;
         border-radius: 5px;
         position: relative;


      }
      .pricing-table .head {
          border-bottom: 1px solid #000;
          padding-bottom: 50px;
          transition: all 0.5s ease;
      }
      .pricing-table:hover .head{
          border-bottom: 1px solid #000;

      }

      .pricing-table .head .title{
          font-size: 20px;
          font-weight: 700;
          font-family:fantasy;
      }

      .pricing-table .content .price{
          background: #000;
          width: 90px;
          height: 90px;
          margin: auto;
          line-height: 90px;
          border-radius: 50%;
          border: 5px solid #fff;
          box-shadow: 0px 0px 10px #ccc;
          margin-top: -50px;
           transition: all 0.5s ease;
      }
      .pricing-table:hover .content .price{
          transform: scale(1.2);

      }
      .pricing-table .content .price h1{
      color: #fff;
      font-size: 14px;
      padding: 5px;
      margin-top: 25px;
      font-weight: 700;
      }
      .pricing-table .content ul{
         list-style-type: none;
         margin-bottom: 20px;
         padding-top: 10px;
        padding-left: 0px !important;
      }

      .pricing-table .content ul li{
          margin: 20px 0px;
          font-size: 14px;
          color:#555;
      }

      .pricing-table .content .sign-up{

          background: #000; /* Change pink to black (#000) */
          /* border-radius: 40px; */
          font-weight: 500;
          position: relative;
          display: inline-block;
      }


      .pricing-table .btn {
      	color: #fff;
      	padding: 14px 30px;
      	display: inline-block;
      	text-align: center;
      	font-weight: 600;
      	-webkit-transition: all 0.3s linear;
      	-moz-transition: all 0.3 linear;
      	transition: all 0.3 linear;
      	border: none;
      	font-size: 14px;
      	text-transform: capitalize;
      	position: relative;
      	text-decoration: none;
          margin: 2px;
          z-index: 9999;
          text-decoration: none;
          /* border-radius:50px; */

      }

      .pricing-table .btn:hover{
      	box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.3);
      }

      .pricing-table .btn.bordered {
      	z-index: 50;
      	color: #fff;
      }
      .pricing-table:hover .btn.bordered{
      	color:black !important;
        background: white;
      }

      .pricing-table .btn.bordered:after {
      	background: #000 none repeat scroll 0 0;
      	/* border-radius: 50px; */
      	content: "";
      	height: 100%;
      	left: 0;
      	position: absolute;
      	top: 0;
      	-webkit-transition: all 0.3s linear;
      	-moz-transition: all 0.3 linear;
      	transition: all 0.3 linear;
      	width: 100%;
      	z-index: -1;
      	-webkit-transform:scale(1);
      	-moz-transform:scale(1);
      	transform:scale(1);
      }
      .pricing-table:hover .btn.bordered:after{
      	opacity:0;
      	transform:scale(0);
      }
      /* .box1{
        width:75%;
        margin-left:20%;
      }
       .box2{
        width:75%;
        margin-right:20%;
      } */

        #para {
          color: white;
          padding: 10px;
        }
      #text-header{
         text-align: center;
         margin-top:65px;
         font-family: none;
        background-color: black;
        color: white;
        display:inline-block;
        padding:20px;
      }

      .pricing-table .content ul {
      list-style-type: none;
      margin-bottom: 20px;
      padding-top: 10px;
      padding-left: 0px !important;
      }

      /* Add tick mark before each li element */
      .pricing-table .content ul li::before {
      content: "\2713"; /* Unicode character for a checkmark */
      display: inline-block;
      margin-right: 10px; /* Adjust the spacing between the checkmark and text */
      font-size: 18px; /* Adjust the size of the checkmark */
      color: #000; /* Adjust the color of the checkmark */
      font-weight: bold; /* Optional: Adjust the weight of the checkmark */
    }

      @media screen and (max-width:800px){
         .wrapper{
              grid-template-columns: 1fr;
          }
         .box1 , .box2, .box3{
        width: 90%;
        margin-top: 20px;
        margin-bottom: 20px;
        margin-left: 10px;
        }
        /* .box2{
       width: 90%;
        margin-top: 20px;
        margin-bottom: 20px;
        margin-left: 10px;
        }
        .box3{

       width: 90%;
        margin-top: 20px;
        margin-bottom: 20px;
        margin-left: 10px;
        } */

         /* .wrapper{
          display: grid;
    } */
           /* @media screen and (max-width:768px){
         .wrapper{
              grid-template-columns: repeat(2,1fr);
          }
        .box1
        {
        width:83%;
        margin-top:20px;
          margin-bottom:20px;
        }
        .box2{
        width:83%;
         margin-top:20px;
          margin-bottom:20px;
        }

      } gap: 15px;
          margin: 0px;
          padding: 0px 0px;
          margin-top: 55px;*/

      }


       @media screen and  (min-width:800px) and  (max-width:1200px){
        .wrapper{
          display: grid;
        grid-template-columns: repeat(2,1fr);
        grid-gap: 30px;
        /* margin: 30px; */
        padding: 0px 0px;
        margin-top: 55px;
        margin-bottom: 25px;
        }

     /* .box1 {
        width: 90%;
        margin-left: 12%;
    }

    .box2 {
        width: 90%;
        margin-right: 12%;
    } */
       }

    .hide{
      display: none;
    }


  .circle-container {
    display: flex;

    justify-content: center;
    align-items: center;

    width: 100px;
    aspect-ratio: 1/1;
  }

  .circle-svg {
    --_circle-radius: 45px;
    --_svg-width: 50px;
    --_stroke-width: 10px; /* svg-width - (circle-radius * 2) */

    width: var(--_svg-width);
    height: var(--_svg-width);

    stroke: black;
    /*   stroke-linecap: round; */
    stroke-width: var(--_stroke-width);

    stroke-dashoffset: 1;
    stroke-dasharray: 1 1000;

    animation: loader 1500ms infinite linear, spin 3000ms infinite linear;
  }

  @keyframes loader {
    0% {
      stroke-dashoffset: 1;
      stroke-dasharray: 1 1000;
    }

    100% {
      stroke-dashoffset: calc(var(--_circle-radius) * -2 * 3.1415);
      stroke-dasharray: calc(var(--_circle-radius) * 2 * 3.1415) 1000;
    }
  }

  @keyframes spin {
    0% {
      rotate: 0deg;Monthly Plan 1
    }

    100% {
      rotate: 360deg;
    }
  }

      #loader {
              display: none;
              text-align: center;
            margin: auto;
              margin-top: 20px;
          }

    .lookup-dropdown {
    margin-bottom: 10px; /* Adjust margin as needed */
  }


    .lookup-select{
          border: solid;
      margin: 20px;
      background: white;
      width: auto;
      padding: 12px;
    }

  .option-value{
    border-bottom: 1px solid black;
    padding: 5px; /* Adjust padding as needed */
  }

    #addonConsent {
    font-size: 20px;
      margin: 2% 13.5% 1% 13.5%;
  }

  #addonCheckbox{
    width: 20px;
      height: 15px;
  }


    .addon-pricing-table {
      margin: 3%;
      padding: 0;
      width: 94%;
      table-layout: fixed;
      border-collapse: collapse !important;
      border-right:none;
    }

    .addon-pricing-table th,
    .addon-pricing-table td {
      padding: .625em;

    }

    .addon-pricing-table th {
      font-size: .85em;
      letter-spacing: .1em;
      text-transform: uppercase;
    }
    .no-border {
      border: none !important;
       border-right:none;
    }

    .table-title {
      text-align: center;
    }

    .lookup-select {
      border: solid;
      margin: 20px;
      background: white;
      width: auto;
      padding: 6px;
    }

    .option-value {
      border-bottom: 1px solid black;
      padding: 5px;
    }

    .height-label {
      text-align: center;
    }

    .monthly-header,
    .yearly-header,
    .unlimited-header {
      text-align: center;
    }

    .lookup-type {
      text-align: center;
      border-right: 1px solid #d8d8da !important;
    }

    .heighttbl {
      text-align: center;
    }
  .addon-pricing-table tbody > .table-row:nth-child(odd) {
    background-color: #eee;
  }
  .table-row{
    background-color:white;
  }
  td .monthly-plan,
  td .yearly-plan{
     padding: 30px 0;
  }
    @media screen and (min-width: 768px) {
    .heighttbl{
      height:80px;
    }
      .addon-pricing-table td {
      text-align: center;
      border-right: 1px solid #d8d8da !important;
      }

  }


                              #submit-button{
                               margin:20px;
                              }

                                #url-display-container {
                                  margin-top: 20px;
                                }

                                .url-block {
                                  display: inline-block;
                                  margin: 5px;
                                  padding: 8px 12px;
                                  background-color: #f2f2f2;
                                  border-radius: 5px;
                                  cursor: pointer;
                                }

                                .url-input {
                                  display: none;
                                  border: none;
                                  background-color: #f2f2f2;
                                  font-size: 14px;
                                  border-radius: 5px;
                                  padding: 8px 12px;
                                  margin-bottom: 10px;
                                }

                                  .url{
                                    margin:20px;
                                    font-size:20px;
                                  }


                                      .container-profile{
                                    background-color: #ffffff;
                                    padding: 40px;
                                    border-radius: 10px;
                                    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
                                  }

                                  #url-display-container {
                                    margin-top: 20px;
                                  }

                                  .url-block {
                                    display: inline-block;
                                    margin: 5px;
                                    padding: 8px 12px;
                                    background-color: #f2f2f2;
                                    border-radius: 5px;
                                    cursor: pointer;
                                  }

                                  .url-input {
                                    display: none;
                                    border: none;
                                    background-color: #f2f2f2;
                                    font-size: 20px;
                                    border-radius: 5px;
                                    padding: 8px 12px;
                                    margin-bottom: 10px;
                                  }
                                   .container-profile  input[type="text" i]{
                                    font-size:20px;
                                  }
                /*
                              #url-table {
                              width: 100%;
                              margin-top: 40px;
                              margin-bottom:40px;
                              border-collapse: collapse;
                            }

                            #url-table th, #url-table td {
                              border: 1px solid #ddd;
                              padding: 20px;
                              text-align: left;
                              font-size:20px
                            }

                            #url-table th {
                              background-color: #f2f2f2;
                              font-weight: normal;
                            }

                            #url-table tbody tr:nth-child(even) {
                              background-color: #f2f2f2;
                            }

                            #url-table tbody tr:hover {
                              background-color: #ddd;
                            } */

                           .container-profiles {  .edit-button {
                      margin-right: 11px;
                  }
                                background-color: #ffffff;
                                padding: 20px;
                                border-radius: 10px;
                                box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
                            }


                          .container-profiles input[type="text" i] {
                              font-size: 20px;
                          }

                        .edit-url{
                          font-size:17px;
                          margin:5px;
                        }



                      .head-popup{
                          display: flex;
                          justify-content: space-between;
                      }

                          .popup-overlay {
                            display: none;
                            position: fixed;
                            top: 0;
                            left: 0;
                            width: 100%;
                            height: 100%;
                            background: rgba(0, 0, 0, 0.5);
                            justify-content: center;
                            align-items: center;
                            z-index: 999;
                          }

                          .popup-container {
                            background-color: white;
                            border-radius: 8px;
                            box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
                            overflow: hidden;
                            width: 45em;46em
                            opacity: 0;
                            transform: scale(0.8);
                            transition: all 0.3s ease-in-out;
                          }

                          .popup-card {
                            padding: 20px;
                            text-align: center;
                          }

                          .popup-card h2 {
                            font-size: 24px;
                            margin-bottom: 10px;
                          }

                          .popup-card p {
                            font-size: 16px;
                            margin-bottom: 20px;
                          }

                      input#edit-magento-urls {
                        font-size: 15px;
                    }
                      input#edit-woocommerce-urls {
                        font-size: 15px;
                    }
                      .form-control::placeholder {
                        color: #BDC3C7 !important;
                      }
      table {
        border: 1px solid #ccc;
        border-collapse: collapse;
        margin: 0;
        padding: 0;
        width: 100%;
        table-layout: fixed;
      }

      table caption {
        font-size: 1.5em;
        margin: .5em 0 .75em;
      }

      table tr {
        background-color: #f8f8f8;
        border: 1px solid #ddd;
        padding: .35em;
      }

      table th,
      table td {
        padding: .625em;
        text-align: center;
      }

      table th {
        font-size: .85em;
        letter-spacing: .1em;
        /* text-transform: uppercase; */
      }
       .edit-button {
        width:20% ;
        background-color:black ;
        color:white ;
      }
      .delete-button{
          width:20%;
        background-color:black;
        color:white;
      }
      .table>:not(caption)>*>*{
      padding: 1.5rem 1.5rem !important;
    }
  tbody,th{
    font-size:medium !important;
  }
      @media screen and (max-width: 600px) {
        table {
          border: 0;
        }

        table caption {
          font-size: 1.3em;
        }

        table thead {
          border: none;
          clip: rect(0 0 0 0);
          height: 1px;
          margin: -1px;
          overflow: hidden;
          padding: 0;
          position: absolute;
          width: 1px;
        }

        table tr {
          border-bottom: 3px solid #ddd;
          display: block;
          margin-bottom: .625em;
        }

        table td {
          border-bottom: 1px solid #ddd;
          display: block;
          font-size: .8em;
          text-align: right;
        }

        table td::before {
          /*
          * aria-label has no advantage, it won't be read inside a table
          content: attr(aria-label);
          */
          content: attr(data-label);
          float: left;
          font-weight: bold;
          /* text-transform: uppercase; */
        }

        table td:last-child {
          border-bottom: 0;
        }
         /* .edit-button {
        width:10%;
        background-color:black;
        color:white;
      }
      .delete-button{
          width:10%;
        background-color:black;
        color:white;
      } */
    /* .table>:not(caption)>*>*{
      padding: 1.5rem 1.5rem !important;
    } */
      }












      /* general styling */
      body {
        font-family: "Open Sans", sans-serif;
        line-height: 1.25;
      }





.custom-section {
    text-align: {{ section.settings.alignment }};
    font-size: {{ section.settings.font_size }}px;
    padding-left: 20px;
}

body {
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
}

.custom-wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 15px;
    margin: 50px;
    padding: 0px 20px;
}

.custom-pricing-table {
    box-shadow: 0px 0px 18px #ccc;
    text-align: center;
    padding: 30px 0px;
    border-radius: 5px;
    position: relative;
}

.custom-pricing-table .custom-head {
    padding-bottom: 50px;
    transition: all 0.5s ease;
}

.custom-pricing-table .custom-head .custom-title {
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: 700;
}

.custom-sign-up .custom-btn {
    display: inline-block;
    padding: 10px 20px;
    background-color: #8E2DE2; /* Change this to your desired button background color */
    color: #ffffff; /* Change this to your desired text color */
    text-decoration: none;
    border: none;
    border-radius: 5px;
    font-weight: bold;
    transition: background-color 0.3s ease;
}

.custom-sign-up .custom-btn:hover {
    background-color: #6A1BB6; /* Change this to the hover background color */
}
#text-head{
  text-align: center ;

}

@media screen and (max-width: 768px) {
    .custom-wrapper {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (max-width: 600px) {
    .custom-wrapper {
        grid-template-columns: 1fr;
    }
}