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

*	   SkarNet (Skar Network) UX - Thems CSS Only		*

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

@charset "utf-8";

html {
  -webkit-transition: all 0.6s ease-in-out;

  -moz-transition: all 0.6s ease-in-out;

  -ms-transition: all 0.6s ease-in-out;

  -o-transition: all 0.6s ease-in-out;

  transition: all 0.6s ease-in-out;
}

body {
  color: #35363d;

  overflow-x: hidden;

  -webkit-transition: all 0.6s ease-in-out;

  -moz-transition: all 0.6s ease-in-out;

  -ms-transition: all 0.6s ease-in-out;

  -o-transition: all 0.6s ease-in-out;

  transition: all 0.6s ease-in-out;
}

b {
  font-family: "Roboto Medium V1", sans-serif;

  font-weight: 400;
}

a {
  text-decoration: none !important;

  outline: none !important;
}

a:link {
  text-decoration: none !important;

  outline: none !important;
}

::selection {
  background: rgba(62, 68, 66, 0.6);

  color: #ffffff;
}

/* Content Style */

.wfullpages {
  display: block;

  position: relative;

  padding: 72px 0rem 0rem;

  -webkit-transition: all 0.4s ease-in-out;

  -moz-transition: all 0.4s ease-in-out;

  -ms-transition: all 0.4s ease-in-out;

  -o-transition: all 0.4s ease-in-out;

  transition: all 0.4s ease-in-out;
}

.wfullpages-lg {
  padding: 112px 0rem 0rem;
}

.wfullpages-md {
  padding: 90px 0rem 0rem;
}

.wfullpages-sm {
  padding: 60px 0rem 0rem;
}

/* Custom Col Grid CSS */

[class*="col-"],
[class*="col-lg-"],
[class*="col-md-"],
[class*="col-sm-"] {
  border: none;
}

/* Container Custom */

.wcontainer {
  max-width: 1280px;

  width: 100%;
}

/*	============ Halaman Index ============ */

/* Backgorund Shadow */

.wbg-shadow {
  background: rgba(0, 0, 0, 0.5);

  position: absolute;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  width: 100%;
}

/* Background Gradient */

