/* 
 * This file is subject to the terms and conditions defined in
 * file 'LICENSE.txt', which is part of this source code package.
 *
 * author: Krisztián Csekme
 * date: 31/07/18
 *
 * CONTENT
 * ------------------------------------------
 * 0. Basic component attributes
 * 1. Site globals
 * 3. Hamburger menü
 * 4. DataTable
 * 5. Scroll to top component
 * 6. Number of circle component
 * 7. Asszisztens kártyák
 * 8. Merged mobile.css definitions
 * 9. Merged shadow.css definitions 
 * X. @deprecated styles
 */

.ui-growl-item-container {
    opacity: 1.0 !important;
    right: 5px !important;
    top: -5px !important;
    background: #6A6A6A !important;  
    box-shadow: none !important;
    border: none !important;
}

/* Google capcha formázás */
.captcha{
    margin: auto;
    text-align: center;
}
#captcha{
    margin: auto;
    text-align: center;
}


/* roboto-100 - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 100;
    src: url('../resources/fonts/roboto-v18-latin-100.eot'); /* IE9 Compat Modes */
    src: local('Roboto Thin'), local('Roboto-Thin'),
        url('../resources/fonts/roboto-v18-latin-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../resources/fonts/roboto-v18-latin-100.woff2') format('woff2'), /* Super Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-100.woff') format('woff'), /* Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-100.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../resources/fonts/roboto-v18-latin-100.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-100italic - latin */
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 100;
    src: url('../resources/fonts/roboto-v18-latin-100italic.eot'); /* IE9 Compat Modes */
    src: local('Roboto Thin Italic'), local('Roboto-ThinItalic'),
        url('../resources/fonts/roboto-v18-latin-100italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../resources/fonts/roboto-v18-latin-100italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-100italic.woff') format('woff'), /* Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-100italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../resources/fonts/roboto-v18-latin-100italic.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-300 - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    src: url('../resources/fonts/roboto-v18-latin-300.eot'); /* IE9 Compat Modes */
    src: local('Roboto Light'), local('Roboto-Light'),
        url('../resources/fonts/roboto-v18-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../resources/fonts/roboto-v18-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-300.woff') format('woff'), /* Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../resources/fonts/roboto-v18-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-300italic - latin */
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 300;
    src: url('../resources/fonts/roboto-v18-latin-300italic.eot'); /* IE9 Compat Modes */
    src: local('Roboto Light Italic'), local('Roboto-LightItalic'),
        url('../resources/fonts/roboto-v18-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../resources/fonts/roboto-v18-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-300italic.woff') format('woff'), /* Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../resources/fonts/roboto-v18-latin-300italic.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-regular - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url('../resources/fonts/roboto-v18-latin-regular.eot'); /* IE9 Compat Modes */
    src: local('Roboto'), local('Roboto-Regular'),
        url('../resources/fonts/roboto-v18-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../resources/fonts/roboto-v18-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-regular.woff') format('woff'), /* Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../resources/fonts/roboto-v18-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-italic - latin */
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 400;
    src: url('../resources/fonts/roboto-v18-latin-italic.eot'); /* IE9 Compat Modes */
    src: local('Roboto Italic'), local('Roboto-Italic'),
        url('../resources/fonts/roboto-v18-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../resources/fonts/roboto-v18-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-italic.woff') format('woff'), /* Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../resources/fonts/roboto-v18-latin-italic.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-500 - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: url('../resources/fonts/roboto-v18-latin-500.eot'); /* IE9 Compat Modes */
    src: local('Roboto Medium'), local('Roboto-Medium'),
        url('../resources/fonts/roboto-v18-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../resources/fonts/roboto-v18-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-500.woff') format('woff'), /* Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../resources/fonts/roboto-v18-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-500italic - latin */
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 500;
    src: url('../resources/fonts/roboto-v18-latin-500italic.eot'); /* IE9 Compat Modes */
    src: local('Roboto Medium Italic'), local('Roboto-MediumItalic'),
        url('../resources/fonts/roboto-v18-latin-500italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../resources/fonts/roboto-v18-latin-500italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-500italic.woff') format('woff'), /* Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-500italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../resources/fonts/roboto-v18-latin-500italic.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-700 - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: url('../resources/fonts/roboto-v18-latin-700.eot'); /* IE9 Compat Modes */
    src: local('Roboto Bold'), local('Roboto-Bold'),
        url('../resources/fonts/roboto-v18-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../resources/fonts/roboto-v18-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-700.woff') format('woff'), /* Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../resources/fonts/roboto-v18-latin-700.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-700italic - latin */
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 700;
    src: url('../resources/fonts/roboto-v18-latin-700italic.eot'); /* IE9 Compat Modes */
    src: local('Roboto Bold Italic'), local('Roboto-BoldItalic'),
        url('../resources/fonts/roboto-v18-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../resources/fonts/roboto-v18-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-700italic.woff') format('woff'), /* Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../resources/fonts/roboto-v18-latin-700italic.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-900 - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 900;
    src: url('../resources/fonts/roboto-v18-latin-900.eot'); /* IE9 Compat Modes */
    src: local('Roboto Black'), local('Roboto-Black'),
        url('../resources/fonts/roboto-v18-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../resources/fonts/roboto-v18-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-900.woff') format('woff'), /* Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../resources/fonts/roboto-v18-latin-900.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-900italic - latin */
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 900;
    src: url('../resources/fonts/roboto-v18-latin-900italic.eot'); /* IE9 Compat Modes */
    src: local('Roboto Black Italic'), local('Roboto-BlackItalic'),
        url('../resources/fonts/roboto-v18-latin-900italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../resources/fonts/roboto-v18-latin-900italic.woff2') format('woff2'), /* Super Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-900italic.woff') format('woff'), /* Modern Browsers */
        url('../resources/fonts/roboto-v18-latin-900italic.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../resources/fonts/roboto-v18-latin-900italic.svg#Roboto') format('svg'); /* Legacy iOS */
}

