/*!
 * Start Bootstrap - Shop Item HTML Template (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

body {
    padding-top: 70px; /* Required padding for .navbar-fixed-top. Remove if using .navbar-static-top. Change if height of navigation changes. */
}
.navbar {
    /*background: rgba(0, 0, 0, 0) url("../images/header_nmhh_purple_mini.png") repeat scroll 0 0;*/
    background: #fbf9f3;
    color: #393e47;
    height: 64px;
}

.thumbnail img {
    width: 100%;
}

.ratings {
    padding-right: 10px;
    padding-left: 10px;
    color: #d17581;
}

.thumbnail {
    padding: 0;
}

.thumbnail .caption-full {
    padding: 9px;
    color: #333;
}

footer {
	/*background: rgba(0, 0, 0, 0) url("../images/header_nmhh_purple_mini.png") repeat scroll 0 0;*/
    background: #fbf9f3;
    color: #393e47;
}

.filler{
    display: table;
    margin-left: auto;
    margin-right: auto;
    min-width:1px;
}

.centered {
    display: table;
    margin-left: auto;
    margin-right: auto;    
}

.headermenu {
    display: inline-block;
    color: #393e47;
}

.flex {
    display: flex;
}

.w200 {
    width: 200px;
}

.w300 {
    width: 300px;
}

.w400 {
    width: 400px;
}

.w500 {
    width: 500px;
}

.w600 {
    width: 600px;
}

.w700 {
    width: 700px;
}

.w800 {
    width: 800px;
}

.w900 {
    width: 900px;
}

.w1000 {
    width: 1000px;
}

.w1100 {
    width: 1100px;
}
.w200,.w300,.w400,.w500,.w600,.w700,.w800,.w900,.w1000,.w1100
{
    display: table-cell;
    min-height: 1px;
    padding: 10px;
}

.footer-fix {
    background-color: #485256;
    bottom: 0;
    color: #393e47;
    height: 25px;
    position: fixed;
    top: calc(100% - 1.8em);
    width: 100%;
    /* z-index: 9999; */
}

.logo{
   background-image: url("../images/nmhh_2025_main_color_logo.png");
   background-repeat: no-repeat;
   background-size: 100% auto;
   background-origin: content-box;
   /* background-position: center top; */
   height: 38px;
   width: 225px;
   display: inline-block;
   position:fixed;
   top:10px;
   bottom:0;
   z-index: 1;
	-webkit-background-size: contain;
  	-moz-background-size: contain;
  	-o-background-size: contain;
}

.appname {
    color: #393e47;
	font-size: 20px;
	font-family: "TitilliumWeb-Bold";
    left: 200px;
    position: absolute;
    top: 1px;
}

.content{
	width: 100%;
}

div #kereso{    
    display: inline-block;
    margin-top: 1px;
}

div #kereso > h6{
	margin-top: 0;
}

div #kereso .SumoSelect{
	top: 0px;
}

.grafikon{
	margin-top: 50px;
}

.lastEdited {
    background-color: #21b159 !important;
}

.fixToggleIcons{
	
}

#userdata_min{	
    display: flex;
    float: right;
    height: 40px;
    margin: 4px;
    min-width: 134px;
    position: relative;
    right: 4px;
	top: 5px;
}

#userdata_min select{	
    background-color: #22222200;
    border-style: none;
    margin-top: -3px;
    padding: 0 0 0 0;
    text-align: center;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;    
	cursor: pointer;
}

.ui-autocomplete-loading {	
	background: rgb(255, 255, 255) url("../images/ajaxloader.gif") right center no-repeat;*/
}


.spinner-block-transparent-loading {
	background: rgba(255, 255, 255, 0) url("../images/Blocks-1s-30px.gif") right center no-repeat;
}

#userdata_pic{
    background: url("../images/custom/User-icon.png") no-repeat scroll center center / 41px auto #393e47;    
    border-radius: 20px;
    float: right;
    height: 40px;
    margin-left: 2px;
    width: 40px;
	background-position-y: 0px;
/*url("http://telefonkonyv.nmhh.hu/telefonkonyv/ImageHandlerServlet?human_id=11025&trans=0")   */
}
#userdata_name{
    color: #393e47;
    float: left;
    max-width: 250px;
    min-width: 110px;
    text-align: center;
}

#userdata_pic:hover{
	opacity: 0.5;
    filter: alpha(opacity=50);	
}

#userdata_full {
    background-color: #393e47;
    /*color: #fbf9f3;*/
    color: #393e47;
    height: 84px;
    position: absolute;
    right: 5px;
    top: 61px;
    width: 175px;
    box-shadow: 5px 5px 5px #888888;
	opacity: 0.85;
    filter: alpha(opacity=85);	    
    border-radius: 3px;
    padding: 3px;
}

img.profile{
    border-radius: 11px;
    box-shadow: 5px 5px 5px #888888;
}

