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


#myframe {
  box-shadow: 2px 4px 12px #00000014;
  border-radius: 20px;
}
ul.country-holder{
  margin: 0;
  padding: 0;
  list-style: none;
}
#dolla{
  width: 42px;
  justify-content: center;
}

.invalid-feedback{
  word-wrap: break-word;
}
/* Overlay for success message */
#success {
    position: fixed;
    z-index: 9;
    background: rgba(0, 0, 0, 0.4) !important; /* Dark transparent background */
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    display: flex; /* Center the content */
    justify-content: center; /* Center horizontally */
    align-items: center; /* Center vertically */
}

.input-group label{
  width: 80% !important;
}

#loading-spinner {
    position: fixed;
    z-index: 9;
    background: rgba(0, 0, 0, 0.4); /* Dark transparent background */
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    display: flex; /* Center the content */
    justify-content: center; /* Center horizontally */
    align-items: center; /* Center vertically */
    transition: opacity 0.3s ease-in-out; /* Optional: smooth visibility transition */
  }
  
  #loading-spinner.d-none {
    opacity: 0; /* Makes it invisible */
    pointer-events: none; /* Disables interaction when hidden */
  }
  

/* Success message styling */
#success .message {
    background: white; /* White background for the message box */
    padding: 60px; /* Padding around the message */
    border-radius: 10px; /* Rounded corners */
    text-align: center; /* Center text */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); /* Subtle shadow */
    position: relative; /* Position relative for close button */
    color: #000;
}

/* Close button styling */
#success .close {
    position: absolute; /* Position absolute to the top right */
    top: 10px; /* Adjust the top position */
    right: 10px; /* Adjust the right position */
    cursor: pointer; /* Pointer cursor for close button */
    color: #007bff; /* Color for the close button */
    font-size: 18px; /* Size for better visibility */
    font-weight: bold; /* Bold text for the close button */
}

/* Image styling */
#success img {
    width: 150px; /* Desired width */
    height: auto; /* Maintain aspect ratio */
    margin-bottom: 20px; /* Space below the image */
}

/* Loading spinner */
.loading-spinner {
    display: none; /* Initially hidden */
    position: fixed; /* Position fixed for the spinner */
    z-index: 999; /* High z-index to show above other content */
    left: 50%; /* Center horizontally */
    top: 50%; /* Center vertically */
    transform: translate(-50%, -50%); /* Center with transform */
}


#error-msg, #recaptcha-error {
    background-color: #f8d7da; /* Light red for error */
    color: #721c24; /* Darker red text */
    border: 1px solid #f5c6cb; /* Darker border */
    padding: 20px; /* Padding around the message */
    margin-bottom: 20px; /* Space below the message */
    border-radius: 8px;
}
#error-msg .message, #recaptcha-error .message {
    display: flex; /* Align icon and text */
   
}



#error-msg .message::before, #recaptcha-error .message::before {
content: "!";
  font-size: 16px;
  color: #f2f0f0;
  background: #962020;
  border: 2px solid #cb4141;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
}
#error-msg .message span{
  margin-left: 10px;
}

.form-check-input, .form-check-input+label {
    cursor: url(../images/LinkSelect.cur), auto !important;
}

.status-icon {
    width: 50px; /* Adjust the size of your icon */
    margin-bottom: 10px; /* Space between icon and text */
}

.close, .error-close {
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 10px;
    font-weight: bold;
    color: #888; /* Color for close button */
}

.close:hover, .error-close:hover {
    color: #000; /* Darker color on hover */
}

.form-floating label {
/*   white-space: nowrap;
  overflow: hidden; */
/*   text-overflow: ellipsis; */
overflow:
hidden;
  text-overflow: ellipsis;
  white-space:
nowrap;
  max-width: 95%;
/*   display: block;  */
}


.form-floating > .form-control, .form-floating > .form-select {
    height: calc(4.1rem + 10px);
    line-height: 1.25;
    border-radius: 8px;
  }

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}


.addMore {
    display: inline-block;
    background-color: #007bff; /* Bootstrap primary color */
    color: white;
    padding: 10px 15px;
    border-radius: 5px;
    text-align: center;
    text-decoration: none;
    transition: transform 0.2s; /* Subtle lift effect */
    cursor: url(../images/LinkSelect.cur), auto !important;
}


.addMore:hover i {
    color: #e0e0e0; /* Change icon color on hover */
}

.removeCls {
    background-color: #dc3545; /* Bootstrap danger color */
    color: white;
    padding: 8px 12px;
    border-radius: 5px;
    text-decoration: none;
    margin-left: 10px;
    transition: transform 0.2s; /* Subtle lift effect */
    cursor: url(../images/LinkSelect.cur), auto !important;
}

.removeCls:hover i {
    color: #ffe6e6; /* Change icon color on hover */
}



p.fieldheader {
  background-color: #343a40; /* Darker background */
  color: #ffffff; /* Light text */
  padding: 12px 20px;
  border-radius: 5px;
  font-size: 18px;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); /* Slight shadow for depth */
  border-left: 5px solid #007bff; /* Accent color for a modern touch */
}
.wskLabel {

  cursor: url(../images/LinkSelect.cur), auto !important;
  font-size: 12pt;
  display: block;
  overflow: hidden;
  padding-top: 18px;
  position: relative;
  min-height:40px;
  line-height: 15px;
}

.chkbox-holder{
  padding-left: 0px !important;
}

.wskCheckbox {
  border: 1px solid #c7c7c7;
  cursor: url(../images/LinkSelect.cur), auto !important;
  display: inline-block;
  float: left;
  height: 14px;
  margin: 0 20px 20px 0px;
  outline-color: #eaeaea;
  padding: 0;
  position:relative;
  width: 14px;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  z-index:1;
  background: #ffffff;
}
.wskLabel:hover {
	color: unset !important;
  text-decoration: underline !important;
}