hr{
    margin-left: 17px;
    margin-right: 17px;
}
body{
    background: #F0F0F0 !important;
}

*:not(i) {
    font-family: 'Roboto', sans-serif !important; 
    /* font-family:  Lato,'Helvetica Neue',Arial,Helvetica,sans-serif !important;*/
    /*font-family: 'Montserrat', sans-serif !important;*/

}

.filter_accordian_wrapper {
    margin:0px !important;
    padding:0px !important;
    box-shadow: 0 0px 0px 0 rgba(34,36,38,.15), 0 0 0 0px rgba(34,36,38,.15) !important;
}

.filter_accordian {
    border: 1px solid rgba(34,36,38,.15) !important;
    border-bottom: 0px!important;
    box-shadow: none !important;
}

.filter_text {
    padding-top: 0.0em !important;
    padding-bottom: 0.0em !important;

}
.calpick {
    color: #727272 !important;
    padding-top: 0.6em !important;
    padding-bottom: 0.6em !important;
    font-size: 0.9em !important;
}
.calpick-year {
    color: #727272 !important;
    padding-top: 0.6em !important;
    padding-bottom: 0.6em !important;
    font-size: 0.9em !important;
}
.filter_text input {
    color: #727272 !important;
    padding-top: 0.6em !important;
    padding-bottom: 0.6em !important;
    font-size: 1.2em !important;
}
.filter_combo_pair {    
    width: initial !important;
    flex-grow: 1 !important;
    margin-top:2px!important;
    padding: .59em 4em .59em 1em !important;
    min-height: 1em !important;
}
.filter_combo {
    width: 100%!important;
    padding: .59em 4em .59em 1em !important;
    min-height: 1em !important;
}
.filter_combo .dropdown.icon{
    top: .5em !important;
}

.filter_row {
    border: none !important;
}
.filter_row td {

    border: none !important;
    padding: 4px !important;
    padding-top: 2px !important;
    padding-bottom: 2px !important;    
}
.ui-icon.fa {
    text-indent:0px !important;
}

