row1 = ["⬜️","️⬜️","️⬜️"]
row2 = ["⬜️","⬜️","️⬜️"]
row3 = ["⬜️️","⬜️️","⬜️️"]
map = [row1, row2, row3]
print(f"{row1}\n{row2}\n{row3}")

position = input("Where do you want to put the treasure? ")

if position == "11":
    treasure_1 = row1[0] = "x"
    print("You Treasure is placed now! Arghh!! = {treasure_1}")
elif position == "21":
    treasure_2 = row1[1] = "x"
    print(f"You Treasure is placed now! Arghh!! = {treasure_2}")
elif position == "31":
    treasure_3 = row1[2] = "x"
    print(f"You Treasure is placed now! Arghh!! = {treasure_3}")
elif position == "12":
    treasure_4 = row2[0] = "x"
    print(f"You Treasure is placed now! Arghh!! = {treasure_4}")
elif position == "22":
    treasure_5 = row2[1] = "x"
    print(f"You Treasure is placed now! Arghh!! = {treasure_5}")
elif position == "32":
    treasure_6 = row2[2] = "x"
    print(f"You Treasure is placed now! Arghh!! = {treasure_6}")
elif position == "13":
    treasure_7 = row3[0] = "x"
    print(f"You Treasure is placed now! Arghh!! = {treasure_7}")
elif position == "23":
    treasure_8 = row3[1] = "x"
    print(f"You Treasure is placed now! Arghh!! = {treasure_8}")
elif position == "33":
    treasure_9 = row3[2] = "x"
    print(f"You Treasure is placed now! Arghh!! = {treasure_9}")

print(f"{row1}\n{row2}\n{row3}")

Bank Roulette
names_string = input("Give me everybody's names, separated by a comma. ")

names = names_string.split(", ")

import random
name_length = len(names)
payer = random.randint(0, name_length -1)
final_payer = names[payer]

print(f"{final_payer} has to pay the bill today.")

print("Welcome to Heads or Tail")
print("We're always here to solve your problem \n")
import random

toss_answer = random.randint(0, 1)

if toss_answer == 0:
    print("Sorry Bad Luck Tails, Heads won")
else:
    print("Sorry Bad Luck Heads, Tails won")

print('''
*******************************************************************************
          |                   |                  |                     |
 _________|________________.=""_;=.______________|_____________________|_______
|                   |  ,-"_,=""     `"=.|                  |
|___________________|__"=._o`"-._        `"=.______________|___________________
          |                `"=._o`"=._      _`"=._                     |
 _________|_____________________:=._o "=._."_.-="'"=.__________________|_______
|                   |    __.--" , ; `"=._o." ,-"""-._ ".   |
|___________________|_._"  ,. .` ` `` ,  `"-._"-._   ". '__|___________________
          |        :?|`"=._` , "` `; .". ,  "-._"-._; ;              |
 _________|___________| ;`-.o`"=._; ." ` '`."\` . "-._ /_______________|_______
|                   | |o;    `"-.o`"=._``  '` " ,__.--o;   |
|___________________|_| ;     (*) `-.o `"=.`_.--"_o.-; ;___|___________________
____/______/______/___|o;._    "      `".o|o_.--"    ;o;____/______/______/____
/______/______/______/_"=._o--._        ; | ;        ; ;/______/______/______/_
____/______/______/______/__"=._o--._   ;o|o;     _._;o;____/______/______/____
/______/______/______/______/____"=._o._; | ;_.--"o.--"_/______/______/______/_
____/______/______/______/______/_____"=.o|o_.--""___/______/______/______/____
/______/______/______/______/______/______/______/______/______/______/_____ /
*******************************************************************************
''')
print("Welcome to Treasure Island.")
print("Your mission is to find the treasure.")

l_or_r = input("You're at a crossroad. Where do you want to go type 'left' or 'right'.\n  ").lower()
if l_or_r == 'right':
  s_or_w = input("You are at a lake do you want swim across it or wait for a boat type 'swim' or 'wait'.\n ").lower()
  if s_or_w == 'swim':
    doors = input("You arrived at a island unharmed. There is a house with three doors 'red', 'blue' and 'yellow' which color do you want to choose.\n  ").lower()
    if doors == 'red':
      print("You are burned by fire. Game Over.")
    elif doors == 'blue':
      print("You are eaten by Vampires. Game Over.")
    elif doors == 'yellow':
      print("YAY you WIN!! You found the Treasure, there is lots of Gold, Money and Gifts in that room.")
  elif s_or_w == 'wait':
      print("Your boat has been attacked by piranahas. Game Over.")
elif l_or_r == 'left':
  print("You fell into a hole. Game Over.")

print("Welcome to the Love Calculator!")
name1 = input("What is your name? \n")
name2 = input("What is their name? \n")

lowered_name1 = name1.lower()
lowered_name2 = name2.lower()


name1_T = lowered_name1.count("t")
name1_R = lowered_name1.count("r")
name1_U = lowered_name1.count("u")
name1_E = lowered_name1.count("e")

name1_true = name1_T + name1_R + name1_U + name1_E

name2_T = lowered_name2.count("t")
name2_R = lowered_name2.count("r")
name2_U = lowered_name2.count("u")
name2_E = lowered_name2.count("e")

name2_true = name2_T + name2_R + name2_U + name2_E

name1_L = lowered_name1.count("l")
name1_O = lowered_name1.count("o")
name1_V = lowered_name1.count("v")
name1_E = lowered_name1.count("e")

name1_love = name1_L + name1_O + name1_V + name1_E

name2_L = lowered_name2.count("l")
name2_O = lowered_name2.count("o")
name2_V = lowered_name2.count("v")
name2_E = lowered_name2.count("e")

name2_love = name2_L + name2_O + name2_V + name2_E

true_names = name1_true + name2_true

love_names = name1_love + name2_love

str_true_names = str(true_names)
str_love_names = str(love_names)

LOVE_SCORE = str_true_names + str_love_names

LOVE_SCORE_int = int(LOVE_SCORE)

if LOVE_SCORE_int < 10 or LOVE_SCORE_int > 90:
    print(f"Your score is {LOVE_SCORE_int}, you go together like coke and mentos.")
elif LOVE_SCORE_int >= 40 and LOVE_SCORE_int <= 50:
    print(f"Your score is {LOVE_SCORE_int}, you are alright together.")
else:
    print(f"Your score is {LOVE_SCORE_int}.")


print("Welcome to the Love Calculator!")
name1 = input("What is your name? \n")
name2 = input("What is their name? \n")

lowered_name1 = name1.lower()
lowered_name2 = name2.lower()

names_T = lowered_name1.count("t") + lowered_name2.count("t")
names_R = lowered_name1.count("r") + lowered_name2.count("r")
names_U = lowered_name1.count("u") + lowered_name2.count("u")
names_E = lowered_name1.count("e") + lowered_name2.count("e")

true = names_T + names_R + names_U + names_E

names_L = lowered_name1.count("l") + lowered_name2.count("l")
names_O = lowered_name1.count("o") + lowered_name2.count("o")
names_V = lowered_name1.count("v") + lowered_name2.count("v")
names_E = lowered_name1.count("e") + lowered_name2.count("e")

love = names_L + names_O + names_V + names_E

str_true = str(true)
str_love = str(love)

love_score = str_true + str_love

int_love_score = int(love_score)

if int_love_score < 10 or int_love_score > 90:
    print(f"Your score is {int_love_score}, you go together like coke and mentos.")
elif int_love_score >= 40 and int_love_score <= 50:
    print(f"Your score is {int_love_score}, you are alright together.")
else:
    print(f"Your score is {int_love_score}.")

print("Welcome to the rollercoaster!")
height = int(input("What is your height in cm? "))
if height > 120:
    age = int(input("What is your age?"))
    if age < 12:
        bill = 5
    elif age <= 18:
        bill = 7
    elif age >= 45 and age <= 55:
        bill = 0
    elif age > 18:
        bill = 12

    want_photos = input("Do you want photos type Y or N.")
    if want_photos == "Y":
            bill += 3
            print(f"The final bill is ${bill}.")
    else:
            print(f"The final bill is ${bill}")
else:
    print("Sorry you have to grow taller before you can ride.")

print("Welcome to Python Pizza Deliveries!")
size = input(" What size of pizza do you want? S, M, or L")
bill = 0

small_size = 15
medium_size = 20
large_size = 25

if size == "S":
    bill = small_size
