How to Set Up a Web-Based SSH: A Step-By-Step Guide – Linuxiac

Here’s how to set up web-based SSH with Docker. Our article breaks down the steps to easily turn your browser into a terminal console.

Accessing and managing servers remotely is not just a convenience; it’s a necessity. With containerization technologies like Docker, this process has become more streamlined and accessible.

Our comprehensive guide is here to show you how to harness the power of Docker to set up web-based Secure Shell (SSH) access. Following our step-by-step instructions, you’ll learn how to transform your standard web browser into a fully functional terminal console.

By the end of this guide, you’ll have a robust, web-based terminal at your fingertips, allowing you to execute commands, manage files, and easily maintain your servers, all from the comfort of your browser. So, let’s dive in and unlock the potential of web-based SSH!

Prerequisites

Having Docker and Docker Compose installed is required to deploy a containerized web-based SSH. So, if you don’t already have Docker installed, any of the following guides will be helpful:

The other essential component is Docker Compose. Remember, it is provided separately from Docker. Therefore, you must install Docker to use Docker Compose; otherwise, Compose will not function.

Fortunately, installing it is pretty simple, even if it’s not already on your Linux system. To install Docker Compose, type the following two commands:

sudo curl -L "https://github.com/docker/compose/releases/latest/download/docker-compose-linux-$(uname -m)" -o /usr/local/bin/docker-compose
sudo chmod +x /usr/local/bin/docker-compose

What Does Our Dockerized Stack Include?

To install web-based SSH, allowing you to use your browser as an SSH terminal, we’ll use three separate containers – Caddy, Wetty, and OpenSSH, which we’ll deploy together using Docker Compose. Here’s what we need each of them for.

Caddy: Reverse Proxy

Caddy ^[1] is a versatile, simple, and lightning-fast web server ^[2] well known for its ability to automatically obtain and renew Let’s Encrypt SSL certificates ^[3], making it an ideal candidate for our web-based SSH deployment.

In our case, Caddy will act as a reverse proxy server, sitting in front of the Wetty container, forwarding requests and delivering client responses. Additionally, it will provide us with a secure HTTPS connection and username and password protected access to our web-based SSH implementation.

WeTTY: Terminal Over HTTP and HTTPS

WeTTY ^[4] (short for Web + TTY) is a terminal emulator software that runs over HTTP and HTTPS. It’s essentially a web-based interface that allows users to access a command-line interface through their web browser.

In other words, it provides a terminal within a web browser, making it easily accessible from any machine with internet access without requiring additional software installations.

OpenSSH: SSH Server

The SSH server we’re discussing is the one that the WeTTY container connects to. But there’s a crucial point to understand here. Neither WeTTY nor the OpenSSH container will link directly to the host server where we set up our web-based SSH.

So, it’s important not to consider this as a solution that grants you access only to the specific server it is installed on.

Instead, think of it like a jump host. This means that the OpenSSH container acts as a middleman. From it, you can establish an SSH connection to the host server and any other remote SSH server.

Web-Based SSH with Docker Compose

The first step is to create the folder in which our Docker Compose deployment files will be placed. Then switch to it; from here on, you need to execute all commands further down in this guide from that location.

mkdir webssh
cd webssh

Additionally, right at the beginning, we clarify that our installation will use “ssh.tmplinux.com” as the domain name on which the service will be accessible and for which Caddy will automatically issue a valid SSL certificate.

Of course, you need to replace this name with the one you own and use in the configurations below.

Create Docker Network

As a first step, let’s create our Docker network and name it “webssh_network.”

docker network create webssh_network

By doing this, we ensure that all containers in our deployment will have direct visibility with each other so they can interact. At the same time, the web-based SSH stack will be isolated from the other Docker containers on our host in its network, which adds a layer of security.

Caddy

As mentioned above, Caddy will act as a reverse proxy in front of the WeTTY container. Its service section from our “docker-compose.yaml” file is below. Please do not copy it yet; the final and complete version of the file can be seen further down in this guide.

We’re just showing it here to explain how it works, which also applies to all the following snippets (WeTTY and OpenSSH) of our containerized services below.

caddy:
    image: lucaslorentz/caddy-docker-proxy:ci-alpine
    container_name: reverse-proxy
    ports:
      - 80:80
      - 443:443
    environment:
      - CADDY_INGRESS_NETWORKS=webssh_network
    networks:
      - webssh_network
    volumes:
      - /var/run/docker.sock:/var/run/docker.sock
      - caddy_data:/data
    restart: unless-stopped

Caddy is the only container in our dockerized deployment that exposes ports (80 and 443), allowing the web-based SSH installation to be accessible from the outside world directly via the browser.

All other containers in our stack do not expose ports; instead, they communicate with one another via their service names within the isolated “webssh_network” Docker network we defined previously.

Because Caddy needs to scan Docker metadata, looking for labels indicating that it should serve a specific container (more information here ^[5]), we mount the Docker socket on the host with that of the container.

After finding labels, it generates an in-memory “Caddyfile” (a main Caddy web server configuration file) with site entries and proxies pointing to the Docker service by their DNS name or container IP address.

Finally, we also ensure data persistence by creating a named Docker volume, “caddy_data.” This is important to understand: Docker containers don’t keep data permanently – they’re temporary by nature.

So, when you start Caddy, it gets in touch with Let’s Encrypt to get an SSL certificate for your chosen domain. Using a named Docker volume, an approach to ensure data persistence, you ensure this certificate isn’t lost every time you restart the Caddy container.

WeTTY

WeTTY is the heart of our deployment – it’s the puzzle piece that lets you use an SSH terminal directly in your web browser, making it easy to access from any computer with an internet connection.

