html {
  font-family: 'Open Sans', sans-serif !important;
  }
body {
	font-family: 'Open Sans', sans-serif !important;
	    overflow-x: hidden;
  }

.btn {
	border-radius: 0px !important;
	background-color: #1976d2 !important;
    border-color: #1976d2 !important;
}
	.btn-primary {
		height: 46px !important;
		line-height: 46px !important;
		font-size: 24px !important;
		padding: 0 20px 0 20px !important;
		margin: 30px auto 30px auto !important;
	}
	.btn-primary-white {
		height: 46px !important;
		line-height: 46px !important;
		font-size: 24px !important;
		padding: 0 20px 0 20px !important;
		margin: 0px 0px 0px 30px !important;
		background: transparent !important;
		border-color: #fff !important;
		color: #fff !important;
	}
	.btn.btn-primary:hover {
		background-color: #333 !important;
		border-color: #333 !important;
	}
	.btn.btn-primary-white:hover {
		border-color: #1976d2 !important;
		background-color: #1976d2 !important;
	}
.fejlec {
	z-index: 1000;
  }

nav.fomenu {
    border-radius: 0 !important;
    border: none;
    background-color: rgba(255, 255, 255, 0.8) !important;
}
.fomenu .navbar-header {
    background-color: #b8dbfd;
    margin-left: -15px !important;
}
.fomenu .navbar-brand {
    margin-left: 0 !important;
    padding: 0 15px !important;
    display: block;
    line-height: 71px;
    height: 71px;
}
.fomenu .navbar-brand {
    color: #fff !important;
}
.fomenu .navbar-nav {
    overflow: hidden;
    margin-top: 20px;
    border-top: #fff 1px solid;
}
.fomenu .navbar-nav>.active>a {
    background-color: transparent !important;
}
.fomenu .navbar-nav>li>a {
    color: #000 !important;
}
.fomenu .navbar-nav li:hover {
    background-color: #ececec !important;
}
.fomenu .navbar-nav li.active:hover {
    background-color: #1976d2 !important;
}
.fomenu .navbar-nav li:hover a {
    color: #000 !important;
}
.fomenu .navbar-nav li.active {
    background-color: #1976d2;
}
@media screen and (max-width: 767px) {
    .fomenu .navbar-collapse {
        position: absolute;
        width: 100%;
        transform: skewX(20deg);
        margin-left: 45px !important;
        background: #fff;
        text-align: center;
    }
    .fomenu .navbar-nav>li>a,
    .fomenu .navbar-nav>li>span {
        transform: skewX(0deg) !important;
    }
}
.fomenu .navbar-nav li.active span {
    display: block;
    padding: 10px 13px;
    line-height: 30px;
    height: 50px;
    color: #fff !important;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #fff !important;
}
.navbar-default{
}
.contactinfo, .unskew, .unskew:before{
	    -moz-transform: skewX(20deg);
    -webkit-transform: skewX(20deg);
    -o-transform: skewX(20deg);
    -ms-transform: skewX(20deg);
    transform: skewX(20deg);
    margin-bottom: -72px !important;
}
.contactinfo>li{
	float: left;
	margin-left: 10px;
}
.contactinfo>li:first-of-type {
    margin-left: 20px;
}
.contactinfo>li a{
	display: inline !important;
	color: black;
	padding: 10px 10px !important;
	font-size: 12px;
}
.contactinfo>li>span{
	font-size: 12px;
}
.contactinfo>li a:hover{
	color: #1976d2;
	background: none !important;
}
@media (max-width: 930px)
{
	.contactinfo{display: none !important;}
}
.fomenu .navbar-toggle {
    border-radius: 0 !important;
    padding: 16px 14px !important;
}
.fomenu .navbar-toggle .icon-bar {
    width: 30px !important;
    height: 3px !important;
}
.fomenu,
.infobox .headline,
.infobox .nextbutton,
.btn-primary,
.aboutimg .mask,
.btn-primary-white,
.almenu ul li,
.portfolioFilter a,
.isotope .isotopeinfo {
	-moz-transform: skewX(-20deg);
    -webkit-transform: skewX(-20deg);
    -o-transform: skewX(-20deg);
    -ms-transform: skewX(-20deg);
    transform: skewX(-20deg);
}
.almenu {
    margin-bottom: 30px;
}
.almenu ul {
	padding: 0;
	margin: 0;
	list-style-type: none;
	overflow: hidden;
}
	.almenu ul li {
		position: relative;
		left: -20px;
	}
    .almenu ul li:after {
        content:"";
        display: block;
        width: 100%;
        height: 1px;
        background-color: #cecece;
    }
	.almenu ul li a,
	.almenu ul li span,
    .almenu ul li a:hover {
		line-height: 40px;
        text-indent: 40px;
        display: block;
        text-decoration: none;
	}
    .almenu ul li a,
    .almenu ul li a:hover {
        color: #000 !important;
    }
	.almenu ul li.active {
		background-color: #1976d2;
		color: #fff !important;
		display: block;
	}
    .almenu ul li a:hover {
		background-color: #ececec;
		display: block;
	}
	.almenu ul li span {
		-moz-transform: skewX(20deg);
		-webkit-transform: skewX(20deg);
		-o-transform: skewX(20deg);
		-ms-transform: skewX(20deg);
		transform: skewX(20deg);
	}
