@import url('https://fonts.googleapis.com/css2?family=Khand:wght@300;400;500;600;700&family=Poppins:wght@100;200;300;400;500;600;700;800&display=swap');
/*=== General Variables ===*/:root {
    --color1:#2196F3;
    --color2:#CDDC39;
    --color3:#808284;
    --color4:#0f0834;
    --color5:#0a0521;
    --color6:#ff76d5;
    --color7:#1ad688;
    --color8:#ffc600;
    --color9:#c40172;
    --color10:#990fff;
    --color11:#ff7500;
    --color12:#00fdfe;
    --color13:#55a61d;
    --color14:#e90133;
    --color15:#02728e;
    --color16:#1ec8bf;
    --color17:#ff4747;
    --color18:#ffe27a;
    --color19:#1f5abc;
    --color20:#d2eaff;
    --transition: all 0.2s cubic-bezier(0.19, 0.68, 0.49, 1.21);
    --transition2:all .3s linear;
    --round: 50%;
    --curve: 3px;
    --full: 100%;
    --font-family2:'Source Sans Pro', sans-serif;
}

.silver-card {
    background: #d2d2d2;
    color: white;
}

.gold-card {
    background: var(--color1);
    color: white;
}

.platinum-card {
    background: var(--color2);
    color: white !important;
}

.platinum-card h2.text-primary {
    color: #55479f;
}

.bg-color1 {
    background-color: var(--color1) !important;
}

.bg-color2 {
    background-color: var(--color2);
}

.bg-color3 {
    background-color: var(--color3);
}

.bg-color4 {
    background-color: var(--color4);
}

.bg-color5 {
    background-color: var(--color5);
}

.bg-color6 {
    background-color: var(--color6);
}

.bg-color7 {
    background-color: var(--color7);
}

.bg-color8 {
    background-color: var(--color8);
}

.bg-color9 {
    background-color: var(--color9);
}

.bg-color10 {
    background-color: var(--color10);
}

.bg-color11 {
    background-color: var(--color11);
}

.bg-color12 {
    background-color: var(--color12);
}

.bg-color13 {
    background-color: var(--color13);
}

.bg-color14 {
    background-color: var(--color14);
}

.bg-color15 {
    background-color: var(--color15);
}

.bg-color16 {
    background-color: var(--color16);
}

.bg-color17 {
    background-color: var(--color17);
}

.bg-color18 {
    background-color: var(--color18);
}

.bg-color19 {
    background-color: var(--color19);
}

.bg-color20 {
    background-color: var(--color20);
}

.text-color1 {
    color: var(--color1);
}

.text-color2 {
    color: var(--color2);
}

.text-color3 {
    color: var(--color3);
}

.text-color4 {
    color: var(--color4);
}

.text-color5 {
    color: var(--color5);
}

.text-color6 {
    color: var(--color6);
}

.text-color7 {
    color: var(--color7);
}

.text-color8 {
    color: var(--color8);
}

.text-color9 {
    color: var(--color9);
}

.text-color10 {
    color: var(--color10);
}

.text-color11 {
    color: var(--color11);
}

.text-color12 {
    color: var(--color12);
}

.text-color13 {
    color: var(--color13);
}

.text-color14 {
    color: var(--color14);
}

.text-color15 {
    color: var(--color15);
}

.text-color16 {
    color: var(--color16);
}

.text-color17 {
    color: var(--color17);
}

.text-color18 {
    color: var(--color18);
}

.text-color19 {
    color: var(--color19);
}

.text-color20 {
    color: var(--color20);
}

h1, h2, h3, h4, h5, h6{
    font-family: 'Khand', sans-serif;
}

 
body{
font-family: 'Poppins', sans-serif;
color: #1d1d1d;
font-weight: 400;
}
.logo{
    max-height: 80px;
}
label{
    font-size: 14px;
}
.navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 1rem;
    padding-left: 1rem;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 14px;
}


header {
 
  position: relative;
  top: 0;
  transition: top 0.2s ease-in-out;
  width: 100%;
  text-align: center;
}

 
 

.nav-up {
  top: 0;
    position: fixed;
    z-index: 999;
    transition: top 0.2s ease-in-out;
}

.de-images {
    position: relative;
    width: 100%;
}

