html,
body {
    height: 100%;
}

.wrap {
    min-height: 100%;
    height: auto;
    margin: 0 auto -60px;
    padding: 0 0 60px;
}

.wrap > .container {
    padding: 20px 15px 20px;
}

.footer {
    height: 60px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    padding-top: 20px;
}

.jumbotron {
    text-align: center;
    background-color: transparent;
}

.jumbotron .btn {
    font-size: 21px;
    padding: 14px 24px;
}

.not-set {
    color: #c55;
    font-style: italic;
}

/* add sorting icons to gridview sort links */
a.asc:after, a.desc:after {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    padding-left: 5px;
}

a.asc:after {
    content: /*"\e113"*/ "\e151";
}

a.desc:after {
    content: /*"\e114"*/ "\e152";
}

a.disabled-link {
  pointer-events: none;
}

.sort-numerical a.asc:after {
    content: "\e153";
}

.sort-numerical a.desc:after {
    content: "\e154";
}

.sort-ordinal a.asc:after {
    content: "\e155";
}

.sort-ordinal a.desc:after {
    content: "\e156";
}

.grid-view th {
    white-space: nowrap;
}

.hint-block {
    display: block;
    margin-top: 5px;
    color: #999;
}

.error-summary {
    color: #a94442;
    background: #fdf7f7;
    border-left: 3px solid #eed3d7;
    padding: 10px 20px;
    margin: 0 0 15px 0;
}

/* align the logout "link" (button in form) of the navbar */
.nav li > form > button.logout {
    padding: 15px;
    border: none;
}

@media(max-width:767px) {
    .nav li > form > button.logout {
        display:block;
        text-align: left;
        width: 100%;
        padding: 10px 15px;
    }
}

.nav > li > form > button.logout:focus,
.nav > li > form > button.logout:hover {
    text-decoration: none;
}

.nav > li > form > button.logout:focus {
    outline: none;
}

.blue-color { color:blue; }
.green-color { color:green; }
.teal-color { color:teal; }
.yellow-color { color:yellow; }
.red-color { color:red; }

a:link, a:visited, a:hover, a:active { text-decoration: none; }

.fa.disabled, .fa[disabled], .disabled > .fa, [disabled] > .fa, .svg-inline--fa.disabled { opacity: 0.5; cursor: not-allowed; pointer-events: none; }

h5.m-0, .h5.m-0 {
  font-size: 1rem;
}

.ui-confirm-dialog, .ui-dialog, .bootstrap-dialog {
  z-index: 1060 !important;
}

.hyphen { width: 1px; padding-left: 1px; padding-right: 6px; }

select.form-control {
  -webkit-appearance: menulist!important;
  -moz-appearance: menulist!important;
  -ms-appearance: menulist!important;
  -o-appearance: menulist!important;
  appearance: menulist!important;
}

.grid-view td {
  white-space: nowrap;
}

.gridview > td { background: #ffffff; }
.gridview.finished > td { background: #C1FFC1; }
.gridview.selected > td { background: #FBEC88; }

#menubuttons { float: right; }

.login #middle, .login .middle { display: flex; justify-content: center; }
.login #middle .ui-panel { width: 50% }
#maintitle, #logged { font-size: 20px; font-weight: bold; }
#logintext { font-size: 28px; font-weight: bold; }

.site-projektmodositas .buttons, .site-feladatmodositas .buttons, .site-grouptaskstatuschange .buttons, #changepassword-form #btns, .site-grouptaskstatuschange1 .buttons, .site-grouptaskstatuschange2 .buttons {
  display: flex;
  justify-content: center;
  align-items: center;  
}

.site-projektmodositas .buttons > button, .site-feladatmodositas .buttons > button, .site-grouptaskstatuschange .buttons > button, #changepassword-form #btns > button, .site-grouptaskstatuschange1 .buttons > button, .site-grouptaskstatuschange2 .buttons > button {
  margin-left: 5px;
  margin-right: 5px;
}

 /*.projektek table.kv-grid-table { table-layout: fixed; }*/
.projektek table.kv-grid-table td { max-width: 250px; overflow: hidden; }
.feluletek table.kv-grid-table td, .feladatok table.kv-grid-table td, #groupTaskStatusChangeModal1 table.kv-grid-table td { overflow: hidden; }

.tooltip-inner { max-width: 700px; width: 700px; text-align: left; }

#gridview .btn-group > .btn:not(:last-child):not(.dropdown-toggle), #gridview .btn-group > :not(.btn-check) + .btn { border-radius: var(--bs-btn-border-radius); }

.site-feladatmodositas #gridview-table { overflow-x: auto; height: 700px; width: 100%; }

#feladatModositasModal .modal-dialog, #uploadModal .modal-dialog, #uploadGroupModal .modal-dialog, #feladatImageSlideShowModal .modal-dialog, #projektImageSlideShowModal .modal-dialog, #groupTaskStatusChangeModal1 .modal-dialog { --bs-modal-width: 50%; }

#projektModositasModal .optiondisabled, #feladatModositasModal .optiondisabled, #groupTaskStatusChangeModal1 .optiondisabled, #groupTaskStatusChangeModal2 .optiondisabled { color: gray; }

.feluletek #gridview .btn-toolbar, .feluletek #gridview .btn-toolbar .btn-group, .feladatok #gridview .btn-toolbar, .feladatok #gridview .btn-toolbar .btn-group { width: 100%; }

.feluletek #gridview .btn-toolbar .divider { width: 1%; }
.feluletek #gridview .btn-toolbar .divider2 { width: 15%; }
.feladatok #gridview .btn-toolbar .divider { width: 64%; }

/* wizard messages  */

.wizard-message, .message, .question-message { position: fixed; left: 0; top: 0; right: 0;  background: #fff; z-index: 200006;  display: flex; align-items: center; 
  -webkit-box-shadow: 2px 2px 15px 3px rgba(0,0,0,0.5); -moz-box-shadow: 2px 2px 15px 3px rgba(0,0,0,0.5);
  box-shadow: 2px 2px 15px 3px rgba(0,0,0,0.5); display: none; }
.wizard-message-bgr, .message-bgr, .question-message-bgr { position: fixed; left: 0; top: 0; right: 0; bottom: 0; background: rgba(255,255,255,0.5); z-index: 200005; display: none;}
.wizard-message .left-side, .message .left-side, .question-message .left-side { padding: 20px 70px; text-align: center;  margin: 30px 0; }
.wizard-message .right-side, .message .right-side, .question-message .right-side { padding: 20px 70px; text-align: center;  margin: 30px 0;  flex-grow: 1; border-left: 2px solid #72797F; }
.wizard-message h2, .message h2, .question-message h2 { margin-bottom: 15px; margin-top: 0; }
.wizard-message .button, .message .button, .question-message .button { margin-right: 15px; }
.wizard-message .message-body, .message .message-body, .question-message .message-body { margin-bottom: 30px; }

.buttons-row { display: flex; margin-top: 15px;  justify-content: space-between; }

.carousel,
.carousel-inner {
/*  min-height: 700px;*/
  margin: auto;
}

.button { height: 55px; border-radius: 8px; display: inline-block; position: relative; padding-left: 70px; font-size: 18px; font-weight: normal; margin-bottom: 5px; margin-left: 20px;
  line-height: 22px; padding-right: 15px; cursor: pointer; text-align: center; max-width: 225px;
  -webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.5);
  box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.5); }