wetty:
    image: wettyoss/wetty
    container_name: wetty
    labels:
      caddy: ssh.tmplinux.com
      caddy.basicauth: /*
      caddy.basicauth.bobby: JDJhJDE0JDd3S3lscDY2aDFKSzU5clIuNFBiTnVNNHJhR1EvUnhuUkllTU01Nk5OVW94N3VXOHg4RTRH
      caddy.reverse_proxy: "{{upstreams 3000}}"
    environment:
      - SSHHOST=ssh-server
      - SSHPORT=2222
      - SSHUSER=term
    networks:
      - webssh_network
    restart: unless-stopped
    depends_on:
      - ssh-server

Here, we set all the previously discussed labels under the “labels” section. This is necessary for Caddy to perform its reverse proxy role effectively when it interacts with the WeTTY container.

Of course, in the final version of the “docker-compose.yaml” file (shown below), don’t forget to replace the line (“caddy: ssh.tmplinux.com “) with your actual domain name.

We need to do a bit of work now. The line below lets us protect our web-based SSH access with a username and password. We’ve chosen “bobby” as the username, and the password is in a secure, hashed form.

caddy.basicauth.bobby: JDJhJDE0JDd3S3lscDY2aDFKSzU5clIuNFBiTnVNNHJhR1EvUnhuUkllTU01Nk5OVW94N3VXOHg4RTRH

Here’s a simple way to set your password, for example, “mypassword.” Just run the command below. It will download and run a temporary Caddy container. Then, the hash-password command will hash the string you provide after the “–plaintext” option.

docker run --rm caddy caddy hash-password --plaintext mypassword

Finally, take the output and decode it into base64 bit encoding.

echo -n '$2a$14$OkAZQQXYqWyH4QXeyScoi.XVOsyGgNAwlf7rC3OgtxkVvWGzS4rde' | base64

The final string that contains the hashed version of “mypassword” is now ready to be used. For the user part, you can choose any name you like, for example, “john.” Here’s what the final version would look like:

caddy.basicauth.john: JDJhJDE0JE9rQVpRUVhZcVd5SDRRWGV5U2NvaS5YVk9zeUdnTkF3bGY3ckMzT2d0eGtWdldHelM0cmRl

The rest of the WeTTY snippet specifies the default port 3000 on which WeTTY runs and to which the Caddy should connect. In the “environment” part, using the “SSHHOST” and “SSHPORT” directives, we specify the name of the service, “ssh-server,” and the port “2222” on which the SSH server container is running, which is described below.

Also, “SSHUSER” specifies the default user, “term,” that the WeTTY container will use to connect to the SSH one.

SSH Server

We came to the last container in our web-based SSH deployment, the SSH server.

ssh-server:
    image: lscr.io/linuxserver/openssh-server
    container_name: ssh-server
    hostname: ssh-server
    environment:
      - PUID=1000
      - PGID=1000
      - PASSWORD_ACCESS=true
      - USER_NAME=term
      - USER_PASSWORD=term
    networks:
      - webssh_network
    volumes:
      - ./config:/config
    restart: unless-stopped

The things to pay attention to here are the username (“term “) and password (“term “) set via the “USER_NAME” and “USER_PASSWORD” options. In other words, the SSH container will create this user upon initialization by assigning the specified password.

Additionally, we link the container’s “config” directory to the “config” one on our host system, which will be created automatically inside the directory form which we will run the docker-compose command the first time the container runs, ensuring persistence of data such as log files, SSH keys, etc.

Docker Compose File

Let’s now assemble all of the previous pieces into a final version of our web-based SSH dockerized app. First, create a “docker-compose.yaml” file and paste the following content.

nano docker-compose.yaml

version:  "3.8"
services:

  caddy:
    image: lucaslorentz/caddy-docker-proxy:ci-alpine
    container_name: reverse-proxy
    ports:
      - 80:80
      - 443:443
    environment:
      - CADDY_INGRESS_NETWORKS=webssh_network
    networks:
      - webssh_network
    volumes:
      - /var/run/docker.sock:/var/run/docker.sock
      - caddy_data:/data
    restart: unless-stopped

  wetty:
    image: wettyoss/wetty
    container_name: wetty
    labels:
      caddy: ssh.tmplinux.com
      caddy.basicauth: /*
      caddy.basicauth.bobby: JDJhJDE0JDd3S3lscDY2aDFKSzU5clIuNFBiTnVNNHJhR1EvUnhuUkllTU01Nk5OVW94N3VXOHg4RTRH
      caddy.reverse_proxy: "{{upstreams 3000}}"
    environment:
      - SSHHOST=ssh-server
      - SSHPORT=2222
      - SSHUSER=term
    networks:
      - webssh_network
    restart: unless-stopped
    depends_on:
      - ssh-server

  ssh-server:
    image: lscr.io/linuxserver/openssh-server
    container_name: ssh-server
    hostname: ssh-server
    environment:
      - PUID=1000
      - PGID=1000
      - PASSWORD_ACCESS=true
      - USER_NAME=term
      - USER_PASSWORD=term
    networks:
      - webssh_network
    volumes:
      - ./config:/config
    restart: unless-stopped

volumes:
  caddy_data: {}

networks:
  webssh_network:
    external: true

Remember to adjust the following in the above deployment:

wetty > labels > caddy: Replace “ssh.tmplinux.com” with the domain you are using.
wetty > labels > caddy.basicauth.bobby: Change “bobby” to any username you prefer and use the password you created, as described earlier in the manual.

Additionally, we also recommend in the “ssh-server” part replace the default username and password in the “USER_NAME” and “USER_PASSWORD” settings, which are currently “term” and “term,” with different ones you prefer. Also, remember to use the username you chose for “SSHUSER” in the “wetty” section of the service.

Deploying Web-Based SSH with Docker Compose

Finally, we can run our dockerized web-based SSH stack using Docker Compose. To do this, execute the command below from the “webssh” directory where we created our “docker-compose.yaml” file.

Deploy and run the containers in the background:

docker-compose up -d

The Docker images will start downloading. The entire procedure can take seconds to a few minutes, depending on your internet connection speed.

In the end, you should see a screen similar to the one below, informing you that your dockerized web-based SSH installation has been successfully deployed and is up and running.

Install a web-based SSH with Docker Compose.

The initial delay of the containers’ start will only be the first time because Docker must download images from the Internet. After that, all subsequent runs will take seconds since they will be already available locally on your Linux system.

Log in to the Web-Based SSH via Web Browser

Open a web browser and point it to the “https://your-domain-name/wetty” address, which, in our case, is a “https://ssh.tmplinux.com/wetty.” A window will pop up asking for your username and password. Please use the ones you set up in the “docker-compose.yaml” file.

Username and password to authenticate to WeTTY.

Once you’ve logged in successfully, WeTTY will prompt you to type in the password for the default user set up in the OpenSSH (“ssh-server”) container. Just put in the password, and you’re good to go!

Now, your browser becomes an SSH console, allowing you to connect to other SSH servers remotely. With this setup, you only need an internet connection and a web browser to manage your servers from anywhere.

WeTTY, a web-based terminal client, is now successfully deployed using Docker Compose.

Conclusion

Setting up web-based SSH with Docker Compose efficiently transforms your browser into a terminal console. Following the steps outlined in our article, you can quickly and securely access remote servers directly from your web browser.

So go ahead, try it, and revel in the convenience and efficiency it brings to your digital life. Thanks for your time! Feel free to share your experiences or ask questions in the comments below.

1 / 10

Ubuntu is an ancient African word that means:

#ays-quiz-container-8 div.step[data-question-id=’14’] {
background-image:url(‘https://cdn.shortpixel.ai/spai/w_1920+q_glossy+ret_img+to_auto/linuxiac.com/wp-content/uploads/2023/09/ubuntu-general-bgr.jpg’);
}

2 / 10

Who is the Ubuntu’s founder?

#ays-quiz-container-8 div.step[data-question-id=’17’] {
background-image:url(‘https://cdn.shortpixel.ai/spai/w_1920+q_glossy+ret_img+to_auto/linuxiac.com/wp-content/uploads/2023/09/ubuntu-general-bgr.jpg’);
}

3 / 10

What year was the first official Ubuntu release?

#ays-quiz-container-8 div.step[data-question-id=’11’] {
background-image:url(‘https://cdn.shortpixel.ai/spai/w_1920+q_glossy+ret_img+to_auto/linuxiac.com/wp-content/uploads/2023/09/ubuntu-general-bgr.jpg’);
}

4 / 10

What does the Ubuntu logo symbolize?

#ays-quiz-container-8 div.step[data-question-id=’20’] {
background-image:url(‘https://cdn.shortpixel.ai/spai/w_1920+q_glossy+ret_img+to_auto/linuxiac.com/wp-content/uploads/2023/09/ubuntu-general-bgr.jpg’);
}

5 / 10

What package format does Ubuntu use for installing software?

#ays-quiz-container-8 div.step[data-question-id=’23’] {
background-image:url(‘https://cdn.shortpixel.ai/spai/w_1920+q_glossy+ret_img+to_auto/linuxiac.com/wp-content/uploads/2023/09/ubuntu-general-bgr.jpg’);
}

6 / 10

When are Ubuntu’s LTS versions released?

#ays-quiz-container-8 div.step[data-question-id=’26’] {
background-image:url(‘https://cdn.shortpixel.ai/spai/w_1920+q_glossy+ret_img+to_auto/linuxiac.com/wp-content/uploads/2023/09/ubuntu-general-bgr.jpg’);
}

7 / 10

What is Unity?

#ays-quiz-container-8 div.step[data-question-id=’29’] {
background-image:url(‘https://cdn.shortpixel.ai/spai/w_1920+q_glossy+ret_img+to_auto/linuxiac.com/wp-content/uploads/2023/09/ubuntu-general-bgr.jpg’);
}

8 / 10

What are Ubuntu versions named after?

#ays-quiz-container-8 div.step[data-question-id=’32’] {
background-image:url(‘https://cdn.shortpixel.ai/spai/w_1920+q_glossy+ret_img+to_auto/linuxiac.com/wp-content/uploads/2023/09/ubuntu-general-bgr.jpg’);
}

9 / 10

What’s Ubuntu Core?

#ays-quiz-container-8 div.step[data-question-id=’35’] {
background-image:url(‘https://cdn.shortpixel.ai/spai/w_1920+q_glossy+ret_img+to_auto/linuxiac.com/wp-content/uploads/2023/09/ubuntu-general-bgr.jpg’);
}

10 / 10

Which Ubuntu version is Snap introduced?

#ays-quiz-container-8 div.step[data-question-id=’38’] {
background-image:url(‘https://cdn.shortpixel.ai/spai/w_1920+q_glossy+ret_img+to_auto/linuxiac.com/wp-content/uploads/2023/09/ubuntu-general-bgr.jpg’);
}

The average score is 68%

div#ays-quiz-container-8 * { box-sizing: border-box; } /* Styles for Internet Explorer start */ #ays-quiz-container-8 #ays_finish_quiz_8 { } /* Styles for Quiz container */ #ays-quiz-container-8{ min-height: 350px; width:100%; background-color:#fff; background-position:left top;background-image: url(‘https://cdn.shortpixel.ai/spai/w_1920+q_glossy+ret_img+to_auto/linuxiac.com/wp-content/uploads/2023/09/ubuntu-general.jpg’);border-radius:0px;box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.4);border: none;} /* Styles for Navigation bar */ #ays-quiz-questions-nav-wrap-8 { width: 100%;border-radius:0px;box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.4);border: none;} #ays-quiz-questions-nav-wrap-8 .ays-quiz-questions-nav-content .ays-quiz-questions-nav-item a.ays_questions_nav_question { color: #ffffff; border-color: #ffffff; background-color: #fff; } #ays-quiz-questions-nav-wrap-8 .ays-quiz-questions-nav-content .ays-quiz-questions-nav-item.ays-quiz-questions-nav-item-active a.ays_questions_nav_question { box-shadow: inset 0 0 5px #ffffff, 0 0 5px #ffffff; } #ays-quiz-questions-nav-wrap-8 .ays-quiz-questions-nav-content .ays-quiz-questions-nav-item.ays-quiz-questions-nav-item-answered a.ays_questions_nav_question { color: #fff; border-color: #fff; background-color: #ffffff; } #ays-quiz-questions-nav-wrap-8 .ays-quiz-questions-nav-content .ays-quiz-questions-nav-item a.ays_questions_nav_question.ays_quiz_correct_answer { color: rgba(39, 174, 96, 1); border-color: rgba(39, 174, 96, 1); background-color: rgba(39, 174, 96, 0.4); } #ays-quiz-questions-nav-wrap-8 .ays-quiz-questions-nav-content .ays-quiz-questions-nav-item a.ays_questions_nav_question.ays_quiz_wrong_answer { color: rgba(243, 134, 129, 1); border-color: rgba(243, 134, 129, 1); background-color: rgba(243, 134, 129, 0.4); } #ays-quiz-questions-nav-wrap-8 .ays-quiz-questions-nav-bookmark-box { height: 27px; padding: 0 9px 10px; text-align: right; } #ays-quiz-questions-nav-wrap-8 .ays-quiz-questions-nav-bookmark-box .ays-navbar-bookmark { height: 100%; cursor: pointer; } /* Styles for questions */ #ays-quiz-container-8 #ays_finish_quiz_8 div.step { min-height: 350px; } /* Styles for text inside quiz container */ #ays-quiz-container-8.ays-quiz-container .ays-questions-container .ays-start-page *:not(input), #ays-quiz-container-8.ays-quiz-container .ays-questions-container label[for^=”ays-answer-“], #ays-quiz-container-8.ays-quiz-container .ays-questions-container .ays-matching-field-choice, #ays-quiz-container-8.ays-quiz-container .ays-questions-container p, #ays-quiz-container-8.ays-quiz-container .ays-questions-container .ays-fs-title, #ays-quiz-container-8.ays-quiz-container .ays-questions-container .ays-fs-subtitle, #ays-quiz-container-8.ays-quiz-container .ays-questions-container .logged_in_message, #ays-quiz-container-8.ays-quiz-container .ays-questions-container .ays-quiz-limitation-count-of-takers, #ays-quiz-container-8.ays-quiz-container .ays-questions-container .ays-quiz-limitation-count-of-takers *, #ays-quiz-container-8.ays-quiz-container .ays-questions-container .ays_score_message, #ays-quiz-container-8.ays-quiz-container .ays-questions-container .ays_message{ color: #ffffff; outline: none; } #ays-quiz-container-8.ays-quiz-container .ays-questions-container .ays_question_hint { color: #ffffff; } /* Quiz title / transformation */ #ays-quiz-container-8 .ays-fs-title{ text-transform: uppercase; font-size: 38px; text-align: center; text-shadow: 2px 2px 2px #333; } #ays-quiz-container-8 .ays-quiz-password-message-box, #ays-quiz-container-8 .ays-quiz-question-note-message-box, #ays-quiz-container-8 .ays_quiz_question, #ays-quiz-container-8 .ays_quiz_question *:not([class^=’enlighter’]) { color: #ffffff; } #ays-quiz-container-8 textarea, #ays-quiz-container-8 input::first-letter, #ays-quiz-container-8 select::first-letter, #ays-quiz-container-8 option::first-letter { color: initial !important; } #ays-quiz-container-8 p::first-letter:not(.ays_no_questions_message) { color: #ffffff !important; background-color: transparent !important; font-size: inherit !important; font-weight: inherit !important; float: none !important; line-height: inherit !important; margin: 0 !important; padding: 0 !important; } #ays-quiz-container-8 .select2-container, #ays-quiz-container-8 .ays-field * { font-size: 20px !important; } #ays-quiz-container-8 .ays-fs-subtitle p { text-align: center ; } #ays-quiz-container-8 .ays_quiz_question p { font-size: 26px; text-align: center; } #ays-quiz-container-8 .ays_quiz_question { text-align: center ; margin-bottom: 10px; } #ays-quiz-container-8 .ays_quiz_question pre { max-width: 100%; white-space: break-spaces; } div#ays-quiz-container-8 .ays-questions-container .ays-field, div#ays-quiz-container-8 .ays-questions-container .ays-field input~label[for^=’ays-answer-‘], div#ays-quiz-container-8 .ays-questions-container .ays-modern-dark-question *, div#ays-quiz-container-8 .ays-questions-container .ays_quiz_question, div#ays-quiz-container-8 .ays-questions-container .ays_quiz_question *{ word-break: break-word; } #ays-quiz-container-8 .ays-quiz-timer p { font-size: 16px; } #ays-quiz-container-8 section.ays_quiz_redirection_timer_container hr, #ays-quiz-container-8 section.ays_quiz_timer_container hr { margin: 0; } #ays-quiz-container-8 section.ays_quiz_timer_container.ays_quiz_timer_red_warning .ays-quiz-timer { color: red; } #ays-quiz-container-8 .ays_thank_you_fs p { text-align: center; } #ays-quiz-container-8 .information_form input[type=’text’], #ays-quiz-container-8 .information_form input[type=’url’], #ays-quiz-container-8 .information_form input[type=’number’], #ays-quiz-container-8 .information_form input[type=’email’], #ays-quiz-container-8 .information_form input[type=’tel’], #ays-quiz-container-8 .information_form textarea, #ays-quiz-container-8 .information_form select, #ays-quiz-container-8 .information_form option { color: initial !important; outline: none; margin-left: 0; background-image: unset; } #ays-quiz-container-8 .information_form input[type=’checkbox’] { margin: 0 10px; outline: initial; -webkit-appearance: auto; -moz-appearance: auto; position: initial; width: initial; height: initial; border: initial; background: initial; } #ays-quiz-container-8 .information_form input[type=’checkbox’]::after { content: none; } #ays-quiz-container-8 .wrong_answer_text{ color:#ff4d4d; } #ays-quiz-container-8 .right_answer_text{ color:#33cc33; } #ays-quiz-container-8 .right_answer_text p { font-size:18px; } #ays-quiz-container-8 .wrong_answer_text p { font-size:16px; } #ays-quiz-container-8 .ays_questtion_explanation p { font-size:16px; } #ays-quiz-container-8 .ays-quiz-question-note-message-box p { font-size:14px; } #ays-quiz-container-8 .ays_cb_and_a, #ays-quiz-container-8 .ays_cb_and_a * { color: rgb(255,255,255); text-align: center; } #ays-quiz-container-8 iframe { /*min-height: 350px;*/ } #ays-quiz-container-8 label.ays_for_checkbox, #ays-quiz-container-8 span.ays_checkbox_for_span { color: initial !important; display: block; } /* Quiz textarea height */ #ays-quiz-container-8 textarea { height: 100px; min-height: 100px; } /* Quiz rate and passed users count */ #ays-quiz-container-8 .ays_quizn_ancnoxneri_qanak, #ays-quiz-container-8 .ays_quiz_rete_avg{ color:#fff; background-color:#ffffff; } #ays-quiz-container-8 .ays-questions-container > .ays_quizn_ancnoxneri_qanak { padding: 5px 20px; } #ays-quiz-container-8 div.for_quiz_rate.ui.star.rating .icon { color: rgba(255,255,255,0.35); } #ays-quiz-container-8 .ays_quiz_rete_avg div.for_quiz_rate_avg.ui.star.rating .icon { color: rgba(255,255,255,0.5); } #ays-quiz-container-8 .ays_quiz_rete .ays-quiz-rate-link-box .ays-quiz-rate-link { color: #ffffff; } /* Loaders */ #ays-quiz-container-8 div.lds-spinner, #ays-quiz-container-8 div.lds-spinner2 { color: #ffffff; } #ays-quiz-container-8 div.lds-spinner div:after, #ays-quiz-container-8 div.lds-spinner2 div:after { background-color: #ffffff; } #ays-quiz-container-8 .lds-circle, #ays-quiz-container-8 .lds-facebook div, #ays-quiz-container-8 .lds-ellipsis div{ background: #ffffff; } #ays-quiz-container-8 .lds-ripple div{ border-color: #ffffff; } #ays-quiz-container-8 .lds-dual-ring::after, #ays-quiz-container-8 .lds-hourglass::after{ border-color: #ffffff transparent #ffffff transparent; } /* Stars */ #ays-quiz-container-8 .ui.rating .icon, #ays-quiz-container-8 .ui.rating .icon:before { font-family: Rating !important; } /* Progress bars */ #ays-quiz-container-8 #ays_finish_quiz_8 .ays-progress { border-color: rgba(255,255,255,0.8); } #ays-quiz-container-8 #ays_finish_quiz_8 .ays-progress-bg { background-color: rgba(255,255,255,0.3); } #ays-quiz-container-8 .ays-progress-value { color: #ffffff; text-align: center; } #ays-quiz-container-8 .ays-progress-bar { background-color: #e9500e; } #ays-quiz-container-8 .ays-question-counter .ays-live-bar-wrap { direction:ltr !important; } #ays-quiz-container-8 .ays-live-bar-fill{ color: #ffffff; border-bottom: 2px solid rgba(255,255,255,0.8); text-shadow: 0px 0px 5px #fff; } #ays-quiz-container-8 .ays-live-bar-fill.ays-live-fourth, #ays-quiz-container-8 .ays-live-bar-fill.ays-live-third, #ays-quiz-container-8 .ays-live-bar-fill.ays-live-second { text-shadow: unset; } #ays-quiz-container-8 .ays-live-bar-percent{ display:none; } /* Music, Sound */ #ays-quiz-container-8 .ays_music_sound { color:rgb(255,255,255); } /* Dropdown questions scroll bar */ #ays-quiz-container-8 blockquote { border-left-color: #ffffff !important; } /* Quiz Password */ #ays-quiz-container-8 .ays-start-page > input[id^=’ays_quiz_password_val_’], #ays-quiz-container-8 .ays-quiz-password-toggle-visibility-box { width: 100%; margin: 0 auto; } /* Question hint */ #ays-quiz-container-8 .ays_question_hint_container .ays_question_hint_text { background-color:#fff; box-shadow: 0 0 15px 3px rgba(0,0,0,0.6); max-width: 270px; color: #ffffff; } #ays-quiz-container-8 .ays_question_hint_container .ays_question_hint_text p { max-width: unset; } #ays-quiz-container-8 .ays_questions_hint_max_width_class { max-width: 80%; } /* Information form */ #ays-quiz-container-8 .ays-form-title{ color:rgb(255,255,255); } /* Quiz timer */ #ays-quiz-container-8 div.ays-quiz-redirection-timer, #ays-quiz-container-8 div.ays-quiz-timer{ color: #ffffff; text-align: center; } #ays-quiz-container-8 div.ays-quiz-timer.ays-quiz-message-before-timer:before { font-weight: 500; } /* Quiz buttons */ #ays-quiz-container-8 input#ays-submit, #ays-quiz-container-8 #ays_finish_quiz_8 .action-button, div#ays-quiz-container-8 #ays_finish_quiz_8 .action-button.ays_restart_button { background-color: #e9500e; color:#ffffff; font-size: 20px; padding: 13px 30px; border-radius: 3px; white-space: nowrap; letter-spacing: 0; box-shadow: unset; white-space: normal; word-break: break-word; } #ays-quiz-container-8 input#ays-submit, #ays-quiz-container-8 #ays_finish_quiz_8 input.action-button { } #ays-quiz-container-8 #ays_finish_quiz_8 .action-button.ays_check_answer { padding: 5px 10px; font-size: 20px !important; } #ays-quiz-container-8 #ays_finish_quiz_8 .action-button.ays_download_certificate { white-space: nowrap; padding: 5px 10px; } #ays-quiz-container-8 #ays_finish_quiz_8 .action-button.ays_arrow { color:#ffffff!important; white-space: nowrap; padding: 5px 10px; } #ays-quiz-container-8 input#ays-submit:hover, #ays-quiz-container-8 input#ays-submit:focus, #ays-quiz-container-8 #ays_finish_quiz_8 .action-button:hover, #ays-quiz-container-8 #ays_finish_quiz_8 .action-button:focus { box-shadow: 0 0 0 2px #ffffff; background-color: #e9500e; } #ays-quiz-container-8 .ays_restart_button { color: #ffffff; } #ays-quiz-container-8 .ays_restart_button_p { display: flex; justify-content: center; flex-wrap: wrap; } #ays-quiz-container-8 .ays_buttons_div { justify-content: center; } #ays-quiz-container-8 .step:first-of-type .ays_buttons_div { justify-content: center !important; } #ays-quiz-container-8 input[type=’button’], #ays-quiz-container-8 input[type=’submit’] { color: #ffffff !important; outline: none; } #ays-quiz-container-8 #ays_finish_quiz_8 i.ays_early_finish.action-button[disabled]:hover, #ays-quiz-container-8 #ays_finish_quiz_8 i.ays_early_finish.action-button[disabled]:focus, #ays-quiz-container-8 #ays_finish_quiz_8 i.ays_early_finish.action-button[disabled], #ays-quiz-container-8 #ays_finish_quiz_8 i.ays_arrow.action-button[disabled]:hover, #ays-quiz-container-8 #ays_finish_quiz_8 i.ays_arrow.action-button[disabled]:focus, #ays-quiz-container-8 #ays_finish_quiz_8 i.ays_arrow.action-button[disabled] { color: #aaa !important; } #ays-quiz-container-8 .ays_finish.action-button{ margin: 10px 5px; } #ays-quiz-container-8 .ays-share-btn.ays-share-btn-branded { color: #fff; margin-bottom: 5px; display: inline-block; } #ays-quiz-container-8 .ays-quiz-question-title-text-to-speech-icon { cursor: pointer; position: absolute; right: 0px; top: 0px; z-index: 1; } /* Question answers */ #ays-quiz-container-8 .ays-field { border-color: rgba(255,255,255,0.33); border-style: solid; border-width: 1px; box-shadow: none;flex-direction: row-reverse; } #ays-quiz-container-8 .ays-quiz-answers .ays-field:hover{ opacity: 1; } #ays-quiz-container-8 #ays_finish_quiz_8 .ays-field label.ays_answer_caption[for^=’ays-answer-‘] { z-index: 1; position:initial;bottom:0;} #ays-quiz-container-8 #ays_finish_quiz_8 .ays-field input~label[for^=’ays-answer-‘] { padding: 5px; } #ays-quiz-container-8 #ays_finish_quiz_8 .ays-field { margin-bottom: 10px; position: relative; } #ays-quiz-container-8 #ays_finish_quiz_8 .ays-field.ays_grid_view_item { width: calc(50% – 5px); } #ays-quiz-container-8 #ays_finish_quiz_8 .ays-field.ays_grid_view_item:nth-child(odd) { margin-right: 5px; } #ays-quiz-container-8 img.ays-quiz-check-button-right-wrong-icon { position: absolute; right: 15px; bottom: 15px; } #ays-quiz-container-8 img.ays-quiz-check-button-right-wrong-icon[data-type=’style-9′] { width: 20px; } #ays-quiz-container-8 .ays_quiz_results .step[data-type=’fill_in_blank’] img.ays-quiz-check-button-right-wrong-icon { right: 25px; } #ays-quiz-container-8 .ays_quiz_results .step[data-type=’fill_in_blank’] .ays_fieldset img.ays-quiz-check-button-right-wrong-icon { right: 30px; } #ays-quiz-container-8 #ays_finish_quiz_8 .ays-field input:checked+label:before { border-color: #e9500e; background: #e9500e; background-clip: content-box; } #ays-quiz-container-8 .ays-quiz-answers div.ays-text-right-answer { color: #ffffff; } /* Answer maximum length of a text field */ #ays-quiz-container-8 .ays_quiz_question_text_message{ color: #ffffff; text-align: left; font-size: 12px; } div#ays-quiz-container-8 div.ays_quiz_question_text_error_message { color: #ff0000; } /* Questions answer image */ #ays-quiz-container-8 .ays-answer-image { width:15em; height:150px; object-fit: cover; } /* Questions answer right/wrong icons */ #ays-quiz-container-8 .ays-field input~label.answered.correct:after{ content: url(‘https://cdn.shortpixel.ai/spai/w_1920+q_glossy+ret_img+to_auto/linuxiac.com/wp-content/plugins/quiz-maker/public/images/correct-style-2.png’); } #ays-quiz-container-8 .ays-field input~label.answered.wrong:after{ content: url(‘https://cdn.shortpixel.ai/spai/w_1920+q_glossy+ret_img+to_auto/linuxiac.com/wp-content/plugins/quiz-maker/public/images/wrong-style-2.png’); } #ays-quiz-container-8 .ays-field label.answered:last-of-type:after{ height: auto; left: 10px;top: 10px;} /* Dropdown questions */ #ays-quiz-container-8 .select2-container–default .select2-search–dropdown .select2-search__field:focus, #ays-quiz-container-8 .select2-container–default .select2-search–dropdown .select2-search__field { outline: unset; padding: 0.75rem; } #ays-quiz-container-8 #ays_finish_quiz_8 .ays-field .select2-container–default .select2-selection–single { border-bottom: 2px solid #e9500e; background-color: #e9500e; } #ays-quiz-container-8 .ays-field .select2-container–default .select2-selection–single .select2-selection__rendered, #ays-quiz-container-8 .ays-field .select2-container–default .select2-selection–single .select2-selection__placeholder, #ays-quiz-container-8 .ays-field .select2-container–default .select2-selection–single .select2-selection__arrow { /*color: #16aff1;*/ color: #ffffff; } #ays-quiz-container-8 .ays-field .select2-container–default .select2-selection–single .select2-selection__rendered, #ays-quiz-container-8 .select2-container–default .select2-results__option–highlighted[aria-selected] { background-color: #e9500e; } #ays-quiz-container-8 .ays-field .select2-container–default, #ays-quiz-container-8 .ays-field .select2-container–default .selection, #ays-quiz-container-8 .ays-field .select2-container–default .dropdown-wrapper, #ays-quiz-container-8 .ays-field .select2-container–default .select2-selection–single .select2-selection__rendered, #ays-quiz-container-8 .ays-field .select2-container–default .select2-selection–single .select2-selection__rendered .select2-selection__placeholder, #ays-quiz-container-8 .ays-field .select2-container–default .select2-selection–single .select2-selection__arrow, #ays-quiz-container-8 .ays-field .select2-container–default .select2-selection–single .select2-selection__arrow b[role=’presentation’] { font-size: 16px !important; } #ays-quiz-container-8 .select2-container–default .select2-results__option { padding: 6px; } /* Dropdown questions scroll bar */ #ays-quiz-container-8 .select2-results__options::-webkit-scrollbar { width: 7px; } #ays-quiz-container-8 .select2-results__options::-webkit-scrollbar-track { background-color: rgba(255,255,255,0.35); } #ays-quiz-container-8 .select2-results__options::-webkit-scrollbar-thumb { transition: .3s ease-in-out; background-color: rgba(255,255,255,0.55); } #ays-quiz-container-8 .select2-results__options::-webkit-scrollbar-thumb:hover { transition: .3s ease-in-out; background-color: rgba(255,255,255,0.85); } /* WooCommerce product */ #ays-quiz-container-8 .ays-woo-block { background-color: rgba(233,80,14,0.8); } #ays-quiz-container-8 .ays-woo-product-block h4.ays-woo-product-title > a { color: #ffffff; } /* Audio / Video */ #ays-quiz-container-8 .mejs-container .mejs-time{ box-sizing: unset; } #ays-quiz-container-8 .mejs-container .mejs-time-rail { padding-top: 15px; } #ays-quiz-container-8 .mejs-container .mejs-mediaelement video { margin: 0; } /* Limitation */ #ays-quiz-container-8 .ays-quiz-limitation-count-of-takers { padding: 50px; } #ays-quiz-container-8 div.ays-quiz-results-toggle-block span.ays-show-res-toggle.ays-res-toggle-show, #ays-quiz-container-8 div.ays-quiz-results-toggle-block span.ays-show-res-toggle.ays-res-toggle-hide{ color: #ffffff; } #ays-quiz-container-8 div.ays-quiz-results-toggle-block input:checked + label.ays_switch_toggle { border: 1px solid #ffffff; } #ays-quiz-container-8 div.ays-quiz-results-toggle-block input:checked + label.ays_switch_toggle { border: 1px solid #ffffff; } #ays-quiz-container-8 div.ays-quiz-results-toggle-block input:checked + label.ays_switch_toggle:after{ background: #ffffff; } #ays-quiz-container-8.ays_quiz_elegant_dark div.ays-quiz-results-toggle-block input:checked + label.ays_switch_toggle:after, #ays-quiz-container-8.ays_quiz_rect_dark div.ays-quiz-results-toggle-block input:checked + label.ays_switch_toggle:after{ background: #000; } /* Hestia theme (Version: 3.0.16) | Start */ #ays-quiz-container-8 .mejs-container .mejs-inner .mejs-controls .mejs-button > button:hover, #ays-quiz-container-8 .mejs-container .mejs-inner .mejs-controls .mejs-button > button { box-shadow: unset; background-color: transparent; } #ays-quiz-container-8 .mejs-container .mejs-inner .mejs-controls .mejs-button > button { margin: 10px 6px; } /* Hestia theme (Version: 3.0.16) | End */ /* Go theme (Version: 1.4.3) | Start */ #ays-quiz-container-8 label[for^=’ays-answer’]:before, #ays-quiz-container-8 label[for^=’ays-answer’]:before { -webkit-mask-image: unset; mask-image: unset; } #ays-quiz-container-8 .ays_question_report { text-align: right; } #ays-quiz-container-8 .ays-export-quiz-button-container { position: absolute; right: 74px; top: -19px; margin: 1em 0; } #ays-quiz-container-8.ays_quiz_classic_light .ays-field input:checked+label.answered:before, #ays-quiz-container-8.ays_quiz_classic_dark .ays-field input:checked+label.answered:before { background-color: #e9500e !important; } #ays-quiz-container-8.ays_quiz_classic_light .ays-field input:checked+label.answered.correct:before, #ays-quiz-container-8.ays_quiz_classic_dark .ays-field input:checked+label.answered.correct:before { background-color: #27ae60 !important; } #ays-quiz-container-8.ays_quiz_classic_light .ays-field input:checked+label.answered.wrong:before, #ays-quiz-container-8.ays_quiz_classic_dark .ays-field input:checked+label.answered.wrong:before { background-color: #cc3700 !important; } /* Go theme (Version: 1.4.3) | End */ #ays-quiz-container-8 .ays_quiz_results fieldset.ays_fieldset .ays_quiz_question .wp-video { width: 100% !important; max-width: 100%; } /* Classic Dark / Classic Light */ /* Dropdown questions right/wrong styles */ #ays-quiz-container-8.ays_quiz_classic_dark .correct_div, #ays-quiz-container-8.ays_quiz_classic_light .correct_div{ border-color: green !important; opacity: 1 !important; background-color: rgba(39,174,96,0.4) !important; } #ays-quiz-container-8.ays_quiz_classic_dark .correct_div .selected-field, #ays-quiz-container-8.ays_quiz_classic_light .correct_div .selected-field { padding: 0px 10px 0px 10px; color: green !important; } #ays-quiz-container-8.ays_quiz_classic_dark .wrong_div, #ays-quiz-container-8.ays_quiz_classic_light .wrong_div{ border-color: red !important; opacity: 1 !important; background-color: rgba(243,134,129,0.4) !important; } #ays-quiz-container-8.ays_quiz_classic_dark .ays-field.checked_answer_div.wrong_div input:checked~label, #ays-quiz-container-8.ays_quiz_classic_light .ays-field.checked_answer_div.wrong_div input:checked~label { background-color: rgba(243,134,129,0.4) !important; } #ays-quiz-container-8 .ays_question_result .ays-field .ays_quiz_hide_correct_answer:after{ content: ” !important; } #ays-quiz-container-8 .ays-quiz-close-full-screen { fill: #ffffff; } #ays-quiz-container-8 .ays-quiz-open-full-screen { fill: #ffffff; } #ays-quiz-container-8 .ays_quiz_login_form p{ color: #ffffff; } /* Personality Test | Start */ #ays-quiz-container-8 .ays-quiz-personality-result-box .ays-quiz-personality-result-description p { text-align: left; padding: 0; } #ays-quiz-container-8 .ays-quiz-personality-result-box { background: white; border-radius: 17px; box-shadow: 0px 0px 20px rgba(98, 85, 165, 0.1); /*padding: 30px 3% 40px;*/ padding: 20px 30px; margin: 30px 0; font-size: 16px; } #ays-quiz-container-8 .ays-quiz-personality-result-box .ays-quiz-personality-result-title { color: #413A5C; font-size: 23px; margin: 0; text-align: left; font-weight: bold; } div#ays-quiz-container-8.ays-quiz-container .ays-quiz-personality-result-box .ays-quiz-personality-result-description { margin: 0; font-size: 16px; text-align: left; color: #413A5C; } div#ays-quiz-container-8.ays-quiz-container .ays-quiz-personality-result-box .ays-quiz-personality-result-description * { color: #413A5C; } #ays-quiz-container-8 .ays-quiz-personality-result-box .ays-quiz-personality-result-progress { width: 100%; background-color: rgba(128, 126, 137, 0.1); border-radius: 15px; position: relative; display: flex; /* justify-content: flex-end; */ margin-top: 1rem; margin-bottom: 1rem; } #ays-quiz-container-8 .ays-quiz-personality-result-box .ays-quiz-personality-result-progress-end { justify-content: flex-end; } #ays-quiz-container-8 .ays-quiz-personality-result-box .ays-quiz-personality-result-bar { height: 30px; border-radius: 15px; color: white; font-size: 18px; padding: 3px 15px 0; } #ays-quiz-container-8 .ays-quiz-personality-result-box .ays-quiz-personality-result-percentages { position: absolute; width: 100%; padding: 4px 15px; top: 0; -ms-flex-pack: justify; justify-content: space-between; display: -ms-flexbox; display: flex; } #ays-quiz-container-8 .ays-quiz-personality-result-box .ays-quiz-personality-result-keyword-box div, #ays-quiz-container-8 .ays-quiz-personality-result-box .ays-quiz-personality-result-text-dark-purple { color: #413A5C; } #ays-quiz-container-8 .ays-quiz-personality-result-box .ays-quiz-personality-result-text-white { color: #ffffff; } #ays-quiz-container-8 .ays-quiz-personality-result-box .ays-quiz-personality-result-text-percentage { font-weight: bolder; } #ays-quiz-container-8 .ays-quiz-personality-result-box .ays-quiz-personality-result-keyword-box { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; } #ays-quiz-container-8 .ays-quiz-personality-result-box.ays-quiz-personality-result-box-purple .ays-quiz-personality-result-bar { background-color: #6255A5; } #ays-quiz-container-8 .ays-quiz-personality-result-box.ays-quiz-personality-result-box-purple .ays-quiz-personality-result-keyword-text-color { color: #6255A5; } #ays-quiz-container-8 .ays-quiz-personality-result-box.ays-quiz-personality-result-box-yellow .ays-quiz-personality-result-bar { background-color: #F2C94C; } #ays-quiz-container-8 .ays-quiz-personality-result-box.ays-quiz-personality-result-box-yellow .ays-quiz-personality-result-keyword-text-color { color: #F2C94C; } #ays-quiz-container-8 .ays-quiz-personality-result-box.ays-quiz-personality-result-box-green .ays-quiz-personality-result-bar { background-color: #88D29D; } #ays-quiz-container-8 .ays-quiz-personality-result-box.ays-quiz-personality-result-box-green .ays-quiz-personality-result-keyword-text-color { color: #88D29D; } #ays-quiz-container-8 .ays-quiz-personality-result-box.ays-quiz-personality-result-box-red .ays-quiz-personality-result-bar { background-color: #E5A69D; } #ays-quiz-container-8 .ays-quiz-personality-result-box.ays-quiz-personality-result-box-red .ays-quiz-personality-result-keyword-text-color { color: #E5A69D; } #ays-quiz-container-8 .ays-quiz-personality-result-box.ays-quiz-personality-result-box-blue .ays-quiz-personality-result-bar { background-color: #03A9F4; } #ays-quiz-container-8 .ays-quiz-personality-result-box.ays-quiz-personality-result-box-blue .ays-quiz-personality-result-keyword-text-color { color: #03A9F4; } #ays-quiz-container-8 .ays-quiz-personality-result-box div:before, #ays-quiz-container-8 .ays-quiz-personality-result-box div:after { content: unset; } /* Personality Test | End */ @media screen and (max-width: 768px){ #ays-quiz-container-8{ max-width: 100%; } div#ays-quiz-container-8.ays_quiz_modern_light .step, div#ays-quiz-container-8.ays_quiz_modern_dark .step { padding-right: 0px !important; padding-top: 0px !important; } div#ays-quiz-container-8.ays_quiz_modern_light div.step[data-question-id], div#ays-quiz-container-8.ays_quiz_modern_dark div.step[data-question-id] { background-size: cover !important; background-position: center center !important; } div#ays-quiz-container-8.ays_quiz_modern_light .ays-abs-fs:not(.ays-start-page):not(.ays-end-page), div#ays-quiz-container-8.ays_quiz_modern_dark .ays-abs-fs:not(.ays-start-page):not(.ays-end-page) { width: 100%; } #ays-quiz-container-8 .ays_quiz_question p { font-size: 18px; } #ays-quiz-container-8 .select2-container, #ays-quiz-container-8 .ays-field * { font-size: 16px !important; } div#ays-quiz-container-8 input#ays-submit, div#ays-quiz-container-8 #ays_finish_quiz_8 .action-button, div#ays-quiz-container-8 #ays_finish_quiz_8 .action-button.ays_restart_button { font-size: 20px; } div#ays-quiz-container-8 div.ays-questions-container div.ays-woo-block { width: 100%; } /* Quiz title / mobile font size */ div#ays-quiz-container-8 .ays-fs-title { font-size: 24px; } /* Question explanation / mobile font size */ #ays-quiz-container-8 .ays_questtion_explanation p { font-size:16px; } /* Wrong answers / mobile font size */ #ays-quiz-container-8 .wrong_answer_text p { font-size:16px; } /* Right answers / mobile font size */ #ays-quiz-container-8 .right_answer_text p { font-size:16px; } /* Note text / mobile font size */ #ays-quiz-container-8 .ays-quiz-question-note-message-box p { font-size:14px; } #ays-quiz-container-8 div.ays-quiz-personality-result-box .ays-quiz-personality-result-title { font-size: 18px; } /* Personality Test */ #ays-quiz-container-8 div.ays-quiz-personality-result-box .ays-quiz-personality-result-bar { font-size: 14px; padding: 6px 10px 0; } } /* Custom css styles */ #ays-quiz-container-8 .ays_score_message h3 { color:#fff; padding-top:30px; }#ays-quiz-container-8 .ays-fs-title { font-weight:bold; line-height:140%; }#ays-quiz-container-8 .ays-fs-subtitle { font-size: 22px; line-height:150%; margin-top:20px; } /* RTL direction styles */
#ays-quiz-container-8 p {
margin: 0.625em;
}

#ays-quiz-container-8.ays_quiz_classic_light .enable_correction .ays-field.checked_answer_div input:checked+label,
#ays-quiz-container-8.ays_quiz_classic_dark .enable_correction .ays-field.checked_answer_div input:checked+label {
background-color: transparent;
}
#ays-quiz-container-8 .ays-field.checked_answer_div input:checked~label:not(.ays_answer_image) {
background-color: rgba(233,80,14,0.6);
}
#ays-quiz-container-8.ays-quiz-container.ays_quiz_classic_light .ays-questions-container .ays-field:hover label[for^=’ays-answer-‘],
#ays-quiz-container-8 .ays-field:hover{
background: rgba(233,80,14,0.8);
color: #fff;
transition: all .3s;
}
#ays-quiz-container-8 #ays_finish_quiz_8 .action-button:hover,
#ays-quiz-container-8 #ays_finish_quiz_8 .action-button:focus {
box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.5), 0 0 0 3px #ffffff;
background: #e9500e;
}

References

^{^} Caddy (caddyserver.com)
^{^} web server (linuxiac.com)
^{^} Let’s Encrypt SSL certificates (linuxiac.com)
^{^} WeTTY (github.com)
^{^} more information here (github.com)

Source