.filter-item {
    max-height: 30px !important;
    height: 30px !important;
    font-size: 0.9em !important;
}
.filter-label-left {
    margin-top: 4px !important;
    text-align: left  !important;

}
.filter-label-right {
    margin-top: 4px  !important;
    text-align: right  !important;
}

.filter-wrapper {

    display:flex !important;
    flex-wrap: wrap !important;
    align-content: center !important;
}
.filter-wrapper .half {
    margin-right: 50px;
    display:flex !important;
    flex-wrap: wrap !important;
    align-content: center !important;
}
.filter-wrapper .full {
    width:100%;
    margin-right: 50px;
    display:flex !important;
    flex-wrap: wrap !important;
}
.filter-wrapper .full .item :only-child {
    display:flex !important;
    flex-wrap: nowrap !important;
    height: 28px !important;
    max-height: 28px !important;
    min-height: 28px !important;
    font-size: 0.9em !important;
    margin-bottom: 8px !important;
}
.filter-wrapper .full .item label {
    margin-top: 4px !important;
    margin-left:4px !important;
    margin-right:4px !important;
}
.filter-wrapper .half .item :only-child {
    display:flex !important;
    flex-wrap: nowrap !important;
    height: 28px !important;
    max-height: 28px !important;
    min-height: 28px !important;
    font-size: 0.9em !important;
    margin-bottom: 8px !important;
}

.filter-wrapper .half .calendarwrapper {
    display:flex !important;
    flex-wrap: nowrap !important;
    height: 28px !important;
    max-height: 28px !important;
    min-height: 28px !important;
    font-size: 0.9em !important;
    margin-bottom: 8px !important;
}





.filter-wrapper .half .item label {
    margin-top: 4px !important;
    margin-left:4px !important;
    margin-right:4px !important;
}
.fixed-120 {
    min-width: 120px !important;
    width: 120px !important;
    max-width: 120px !important;
}
.fixed-110 {
    min-width: 110px !important;
    width: 110px !important;
    max-width: 110px !important;
}
.fixed-100 {
    min-width: 100px !important;
    width: 100px !important;
    max-width: 100px !important;
}
.fixed-150 {
    min-width: 150px !important;
    width: 150px !important;
    max-width: 150px !important;
}
.fixed-180 {
    min-width: 180px !important;
    width: 180px !important;
    max-width: 180px !important;
}
.fixed-190 {
    min-width: 190px !important;
    width: 190px !important;
    max-width: 190px !important;
}
.fixed-200 {
    min-width: 200px !important;
    width: 200px !important;
    max-width: 200px !important;
}

.fixed-210 {
    min-width: 210px !important;
    width: 210px !important;
    max-width: 210px !important;
}

.fixed-250 {
    min-width: 250px !important;
    width: 250px !important;
    max-width: 250px !important;
}

.fixed-300 {
    min-width: 300px !important;
    width: 300px !important;
    max-width: 300px !important;
}
.grow-left {
    margin-left: auto;
}
.grow-right {
    margin-right: auto;
}

.right-align label {
    width: 100%;
    text-align: right !important;
}

/*****************************************************************
   0. Basic component attributes
 ****************************************************************/

input[disabled], select[disabled], textarea[disabled]
{
    background-color: #E0E1E2 !important;
    color: #000 !important;
    opacity: 0.8 !important;
    border: 0px solid rgba(34,36,38,.15) !important;
    text-shadow: none !important;
    -webkit-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #E6E7E8 !important;
    opacity: 1.0 !important; /* Firefox */
}


input[readonly], select[readonly], textarea[readonly]
{
    background-color: #E0E1E2 !important;
    color: #000 !important;
    opacity: 0.8 !important;
    text-shadow: none !important;
    border: 0px solid rgba(34,36,38,.15) !important;
    -webkit-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}

