html,
body {
    height: 100%;
}
body {
margin: 0;
font-size: 14px;
text-align: center;
background-color:#ffffff;
background-image: url('graf/hatter3.jpg');
background-repeat:repeat;
font-family: Arial, Helvetica, sans-serif;
line-height: 20px;
}
img {max-width:100% !important;}
.kiegesztitok img {max-width:none !important;}
a { text-decoration: none; }

.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}

* {
    box-sizing: border-box;
}
/*.content {min-height:1500px;}*/
#container { max-width:100vw; width: 950px; margin: auto; background: #ffffff; text-align: left; }

.fejlec {min-height:130px;margin-bottom:10px;display:block;}
#fej1  { float:left; }
#fej1 img {max-height:124px;max-width: 200px !important;width:95%;}
#fej1a { float:right; }

#fej2 { max-width:100%;width: 950px; min-height:270px;max-height: 350px; vertical-align: middle; display:block;}

.home {margin:0px auto;}
.home li {list-style:outside none none;}

#ikon { max-width:100%; width: 950px; height: 135px; background-color:#ffffff; background-repeat:repeat-x; }

#ikon a {max-width:18%;margin:5px;}
#akcio      { background-image:url('graf/akcio1.jpg');     width: 162px; height: 133px; float: left; margin: 0 0 0 0px;     padding-top:110px; text-align: center; color:#ffffff; font-size: 14px; font-weight: bold; }
#tervezo    { background-image:url('graf/tervezo1.jpg');   width: 162px; height: 133px; float: left; margin: 0 0 0 35px;   padding-top:110px; text-align: center; color:#ffffff; font-size: 14px; font-weight: bold; }
#kalkulator { background-image:url('graf/kalkulator.jpg'); width: 140px; height:  6px; float: left; margin: 0 0 0 62.5px; padding-top:110px; text-align: center; color:#ffffff; font-size: 14px; font-weight: bold; }
#arajanlat  { background-image:url('graf/arajanlat1.jpg'); width: 162px; height: 133px; float: left; margin: 0 0 0 35px;   padding-top:110px; text-align: center; color:#ffffff; font-size: 14px; font-weight: bold; }
#garancia   { background-image:url('graf/garancia1.jpg');  width: 162px; height: 133px; float: left; margin: 0 0 0 35px;   padding-top:110px; text-align: center; color:#ffffff; font-size: 14px; font-weight: bold; }
#galeria    { background-image:url('graf/galeria1.jpg');   width: 162px; height: 133px; float: left; margin: 0 0 0 35px;   padding-top:110px; text-align: center; color:#ffffff; font-size: 14px; font-weight: bold; }

#menu { float:left; padding:40px 10px 0px; }

#tartalom { min-height: 600px; text-align:center;float:left; padding: 40px 20px 5px 20px; background: #ffffff; }

#lab  { max-width:100%; width: 900px; text-align: center; padding: 0px 0px 0px 10px; }
#lab2 { max-width:100%;width: 900px; text-align: center; font-size:80%; }

