:root {
    
    --theme-color-main: #15bcb7;
    --theme-color-dark: #0a7572;
    --theme-color-icon: teal;

    --theme-color-main: #bf1844;
    --theme-color-dark: #ad1146;
    --theme-color-icon: #ad1146;

    --theme-color-main: #096588;
    --theme-color-dark: #0c516b;
    --theme-color-icon: #096588;

  }

#header {
    font: Allerta Stencil;
}

p.large {
    font-size:large;
}
html {
    scroll-behavior: smooth;
}

body{
    background-color: white;
    display: flex;
    min-height: 100vh;
    flex-direction: column;
}

table.striped>tbody>tr>td{
    border-radius:0;
    word-break: break-all;
}

.card{
    border-radius: 15px;
  }

.card .my-card-image img {  
    width: 200px;
    height: 150px;
    border-radius: 25px;
}

.orderform-product-image {
    width: 200px;
    height: 150px;
    border-radius: 25px;
    float: right;
}

/* Form Select Focus Issue Fix */
select[required]:focus{
    outline: none !important;
}

select[required]{
    display: block;
    padding: 0;
    position: absolute;
    background: transparent;
    color: transparent;
    border: none;
    top: 0;
}

.collection .collection-item.avatar {
    padding-left: 102px;
}

.collection .collection-item.avatar:not(.circle-clipper)>.circle, .collection .collection-item.avatar :not(.circle-clipper)>.circle {
    width: 72px;
    height: 72px;
}
.container {
    width: 95%;
}
.modal{
    width: 100%;
    max-height: 95%;
}

.row {
    margin-bottom: auto;
}

.collection {
    border-radius: 25px;
}

.material-icons  {
    vertical-align: middle;
}

.carousel .carousel-item {
    width:700px !important;
    height: 500px !important;
}

.cart-badge {
    position: relative;
    right: 25px;
    top: -15px;
    color: var(--theme-color-dark);
    background-color: #fff;
    /* margin: 0 -.8em; */
    border-radius: 50%;
    padding: 0px 5px 0px 5px;
    z-index: 1;
}

.btn-floating, .sidenav,
.nav, .navbar-fixed, .nav-wrapper,
.page-footer, 
.card-panel, .waves-effect, .waves-light {
    background-color: var(--theme-color-main);;
    color: white;
}

.btn, .btn-tiny {
    border-radius:25px;
    background-color:   var(--theme-color-main);
}

nav .brand-logo {
    padding-left: 20px;
}

nav .sidenav-trigger {
    margin: 0 5px;
    padding: 0 5px;
}

.sidenav{
    width: 225px;
}
.sidenav li>a{
    color: white;
}
.sidenav li {
    border-bottom: 1px solid;
    border-bottom-color: var(--theme-color-dark);
}

.default-ul {
    padding-left: revert !important;
    list-style-type: revert !important;
}

.default-li {
    padding-left: revert !important;
    list-style-type: revert !important;
}

.sidenav .user-view {
    margin-bottom: 0px;
}

.sidenav .user-view .background {
    background-image: url(/images/NeelithalPageTop.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    margin-bottom: 0px;
}

.sidenav li>a>i.material-icons {
    float: left;
    height: 48px;
    line-height: 48px;
    margin: 0 5px 0 0;
    width: 24px;
    color: rgba(0,0,0,0.54);
}

.logo_img {
    width: 40px;
    height: 40px;
    border-radius: 25px;
    vertical-align: sub;
    margin-right: 5px;
}

.brand-sidenav {
    padding-left: 32px;
    padding-top: 6px;
    height: 56px;
    color: #fff;
    display: inline-block;
    font-size: 2.1rem;
}

.brand-logo-sidenav {
    padding: 0px;
    font-size: 2.5rem;
}

.slide-out-cart-top {
    float: right;
    padding-right: 10px;
    padding-left: 10px;
}

.main {
    flex: 1 0 auto;
  }

#pri_map , #sec_map {
    width:100%;
    height:380px;
}
.pac-container {
    z-index: 10000 !important;
}

.LockOn {
    display: block;
    visibility: visible;
    position: fixed;
    z-index: 10000;
    top: 0px;
    left: 0px;
    width: 105%;
    height: 105%;
    background-color: transparent;
    vertical-align: bottom;
    padding-top: 20%; 
    filter: alpha(opacity=100); 
    opacity: 0.75; 
    font-size:large;
    color:blue;
    font-style:italic;
    font-weight:400;
    background-image: url("../images/loader_gif.gif");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
}


/* preload style */

    
#preloader {
    position: fixed;
    top: auto;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-color: white;
    opacity: 0.75;
    z-index: 10000;
}

#movingBallG {
    position: fixed;
    top: 50%;
    height: 10px;
    margin-top: -5px;
    left: 50%;
    width: 128px;
    margin-left: -64px;
}