.ui[class*="left icon"].input>input {
    padding-left:1em!important; 
    padding-right: 0em!important; 
}
.ui-inputfield {
    padding-left: 1em !important;
    padding-right: 1em !important;
}

textarea{
    padding-top: 1em !important;
    padding-bottom: 1em !important;

}

/* Adott komponens felveszi a zéro szélességet */
.zero-width {

    width:0% !important;
    max-width: 0px !important;
    height: 0% !important;
    max-height: 0px !important;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}
.zero-width > * {
    width:0% !important;
    max-width: 0px !important;
    height: 0% !important;
    max-height: 0px !important;
    -webkit-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
}

/* Adott komponens felveszi a teljes szélességet */
.full-width {
    width: 100% !important;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}
/* Alap áttűnési animáció */
.base-transition {
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}
/* Komponens elrejtése */
.hide{
    display: none;
}

/* Border radius kinullázása */
.sharpcorner{
    border-radius: 0px !important;
}

/* Material dizájnos div-ek egér érzékenységgel */
.materialdiv{
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    color:#000!important;
    box-shadow: 0 0px 0px rgba(0,0,0,0.25), 0 0px 0px rgba(0,0,0,0.22) !important;
}
.materialdiv:hover {
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    color:#000!important;
    box-shadow: 0 7px 7px rgba(0,0,0,0.25), 0 5px 5px rgba(0,0,0,0.22) !important;
}

/* Fix szélességű beállítás 250 px */
.fixed-250{
    min-width: 250px;
    width: 250px;
}
/* Fix szélességű beállítás 300 px */
 
/* Fix szélességű beállítás 350 px */
.fixed-350{
    min-width: 350px;
    width: 350px;
}
/* Horizontális távolság növelő 25 px */
.topdist-25{
    margin-top: 25px;
}
/* Horizontális távolság növelő 35 px */
.topdist-35{
    margin-top: 35px;
}

/*****************************************************************
   1. Site globals
 ****************************************************************/
/* loader */
.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url(../resources/images/loaders/ripple.gif) center no-repeat #fff;
}

/* Oldal tartalom fixálás a w3 css osztály elrontja */
html{
    overflow-x: visible !important;
}

/* Oldalsó menü beállítások */
#mySidebar {
    background: #6A6A6A !important;
    font-size: 1.01em !important; 
    transition:all 0.6s ease;
    margin-top:0px !important;
    padding-top:0px!important;
}

/*****************************************************************
   3. Hamburger menü
 ****************************************************************/
.hamburger .line{
    width: 28px;
    height: 2px;
    background-color: #ecf0f1;
    display: block;
    margin: 8px 8px auto;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.hamburger:hover{
    cursor: pointer;
}
#hamburger-4.is-hover .line:nth-child(1),
#hamburger-4.is-hover .line:nth-child(3){
    width: 28px;
}
#hamburger-4.is-hover .line:nth-child(1){
    -webkit-transform: translateX(10px) rotate(45deg);
    -ms-transform: translateX(10px) rotate(45deg);
    -o-transform: translateX(10px) rotate(45deg);
    transform: translateX(10px) rotate(45deg);
}
#hamburger-4.is-hover .line:nth-child(3){
    -webkit-transform: translateX(10px) rotate(-45deg);
    -ms-transform: translateX(10px) rotate(-45deg);
    -o-transform: translateX(10px) rotate(-45deg);
    transform: translateX(10px) rotate(-45deg);
}

/*****************************************************************
   4. DataTable
 ****************************************************************/

/* Táblázat kiválasztott sora */
.selected-row {
    background-color: #FFE1CC!important;

}
.selected-row:hover {
    background-color: #FFD3B3!important;

}

/*  táblázat oszlopok melyek kis méret esetén eltűnnek */
@media screen and (max-width: 615px) {
    .hideonsmall { display: none; }  /* show it on small screens */
}


/*****************************************************************
    5. Scroll to top component
  ****************************************************************/