ul.menu { list-style-type: none; }
ul.menu li { padding-top: 0px; }
ul.menu a { font-family: arial, SunSans-Regular, sans-serif; font-style:regular; color:#7b87ba; font-size: 15px; font-weight:bold; text-decoration: none; }
ul.menu a:hover { color:#153b6e; }
ul.almenu { list-style-type: disc; padding-left: 15px; }
ul.almenu a { font-family: arial, SunSans-Regular, sans-serif; font-style:regular; color:#7b87ba; font-size: 13px; font-weight:normal; text-decoration: none; }
ul.almenu a:hover { color:#153b6e; }
ul.felso { background: #153b6e; padding-top: 7px;padding-bottom:7px ;padding-left:0px; }
ul.felso li { display: inline; margin:0; position: relative;}
ul.felso li a { color: #ffffff; text-decoration: none; font-size: 15px; font-weight: bold; padding:5px 12px; }
ul.felso li a:hover { color:#a3c0dc; }

ul.felso li ul {position:absolute;width:100%;background:#153b6e;padding: 5px 0}
ul.felso li ul li {display: block; padding: 0}
ul.felso li ul li a {display:block;padding:5px 12px;color:#fff;}
ul.felso li ul li:hover a {color:#a3c0dc;}
ul.felso li ul.submenu {display:none;left: 0;top:20px;z-index: 10}
ul.felso li:hover ul.submenu {display:block;}

ul.felso li.toggle {
    display: none;
}

ul.also {padding-left:0px;}
ul.also li { display: inline; margin:5px 8px;}
ul.also li a { color:#7b87ba; text-decoration: none; font-size: 15px; font-weight: bold; }
ul.also li a:hover { color:#153b6e; }

h1 { color:#153b6e; font-size: 18px; text-align: center; }
h2 { color:#153b6e; font-size: 16px; }

p.ikon_ {
  margin-top:110px;
  font-size: 14px;
  font-weight:bold;
  text-align: center;
  color:#ffffff;
}
.sidebar {float:left;background:#fff;}
#tartalom a {min-width:100px;}

.ablak th {padding-top:20px;}
.ablak .table-image {text-align:center;}
.ablak td a {text-align:center;}

.ajto .row {width:100%;display:block;}
.ajto .cell {float:left;margin:10px;height:299px;}
.cell-img {height:260px;overflow:hidden;}
.ajto {clear:both;display:inline-block;}
.ajto img {max-width:none !important;}
.ajto tr td {float:none;}
.slides {margin:0px auto;min-height:270px;padding-left:20px;}
#slideshow  { max-height: 274px; float:left;}
#slideshow2 img {max-height:274px;}
#slideshow2 { height:auto;max-height: 274px; float:left;}

.home-person{height:auto; margin-bottom: 20px}

nav#mobile { display:none;}

/* MOBILE MENU */
@media screen and (max-width: 760px) {
	nav#full {
		display:none
	}

	nav#mobile {
		background-color:#d2d2d2;
		display:block;
		margin-top:15px;
	}

	/*
	Top black bar that holds the toggle button
	*/

	nav#mobile #toggle-bar {
		line-height:55px;
		height:55px;
	}
	/*
	Toggle button #1 ("Menu")
	*/

	nav#mobile strong a {
		margin-left:30px;
		padding:5px 10px;
		color:#000000;
	}

	/*
	Toggle button #2 ("Navicon")
	*/

	nav#mobile .navicon {
		float: right;
		height: 6px;
		width: 34px;
		margin: 20px;
		border-top: 18px double #FFF;
		border-bottom: 6px solid #FFF;
		font-size:0;
	}

	/*
	The dropdown menu
	*/

	nav#mobile ul li {
		clear:both;
		list-style:none;
	}

	nav#mobile ul li a {
		display:block;
		background-color:#d2d2d2;
		text-transform:uppercase;
		letter-spacing:.2em;
		margin:2px 0;
		padding:6px 0 10px 8px;
	}

	nav#mobile ul ul {
		font-size:small;
	}

	nav#mobile ul ul li {
		margin-left:30px;
	}

	nav#mobile ul ul a {
		padding-left:8px;
	}

	nav#mobile ul ul a:before {
		content: "2192";
		padding-right:8px;
	}

    /*top menu mobile*/
    ul.felso {

    }

    ul.felso li {
        display: none;
        padding: 5px;
    }

    ul.felso li ul.submenu {
        display: block;
        position: static;
    }

    ul.felso li.toggle {
        display: block;
    }
    ul.felso.open {
        height: auto;
    }
    ul.felso.open li {
        display: block;
    }
}


@media screen and (max-width:915px) {.slides {padding-left:0px;}#slideshow{display:none} #slideshow2{float:none;margin:0px auto;}}
@media screen and (max-width:840px) {ul.felso li a {font-size:14px;}}

@media only screen and (max-width: 768px) {
    /* For mobile phones: */
    [class*="col-"] {
        width: 100%;
    }

    .fejlec {min-height:210px;}
    #fej1 {text-align:center;}
    #fej1a {text-align:center;float:none;}
    ul.felso {width:100%;}
    .home-bar {display:none !important;}
    iframe {display:none;}
    #fej2 {min-height:170px;}
    #slideshow2 {width:80vw !important;}
    #slideshow2 img {max-height:50vw;}
    #fej2 {height:60vw;}

}
@media only screen and (max-width: 630px) {
	ul.home, #ikon {width:100%;padding-left:0px;}
	.home li {width:100%;display:block;}
	#ikon {height:100%;}
	#ikon a {max-width:100%;margin:30px auto !important;text-align:center;display:block;}
	#akcio      { background-image:url('graf/akcio1.jpg');     width: 162px; height: 133px; float: none; margin: 0 auto 0px;     padding-top:110px; text-align: center; color:#ffffff; font-size: 14px; font-weight: bold; }
	#tervezo    { background-image:url('graf/tervezo1.jpg');   width: 162px; height: 133px; float: none; margin: 0 0 0 35px;   padding-top:110px; text-align: center; color:#ffffff; font-size: 14px; font-weight: bold; }
	#kalkulator { background-image:url('graf/kalkulator.jpg'); width: 140px; height:  6px; float: none; margin: 0 0 0 62.5px; padding-top:110px; text-align: center; color:#ffffff; font-size: 14px; font-weight: bold; }
	#arajanlat  { background-image:url('graf/arajanlat1.jpg'); width: 162px; height: 133px; float: none; margin: 0 0 0 35px;   padding-top:110px; text-align: center; color:#ffffff; font-size: 14px; font-weight: bold; }
	#garancia   { background-image:url('graf/garancia1.jpg');  width: 162px; height: 133px; float: none; margin: 0 0 0 35px;   padding-top:110px; text-align: center; color:#ffffff; font-size: 14px; font-weight: bold; }
	#galeria    { background-image:url('graf/galeria1.jpg');   width: 162px; height: 133px; float: none; margin: 0 0 0 35px;   padding-top:110px; text-align: center; color:#ffffff; font-size: 14px; font-weight: bold; }
	.kiegesztitok img {display:none;}
}

table.jellemzok {
    width: 100%;
    clear: both;
}

table.jellemzok tr td {
    padding: 5px 0;
}

table.jellemzok tr:nth-child(odd) td {
    background: #f4f4f4;
}

table.jellemzok tr:nth-child(even) td{

}

/*garázskapuk*/
.no-margin-bottom {
    margin-bottom: 0;
    padding-bottom: 0;
}

.no-margin-top {
    margin-top: 0;
    padding-top: 0;
}

table.garazskapuk {
    width: 100%;
}

table.garazskapuk tbody td,
table.garazskapuk thead th {
    padding: 10px;
}

table.garazskapuk tr:nth-child(odd) td {
    background: #f4f4f4;
}

table.garazskapuk tr:nth-child(even) td{

}

table.garazskapuk.osszehasonlitas thead th {
    background: #b9cbcd;
    color: #153b6e;
    font-weight: bold;
}

table.garazskapuk.osszehasonlitas tr.title td {
    background: #153b6e;
    color: #ffffff;
    font-weight: bold;
}

.txt-red {
    color: red;
}

.txt-green {
    color: #008000;
}

table.tableizer-table {
    font-size: 12px;
    border: 1px solid #CCC;
    font-family: Arial, Helvetica, sans-serif;
}
.tableizer-table td {
    padding: 4px;
    margin: 3px;
    border: 1px solid #CCC;
}
.tableizer-table th {
    background-color: #104E8B;
    color: #FFF;
    font-weight: bold;
}

.tableizer-table tr td {
    white-space: nowrap;
}