/*                                                                              INFO
margin: 25px 50px 75px 100px;
top margin is 25px / right margin is 50px / bottom margin is 75px / left margin is 100px
*/

:root {
    --gray_very-dark:   #1a2a3a;
    --gray_dark:        #2a3a4a;
    --gray_light:       #5a6a7a;
    --gray_very-light:  #a3b3c3;
    --gray_white:       #e4e4f4;

    --red_very-dark:    #330000;
    --red_dark:         #660000;
    --red_light:        #990000;
    --red_very-light:   #cc2929;
    --red_white:        #f2dada;
}

/*                                                                              Main Style */
html {background:var(--gray_very-dark) url("/_data/images/bgr/bgr_dark-red.png") no-repeat fixed center/cover;}

@font-face {font-family: "MyFont";src: url("/_data/fonts/SegoeUI/SegoeUIVF.ttf");}

body {/*background-color:var(--gray_very-dark);*/ color:var(--gray_very-light); font-family: "MyFont"; margin:0 auto; /* padding-top:0; */;}

/*
@media (max-width: 768px)
.col-md-3 {-ms-flex: 0 0 0%; flex: 0 0 0%; max-width: 0%; visibility: hidden;}
.col-md-9 {-ms-flex: 0 0 85%; flex: 0 0 95%; max-width: 95%;}
*/

a          {color:var(--gray_very-light);}
 a:hover   {color:var(--red_light);}
 a:visited {color:var(--gray_very-light);}
 a:active  {color:var(--red_light);}

/*                                                                              Grav */

#grav-login {background: #2a3a4a!important; border: none!important;}

#g-navigation .g-main-nav .g-dropdown {background: rgb(107 0 0);}

/* .button {font-size: 1rem; text-transform: uppercase; background: #2a3a4a; color: #9c0c1c; border: 1px solid transparent; border-radius: 0.75rem; box-shadow: 0px 1px 5px 2px #610000; } */
.button         {background-color:var(--gray_very-dark); color:var(--gray_very-light); box-shadow:var(--my-boxshadow1) var(--gray_very-dark); border:none; border-radius:2px; font-size:1rem; margin:25px; padding:16px 32px; }
.button:hover   {background-color:var(--gray_light); color:var(--gray_very-dark); box-shadow:var(--my-boxshadow1) var(--gray_light); border:none; border-radius:2px; font-size:1rem; margin:25px; padding:20px 42px; }