.nopadding {
	padding: 0px !important;
  }

.infobox h3,
.infobox .nextbutton span,
.btn-primary span,
.btn-primary-white span,
.portfolioFilter a span,
.fomenu a,
.fomenu .navbar-nav li.active span,
.isotope .isotopeinfo p {
	-moz-transform: skewX(20deg);
    -webkit-transform: skewX(20deg);
    -o-transform: skewX(20deg);
    -ms-transform: skewX(20deg);
    transform: skewX(20deg);
	display: block;
  }
.carousel img {
	min-width: 100%;
    min-height: 400px;
  }
.affix {
      top: 0;
      width: 100%;
  }
	.affix + .container-fluid {
		padding-top: 70px;
	  }
.carousel-caption {
	text-align: left !important;
	text-shadow: 0 0 0 !important;
  }
	.carousel-caption h3 {
		font-size: 46px !important;
	  }
	.carousel-caption h3 span {
		color: #1976d2;
		font-weight: bold;
	  }
	.carousel-caption p {
		font-size: 18px !important;
	  }
@media screen and (max-width: 991px) {
    .carousel-caption h3 {
        font-size: 32px !important;
    }
}
@media screen and (max-width: 640px) {
    .carousel-caption {
        padding: 0 0 15px 0 !important;
    }
    .carousel-caption h3 {
        font-size: 28px !important;
    }
}
@media screen and (max-width: 480px) {
    .carousel-caption {
        padding: 0 0 15px 0 !important;
    }
    .carousel-caption p {
        display: none;
    }
    .carousel-caption h3 {
        font-size: 24px !important;
    }
}
.headline, .textline {
	text-align: center;
}
#rolunk .headline,
#kapcsolat .headline {
	text-align: left;
	float: left;
}
.headline h2 {
    font-weight: 300 !important;
    font-size: 38px !important;
    margin-top: 40px;
    margin-bottom: 40px;
    animation-name: elotunes;
    animation-duration: 1s;
}
@keyframes elotunes {
    from {opacity: 0; margin-left: 100%;}
    to {opacity: 1; margin-left: 0px;}
}
.headline h2:after {
    content:"";
    width: 80px;
    display: block;
    height: 2px;
    background-color: #1976d2;
    margin: 0 auto;
    margin-top: 15px;
    animation-name: pulse;
    animation-duration: 5s;
    animation-iteration-count: infinite;
}
@keyframes pulse {
    0% {opacity: 0;}
    10% {opacity: 1;}
    90% {opacity: 1;}
    100% {opacity: 0;}
}
.headlineketto h2 {
    font-weight: 300 !important;
    font-size: 22px !important;
    margin-top: 0px;
    margin-bottom: 14px;
    animation-name: elotunes;
    animation-duration: 1s;
}
.headlineketto h2:after {
    content:"";
    width: 80px;
    display: block;
    height: 2px;
    background-color: #1976d2;
    margin-top: 15px;
    animation-name: moved;
    animation-duration: 5s;
    animation-iteration-count: infinite;
}
@keyframes moved {
    0% {opacity: 0; margin-left: 50%;}
    10% {opacity: 1; margin-left: 0%;}
    90% {opacity: 1; margin-left: 0%;}
    100% {opacity: 0; margin-left: 50%;}
}
#kezdolap .textblock {
    margin-bottom: 30px;
    text-align: center;
}
@media screen and (max-width: 991px) {
    .infoblock,
    .isotopeblock {
        padding: 0px !important;
    }
}
.infobox {
	position: relative;
    margin-bottom: 20px;
}
	.infobox img,
	.contactblock img {
		width:100%;
	}
	.infobox .headbox {
		margin-top: -72px;
	}
	.infobox .headline {
		background-color: #1976d2;
		max-width: 96%;
		margin: 0px auto 20px auto;
		clear: both;
	}
	.infobox h3 {
		line-height: 46px;
		color: #fff;
		margin: 0 !important;
		font-size: 20px !important;
	}
	.infobox .nextbutton {
		width: 46px;
		height: 46px;
		display: block;	
		text-align: center;
		float: right;
		margin-right: 9px;
	}
	.infobox .nextbutton a:hover {
		background-color: #333 !important;
	}
	.infobox .nextbutton a {
		line-height: 46px;
		font-size: 24px;
		font-weight: 300;
		color: #fff;
		display: block;
		background-color: #1976d2;
		text-decoration: none;
	}
	.infobox .nextbutton span {
		height: 46px;
		line-height: 46px;
	}
	.infobox p {
        overflow: hidden;
		max-height: 110px;
        min-height: 60px;
	}
