/* The Modal (background) */
.modal_hub {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width 880px;*/
    height:100%; /* Full height  550px;*/
    overflow:hidden; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
  
}

/* Modal Content/Box */
.modal-content_hub {
    background-color: #fefefe;
     /* margin: 5% auto; 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    /*width: 100%;*//*800px;*/ /* Could be more or less, depending on screen size */
    /*height:100%;*/
    width: 100%; /* Could be more or less, depending on screen size */
    height:100%;

    display:block;
    border-radius:5px;
    background-color:#f2f2f2;
    padding:20px;
    overflow:scroll;
    
}

/* Modal Content/Box */
.modal-content-familje_hub {
    background-color: #fefefe;
    margin: 5% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 1000px; /* 800px; Could be more or less, depending on screen size */
    height:90%;
    display:block;
    border-radius:5px;
    background-color:#f2f2f2;
    padding:20px;
    overflow:scroll;
    
}

.modal-title_hub 
{
	/*display:table;*/    
	overflow:scroll;
}
/* The Close Button */
.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.modal-title_hub:after  {
	    content: "";
	    display: table;
	    clear: both;
}

.footer_hub 
{
	content: "";
	         display: table;
	         clear: both;
	        /*background-color: #f1f1f1;*/
	        padding: 10px;
	        text-align: center;
	        width:100%;
}

.div_shtylla_1 
    {
	float:left;
	/*padding:10px;*/
		padding-top: 10px;
		padding-bottom: 10px;
		padding-left: 10px;
		padding-right: 5px;
	width:50%;
	/*
	position:relative;
	display:inline-block; 
	width:50%;*/
	border-style:none;
	}
	
    .div_shtylla_2
    {
	float:left;
	/*padding:10px;*/
		padding-top: 10px;
		padding-bottom: 10px;
		padding-left: 5px;
		padding-right: 10px;
	width:50%;
	/*float:left;
	position:relative;
	display:inline-block;
	width:50%;*/
	border-style:none;
	
	}
	
	.div_shtylla_3 
    {
	/*float:left;*/
	border-style:none;
    }
		
    .div_shtylla_1_familje 
    {
	float:left;
	/*padding:10px;*/
	width:33%;
	/*
	position:relative;
	display:inline-block; 
	width:50%;*/
	border-style:none;
	}
	
    .div_shtylla_2_familje
    {
	float:left;
	/*padding:10px;*/
	width:33%;
	/*float:left;
	position:relative;
	display:inline-block;
	width:50%;*/
	border-style:none;
	
	}
    .div_shtylla_3_familje
    {
	float:right;
	/*padding:10px;*/
	width:33%;
	/*float:left;
	position:relative;
	display:inline-block;
	width:50%;*/
	border-style:none;
	
	}

		[class*="fieldset"]
		{
			/*border:thick solid blue;*/
            /*border:2px;*/
		}
		[class*="legend"]
		{
			color:blue;
            
		}
		
		
	.cmb,.txt,.txtarea,.msk,.opt,[class*="fieldset"],
	#modal_title > input[type=text],
	[class*="data_hub"] 
	{
	  	  width:100%;
		  padding: 5px 5px;
		  margin: 4px 0;
		  display: inline-block;
		  border: 1px solid #ccc;
		  border-radius: 4px;
		  box-sizing: border-box;
	}
	.label 
	{
		color:#B3AFAF;}
	
	#btnnew:hover 
	{
	 cursor:pointer;
	} 
	
 	/*#txtFIELD127:focus*/
 	input[type=text]:focus
	{
	/*background-color: yellow;	*/
	}
	
	input[type=text],select 
	{
	/*	  width: 100%;
		  padding: 12px 20px;
		  margin: 8px 0;
		  display: inline-block;
		  border: 1px solid #ccc;
		  border-radius: 4px;
		  box-sizing: border-box;
	*/}
	
	#modal_title > button  
	{
		  /*width: 100px;*/
		    /*background-color: #4CAF50;*/
		      /*color: White;*/
		        /*padding: 14px 20px;
		          margin: 8px 0;
		            border: none;*/
		              /*border-radius: 4px;*/
		                /*cursor: pointer;*/
	}
	
	input[type=button]:hover 
	{
		 /* background-color: #45a049;*/
	}
	
	input:read-only      
	{
		background-color: yellow;
	}
.required {
/*border-color:red;*/
}
	input:-moz-read-only { /* For Firefox */
	    background-color: yellow;
	}
.required_error {
border-color:red;
}
	 

.div_shtylla_1_mobile     {
	float:left;
	/*padding:10px;*/
	width:96%;
	/*
	position:relative;
	display:inline-block; 
	width:50%;*/
	border-style:none;
	}
	
    .div_shtylla_2_mobile
    {
	float:left;
	/*padding:10px;*/
	width:96%;
	/*float:left;
	position:relative;
	display:inline-block;
	width:50%;*/
	border-style:none;
	
	}
    	 

#btnsave, #btnclose {
          /*text-align:center;
            border: none;
              color: white;
                padding: 14px 28px;
                  font-size: 16px;
                    cursor: pointer;
                      width:100px;
                      margin:4px 2px;*/
        }
 
        #btnsave, #btnclose {
            /*background-color: #4CAF50;*/
        } /* Green */
             #btnsave:hover, #btnclose:hover {
                cursor:pointer;
                /*background-color: #46a049;*/
            }
       /* body { margin: 0; padding: 0; border: 0; min-width: 320px; color: #777; }
        html, button, input, select, textarea, .pure-g [class *= "pure-u"] { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 1.02em; }
        p, td { line-height: 1.5; }
        ul { padding: 0 0 0 20px; }

        th { background: #eee; white-space: nowrap; }
        th, td { padding: 10px; text-align: left; vertical-align: top; font-size: .9em; font-weight: normal; border-right: 1px solid #fff; }
        td:first-child { white-space: nowrap; color: #008000; width: 1%; font-style: italic; }

        h1, h2, h3 { color: #4b4b4b; font-family: "Source Sans Pro", sans-serif; font-weight: 300; margin: 0 0 1.2em; }
        h1 { font-size: 4.5em; color: #1f8dd6; margin: 0 0 .4em; }
        h2 { font-size: 2em; color: #636363; }
        h3 { font-size: 1.8em; color: #4b4b4b; margin: 1.8em 0 .8em }
        h4 { font: bold 1em sans-serif; color: #636363; margin: 4em 0 1em; }
        a { color: #4e99c7; text-decoration: none; }
        a:hover { text-decoration: underline; }
        p { margin: 0 0 1.2em; }
        ::selection { color: #fff; background: #328efd; }
        ::-moz-selection { color: #fff; background: #328efd; }
*/
        @media (max-width:480px) {
            h1 { font-size: 3em; }
            h2 { font-size: 1.8em; }
            h3 { font-size: 1.5em; }
            td:first-child { white-space: normal; }
        }

        .inline-code { padding: 1px 5px; background: #eee; border-radius: 2px; }
        pre {
            margin: 10px 0; overflow: auto; white-space: pre; word-wrap: normal;
            border: 0 !important; padding: 8px 10px !important; line-height: 18px; background: #edf3f8;
            font-family: Consolas, 'Liberation Mono', Courier, monospace; font-size: 14px;
        }

        /* Pure CSS */
        .pure-button { margin: 5px 0; text-decoration: none !important; }
        .button-lg { margin: 5px 0; padding: .65em 1.6em; font-size: 105%; }

        input[type="text"] { border-radius: 0 !important; }