.button button { background: none !important ; border: none !important; }
.button button:hover {  border: none !important; }
.button span {padding: 0 15px;}
.button.gray  {background: #72797f; color:#fff;}
.button.gold  {background: #D5B076; color:#fff;}
.button.green  {background: #46d3a4; color:#fff;}
.button.red  {background: #d66a5b; color:#fff;}

.button .button-left {width: 70px; height: 55px; background-image: url("/images/button-left.png"); background-repeat: no-repeat; background-position: 0px center; border-radius: 7px 0 0 7px; position: absolute; left: 0; top: 0; bottom: 0; }
.button .icon {position: absolute; left: 0; top: 0; right: 10px; bottom: 0;  background-repeat: no-repeat; background-position: center center; }
.button input  { background-color: transparent; border: none !important; margin: 0 !important; height: 55px; padding-top: 0 !important; padding-bottom: 0 !important;}
.button > span { display: table; padding: 0; width: 100%; height: 55px;}
.button > span > span  { display: table-cell; vertical-align: middle;}
.button.pen .icon {background-image: url("/images/pen-icon.png");}
.button.search .icon {background-image: url("/images/search-icon.png");}
.button.head .icon {background-image: url("/images/head-icon.png");}
.button.green-arrow .icon {background-image: url("/images/green-arrow.png");}
.button.gold-arrow .icon {background-image: url("/images/gold-arrow.png");}
.button.green-arrow-left .icon {background-image: url("/images/green-arrow-left.png");}
.button.sun .icon {background-image: url("/images/sun-icon.png");}
.button.green.sun .icon {background-image: url("/images/green-sun.png");}

.button.folder .icon {background-image: url("/images/folder-icon.png");}
.button.upload .icon {background-image: url("/images/upload-icon-gr.png");}
.button.trash .icon {background-image: url("/images/trash-icon.png");}
.button.pipa .icon {background-image: url("/images/pipa-icon.png"); }
.button.x .icon {background-image: url("/images/x-icon.png"); }
.button.star .icon {background-image: url("/images/goldstar-icon.png");}
.button.eye .icon {background-image: url("/images/eye-icon.png");}

.button.green.pipa, .button.red.x { cursor: pointer; }

.kv-meter-container { width: 0px; }

.color-legend { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.legend-color-kiadott { background-color: green; }
.legend-color-visszautasított { background-color: black; }
.legend-color-ujrakiadott { background-color: #d63384; }
.legend-color-elvegzett { background-color: orange; }
.legend-color-nemelvegezheto { background-color: red; }
.legend-color-kivitelezesalatt { background-color: blue; }

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
  .wizard-message .left-side, .message .left-side, .countdown-message .left-side, .question-message .left-side { padding: 20px; }
  .wizard-message .right-side, .message .right-side, .countdown-message .right-side, .question-message .right-side { padding: 20px; }
}

@media (max-width: 575.98px) {
  .wizard-message, .message, .countdown-message, .question-message { flex-wrap: wrap; }
  .wizard-message .left-side, .message .left-side, .countdown-message .left-side, .question-message .left-side { flex-basis: 100%;  margin: 15px 0 10px; }
  .wizard-message .right-side, .message .right-side, .countdown-message .right-side, .question-message .right-side { flex-basis: 100%; margin: 5px 0 15px 0; }
}

@media (min-width: 1400px) {
  .container { max-width: 1600px; }
}

@media (max-width: 410px) {
  #top { padding-bottom: 20px; }
}