/* 
  Template Name: Authlab
	Template URI: https://authlab.netlify.app/
  Author: Alissio
  File Description: Main Css file of the template
	Version: 1.0.0
*/

/****************************************\

01.variables
02.general
03.helper
04.components

*****************************************/

:root {
  --primary-color: "#ff409a";
  --secondary-color: "#0cf0cf"
}

body {
  background-color: #e3e8ee;
  background: url(https://placehold.co/1340x600/b058a0/FFF) no-repeat center center / cover;
  font-family: "Nunito", sans-serif;
}
a {
  text-decoration: none;
}
.min-h-screen {
  min-height: 100vh;
}
.min-h-24 {
  min-height: 6rem; /* 96px */
}
.h-full {
  height: 100%;
}
.h-screen {
  height: 100vh;
}
.h-16 {
	height: 4rem; /* 64px */  
}
.p-10 {
  padding: 2.5rem;  /* 40px */
}
.py-10 {
  padding-top: 2.5rem; /* 40px */
  padding-bottom: 2.5rem; /* 40px */
} 
.px-16 {
  padding-left: 4rem; /* 64px */
  padding-right: 4rem; /* 64px */
}
.px-20 {
	padding-left: 5rem; /* 80px */
  padding-right: 5rem; /* 80px */  
}
.pr-11 {
  padding-right: 2.75rem; /* 44px */
}
.w-full {
  width: 100%;
}
.w-4 {
  width: 1rem; /* 16px */
}
.w-8 {
  width: 2rem; /* 32px */
}
.w-16 {
	width: 4rem; /* 64px */  
}
.object-cover {
  -o-object-fit: cover;
     object-fit: cover;
}
.overflow-clip {
  overflow: clip;
}
.text-left {
  text-align: left;
}
.text-sm {
  font-size: 0.875rem; /* 14px */
  line-height: 1.25rem; /* 20px */  
}
.text-base {
  font-size: 1rem; /* 16px */
  line-height: 1.5rem; /* 24px */
}
.text-lg {
	font-size: 1.125rem; /* 18px */
  line-height: 1.75rem; /* 28px */
}
.text-xl {
  font-size: 1.25rem; /* 20px */
  line-height: 1.75rem; /* 28px */  
}
.text-2xl {
  font-size: 1.5rem; /* 24px */
  line-height: 2rem; /* 32px */  
}
.text-cyan-400 {
  color: #22d3ee;
}
.hover\:text-cyan-500:hover {
  color: #06b6d4;
}
.text-gray-200 {
  color: rgb(229 231 235);
}
.text-gray-600 {
  color: rgb(75 85 99);
}
.text-zinc-700 {
  color: rgb(63 63 70);
}
.gap-x-1 {
  -webkit-column-gap: .25rem;
     -moz-column-gap: .25rem;
          column-gap: .25rem; /* 4px */
}
.gap-x-2 {
  -webkit-column-gap: .5rem;
     -moz-column-gap: .5rem;
          column-gap: .5rem; /* 8px */
}
.gap-x-4 {
  -webkit-column-gap: 1rem;
     -moz-column-gap: 1rem;
          column-gap: 1rem; /* 16px */
}
.gap-y-1 {
  row-gap: .25rem; /* 4px */
}
.bg-cyan-200 {
  background-color: #a5f3fc;
}
.bg-cyan-400 {
  background-color: #22d3ee;
}
.bg-indigo-950 {
  background-color: #1e1b4b;
}
.border-cyan-400 {
  border-color: rgb(34 211 238);
}
.btn-primary {
  background-color: #ec4899;
  border-color: #ec4899;
}
.btn-primary:hover {
  background-color: #db2777;
  border-color: #db2777;
}
.relative {
  position: relative;
}
.absolute {
  position: absolute;
}
.top-0 {
  top: 0;
}
.opacity-80 {
  opacity: .8;
}
.z-1 {
  z-index: 1;
}
.no-underline {
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
}
.font-bold {
  font-weight: bold;
}
.list-none {
  list-style-type: none;
}
.flex-1 {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 0%;
          flex: 1 1 0%;
}
.rounded-lg {
  border-radius: 0.5rem; /* 8px */
}

.bg-overlay {
  background: -webkit-gradient(linear,left top, left bottom,from(#1b183f),to(rgba(27,24,63,.4))) padding-box, -webkit-gradient(linear,left top, left bottom,from(#cb17e9),to(rgba(192,30,213,0))) border-box;
  background: -o-linear-gradient(#1b183f,rgba(27,24,63,.4)) padding-box, -o-linear-gradient(top,#cb17e9,rgba(192,30,213,0)) border-box;
  background: linear-gradient(#000,rgba(0,0,0,.4)) padding-box, linear-gradient(180deg,#000,rgba(0,0,0,0)) border-box;
  opacity: 0.7;
  width: 100%;
  height: 100%;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0px;
  top: 0px;
}
.auth-carousel {
  position: absolute;
  width: 100%;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}
.border-gradient {
  background: -webkit-gradient(linear,left top, left bottom,from(#ffffff),to(rgb(255 255 255 / 100%))) padding-box,-webkit-gradient(linear,left top, left bottom,from(#cb17e9),to(rgba(192,30,213,0))) border-box;
  background: -o-linear-gradient(#ffffff,rgb(255 255 255 / 100%)) padding-box,-o-linear-gradient(top,#cb17e9,rgba(192,30,213,0)) border-box;
  background: linear-gradient(#ffffff,rgb(255 255 255 / 100%)) padding-box,linear-gradient(180deg,#cb17e9,rgba(192,30,213,0)) border-box;
  border: 4px solid transparent;
}
.form-label {
  font-size: 14px;
  margin-bottom: .25rem;
}
.form-check-label {
  font-size: 14px;
}
.line-x {
  width: 100%;
  height: 1px;
  background-color: #ced4da;
}
.line-x-pos {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}
.btn-metamask {
  background-color: #fff;
  border: 1px solid #ced4da;
  color: #000;
  border-radius: 6px;
  margin: 0 auto;
  min-width: 230px;
  padding: .5rem 1rem;
}
.btn-metamask:hover {
  background-color: #e5e7eb;
}
.form-check-input:checked {
  background-color: #ec4899;
  border-color: #ec4899;
  -webkit-box-shadow: 0 0 0 0.25rem rgba(236, 72, 153,.25);
          box-shadow: 0 0 0 0.25rem rgba(236, 72, 153,.25);
}
.form-check-input:focus {
  border-color: #ec4899;
  -webkit-box-shadow: 0 0 0 0.25rem rgba(236, 72, 153,.25);
          box-shadow: 0 0 0 0.25rem rgba(236, 72, 153,.25);
}
.success-icon i {
  font-size: 3.5rem;
  color: #22c55e;
}
.form-layout {
  padding-top: 1.5rem;
  padding-bottom: 3rem;
  padding-left: 5rem;
  padding-right: 5rem;
  min-width: 50%;
  margin: 0 auto;
  background: -webkit-gradient(linear,left top, left bottom,from(#1b183f),to(rgba(27,24,63,.6))) padding-box, -webkit-gradient(linear,left top, left bottom,from(#cb17e9),to(rgba(192,30,213,0))) border-box;
  background: -o-linear-gradient(#1b183f,rgba(27,24,63,.6)) padding-box, -o-linear-gradient(top,#cb17e9,rgba(192,30,213,0)) border-box;
  background: linear-gradient(#1b183f,rgba(27,24,63,.6)) padding-box, linear-gradient(180deg,#cb17e9,rgba(192,30,213,0)) border-box;
  border: 4px solid transparent;
  border-radius: 20px;
}
.form-control {
  background-color: #5b5a99;
  color: #fff;
}
.form-control:focus {
  background-color: #5b5a99;
  color: #fff;
}
.img-thumbnail {
  background-color: #5b5a99;
}
/*new*/
@font-face{
	font-family: VerminVibes;
	src: url('https://cybersexuals.com/assets/fonts/VerminVibes.ttf');
	font-weight: 700;
}
h1.logo-txt {
	font-family: VerminVibes;
	text-align: center;
	font-size: 30px;
	line-height: 50px;
	margin: 0;
	color: #fff;
	text-transform: uppercase;
}
body {
	background:url(https://cybersexuals.com/tour/static/assets/cybersexuals-01b.jpg);
	background-size: cover;
}
body .btn-primary {
	background-color: #78dba8;
	border-color: #78dba8;
	color: #000;
}
body .btn-primary:hover {
	background-color: #000;
	border-color: #000;
	color: #fff;
}
.text-cyan-400 {
	color: #78dba8;
}
.hover\:text-cyan-500:hover {
	color: #78dba8;
}
a:hover {
	color: #78dba8;
}
.form-layout {
	background: linear-gradient(#1b183f, rgba(27, 24, 63, .6)) padding-box, linear-gradient(180deg, #78dba8, rgba(192, 30, 213, 0)) border-box;
}
body .btn-primary:focus {
	background-color: #000;
    border-color: #000;
}
/* @media (max-width:768px) {
	.container.flex.align-items-center.px-5.h-screen.z-1.relative {
		padding-left: 15px !important;
		padding-right: 15px !important;
	}
	.shadow.bg-indigo-950.flex.flex-column.form-layout {
		padding-left: 25px;
		padding-right: 25px;
	}
	h1.logo-txt {
		font-size: 22px;
	}
	form .flex.align-items-center.justify-content-between.gap-x-4.mt-4 {
		flex-direction: column;
	}
} */