@import url(https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700,800&display=swap);

:root {
  --theme: rgba(73, 192, 208, 1);
  --theme2: rgba(73, 192, 208, 0.2);
  --theme3: rgba(73, 192, 208, 0.3);
  --theme4: rgba(73, 192, 208, 0.4);
  --theme5: rgba(73, 192, 208, 0.5);
  --theme6: rgba(73, 192, 208, 0.6);
  --theme7: rgba(73, 192, 208, 0.7);
  --theme8: rgba(73, 192, 208, 0.8);
  --theme9: rgba(73, 192, 208, 0.9);

  --bluetheme: rgb(18, 29, 51);
  --bluetheme9: rgba(18, 29, 51, 0.9);

  --22blue1theme: rgb(20, 36, 58);
  --7blue2theme: rgb(30, 65, 86);
  --5blue1theme: rgb(27, 56, 77);
  --7blue1theme: rgb(25, 49, 71);
  --5theme1blue: rgb(64, 165, 182);

  --1blue1theme: rgb(46, 111, 130);
  --1blue1theme3: rgba(46, 111, 130, 0.3);
  --2blue1theme: rgba(36, 83, 103, 0.8);
  --5blue2theme: rgb(34, 76, 96);
  --3theme1blue: rgba(59, 151, 169, 0.8);

  --1theme1white: rgb(164, 224, 232);
  --2theme1white: rgb(134, 213, 224);
  --4theme1white: rgb(109, 205, 217);
  --2white1theme: rgb(194, 234, 239);

  --7white2theme: rgb(215, 241, 245);
  --2yellow1theme: rgb(194, 234, 69);
}

#preloader:before {
  border: 3px solid var(--theme);
}
#preloader:after {
  border: 3px solid var(--theme);
}
.navbar-nav > li {
  box-shadow: 0 0 1px 1px var(--theme3);
  background-color: var(--theme2);
}
@media screen and (max-width: 766px) {
  .navbar-nav > li {
    box-shadow: 0 0 1px 1px var(--theme2);
  }
}
#canvas {
  box-shadow: 0 0 1px 2px var(--1theme1white);
}
.bord-50 {
  box-shadow: 0 0 1px 1px var(--theme3);
}
.logo-50 {
  border: 2px solid var(--theme5);
}
.one-buttons hr,
.two-buttons hr {
  background: var(--theme5) !important;
}
.dropdown-toggle:after {
  color: var(--theme8);
}

.pagination button {
  border: 2px solid var(--theme);
  background:linear-gradient(to bottom, var(--theme) 0%, var(--bluetheme9) 100%);
}
.pagination button.nav {
  box-shadow: 0 0 0 1px var(--theme);
  background:linear-gradient(to bottom, #fff 0%, var(--theme) 100%);
}
@media screen and (max-width: 766px) {
  .pagination button.nav.next {
    border: 2px solid var(--theme);
    background:linear-gradient(to bottom, var(--theme) 0%, var(--bluetheme9) 100%);
  }
}

a:hover,
a:active {
  color: var(--theme);
  text-decoration: none;
}
.thegold {
  background-color: var(--theme2);
}

@media screen and (max-width: 1092px) {
  .navbar-nav {
    border: 1.4px solid var(--theme7) !important;
    box-shadow: 0px 5px 10px 0px var(--theme7);
  }
  .navbar-nav li {
    border-bottom: 1.4px solid var(--theme3);
  }
  .navbar-toggler {
    border: 1.1px solid  var(--theme);
    box-shadow: 0 0 0 1.1px var(--2theme1white);
  }
  .navbar-toggler:after {
    border-bottom: 2.5px solid var(--theme);
    border-top: 2.5px solid var(--theme);
  }
  .navbar-toggler:before {
    background: var(--theme);
    border: 1.2px solid var(--theme);
  }
  .navbar-toggler.menu-opened:after {
    background: var(--theme);
    border: 1.4px solid var(--theme) !important;
  }
  .navbar-toggler.menu-opened:before {
    border: 1.4px solid var(--theme) !important;
  }
}

.attr-nav > ul > li.dropdown ul.dropdown-menu {
  border: 2px solid var(--theme5) !important;
  box-shadow: 0px 5px 10px 2px var(--theme5);
}
.attr-nav > ul > li.dropdown ul.dropdown-menu li {
  border-bottom: 2px solid var(--theme3) !important;
}
.navbar-default {
  border-bottom: 2px solid var(--theme4);
}
.scroll-to-top {
  border: 2px solid var(--theme);
}
.butn {
  border: 1.4px solid var(--theme);
}
.butn:after {
  background: var(--theme6);
}
.butn.white:hover {
  border: 1.4px solid var(--theme);
}
.section-heading h4:after {
  background: var(--theme7);
}

.harc a.butn,
.port a.butn,
#jinaHolder,
#jinaHolder2 {
  color: var(--2white1theme) !important;
}

#jinaHolder2::after {
  background: var(--2theme1white) !important;
}