input, select {
    /*height: 29px;*/
}

input[type=checkbox],
input[type=radio]{
  top   : 9px;
  margin  : 0;
  padding : 0;
}

/*GOMBOK*/
button{
    color: #fbf9f3;
    background-color: #313b45;
    border-color: #000000;
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    padding: 2px;
    position: relative;
    text-align: center;
}

button:hover{
	background-color: #7e848a;
    color: #fbf9f3;
}

.ui-dialog .ui-dialog-buttonpane button{
    color: #fbf9f3;
}

.button-white{
	background-color: #393e47;
    border-color: #3388c1;
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    padding: 2px;
    position: relative;
    text-align: center;
}
.button-white:hover{
	background-color: #CEEBFB;
}

.button-grey{
    background-color: #393e47;
    border-color: #fbf9f3;
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    color: #fbfeff;
    padding: 2px;
    position: relative;
    text-align: center;
}
.button-grey:hover{
	background-color: #fbf9f3;
    color: #000000;
}

#findtable_length [name="findtable_length"]{
    border-radius: 4px;
    border-style: ridge;
    height: 33px;
    margin-top: -2px;
}

div.top input{
	background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    color: #555;
    font-size: 14px;
    height: 34px;
    line-height: 1.42857;
    padding: 6px 12px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
}

.msgBox{
	z-index:9999 !important;
	min-width: 50px;
}

.modalBox{
	z-index:9998 !important;
	min-width: 50px;
}

.mainModal{
	z-index:2000 !important;
}


#msgBoxMessage{
	/*display: block;*/
}

/*DISABLED INPUT*/
.disabled{
    background-color: #e1e1e1 !IMPORTANT;
}

div.disableInput{
    background-color: #e1e1e1;
    border-color: #c2bebe;
    border-radius: 4px;
    border-style: solid;
    border-width: 1px;
    color: #393e47;
    min-height: 32px;
    padding: 5px;
}


.warning{
    background-color: #fcadad !IMPORTANT;
}
.info{
    background-color: #99ffc1 !IMPORTANT;
}

.word-break-break-all{
	word-break:break-all;
}
.word-break-keep-all{
	word-break:keep-all;
}

/*bootstrap*/
.panel-primary-1 {
    border-color: #b19e76;
}
.panel-primary-1 > .panel-heading {
    background-color: #b19e76;
    border-color: #b19e76;
    color: #000000;
}

.placeholdersjs{
	color: #999 !important; 
}

#viewer_content .logo {   
   background-image: url("../images/munkaterv_logo.png");
   background-repeat: no-repeat;
   background-size: 100% auto;
   background-origin: content-box; 
   background-position: center top;
   height: 54px;
   width: 225px;
   display: inline-block;
   position:relative;
	-webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
}

#viewer_content > table {
	width:100%;
	margin-bottom: 5px;
}

#viewer_content > table td {
	border: solid 1px black;
    padding-left: 3px;
    padding-right: 3px;
}

#viewer_content > table .th0{
    background-color: #0070B8;
    color: #fbf9f3;
    border: solid 1px black;
    text-align: center;
    font-size: 12px;
    padding: 5px;    
}

#viewer_content > table .th1{
    background-color: #b19e76;
    border: solid 1px black;
    text-align: center;
    font-size: 12px;
    padding: 5px;    
}

#viewer_content > table .th2{
    background-color: #CFCFCF;
    font-size: 12px;
    /*padding: 5px 5px 5px 50px;*/
}

#viewer_content > table .clear{
    background-color: #fbf9f3;
    height: 6px;
    border-left-style: none;
    border-right-style: none;
}

#viewer_content > table .hidden_row{
	display: none;
}
#userdata_group option{
    background-color: #393e47;
    color: #fbf9f3;
}

.click-icon{
    cursor: pointer;
    color:  #485256;
}

.click-icon:hover{
    color:  #004C8D;
}

.html-icon {
	background: url(../images/icon/html-icon.png);	
    background-size: 100%;
    background-repeat: no-repeat;
    display: inline-block;
}

.excel-icon {
	background: url("../images/icon/excel-icon.png");
	background-size: 100%;
    background-repeat: no-repeat;
    display: inline-block;	
}

.pdf-icon {
	background: url("../images/icon/pdf-icon.png");
	background-size: 100%;
    background-repeat: no-repeat;
    display: inline-block;	
}

.fixed-dialog{
  position: fixed; 
}
.youtube_logo{
	background: url("../images/custom/yt_logo_rgb_light.png");
	background-size: 100%;
    background-repeat: no-repeat;
    display: inline-block;		
    margin-top: 6px;
}

.korhatar_piktogram_0{
	background: url("../images/custom/korhatar/k0.png");
	background-size: 100%;
    background-repeat: no-repeat;
    display: inline-block;		
}