.scroll-top-wrapper {
    position: fixed;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    text-align: center;
    z-index: 99999999;
    background-color: #fff;
    border-radius: 50%;
    color: #FF6009;
    width: 50px;
    height: 50px;
    line-height: 45px;
    right: 5px;
    bottom: 80px;
    padding-top: 2px;
    box-shadow: 0 6px 20px rgba(0,0,0,.19),
        0 8px 17px rgba(0,0,0,.20) !important;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.scroll-top-wrapper:hover {

}
.scroll-top-wrapper.show {
    visibility:visible;
    cursor:pointer;
    opacity: 1.0;
}
.scroll-top-wrapper i.fa {
    line-height: inherit;
}

/*****************************************************************
    6. Number of circle component
 ****************************************************************/
/* Desktop edition */
.ctc.numberof {
    position: absolute;
    top: 75px;
    left: 170px;
    background: red;
    color:#ffffff;
    border: solid 3px #ffffff;
    /*box-shadow: 2px 2px 2px #6A6A6A;*/
    vertical-align: middle;
    border-radius: 50%;
    width: 30px;
    height: 30px;
}


.ctc.numberof.gray {
    position: absolute;
    top: 75px;
    left: 170px;
    background:#877370 !important;
    color:#ffffff;
    border: solid 3px #ffffff;
    /* box-shadow: 2px 2px 2px #6A6A6A;*/
    vertical-align: middle;
    border-radius: 50%;
    width: 30px;
    height: 30px;
}
.ctc.numberofnew {
    background: red;
    color:#ffffff;
    border: solid 1.5px #ffffff;
    /* box-shadow: 2px 2px 2px #6A6A6A;*/
    vertical-align: middle;
    border-radius: 50%;
    width: 20px;
    height: 20px;
}

.ctc.numberofnew .number {
    text-align: center;
    font-weight: normal;
    font-size: 0.7em;
    margin-top: 0px;

}
.ctc.numberof .number {
    text-align: center;
    font-weight: bold;
    font-size: 1.1em;
    margin-top: 2px;

}

/* Mobile edition */
.ctc.mobile.numberof {
    position: absolute;
    top: 4px;
    left: 45px;
    background: red;
    color:#ffffff;
    border: solid 1px #ffffff;
    box-shadow: 2px 2px 2px #6A6A6A;
    vertical-align: middle;
    border-radius: 50%;
    width: 20px;
    height: 20px;
}

.ctc.mobile.numberof.gray {
    position: absolute;
    top: 10px;
    left: 30px;
    background:#877370 !important;
    color:#ffffff;
    border: solid 1px #ffffff;
    box-shadow: 2px 2px 2px #6A6A6A;
    vertical-align: middle;
    border-radius: 50%;
    width: 20px;
    height: 20px;
}

.ctc.mobile.numberof .number {
    text-align: center;
    font-weight: normal;
    font-size: 0.9em;
    margin-top: 0px;

}



/*****************************************************************
   7. Assziszens kártyák
 ****************************************************************/

.acard{
    position: relative;
    min-width: 450px;
    height: 100px;
    background: #ffffff;
    box-shadow: 2px 2px 8px rgba(33, 33, 33, 0.3);
    padding: 12px;
    margin:12px;
    border-radius: 4px;
    -webkit-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}

.acard .title {
    margin-left: 74px;
    color: rgba(33, 33, 33, 0.5);
    font-size: 1.3em;
}

.acard:hover .header{
    width: 70px;
    -webkit-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}
.acard:hover .image img{
    width: 48px;
    -webkit-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}


.acard .image {
    position: absolute;
    top: 10px;
    -webkit-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}

.acard .image img {
    width: 0px;
    height: 48px; 
    -webkit-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}

.acard .header {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 8px;
    height: 100px;
    border-radius: 4px 0px 0px 4px;

    -webkit-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
}

.ekapu-piros {
    background: #FF6009;
}

.ekapu-kek {
    background: #007ACC;
}









.ui-datepicker {
    width: 20em !important;
}
.ui-calendar > input {
    width: 100% !important;
}



.kartya {
    border: none !important;
    /*   box-shadow: 0 1px 3px 0 #d4d4d5 !important; */
    min-height: 280px !important;
    min-width: 280px !important;


}
.kartya:hover {
    cursor: pointer;
    transition:all 0.6s ease;
    box-shadow: 0 6px 20px rgba(0,0,0,.19),
        0 8px 17px rgba(0,0,0,.20) !important;
}
.kartya:active {
    transition:all 0.06s ease;
    box-shadow: 0 3px 5px rgba(0,0,0,.19),
        0 4px 8px rgba(0,0,0,.20) !important;
}




.ui.button:hover{
    transition:all 0.6s ease;

}




@media only screen and (min-width: 990px) {
    div[id$="-fragment"]{
        transition:all 0.6s ease!important;
        margin-top: 0px!important;
        margin-bottom: 20px!important;
        margin-left: 10px!important;
        margin-right: 10px!important;
    }


    .ctc.container {
        margin-left: 322px;
    }

    .ctc.inner{
        margin-left: 11px;
        margin-right: 31px;
        margin-bottom: 10px;
    }

}

@media only screen and (max-width: 990px) {
    div[id$="-fragment"]{
        transition:all 0.6s ease!important;
        margin: auto!important;
        margin-bottom: 20px!important;
    }

    .ctc.container {
        margin: auto;
    }

}

.ctc.divider { width:100%;  border-bottom: 1px solid #707070!important; line-height:0.1em; margin:10px 0 20px; } 
.ctc.divider span { background:#fff; padding: 10px; margin-left: 15px; }

.ctc.container{
    padding-top:3px;
}

.tilewrapperdesktop{
    display: flex;
    flex-wrap: wrap;    
    display: flex;
    flex-wrap: wrap;
    margin-top: 8px;
    margin-left: 2px;
    margin-right: 32px;
}

.ctc.wrapper{
    margin-left:320px;
    margin-right:10px;
    margin-top: 18px;  
}



.ctc.responsive {
    margin-top: 5px;
    margin-bottom: 25px;
    display: flex;
    flex-wrap: wrap;      

}
.ctc.responsive .field{ 
    align-self: baseline;
    margin-left: 10px;
    margin-right: 10px;

}


.desktop-header .title{
    position: absolute;
    top:5px;    
    font-size: 22px;

    color:#FF6009;
}
.desktop-header{
    z-index: 995;
    margin-top: 16px;
    margin-left: 329px;
    margin-right: 19px;
}
.desktop-header .alt{
    position: absolute;    
    color:#877370;
    bottom:8px;
}
.header-profile_r{

    font-size:22px;
}


body{
    background: #F0F0F0;
}

.leftsidemenu {
    background: #6A6A6A;
    color: #fff;
    border-right: 6px #FF6009 solid;
}

.ekapubg {

    color: #000;
}



.ellastic {
    width: 100%;
}

.menu-hover-white{
    transition:all 0.6s ease;

    /*
    -webkit-transition: color 500ms linear;
    -ms-transition: color 500ms linear;
    transition: color 500ms linear;
    -webkit-transition: background-color 500ms linear;
    -ms-transition: background-color 500ms linear;
    transition: background-color 500ms linear;
    */
}
.menu-hover-white:hover{
    transition:all 0.6s ease;
    border-radius: 0%;
    color:#000!important;
    box-shadow: 0 14px 14px rgba(0,0,0,0.25), 0 5px 5px rgba(0,0,0,0.22);
    opacity: 0.8;
    background-color: #fff!important;

    /*
    -webkit-transition: color 500ms linear;
    -ms-transition: color 500ms linear;
    transition: color 500ms linear;
    -webkit-transition: background-color 500ms linear;
    -ms-transition: background-color 500ms linear;
    transition: background-color 500ms linear;
    */
}
.menu-hover-white:active{
    transition:all 0.1s ease;
    border-radius: 0%;
    color:#000!important;
    box-shadow: 0 2px 2px rgba(0,0,0,0.25), 0 2px 2px rgba(0,0,0,0.22);
    opacity: 0.8;
    background-color: #fff!important;
}





/*****************************************************************
    X. @deprecated styles
  ****************************************************************/
.toggleCircleMenu {
    background: #fff;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    position: absolute;
    left: 270px;
    bottom: 10px;
    z-index: 1000;
    opacity: 0.8;
    transition:all 0.6s ease;
}

.wr i {
    top: 15px;
    right: 16px;
    position: absolute;
    margin:auto;
    opacity: 0.8;
    border: solid black;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 3px;
    transition:all 0.6s ease;
}
.wr .right {
    transition:all 0.6s ease;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}
.wr .left {
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
}

.toggleCircleMenu:hover{
    scale:1.1;
    opacity: 1.0;
    transition:all 0.6s ease;
    cursor: pointer;

}
.toggleCircleMenu .wr{
    width: 100%;
    height: 100%;
    margin:auto;
}

.collapse-wrapper {
    display: none;
}
.collapse-wrapper:hover {
    background-color: initial;
}

.collapse-child {
    font-size: 0.98em;
    color:#d4d4d5;
    display: block;    
}
.collapse-child::before {
    content: "\00a0 \00a0 \00a0 \00a0 ";
}

/*****************************************************************
   8. Merged mobile.css definitions
 ****************************************************************/
.btnlogged span {
    text-align: right;
    font-size: 1em;
    line-height: 1em;

    cursor: pointer; 
    padding: 0px;
    width: min-content;
    transition:all 0.3s ease;
}

.btnlogged span:hover {
    padding: 0px;
    background: #ffffff;
    color: #FF6009;

    transition:all 0.6s ease;
}

.btnlogged_r span{
    text-align: right;
    font-size: 1em;
    line-height: 1em;
    border: solid transparent 2px;
    cursor: pointer; 
    padding: 2px;
    width: min-content;
    transition:all 0.3s ease;
}

.btnlogged_r span:hover {

    padding: 2px;
    border: solid #FF6009 2px;
    box-shadow: inset 0 0 0 25px #e1e1e1;
    transition:all 0.6s ease;

}

.dropdown_content {
    display: none;
    position: absolute;
    font-size: 0.8em;
    right: 10px;
    margin-top: 8px;
    background-color: #f1f1f1;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1677727!important;
    transition:all 0.6s ease;
}

.dropdown_content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}
.dropdown_content a:hover {
    color: #FF2525;
}

.dropdown_content_r {
    display: none;
    top:50px;
    position: absolute;
    font-size: 0.8em;
    right:-68px;
    margin-top: 8px;
    background-color: #f1f1f1;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1677727!important;
    transition:all 0.6s ease;
}

.dropdown_content_r a {
    color: black;
    margin: 10px;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    transition:all 0.6s ease;
}
.dropdown_content_r a:hover {
    margin: 10px;
    background-color: #ffffff;
    transition:all 0.6s ease;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
#btnlogged_r{
    background-color: #FF6009;
    transition:all 0.6s ease;
    border-radius: 50%;
}
#btnlogged_r img {
    height: 61px;
}
#btnlogged_r:hover{
    background-color: #FF6009;
    border-radius: 0%;
    box-shadow: 4px 10px 10px rgba(0,0,0,0.25);
    transition:all 0.6s ease;
}

