/*************************
    Style Button 22-03-18 MdJ
 *************************/
.q4_button {
   border: 0px solid #0a3c59;
   background: #3e779d;
   background: -webkit-gradient(linear, left top, left bottom, from(#65a9d7), to(#3e779d));
   background: -webkit-linear-gradient(top, #65a9d7, #3e779d);
   background: -moz-linear-gradient(top, #65a9d7, #3e779d);
   background: -ms-linear-gradient(top, #65a9d7, #3e779d);
   background: -o-linear-gradient(top, #65a9d7, #3e779d);
   background-image: -ms-linear-gradient(top, #65a9d7 0%, #3e779d 100%);
   padding: 4px 30px;
   -webkit-border-radius: 6px;
   -moz-border-radius: 6px;
   border-radius: 6px;
   -webkit-box-shadow: rgba(255,255,255,0.4) 0 0px 0, inset rgba(255,255,255,0.4) 0 0px 0;
   -moz-box-shadow: rgba(255,255,255,0.4) 0 0px 0, inset rgba(255,255,255,0.4) 0 0px 0;
   box-shadow: rgba(255,255,255,0.4) 0 0px 0, inset rgba(255,255,255,0.4) 0 0px 0;
   text-shadow: #7ea4bd 0 1px 0;
   color: #06426c;
   font-size: 10px;
   font-family: helvetica, serif;
   text-decoration: none;
   vertical-align: middle;
   white-space: nowrap;
   text-transform: lowercase;
/*   width: 140px; */
/*   display: inline-block; */
}
.q4_button:hover {
   border: 0px solid #0a3c59;
   text-shadow: #1e4158 0 1px 0;
   background: #3e779d;
   background: -webkit-gradient(linear, left top, left bottom, from(#65a9d7), to(#3e779d));
   background: -webkit-linear-gradient(top, #65a9d7, #3e779d);
   background: -moz-linear-gradient(top, #65a9d7, #3e779d);
   background: -ms-linear-gradient(top, #65a9d7, #3e779d);
   background: -o-linear-gradient(top, #65a9d7, #3e779d);
   background-image: -ms-linear-gradient(top, #65a9d7 0%, #3e779d 100%);
   color: #fff;
}
.q4_button:active {
   text-shadow: #1e4158 0 1px 0;
   border: 0px solid #0a3c59;
   background: #65a9d7;
   background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#3e779d));
   background: -webkit-linear-gradient(top, #3e779d, #65a9d7);
   background: -moz-linear-gradient(top, #3e779d, #65a9d7);
   background: -ms-linear-gradient(top, #3e779d, #65a9d7);
   background: -o-linear-gradient(top, #3e779d, #65a9d7);
   background-image: -ms-linear-gradient(top, #3e779d 0%, #65a9d7 100%);
   color: #fff;
}

.q4_button_position {
   position: relative;
   text-align: center;
   color: white;
}

.q4_button:first-letter {
   text-transform: uppercase;
}

.q3_button_green {
   background-color: #4CAF50; /* Green */
   border: none;
   color: white;
   padding: 15px 32px;
   text-align: center;
   text-decoration: none;
   display: inline-block;
   font-size: 16px;
   text-transform: lowercase;
}

/*.button_green::first-letter {*/
   /*text-transform: uppercase;*/
/*}*/

.centered {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}

.no_border {
   border: 0;
}

​.no_border > tr > td {
   border: 0;
}

/* CHANGE IN NEXUS.CCS line 3275 */

.nav-pills > .active > a,
.nav-pills > .active > a:hover,

.nav-pills > .active > a:focus {
       color: #0c9bed;
       background-color: #ffffff;
}

/* DISPLAY CONTAINER FOOTER NONE */
#container_footermenu {
      display: none ;
   }
#footer-1, #footer-2 {
      float: none;
   }

.highlighter-admin { transition: all 0.2s ease-in-out; }

.highlighter-admin:hover{
   background-color: mediumseagreen;
   color: white;
}

.highlighter { transition: all 0.2s ease-in-out; }

.highlighter:hover{
   background-color: lightskyblue;
   color: white;
}

.q4_button_position {
    position: relative;
    text-align: center;
 }

.q4_button_position_left {
   position: relative;
   text-align: left;
   color: white;
}

.q4_button_position_right {
   position: relative;
   text-align: right;
   color: white;
}

.centered {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}

.alignleft {
   float: left;
}

.alignright {
   float: right;
}

.column {
   float: left;
   width: 25%;
   padding: 30px;
   height: 60px;
}

.row:after {
   content: "";
   display: table;
   clear: both;
}

.input[type="text"].small {
   width: 20px;
}

/* ++bootstap-tab.js*/

/* MdJ 15MAR23 changed margins */
html{
   margin: 0px 0px auto ;
/*   margin: 20px 10px auto; */
/*   font-family: arial,sans-serif;*/
}
.nav:after,
.nav:before {
   content:"";
   display: table;
}
.nav:after {
   clear:both;
   overflow:hidden;
}
.nav {
   zoom: 1;
   margin-left: 20px;
}
.nav li {
   list-style: none outside none;
   float: left;
   position: relative;

}
.nav .active {
   z-index: 3;
}
.nav li:before,
.nav li:after,
.nav  a:before,
.nav  a:after {
   content:"";
   position: absolute;
   bottom:0;
   color: black ;

}
/*
.nav li:before,
.nav li:after {
   background: #0c9bed;
   width: 10px;
   height: 10px;
}
.nav li:before {
   left: -10px;
}
.nav li:after {
   right: -10px;
}
*/
.nav a {
   float: left;
   padding: 10px 40px;
   text-decoration: none;
   color: blue;
   background: dodgerblue;
   border-radius: 10px 10px 0 0;
}

.nav .active a {
   background: blue;
   color:dodgerblue;
}

/*.nav  a:before,
.nav  a:after {
   width: 20px;
   height: 20px;
   border-radius: 10px;
   background: dodgerblue;
   z-index: 2;
}
*/
.nav .active a:before,
.nav .active a:after {
   background: #0c9bed;
}
.nav  a:before {
   left:-20px;
}
.nav  a:after {
   right: -20px;
}

.nav .active:before,
.nav .active:after {
   z-index: 1;
   background: dodgerblue;
}

.nav li:first-child a:before,
.nav li:last-child a:after {
   background-color: dodgerblue;
}

.nav:after,
.nav:before {
   content:"";
   display: table;
}
.nav:after {
   clear:both;
   overflow:hidden;
}
.nav {
   zoom: 1;
   margin-left: 20px;
}
.nav li {
   list-style: none outside none;
   float: left;
   position: relative;

}
.nav .active {
   z-index: 3;
}
.nav li:before,
.nav li:after,
.nav  a:before,
.nav  a:after {
   content:"";
   position: absolute;
   bottom:0;
   color: black ;

}
/*
.nav li:before,
.nav li:after {
   background: #0c9bed;
   width: 10px;
   height: 10px;
}
.nav li:before {
   left: -10px;
}
.nav li:after {
   right: -10px;
}
*/
.nav a {
   float: left;
   padding: 10px 40px;
   text-decoration: none;
   color: blue;
   background: dodgerblue;
   border-radius: 10px 10px 0 0;
}

.nav .active a {
   background: blue;
   color:dodgerblue;
}

/*.nav  a:before,
.nav  a:after {
   width: 20px;
   height: 20px;
   border-radius: 10px;
   background: dodgerblue;
   z-index: 2;
}
*/
.nav .active a:before,
.nav .active a:after {
   background: #0c9bed;
}
.nav  a:before {
   left:-20px;
}
.nav  a:after {
   right: -20px;
}

.nav .active:before,
.nav .active:after {
   z-index: 1;
   background: dodgerblue;
}

.nav li:first-child a:before,
.nav li:last-child a:after {
   background-color: dodgerblue;
}

.nav-admin:after,
.nav-admin:before {
      content:"";
      display: table;
   }
.nav-admin:after {
   clear:both;
   overflow:hidden;
}
.nav-admin {
   zoom: 1;
   margin-left: 20px;
}
.nav-admin li {
   list-style: none outside none;
   float: left;
   position: relative;

}
.nav-admin .active {
   z-index: 3;

}
.nav-admin li:before,
.nav-admin li:after,
.nav-admin  a:before,
.nav-admin  a:after {
   content:"";
   position: absolute;
   bottom:0;
}

.nav-admin a {
   float: left;
   padding: 10px 40px;
   text-decoration: none;
   color: black;
/*   background: mediumseagreen; */
   border-radius: 10px 10px 0 0;
}

.nav-admin .active a {
/*   background: seagreen;
   color:mediumseagreen; */
   color: black;
}

.nav-admin .active a:before,
.nav-admin .active a:after {
   background: #129182;
   color: black;
}
.nav-admin  a:before {
   left:-20px;
}
.nav-admin  a:after {
   right: -20px;
}

.nav-admin .active:before,
.nav-admin .active:after {
   z-index: 1;
   background: #129182;
   color: black;
}

.nav-admin li:first-child a:before,
.nav-admin li:last-child a:after {
   background-color: #129182;
}

.tab-content {
   background: #0c9bed;
   color:dodgerblue;
   padding: 20px;
}

.tab-content-admin {
   background: #129182;
   color:mediumseagreen;
   padding: 20px;
}
.tab-pane {
   display: none;
   color:white;

}
.tab-pane.active {
   display: block;
}

th.rotate {
   /* Something you can count on */
   height: 400px;
   white-space: nowrap;
   text-align:right;
}

th.rotate > div {
   transform:
      /* Magic Numbers */
           translate(25px, 51px)
              /* 45 is really 360 - 45 */
           rotate(270deg);
   width: 30px;
}
th.rotate > div > span {
   border-bottom: 1px solid #ccc;
   padding: 5px 10px;
}

/* Three image containers (use 25% for four, and 50% for two, etc) */
.column {
   float: left;
   width: 50%;
   padding: 5px;
}

.columncanvas {
   float: left;
   width: 20%;
   padding: 5px;
}
/* Clear floats after image containers */
.row::after {
   content: "";
   clear: both;
   display: table;
}

.thin {
   display: inline-block;
   width: 0.2em;
}

textarea {
   width:100% !important;

}

figure {
   position: relative
}
figcaption {
   position: absolute;
   width: 100px;
   line-height: 100px;
   text-align: center;
   left: 0;
   top: 0;
   text-shadow: 0 0 0px white;

}

/* Container needed to position the button. Adjust the width as needed */
.container {
   position: absolute;
   width: 25%;
}

/* Make the image responsive */
.container img {
   width: 25%;
   height: auto;
}

/* Style the button and place it in the middle of the container/image */
.container .q4_btn_img {
   position: absolute;
   top: 10%;
   left: 10%;
   transform: translate(-25%, -25%);
   -ms-transform: translate(-25%, -25%);
   background-color: transparent;
   color: white;
   font-size: 16px;
   padding: 0px 0px;
   border: none;
   cursor: pointer;
   border-radius: 0px;
}

.container .q4_btn_img:hover {
   background-color: transparent;
}

.switch {
   position: relative;
   display: inline-block;
   width: 30px;
   height: 17px;

}

.switch input {display:none;}

label.switch {
   margin-bottom: -3px;
}

td.switch-container {
   line-height: 12px;
}

.slider {
   position: absolute;
   cursor: pointer;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: #ccc;
   -webkit-transition: .4s;
   transition: .4s;
}

.slider:before {
   position: absolute;
   content: "";
   height: 13px;
   width: 13px;
   left: 2px;
   bottom: 2px;
   background-color: white;
   -webkit-transition: .4s;
   transition: .4s;
}

input:checked + .slider {
   background-color: lightgrey;
}

input:focus + .slider {
   box-shadow: 0 0 .5px lightgrey;
}

input:checked + .slider:before {
   -webkit-transform: translateX(13px);
   -ms-transform: translateX(13px);
   transform: translateX(13px);
}

/* Rounded sliders */
.slider.round {
   border-radius: 17px;
}

.slider.round:before {
   border-radius: 50%;
}

.button_green {
   background-color: #4CAF50;
   border: none;
   color: white;
   padding: 4px 32px;
   text-align: center;
   text-decoration: none;
   display: inline-block;
   font-size: 16px;
   margin: 4px 2px;
   cursor: pointer;
   border-radius: 8px;
   outline:none;
   border-color: transparent;
   text-transform: lowercase;
   text-transform: capitalize;
}

.button_green:hover span {
   padding-right: 25px;
}

.button_green span {
   cursor: pointer;
   display: inline-block;
   position: relative;
   transition: 0.5s;
}

.button_green span:after {
   content: '\00bb';
   position: absolute;
   opacity: 0;
   top: 0;
   right: -20px;
   transition: 0.5s;
}
.button_green:hover span:after {
   opacity: 1;
   right: 0;
}

@font-face {
   font-family: 'coffee';
   src: local('coffee+tea-Regular'),url('./fonts/coffee+tea-Regular.ttf') format('truetype');
}

/******************************************
    Style Added after Joomla 4 10-03-23 MdJ
 ******************************************/
.logo.logo-image {
	background-color: #fff;
}

.maincontent {
	display: none ; 
}