elif size == "M":
    bill = medium_size
else:
    bill = large_size

pepperoni = input("Do you want pepperoni? Y or N")
if pepperoni == "Y":
    if size == "S":
        bill += 2
    else:
        bill += 3
else:
    bill

extra_cheese = input("Do you want extra cheese? Y or N")
if extra_cheese == "Y":
    bill += 1
else:
    bill

print(f"The final bill is ${bill}.")

year = int(input("Which year do you want to check?"))
if year % 4 == 0:
    if year % 100 == 0:
        if year % 400 == 0:
            print("It's a leap year.")
        else:
            print("It's not a leap year.")
    else:
        print("It's a leap year.")
else:
 print("It's not a leap year.")

print("Welcome to BMI calculator 2.O")

weight = float(input("Please enter your weight in kg:\n"))
height = float(input("Please enter your height in m:\n"))
BMI = round(weight / height ** 2, 2)
if BMI < 18.5:
    print(f"Your BMI is {BMI}, you are underweight")
elif (BMI > 18.5) and (BMI < 25):
    print(f"Your BMI is {BMI}, you have a normal weight")
elif (BMI > 25) and (BMI < 30):
    print(f"Your BMI is {BMI}, You are slightly overweight")
elif (BMI > 30) and (BMI < 35):
    print(f"You BMI is {BMI}, You are clinically obese")
else:
    print(f"Your BMI is {BMI}, you are clinically obese")

number = int(input("Which number do you want to check"))
if number % 2 == 0:
    print("This is an even number.")
else:
    print("This is an odd number.")

bill = float(input("What was the bill? "))
tip = int(input("what percentage tip would you like to give? 10, 12, 15? "))
people_to_split = int(input("How many people are there to split? "))
total_bill = bill * (1 + tip / 100)
bill_per_person = round(total_bill / people_to_split, 2)
print(f"each person needs to pay {bill_per_person}")

age = int(input("What is your current age?"))
new_age = 90 - age
days_left = new_age * 365
weeks_left = new_age * 52
months_left = new_age * 12
print(f"you have {days_left} days, {weeks_left} weeks and {months_left} months left.")

print("Welcome to BMI calculator")

weight = float(input("Please enter your weight in kg:\n"))
height = float(input("Please enter your height in m:\n"))
BMI = weight / height ** 2
new_BMI = int(BMI)
print(f"Your BMI is {new_BMI}")

num = input("Please enter a two digit number.")
digit_1 = num[0]
digit_2 = num[1]
result = int(digit_1) + int(digit_2)

print(result)

print("Welcome to Band Name Generator.")
city = input("What city did you grew up in?\n ")
pet = input("What's your pets name?\n")
print("Your band name could be " + city + " " + pet)

{% capture boldCartCount %}{% render 'bold-options-hybrid-cart-item-count' with cart %}{% endcapture %}
{% assign cartItemCount = boldCartCount | plus: 0 %}
{% if cartItemCount == 0 %}
  {% assign cart = empty %}
{% endif %}

name = "Duhita"
print("hello " + name)

name = "Isha"
print("hello " + name)
EXERCISE
a = input("a:")
b = input("b:")
c = a
a = b
b = c
print("a = "+a)
print("b = "+b)

%%[
set @SL_segment = LastProductViewed

set @ContentRows = LookupRows('EP_POI_Nurture_Sendable')
set @ContentRow = row(@ContentRows,1)

IF @SL_segment IS NOT NULL THEN
set @Subject = "Ready to Make the Right Choice?"
set @Preheader = "See genset options."
ELSE
set @Subject = "[NEW] Tools for Faster Sizing"
set @Preheader = "Find the right genset."
ENDIF
]%%

name = input("What is your name? ")
length = len(name)
print(f"Your name has {length} characters. ")


num = len(input("What is your name?"))
print(f"Your name has {num} characters.")

print("hello " + input("What is your name?") + "!")

first player pick two digit number and then second player pick another two digit number. now add both the numbers and show me the result.
player_one = int(input("pick a two digit number: "))
player_two = int(input("pick a two digit number: "))

answer = player_one + player_two
print(f"The result is {answer}")

