@font-face {
    font-family: SegoeUI;
    src:
        local("Segoe UI Light"),
        url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/light/latest.woff2) format("woff2"),
        url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/light/latest.woff) format("woff"),
        url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/light/latest.ttf) format("truetype");
    font-weight: 100;
}

@font-face {
    font-family: SegoeUI;
    src:
        local("Segoe UI Semilight"),
        url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/semilight/latest.woff2) format("woff2"),
        url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/semilight/latest.woff) format("woff"),
        url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/semilight/latest.ttf) format("truetype");
    font-weight: 200;
}

@font-face {
    font-family: SegoeUI;
    src:
        local("Segoe UI"),
        url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/normal/latest.woff2) format("woff2"),
        url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/normal/latest.woff) format("woff"),
        url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/normal/latest.ttf) format("truetype");
    font-weight: 400;
}

@font-face {
    font-family: SegoeUI;
    src:
        local("Segoe UI Bold"),
        url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/bold/latest.woff2) format("woff2"),
        url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/bold/latest.woff) format("woff"),
        url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/bold/latest.ttf) format("truetype");
    font-weight: 600;
}

@font-face {
    font-family: SegoeUI;
    src:
        local("Segoe UI Semibold"),
        url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/semibold/latest.woff2) format("woff2"),
        url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/semibold/latest.woff) format("woff"),
        url(//c.s-microsoft.com/static/fonts/segoe-ui/west-european/semibold/latest.ttf) format("truetype");
    font-weight: 700;
}