.movingBallLineG{
    position:absolute;
    left:0px;
    top:4px;
    height:2px;
    width:128px;
    background-color:#4D3D4D;
}
    
.movingBallG{
    background-color:#171617;
    position:absolute;
    top:0;
    left:0;
    width:10px;
    height:10px;
    -moz-border-radius:5px;
    -moz-animation-name:bounce_movingBallG;
    -moz-animation-duration:0.9s;
    -moz-animation-iteration-count:infinite;
    -moz-animation-direction:linear;
    -webkit-border-radius:5px;
    -webkit-animation-name:bounce_movingBallG;
    -webkit-animation-duration:0.9s;
    -webkit-animation-iteration-count:infinite;
    -webkit-animation-direction:linear;
    -ms-border-radius:5px;
    -ms-animation-name:bounce_movingBallG;
    -ms-animation-duration:0.9s;
    -ms-animation-iteration-count:infinite;
    -ms-animation-direction:linear;
    -o-border-radius:5px;
    -o-animation-name:bounce_movingBallG;
    -o-animation-duration:0.9s;
    -o-animation-iteration-count:infinite;
    -o-animation-direction:linear;
    border-radius:5px;
    animation-name:bounce_movingBallG;
    animation-duration:0.9s;
    animation-iteration-count:infinite;
    animation-direction:linear;
}
    
    @-moz-keyframes bounce_movingBallG{
        0%{left:0px;}
        50%{left:118px;}
        100%{left:0px;}
    }
    @-webkit-keyframes bounce_movingBallG{
        0%{left:0px;}
        50%{left:118px;}
        100%{left:0px;}
    }
    @-ms-keyframes bounce_movingBallG{
        0%{left:0px;}
        50%{left:118px;}
        100%{left:0px;}
    }
    @-o-keyframes bounce_movingBallG{
        0%{left:0px;}
        50%{left:118px;}
        100%{left:0px;}
    } 
    @keyframes bounce_movingBallG{
        0%{left:0px;}
        50%{left:118px;}
        100%{left:0px;}
    }

    .blinker {
        animation: blinker 1s linear infinite;
    }

    @keyframes blinker {
        50% {
          opacity: 0;
        }
    }
/*==================================================
2. PRELOADER
==================================================*/
.preloading {
    width: 100%;
    text-align: center;
    height: 100%;
    position: fixed;
    background: var(--theme-color-main);;
    z-index: 10000;
    display: table;
    top: auto;
    opacity: 0.90;
 }
  
  .preloading .wrap-preload {
    display: table-cell;
    text-align: center;
    vertical-align: middle; }
  
  .preloading .cssload-loader {
    width: 49px;
    height: 49px;
    border-radius: 50%;
    margin: 3em;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    background: rgba(255, 99, 56, 0.95); }
  
  .preloading .cssload-loader,
  .preloading .cssload-loader:before,
  .preloading .cssload-loader:after {
    animation: 1.15s infinite ease-in-out;
    -o-animation: 1.15s infinite ease-in-out;
    -ms-animation: 1.15s infinite ease-in-out;
    -webkit-animation: 1.15s infinite ease-in-out;
    -moz-animation: 1.15s infinite ease-in-out; }
  
  .preloading .cssload-loader:before,
  .preloading .cssload-loader:after {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0; }
  
  .preloading .cssload-loader {
    animation-name: cssload-loader;
    -o-animation-name: cssload-loader;
    -ms-animation-name: cssload-loader;
    -webkit-animation-name: cssload-loader;
    -moz-animation-name: cssload-loader; }
  
  @keyframes cssload-loader {
    from {
      transform: scale(0);
      opacity: 1; }
    to {
      transform: scale(1);
      opacity: 0; } }
  @-o-keyframes cssload-loader {
    from {
      -o-transform: scale(0);
      opacity: 1; }
    to {
      -o-transform: scale(1);
      opacity: 0; } }
  @-ms-keyframes cssload-loader {
    from {
      -ms-transform: scale(0);
      opacity: 1; }
    to {
      -ms-transform: scale(1);
      opacity: 0; } }
  @-webkit-keyframes cssload-loader {
    from {
      -webkit-transform: scale(0);
      opacity: 1; }
    to {
      -webkit-transform: scale(1);
      opacity: 0; } }
  @-moz-keyframes cssload-loader {
    from {
      -moz-transform: scale(0);
      opacity: 1; }
    to {
      -moz-transform: scale(1);
      opacity: 0; } }


/* Webkit Scroll Bar */
::-webkit-scrollbar {
    width: 5px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
    background: var(--theme-color-main); 
}
::-webkit-scrollbar-thumb:window-inactive {
	background: var(--theme-color-main); 
}

/* Disable Popout Video */
.hidebtn {
    width: 72px;
    height: 72px;
    position: absolute;
    right: 5px;
    top: 5px;
  }