.header-profile{

    color: #fff;
}
.header-profile_r{

    color: #707070;
}

.header-profile_r .loggedstatus{
    font-size: 0.8em; 
}

.header-profile .loggedstatus{
    font-size: 0.8em; 
}
.loggedstatus .title_bejel {
    position: absolute;
    right: 10px;
    top:-5px;

}

.header-profile_r .loggedinuser_r{
    position: absolute;
    top:12px;
    right: 10px;
    font-size: 0.6em; 
}

.header-profile_r .selectedcar_r{

    position: absolute;
    bottom:-8px;
    right: 10px;
    font-size: 0.6em;

}


.header-profile .loggedinuser{
    font-size: 0.6em; 
}

.header-profile .selectedcar{
    font-size: 0.6em;

}

.mobile-header {

    opacity: 0.97;
    /*background-color: #FFE53B;*/
    /*background-color: #FF6009;*/
    background-color: #6A6A6A;
    border-bottom: solid 4px #FF6009;
    /*background-image: linear-gradient(147deg, #FFE53B 0%, #FF2525 74%) !important;*/

}

.mobile-header-menu {
    color: #fff;
    background-color: #727272;
    /*background-color: #7E7E7E;*/
    /* background-image: linear-gradient(147deg, #7E7E7E 0%, #2B2B2B 74%);*/
    /* border-right: solid #FF6009 4px !important;*/
}

