/****************************************************
* vcron Global CSS revision 1.0
* Revision notes:
* 1. Removed support for banno classes
* 2. Removed commented lines with no foreseable use case
*****************************************************/
:root 
{
  /* COLOR THEME */  
  /* Names and color harmony from coolors.co */
  /* Harmony 10: */
  --amazonitegreen: rgb(0, 176, 176);
  --darkapplered: rgb(176, 0, 0);
  --sunglow: #ffca3a;
  --crayolablue: #3772ff;
  --alabaster: #eaf2e3;
  --amazonitegreen-tr: rgba(0, 176, 176, .3);
  
  /* Harmony 20: ...*/


  /* Misc colors */  
  --ceruleanblue: #5aafee;
  --fiordgreen: #485761; /* dark green */
  --darkfire: rgb(255, 0, 0);
  --steelgrey: rgb(100, 100, 100);
  --charlestongreen: rgb(14, 17, 17); /* near black */

  --rose-theme-color-base: var(--darkapplered);
  --theme-color-complement: var(--amazonitegreen);
  
  --theme-color-10-blue: var(--crayolablue);
  --theme-color-10-yellow: var(--sunglow);
  --theme-color-10-white: var(--alabaster);
  --theme-color-10-green: var(--amazonitegreen);
  --theme-color-10-red: var(--darkapplered);
  --theme-color-10-lite: var(--alabaster);
  
  --theme-color-40a-accent1: rgba(64,224,208, .6); /*turquoise*/
  --theme-color-40a-accent2: rgba(0,151,148, .6);
  --theme-color-40b-accent1: rgba(70,130,180, .6); 
  --theme-color-40b-accent2: rgba(0,171,235, .6); /* 0,191,255 */
  
  --theme-color-40-bright: #00c0c0; 
  --theme-color-40-brighter: #00c9c9;
  
  --theme-color-complement-gradient: linear-gradient(to bottom, rgb(10, 200, 200), 0, 170, 170);
  
  --theme-color-hover-complement: turquoise;
  --theme-color-hover-darker-complement: lightseagreen;
  
  --theme-textcolor-base: white;  
  
  /* GLOBAL MENU STYLE */
  --theme-color10green-dropdownlistbox-bg: var(--amazonitegreen);
  --theme-color10green-dropdownlistbox-bg-transparent: var(--amazonitegreen-tr);
  --theme-color10green-dropdownlistbox-hilite: var(--amazonitegreen);
  
  --theme-ddlbgradient-bg: linear-gradient(45deg, rgba(40, 80, 200, .6), rgba(40, 90, 160, .4), rgba(90, 240, 181, .1)); 
  /*url("/assets/img/bg_tileglassgreen100.jpg"); */
  
  --theme-ddlbcolor-text: white;
  --theme-ddlbcolor-accent: var(--darkfire);
  
  /*** MISC GLOBAL STYLE ***/
  
  /* box-shadow Values ***/
  /* Shadow Styles */
  --thin-shadow: 3px 3px 4px rgba(0, 0, 0, 0.3);
  --medium-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
  --thinly-spread-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  --mediumly-spread-shadow: 0 12px 24px 0 rgba(0, 0, 0, 0.6), 0 18px 60px 0 rgba(0, 0, 0, 0.40);
  
  --thin-inset: inset 2px 2px 4px 1px rgba(0, 0, 0, 0.2); /* Seems .3 transparency is minimum for clear shadow. 
																					  Border values may affect "inset" shadow. 3rd border for eg 
																					  can set whether shadow is thin broad or solid narrow */
  /* Glow Styles */
  /* thin glow  colors*/
  --glow-gcolor1-t: rgba(0, 210, 10, 0.5);    
  --glow-gcolor2-t: rgba(0, 260, 20, 0.2);
  --glow-gcolor3-t: rgba(0, 220, 215, 0.1);
  
  /* medium glow */
  --glow-gcolor1-m: rgba(0, 210, 10, 0.4);    
  --glow-gcolor2-m: rgba(0, 260, 20, 0.2);    
  --glow-gcolor3-m: rgba(0, 220, 215, 0.2);
  
  --medium-glow-g: 0 0 0px 2px var(--glow-gcolor1-m), /* inner color */
                0 0 6px 6px var(--glow-gcolor2-m), /* middle */
                0 0 14px 9px var(--glow-gcolor3-m); /* outer */  

  --thin-glow-g:  0 0 0px 1px var(--glow-gcolor1-t), /* inner color */
                0 0 2px 4px var(--glow-gcolor2-t), /* middle */
                0 0 2px 7px var(--glow-gcolor3-t); /* outer color */
  
  /* Border Corner Styles */
  --thin-roundedcorner: 5px;
  
  /* Ad hoc */
  --fxTransDelay: 1s;
  --fxEndOpacity: 12%;
  --fxEndBlur: 1px;
  --fxEndSaturation: 5%;
  
  /* Page thumbnail */
  --page-thumbnl-w: 1227px; /* orig: 1440px */
  --page-thumbnl-h: 900px;
  --page-thumbnl-zm: 0.25;
  
} /* root end */