.btn {background-color: #0000; background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0000), to(#0000)); border: 3; line-height: 33px;}

.btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success.active, .btn-success.disabled, .btn-success[disabled]
{color: #ffffff; background-color: #000;}

input#password, input#username, input[type="text"] {background-color:var(--gray_very-light); color:var(--gray_very-dark); margin: 3px; border: 0px; }
textarea.long {background-color:var(--gray_very-light); color:var(--gray_very-dark); margin: 3px; border: 0px; }

.g-tabs .uk-tab > li.uk-active > a {color:#474747;}
.g-tabs .uk-tab > li > a {color:#a8a7a7;}
.g-tabs .tabs-content.top > li {color:#a8a7a7;}
.g-tabs {background:#fff0;}

.uk-accordion-title {background:#474747; border:1px solid #474747; font-size:22px; color:#a8a7a7; text-align:center;}

#tecart-cookie-banner { background: #1a2a3a; color: #fff; width: 100%; max-width: 75%; min-height: 50%; position: unset; margin-top: 20%; margin-left: auto; margin-right: auto; border-radius: 1em;}
.cc-header { background: url("/_data/images/logo/jupix_copyright_left.png") no-repeat 0 0;}
.cc-window.cc-floating { max-width: 100%;}
.cc-window.cc-floating { background: rgba(0,0,0,.3)!important;}

/*                                                                              TinyFilemanager */

body.fm-login-page {background: none!important;}
.card {background-color: #2a3a4a; border-color:#610000;}
button.btn.btn-success.btn-block.mt-4 {background-color:#610000; border-color:#2a3a4a;}
button.btn.btn-success.btn-block.mt-4:hover {background-color:#2a3a4a; border-color:#610000;}



/*                                                                              Buttons */
:root {/* box-shadow: offset-x | offset-y | blur-radius | spread-radius | color */ --my-boxshadow1:0px 1px 5px 2px}

.mybtn     {border:none; border-radius:2px; cursor:pointer; display:inline-block; font-size:1rem; font-weight:bold; margin:auto; padding:7px 32px; text-align:center; text-decoration:none;}

.mybtn_center       {position:relative; left:50%; -ms-transform:translate(-50%,-50%); transform:translate(-50%,-50%);}
.mybtn_right        {float:right;}

.mybtn_size2       {padding:6px  18px;}
.mybtn_size3       {padding:9px  27px;}
.mybtn_size4       {padding:12px 36px;}
.mybtn_size5       {padding:15px 45px;}
.mybtn_size6       {padding:18px 54px;}


.mybtn_color0       {background-color:#ffffff00; color:var(--gray_very-light);}

.mybtn_color1       {background-color:var(--gray_very-dark); color:var(--gray_very-light);  box-shadow:var(--my-boxshadow1) var(--gray_very-dark);}
.mybtn_color1:hover {background-color:var(--gray_light); color:var(--gray_very-dark);  box-shadow:var(--my-boxshadow1) var(--gray_light);}

.mybtn_color2       {background-color:var(--gray_light); color:var(--gray_very-dark);  box-shadow:var(--my-boxshadow1) var(--gray_light);}
.mybtn_color2:hover {background-color:var(--gray_very-light); color:var(--gray_very-dark);  box-shadow:var(--my-boxshadow1) var(--gray_very-light);}

.mybtn_color3       {background-color:var(--gray_very-light); color:var(--gray_very-dark);  box-shadow:var(--my-boxshadow1) var(--gray_very-light);}
.mybtn_color3:hover {background-color:var(--gray_very-dark); color:var(--gray_very-light);  box-shadow:var(--my-boxshadow1) var(--gray_very-dark);}

.mybtn_color4       {background-color:var(--red_very-dark); color:var(--gray_very-light);  box-shadow:var(--my-boxshadow1) var(--red_very-dark);}
.mybtn_color4:hover {background-color:var(--red_light); color:var(--gray_very-light);  box-shadow:var(--my-boxshadow1) var(--red_light);}

.mybtn_color5       {background-color:var(--red_light); color:var(--gray_very-light);  box-shadow:var(--my-boxshadow1) var(--red_light);}
.mybtn_color5:hover {background-color:var(--red_very-light); color:var(--gray_very-dark);  box-shadow:var(--my-boxshadow1) var(--red_very-light);}

.mybtn_color6       {background-color:var(--red_very-light); color:var(--gray_very-dark);  box-shadow:var(--my-boxshadow1) var(--red_very-light);}
.mybtn_color6:hover {background-color:var(--red_very-dark); color:var(--gray_very-light);  box-shadow:var(--my-boxshadow1) var(--red_very-dark);}

.mybtn_info         {background-color:var(--red_very-dark)00; color:var(--gray_very-light);  box-shadow:var(--my-boxshadow1) var(--gray_light); font-size:1.15rem; font-weight:900; margin-left: 0%;width:65%;}
.mybtn_info:hover   {color:var(--gray_very-light);}

.mybtn_error        {background-color:var(--red_light); color:var(--gray_very-light);  box-shadow:var(--my-boxshadow1) var(--gray_light); font-size:1.15rem; font-weight:900; margin-left: 0%;width:65%;}
.mybtn_error:hover  {color:var(--gray_very-light);}

.mybtn_spoiler      { margin-left:0 ;width:65%;}


/*                                                                              DropDown */
.mydropdown_wrapper {background:var(--gray_very-dark); padding:3px; }

.mydropdown_mainmenu_item {position:relative; display:inline-block; }
.mydropdown_submenu_wrapper {display: none; background-color:var(--gray_very-dark); box-shadow:var(--my-boxshadow1) var(--gray_light); width:fit-content; margin:1px; padding:9px; position: absolute; z-index: 999;}

.mydropdown_mainmenu_item:hover .mydropdown_submenu_wrapper {display: block;}


/* .mydropdown_wrapper {background:var(--gray_very-dark); position:relative;}
.mydropdown_mainmenu {position:relative; display:inline-block;}

.mydropdown_submenu_wrapper {position:absolute; z-index:50; background-color:var(--gray_very-dark); box-shadow:var(--my-boxshadow1) var(--gray_light);}
.mydropdown_submenu {width: fit-content; margin: auto;}

.mydropdown_item {background-color:inherit;  color:var(--gray_very-light); border-radius:5px; border:none; cursor:pointer; float:left; font-size:17px; font-weight:bold; outline:none; padding:16px 22px; text-decoration:none; transition:0.3s;}
.mydropdown_item:hover {background-color:inherit;  color:inherit; border-radius:inherit;}
.mydropdown_item:visited {background-color:inherit;  color:inherit; border-radius:inherit;}
.mydropdown_item.active {background-color:inherit;  color:var(--red_very-light);}
*/


/*                                                                              IFrame */
/*
#IFrame {width:100%; height:100%; border:none; position:center; background-color:var(--gray_light)00;}
#IFrame {zoom: 0.75; -moz-transform: scale(0.75); -moz-transform-origin: 0 0; -o-transform: scale(0.75); -o-transform-origin: 0 0; -webkit-transform: scale(0.75); -webkit-transform-origin: 0 0;}
*/


/*                                                                              Info/Data-Box */

.myBox {margin:18px 5px 18px 5px; padding:15px 32px; width:fit-content; border:none; box-shadow:0px 1px 2px 2px var(--gray_very-dark); font-size:1.25rem; text-align:center;}

.myBox_center {margin:auto;}
.myBox_right {float:right;}

.myBox_Info {background-color:#ffffff00!important; color:var(--red_very-dark);}

.myBox_Text {background-color:var(--gray_very-dark)!important; color:var(--gray_very-light)!important;}


/*                                                                              Login */
#login_form {background-color:white; border-radius:5px; box-sizing:border-box; box-shadow:0px 1px 2px 2px var(--gray_very-dark); margin-top:5px; margin:10 auto; padding:20px; text-align:center; width:350px;}
#login_form input[type="password"] {border-style:solid; border-width:1px; font-size:1rem; margin-top:5px; width:250px; height:40px;}
#login_form input[type="submit"] {background-color:var(--gray_very-dark); color:white; border:none; border-radius:3px; box-shadow:0px 1px 2px 2px var(--red_very-dark); font-size:1.2rem; margin-top:5px; width:250px; height:40px;}
#logout_form input[type="submit"] {background-color:var(--red_very-dark); color:white; border:none; border-radius:3px; box-shadow:0px 1px 2px 2px var(--gray_very-dark); font-size:1rem; margin-top:5px; margin-left:25px; width:250px; height:40px;}


/*                                                                              Preloader */
#loader-wrapper .loader-section {background:var(--gray_very-dark) url("/_data/images/bgr/bgr_dark-red.png") no-repeat fixed center/cover;}


/*                                                                              Scrollbar */
::-webkit-scrollbar {background:var(--gray_very-dark); width:16px;}
::-webkit-scrollbar-thumb {background:var(--red_very-dark); height:30%; border-radius:4px;}
::-webkit-scrollbar-thumb:hover {background:var(--red_light);}
/* ::-webkit-scrollbar-track {background:var(--gray_very-dark); border-radius:15px;} */


/*                                                                              Spoiler              */
.spoiler {display:none; width:100%;/*height:50px; background-color:red; */ margin-bottom:10px;}


/*                                                                              Tabs */
.mytab {background-color:var(--gray_very-dark); overflow:hidden; padding:6px 6px 0px 6px;}

.mytab button {background-color:inherit; color:var(--gray_very-light); border-radius:5px; border:none; cursor:pointer; float:left; font-size:17px; font-weight:bold; outline:none; padding:4px 12px; transition:0.3s;}
.mytab button:hover {background-color:var(--red_light); border-radius:5px 5px 0px 0px;}
.mytab button.active {background-color:var(--red_very-light); border-radius:5px 5px 0px 0px;}

.mytab_links {background-color:inherit; color:var(--gray_very-light); border-radius:5px; border:none; cursor:pointer; float:left; font-size:17px; font-weight:bold; outline:none; padding:4px 12px; text-decoration:none; transition:0.3s;}
.mytab_links:hover {background-color:var(--red_light); color:var(--gray_very-light); border-radius:5px 5px 0px 0px;}
.mytab_links:visited {background-color:inherit; color:var(--gray_very-light); border-radius:5px 5px 0px 0px;}
.mytab_links.active {background-color:var(--red_very-light); color:var(--gray_very-light); border-radius:5px 5px 0px 0px;}

.mytab_content {border:0 solid #ccc; border-top:none; display:none; /* padding:6px 48px;*/ }

/*                                                                              Flex Boxes */
* {box-sizing: border-box;}
.flex-container {display: flex; flex-wrap: wrap;}
.flex-2col-left {flex: 50%;}
.flex-2col-right {flex: 50%;}
/* Responsive layout - makes a one column-layout instead of a two-column layout */
@media (max-width: 800px) {.flex-2col-right, .flex-2col-left {flex: 100%;}}