.menu-button-mobile{
    padding:10px;
    color: #fff;
    -webkit-duration: 1s;
    -moz-duration: 1s;
    -o-duration: 1s;
    transition-duration: 1s;
}
.menu-button-mobile:hover{
    background: #FF7E2F;
    color: #fff;
    border-radius: 50%;
}

.mobile-tile-container {
    margin-top: 110px;
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
}
.mobile-tile-container-subpage {
    margin-top: 10px;
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;

}

.mobile-tile {
    cursor: pointer;
    position: relative;
    padding-top: 10px;
    width: 100%;
    min-height: 80px;
    margin: auto;
    margin-bottom: 10px;
    background: #fff;
    border-radius: 5px; /* 5px rounded corners */
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    -webkit-duration: 1s;
    -moz-duration: 1s;
    -o-duration: 1s;
    transition-duration: 1s;
}

.mobile-tile .title {
    cursor: pointer;
    font-size: 1.2em;
    margin-left: 80px;
    top: 10px;
}

.mobile-tile .rest {
    cursor: pointer;
    margin-left: 80px;
    font-size: 0.9em !important;
}

.mobile-tile .logo {
    cursor: pointer;
    position: absolute;
    text-align: center;
    width: 80px;
}
.mobile-tile .logo img {
    cursor: pointer;
    max-width: 80px;
    max-height: 80px;
    padding-bottom: 20px;
}