.seged {
	display: inline-block;
	height: 100%;
	width: 0px;
	}
.aboutblock {
	background-color: #ececec;
	min-height: 100%;
	margin: 10px 0px 0px 0px;
	display: table;
}
	.aboutimg {
	overflow: hidden;
	height: 100%;
	}
	.aboutimg img {
		min-height: 100%;
		min-width: 100%;
		width: auto;
		float: right;
	}
	@media screen and (max-width: 767px) {
		.aboutimg img {
			max-width: 100% !important;
		}
	} 	
	.aboutimg .mask {
		display: block;
		width: 300px;
		height: 100%;
		background-color: #ececec;
		position: absolute;
		top: 0;
		z-index: 2;
		padding: 0;
		right: -180px;
	}
	@media screen and (max-width: 991px) {
		.aboutimg .mask {
			width: 100% !important;
			height: 100% !important;
			-moz-transform: skewX(-85deg);
			-webkit-transform: skewX(-85deg);
			-o-transform: skewX(-85deg);
			-ms-transform: skewX(-85deg);
			transform: skewX(-85deg);
			display: block;
			bottom: -50%;
			position: absolute;
			right: 0;
			top: auto;
		}
	}
	.abouttext {
		display: table;	
		height: 100%;
	}
		.abouttext .inner {
			display: table-cell;
			vertical-align: middle;
			margin: auto 0;
		}
		.abouttext .textline {
			margin: 0 0;
		}
			.abouttext .textline p {
			margin: 30px 0;
			display: block;
			}
.contactblock {
		display: table;
}
	.contactbox {
		position: relative;
		width: 100%;
		height: 400px;
		top: 0;
		background: url("oldalelemek/kapcsolat-1.jpg") center center;
		}
	.contactbox .inner {
		display: table;
		width: 100%;
		height: 100%;
	}
		.contactbox .contactlink {
			vertical-align: middle;
			display: table-cell;
		}
		.contactbox .contacttext {
			font-size: 24px;
			line-height: 46px;
			color: #fff;
			display: inline-block;
			vertical-align: middle;
		}
