/* svg logo base color */
.svg-color {
  fill: #e0f2fe;
  transition: fill 0.3s ease;
}

.svg-base-color {
  fill: #0f172a;
  transition: fill 0.3s ease;
}

/* html logo hover color */
.svg-color:hover .svg-html-path1 {
  fill: #e34f26;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-html-path2 {
  fill: #ef652a;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-html-path3 {
  fill: #ebebeb;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-html-path4 {
  fill: #ffffff;
  transition: fill 0.3s ease;
}

/* css logo hover color */
.svg-color:hover .svg-css-path1 {
  fill: #264de4;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-css-path2 {
  fill: #2965f1;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-css-path3 {
  fill: #ebebeb;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-css-path4 {
  fill: #ffffff;
  transition: fill 0.3s ease;
}

/* js logo hover color */
.svg-color:hover .svg-js-path1 {
  fill: #f5de19;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-js-path2 {
  fill: #000000;
  transition: fill 0.3s ease;
}

/* php logo hover color */
.svg-color:hover .svg-php-path1 {
  fill: #6280b6;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-php-path2 {
  fill: #ffffff;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-php-path3 {
  fill: #000004;
  transition: fill 0.3s ease;
}

/* python logo hover color */
.svg-color:hover .svg-python-path1 {
  fill: #3679b0;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-python-path2 {
  fill: #ffd43b;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-python-path3 {
  fill: #ffffff;
  transition: fill 0.3s ease;
}

/* arduino logo hover color */
.svg-color:hover .svg-arduino-path1 {
  fill: #008184;
  transition: fill 0.3s ease;
}

/* laravel logo hover color */
.svg-color:hover .svg-laravel-path1 {
  fill: #fb503b;
  transition: fill 0.3s ease;
}

/* tailwind logo hover color */
.svg-color:hover .svg-tailwind-path1 {
  fill: #38bdf8;
  transition: fill 0.3s ease;
}

/* bootstrap logo hover color */
.svg-color:hover .svg-bootstrap-path1 {
  fill: #7a11f8;
  transition: fill 0.3s ease;
}

/* git logo hover color */
.svg-color:hover .svg-git-path1 {
  fill: #f34f29;
  transition: fill 0.3s ease;
}

/* github logo hover color */
.svg-color:hover .svg-github-path1 {
  fill: #ffffff;
  transition: fill 0.3s ease;
}

/* gitlab logo hover color */
.svg-color:hover .svg-gitlab-path1 {
  fill: #e24329;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-gitlab-path2 {
  fill: #fc6d26;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-gitlab-path3 {
  fill: #fca326;
  transition: fill 0.3s ease;
}

/* docker logo hover color */
.svg-color:hover .svg-docker-path1 {
  fill: #1d63ed;
  transition: fill 0.3s ease;
}

/* selenium logo hover color */
.svg-color:hover .svg-selenium-path1 {
  fill: #43b02a;
  transition: fill 0.3s ease;
}

/* mysql logo hover color */
.svg-color:hover .svg-mysql-path1 {
  fill: #00758f;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-mysql-path2 {
  fill: #f29111;
  transition: fill 0.3s ease;
}

/* locust logo hover color */
.svg-color:hover .svg-locust-path1 {
  fill: #b8ee48;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-locust-path2 {
  fill: #ffffff;
  transition: fill 0.3s ease;
}

/* postman logo hover color */
.svg-color:hover .svg-postman-path1 {
  fill: #ff6c37;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-postman-path2 {
  fill: #ffffff;
  transition: fill 0.3s ease;
}

/* linux logo hover color */
.svg-color:hover .svg-linux-path1 {
  fill: #202020;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-linux-path2 {
  fill: #f8bf11;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-linux-path3 {
  fill: #d6a312;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-linux-path4 {
  fill: #ffffff;
  transition: fill 0.3s ease;
}

.svg-color:hover .svg-linux-path5 {
  fill: #e6e6e6;
  transition: fill 0.3s ease;
}

/* debian logo hover color */
.svg-color:hover .svg-debian-path1 {
  fill: #ce0056;
  transition: fill 0.3s ease;
}

/* ubuntu logo hover color */
.svg-color:hover .svg-ubuntu-path1 {
  fill: #e95420;
  transition: fill 0.3s ease;
}

/* cisco logo hover color */
.svg-color:hover .svg-cisco-path1 {
  fill: #00bceb;
  transition: fill 0.3s ease;
}

/* mikrotik logo hover color */
.svg-color:hover .svg-mikrotik-path1 {
  fill: #293239;
  transition: fill 0.3s ease;
}