/* CSS Document */


* {
    box-sizing: border-box;
}


[class*="col-"] {
    width: 100%;
}



@media only screen and (min-width: 800px) 
{
	.col-_2_5 {width: 2.5%;}
	.col-_5 {width: 5%;}
	.col-1 {width: 10%;}
	.col-2 {width: 20%;}
	.col-2_5 {width: 25%;}
	.col-3 {width: 30%;}
	.col-3_3 {width: 33%;}
	.col-4 {width: 40%;}
	.col-4_5 {width: 45%;}
	.col-5 {width: 50%;}
	.col-6 {width: 60%;}
	.col-7 {width: 70%;}
	.col-7_5 {width: 75%;}
	.col-8 {width: 80%;}
	.col-9 {width: 90%;}
	.col-9_5 {width: 95%;}
	.col-10 {width: 100%;}
}


@media print 
{
    body {
        color: black;
        background: white;
    }
    
    div {
        color: black;
        background: white;
    }
}

[class*="col-"] 
{
    float: left;
    padding: 15px;
}

.row
{
    padding: 10px;
    border-radius:8px;
}

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


html 
{
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}


.static_header_div
{
    position:fixed;
    width:100%;
    z-index:10;
    padding: 0px 0px 0px 0px;
    margin: 0px;
    height:65px;
}


.main_body
{
    color: white; 
    background-repeat: no-repeat; 
    background-size: cover;
    background-attachment: fixed;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    padding:0px; 
    margin:0px;
}



