/**
 * this File is part of OpenVPN-WebAdmin - (c) 2020 OpenVPN-WebAdmin
 *
 * NOTICE OF LICENSE
 *
 * GNU AFFERO GENERAL PUBLIC LICENSE V3
 * that is bundled with this package in the file LICENSE.md.
 * It is also available through the world-wide-web at this URL:
 * https://www.gnu.org/licenses/agpl-3.0.en.html
 *
 * @fork Original Idea and parts in this script from: https://github.com/Chocobozzz/OpenVPN-Admin
 * 
 * @author    Wutze
 * @copyright 2020 OpenVPN-WebAdmin
 * @link			https://github.com/Wutze/OpenVPN-WebAdmin
 * @see				Internal Documentation ~/doc/
 * @version		1.2.0
 * @todo			new issues report here please https://github.com/Wutze/OpenVPN-WebAdmin/issues
 */

body {
  padding-top: 0px;
  font-family: Arial, Helvetica, sans-serif;
}

/*
https://bootsnipp.com/snippets/jvP6z
*/
.mini-led-green, .mini-led-green-blink {
    background-color: #80FF00;
    box-shadow: #7D7B80 0 -1px 6px 1px, inset #460 0 -1px 8px, #80FF00 0 3px 11px;
}
.mini-led-red, .mini-led-red-blink {
    background-color: #F00;
    box-shadow: #7D7B80 0 -1px 6px 1px, inset #600 0 -1px 8px, #F00 0 3px 11px;
}
.mini-led-gray, .mini-led-gray-blink {
  background-color: #aab2bd;
  box-shadow: #aab2bd 0 -1px 6px 1px, inset #656d78 0 -1px 8px, #656d78 0 1px 6px;
}
.mini-led-gray,
.mini-led-red,
.mini-led-red-blink,
.mini-led-green,
.mini-led-green-blink {
    margin: 0 auto;
    margin-top: 5px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

.mini-led-green-blink {
  -webkit-animation: blinkGreen 0.7s infinite;
  -moz-animation: blinkGreen 0.7s infinite;
  -ms-animation: blinkGreen 0.7s infinite;
  -o-animation: blinkGreen 0.7s infinite;
  animation: blinkGreen 0.7s infinite;
}

.mini-led-red-blink {
  -webkit-animation: blinkRed 0.7s infinite;
  -moz-animation: blinkRed 0.7s infinite;
  -ms-animation: blinkRed 0.7s infinite;
  -o-animation: blinkRed 0.7s infinite;
  animation: blinkRed 0.7s infinite;
}

@-webkit-keyframes blinkGreen {
  0% {
    background-color: #80FF00;
  }
  50% {
    background-color: #6cff82;
    box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 6px 1px, inset #441313 0 -1px 8px, #80FF00 0 1px 0;
  }
  100% {
    background-color: #80FF00;
  }
}
@keyframes blinkGreen {
  0% {
    background-color: #80FF00;
  }
  50% {
    background-color: #6cff82;
    box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 6px 1px, inset #441313 0 -1px 8px, #80FF00 0 1px 0;
  }
  100% {
    background-color: #80FF00;
  }
}

@-moz-keyframes blinkRed {
  0% {
    background-color: #db212b;
  }
  50% {
    background-color: #db212b;
    box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 6px 1px, inset #441313 0 -1px 8px, #db212b 0 1px 0;
  }
  100% {
    background-color: #db212b;
  }
}
@-webkit-keyframes blinkRed {
  0% {
    background-color: #db212b;
  }
  50% {
    background-color: #db212b;
    box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 6px 1px, inset #441313 0 -1px 8px, #db212b 0 1px 0;
  }
  100% {
    background-color: #db212b;
  }
}
@keyframes blinkRed {
  0% {
    background-color: #db212b;
  }
  50% {
    background-color: #db212b;
    box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 6px 1px, inset #441313 0 -1px 8px, #db212b 0 1px 0;
  }
  100% {
    background-color: #db212b;
  }
}

ins, del{
  vertical-align : top;
  white-space    : pre;
  white-space    : pre-wrap;
  font-family    : monospace;
}
ins{
  color: #ccff00;
}
del{
  color: #ff0000;
}

.error-msg{
  box-shadow: 0 0 20px #ff0000 !important;
  color: #ffffff;
}

.card-main, .progressdata{
  background-color: #003c744d !important;
  box-shadow: 0 0 3px rgba(0,0,0,.125),0 1px 3px rgba(0,0,0,.2);
}

.progressdata{
  text-align: center;
  font-size: 10px;
  background-color: #ffffff !important;
}

#messagestage,#messagestageer {
  visibility: hidden;
  min-width: 250px;
  margin-left: -125px;
  background-color: rgb(16, 197, 0);
  color: #fff;
  text-align: center;
  border-radius: 2px;
  padding: 16px;
  position: fixed;
  z-index: 1;
  left: 50%;
  top: 50%;
  font-size: 17px;
}

#messagestageer{
  background-color: rgb(197, 19, 19) !important;
}

#messagestage.show, #messagestageer.show {
  visibility: visible;
  -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

@-webkit-keyframes fadein {
  from {top: 0; opacity: 0;} 
  to {top: 50%; opacity: 1;}
}

@keyframes fadein {
  from {top: 0; opacity: 0;}
  to {top: 50%; opacity: 1;}
}

@-webkit-keyframes fadeout {
  from {top: 50%; opacity: 1;} 
  to {top: 0; opacity: 0;}
}

@keyframes fadeout {
  from {top: 50%; opacity: 1;}
  to {top: 0; opacity: 0;}
}

.alert-info, .history{
  background-color: rgb(156, 156, 156) !important;
}

#diff{
  margin: 0px !important;
}

.sidebar-dark-primary, .login-box {
  background-image: url("../images/bg.png");
}

.brand-link, .main-header, .nav-item, .navbar-nav .nav-link, .control-sidebar, .main-footer{
  background-color: #00101f !important;
  color: #ffffff !important;
  border-bottom: 0px;
}

.nav-pills .has-treeview{
  background-color: #00101f59 !important;
}

.nav-pills .has-treeview .nav-item{
  background-color: #00101f96 !important;
}

.sidebar{
  padding: 0px;
}

.main-footer{
  font-size: 12px;
  font-weight: normal;
}

.small-box {
	border-radius: 0px;
	box-shadow: 0 0 1px rgba(0,0,0,.125),0 1px 3px rgba(0,0,0,.2);
	display: block;
  margin-bottom: 20px;
  margin-top: 3px;
  margin-bottom: 5px;
	position: relative;
}

.container-fluid {
  padding-left: 0px;
  padding-right: 0px;
}

.p-3, .login-logo, .login-box-body{
  padding: 5px !important;
}

.card-primary{
  margin: 0px;
}

.login-box .login-logo a, .login-box, .login-logo {
  color: #ffffff !important;
  background-color: #00101f !important;
  padding: 0px;
  margin: 0px;
}

.login-box{
  box-shadow: 0 0 5px rgba(0,16,31, 0.918),0 1px 5px rgba(0,16,31,.2);
}

.nonono{
  background-color: #ffffff !important;
  text-align: center;
}

.bg-cemetery{
  background-color: #000000 !important;
  color: #ffffff !important;
}

.modal-user{
  background-color: #d9e5fa8e !important;
}