/*
@font-face {
    font-family: SegoeUI;
    src:
        local("Segoe UI Light"),
        url(//fonts/SegoeUI_we_light.woff2) format("woff2"),
        url(/fonts/SegoeUI_we_light.woff) format("woff"),
        url(//fonts/SegoeUI_we_light.ttf) format("truetype"),
    font-weight: 100;
}

@font-face {
    font-family: SegoeUI;
    src:
        local("Segoe UI Semilight"),
        url(//fonts/SegoeUI_we_semilight.woff2) format("woff2"),
        url(//fonts/SegoeUI_we_semilight.woff) format("woff"),
        url(//fonts/SegoeUI_we_semilight.ttf) format("truetype"),
    font-weight: 200;
}

@font-face {
    font-family: SegoeUI;
    src:
        local("Segoe UI"),
        url(//fonts/SegoeUI_we_normal.woff2) format("woff2"),
        url(//fonts/SegoeUI_we_normal.woff) format("woff"),
        url(//fonts/SegoeUI_we_normal.ttf) format("truetype"),
    font-weight: 400;
}

@font-face {
    font-family: SegoeUI;
    src:
        local("Segoe UI Bold"),
        url(//fonts/SegoeUI_we_bold.woff2) format("woff2"),
        url(//fonts/SegoeUI_we_bold.woff) format("woff"),
        url(//fonts/SegoeUI_we_bold.ttf) format("truetype"),
    font-weight: 600;
}

@font-face {
    font-family: SegoeUI;
    src:
        local("Segoe UI Semibold"),
        url(//fonts/SegoeUI_we_semibold.woff2) format("woff2"),
        url(//fonts/SegoeUI_we_semibold.woff) format("woff"),
        url(//fonts/SegoeUI_we_semibold.ttf) format("truetype"),
    font-weight: 700;
}
*/






	/* Reset */

	html,
	body {
		width: 100%;
		height: 100%;
		margin: 0;
		padding: 0;
		font-family:SegoeUI;
	}


	/* Essentials */

	.container {
	  display: table;
	}

	.content {
	  display: table-row;
	  height: 100%;

	}

	.content-body {
	  display: table-cell;
	}

	/* Aesthetics */

	.container {
		width: 100%;
		height: 100%;
		padding:0px;
		max-width:400px;
		max-height:100%;
		/*border: 1px solid #00ff00;*/
		text-align: center;
	}

	.header,
	.footer {
	  padding: 0px 0px;
	  margin: 0px;
	  background: #f7f7f7;

	}

	.content-body {
	  padding: 0px;
	  background: #e7e7e7;
	}








	/* Style the tab */
	.tab {
	  overflow: auto;
	  border: 0px solid #ccc;
	  /*background-color: #f1f1f1;*/
	  width:100%
	}

	/* Style the buttons that are used to open the tab content */
	.tab button {
	  background-color: #ffffff;
	  float: left;
	  border: none;
	  outline: none;
	  cursor: pointer;
	  padding: 5px 0px;
	  transition: 0.3s;
	  width:20%;
	  
	}

	/* Change background color of buttons on hover */
	.tab button:hover {
	  background-color: #ddd;
	}

	/* Create an active/current tablink class */
	.tab button.active {
	  background-color: #ffffff;
	}

	.tablinks
	{
		font-family:'SegoeUI';
		font-weight:normal;
		font-size:14px;
		vertical-align:baseline;
		line-height:15px;
	}

	/* Style the tab content */
	.tabcontent {
		display: table-cell;
		display: none;
		border: 0px solid #ff0000;
		/*border-bottom: none;*/
		height: 100%;
		font-family:'SegoeUI';
		margin: 0px;
		padding: 0px;
		/*background: #e7e7e7;*/
	}



	.actual_ok {
		border: 0px solid #ff0000;

	}

	.actual_error {
		border: 1px solid #ff0000;

	}





	/* Style the tab */
	.tabWeek {
	  overflow: none;
	  border: 0px solid #ccc;
	  /*background-color: #f1f1f1;*/
	  width:100%;
	  margin: 0px;
	  padding: 0px;
	}

	/* Style the buttons that are used to open the tab content */
	.tabWeek button {
		border-radius: 20px;
		background-color: #eeeeee;
		float: left;
		border: 3px solid #eeeeee;
		outline: none;
		cursor: pointer;
		padding: 0px;
		transition: 0.3s;
		width:31%;
		margin: 1%;
		font-family:'SegoeUI';
		color:#686868;
			/*border: 3px solid #ffffff;*/
				

	}

	/* Change background color of buttons on hover */
	.tabWeek button:hover {
	  background-color: #eeeeee;
	}

	/* Create an active/current tablink class */
	.tabWeek button.active {
		background-color: #00934a;
		border: 3px solid #89c074;
		color:#fff;
					
	}

	.tablinksWeek {
		font-family:'SegoeUI';
		font-weight:normal;
		font-size:12px;
		vertical-align:baseline;
		line-height:18px
	}

	/* Style the tab content */
	.tabcontentWeek {
		display: table-cell;
		display: none;
		border: 0px solid #ff0000;
		/*border-bottom: none;*/
		/*height: 100%;*/
		font-family:'SegoeUI';
		margin: 0px;
		padding: 0px;
		/*background: #e7e7e7;*/
	}








	/* Style the tab */
	.tabMonth {
	  overflow: none;
	  border: 0px solid #ccc;
	  /*background-color: #f1f1f1;*/
	  width:100%;
	  margin: 0px;
	  padding: 0px;
	}

	/* Style the buttons that are used to open the tab content */
	.tabMonth button {
		border-radius: 20px;
		background-color: #eeeeee;
		float: left;
		border: 3px solid #eeeeee;
		outline: none;
		cursor: pointer;
		padding: 0px;
		transition: 0.3s;
		width:31%;
		margin: 1%;
		font-family:'SegoeUI';
		color:#686868;
	}

	/* Change background color of buttons on hover */
	.tabMonth button:hover {
	  background-color: #eeeeee;
	}

	/* Create an active/current tablink class */
	.tabMonth button.active {
		background-color: #00934a;
		border: 3px solid #89c074;
		color:#fff;
	}

	.tablinksMonth {
		font-family:'SegoeUI';
		font-weight:normal;
		font-size:12px;
		vertical-align:baseline;
		line-height:18px
	}

	.tabcontentMonth {
		display: table-cell;
		display: none;
		border: 0px solid #ff0000;
		/*border-bottom: none;*/
		/*height: 100%;*/
		font-family:'SegoeUI';
		margin: 0px;
		padding: 0px;
		/*background: #e7e7e7;*/
	}








	/* Style the tab */
	.tabYear {
	  overflow: none;
	  border: 0px solid #ccc;
	  /*background-color: #f1f1f1;*/
	  width:100%;
	  margin: 0px;
	  padding: 0px;
	}

	/* Style the buttons that are used to open the tab content */
	.tabYear button {
		border-radius: 20px;
		background-color: #eeeeee;
		float: left;
		border: 3px solid #eeeeee;
		outline: none;
		cursor: pointer;
		padding: 0px;
		transition: 0.3s;
		width:31%;
		margin: 1%;
		font-family:'SegoeUI';
		color:#686868;
	}

	/* Change background color of buttons on hover */
	.tabYear button:hover {
	  background-color: #eeeeee;
	}

	/* Create an active/current tablink class */
	.tabYear button.active {
		background-color: #00934a;
		border: 3px solid #89c074;
		color:#fff;
	}

	.tablinksYear {
		font-family:'SegoeUI';
		font-weight:normal;
		font-size:12px;
		vertical-align:baseline;
		line-height:18px
	}

	.tabcontentYear {
		display: table-cell;
		display: none;
		border: 0px solid #ff0000;
		/*border-bottom: none;*/
		/*height: 100%;*/
		font-family:'SegoeUI';
		margin: 0px;
		padding: 0px;
		/*background: #e7e7e7;*/
	}




	/* Style the tab */
	.tabAll {
	  overflow: none;
	  border: 0px solid #ccc;
	  /*background-color: #f1f1f1;*/
	  width:100%;
	  margin: 0px;
	  padding: 0px;
	}

	/* Style the buttons that are used to open the tab content */
	.tabAll button {
		border-radius: 20px;
		background-color: #eeeeee;
		float: left;
		border: 3px solid #eeeeee;
		outline: none;
		cursor: pointer;
		padding: 0px;
		transition: 0.3s;
		width:31%;
		margin: 1%;
		font-family:'SegoeUI';
		color:#686868;
	}

	/* Change background color of buttons on hover */
	.tabAll button:hover {
	  background-color: #eeeeee;
	}

	/* Create an active/current tablink class */
	.tabAll button.active {
		background-color: #00934a;
		border: 3px solid #89c074;
		color:#fff;
	}

	.tablinksAll {
		font-family:'SegoeUI';
		font-weight:normal;
		font-size:12px;
		vertical-align:baseline;
		line-height:18px
	}

	.tabcontentAll {
		display: table-cell;
		display: none;
		border: 0px solid #ff0000;
		/*border-bottom: none;*/
		/*height: 100%;*/
		font-family:'SegoeUI';
		margin: 0px;
		padding: 0px;
		/*background: #e7e7e7;*/
	}


	input[type="date"] {
		font-size:20px;
		padding-top:0px;
		padding-bottom:0px;
		padding-left:5px;
		padding-right:5px;
		font-family:'SegoeUI';
		font-weight:light; 
		 -webkit-border-radius: 30px;
	}

	input[type="week"] {
		font-size:20px;
		padding-top:0px;
		padding-bottom:0px;
		padding-left:5px;
		padding-right:5px;
		font-family:'SegoeUI';
		font-weight:light; 
		 -webkit-border-radius: 30px;
	}

	input[type="month"] {
		font-size:20px;
		padding-top:0px;
		padding-bottom:0px;
		padding-left:5px;
		padding-right:5px;
		margin:0px;
		font-family:'SegoeUI';
		font-weight:light; 
		 -webkit-border-radius: 30px;
	}

	select {
		font-size:20px;
		padding-top:0px;
		padding-bottom:0px;
		padding-left:5px;
		padding-right:5px;
		font-family:'SegoeUI';
		font-weight:light; 
	}



	#div_register {
		position:relative;
		height:100%; 
		width:100%;
	}



	#nyomomu_hatter {
		border-radius: 10px;
		background: #f8f8f8;
		padding: 0px 0px 0px 0px;
		/*width: 100%;
		height: 100%;*/
		margin: 5px 10px 5px 10px;
		border: 1px solid #f8f8f8;
		display: block;
	}

	#label_gepneve {
		border-radius: 10px;
		border: 1px solid #cccccc;
		background: #ffffff;
		padding: 6px; 
		margin: 10px 20px 10px 20px;
	}

	#label_munkaneve {
		border-radius: 10px;
		border: 1px solid #cccccc;
		background: #ffffff;
		padding: 6px; 
		margin: 10px 20px 20px 20px;
	}

	#label_nyomda {
		background:url(imgs/nyomomu_bg_1.png);
		background-size: 100%; 
		background-repeat: no-repeat;
		text-align:center;
		border: 0px solid #ffcc00;
		margin: 20px 20px 20px 20px;
		
		min-height: 300px; 
		/*width:100%;
		height:100%;*/
	}


	.button {
		background:#686868;
		border: 1px solid #686868;
		position: absolute;
		left: 0%;
		top: 0%;
		opacity:1;
		border-radius: 50%;
		color:#FFF;
		font-family:'SegoeUI';
		font-size:100%;
		font-weight:bold;
		/*box-shadow: 2px 3px 10px #000000;*/

	}

	.button_active {
		background:#00934a;
		border: 1px solid #00934a;
		position: absolute;
		left: 0%;
		top: 0%;
		opacity:1;
		border-radius: 50%;
		color:#FFF;
		font-family:'SegoeUI';
		font-size:100%;
		font-weight:bold;
		/*box-shadow: 2px 3px 10px #000000;*/
	}

	#label_sebesseg {
		position:absolute ;
		text-align:center;
		border-radius: 10px;
		border: 1px solid #cccccc;
		background: #ffffff;
		padding: 5px;
		width: 30% ; 	
		height: 35%;
		/*margin:88px;*/
		box-shadow: 2px 3px 10px #000000;
		/*
		float:none;
		display: inline-block;
		z-index:11;
		margin:55px;*/
	}
	.button_kozpontidob_off {
		background-color: #b86565;
		border-radius: 50%;
		border: 5px solid #686868;
		/*box-shadow: 2px 3px 10px #000000;*/
	}

	.button_kozpontidob {
		background-color: #c3c3c3;
		border-radius: 50%;
		border: 5px solid #686868;
		/*box-shadow: 2px 3px 10px #000000;*/
	}

	.button_kozpontidob_active {
		background-color: #00934a;
		border-radius: 50%;
		border: 5px solid #89c074;
		/*box-shadow: 2px 3px 10px #000000;*/
	}

	.kozpontidob {
		/*position:relative;*/
		float: none;
		background-color: #c3c3c3;
		border-radius: 50%;
		display: inline-block;
		border: 5px solid #686868;
		margin: 40px;
		z-index:10;
		
	}

	.kozpontidob_active {
		height: 100%;
		width: 100%;
		background-color: #00934a;
		border-radius: 50%;
		border: 5px solid #89c074;
		display: block;
		/*border: 5px solid #686868;*/
		/*top:214px;
		left:90px;*/
		/*margin:40px;*/
		z-index:10;
		/*width: 55%;
		height: 200px;*/
	}


	.bigbutton1 {
		border-radius: 10%;
		background: #eeeeee;
		border: 3px solid #eeeeee;
		padding: 0px; 
		margin: 0px;	
		width: 90%;
		height: 90%;  
	}

	.bigbutton1.active {
	  background: #00934a;
		border: 3px solid #89c074;
	}

	.dot {
	  height: 32px;
	  width: 32px;
	  background-color: #bbb;
	  border-radius: 50%;
	  display: inline-block;
		border: 5px solid #686868;

	}

	.dot2 {
	  height: 32px;
	  width: 32px;
	  background-color: #bbb;
	  border-radius: 50%;
	  display: inline-block;
		border: 5px solid #ffccdd;

	}