Fix the code
print(Day 1 - String Manipulation")
print("String Concentration is done with the "+" sign.")
 print('e.g print(Hello " + ")')
print(("New lines can be created with a backslash and n.")

print("I love you Isha\nI love you Isha\nI love you Isha")
print("Hello " +  " " + "Duhita") 
print("Hello " + "Duhita") or ("Hello" + " Duhita")

print("I love you Isha")
print("Day 1 - Python Print Function")
print("The function is declared like this:")
print("print('what to print')")

wiBZd9CLLqTNPUpZmrf5M2GSx-E10t1AmueczbCwjg2k3QyfAgAAAA2

I highly recommend you tf.data.Dataset for creating the dataset:

Do all processes (like resize and normalize) that you want on all images with dataset.map.
Instead of using train_test_split, Use dataset.take, datast.skip for splitting dataset.
Code for generating random images and label:

# !pip install autokeras
import tensorflow as tf
import autokeras as ak
import numpy as np

data = np.random.randint(0, 255, (45_000,32,32,3))
label = np.random.randint(0, 10, 45_000)
label = tf.keras.utils.to_categorical(label) 
 Save
Convert data & label to tf.data.Dataset and process on them: (only 55 ms for 45_000, benchmark on colab)

dataset = tf.data.Dataset.from_tensor_slices((data, label))
def resize_normalize_preprocess(image, label):
    image = tf.image.resize(image, (16, 16))
    image = image / 255.0
    return image, label

# %%timeit 
dataset = dataset.map(resize_normalize_preprocess, num_parallel_calls=tf.data.AUTOTUNE)
# 1 loop, best of 5: 54.9 ms per loop
 Save
Split dataset to 80% for train and 20% for test
Train and evaluate AutoKeras.ImageClassifier
dataet_size = len(dataset)
train_size = int(0.8 * dataet_size)
test_size = int(0.2 * len(dataset))

dataset = dataset.shuffle(32)
train_dataset = dataset.take(train_size)
test_dataset = dataset.skip(train_size)

print(f'Size dataset : {len(dataset)}')
print(f'Size train_dataset : {len(train_dataset)}')
print(f'Size test_dataset : {len(test_dataset)}')

clf = ak.ImageClassifier(overwrite=True, max_trials=1)
clf.fit(train_dataset, epochs=1)
print(clf.evaluate(test_dataset))

document.getElementsByTagName("h1")[0].style.fontSize = "6vw";

body {

  font-family: system-ui;

  background: #f0d06;

  color: white;

  text-align: center;
6
}

document.getElementsByTagName("h1")[0].style.fontSize = "6vw";

public static Nullable<T> ToNullable<T>(this string s) where T: struct
{
    Nullable<T> result = new Nullable<T>();
    try
    {
        if (!string.IsNullOrEmpty(s) && s.Trim().Length > 0)
        {
            TypeConverter conv = TypeDescriptor.GetConverter(typeof(T));
            result = (T)conv.ConvertFrom(s);
        }
    }
    catch { } 
    return result;
}

app.listen(4002, async () => {
  console.log("Listening on 4002");
  try {
    const res = await axios.get("http://localhost:4005/events");
 
    for (let event of res.data) {
      console.log("Processing event:", event.type);
 
      handleEvent(event.type, event.data);
    }
  } catch (error) {
    console.log(error.message);
  }
});

public class MeleeEnemy : EnemyBaseClass
{
    // Start is called before the first frame update
    private new void Start()
    {
        base.Start();
    }

    private void Update()
    {
        UpdateSortingOrder();
    }

    private void FixedUpdate()
    {
        if (!killed)
        {
            Move();
        }
    }
}

protected void UpdateSortingOrder()
    {
        enemySr.sortingOrder = Mathf.RoundToInt((1-Mathf.Lerp(0, 1, _mainCamera.WorldToViewportPoint(transform.position).y))*100);
    }

    
    protected void Move()
    {
        var currPosition = transform.position;
        Vector2 desiredVelocity = (player.position - currPosition).normalized * enemyStats.movementSpeed;
        Vector2 velocity = enemyRb.velocity;
        
        // Has no effect, statement is never true
        if (velocity.magnitude > 1.05 * enemyStats.movementSpeed)
        {
            StartCoroutine(FixMovementSpeed());
            Debug.Log("Fixed MovementSpeed!");
        }
        else
        {
            //calculate a steering value:
            var steering = (desiredVelocity * Time.fixedDeltaTime - velocity);

            //ensure the steering isn't too strong
            steering = Vector2.ClampMagnitude(steering, maxSteeringForce);

            //apply the steering force by setting the velocity
            velocity = velocity + steering;
        
            //set animator parameters
            Vector2 facing = velocity.normalized;
            enemyAnimator.SetFloat("XFacing", facing.x);
            enemyAnimator.SetFloat("YFacing", facing.y);

            if (debug)
            {
                Debug.DrawLine(currPosition, (Vector2)currPosition + velocity * 60, Color.white);
                Debug.DrawLine(currPosition, (Vector2)currPosition + desiredVelocity * 60, Color.red);
                Debug.DrawLine((Vector2)currPosition + velocity * 60, (Vector2)currPosition + velocity * 60 + steering * 600, Color.green);
            }

            //Rigidbody moveposition function is used here, as it resolves collisions. As such, this function is written in FixedUpdate
            enemyRb.MovePosition(transform.position + (Vector3)velocity);

            //make the sprite face the direction it is travelling (unless we said not to, in the case of the player object)
            if (rotateSprite) transform.rotation = Quaternion.LookRotation (Vector3.forward, (Vector2)(transform.position - prevPosition));

            //calculate the velocity (for others to read)
            velocity = (Vector2)(transform.position - prevPosition);
            prevPosition = currPosition;
        }
    }


    private IEnumerator FixMovementSpeed()
    {
        enemyRb.constraints = RigidbodyConstraints2D.FreezeAll;
        yield return new WaitForSeconds(0.05f);
        enemyRb.constraints = RigidbodyConstraints2D.FreezeRotation;
    }

The introduction of computerized technology in the healthcare sector - the promised to bring a qualitative change to patient one. While in various ways there was a bump in the service they received, patients should have experienced higher value all over the board. 

Let’s see some of the examples of integration of Healthcare and blockchain technology. 

Remote Patient Monitoring (RPM)

RMP should to have allowed the shift from episodic to preventative healthcare delivery. This should have been feasible with proactive patient monitoring with "Internet of Things" (IoT) approved devices. The RMP market is predicted to reach $535 Million in united states. RMP devices collect PHI, which needs protection, therefore, a private blockchain is the right choice in this case.
Smart contracts on this private blockchain analyze patient health data.

Electronic Medical Records (EMRs)

EMRs record patient data in the format of electronical, that should have reduced the requirement of paper-based processes. This should have permitted multiple healthcare providers to seamlessly access patient data. This was supposed to significantly enhance the provision of healthcare services. To secure EMRs, Medicalchain uses Hyperledger Fabric, an enterprise blockchain.

There are many healthcare blockchain business ideas that have significant potential. However, integrating any of these ideas is a complex process. Blockchain development requires a lot of expertise and planning, so you might want to get proficient help.

package com.example.DemoElasticsearch.Exception;

public class BadRequest  extends RuntimeException {
        public BadRequest(String message) {
            super(message);
        }
}

package com.example.DemoElasticsearch.Exception;

import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.Getter;
import lombok.Setter;

@Data
@AllArgsConstructor
@Getter
@Setter
public class ErrorMessage {
    private String code;
    private String msg;
}

package com.example.DemoElasticsearch.Exception;

import org.springframework.http.HttpStatus;
import org.springframework.web.bind.annotation.ExceptionHandler;
import org.springframework.web.bind.annotation.ResponseStatus;
import org.springframework.web.bind.annotation.RestControllerAdvice;

@RestControllerAdvice
public class CustomHandleException {
    @ExceptionHandler(SeverError.class)
    @ResponseStatus(HttpStatus.INTERNAL_SERVER_ERROR)
    public ErrorMessage internalServerError(Exception exception){
        return new ErrorMessage("500",exception.getMessage());
    }
    @ExceptionHandler(BadRequest.class)
    @ResponseStatus(HttpStatus.BAD_REQUEST)
    public ErrorMessage badRequest(Exception exception) {
        return new ErrorMessage("400", exception.getMessage());
    }
    @ExceptionHandler(NotFound.class)
    @ResponseStatus(HttpStatus.NOT_FOUND)
    public ErrorMessage notfound(Exception exception) {
        return new ErrorMessage("404", exception.getMessage());
    }
}

package com.example.DemoElasticsearch.Mapper;

import com.example.DemoElasticsearch.entity.Employee;
import com.example.DemoElasticsearch.request.AddEmployeeRequest;
import com.example.DemoElasticsearch.response.EmployeeResponse;
import org.mapstruct.Mapper;
import org.mapstruct.Mapping;

@Mapper(componentModel = "spring")
public abstract class EmployeeMapper {
    @Mapping(target = "id",expression = "java(com.example.DemoElasticsearch.until.Until.generateId())")
    @Mapping(target = "created_time",expression = "java(com.example.DemoElasticsearch.until.Until.createDateRealTime())")
    public abstract Employee convertAttribute(AddEmployeeRequest addEmployeeRequest);
    public abstract EmployeeResponse convertAttribute(Employee employee);
}

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Your Website Title</title>
    <link rel="stylesheet" type="text/css" href="code-1.css">
</head>
<body>
    <header>
        <h1>Welcome to Your Website</h1>
        <nav>
            <ul>
                <li><a href="#">Home</a></li>
                <li><a href="#">About</a></li>
                <li><a href="#">Contact</a></li>
            </ul>
        </nav>
    </header>

    <main>
        <section>
            <h2>About Us</h2>
            <p>This is the about us section.</p>
        </section>

        <section>
            <h2>Contact Us</h2>
            <p>You can reach us at <a href="mailto:info@example.com">info@example.com</a>.</p>
        </section>
    </main>

    <footer>
        <p>&copy; 2023 Your Website. All rights reserved.</p>
    </footer>
</body>
</html>

<========================================== CB Transformations Html =============================================>


<div class="transformation-wrapper">
  {% if  module.heading %}
  <div class="top-section">
    <div class="top-section-content">
      <h3>
        {{ module.heading }}
      </h3>
    </div>
  </div>
  {% endif %}
  <div class="advanced-gallery-wrapper with-overlay">
    <button class="fullscreen-icon">

    </button>
    <button class="close-fullscreen-icon">

    </button>

    <div class="advanced-gallery-inner">
      <div class="prevArrow">
        <img alt="Preview" src="{{ get_asset_url('../../images/popup-prev-Icon.svg') }}">
        <img alt="Preview" src="{{ get_asset_url('../../images/slick-slider-Icon.svg') }}" class="normal-slider prev-icon">
      </div>
      <div class="nextArrow">
        <img alt="Next" src="{{ get_asset_url('../../images/popup-next-Icon.svg') }}">
        <img alt="Next" src="{{ get_asset_url('../../images/slick-slider-Icon.svg') }}" class="normal-slider next-icon">
      </div>

      <div class="advanced-gallery-slider">
        {% for item in module.transformation %}
        <div class="advanced-gallery-item media-type-image">
          <div class="advanced-gallery-item-inner-wrapper with-content">
            <div class="advanced-gallery-item-inner">
              {% if item.image_field.src %}
              <div class="advanced-gallery-item-media">
                <div class="advanced-gallery-item-image" style="background-image: url('{{ item.image_field.src }}');"></div>
                <img src="{{ item.image_field.src }}" alt="{{ item.title }}" class="advanced-gallery-item-image-open" />
              </div>
              {% endif %}
              {% if item.title %}
              <div class="advanced-gallery-item-content">
                <div class="advanced-gallery-item-content-inner">
                  <div class="advanced-gallery-item-content-title">{{ item.title }}</div>
                </div>
              </div>
              {% endif %}
            </div>
          </div>
        </div>
        {% endfor %}
      </div>

    </div>
   
  </div>
  {% if  module.bottom_text %}
  <div class="bottom-section clearfix">
    <div class="bottom-section-content">
      <h3>
        {{ module.bottom_text }}
      </h3>
    </div>
  </div>
  {% endif %}
</div>



<========================================== CB Transformations css =============================================>

.transformation-wrapper .top-section-content h3 {
  font: italic normal bold 120px/1.4em dinneuzeitgroteskltw01-_812426,sans-serif;
  margin-top: 3px;
  text-align: center;
  font-size: 48px;
  font-style: normal;
  color: #E81947;
  font-weight: normal;
  margin-bottom: 0;
}

.transformation-wrapper .top-section-content {
  background: #000;
  width: 100%;
  float: left;
  padding-left: 15px;
}

/* Gallery Styles */
.transformation-wrapper .advanced-gallery-wrapper {
  padding: 0;
  position: relative;
  width: 100%;
}
.transformation-wrapper .advanced-gallery-inner {
  position: relative;
}
.transformation-wrapper .advanced-gallery-wrapper .advanced-gallery-slider {
  margin-bottom: 0;
}

.transformation-wrapper .advanced-gallery-item-media {
  position: relative;
  padding-bottom: 100%;
  overflow: hidden;
  width: 100%;
  cursor: pointer;
}
.transformation-wrapper .advanced-gallery-item-video,
.transformation-wrapper .advanced-gallery-item-image {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  max-width: 100%;
  object-fit: cover;
}
.transformation-wrapper .advanced-gallery-item-image {
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

.transformation-wrapper .advanced-gallery-item-inner-wrapper {
  padding: 6px 5px 10px;
}

.transformation-wrapper .advanced-gallery-item-media:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  cursor: pointer;
  z-index: 1;
}

/* overlay */
.transformation-wrapper .advanced-gallery-wrapper.with-overlay
.advanced-gallery-item-media:hover:before {
  background: rgba(153, 153, 151, 0.6);
}

.transformation-wrapper .advanced-gallery-wrapper .slick-arrow {
  position: absolute;
  padding: 0;
  top: 50%;
  left: 0;
  z-index: 99;
  cursor: pointer;
  width: 23px;
  height: 39px !important;
}
.transformation-wrapper .advanced-gallery-wrapper .prevArrow svg *,
.transformation-wrapper .advanced-gallery-wrapper .nextArrow svg * {
  display: none;
}
.transformation-wrapper .advanced-gallery-wrapper .slick-arrow.slick-disabled {
  opacity: 0;
  pointer-events: none;
}
.transformation-wrapper .advanced-gallery-wrapper .slick-arrow svg {
  -webkit-filter: drop-shadow(0px 1px 0.15px #b2b2b2);
  filter: drop-shadow(0px 1px 0.15px #b2b2b2);
  vertical-align: middle;
  margin: 0 auto;
}
.transformation-wrapper .advanced-gallery-wrapper .slick-arrow svg path {
  fill: #ffffff;
}
.transformation-wrapper .advanced-gallery-wrapper .nextArrow {
  right: 24px;
  left: auto;
}

.transformation-wrapper .advanced-gallery-wrapper .slick-arrow.prevArrow {
  left: 24px;
}

.transformation-wrapper .advanced-gallery-item-image-open,
.transformation-wrapper .advanced-gallery-wrapper .close-fullscreen-icon,
.transformation-wrapper .advanced-gallery-wrapper .fullscreen-icon {
  display: none !important;
}

.transformation-wrapper button.fullscreen-icon {
  background-color: #ffffff;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: 0;
  margin: 0;
  outline: none;
  background: rgba(255, 255, 255, 1);
  margin-left: 35px;
  font-size: 26px;
  margin-top: -4px;
  margin-right: 45px;
  z-index: 100;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  width: 38px;
  height: 44px !important;
  line-height: 44px;
  text-align: center;
  top: 30px;
  transition: opacity 0.8s ease;
  display: inline;
  border: none;
  position: fixed;
  left: 0;
  color: rgb(0, 0, 0);
}
.transformation-wrapper button.close-fullscreen-icon {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: 0;
  margin: 0;
  color: rgb(0, 0, 0);
  background: rgba(255, 255, 255, 1);
  font-size: 26px;
  z-index: 100;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  width: 38px;
  height: 44px !important;
  line-height: 44px;
  text-align: center;
  top: 30px;
  transition: opacity 0.8s ease;
  outline: none;
  padding: 0;
  right: 0;
  position: fixed;
  margin-right: 30px;
  border: none;
}
.transformation-wrapper .fullscreen-icon svg,
.transformation-wrapper .close-fullscreen-icon svg {
  width: 30px;
}

.transformation-wrapper .advanced-gallery-wrapper .slick-arrow svg:last-child {
  display: none !important;
}

/* dots styles */
.transformation-wrapper .advanced-gallery-slider ul.slick-dots {
  position: relative;
  bottom: 0;
  margin-top: 20px;
}
.transformation-wrapper .advanced-gallery-slider ul.slick-dots li button {
  display: none;
}
.transformation-wrapper .advanced-gallery-slider ul.slick-dots li {
  background-color: #f1f1f1;
  border-radius: 50%;
  width: 15px;
  height: 15px;
}
.transformation-wrapper .advanced-gallery-slider ul.slick-dots li.slick-active {
  background-color: rgba(153, 153, 151, 0.6);
}

/* start center mode with left */
/* @media (min-width: 768px) {
body:not(.gallery-open)
.advanced-gallery-inner
> .prevArrow.slick-disabled
~ .advanced-gallery-slider
> .slick-list {
padding-left: 0 !important;
padding-right: 48.8% !important;
margin-left: -10px;
}
body:not(.gallery-open)
.advanced-gallery-inner
> .nextArrow.slick-disabled
~ .advanced-gallery-slider
> .slick-list {
padding-right: 0 !important;
padding-left: 48.8% !important;
margin-right: -10px;
}
} */



@media (max-width: 991px) {
  .transformation-wrapper .advanced-gallery-item-media {
    padding-bottom: 68%;
  }
}

@media (max-width: 767px) {
  .transformation-wrapper .advanced-gallery-wrapper {
    padding: 0 20px;
  }
  .transformation-wrapper .advanced-gallery-item-inner-wrapper {
    padding: 0;
  }
  .transformation-wrapper .advanced-gallery-item-media {
    padding-bottom: 68%;
  }

  .transformation-wrapper button.close-fullscreen-icon {
    top: 5px;
    right: 5px;
    margin-right: 0;
    font-size: 14px;
  }
  .transformation-wrapper button.fullscreen-icon {
    top: 5px;
    left: 5px;
    margin-left: 0;
    font-size: 20px;
  }
}

/* With Content Styles */
.transformation-wrapper .advanced-gallery-item-content {
  display: none;
}

.transformation-wrapper .advanced-gallery-item-content * {
  height: auto !important;
}

.transformation-wrapper .advanced-gallery-item-content-desc {
  margin-bottom: 18px;
  font-family: helvetica-w01-bold, sans-serif;
  font-size: 40px;
  line-height: 1.4;
  color: #000000;
}

.transformation-wrapper .advanced-gallery-item-content-title {
  color: rgba(65,65,65,1);
  font: italic normal bold 120px/1.4em dinneuzeitgroteskltw01-_812426,sans-serif;
  outline: none;
  font-size: 5.46875vw;
}

.transformation-wrapper .advanced-gallery-item-content-inner {
  padding-top: 30px;
}

.transformation-wrapper .bottom-section h3 {
  font: normal normal normal 50px/1.4em dinneuzeitgroteskltw01-_812426,sans-serif;
  font-size: 30px;
  color: #FFFFFF;
  text-align: center;
  margin: 0;
  padding-top: 1px;
}

.transformation-wrapper .bottom-section {
  background-color: #e81947;
  padding-left: 14px;
}

.transformation-wrapper .advanced-gallery-inner .slick-arrow img:not(.normal-slider) {
  display: none;
}

.transformation-wrapper .advanced-gallery-inner .slick-arrow img.normal-slider.prev-icon {
  transform: rotate(180deg);
}


@media (min-width: 768px) {
  .transformation-wrapper .advanced-gallery-inner.button-right .nextArrow.slick-arrow {
    right: 0;
  }
  .transformation-wrapper .advanced-gallery-inner.button-right
  .advanced-gallery-item.media-type-video
  .advanced-gallery-item-media {
    width: 100%;
    padding-right: 0;
  }
}

@media (min-width: 1601px) and (max-height: 640px) {

  .transformation-wrapper .advanced-gallery-item-content-title,
  .transformation-wrapper .advanced-gallery-item-content-desc {
    font-size: 6.25vh;
  }
}

@media (min-width: 1200px) and (max-width: 1600px) {
  .transformation-wrapper .advanced-gallery-item-content-desc {
    font-size: 30px;
  }

}
@media (min-width: 1200px) and (max-height: 640px) {
  .transformation-wrapper .advanced-gallery-item-content-title,
  .transformation-wrapper .advanced-gallery-item-content-desc {
    font-size: 3.5vh;
  }

}

@media (min-width: 768px) and (max-width: 1600px) {
  .transformation-wrapper .advanced-gallery-item-content-desc {
    font-size: 26px;
  }

}

@media (min-width: 768px) and (max-width: 1199px) {
  .transformation-wrapper .advanced-gallery-item-content-desc {
    font-size: 20px;
  }

}

@media (min-width: 768px) and (max-height: 640px) {
  .transformation-wrapper .advanced-gallery-item-content-title,
  .transformation-wrapper .advanced-gallery-item-content-desc {
    font-size: 3.8vh;
  }

}


@media (max-width: 767px) {
  .transformation-wrapper .top-section-content h3 {
    font-size: 25px;
    margin: 10px 0px 10px 0;
  }
  .transformation-wrapper .top-section-content {
    padding-left: 0;
  }
  .transformation-wrapper .bottom-section h3 {
    font-size: 21px;
    margin: 10px 0px 10px 0;
  }
  .transformation-wrapper .bottom-section {
    padding-left: 0;
  }
  .transformation-wrapper .advanced-gallery-item-content-desc {
    font-size: 16px;
    margin-bottom: 10px;
  }
  .transformation-wrapper .advanced-gallery-item-content {
    text-align: center;
  }
  .transformation-wrapper .advanced-gallery-slider ul.slick-dots li {
    width: 10px;
    height: 10px;
  }

  .advanced-gallery-wrapper .slick-slider .slick-list {
    width: 100%;
  }

}

@media (max-width: 480px) {
  .transformation-wrapper .advanced-gallery-item-content-desc {
    font-size: 12px;
    margin-bottom: 5px;
  }
}


@media(max-width:767px){

  .transformation-wrapper .advanced-gallery-wrapper {
    padding: 0;
  }

  .transformation-wrapper .advanced-gallery-item-media {
    padding-bottom: 100%;
  }

  .transformation-wrapper .advanced-gallery-wrapper img.normal-slider {
    display: none;
  }

  .transformation-wrapper .advanced-gallery-item-content-title {
    font: italic normal bold 120px/1.4em dinneuzeitgroteskltw01-_812426,sans-serif !important;
  }

  .transformation-wrapper .advanced-gallery-item-content-inner {
    padding-top: 0;
    padding-right: 10px;
    padding-left: 10px;
    margin-bottom: 100px;
  }

  .transformation-wrapper .advanced-gallery-item-content {
    text-align: left;
  }

.transformation-wrapper .advanced-gallery-item-content-title {
    font-size: 35px !important;
    text-align: center;
}
 
}


<========================================== CB Transformations JS =============================================>


(function () {
  // Slick Init
  var curOptions = 0,
      arrOptions = [
        {
          centerMode: true,
          centerPadding: "12.7%",
          slidesToShow: 3,
          fade: false,
          infinite: true,
          dots: false,
        },
        {
          centerMode: false,
          centerPadding: "0px",
          slidesToShow: 1,
          fade: true,
          dots: false,
          infinite: false
        }
      ];
  var myCarousel = $(".advanced-gallery-slider").slick(
    $.extend(
      {
        dots: true,
        infinite: false,
        draggable: false,
        slidesToShow: 3,
        centerMode: true,
        centerPadding: "10px",
        nextArrow: $(".nextArrow"),
        prevArrow: $(".prevArrow"),
        responsive: [
          {
            breakpoint: 768,
            settings: {
              //                 unslick: true,
              centerMode: false,
              centerPadding: "0px",
              slidesToShow: 1,
              fade: true,
              dots: false
            }
          }
        ]
      },
      arrOptions[curOptions]

    )
  );

  // toggle slick center mode and normal mode
  function switchOptions() {
    curOptions = curOptions ? 0 : 1;
    if (document.body.classList.contains("gallery-open")) {
      curOptions = 1;
      myCarousel.slick("slickSetOption", arrOptions[curOptions], true);

      setTimeout(function () {
        myCarousel.slick("refresh");
      }, 500);

      $(".advanced-gallery-wrapper").one("click", function () {
        setTimeout(function () {
          myCarousel.slick("refresh");
        }, 500);
      });
    } else {
      curOptions = 0;
      myCarousel.slick("slickSetOption", arrOptions[curOptions], true);
    }
  }

  window.addEventListener("load", function () {
    document.body.classList.add("gallery-loaded");
  });

  // Active video play js
  var sliderWrapper = document.querySelector(".advanced-gallery-wrapper");
  var slides = document.querySelectorAll(".advanced-gallery-item");
  var videoSlidesVideos = document.querySelectorAll(
    ".advanced-gallery-item.media-type-video iframe"
  );
  var sliderArrows = document.querySelectorAll(
    ".gallery-open .advanced-gallery-wrapper .slick-arrow"
  );

  var withContentSlides = document.querySelectorAll(
    ".advanced-gallery-item-inner-wrapper"
  );
  Array.prototype.slice.call(withContentSlides).forEach(function (slide) {
    if (slide.classList.contains("with-content")) {
      sliderWrapper.classList.add("with-content");
    }
  });

  var currentPos = 0;
  var previousPos = 0;
  sliderWrapper.addEventListener("click", function () {
    function myFunction(x) {
      if (x.matches) {
        switchOptions();
      }
    }
    var x = window.matchMedia("(min-width: 768px)");
    myFunction(x);
    x.addListener(myFunction);

    if (document.body.classList.contains("gallery-open")) {
      Array.prototype.slice.call(slides).forEach(function (slide, index) {
        if (slide.classList.contains("media-type-video")) {
          currentPos = index;

          Array.prototype.slice
            .call(videoSlidesVideos)
            .forEach(function (video) {
            video.setAttribute(
              "src",
              video.getAttribute("src").split("?")[0]
            );
            var symbol = video.src.indexOf("?") > -1 ? "&" : "?";
            if (slide.classList.contains("slick-active")) {
              if (currentPos != previousPos) {
                video.src += symbol + "rel=0&amp;autoplay=1&controls=0";
              } else {
                video.src += symbol + "rel=0&amp;autoplay=1";
//                 setTimeout(function () {
//                   slide.parentElement.parentElement.parentElement.parentElement.classList.add(
//                     "button-right"
//                   );
//                 }, 100);
              }
            }
          });
          previousPos = currentPos;
        } else {
//           slide.parentElement.parentElement.parentElement.parentElement.classList.remove(
//             "button-right"
//           );
        }
      });
    } else {
      Array.prototype.slice.call(videoSlidesVideos).forEach(function (video) {
        if (
          video.src.indexOf("rel=0&amp;autoplay=") > -1 ||
          video.src.indexOf("?") > -1
        ) {
        } else {
          video.setAttribute("src", video.getAttribute("src").split("?")[0]);
          var symbol = video.src.indexOf("?") > -1 ? "&" : "?";
          video.src += symbol + "rel=0&amp;autoplay=1&mute=1&controls=0";
        }
        if (
          video.src.indexOf("?rel=0&amp;autoplay=1") > -1 &&
          video.src.indexOf("rel=0&amp;autoplay=1&mute=1&controls=0") < 0
        ) {
          video.setAttribute("src", video.getAttribute("src").split("?")[0]);
          var symbol = video.src.indexOf("?") > -1 ? "&" : "?";
          video.src += symbol + "rel=0&amp;autoplay=1&mute=1&controls=0";
        }
      });
    }
  });

  // popup js
  var sliderItems = document.querySelectorAll(".advanced-gallery-item-media");
  Array.prototype.slice.call(sliderItems).forEach(function (item) {
    item.addEventListener("click", function (e) {
      if (document.body.classList.contains("gallery-open")) {
      } else {
        document.body.classList.add("gallery-open");
        // imulator scroll
        Array.prototype.slice.call(slides).forEach(function (slide, index) {
          var b = window.innerHeight;
          var c = slide.offsetHeight;
          if (c > b) {
            sliderWrapper.classList.add("top_space");
          } else {
            sliderWrapper.classList.remove("top_space");
          }
        });
      }
    });
  });

  // imulator scroll
  window.addEventListener("resize", function () {
    Array.prototype.slice.call(slides).forEach(function (slide, index) {
      var b = window.innerHeight;
      var c = slide.offsetHeight;
      if (c > b) {
        sliderWrapper.classList.add("top_space");
      } else {
        sliderWrapper.classList.remove("top_space");
      }
    });
  });

  // Full Screen Functionality
  var elem = document.querySelector(".advanced-gallery-wrapper");
  var fullscreenBtn = document.querySelector(".fullscreen-icon");
  var closeFullscreenBtn = document.querySelector(".close-fullscreen-icon");



  fullscreenBtn.addEventListener("click", function () {
    document.body.classList.remove("fullscreen-open");
    toggleFullscreen(elem);
  });
  closeFullscreenBtn.addEventListener("click", function () {
    document.body.classList.remove("fullscreen-open");
    document.body.classList.remove("gallery-open");
    closeFullscreen();

    myCarousel.slick("slickSetOption", arrOptions[0], true);
    myCarousel.slick("refresh");
  });

  // toggleFullscreen
  function toggleFullscreen(elem) {
    elem = elem || document.documentElement;
    if (
      !document.fullscreenElement &&
      !document.mozFullScreenElement &&
      !document.webkitFullscreenElement &&
      !document.msFullscreenElement
    ) {
      if (elem.requestFullscreen) {
        elem.requestFullscreen();
        document.body.classList.add("fullscreen-open");
      } else if (elem.msRequestFullscreen) {
        elem.msRequestFullscreen();
        document.body.classList.add("fullscreen-open");
      } else if (elem.mozRequestFullScreen) {
        elem.mozRequestFullScreen();
        document.body.classList.add("fullscreen-open");
      } else if (elem.webkitRequestFullscreen) {
        elem.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
        document.body.classList.add("fullscreen-open");
      }
    } else {
      if (document.exitFullscreen) {
        document.exitFullscreen();
        document.body.classList.remove("fullscreen-open");
      } else if (document.msExitFullscreen) {
        document.msExitFullscreen();
        document.body.classList.remove("fullscreen-open");
      } else if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen();
        document.body.classList.remove("fullscreen-open");
      } else if (document.webkitExitFullscreen) {
        document.webkitExitFullscreen();
        document.body.classList.remove("fullscreen-open");
      }
    }
  }
  // closeFullscreen
  function closeFullscreen() {
    if (
      document.fullscreenElement ||
      document.mozFullScreenElement ||
      document.webkitFullscreenElement ||
      document.msFullscreenElement
    ) {
      if (document.exitFullscreen) {
        document.exitFullscreen();
        document.body.classList.remove("fullscreen-open");
      } else if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen();
        document.body.classList.remove("fullscreen-open");
      } else if (document.webkitExitFullscreen) {
        document.webkitExitFullscreen();
        document.body.classList.remove("fullscreen-open");
      } else if (document.msExitFullscreen) {
        document.msExitFullscreen();
        document.body.classList.remove("fullscreen-open");
      }
    }
  }

  // exit fullscreen
  document.body.addEventListener("keyup", function (e) {
    if (e.which == 27) {
      document.body.classList.remove("fullscreen-open");
    }
  });

  // set image in background for IE
  if ("objectFit" in document.documentElement.style === false) {
    $(".advanced-gallery-item-media img").each(function () {
      var w = $(this).width();
      var h = $(this).height();
      var s = $(this).attr("src");
      var final =
          "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='" +
          w +
          "' height='" +
          h +
          "'%3E%3C/svg%3E";
      $(this).css("background", "url(" + s + ") no-repeat 50% center /cover");
      $(this).attr("src", final);
    });
  }
})();

$('.advanced-gallery-item').click(function(e) {
  e.preventDefault();
  var slideno = $(this).attr('data-slick-index');
  $('.advanced-gallery-slider').slick('slickGoTo', slideno );
});



<========================== CB Transformations SS ===============================>

https://prnt.sc/ewf0tRsxH-6m
https://prnt.sc/FQ1kNYnePTmH

<div class="custom-categories">
 {% if not simple_list_page %}
 {% set my_posts = blog_recent_posts('group.id', limit=4) %}
 {% set my_topics = blog_topics('group.id', 8) %} 
 <ul>
<li class="tab-all"> 
 <a href="{{ group.absolute_url }}">All</a>
</li>
{% for item in my_topics %} 
<li><a href="{{ blog_tag_url(group.id, item.slug) }}">{{ item }}</a></li> 
{% endfor %} 
 </ul>   
 {% endif %}
</div>


$(function(){
 var value1 = window.location.href.substring(window.location.href.lastIndexOf('/') + 1); 
 $('.custom-categories ul li a').each(function(){
   var url = $(this).attr('href');
   var lastSegment = url.split('/').pop();
   if (lastSegment == value1) {
     $(this).parent().addClass('active'); 
     $(this).parent().siblings().removeClass('active');
   }
 }); 
});  


//================= topics with active in label

      <div class="dropdown">
        <label class="dropdown__label">
          <span>
            Filter </span>
          <i class="fas fa-arrow-down"></i>
        </label>
        <div class="custom-categories">
          {% if not simple_list_page %}

          {% set my_topics = blog_topics('group.id', 8) %} 
          <ul>
            {% for item in my_topics %} 
            <li><a href="{{ blog_tag_url(group.id, item.slug) }}">{{ item }}</a></li> 
            {% endfor %} 
          </ul>   
          {% endif %}
        </div>

      </div>

//====================== Js

$(function () {
  var value1 = window.location.href.substring(window.location.href.lastIndexOf('/') + 1);
  $('.custom-categories ul li a').each(function () {
    var url = $(this).attr('href');
    var lastSegment = url.split('/').pop();
    if (lastSegment == value1) {
      if( $(this).html() == 'All' ){
        $('.dropdown__label span').html('Filter');
      } else {
        $('.dropdown__label span').html($(this).html());
      }

    }
  });
});

/* ==========================
TinyNav with active label style
========================== */

(function (e, t, n) {
  e.fn.tinyNav = function (r) {
    var s = e.extend({
      active: "selected",
      header: "",
      label: ""
    }, r);
    return this.each(function () {
      n++;
      var r = e(this),
          o = "tinynav",
          u = o + n,
          a = ".l_" + u,
          f = e("<select/>").attr({
            id: u
          }).addClass(o + " " + u);
      if (r.is("ul,ol")) {
        if (s.header !== "") {
          f.append(e('<option value="select-header"/>').text(s.header))
        }
        var l = "";
        r.addClass("l_" + u).find("a").each(function () {
          l += '<option value="' + e(this).attr("href") + '">';
          var t;
          for (t = 0; t < e(this).parents("ul, ol").length - 1; t++) {
            l += "- "
          }
          l += e(this).text() + "</option>"
        });
        f.append(l);
        if (!s.header) {
          f.find(":eq(" + e(a + " li").index(e(a + " li." + s.active)) + ")").attr("selected", true)
        } else {
          f.find(":eq(" + e(a + " li").index(e(a + " li." + s.active)) + ")").next().attr("selected", true)
        }
        f.change(function () {
          if (e(this).val() != "select-header") {
            t.location.href = e(this).val()
          }
        });
        e(a).after(f);
        if (s.label) {
          f.before(e("<label/>").attr("for", u).addClass(o + "_label " + u + "_label").append(s.label))
        }
      }
    })
  }
})(jQuery, this, 0)

// Configuration
$(function () {

  $('html').addClass('js-enabled');
  $('.hs-categories ul').tinyNav({
    active: 'active', // The class for the active item in menu (don't change)
    header: 'Menu' // Default value if there is no active item in menu (optional for COS)
    // label: '' // Add a label (optional)
  });

});


$(function () {
	var value1 = window.location.href.substring(window.location.href.lastIndexOf('/') + 1);
	$('.hs-categories ul li a').each(function () {
	   var url = $(this).attr('href');
	   var lastSegment = url.split('/').pop();
	   if (lastSegment == value1) {
		   if( $(this).html() == 'All' ){
			   $('select#tinynav1>option:first-child').html('Filter: All Categories');
		   } else {
			   $('select#tinynav1>option:first-child').html($(this).html());
		   }
		   
	   }
	});
});

================== html ================

<div class="image-slider">
  <div class="inner">
    <div class="slider-outer">
      <div class="sider-wrap">
        {% for item in module.slider_items %}
        <div class="item">
          <div class="img-wrap">
            {% if item.image_field.src %}
            {% set loadingAttr = item.image_field.loading != 'disabled' ? 'loading="{{ item.image_field.loading }}"' : '' %}
            <img src="{{ item.image_field.src }}" alt="{{ item.image_field.alt }}" {{ loadingAttr }} />
            {% endif %}
            <span class="jetpack-slideshow-line-height-hack">&nbsp;</span>
            <div class="jetpack-slideshow-slide-caption" itemprop="caption description"></div>
          </div>
        </div>
        {% endfor %}
      </div>
      <div class="jetpack-slideshow-controls">
        <a href="#" class="prev slick-prev" aria-label="Previous Slide" role="button"></a>
        <a href="javascript:void(0)" class="button-stop" aria-label="Pause Slideshow" role="button">pause</a>
        <a href="javascript:void(0)" class="next slick-next" aria-label="Next Slide" role="button"></a>
      </div>
    </div>
  </div>
</div>

================================== JS ================

$(document).ready(function(){

  $('.image-slider .sider-wrap').slick({
    dots: false,
    arrows: true,
    infinite: true,
    autoplay: true,
    autoplaySpeed:2000,
    speed: 500,
    slidesToShow: 1,
    slidesToScroll: 1,
    prevArrow: $('.prev'),
    nextArrow: $('.next'),
    fade: true,
    cssEase: 'linear',
    pauseOnHover:false
  });

  $('.button-stop').click( function() {
    if ($(this).html() == 'pause'){
      $('.image-slider .sider-wrap').slick('slickPause')
      $(this).html('play') 
    } else {
      $('.image-slider .sider-wrap').slick('slickPlay')  
      $(this).html('pause') 
    }  
  });


  $('.button-stop').click(function() {
    $(this).toggleClass('pause');
  })
})

https://lpl-4294384.hs-sites.com/sample-blog-triboxprivatewealth_march2023
https://triboxprivatewealth.com/contact/





// ========= mobile menu
$(".mobile-trigger").click(function(e) {
  e.stopPropagation(),
    e.preventDefault(),
    $(".site-wrapper .body-content-wrap").css({
    position: "relative",
    top: "-" + $(document).scrollTop() + "px"
  }),
    $("body").toggleClass("mobile-open"),
    $("body").toggleClass("active"),
    $("body").removeClass("mobile-open3");
  let bodyheight = $(window).innerHeight();
  setTimeout((function() {
    $(".site-wrapper").css("height", bodyheight),
      $("body").toggleClass("mobile-open2")
  }
             ), 40)
});

$(".mobile-trigger").click(function(e) {
  e.stopPropagation()
});

$("body, .slide_out_area_close").click(function() {
  if ($(window).width() < 991 & $("body").hasClass("mobile-open")) {
    $("body").removeClass("active");
    var elmPos = Math.abs($(".site-wrapper .body-content-wrap").css("top").replace("px", ""));
      $("body").addClass("mobile-open3"),
      window.scrollY = elmPos,
      document.documentElement.scrollTop = elmPos;
    var intVar = setInterval(function() {
      window.scrollY = elmPos,
        document.documentElement.scrollTop = elmPos
    }, 10);
    setTimeout(function() {
      window.scrollY = elmPos,
        document.documentElement.scrollTop = elmPos,
        $(".site-wrapper").css("height", "auto")
    }, 40),
      setTimeout(function() {
      $("body").removeClass("mobile-open2"),
        setTimeout(function() {
        $(".site-wrapper .body-content-wrap").css({
          position: "relative",
          top: "auto"
        }),
          $("body").removeClass("mobile-open3"),
          $('body').addClass('scroll-header animate'),
          setTimeout(function() {        
          $('body').addClass('scroll-header animate');
        }, 10),
          clearInterval(intVar),
          window.scrollY = elmPos,
          document.documentElement.scrollTop = elmPos
      }, 805)
    }, 40)
  }
})
$(".slide_out_area_close").click(function(e) {
  e.preventDefault()
});
$("body, .slide_out_area_close").click(function() {
  $("body").removeClass("mobile-open")
});



$(".mobile-trigger").click(function(e) {
  e.stopPropagation()
});


$('.slide-out-from-right .off-canvas-menu-container.mobile-only>ul li.hs-item-has-children>a').click(function(e) {
  e.preventDefault();
  $(this).parent().siblings('.hs-item-has-children').removeClass('child-open');
  $(this).parent().siblings('.hs-item-has-children').find('.hs-menu-children-wrapper').slideUp(300);
  $(this).next('.hs-menu-children-wrapper').slideToggle(300);
  $(this).next('.hs-menu-children-wrapper').children('.hs-item-has-children').find('.hs-menu-children-wrapper').slideUp(300);
  $(this).next('.hs-menu-children-wrapper').children('.hs-item-has-children').removeClass('child-open');
  $(this).parent().toggleClass('child-open');
  return false;
});

$(window).scroll(function(){
  if($(window).scrollTop() + $(window).height() > ($(document).height() - 100) ) {
    $('body').addClass('on-footer');
  }
  else{
    $('body').removeClass('on-footer');
  }

});


/* base html  */

  <div class="site-wrapper">
      <div class="site-wrapper-inner">
        <div class="body-wrapper {{ builtin_body_classes }}">
          <div class="body-wrapper-inner">
            {% block header %}
            {% global_partial path='../partials/header.html' %}
            {% endblock header %}
            <div class="body-content-wrap">
              {% block body %}
              {% endblock body %}

              {% block footer %}
              {% global_partial path='../partials/footer.html' %}
              {% endblock footer %}
            </div>

          </div>
        </div>
      </div>
    </div>



/*//============= css*/


.site-wrapper {
    transition: transform .8s cubic-bezier(.15,.2,.1,1);
    transform-origin: center;
    position: relative;
    z-index: 10;
  }



  .mobile-open .site-wrapper {
    height: 100vh;
  }

  .mobile-open2 .site-wrapper {
    -webkit-transition: transform .8s cubic-bezier(.15,.2,.1,1);
    transition: transform .8s cubic-bezier(.15,.2,.1,1);
    -webkit-transform: scale(.835) translateX(-466px) translateZ(0)!important;
    transform: scale(.835) translateX(-466px) translateZ(0)!important;

  }

  .mobile-open .site-wrapper,
  .mobile-open3 .site-wrapper {
    height: 100vh!important;
    overflow: hidden
  }

  .mobile-open2 .site-wrapper {
    overflow: hidden
  }

  .site-wrapper-inner {
    height: auto!important;
  }

  .mobile-open2 .site-wrapper-inner {
    -webkit-transform: scale(1.007)!important;
    transform: scale(1.007)!important;
    -webkit-transform-origin: top;
    transform-origin: top;
  }


  body.mobile-open {
    overflow: hidden
  }

  .mobile-open .site-wrapper-inner {
    pointer-events: none;
  }
  .mobile-open .site-wrapper {
    cursor: pointer;
  }

https://ivision.com/




Updated js 




var setMenuPosition = function setMenuPosition() {
  var target = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
  if (window.innerWidth < 992) {
    return;
  }
  var hover = false;
  if (target && target.type && 'button' !== target.type) {
    hover = true;
    var hoverType = target.type;
    target = target.target;
    if ('mouseover' === hoverType) {
      buttonHover = true;
      target.removeEventListener('mouseover', setMenuPosition);
      target.addEventListener('mouseout', setMenuPosition);
    } else if ('mouseout' === hoverType) {
      buttonHover = false;
      target.removeEventListener('mouseout', setMenuPosition);
      target.addEventListener('mouseover', setMenuPosition);
      target = null;
    }
  }
  if (target && !target.classList.contains('cm-search-button')) {
    if (!document.documentElement.style.getPropertyValue('--menuUnderlinePosition')) {
      document.body.classList.add('menu-underline-init');
      document.documentElement.style.removeProperty('--menuUnderlineWidth');
    }
    document.documentElement.style.setProperty('--menuUnderlinePosition', "".concat(target.parentElement.getBoundingClientRect().left / 16, "rem"));

    setTimeout(function () {
      document.body.classList.remove('menu-underline-init');
      document.documentElement.style.setProperty('--menuUnderlineWidth', "".concat(target.offsetWidth - parseInt(window.getComputedStyle(target).getPropertyValue('padding-right'))));
    }, 1);
  } else {
    document.documentElement.style.removeProperty('--menuUnderlineWidth');
    setTimeout(function () {
      if (!document.body.classList.contains('body-child-open') && false === buttonHover) {
        document.documentElement.style.removeProperty('--menuUnderlineWidth');
        document.documentElement.style.removeProperty('--menuUnderlinePosition');
      }
    }, 400);
  }
  if (true === hover) {
    return;
  }
  var megaMenuContent;
  if (target) {
    megaMenuContent = target.parentElement.parentElement.querySelector('.hs-menu-children-wrapper');
  }
  if (megaMenuContent) {
    if (!document.documentElement.style.getPropertyValue('--openMenuLeft')) {
      document.body.classList.add('mega-menu-init');
      document.documentElement.style.removeProperty('--openMenuWidth');
    }
    megaMenuContent.style.removeProperty('--menuOffset');
    var button = target.parentElement;
    var menuContentRect = megaMenuContent.getBoundingClientRect();
    var buttonRect = button.getBoundingClientRect();
    var megaMenuRect = megaMenuContent.parentElement.getBoundingClientRect();
    var offset;
    if (menuContentRect.left > buttonRect.left) {
      offset = buttonRect.left - menuContentRect.left + button.offsetWidth / 2 - megaMenuContent.offsetWidth / 2;
      if (menuContentRect.left + offset < megaMenuRect.left) {
        offset = megaMenuRect.left - menuContentRect.left;
      }
    } else if (menuContentRect.right < buttonRect.left) {
      offset = buttonRect.right - menuContentRect.right - button.offsetWidth / 2 + megaMenuContent.offsetWidth / 2;
      if (menuContentRect.right + offset > megaMenuRect.right) {
        offset = megaMenuRect.right - menuContentRect.right;
      }
      //offset = buttonRect.right - menuContentRect.right;
    }

    if (offset) {
      megaMenuContent.style.setProperty('--menuOffset', "".concat(offset / 16, "rem"));
      menuContentRect = megaMenuContent.getBoundingClientRect();
    }
    document.documentElement.style.setProperty('--openMenuLeft', "".concat(menuContentRect.left / 16, "rem"));
    document.documentElement.style.setProperty('--openMenuWidth', "".concat(megaMenuContent.offsetWidth));
    document.documentElement.style.setProperty('--openMenuBottom', "".concat((megaMenuContent.offsetTop + megaMenuContent.offsetHeight + 64) / 16, "rem"));
    document.body.classList.remove('mega-menu-init');
  } else {
    document.documentElement.style.removeProperty('--openMenuBottom');
    setTimeout(function () {
      if (!document.body.classList.contains('body-child-open')) {
        document.documentElement.style.removeProperty('--openMenuLeft');
        document.documentElement.style.removeProperty('--openMenuWidth');
      }
    }, 400);
  }
};


var hoverMenuButtons = document.querySelectorAll('.custom-menu-primary li.hs-menu-item.hs-menu-depth-1 > div > a');

function activeBorder(){
  hoverMenuButtons.forEach(function (menuButton) {
    menuButton.addEventListener('mouseover', setMenuPosition);
  });
}
activeBorder()  
//
 

{% if not simple_list_page %}
  <div class="blog-pagination">
      <!--{% if last_page_num %}
        <a class="previous-posts-link" href="{{ blog_page_link(last_page_num) }}">Previous</a>
      {% endif %}
      <a class="all-posts-link" href="{{ group.absolute_url }}/all">All posts</a>-->
      {% if next_page_num %}
      <a class="next-posts-link nav-previous load-more" href="{{ blog_page_link(next_page_num) }}" data-total-page-count="{{ contents.total_page_count }}">+ SHOW MORE</a>
      {% endif %}
  </div>
{% endif %}



<!-- Infinite Scroll with Masonry plugin -->
<script src='//cdn2.hubspot.net/hubfs/3476940/Emergenetics-July2017/Js/InfiniteScroll-Masonry.js'></script>



(function($, undefined) {
    $.extend($.infinitescroll.prototype,{

    	_setup_twitter: function infscr_setup_twitter () {
			var opts = this.options,
				instance = this;

			// Bind nextSelector link to retrieve
			$(opts.nextSelector).click(function(e) {
				if (e.which == 1 && !e.metaKey && !e.shiftKey) {
					e.preventDefault();
					instance.retrieve();
				}
			});

			// Define loadingStart to never hide pager
			instance.options.loading.start = function (opts) {
				opts.loading.msg
					.appendTo(opts.loading.selector)
					.show(opts.loading.speed, function () {
						instance.beginAjax(opts);
					});
			}
		},
		_showdonemsg_twitter: function infscr_showdonemsg_twitter () {
			var opts = this.options,
				instance = this;

			//Do all the usual stuff
			opts.loading.msg
				.find('img')
				.hide()
				.parent()
				.find('div').html(opts.loading.finishedMsg).animate({ opacity: 1 }, 2000, function () {
					$(this).parent().fadeOut('normal');
				});

			//And also hide the navSelector
			$(opts.navSelector).fadeOut('normal');

			// user provided callback when done
			opts.errorCallback.call($(opts.contentSelector)[0],'done');

		}

	});
})(jQuery);

/**
 * Infinite Scroll + Masonry + ImagesLoaded
 */

(function() {

	// Main content container
	var $container =  $('.blog-listing-wrapper:not(.simple-listing) > .post-listing');

	// Masonry + ImagesLoaded
	$container.imagesLoaded(function(){
		$container.masonry({
			// selector for entry content
			itemSelector: '.post-item',
		});
	});

	// Infinite Scroll
	$container.infinitescroll({

		// selector for the paged navigation (it will be hidden)
		navSelector  : ".blog-pagination",
		// selector for the NEXT link (to page 2)
		nextSelector : ".load-more",
		// selector for all items you'll retrieve
		itemSelector : ".blog-listing-wrapper > .post-listing > .post-item",
		 behavior     : 'twitter',

		// finished message
		loading: {
			finishedMsg: 'No more pages to load.'
			}
		},

		// Trigger Masonry as a callback
		function( newElements ) {
			// hide new items while they are loading
			var $newElems = $( newElements ).css({ opacity: 0 });
			// ensure that images load before adding to masonry layout
			$newElems.imagesLoaded(function(){
				// show elems now they're ready
				$newElems.animate({ opacity: 1 });
				$container.masonry( 'appended', $newElems, true );
			});

	});
	
	nx= $('a.next-posts-link').attr('data-total-page-count'); 
  nx = parseInt(nx);
  nxc = 2;
    $('a.load-more').click( function(){
        nxc < nx ? nxc+=1 : $(this).fadeOut()
    })


})();

======== Appear
  $('.cm_graph_sec').appear(function() {
  window.vc_iframe || vc_line_charts();
});


========= Pie chart 

 <span class="kd_chart" data-bar-color="{{barColor}}" data-track-color="#c9c9c9" data-line-width="5" data-percent="{{item.progress_value}}">
            <span class="pc_percent_container">
              <span class="pc_percent">{{item.progress_value}}</span>{{item.suffix}} </span>
          </span>

  $(".kd_pie_chart .kd_chart").each(function(index, value) {
    $(this).appear(function() {
      $(this).easyPieChart({
        barColor: "#000",
        trackColor: "rgba(210, 210, 210, 0.2)",
        animate: 2000,
        size: "160",
        lineCap: 'square',
        lineWidth: "2",
        scaleColor: false,
        onStep: function(from, to, percent) {
          $(this.el).find(".pc_percent").text(Math.round(percent));
        }
      });
    });
    var chart = window.chart = $("kd_pie_chart .kd_chart").data("easyPieChart");
  });


========== Line chart 

   <div class="vc_chart vc_line-chart wpb_content_element"
               data-vc-legend="1"
               data-vc-tooltips="1"
               data-vc-animation="easeInOutCubic"
               data-vc-type="bar"
               data-vc-values="{&quot;labels&quot;:[&quot;5 Years&quot;,&quot; 10 Years&quot;,&quot; 15 Years&quot;,&quot; 20 Years&quot;,&quot; 25 Years&quot;],&quot;datasets&quot;:[{&quot;label&quot;:&quot;Estimated Savings ($)&quot;,&quot;borderColor&quot;:&quot;#6dab3c&quot;,&quot;backgroundColor&quot;:&quot;#6dab3c&quot;,&quot;data&quot;:[&quot;80000&quot;,&quot; 150000&quot;,&quot; 280000&quot;,&quot; 390000&quot;,&quot; 511000&quot;]}]}"
               >
            <div class="wpb_wrapper"> <canvas class="vc_line-chart-canvas" width="1" height="1"></canvas>
            </div>
          </div>

$('.cm_graph_sec').appear(function() {
  window.vc_iframe || vc_line_charts();
});



https://norwichsolar.com/solutions/vermont-municipal-solar/ - reference page url