input[type='checkbox'].wskCheckbox {
   display: none;
}

.wskCircle {
display: none;
}

.wskCircle.show {
  opacity: 1;
}

.wskCircle.flipColor {
  background-color: #d2d3d2;
}

          /* Default button styling */
          #submissionbutton {
            width: 100%; /* Full-width button */
            position: relative; /* Position relative for absolute positioning of the span */
            padding: 20px; /* Adjust padding for increased height (double the original height) */
            font-size: 20px; /* Original font size */
            line-height: normal; /* Ensure line-height is normal */
            height: 60px; /* Set a fixed height if desired (e.g., 60px for double height) */
        }

        /* Default span styling */
        #submissionbutton span {
            display: inline-block;
            vertical-align: unset !important; /* Center the text */
            transition: opacity 0.3s ease; /* Smooth transition for text opacity */
            font-weight: 700;
        }

        /* On hover, hide the text and show the icon */
        #submissionbutton:hover span {
            opacity: 0; /* Fade out the text */
        }

        #submissionbutton:hover::after {
            content: '';
            background: url(https://i.cloudup.com/gBzAn-oW_S-2000x2000.png) no-repeat center;
            background-size: contain; /* Scale the image to fit */
            position: absolute; /* Position it absolutely within the button */
            left: 50%; /* Center it horizontally */
            top: 50%; /* Center it vertically */
            transform: translate(-50%, -50%); /* Adjust for the center */
            width: 60px; /* Set a width for the icon */
            height: 60px; /* Set a height for the icon */
        }

  

.radio .td {
          /*   text-align: center; */
            padding: 10px;
            transition: box-shadow 0.3s, background-color 0.3s;
            border-radius: 8px;
        }
        .radio input[type="radio"], .radio input[type="radio"] + label {
   /*        margin-right: 20px; */
          cursor: url(../images/LinkSelect.cur), auto !important;
        }
    
        .radio .td label{
          display: block;
          margin-left: 20px
        }

        .form-check-input:checked + label {
            font-weight: bold;
            cursor: url(../../assets/images/LinkSelect.cur), auto !important;
        }

        /* Emboss effect for selected radio button's <td> */
        .radio .highlight {
            background-color:#fffbf6;
      /*       box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2),
                        -2px -2px 10px rgba(255, 255, 255, 0.5); */
            border-radius: 8px;
        }

        

        /* For highlighting when hovered */
        .radio .td:hover {
            background-color: #f0f0f0;
            cursor: url(../images/LinkSelect.cur), auto !important;
            border-radius: 8px;
        }

        body, input[type="text"],input[type="email"], input[type="tel"], textarea, select{
          cursor:url(../images/cursor.png), auto;
        }


        .custom-select-container {
          position: relative;
          font-family: inherit;
      
      
        }
        
    
        .custom-select-selected {
          padding: 10px;
          border: 1px solid #ccc;
          cursor: pointer;
          background-color: #fff;
        }
        .custom-select-options {
          display: none;
          position: absolute;
          top: 100%;
          left: 0;
          right: 0;
          border: 1px solid #ccc;
          background-color: #fff;
          z-index: 1000;
          max-height: 200px;
          overflow-y: auto;
        }
        .custom-select-options.show {
          display: block;
        }
        .custom-select-option {
          padding: 10px;
          cursor: pointer;
        }
        .custom-select-option:hover, .custom-select-option.selected {
          background-color: #f0f0f0;
        }
  
        .custom-select-container select {
          display: block;
          width: 100%;
          padding: .375 2.25rem .375rem .75rem;
          -moz-padding-start: calc(0.75rem - 3px);
          font-size: 1rem;
          font-weight: 400;
          line-height: 1.5;
          color: #212529;
          background-color: #fff;
        
          background-repeat: no-repeat;
          background-position: right .75rem center;
          background-size: 16px 12px;
          border: 1px solid #ced4da;
          border-radius: .25rem;
          transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
          -webkit-appearance: none;
          -moz-appearance: none;
          appearance: none;
        }
  
        .custom-select-container .custom-select-selected {
          display: block;
          width: 100%;
          padding: 1.75rem 2.25rem .375rem .75rem;
          font-size: 1rem;
          font-weight: 400;
          line-height: 1.5;
          color: #212529;
          background-color: #fff;
          border: 1px solid #ced4da;
          border-radius: 8px;
          transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
          cursor: pointer;
             height: calc(4.1rem + 10px);
         background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="none" stroke="%23343a40" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2 5l6 6 6-6"/></svg>');
    background-repeat: no-repeat;
    background-position: right .75rem center;
    background-size: 16px 12px;
        }
  
        .custom-select-container .custom-select-options {
          display: none;
          position: absolute;
          top: 100%;
          left: 0;
          right: 0;
          border: 1px solid #ced4da;
          background-color: #fff;
          z-index: 1000;
          max-height: 200px;
          overflow-y: auto;
          border-radius: .25rem;
          box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
        }
  
        .custom-select-container .custom-select-options.show {
          display: block;
        }
  
        .custom-select-container .custom-select-option {
          padding: .375rem .75rem;
          font-size: 1rem;
          color: #212529;
          cursor: pointer;
          transition: background-color .15s ease-in-out;
        }
  
        .custom-select-container .custom-select-option:hover,
        .custom-select-container .custom-select-option.selected {
          background-color: #f8f9fa;
        }

        .input-group input{
          border-top-right-radius: 0.25rem !important;
  border-bottom-right-radius: 0.25rem !important;
        }

    @media only screen
    and (max-width : 360px) {
        .g-recaptcha iframe{
          transform: scale(0.84);
          transform-origin: 0 0;
        }
}