.korhatar_piktogram_1{
	background: url("../images/custom/korhatar/k1.png");
	background-size: 100%;
    background-repeat: no-repeat;
    display: inline-block;		
}

.korhatar_piktogram_2{
	background: url("../images/custom/korhatar/k2.png");
	background-size: 100%;
    background-repeat: no-repeat;
    display: inline-block;		
}
.korhatar_piktogram_3{
	background: url("../images/custom/korhatar/k3.png");
	background-size: 100%;
    background-repeat: no-repeat;
    display: inline-block;		
}
.korhatar_piktogram_4{
	background: url("../images/custom/korhatar/k4.png");
	background-size: 100%;
    background-repeat: no-repeat;
    display: inline-block;		
}
.korhatar_piktogram_5{
	background: url("../images/custom/korhatar/k5.png");
	background-size: 100%;
    background-repeat: no-repeat;
    display: inline-block;		
}
.korhatar_piktogram_6{
	background: url("../images/custom/korhatar/k6.png");
	background-size: 100%;
    background-repeat: no-repeat;
    display: inline-block;		
}
.art_piktogram{
	background: url("../images/custom/art.png");
	background-size: 100%;
    background-repeat: no-repeat;
    display: inline-block;		
}

.table_newitem{
	background-color: lightyellow;
}

/*USER GOMB*/
.switch {
    position: relative;
    display: block;
    width: 48px;
    height: 24px;
  }
  
  /* Hide default HTML checkbox */
  .switch input {display:none;}
  
  /* The slider */
  .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  .slider:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 2px;
    bottom: 2px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  input:checked + .slider {
    background-color: #B19E76;
  }
  
  input:checked + .slider > .glyphicon-ok {
    display:inline-block;
    color:#B19E76;
  }
  
  input:not(:checked) + .slider > .glyphicon-ok {
    display:none;  
  }
  
  input:focus + .slider {
    box-shadow: 0 0 1px #B19E76;
  }
  
  
  input:checked + .slider:before {
    -webkit-transform: translateX(24px);
    -ms-transform: translateX(24px);
    transform: translateX(24px);
  }


  .switch-label {
    position: relative;
    display: inline-block;    
    float: left;    
    margin: 4px;
  }
  /* The switcher */
  .switcher {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  .switcher:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 2px;
    bottom: 2px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  input:checked + .switcher {
    background-color: #B19E76;
  }
  
  input:checked + .switcher > .glyphicon-ok {
    display:inline-block;
    color:#B19E76;
  }
  
  input:not(:checked) + .switcher > .glyphicon-ok {
    display:none;  
  }
  
  input:focus + .switcher {
    box-shadow: 0 0 1px #B19E76;
  }
  


  
  /* Rounded sliders */
  .slider.round {
    border-radius: 34px;
  }
  
  .slider.round:before {
    border-radius: 50%;
  }
  /*USER GOMB VÉGE*/

  #ImgViewer {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
  }
  
  #ImgViewer:hover {opacity: 0.7;}
  
  /* The Modal (background) */
  .ImgViewerModal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
  }
  
  /* Modal Content (Image) */
  .ImgViewerModalContent {
    margin: auto;
    display: block;
    max-width: 92%;
    max-height: 92%;
	min-width: 50%;
    aspect-ratio: auto;
  }
  
  /* Caption of Modal Image (Image Text) - Same Width as the Image */
  #ImgViewerModalCaption {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
  }
  
  /* Add Animation - Zoom in the Modal */
  .ImgViewerModalContent, #ImgViewerModalCaption {
    animation-name: zoom;
    animation-duration: 0.6s;
  }
  
  @keyframes zoom {
    from {transform:scale(0)}
    to {transform:scale(1)}
  }
  
  /* The Close Button */
  .ImgViewerModalClose {
    position: absolute;
    top: 15px;
    right: 35px;
    color: gray;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
  }
  
  .ImgViewerModalClose:hover,
  .ImgViewerModalClose:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
  }

  .ImgViewerModalLeft{
    color: gray;
    font-size: 80px;
    font-weight: bold;
    position: absolute;
    top: 50%;
    left: 100px;
    cursor: pointer;
    }
  
.ImgViewerModalRight{
    color: gray;
    font-size: 80px;
    font-weight: bold;
    position: absolute;
    top: 50%;
    right: 100px;
    cursor: pointer;
    }

    .ImgViewerModalLeft:hover,
    .ImgViewerModalLeft:focus,
    .ImgViewerModalRight:hover,
    .ImgViewerModalRight:focus {
      color: #bbb;
      text-decoration: none;
      cursor: pointer;
    }
  
  /* 100% Image Width on Smaller Screens */
  @media only screen and (max-width: 700px){
    .ImgViewerModal-content {
      width: 100%;
    }
  }

.popover{
    z-index: 3000; 
    text-align: center;
}

.popover svg {
  width: 200px;
  height: 200px;
}