.wbg-gradient-primary {
  background: linear-gradient(to left, #da8cff 20%, #9a55ff 80%);
}

.wbg-gradient-success {
  background: linear-gradient(to left, #09ff74 20%, #07cdae 80%);
}

.wbg-gradient-info {
  background: linear-gradient(to left, #54ceff 20%, #4992ff 80%);
}

.wbg-gradient-warning {
  background: linear-gradient(to left, #ffe77f 20%, #ffd500 80%);
}

.wbg-gradient-danger {
  background: linear-gradient(to left, #ffb096 20%, #ff7096 80%);
}

.wbg-gradient-skarnet {
  background: linear-gradient(to right, #000000, #1d3856);
}

[class*="wbg-gradient-"] {
  background-size: cover;

  background-repeat: no-repeat;

  object-fit: cover;

  height: 100%;

  max-height: 100%;

  width: 100%;

  max-width: 100%;

  -webkit-transition: all 0.4s ease-in-out;

  -moz-transition: all 0.4s ease-in-out;

  -ms-transition: all 0.4s ease-in-out;

  -o-transition: all 0.4s ease-in-out;

  transition: all 0.4s ease-in-out;
}

/* Button Style */

.wbtn {
  background: transparent;

  border: none;

  display: table;

  border-radius: 3.5px;

  color: #35363d;

  font-family: "Roboto Medium V1", sans-serif;

  font-size: 0.96rem;

  margin: auto;

  text-decoration: none !important;

  outline: none !important;

  padding: 0.4rem 1.08rem 0.4rem;

  -webkit-transition: 0.4s ease-in-out;

  -moz-transition: 0.4s ease-in-out;

  -ms-transition: 0.4s ease-in-out;

  -o-transition: 0.4s ease-in-out;

  transition: 0.4s ease-in-out;
}

.wbtn-border {
  border: 1px solid #cccccc;
}

.wbtn:before,
.wbtn:after,
.wbtn:active,
.wbtn:link {
  text-decoration: none !important;

  outline: none !important;
}

.wbtn:hover {
  box-shadow: 0px 0px 4px rgba(62, 68, 66, 0.4);
}

/* Button Gradient */

.wbtn-primary {
  background: linear-gradient(to left, #da8cff 20%, #9a55ff 80%);
}

.wbtn-success {
  background: linear-gradient(to left, #09ff74 20%, #07cdae 80%);
}

.wbtn-info {
  background: linear-gradient(to left, #66d6ff 20%, #4992ff 80%);
}

.wbtn-warning {
  background: linear-gradient(to left, #ffe77f 20%, #ffd500 80%);
}

.wbtn-danger {
  background: linear-gradient(to left, #ffb096 20%, #ff7096 80%);
}

[class*="wbtn-"] {
  background-size: 100%;

  border-radius: 4px;

  color: #ffffff;

  -webkit-transition: all 0.4s ease-in-out;

  -moz-transition: all 0.4s ease-in-out;

  -ms-transition: all 0.4s ease-in-out;

  -o-transition: all 0.4s ease-in-out;

  transition: all 0.4s ease-in-out;
}

[class*="wbtn-"]:hover {
  color: #ffffff;
}

[class*="wbtn-"]::selection {
  background: none;
}

/* Size Button Gradient */

.wbtn-lg {
  font-size: 0.96rem;

  padding: 0.8rem 1.08rem 0.8rem;
}

.wbtn-md {
  font-size: 0.94rem;

  padding: 0.62rem 1.08rem 0.62rem;
}

.wbtn-sm {
  font-size: 0.9rem;

  padding: 0.45rem 1.08rem 0.45rem;
}

/* Images Stye */

.wimg {
  background-size: cover;

  background-repeat: no-repeat;

  object-position: center;

  object-fit: cover;

  height: 100%;

  width: 100%;

  -webkit-transition: all 0.4s ease-in-out;

  -moz-transition: all 0.4s ease-in-out;

  -ms-transition: all 0.4s ease-in-out;

  -o-transition: all 0.4s ease-in-out;

  transition: all 0.4s ease-in-out;
}

/* Image Custom */

.wimg-icons {
  height: 42px;

  width: auto;
}

.wimg-icons-lg {
  height: 180px;

  width: 180px;
}

.wimg-icons-md {
  height: 140px;

  width: 140px;
}

.wimg-icons-sm {
  height: 72px;

  width: 72px;
}

/* Font Style */

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Roboto Bold V2", sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
label,
p {
  margin: 0rem;
}

.text-dark {
  color: #35363d;
}

/* Text Size */

.wmedium-text {
  font-family: "Roboto Medium V1", sans-serif;

  font-size: 1.1rem;

  font-weight: 600;
}

.wsmall-text {
  font-family: "Roboto Reguler V1", sans-serif;

  font-size: 0.88rem;

  font-weight: 400;
}

/* Position */

.wleft {
  float: left;
}

.wright {
  float: right;
}

.wcenter {
  text-align: center;
}

/* Link Style */

.wlink-disable {
  pointer-events: none;
}

/* Input Style */

.winput {
  background: #ffffff;

  border-radius: 4px;

  border: 1px solid #e0e0e0;

  display: block;

  font-family: "Roboto Reguler V1", "Helvetica", sans-serif;

  font-size: 0.9rem;

  resize: none;

  padding: 0.6rem 0.98rem 0.6rem;

  width: 100%;

  -webkit-transition: all 0.4s ease-in-out;

  -moz-transition: all 0.4s ease-in-out;

  -ms-transition: all 0.4s ease-in-out;

  -o-transition: all 0.4s ease-in-out;

  transition: all 0.4s ease-in-out;
}

.winput-lg {
  font-size: 0.9rem;

  padding: 0.88rem 0.98rem 0.88rem;
}

.winput-md {
  font-size: 0.9rem;

  padding: 0.74rem 0.98rem 0.74rem;
}

.winput-sm {
  font-size: 0.9rem;

  padding: 0.68rem 0.98rem 0.68rem;
}

.wsubmit {
  background: #cccccc;

  border: none;

  text-transform: uppercase;

  font-family: "Roboto Medium V1", sans-serif;

  letter-spacing: 0.2px;

  margin: 0.8rem 0rem 0.8rem;
}

.wsubmit:hover {
  box-shadow: 0px 0px 4px rgba(62, 68, 66, 0.2);
}

/* Form Group */

.wform-group {
  clear: both;

  display: block;

  margin-bottom: 1rem;
}

.wform-group .wform-label {
  display: table;

  font-family: "Roboto Medium V1", sans-serif;

  font-size: 0.98rem;

  font-weight: 400;

  text-align: left;

  padding: 0rem 0.2rem 0.6rem;

  width: 100%;
}

.wform-group .wform-label span {
  font-size: 0.94rem;

  font-weight: 300;
}

.wform-group .custom-select {
  font-family: "Roboto Reguler V1", sans-serif;

  font-size: 0.92rem;
}

.wform-group .custom-select:focus {
  box-shadow: none;
}

.wform-group .wform-note {
  color: #717271;

  display: table;

  font-family: "Roboto Reguler V1", sans-serif;

  font-size: 0.82rem;

  text-align: left;

  position: relative;

  padding: 0.4rem 0.4rem 0.4rem;

  width: 100%;

  max-width: 100%;
}