.de-images img {
    border-radius: 5px;
    -webkit-box-shadow: 2px 20px 30px 0px rgba(20,20,20, 0.2);
    -moz-box-shadow: 2px 20px 30px 0px rgba(20,20,20, 0.2);
    box-shadow: 2px 20px 30px 0px rgba(20,20,20, 0.2);
}
.di-small {
    position: absolute;
    width: 50%;
    height: 50%;
    top: 75%;
    left: -35%;
    z-index: -1;
}
.di-small-2 {
   position: absolute;
    width: 42%;
    height: auto;
    right: -5%;
    bottom: -5%;
    z-index: 1;
}
.img-fluid {
    max-width: 100%;
    height: auto;
}

.watch-video{
    text-decoration: none;
    color: var(--color1);
    margin: 2rem 10px;
    text-transform: uppercase;
    font-weight: bold;
    display: flex;
    align-items: center;
}

.watch-video .fa{
    display: flex;
    height: 40px;
    width: 40px;
    margin-right: 10px;
    border-radius: 50%;
    background: linear-gradient(45deg, var(--color1), var(--color2));
    align-items: center;
    justify-content: center;
    color: white;
}
.tables{
    line-height: 2;
}
.btn-primary{
    background: linear-gradient(45deg, var(--color1), var(--color2));
    border: none;
    border-radius: 2px;
}
.carousel-caption {
    position: absolute;
    right: 15%;
   
    left: 15%;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    color: #fff;
    text-align: center;
    font-family: 'Khand', sans-serif;
    color: white;
    
}
.carousel-caption h2 span{
    font-size: 70%;
}
.carousel-caption h2{
    font-size: 4rem;
    font-family: 'Khand', sans-serif;
    font-weight: 700;
}
.carousel-caption .carousel-date{
    font-size: 1.3rem;
    font-weight: 700;
    background-color: var(--color1);
    display: inline-block;
    padding: 2px 1rem;
    margin-top: 2rem;
    border-radius: 4px;
    letter-spacing: 2px;
}

.features li
 {
    display: flex;
    align-items: center;
    margin-top: 1rem;
 }
.features li .fa{
    margin-right: 1rem;
    color: var(--color1);
}
.carousel-caption .carousel-location{
    font-size: 1.5rem;
    margin-top: 2rem;
    font-weight: 500; 
    letter-spacing: 2px;
}
 .carousel-item{
    background-color: black;
 }
 .carousel-item img{
    opacity: 0.4;
 }
.btn{
	font-size: 16px;
 
padding: 0.6rem 2rem;
}
.ui-datepicker {
    width: 100%;
  
}
.ui-datepicker td span, .ui-datepicker td a {
    display: block;
    padding: 1rem;
    text-align: right;
    text-decoration: none;
}
.ui-state-default{
    border: 1px solid #ffffff;
    background: #ffffff;
    font-weight: normal;
    color: #454545;
    padding: 1rem;
}

#upload {
    opacity: 0;
}

#upload-label {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    text-align: center;
}
.upload-image{
	height: 200px;
	border: 1px dashed #ccc;
}

.image-area {
    border: 2px dashed rgba(255, 255, 255, 0.7);
    padding: 1rem;
    position: relative;
}

.image-area::before {
    content: 'Uploaded image result';
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.8rem;
    z-index: 1;
}

.image-area img {
    z-index: 2;
    position: relative;
}

.infographics h4 {
    font-size: 16px; 
    font-weight: 300;
    color: black;
}

@media(max-width:480px){
    .ui-datepicker td span, .ui-datepicker td a {
    display: block;
    padding: 0rem;
    text-align: right;
    text-decoration: none;
}
.btn {
    font-size: 14px;
    padding: 0.5rem 1rem;
}
 
    .di-small-2 {
   position: absolute;
    width: 42%;
    height: auto;
    right: -5%;
    bottom: -5%;
    z-index: 1;
}

.carousel-caption {
    position: relative;
    width: 90%;
    bottom: 20%;
    left: 5%;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    color: #fff;
    text-align: center;
    font-family: 'Khand', sans-serif;
    color: white;
    display: block !important;
    margin-top: -5rem;
}
.carousel-caption h2 {
    font-size: 2rem;    
}
.carousel-caption .carousel-date {
    font-size: 1rem;
    }
}