/****************************************************
* END of ROOT
*****************************************************/

.mh-99, .h-99 {height: 99% !important}
.mh-98, .h-98 {height: 98% !important}
.mh-97, .h-97 {height: 97% !important}
.mh-96-5, .h-96-5 {height: 96.5% !important}

.h-95 {height: 95% !important}
.h-90 {height: 90% !important}
.h-85 {height: 85% !important}
.h-80 {height: 80% !important}
.h-33 {height: 33%  !important}

.vh-95 {height: 95vh !important}
.vh-90 {height: 90vh !important}
.vh-80 {height: 80vh !important}
.vh-50 {height: 50vh !important}

.w-95 {width: 95%  !important}
.w-90 {width: 90%  !important}
.w-85 {width: 85% !important}
.w-80 {width: 80% !important}
.w-33 {width: 33% !important}

.vw-95 {width: 95vw !important}
.vw-90 {width: 90vw !important}
.vw-80 {width: 80vw !important}
.vw-50 {width: 50vw !important}

.hidden {visibility: hidden}

.do-nothing {
}

.boxshadow {
box-shadow: 4px 3px 5px rgba(0, 0, 0, 0.3); 
}

.boxsimple {
border: 1px solid rgb(200, 200, 200);
}

.bg_reddotwave {
background-image: url("/assets/img/bg_bgreenofficeglass.jpg"); 
background-position: center; /* Center the image */
background-repeat: no-repeat; 
background-size: cover; /* Resize the background image to cover the entire container */
}

.bg_plain {
background-image: repeating-linear-gradient(rgb(220, 220, 220), rgb(240, 240, 240), rgb(255, 255, 255))
}