.imgframe img {
    width: 100% !important;
    height: auto !important;
    animation-name: halvanyul;
    animation-duration: 2s;
}
@keyframes halvanyul {
    from {opacity: 0;}
    to {opacity: 1;}
}
.footer {
	background-color: #73767a;
	margin-top: -1px;
}
.footer .inner {
	padding: 30px 15px 30px 15px;
	color: #fff;
}
.footer .pages {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
.footer .pages li a:hover {
    color: #fff !important;
}
.addressbox .address {
    width: 100%;
}
.addressbox .address .ikonhely {
    width: 10%;
    text-align: left;
    display: inline-block;
    line-height: 1.8em;
    vertical-align:top;
}
.addressbox .address .databox {
    width: 80%;
    display: inline-block;
    line-height: 1.8em;
}
@media screen and (max-width: 767px) {
	.pagesbox,
	.pagesbox ul li,
	.informationbox {
			text-align: center;
		}
	.pagesbox,
	.addressbox,
	.informationbox {
			margin-bottom: 30px;
		}
	} 	
.footer .pages li {
	margin-bottom: 10px;
	display: block;
}
.footer a {
	color: #fff;
}
.footer a:hover,
.footer .pages span {
	text-decoration: underline;
    color: #fff;
}
.copyright {
	background-color: #fff;
	padding: 15px 0 15px 0;
}
.breadcrumbblock {
	background-color: #eaeaea;
	height: 90px;
    margin-top:75px;
}
.breadcrumbblock h2 {
	line-height: 90px;
	margin: 0 !important;
	display: table;
}
	.breadcrumbbox {
		height: 90px;
		line-height: 90px;
	}
	.breadcrumbbox .breadcrumb {
		float: right;
		background: none !important;
		padding: 0 !important;
		margin: 0 !important;
	}
.textblock {
    animation-name: halvanyul;
    animation-duration: 2s;
}
#rolunk .textblock,
#kapcsolat .textblock {
	clear: both;
}
#kezdooldal .textblock {
    margin-bottom: 40px;
}
#rolunk .textblock p {
	margin: 2em 0px;
}
.textblock ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
.textblock ul li .glyphicon {
	margin-right: 5px;
	color: #1976d2;
	line-height: 1.5em;
}
.contentblock {
	margin: 40px 0 40px 0;
}
#referenciak .isotopeblock {
    margin: 0px 0px 40px 0px;
    padding: 0 15px !important;
} 
.jumbotron {
	font-size: 120% !important;
	background: transparent !important;
	padding: 0 !important;
}
#lightbox .modal-content {
    display: inline-block;
    text-align: center;   
}

#lightbox .close {
    opacity: 1;
    color: rgb(255, 255, 255);
    background-color: rgb(25, 25, 25);
    padding: 5px 8px;
    border-radius: 30px;
    border: 2px solid rgb(255, 255, 255);
    position: absolute;
    top: -15px;
    right: -55px;
    
    z-index:1032;
}
table {
	width:100%;
	display: table;
}
	table tr {
		display: table-row;
	}
	table tr th,
	table tr td {
		display: table-cell;
		padding: 5px;
		height: 40px !important;
		vertical-align: midle;
		text-align: center;
	}
	table th {
		background-color: #1976d2;
		color: #fff;
	}
	table tr.even {
		background-color: #ececec;
	}
form .form-control {
    border-radius: 0 !important;
    height: 50px;
}
form .form-control#name,
form .form-control#email,
form #subject.form-control {
    height: 50px !important;
}
form textarea.form-control {
    height: 180px !important;
}
form .messageblock {
    padding-right: 0 !important;
}
@media screen and (max-width: 767px) {
    form .messageblock {
        padding-left: 0 !important;
    }
}

/* ---- ISOTOPE ---- */
.portfolioFilter {
    text-align: center;
    margin: 30px 0px 20px 0px;
    min-height: 72px;
}
.portfolioFilter a { 
	color:#666;
	text-decoration:none;
    line-height: 40px;
    border: #1976d2 1px solid;
    display: inline-block;
    width: 120px;
    margin-left: -5px;
    margin-bottom: 10px;

}
.portfolioFilter a:hover {
    text-decoration: none;
}
.portfolioFilter a.current { 
    font-weight: normal;
    background-color: #1976d2;
    color: #ffffff;
    text-decoration: none;
}


.isotope img {
    margin: 1%;
    max-width: 98%;
}

.isotope-item {
    z-index: 2;
    margin-left: -1px;
}

.isotope-hidden.isotope-item {
    pointer-events: none;
    z-index: 1;
}
.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */

    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    transition-duration: 0.8s;
}
.isotope {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    transition-property: height, width;
}
.isotope .isotope-item {
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform, opacity;
    transition-property: transform, opacity;
}
.isotope .isotopeinfo {
    background-color: #1976d2;
    color: #fff;
    margin: -20px auto 0 auto;
    width: 90%;
    z-index: 100;
    display: block;
    position: relative;
    padding: 2% 3% 3% 3%;
    max-height: 85px;
    overflow: hidden;
    display: none;
}
.isotope .isotopeinfo p {
    color: #fff;
    margin: 0;
}
.isotope .isotopeinfo .isotext {
    font-size: 90%;
}