.mobile-tile .divider {
    cursor: pointer;
    position: relative;
    border-top: 0px;
    margin: 0px !important;
    margin-top: 0px !important;
    margin-left: 5px !important; 
    margin-right: 5px !important; 
    padding:0px;
}

.mobile-tile .extra{
    cursor: pointer;
    border-top: solid 2px #FF6009;
    padding: 10px;

    transition-duration:400ms;
    -ms-transition-duration:400ms;
    -webkit-transition-duration:400ms;
    -o-transition-duration:400ms;
    -moz-transition-duration:400ms;

    transform:scale(1.0,1.0);
    -ms-transform:scale(1.0,1.0); /* IE 9 */
    -webkit-transform:scale(1.0,1.0); /* Safari and Chrome */
    -o-transform:scale(1.0,1.0); /* Opera */
    -moz-transform:scale(1.0,1.0); /* Firefox */
}

.mobile-tile:hover {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);

}

/*****************************************************************
  9. Merged shadow.css definitions 
****************************************************************/

.sh1 {
    box-shadow: 0 2px 10px rgba(0,0,0,.16),
        0 2px  5px rgba(0,0,0,.26) !important;
}
.sh2 {
    box-shadow: 0 6px 20px rgba(0,0,0,.19),
        0 8px 17px rgba(0,0,0,.20) !important;
}
.sh3 {
    box-shadow: 0 17px 50px rgba(0,0,0,.19),
        0 12px 15px rgba(0,0,0,.24) !important;
}
.sh4 {
    box-shadow: 0 25px 55px rgba(0,0,0,.21),
        0 16px 28px rgba(0,0,0,.22) !important;
}
.sh5 {
    box-shadow: 0 40px 77px rgba(0,0,0,.22),
        0 27px 24px rgba(0,0,0,.20) !important;
}