.blur-backd-sty10 {
backdrop-filter: url(commonfilters.svg#filter);
/* <filter-function> values */
backdrop-filter: blur(10px);
backdrop-filter: brightness(60%);
backdrop-filter: contrast(40%);
backdrop-filter: drop-shadow(4px 4px 10px blue);
backdrop-filter: grayscale(30%);
backdrop-filter: hue-rotate(120deg);
backdrop-filter: invert(70%);
backdrop-filter: opacity(20%);
backdrop-filter: sepia(90%);
backdrop-filter: saturate(80%);
}

.blur-background {
filter:blur(10px);
/*-o-filter:blur(var(--blur-value));
-ms-filter:blur(var(--blur-value));*/
-moz-filter:blur(10px);
/*-webkit-filter:blur(var(--blur-value));  */
}

.shadow-thin-inset {
box-shadow: inset 2px 2px 4px 1px rgba(0, 0, 0, 0.2);
}

.shadow-thinner-inset {
box-shadow: inset 1px 1px 2px 1px rgba(0, 0, 0, 0.3);
}

.shadow-thin {
  box-shadow: var(--thin-shadow) !important;
}

.shadow-medium {
  box-shadow: var(--medium-shadow) !important;
}

.shadow-thinly-spread { 
  box-shadow: var(--thinly-spread-shadow) !important;
}

.shadow-mediumly-spread {
  box-shadow: var(--mediumly-spread-shadow) !important;
}

.theme-ahoc-gradient-modern-1 {
    /*
    background: #94c4fe;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(31%,#94c4fe), color-stop(100%,#d3f6fe));
    background: -webkit-linear-gradient(top,  #94c4fe 31%,#d3f6fe 100%);
    background: -moz-linear-gradient(top,  #94c4fe 31%, #d3f6fe 100%);
    background: -o-linear-gradient(top,  #94c4fe 31%,#d3f6fe 100%);
    background: -ms-linear-gradient(top,  #94c4fe 31%,#d3f6fe 100%);
    background: linear-gradient(to bottom,  #94c4fe 31%,#d3f6fe 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#94c4fe', endColorstr='#d3f6fe',GradientType=0 );
    */
    background: rgba(211,211,211, 0.6);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(31%,lightgrey), color-stop(100%,#d3f6fe));
    background: -webkit-radial-gradient(ellipse at top,  lightgrey 31%,#d3f6fe 100%);
    background: -moz-radial-gradient(ellipse at top,  lightgrey 31%, #d3f6fe 100%);
    /*background: -o-radial-gradient(ellipse at top,  lightgrey 31%,#d3f6fe 100%);
    background: -ms-radial-gradient(ellipse at top,  lightgrey 31%,#d3f6fe 100%);*/
    background: radial-gradient(ellipse at top,  rgba(211,211,211, 0.4) 31%, rgba(176,224,230, 0.9) 100%), 
                radial-gradient(closest-corner at 50% 94%, rgba(0, 120, 130, .8) 20%, rgba(0, 176, 176, 0));
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='lightgrey', endColorstr='#d3f6fe',GradientType=0 );*/
    
}

.theme-ahoc-gradient-modern-2 {
    background: #54bc3e;
    background: -moz-linear-gradient(top,  #54bc3e 0%, #aee850 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#54bc3e), color-stop(100%,#aee850));
    background: -webkit-linear-gradient(top,  #54bc3e 0%,#aee850 100%);
    background: -o-linear-gradient(top,  #54bc3e 0%,#aee850 100%);
    /*background: -ms-linear-gradient(top,  #54bc3e 0%,#aee850 100%);*/
    background: linear-gradient(to bottom,  #54bc3e 0%,#aee850 100%);
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#54bc3e', endColorstr='#aee850',GradientType=0 );*/
    border: 1px solid #1d6511;
}

.ahilite {
    color: brown!important;
    display: inline-block;
    padding: 3px 10px; 
    margin: 2px 1px;
    border-radius: 12px;
    font-size: 13px; width: auto;
    background: linear-gradient(340deg, rgba(240,6,10, 0.4), rgba(250,245,18, 0.7), rgba(255,250,18, 0.7));
}
.ahilite:hover {
    color: black;
    text-decoration: none;
    background: linear-gradient(300deg, rgba(240,6,10, .9), rgba(250,245,18, .8), rgba(250,245,18, .9));
}    

/*** START OVERRIDDING STYLES for DESKTOP DISPLAY ***/
/* From bootstrap */
.dropdown-menu.dropshdow {
/* broad >  box-shadow: 8px 12px 10px 10px rgba(100, 100, 100, 0.5); */
box-shadow: 4px 5px 5px rgba(100, 100, 100, 0.5); 
}

.nav-wrapper {
z-index:100; box-shadow: 3px 2px 4px rgba(0, 0, 0, 0.3);
}

.fixed-dim /* elements stick to their assigned width and height */ {
box-sizing: border-box;
}

.fill-style-shade1 {
background:/*#e6e6e6;*/ aliceblue;
background:-moz-linear-gradient(left,#e6e6e6 0,#f1f1f1 50%,#e6e6e6 99%);
background:-webkit-gradient(linear,left top,right top,color-stop(0%,#e6e6e6),color-stop(50%,#f1f1f1),color-stop(99%,#e6e6e6));
background:-webkit-linear-gradient(left,#e6e6e6 0,#f1f1f1 50%,#e6e6e6 99%);
background:-o-linear-gradient(left,#e6e6e6 0,#f1f1f1 50%,#e6e6e6 99%);
/*ackground:-ms-linear-gradient(left,#e6e6e6 0,#f1f1f1 50%,#e6e6e6 99%);*/
background:linear-gradient(to right,#e6e6e6 0,#f1f1f1 50%,#e6e6e6 99%);
/*filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e6e6e6',endColorstr='#e6e6e6',GradientType=1)*/
}

input.no-spin[type=number]::-webkit-inner-spin-button, 
input.no-spin[type=number]::-webkit-outer-spin-button { 
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
margin: 0; 
}

.small-font {
    font-size: 0.3pt;
}


/****************************************************
* START of BUTTON STYLES
*****************************************************/

/* Start btn base class */
.btn.style10 {
position: relative;
display: inline-block;
border-radius: 3px;
box-shadow: 0px 1px 4px -2px #333;
color: white;
text-shadow: 0px 0px 5px black; /*0px -1px #333;*/
transition: .2s;
}

.btn.style10::after {
content: '';
position: absolute;
top: 2px;
left: 2px;
width: calc(100% - 4px);
height: 50%;
}

.btn.style10:hover {
/* TODO */
}
/* End btn base class */

/* Start Skin Flat */
.skin-flat {
border: 1px solid #00f0f0;
border-radius: 5px;
text-shadow: none;

background: var(--theme-color-40brt, #00c0c0);
background-image: 
    radial-gradient(closest-corner at 50% 3%, rgba(0,245,245, .8) 17%, rgba(255,255,255, 0)), 
    radial-gradient(closest-corner at 50% 99%, rgba(0,245,245, .8) 17%, rgba(255,255,255, 0))
}

.skin-flat::after {
/* TODO */
}

.skin-flat:hover {
border: 1px solid white;
background: var(--theme-color-40sbrtr, #00c0c0);
background-image: 
    /*radial-gradient(closest-corner at 50% 4%, rgba(0,255,150, .8) 17%, rgba(255,255,255, 0)),*/
    radial-gradient(closest-corner at 50% 95%, rgba(0,255,150, .8) 17%, rgba(255,255,255, 0));
box-shadow: 0px 0.5px 4px 1px rgba(10,10,10, 0.2);
}
/* End Skin Flat */

/* Start Skin Glass for buttons*/
.classic-skin-glass {
background-color: var(--theme-color-40, rgb(0,176,176));
background-image: radial-gradient(closest-corner at 50% 94%, rgba(0,235,235, .8) 20%, rgba(255,255,255, 0)), 
    linear-gradient(var(--theme-color-40Dacc1, rgb(0,176,176)), var(--theme-color-40Dacc2, aqua));
}

.classic-skin-glass::after {
background: linear-gradient(rgba(255,255,255, 0.8), rgba(255,255,255, 0.2));
}

.classic-skin-glass:hover {
background: /*radial-gradient(closest-corner at 50% 92%, rgba(255,255,0, .6) 40%, rgba(255,255,0, .3) 20%, rgba(255,255,255, 0))*/
            radial-gradient(closest-corner at 50% 95%, rgba(0,255,0, .6) 20%, rgba(255,255,255, 0)),
            linear-gradient(var(--theme-color-40Hacc1, #073), var(--theme-color-40Hacc2, #0fa));
box-shadow: 0 3px 9px 1px rgba(66, 140, 240, 0.8);
}
/* End Skin Glass for buttons */

/* Start Skin 1G */
.skin-1g {
background-color: rgba(60, 132, 198, 0.8);
background-image: -webkit-gradient(linear, 0% 0%, 0% 90%, from(rgba(28, 91, 155, 0.8)), to(rgba(108, 191, 255, .9)));
border-top-color: #8ba2c1;
border-right-color: #5890bf;
border-bottom-color: #4f93ca;
border-left-color: #768fa5;
-webkit-box-shadow: rgba(66, 140, 240, 0.5) 0px 10px 16px;
-moz-box-shadow: rgba(66, 140, 240, 0.5) 0px 10px 16px; /* FF 3.5+ */
}
.skin-1g::after {
position: absolute;
top: 0;
left: 5px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
height: 2px;
width: 262px;
padding: 12px 0;
background-color: rgba(255, 255, 255, 0.22);
background-image: -webkit-gradient(linear, 0% 0%, 0% 95%, from(rgba(255, 255, 255, 0.6)), to(rgba(255, 255, 255, 0)));
}
/* End Skin 1G */

/* Start Skin 1R */
.skin-1r {
background-image: 
    radial-gradient(closest-corner at 50% 8%, rgba(0, 210, 240, .8) 20%, rgba(0, 176, 176, 0)), 
    radial-gradient(closest-corner at 50% 84%, rgba(0, 230, 120, .6), rgba(0, 176, 176, 0)), 
    radial-gradient(closest-corner at 50% 93%, rgba(0, 120, 130, .8) 20%, rgba(0, 176, 176, 0)); 
/*background-color:#00b0b0;
background-image:-moz-linear-gradient(top,#00ddb0,#00b0b0);
background-image:-webkit-gradient(radial,0 0,0 100%,from(#00ddb0),to(#00b0b0));
background-image:-webkit-radial-gradient(ellipse at top,#00ddb0,#00b0b0);
background-image:-o-radial-gradient(ellipse at top,#00ddb0,#00b0b0);*/
}

.skin-1r:hover {
background-image:
    radial-gradient(closest-corner at 50% 10%, rgba(0, 230, 250, .85) 20%, rgba(0, 176, 176, 0)), 
    /*radial-gradient(closest-corner at 50% 86%, rgba(0, 240, 200, .7) 1%, rgba(0, 176, 176, 0)), */
    radial-gradient(closest-corner at 50% 91%, rgba(0, 210, 230, .85) 20%, rgba(0, 176, 176, 0)); 

background-color: rgba(0, 168, 170, .9); /* Has effects due to transparency in background-image */
background-position: 0; /* Overrides style.css */
transition: background-image .1s linear;
/*background-color:#ffafaf;
background-image:-moz-linear-gradient(bottom,##ffafaf,#ffddb0);
background-image:-webkit-gradient(radial,0 0,0 100%,from(##ffafaf),to(#00b0b0));
background-image:-webkit-radial-gradient(ellipse at bottom,##ffafaf,#00b0b0);
background-image:-o-radial-gradient(ellipse at bottom,##ffafaf,#00b0b0);
background-image:radial-gradient(ellipse at bottom,##ffafaf,#00b0b0);*/

/*background-color:#00b0b0;
-webkit-transition:background-image .1s linear;
-moz-transition:background-image .1s linear;
-o-transition:background-image .1s linear;
transition:background-image .1s linear;*/
} 

/* End Skin 1R */

/****************************************************
* END of BUTTON STYLES 
*****************************************************/


.tab-content {
height: 230px;
}

@media(max-width:1360px) {
/*.wrapper {width: 1230px;}*/
} /* End of @media(max-width:1360px)*/

@media(max-width:1280px) {
/*.wrapper {width: 900px;}*/
} /* End of @media(max-width:1280px) */


table.menu-tblsty1 td:hover {
background-color: #4DD0E1;
}

.dropdown-menu.bluegreen { 
    background-image: linear-gradient(to bottom,#00BFBF,#00629F);
    /*ORIG: background-image: linear-gradient(to bottom,#00B0B0,#005454);*/
    /* REM background-color: #0675b5; var(--theme-color-40)  */
    /*background-image: -moz-linear-gradient(top,var(--theme-color-40Dacc1),var(--theme-color-40Dacc2));
    background-image: -webkit-gradient(linear,0 0,0 100%,from(var(--theme-color-40Dacc1)),to(var(--theme-color-40Dacc2)));
    background-image: -webkit-linear-gradient(top,var(--theme-color-40Dacc1),var(--theme-color-40Dacc2));
    background-image: -o-linear-gradient(top,var(--theme-color-40Dacc1),var(--theme-color-40Dacc2));
    background-image: linear-gradient(to bottom,var(--theme-color-40Dacc1),var(--theme-color-40Dacc2));
    background-repeat: repeat-x;*/
    /* TODO: Replace colors with variable */
    /*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff9794,endColorstr=#ff9794,GradientType=0);*/
    color: #f2f2f2;
}


/****************************************************
* START Page Preview Thumbnail 
*****************************************************/

/* This places the container below in a relative position despite the absolute declaration */
.page-thumbnl-placer {
  position: absolute; 
  display: inline-block;
  visibility: hidden;
  z-index: 200;
}

/* This container helps the page-thumbnl behave as if it were an unscaled IMG element */
.page-thumbnl-container {
  width: calc(var(--page-thumbnl-w) * var(--page-thumbnl-zm));
  height: calc(var(--page-thumbnl-h) * var(--page-thumbnl-zm));
  display: inline-block;
  overflow: hidden;
  
  position: absolute; /* absolute orig: relative;*/
  background: #f9f9f9;
  
  /* Added by royv */
  top: -100px; 
  left: 20px; /* Places image right beside the link */
  
  border: 1px solid gainsboro;
  border-radius: 5px;
  box-shadow: 0 0 15px 4px rgba(180,180,180, 0.4);
}

/* Image Icon for the Background */
.page-thumbnl-container::before {
  position: absolute;
  left: calc(50% - 16px);
  top: calc(50% - 18px);
  opacity: 0.2;
  display: block;
  
  transform: scale(2);
  
  content: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMyIDMyIiBoZWlnaHQ9IjMycHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMycHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxnIGlkPSJwaG90b18xXyI+PHBhdGggZD0iTTI3LDBINUMyLjc5MSwwLDEsMS43OTEsMSw0djI0YzAsMi4yMDksMS43OTEsNCw0LDRoMjJjMi4yMDksMCw0LTEuNzkxLDQtNFY0QzMxLDEuNzkxLDI5LjIwOSwwLDI3LDB6ICAgIE0yOSwyOGMwLDEuMTAyLTAuODk4LDItMiwySDVjLTEuMTAzLDAtMi0wLjg5OC0yLTJWNGMwLTEuMTAzLDAuODk3LTIsMi0yaDIyYzEuMTAyLDAsMiwwLjg5NywyLDJWMjh6IiBmaWxsPSIjMzMzMzMzIi8+PHBhdGggZD0iTTI2LDRINkM1LjQ0Nyw0LDUsNC40NDcsNSw1djE4YzAsMC41NTMsMC40NDcsMSwxLDFoMjBjMC41NTMsMCwxLTAuNDQ3LDEtMVY1QzI3LDQuNDQ3LDI2LjU1Myw0LDI2LDR6ICAgIE0yNiw1djEzLjg2OWwtMy4yNS0zLjUzQzIyLjU1OSwxNS4xMjMsMjIuMjg3LDE1LDIyLDE1cy0wLjU2MSwwLjEyMy0wLjc1LDAuMzM5bC0yLjYwNCwyLjk1bC03Ljg5Ni04Ljk1ICAgQzEwLjU2LDkuMTIzLDEwLjI4Nyw5LDEwLDlTOS40NCw5LjEyMyw5LjI1LDkuMzM5TDYsMTMuMDg3VjVIMjZ6IE02LDE0LjZsNC00LjZsOC4wNjYsOS4xNDNsMC41OCwwLjY1OEwyMS40MDgsMjNINlYxNC42eiAgICBNMjIuNzQsMjNsLTMuNDI4LTMuOTU1TDIyLDE2bDQsNC4zNzlWMjNIMjIuNzR6IiBmaWxsPSIjMzMzMzMzIi8+PHBhdGggZD0iTTIwLDEzYzEuNjU2LDAsMy0xLjM0MywzLTNzLTEuMzQ0LTMtMy0zYy0xLjY1OCwwLTMsMS4zNDMtMywzUzE4LjM0MiwxMywyMCwxM3ogTTIwLDhjMS4xMDIsMCwyLDAuODk3LDIsMiAgIHMtMC44OTgsMi0yLDJjLTEuMTA0LDAtMi0wLjg5Ny0yLTJTMTguODk2LDgsMjAsOHoiIGZpbGw9IiMzMzMzMzMiLz48L2c+PC9zdmc+");
}

/* This is a masking container for the zoomed iframe element */
.page-thumbnl {
  -webkit-transform: scale(var(--page-thumbnl-zm));    
  -ms-transform: var(--page-thumbnl-zm);
  -moz-transform: scale(var(--page-thumbnl-zm));
  -o-transform: scale(var(--page-thumbnl-zm));
  transform: scale(var(--page-thumbnl-zm));
  
  -webkit-transform-origin: 0 0;
  -ms-transform-origin: 0 0;  
  -o-transform-origin: 0 0;
  -moz-transform-origin: 0 0;  
  transform-origin: 0 0;
}

/* This is our screen sizing */
.page-thumbnl, .page-thumbnl iframe {
  width: var(--page-thumbnl-w);
  height: var(--page-thumbnl-h);
}

/* This facilitates the fade-in transition instead of flicker. It also helps us maintain the illusion that this is an image, since some webpages will have a preloading animation or wait for some images to download */
.page-thumbnl iframe {
  opacity: 0;
  transition: opacity 400ms ease-in-out; 
}

/* This pseudo element masks the iframe, so that mouse wheel scrolling and clicking do not affect the simulated "screenshot" */
.page-thumbnl::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

a:hover +.page-thumbnl-placer {
  visibility: visible;
}

/****************************************************
* END of Page Preview Thumbnail 
*****************************************************/


/****************************************************
* START CAROUSEL Bootstrap Overrides
*****************************************************/
.carousel-caption
{
position: relative;
left: 0;
width: 100%;
height: 40px;
top: 30px;
line-height: 40px; /* align vertically */ 
font-family: "Open Sans"; 
font-size: 1.2rem;
font-weight: bold;
color: black;
/*bottom: 0px;*/
padding: 0;
background-color: rgba(173,216,230, 0.6);
}

.carousel-inner {background-image: url('/assets/img/bg_craftpaperb.jpg');}
.carousel-control-next, .carousel-control-prev
{
color: rgb(176, 0, 0);
top: 250px; 
background-color: rgba(5, 176, 176, 0.6); 
border-radius: 10px;
width: 80px;
box-shadow: var(--thin-shadow);
}
.carousel-control-prev {left: 30px}

.carousel-control-next {right: 30px}

.carousel-item {top: 10px; opacity: 0;}
.carousel-item img {height:86%; box-shadow: var(--medium-spread)}
.carousel-indicators {flex-wrap: wrap; margin: 0; padding-top: 7px; padding-bottom: 3px;}
.carousel-indicators li {opacity: 1; margin: 5px; border: 0;}
.carousel-indicators img {vertical-align: middle;}
.carousel-indicators .active {z-index: 5}
.carousel-indicators .active div {border: 0px; border-radius: 4px; box-shadow: var(--medium-glow); padding: 0; margin: 0;}  

/****************************************************
* END of CAROUSEL 
*****************************************************/


/****************************************************
* START CUSTOM STYLES for SMALL DISPLAY 
*****************************************************/
@media(max-width:979px) {
    
.h1 {
font-size: 1.8em;
}

} /* End of @media(max-width:979px)
/****************************************************
END OF CUSTOM STYLES for SMALL DISPLAY 
*****************************************************/

/*** END OVERRIDDING STYLES for DESKTOP DISPLAY ***/




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

.card-header-slim {
padding-top: 8px;
 padding-bottom: 8px;
}

img.news-thumbnail1 {
width: 45vw;
height: auto; 
}
img.news-thumbnail2 {
width: 25vw;
height: auto; 
}
img.news-thumbnail1 {
width: 15vw;
height: auto; 
}


/****************************************************
* START Overriding CSS 
*****************************************************/
a[target].hideline {
text-decoration: none !important;
}

a[target].black {
color: black;
}

.font-color-reset {
/*color: reset;*/
}

.font-color-white {
color: white;
}

.font-weight-ubold {
font-weight: 600;
}

.font-weight-usemibold {
font-weight: 400;
}

.font-weight-unormal {
font-weight: 200;
}

.font-remsize1-01 {
font-size: 1.01rem;
}

.font-remsize0-99 {
font-size: 0.99rem;
}

.font-remsize0-8 {
font-size: 0.8rem;
}

/****************************************************
* END Overriding CSS 
*****************************************************/


/****************************************************
* START Common Chart Styles
*****************************************************/
.chart-bg-semiopaque {
    background: linear-gradient(45deg, rgb(184, 232, 254, 0.90), rgba(255, 255, 255, 0.95), rgba(184, 253, 243, 0.90));
    border-radius: 7px; border-style: solid; border-width: 5px; border-color: rgba(197, 232, 255, 0.5);
}
.chart-bg-square { border-radius: 0px }

/****************************************************
* END Common Chart Styles
*****************************************************/
/****************************************************
* START Apex Charts
*****************************************************/
/**** START override Apex Chart css ****/
.apexcharts-tooltip {
    top: 3% !important;
    position: absolute;
    z-index: 10;
    overflow: hidden;
    /*background: transparent !important; background: inherit !important;*/
    background: linear-gradient(to left, rgba(0, 242, 96, 0.2), rgba(5, 117, 230,0.4)) !important; padding: 10px;
    /*text-align: center;
      width: 49.5px;
      height: 15px;
      border: none !important;
      box-shadow: none !important;
      font-family: Helvetica, Arial, sans-serif;
      font-size: 12px;
      color: #007BD8;*/
}

/*.apexcharts-tooltip::before {
	content: "";
	background-color: rgba(22, 127, 180, 0.4);
	
	width: 230px; 
	height: 50px;
	top: -40px; 
	left: -40px;
	bottom: 0;
	right: 0;
	filter:blur(10px);
	
	background: inherit; This cancels out background-color: 
	background: inherit !important; 
	filter:blur(10px);
}*/
/**** END override Apex Chart css ****/

.apexcharts-tooltip-container-sty1 {
	/*position: absolute;*/
}

.apexcharts-tooltip-title-sty1 {
	font: 0.9em Sego UI; color: var(--steelgrey);
}

.apexcharts-tooltip-highlight-sty1 {
	font: bold 1rem Roboto; color: var(--charlestongreen);
}

.apexcharts-tooltip-normal-sty1 {
	font: 0.8em Sego UI; color: var(--steelgrey);
}

/*.body {background-color: lightblue}*/

/****************************************************
* END Apex Charts
*****************************************************/


/****************************************************
* START Login Style 1
*****************************************************/

.classic-glasspanel
{
/* Previously card class, should inherit some properties from bootstrap 4  card class*/
/*width: 400px;    
height: 370px;*/
position: relative;
margin-top: auto;
margin-bottom: auto;
overflow: hidden;
/*background-color: rgba(0,0,0,0.5) !important;*/
background: inherit;
}

.classic-glasspanel::before
{
position: absolute;
content: "";
/*width: 480px;  Make it bigger so blurred borders won't be visible 
height: 450px; */
top: -40px; 
left: -40px;
bottom: -40px;
right: -40px;
background: inherit; 
box-shadow: inset 0 0 50px 300px rgba(0,0,0,0.5);
filter: blur(10px);
}

.classic-glasspanel-header {position: absolute; width: 100%;}
.classic-glasspanel-body {position: absolute; width: 100%; top: 100px;}
.classic-glasspanel-footer {position: absolute; width: 100%; top: 300px;}
.classic-glasspanel-feedback {position: absolute; width: 100%; height: 20px; padding: 10px 20px; top: 75px; font-size: .9em; color: var(--theme-color-40); }

.social_icon
{
position: absolute;
overflow: visible;
right: 20px;
top: 5px; /* orig: -45px; */
}

.social_icon span
{
font-size: 60px;
margin-left: 10px;
color: var(--theme-color-20);
}

.social_icon span:hover
{
color: var(--theme-color-complement);
cursor: pointer;
}

.card-header h3
{
color: var(--theme-color-lite);
}

.input-group-prepend span
{
width: 50px;
background-color: var(--theme-color-20);
color: black;
border:0 !important;
}

input:focus
{
outline: 0 0 0 0  !important;
box-shadow: 0 0 0 0 !important;
}

.remember
{
color: white;
}

.remember input
{
width: 20px;
height: 20px;
margin-left: 15px;
margin-right: 5px;
}

.login_btn
{
color: black;
background-color: var(--theme-color-20);
width: 100px;
}

.login_btn:hover
{
color: black;
background-color: var(--theme-color-complement);
}

/****************************************************
* END Login Style 1
*****************************************************/


/****************************************************
* Custom Scrollbars
*****************************************************/

/* scrollbarstyle1 */

#scrollbarstyle1::-webkit-scrollbar-track
{
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
  border-radius: 10px;
  background-color: #F5F5F5;
}

#scrollbarstyle1::-webkit-scrollbar
{
  width: 12px;
  background-color: #F5F5F5;
}

#scrollbarstyle1::-webkit-scrollbar-thumb
{
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
  background-color: #D62929;
}
/****************************************************
* END Custom Scrollbars
*****************************************************/


/****************************************************
 START Misc Component styles
*****************************************************/
.dict-partofspeech 
{
	color: #781c00
}

/****************************************************
 END Misc Component styles
*****************************************************/