.progress-bar-striped {
	border: 1px solid var(--theme5) !important;
  box-shadow: 0 0 0 1px var(--theme7) !important;
}

.filtering .butn {
  color: var(--theme);
  background: var(--22blue1theme);

  border: 2px solid var(--theme5) !important;
  box-shadow: 0 0 0 1px var(--1theme1white) !important;
}
.filtering .butn.white {
  color: var(--7blue2theme);
  background: linear-gradient(to bottom, #fff 20%, var(--theme) 100%); 

  border: 2px solid var(--5blue1theme) !important;
}
.filtering .butn.white:hover{
  color: var(--theme);
}
.filtering .butn.white:after{
  background: var(--22blue1theme);
}

.modal-content {
  background: var(--2blue1theme);
  border: 3.5px solid var(--theme5);
}
#modalsend {
  background: var(--theme2) !important;
  border: 2px solid var(--theme2);
}
.navbar-nav li.nav-small a {
  background: var(--7white2theme) !important;
  box-shadow: 0 0 0 1px var(--1theme1white);
  color: var(--5blue1theme) !important;
}
.modal-body div p {
  border: 1.4px solid var(--theme3);
}
.modal-footer,
#modal-check,
.modal-body {
  border: 2px solid var(--theme2);
}

#copy,
#totals,
#toasts {
  color: var(--7blue1theme) !important;
  border: 2px solid var(--3theme1blue);
  box-shadow: 0 0 0 1px var(--1theme1white);
  background: linear-gradient(to bottom, #fff 0%, var(--2yellow1theme) 100%) !important;
}

#pdf,
#email,
#cart,
#home,
.money,
#footer,
#vpn-icon,
#logout {
  color: var(--7blue1theme) !important;
  border: 2px solid var(--3theme1blue);
  box-shadow: 0 0 0 1px var(--1theme1white);
  background: linear-gradient(to bottom, #fff 20%, var(--theme) 100%) !important;
}

.shop#footer {
  background: linear-gradient(to bottom, #fff 10%, var(--2yellow1theme) 100%) !important;
}

.pricing-list {
  box-shadow: 0 0 0 1px var(--theme4) !important;
  border: 2px solid var(--5blue2theme) !important;

  background: var(--22blue1theme);
}
.pricing-list.highlight {
  background: var(--1theme1white);
}
.pricing-list ul li:after {
  background: var(--theme2);
}
.pricing-list h2,
.pricing-list ul li {
  color:var(--theme8);
}
.pricing-list h2.text-white,
.pricing-list ul li.text-white {
  color: var(--7blue2theme) !important;
}
.pricing-list button {
  color: var(--7blue2theme) !important;
  border: 1.4px solid var(--theme) !important;
}
.pricing-list.highlight button {
  color: var(--7blue2theme) !important;
  border: 1.4px solid var(--7blue2theme) !important;
}
.pricing-list.highlight button.white::after {
  background: var(--7blue2theme) !important;
}
.pricing-list ul li.text-white:nth-child(1)::-webkit-scrollbar-thumb {
  background: var(--1blue1theme)
}
.pricing-list.highlight ul li:after {
  background: var(--1blue1theme3);
}

.login-text p:after,
.bro-text p:after{
	background: var(--theme9);
}
.harc a img,
.port a img {
  border: 2px solid var(--theme5);
  border-bottom: none;
}
.harc h4,
.port h4 {
  border: 2px solid var(--theme3);
}
.harc:hover,
.port:hover {
  box-shadow: 0 3px 7px 0 var(--theme7);
}
.logo-img {
  border: 1.4px solid var(--theme3);
}
#style-switcher {
  box-shadow: 0px 7px 21px 0 var(--theme3);
  border: 1.4px solid var(--theme3);
}
.cd-time-content {
  border: 2px solid var(--1blue1theme)
}

.swiper-button-prev,
.swiper-button-next {
  background: linear-gradient(to bottom, #fff 0%, var(--theme) 100%) !important;
  border: 2.5px solid var(--1blue1theme);
  box-shadow: 0 0 0 0.5px var(--theme2);
  color: var(--1blue1theme) !important;
}
.swiper-button-prev {
  background: var(--22blue1theme) !important;
}

.icon-button.this {
  border: 2px solid var(--theme);
}
.gallery button.butn.white {
  background: linear-gradient(to bottom, #fff 50%, var(--1theme1white) 100%) !important;
  box-shadow: 0 0 0 2px var(--7white2theme) !important; 
  color: var(--5blue2theme) !important;
}
::-webkit-scrollbar-thumb {
  background: var(--4theme1white);
}

/* Rev Slider */
.rev-title {
  background: linear-gradient(135deg, #fff 0%, var(--1theme1white) 100%);
}
.rev-scroll-button {
  color: var(--7blue1theme) !important;
  border: 2px solid var(--3theme1blue);
  background: linear-gradient(to bottom, #fff 20%, var(--theme) 100%) !important;
}
.rev-progress-bar {
  background-color: var(--2theme1white);
}