@import url('https://fonts.googleapis.com/css?family=Berkshire+Swash&display=swap');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600&display=swap&subset=latin-ext');

body{
	background: url(../img/terhessegi_vizsgalatok_czeizel_bg.jpg);
	background-repeat: no-repeat, no-repeat;
	background-position: center;
	position: relative;
	height: 1080px;
	font-family: 'Open Sans', sans-serif;
	margin: 0px;
	background-color: #c6bfc6; 
    background-attachment: fixed;
}

.p a {
	text-decoration: none;
	color: #4a4b67;
    font-weight: normal;
}

.tg {
	display: block;
	}

.mobil{
		display: none;
	}

ul .p {
	color: #4a4b67;
	font-size: 18px;
	padding-left:0px;
	text-decoration: none;
}

.body {
	width: 80%;
	max-width: 1385px;
	margin: auto;
}

h1{
	align-content: center;
	font-family: 'Berkshire Swash', cursive;
	margin: auto;
	text-align: center;
	position: absolute;
	font-size: 45px;
	top: 40px;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #4a4b67;
	border-top: 21px solid;
	padding-top: 30px;
}

.menu{
	top: 150px;	
	position: relative;
}

h2{
	color: white;
	font-weight: 600;
	margin-top: 70px;
	font-size: 18px;
}

h4{
	background-color: #4a4b67;
	color: white;
	padding: 10px 20px;
	font-size: 25px;
	margin-bottom: 0px;
	 text-transform: uppercase;
	font-weight: normal;
    margin-top: 0px;
}


.tg  {border-collapse:collapse;border-spacing:0; width: 100%;}
.tg td{font-size:14px;padding:0px 0px;border-style:solid;border-width:0px;overflow:hidden;word-break:normal;border-color:#fff;}
.tg th{font-size:14px;font-weight:normal;padding:0px 0px;border-style:solid;border-width:0px;overflow:hidden;word-break:normal;border-color:black;}
.tg .tg-0lax{text-align:right;vertical-align:bottom; width: 150px; margin-right: -10px; color: white;
    overflow: visible;}
.tg .tg-0lax p{
    padding-top: 7px;
    font-size: 15px;
    min-width: 120px;
    font-weight: bold;
    margin-right: -58px;}
.tg .tg-0pky{border-color:inherit;text-align:center; width: 156px; vertical-align:middle}

.gond {margin-top: -220px; height: 150px;}
.elso {margin-top: -220px; height: 150px;}
.masodik {margin-top: -220px; height: 150px;}
.harmadik {margin-top: -220px; height: 150px;}
.baba {margin-top: -220px; height: 150px;}


* {box-sizing: border-box}

/* Style the tab */
.tab {
  float: left;
  border: none;
  background-color: rgba(255,255,255,0.80);
  width: 30%;
  padding-top:18px;
  height: 410px;
}


#baba .tab {
    width: 35%;
    height: 645px;
    margin-bottom: 30px;
}

/* Style the buttons that are used to open the tab content */
.tab button {
  display: block;
  background-color: white, 0.8;
  color: #4a4b67;
  text-transform: uppercase; 
	font-size: 18px;
	font-weight: 600;
  padding: 10px 16px;
  width: 100%;
  border: none;
  outline: none;
  text-align: left;
  cursor: pointer;
  transition: 0.3s;
}

/* Change background color of buttons on hover */
.tab button:hover {
	background-color: #f5ccd3;
	-webkit-clip-path: polygon(0% 0%, 89.5% 0, 95% 50%, 89.5% 100%, 0% 100%);
	clip-path: polygon(0% 0%, 89.5% 0, 95% 50%, 89.5% 100%, 0% 100%);
	
}

.tab button:active {
	-webkit-clip-path: polygon(0% 0%, 89.5% 0, 95% 50%, 89.5% 100%, 0% 100%);
	clip-path: polygon(0% 0%, 89.5% 0, 95% 50%, 89.5% 100%, 0% 100%);
}

/* Create an active/current "tab button" class */
.tab button.active {
	background-color: #f5ccd3;
	-webkit-clip-path: polygon(0% 0%, 89.5% 0, 95% 50%, 89.5% 100%, 0% 100%);
	clip-path: polygon(0% 0%, 89.5% 0, 95% 50%, 89.5% 100%, 0% 100%);
}
.c{height: 10px;width: 10px; border-radius: 50%; margin: 2px 10px; background-color:#4A4B67;  display: inline-block;}

.c:hover{background-color: #e82b65;}

.p{display: inline; margin-left: 7px;}

.r{height: 12px;width: 12px; margin: 0px 21px 0px 11px; background-color:#4A4B67;  display: inline-block;}

button.tablink2{
	padding: 0px;
	cursor: pointer;
}

td.tg-0pky img {
	margin-top: 6px;
}

.tab{
	min-width: 220px;
}
/* Style the tab content */
.tabcontent {
  float: left;
  padding: 18px 18px 18px 0px;
  border: none;
  background-color: rgba(255,255,255,0.80) ;
  width: 70%;
  border-left: none;
  height: 410px;
  display: none;
}

#baba .tabcontent {
    width: 65%;
    height: 645px;
}

#baba .tabcontent > ul {
    height: 610px;
}

.tabcontent > ul{
	background-color:rgba(74,75,103,0.15);
	height: 360px;
	margin-top: 0px;
	padding-left: 0px;
	cursor: default;
	padding-top: 8px;
}

.tabcontent > ul li{
	color: #4A4B67;
	padding: 5px 10px;
	font-size: 18px;
}
/*.tabcontent > ul li .c:hover{background-color: #ff0000;}*/
.tabcontent > ul li:hover{background-color: rgba(74,75,103,0.15);}

.tabcontent > ul li:hover .c {
	background-color: #e82b65;
}

.tabcontent2 {
	width: 96%;
	display: none;
	margin: 15px 30px;
    animation: fadein 0.51s ;
    -moz-animation: fadein 0.51s ; /* Firefox */
    -webkit-animation: fadein 0.51s ; /* Safari and Chrome */
    -o-animation: fadein 0.51s ; /* Opera */
}

.tabcontent2:before {
	content:url(../img/up.png);
	display: block;
    padding-top: 1px;
    margin-top: 0px;
    height: 17px;
}

#gondozas:before {
    padding-left: 34px;
}

#elso:before {
    padding-left: 336px;
}

#masodik:before {
    padding-left: 646px;
}

#harmadik:before {
    padding-left: 956px;
}

#baba:before {
    padding-left: 1262px;
}

@keyframes fadein  {
    from {
		
        opacity:0;
    }
    to {
        opacity:1;
		
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
		opacity:0;
    }
    to {
        opacity:1;
	}
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
    }
    to {
        opacity:1;
	}
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity:1;
	}
}

.fade-item, .fade-item1, .fade-item2, .fade-item3, .fade-item4, .fade-item5, .fade-item6, .fade-item7, .fade-item8, .fade-item9 {
	display: none;
	list-style-type:none;
    color: #4a4b67;
    padding-left: 20px;
    font-weight: bold;
} 


button{
	background: none;
	border: none;
}

#nogy{display: none;}
#fog{display: none;}
#labor{display: none;}

#elso{	display: none;}
#masodik{	display: none;}
#harmadik{	display: none;}
#baba{	display: none;}

@-moz-document url-prefix() {
	.tg .tg-0lax {
		position: relative;
		top: 1px;
	}
}

@supports (-ms-ime-align:auto) {
	.tg .tg-0lax {
		position: relative;
		top: 1px;
	}
}