.bg_default {background-image: url('../images/bkgd_default.jpg');}
.bg_j {background-image: url('../images/bkgd_j.jpg');}
.bg_c {background-image: url('../images/bkgd_c.jpg');}
.bg_i {background-image: url('../images/bkgd_i.jpg');}
.bg_tools {background-image: url('../images/bkgd_tools.jpg');}
.bg_dusk {background-image: url('../images/bkgd_dusk.png');}
.bg_dawn {background-image: url('../images/bkgd_dawn.jpg');}
.bg_jfytyos {background-image: url('../images/bkgd_jfytyos.jpg');}
.bg_logo {background-image: url('../images/bkgd_logo.jpg');}
.bg_black {background-color:#303030;}

img
{
	border:0;
}

div
{
    border-radius:8px;
}

.content_div 
{
    width: 90%; 
    max-width: 1680px;
    padding:20px;
    background-color: rgba(0,0,0,0.8);
    z-index:5;
    overflow:hidden;
    margin-right: auto;
    margin-left: auto;
    border-radius:8px;
}

.content_social_div 
{
    width: 90%; 
    max-width: 1680px;
    padding:20px;
    z-index:5;
    overflow:hidden;
    margin-right: auto;
    margin-left: auto;
    border-radius:8px;
}

.small_link_font
{
	font-size:12px; 
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-weight:100; 
	color:white; 
}

.nav_link_font
{
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-weight:100; 
	color:white; 
}

.header_table
{
    height:100%;
    width: 100%;
    background-color:black;
    table-layout:fixed;
}

.button_bar_banner 
{
    width: 100%;
    height: 50px;
}

.button_banner_controls 
{
	text-align: left;
	vertical-align:middle;
	height: 50px;
	width: 30%;
}

.slider
{
	overflow-y: hidden;
	max-height:800px;
	transition: max-height .3s ease-in-out;
}

.slider.closed
{
	max-height: 0px;
}

.grower
{
	font-size: medium;
	transition: font-size .25s ease-in-out;
}

.grower.shrink
{
	font-size: x-large;
}

option {
    background: rgb(0,0,0);
    color: white;
}

.textInput {
    font-weight:bold;
    background-color: rgba(0,0,0,0.0);
    color: white;
    border-top-width:thin;
    border-left-width:thin;
    border-bottom-width: thin;
    border-right-width: thin;
    border-top-color:white;
    border-left-color:white;
    border-bottom-color: white;
    border-right-color: white;
    padding:3px;
}

.selectInput {
    background-color: rgba(0,0,0,0.0);
    font-weight:bold;
    color: white;
    border-top-width:thin;
    border-left-width:thin;
    border-bottom-width: thin;
    border-right-width: thin;
    border-top-color:white;
    border-left-color:white;
    border-bottom-color: white;
    border-right-color: white;
    padding:3px;
    opacity:1.0;
}


.textAreaInput {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    margin:5px 5px 5px 5px;
    width: 90%; 
    height: 50px; 
    background-color: rgba(0,0,0,0.0);
    font-weight:bold;
    color: white;
    border-top-width:thin;
    border-left-width:thin;
    border-bottom-width: thin;
    border-right-width: thin;
    border-top-color:white;
    border-left-color:white;
    border-bottom-color: white;
    border-right-color: white;
    padding:3px;
}

.textAreaInputForum {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    margin:5px 5px 5px 5px;
    font-weight:bold;
    border-top-width:thin;
    border-left-width:thin;
    border-bottom-width: thin;
    border-right-width: thin;
    padding:3px;
}

.buttonN:hover
{
    background-color: rgb(0,100,0);
}

.buttonN:active
{
    background-color: rgb(130,130,130);
}

.buttonN
{
    background-color: rgb(50,150,50);
    border: none;
    color: white;
    padding: 10px 24px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    font-weight: normal;
    cursor: pointer;
    border-radius: 5px;
}


.btn-group .buttonG {
    background-color: rgba(0,0,0,0.0);
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    cursor: pointer;
    width:200px;
    border-radius: 5px;
}


.btn-group .buttonG:hover {
    background-color: rgba(0,0,0,0.0);
    border: thin solid black;
}

.buttonA {
    background-color: rgb(50,150,50);
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    cursor: pointer;
    border-radius: 5px;
}

.buttonB {
    background-color: rgb(0,158,197);
    border: none;
    color: white;
    padding: 10px 24px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    cursor: pointer;
    border-radius: 5px;
}

.buttonA:hover {
    background-color: rgb(0,100,0);
}

.buttonB:hover {
    background-color: rgb(0,120,170);
}

.buttonG:active
{
    background-color: rgb(130,130,130);
}

.buttonA:active
{
    background-color: rgb(130,130,130);
}

.buttonB:active
{
    background-color: rgb(130,130,130);
}

a
{
    text-decoration: none;
}

a:active
{
    text-decoration: underline;
}

.forum_card
{
    border-left: 1px solid gray;
    float: left;
    padding-bottom: 5px;
    padding-top: 5px;
    padding-left: 15px;
    width: 100%;
}

.input-resp
{
    width: 100%;
    box-sizing: border-box;
}

.textarea-resp
{
    width: 100%;
    box-sizing: border-box;
}

.select-resp
{
    width: 100%;
    max-width: 200px;
    box-sizing: border-box;
}


.table_fixed_header
{
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    border-width: thin; 
    border-style: solid;
    text-align:center; 

    display: table;
    height: 300px;
    overflow: auto;
}

.buttonReset
{
    border: none;
    background-color: rgb(210,210,210);
    color: black;
    padding: 10px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    cursor: pointer;
    border-radius: 5px;
}

.buttonReset:active
{
    background-color: rgb(130,130,130);
    font-size: 16px;
}

.buttonReset:hover {
    background-color: rgb(170,170,170);
}

.buttonR
{
    background-color: rgb(220,50,50);
    border: none;
    color: white;
    padding: 10px 24px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    cursor: pointer;
    border-radius: 5px;
}

.buttonR:active
{
    background-color: rgb(130,130,130);
}

.buttonR:hover
{
    background-color: rgb(150,0,0);
}




/*Cookie Consent Begin*/
.cookieConsent {
    background-color: rgba(20,20,20,0.8);
    min-height: 26px;
    font-size: 14px;
    color: #ccc;
    line-height: 26px;
    padding: 8px 0 8px 30px;
    font-family: "Trebuchet MS",Helvetica,sans-serif;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;
}
.cookieConsent a {
    color: #4B8EE7;
    text-decoration: none;
}
.cookieConsent a.cookieConsentOK {
    background-color: #F1D600;
    color: #000;
    display: inline-block;
    border-radius: 5px;
    padding: 0 20px;
    cursor: pointer;
    margin: 0 60px 0 10px;
}
.cookieConsent a.cookieConsentOK:hover {
    background-color: #E0C91F;
}
/*Cookie Consent End*/


/*Busy spinner
The loaders use CSS custom properties (variables) to control the attributes of the loaders
*/
.loader,.loader:before,.loader:after{
	box-sizing: border-box;
	flex-grow: 0;
	flex-shrink: 0;
}
		
@keyframes grow-and-shrink {

    0%,
    80%,
    100% {
        /* transform: translateY(0); */
        transform: scaleY(1);
    }

    40% {
        /* transform: translateY(calc(70px * 0.125)); */
        transform: scaleY(1.2);
    }
}

.loader.cascading-bars,
.loader.cascading-bars::before,
.loader.cascading-bars::after {
    display: block;
    position: relative;
    content: "";
    width: calc(70px/4);
    height: 70px;
    background: #27ae60;
    border-radius:8px;    
}

.loader.cascading-bars {
    top: 0;
    animation: grow-and-shrink calc(2s/3) ease-in-out infinite;
    animation-delay: calc(2s * 0.083);
}

.loader.cascading-bars::before {
    position: absolute;
    top: 0;
    left: calc(-0.35 * 70px);
    animation: grow-and-shrink calc(2s/3) ease-in-out infinite;
}

.loader.cascading-bars::after {
    position: absolute;
    top: 0;
    left: calc(0.35 * 70px);
    animation: grow-and-shrink calc(2s/3) ease-in-out calc(2s/6) infinite;
    animation-delay: calc(2s * 0.167);
}

.report_table {
    width:90%; 
    border-collapse:collapse;
    border-width:thin; 
    border-style:solid;
    border-color: white;
    text-align:left; 
    word-wrap: break-word;
}

.report_table td {
    padding: 10px;
    border-width:thin; 
    border-style:solid; 
    text-align:left; 
    word-wrap: break-word;
}

.report_table tr {
    page-break-inside:avoid;
}

.report_table tr:nth-child(even) {
    background-color: rgba(0,0,0,0.5);
}

.divTable
{
    display:  table;
    width:auto;
}

.divRow
{
   display:table-row;
   width:auto;
   border-left: 10px solid gray;
}

.divLinkCell
{
    float:left;
    display:table-column;
    width:40px;
    padding-right: 20px;
    text-align: center;
}        

.divCell
{
    float:left;
    display:table-column;
    width:auto;
}