body .navbar-nav{float:right; height:66px;}

html body{
	font-family:Roboto;
}
.clear{	clear:both;
}

.t{ display:table; }
.r{ display:table-row; }
.c{ display:table-cell; }
.w100{ width:100%; }
.w100x{ width:100%; max-width:1280px; margin: 0 auto;}
.bot{ vertical-align:middle; }

.line {
	background-color: gray;
	height: 1px;
	margin: 0 auto;
	opacity: 0.2;
	width: 300px;
}


/* -------s5------- */
.s5 .textContentRight{ text-align:left; }
.s5 .textContentLeft{ text-align:right; }
.s5 .textContentRight span{ font-size:24px; }
.s5 .textContentLeft span{ font-size:24px; }
.s5 .textContentLeft ,.s5 .textContentRight {
	position:relative; top:29px; left:0;
}
.s5 .imgContentLeft{ text-align:center; }
.s5 .imgContentRight{ text-align:center; }
@media (max-width: 935px) {
	.s5 .displayDesktop{display:none;}
	.s5 .displayMobile{display:block;}
}
@media (min-width: 935px) {
	.s5 .displayDesktop{display:block;}
	.s5 .displayMobile{display:none;}
}

.s5 .imgContent{ text-align: center; width:50px; position:relative; top:0; left:0;}
.s5 .imgContent img{ position:relative; top:0; left:0;  display: inline-block;}
.s5 .imgContent img.hline{ position:absolute; top:-105px; left:0;  display: inline-block;}
.s5 .r.r0 .imgContentLeft{
	background-image:url("../images/5-vlinez.png");
	background-repeat: no-repeat;
	background-position: right center;
}
.s5 .r.r0 .imgContentRight{
	background-image:url("../images/5-vlinek.png");
	background-repeat: no-repeat;
	background-position: left center;
}
.s5 .r.r0 .imgContent{
	background-image:url("../images/5-vlinezk.png");
	background-repeat: no-repeat;
	background-position: center center;
}
.s5 .plusWrapper{
	width:50px;
	position:relative; top:0; left:0;  display: inline-block;
}
.s5 .plusWrapper img{
	left: -8px;
	position: absolute;
	top: -44px;
	z-index: 1;
}



.imgContentWrapper{
	width:50px;
	display: inline-block;
	position:relative; top:0; left:0;
}


.s5 .r{ height:115px;  }
.s5 .bot { padding: 0 10px; }
.s5 .textContent  { width: 45%; }

/* ---------------- */
.s1{
	color:white;
}
.s1 h1 {
	font-size:48px;
	line-height:60px;
	text-transform:uppercase;
	text-align:center;

}
.s1 h1.first {
	margin-top: 60px;
}

.s1 p.middleText{
	font-size:30px;
	line-height:auto;
	text-align:center;
}

.s1 ul.middleUl {

	text-align:center;


}

.s1 ul.middleUl li{
	font-size:30px;
	font-weight:light;
	line-height:48px;
	list-style-type:none;
	list-style-position: inside;
}
.s1 ul.middleUl li:before{
	content:"\2605";
}

.s1 a.gorgeto{
	font-size:30px;
	line-height:auto;
	font-weight:bold;
	text-transform:uppercase;
	cursor: pointer;
	display:inline-block;
	border:7px solid white;
	color:white;
	padding:23px 25px;
	margin:0 auto;
	text-decoration:none;

}
.s1 a.gorgeto:hover{
	background-color:#f6efdf;
	border-color:#f6efdf;
	opacity: 0.8;
}


.s1 h1 {				background-image:url("../images/zaszlohatter.png"); padding:6px;	}
.s1 p.middleText{	background-image:url("../images/zaszlohatter.png");	padding:6px;}
.s1 ul.middleUl li{	background-image:url("../images/zaszlohatter.png");	padding:6px;}
.s1 a.gorgeto{ 		background-image:url("../images/zaszlohatter.png");	}
.s1 > ul {

	white-space:nowrap;
	/*  display: inline-block;*/
}

@media (max-width: 1050px) {
	.s1 h1 {				font-size:36px;	line-height:38px;	 padding: 0; margin:0 }
	.s1 p.middleText{	font-size:20px;	line-height:24px;	}
	.s1 ul.middleUl li{	font-size:20px;	line-height:24px;	}
	.s1 a.gorgeto{ 		font-size:22px;	line-height:26px;	}
}
@media (max-width: 768px) {
	.bgImageSlider .s1 h1.first{	margin-top: 30px;}
	.s1 h1 {				font-size:28px;	line-height:30px;	}
	.s1 p.middleText{	font-size:14px;	line-height:16px;	}
	.s1 ul.middleUl li{	font-size:14px;	line-height:16px;	}
	.s1 a.gorgeto{ 		font-size:14px;	line-height:16px;	}
}
@media (max-width: 610px) {
	.bgImageSlider .s1 h1{				font-size:24px;	line-height:28px; 	}
	.bgImageSlider .s1 p.middleText{	font-size:12px;	line-height:14px;	}
	.bgImageSlider .s1 ul.middleUl li{	font-size:12px;	line-height:14px;	}
	.bgImageSlider .s1 a.gorgeto{ 		font-size:12px;	line-height:14px;	}
	body .s1 .text-center{ display:none;}
}

@media (max-width: 640px) {
	.s1 h1{ font-size: 28px; }
}



/* s2 */
.s2 h2{
	font-size:36px;
	line-height:auto;
	text-align:center;
	font-weight:medium;
	color:#656565;

}


.s2 p.titleSubText {
	font-size:18px;
	line-height:auto;
	text-align:center;
	font-weight:light;
	color:#656565;

}

.s2 .boxes{
	max-width:1280px;
	margin: 0 auto;

}
.s2 .boxes:after{
	content:"";
	clear:both;

}
.s2 .box{
	position:relative;
	top:0;
	left:0;

	margin-left: 78px;
}
.s2 .box > img {
	left: -65px;
	position: absolute;
}

.s2 .box h3{
	font-size:28px;
	line-height:20px;
	font-weight:regular;
	color:#656565;

	text-decoration: solid #e5e5e5 underline;
}

.s2 p.text{
	font-size:16px;
	line-height:24px;
	font-weight:light;
	color:#656565;
}

.s3 {
	background-image: url("../images/s3bg.png");
}
.s3 h2{
	text-align:center;
	font-size: 36px;
}
.s3 .titleSubText{
	text-align:center;
	font-size: 18px;
}
.s3 .roundsWrapper{
	width:60%;
	margin:0 auto;
	max-width: 800px;
	left: 0; position: relative;top: 0;
}
.roundsWrapper::after {
	clear: both;
	content: "";
	display: block;
	width: 100%;
}
.s3 .left{width:80%; float:left;}
.s3 .right{width:80%;  right: 0; position: absolute;top: 0;}
.s3 .left .bLeft{text-align: left; border-left: 4px solid #2693cc; left: 0; position: relative;top: 0;}
.s3 .right .bRight{ text-align: right; border-right:4px solid #8dc63f; left: 0; position: relative;top: 0;}
.s3 .left .bLeft .wr{display:inline-block; }
.s3 .right .bRight .wr{display:inline-block; }

.s3 .bAlap{ width:250px ; height:250px; border-radius:125px;  vertical-align:middle; text-align:center; display:table-cell;}
.s3 .left .bLeft .bAlap{       background-image: url("../images/s3bg.png"); border:4px solid #2693cc; background-color: white; line-height:36px; font-size:26px; text-transform:uppercase;}
.s3 .right .bRight .bAlap{       background-image: url("../images/s3bg.png"); border:4px solid #8dc63f; background-color: white; line-height:36px; font-size:26px; text-transform:uppercase;}
.s3 .left .bLeft>div{ }
.s3 .right .bRight>div{}
.s3 .left .bLeft>div.b0{}
.s3 .right .bRight>div.b0{}


.s3 .left .bLeft .wr{
	left: -125px;
	position: relative;
	top: 0;
}
.s3 .left .bLeft .b{
	white-space:nowrap;

	left: -37px;
	position: relative;
	top: 0;
	margin:15px 0 40px;
	font-size:24px;
}
.s3 .left .bLeft .b>img {
	background-image: url("../images/s3bg.png");
	margin-right: 12px;
	display:inline-block;
}

.s3 .right .bRight .wr{
	left: 125px;
	position: relative;
	top: 0;
}
.s3 .right .bRight .b{
	white-space:nowrap;
	left: 37px;
	position: relative;
	top: 0;
	margin:15px 0 40px;
	font-size:24px;
}
.s3 .right .bRight .b>img {
	background-image: url("../images/s3bg.png");
	margin-left: 12px;
	display:inline-block;
}
.s3 .roundsWrapper .b > span {
	text-transform: capitalize;
}

@media (max-width: 1100px) {
	.s3 .left .bLeft .b,.s3 .right .bRight .b { font-size: 18px; }
}
@media (max-width: 890px) {
	.s3 .left .bLeft .b,.s3 .right .bRight .b { font-size: 12px; }
}
@media (max-width: 640px) {
	.s3 .left .bLeft .b  span{ position:relative; top:-12px; left:0; }
	.s3 .right .bRight .b span{ position:relative; top:12px; left:0; }

	.s3 .bAlap {width: 150px; height: 150px; }
	.s3 .right .bRight .bAlap,.s3 .left .bLeft .bAlap{font-size:12px; }
	.s3 .left .bLeft .wr { left: -76px;}
	.s3 .right .bRight .wr { left: 76px;}
	.s3 .roundsWrapper{width: 62%;}
	.s3 .right,.s3 .left { width: 105%;}
	.s3 .right .bRight .b > img{ margin-left: 2px; }
	.s3 .left .bLeft .b > img{ margin-right: 2px; }
}

.s2  .titleSubText,
.s3  .titleSubText,
.s4  .titleSubText,
.s5  .titleSubText,
.s6  .titleSubText
{padding-bottom:40px;}


.s3  h2 {
	color: #656565;
	text-align: center;
}
.s3  .line{
	color: #656565;
	text-align: center;
}
.s3 > .titleSubText{
	color: #656565;
	text-align: center;
}

.s5 > h2 {
	color: #656565;
	text-align: center;
	font-size: 36px;
}
.s5 > .line{
	color: #656565;
	text-align: center;
}
.s5 > .titleSubText{
	color: #656565;
	text-align: center;
	font-size:18px;
}

.s6 > h2 {
	color: #656565;
	text-align: center;
	font-size: 36px;
}
.s6 > .line{
	color: #656565;
	text-align: center;
}
.s6 > .titleSubText{
	color: #656565;
	text-align: center;
	font-size: 18px;
}
.containerxxxx{
	background-image: url("../images/s5bg.png");
	padding: 20px 0;
}
.s1, .s2, .s3, .s4, .s5, .s6 .s7 .s8{
	padding:30px 0;
}


/* s4 */
.s4::before {
	content: "1";
	display: block;
	font-size: 0;
	height: 0;
}
.s4{
	background-image: url("../images/s4-bg.jpg");
	padding-bottom:90px;
	background-position: center center;
}

.s4  h2 {
	color: white;
	text-align: center;
	font-size: 36px;
}
.s4  .line{
	color: white;
	text-align: center;
}
.s4  .titleSubText{
	color: white;
	text-align: center;
	font-size: 18px;
}


.s4 .tableWrapper{
	width:60%;
	max-width:800px;
	margin:0 auto;
	display:table;
	border-left:3px solid #f4f4f4;
	border-bottom:3px solid #f4f4f4;
	left: 0; position: relative;top: 0;
	padding-top: 40px;
}
.s4 .tableWrapper .up{
	position: absolute; left: -8px; top: -10px;
}
.s4 .tableWrapper .right{
	position: absolute; right: -10px; bottom: -7px;
}

.s4 .dataDiagram{
	left: 0; position: relative;top: 0;
	display: table-row;
}

.s4  .text{
	position: absolute; left: 20px;  top: 0;
	color:white;
	font-size:18px;
	text-transform:uppercase;
	white-space: nowrap;
}
.s4 .textBotttom{
	position: absolute; left: 0px; bottom: -65px;
	color:white;
	font-size:18px;
	text-transform:uppercase;
}
.s4 .dataDiagram  .dataContent{
	width:33%;
	/*float:left;*/
	display:table-cell;
	vertical-align:bottom;
	padding-left: 60px;
}

.s4 .dataDiagram  .dataContent .data{
	width:70px;

	background-color:#2693cc;
	left: 0; position: relative;top: 0;
}
.s4 .dataDiagram   .dataContent .data.dataHeightFull{ height:225px;}
.s4 .dataDiagram   .dataContent .data.dataHeightMidium{ height:130px;}
.s4 .dataDiagram   .dataContent .data.dataHeightLow{ height:60px;}

.s4 .dataDiagram   .dataContent .data .dataText{
	left: 70px; position: absolute;top: 0;
	white-space: nowrap;
	padding:5px 8px;
	display: inline-block;
	background-image: url("../images/zaszlohatter.png");
	font-size:18px;
	color:white;
}
.s4 .cont {
	left: 0;
	position: relative;
	top: 0;
	z-index: 20;
}

@media (max-width: 640px) {
	.s4 .dataDiagram  .dataContent{
		padding-left: 20px;
	}
	.s4 .dataDiagram .dataContent .data{width: 50px;}
	.s4 .dataDiagram .dataContent .data .dataText{ left: 50px;}
}


/* s5 mobile */
.s5 .displayMobile .t0{
	margin:0 40px;
}
.s5 .displayMobile  .numberContent {
	height: 28px;
	width: 28px;
	border-radius:14px;
	padding:3px 8px;
	font-size:13px;
	background-color:white;
}
.s5 .displayMobile .ari  .numberContent {
	border: 2px solid #2693cc;
}
.s5 .displayMobile .ale  .numberContent {
	border: 2px solid #8dc63f;
}
.s5 .displayMobile .numberContentWrapper{
	height: 28px;
	width: 28px;
}

.s5 .displayMobile .ari .numberContentWrapper{
	position: absolute;
	top: -14px;
	right: -15px;

}
.s5 .displayMobile .ale .numberContentWrapper{
	position: absolute;
	top: -14px;
	left: -15px;
}
.s5 .displayMobile .ro{
	position:relative; top:0;left:0;
	padding-bottom:30px;
}

.s5 .displayMobile .r0{
	border-right:2px solid #2693cc;
}
.s5 .displayMobile .r1{
	position:relative; top:0;left:0;
	border-right:2px solid #2693cc;
	border-left:2px solid #8dc63f;
}
.s5 .displayMobile .r2{
	border-left:2px solid #8dc63f;
}
.s5 .displayMobile .r3{
}
.s5 .displayMobile .ari.r2 .numberContentWrapper{
	right: -13px;
}
.s5 .displayMobile .ale.r3 .numberContentWrapper{
	left: -13px;
}

/*
.s5 .displayMobile .r2.ari  .numberContentWrapper{
position:relative; top:0;right:-2px;
}
.s5 .displayMobile .r3 .numberContentWrapper{
position:relative; top:0;left:2px;
}
*/
.s5 .displayMobile .ari{
	text-align:right;
}
.s5 .displayMobile .ale.r1{
	border-left:2px solid #8dc63f;

	text-align:left;
}
.s5 .displayMobile .ro .textContent {
	width:100%;
	position: relative;
	top: -10px;
	padding:0 20px;

}
.s5 .displayMobile .t0 {
	margin-top: 25px;
}
.s5 .displayMobile .ro .textContentRight{
	text-align: right;
	color:#2693cc;

}
.s5 .displayMobile .ro .textContentLeft{
	text-align: left;
	color:#8dc63f;
}
.s5 .displayMobile .ro .textContent  span{
	font-size: 15px;
}
.s5 .displayMobile .w100mx{
	max-width: 1280px;
}





/* s6 */

.s6 .boxes  {
	text-align:center;
}
.s6 .box {
	/*width:400px;*/
	margin:19px;
	border-bottom :5px solid #e1e1e1;
	display:inline-block;
}

.s6 .box > img {
	max-width: 100%;
	width: 100%;
}



.s6 .rowx { height:50px; padding: 18px 10px 18px 10px;}
.s6 .rowx .title{float:left; font-size:14px; font-weight:bold;}
.s6 .rowx .text{float:right;font-size:14px;}

.s6 {
	max-width: 1322px;
	margin:0 auto;
}
.boxes.more{
	display:none;
}
.boxes.default.row{
	margin-right: 0;
	margin-left: 0;
}

.boxButton{
	text-align:center;

}
.boxButton a{
	display:inline-block;
	color: #2693cc;
	text-transform:uppercase;
	border: 2px solid #2693cc;
	padding:6px 20px;
}
.boxes::after {
	content: "";
	display: block;
	height: 30px;
}


/* footer*/


.slide.footer{position:relative;z-index:100;background:#474747;border-top:1px solid rgba(255,255,255,.2);padding-top:50px;padding-bottom:70px}
.slide.footer .col1{text-align:center;color:#CCC}

.slide.footer .col1 a.logo{padding:0!important;display:block;width:100px;height:52px;margin:0 auto 10px;background:url(../images/logo.png) no-repeat left top; } /*float:left;*/
.slide.footer .col1 a.logoPont{padding:0!important;display:block;width:184px;height:42px;margin:0 auto 10px;background:url(../images/logo_pontSystems.png) no-repeat left top; }
.slide.footer .col1 a.logoColabs{padding:0!important;display:block;width:190px;height:34px;margin:0 auto 15px;background:url(../images/logo_colabs.png) no-repeat left top; }
.slide.footer .col1 .clear{clear:both;}

.slide.footer .col1 a.small{font-size:11px;color:#CCC}
.slide.footer .col2,.slide.footer .col3{border-left:1px solid rgba(255,255,255,.2)}
.slide.footer .col2{padding-left:70px;color:#fff;font-size:14px;text-align:left}
.slide.footer .col2 .row1{font-size:17px;color:#f2f2f2;display:block;font-family: 'Roboto', sans-serif;font-weight:100}
.slide.footer .col2 .row2{font-size:17px;color:#f2f2f2;display:block; font-weight:100;}
.slide.footer .col2 .row3{font-size:17px;color:#f2f2f2;display:block; font-weight:100;}
.slide.footer .col2 .row4{padding-top:5px}
.slide.footer .col2 .row4 a{font-size:20px;color:#f2f2f2;text-decoration:none}
.slide.footer .col2 .row4 a:hover,.slide.footer .col2 a{color:#fff}
.slide.footer .col3{color:#CCC;text-align:center}
.slide.footer .col3 a{margin:10px auto 25px;width:73%;color:#fff;font-size:16px;border:1px solid rgba(255,255,255,.5);background-color:transparent}
.slide.footer .col3 a:hover{background-color:#66cbc5;border-color:#66cbc5;color:#fff}


@media (max-width:800px){.slide.footer .col1{padding-bottom:20px}
	.slide.footer .col1 a.small{font-size:15px!important}
	.slide.footer .col2 .row1,.slide.footer .col2 .row2,.slide.footer .col2 .row3,.slide.footer .col2 .row4{font-size: small;}
	.slide.footer .col2,.slide.footer .col3{text-align:center;padding-top:20px;padding-bottom:20px;padding-left:0;border-left:0;border-top:1px solid rgba(255,255,255,.2)}
	.slide.footer .col3 a{display:block;margin:15px auto}
	.line3 {
		line-height: 20px !important;
	}
}

.slide.footer .container .row .col1 p{color:#ffffff;}
.slide.footer .container .row .col2 p{color:#ffffff; /* margin-top: 37px; */}
.slide.footer .container .row .col3 p{color:#ffffff;}

.slide.footer .container .row .col3 h3{color:#ffffff; margin-top:0;}
.slide.footer .container .row .col3 label{color:#ffffff;  margin-top: 8px;}
.slide.footer .container .row .col3 textarea { width: 90%; height: 106px;}
.slide.footer .container .row .col3 input { width: 90%;}

.slide.footer .container .row .col3 .comment {color: white;    font-size: 10px;}
.frmContact div{ text-align:center; }

@media (max-width: 600px) {
	.s5 .imgContentLeft, .s5 .imgContentRight {
		width: auto;
	}
	.s5 .imgContentLeft {
		text-align: left;
	}
	.s5 .imgContentRight {
		text-align: right;
	}
	.s5 .imgContentLeft img{
		position:relative; top:0; left:-1px;
	}
	.s5 .imgContentRight img{
		position:relative; top:0; left:1px;
	}

	.s5 .t.w100x{
		width: 88%;
	}
	.s5 .bot {
		padding: 0;
	}

}



.navbar.navbar-inverse {
	background-color: transparent;
	border-color: transparent;
	background-image:url("../images/headerMenuBg.png");
}
.navbar-inverse .navbar-nav li a{
	text-transform:uppercase;
	color:white;
	font-size:18px;
}

.navbar-inverse .navbar-nav > .active > a,
.navbar-inverse .navbar-nav > .active > a:focus,
.navbar-inverse .navbar-nav > .active > a:hover {
	background-color: transparent;
	color: #9d9d9d;
	border-bottom:2px solid white;
	color:white
}

.containerx{
	position:relative; top:0; left:0;
}

.containerx .bgImageSlider{
	position:relative; top:0; left:0;
	width:100%;
	height:100%;
	/*background-image:url("../images/s1-bg.jpg");*/
}
.containerx .s1{
	position:absolute; top:0; left:0;
	z-index:2;
	width:100%;
	height:100%;
	height:1080px;
	text-align: center;
}
.s1>*{
	margin-left:20px;
	margin-right:20px;
	display:inline-block;
}
.s1 .text-center{
	display:block;
}

.s1 .cont {
	left: 0;
	position: relative;
	top: 0;
	z-index: 20;
}

.sotetito {
	background-image: url("../images/bg_csikok.png");
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 1;
}


.nav.navbar-nav > li.menuElement{
	position:relative; top:13px; left:0;

}
.nav.navbar-nav > li.menuElement:hover{
	border-bottom:2px solid white;
}
.nav.navbar-nav > li > a {
	font-size:medium;
	padding-bottom: 8px;
	padding-top: 8px;
}


@media (max-width: 940px) {
	.nav.navbar-nav > li > a{ font-size:15px;}
}
@media (max-width: 820px) {
	.nav.navbar-nav > li > a{ font-size:12px;}
}

/* kicsi sz�less�g� mobilok */
@media (max-width: 430px) {
	.s4 .dataDiagram .dataContent .data .dataText{font-size:10px;}
	.s4 .text{font-size:16px;}
	.s3 .right .bRight .b span{white-space: initial; width: 80px;display: inline-block;}
	.s3 .left .bLeft .b span {white-space: initial; width: 80px;display: inline-block;}
	.s3 .left .bLeft {left:4px;}
	.s3 .right .bRight {left:-4px;}

	.bgImageSlider .s1 h1{font-size: 13px;  line-height: 25px;}
	.bgImageSlider .s1 p.middleText{font-size: 10px; }
	.s1 > * { margin-left: 3px;    margin-right: 3px;}
	.bgImageSlider .s1 ul.middleUl li{ font-size: 11px;    line-height: 7px;}
}


@media (max-width: 750px) {


}

.s4:after {
	background-image: url("../images/bg_csikok.png");
	content: "";
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 10;
}

.jssorb21 {
	position: absolute;
}
.jssorb21 div, .jssorb21 div:hover, .jssorb21 .av {
	position: absolute;
	/* size of bullet elment */
	width: 19px;
	height: 19px;
	text-align: center;
	line-height: 19px;
	color: white;
	font-size: 12px;
	background: url(../img/b21.png) no-repeat;
	overflow: hidden;
	cursor: pointer;
}
.jssorb21 div { background-position: -5px -5px; }
.jssorb21 div:hover, .jssorb21 .av:hover { background-position: -35px -5px; }
.jssorb21 .av { background-position: -65px -5px; }
.jssorb21 .dn, .jssorb21 .dn:hover { background-position: -95px -5px; }

.jssora21l, .jssora21r {
	display: block;
	position: absolute;
	/* size of arrow element */
	width: 55px;
	height: 55px;
	cursor: pointer;
	background: url(../img/a21.png) center center no-repeat;
	overflow: hidden;
}
.jssora21l { background-position: -3px -33px; }
.jssora21r { background-position: -63px -33px; }
.jssora21l:hover { background-position: -123px -33px; }
.jssora21r:hover { background-position: -183px -33px; }
.jssora21l.jssora21ldn { background-position: -243px -33px; }
.jssora21r.jssora21rdn { background-position: -303px -33px; }


.s4 .dataDiagram .dataContent .data .dataText{ box-sizing: border-box; padding:6px;}

@-webkit-keyframes flag1 {
	0% {
		width: 0px;
		padding:6px 0;
	}

	100% {
		width: 135px;
		padding:6px;
	}
}

@keyframes flag1 {
	0% {
		width: 0px;
		padding:6px 0;
	}

	100% {
		width: 135px;
		padding:6px;
	}
}

.flag1 {
	-webkit-animation-name: flag1;
	animation-name: flag1;
	overflow:hidden;
	box-sizing: border-box;
}


@-webkit-keyframes flag2 {
	0% {
		width: 0px;
		padding:6px 0;
	}

	100% {
		width: 168px;
		padding:6px;
	}
}

@keyframes flag2 {
	0% {
		width: 0px;
		padding:6px 0;
	}

	100% {
		width: 168px;
		padding:6px;
	}
}

.flag2 {
	-webkit-animation-name: flag2;
	animation-name: flag2;
	overflow:hidden;
	box-sizing: border-box;
}


@-webkit-keyframes flag3 {
	0% {
		width: 0px;
		padding:6px 0;
	}

	100% {
		width: 79px;
		padding:6px;
	}
}

@keyframes flag3 {
	0% {
		width: 0px;
		padding:6px 0;
	}

	100% {
		width: 79px;
		padding:6px;
	}
}

.flag3 {
	-webkit-animation-name: flag3;
	animation-name: flag3;
	overflow:hidden;
	box-sizing: border-box;
}

@-webkit-keyframes data1 {
	0% {
		height: 0;
	}

	100% {
		height: 225px;
	}
}

@keyframes data1 {
	0% {
		height: 0;
	}

	100% {
		height: 225px;
	}
}

.data1 {
	-webkit-animation-name: data1;
	animation-name: data1;
	box-sizing: border-box;
}
@-webkit-keyframes data2 {
	0% {
		height: 0;
	}

	100% {
		height: 130px;
	}
}

@keyframes data2 {
	0% {
		height: 0;
	}

	100% {
		height: 130px;
	}
}

.data2 {
	-webkit-animation-name: data2;
	animation-name: data2;
	box-sizing: border-box;
}
@-webkit-keyframes data3 {
	0% {
		height: 0;
	}

	100% {
		height: 60px;
	}
}

@keyframes data3 {
	0% {
		height: 0;
	}

	100% {
		height: 60px;
	}
}

.data3 {
	-webkit-animation-name: data3;
	animation-name: data3;
	box-sizing: border-box;
}
.tableWrapperOuter .tableWrapper{
	height:270px;
}


.pontviet_logo_upper{
	height: 34px;
}

.footer .logok {
	height: 245px;
	left: 0;
	margin: 0 auto;
	position: relative;
	top: 0;
	width: 228px;
}
.footer .logok img {
	height: 34px;
	margin: 10px;
}
.footer .logok .pontsystems_logo {
	left: 29px;
	position: absolute;
	top: 10px;
}
.footer .logok .pontapps_logo {
	height: 37px;
	left: 77px;
	position: absolute;
	top: 68px;
}
.footer .logok .pontviet_logo {
	height: 34px;
	left: 78px;
	position: absolute;
	top: 125px;
}
.footer .logok .logo_colabs {
	left: 14px;
	position: absolute;
	top: 172px;
}

@media (min-width: 768px) {
	#xflag div {
		text-align: center;
	}
}

@media (max-width: 767px) {
	.nav.navbar-nav {    width: 100%;}
    #xflag div { padding: 5px 15px; }
	body .navbar-nav{ height:unset;}
	body .nav.navbar-nav > li.menuElement { top: 0;}
	.nav.navbar-nav > li > a { height:unset;}
}

/* s5 */

button, input, optgroup, select, textarea {
	color:#444;
}

.footerPeopleIconsContainer{
	margin: 20px 0;
	text-align:justify;
}
.footerPeopleIconsContainer>div{
	width: 48%;
	display: inline-block;
}
.footerPeopleIconsContainer img{
	border-radius:75px;
	width:150px;
	height:150px;
	margin: 0 auto;
	display: block;
}
.footerPeopleIconsContainer p{
	font-size:15px;
	text-align:center;
}
.footerPeopleIconsContainer:after{
	clear:both;
	content:"";
	width:100%;
	display:inline-block;
}


/* s7 */
.s7containerxxxx:before {
	content: "|";
	font-size: 0;
}

.s7 h2 {
	color: white;
	font-size: 36px;
	text-align: center;
}
.s7 .line {
	color: white;
	text-align: center;
	background-color: white;
	opacity: 1;
}
.s7 .titleSubText {
	color: white;
	font-size: 18px;
	text-align: center;
}

.s7containerxxxx{
	background-image: url("../images/video_pic_ff.jpg" );
	background-position: center top;
	background-repeat: no-repeat;
	padding: 4.7% 0 15%;
	background-size: cover;
}
.playIcon{
	text-align:center;
	padding: 40px 0;
}
.playIcon img{
	display:inline-block;
}

#sec1{
	width: 100%;
	position: relative;
	background: no-repeat url("../images/bg.jpg") 50% / 100%;
}
#bgimg{
	vertical-align: top;
	width: 100%; /* max width */
	opacity: 0;  /* make it transparent */
}
#head{
	position: absolute;
	top: 0;
	width: 100%;
}
#greyarea {
	background-color: rgb(21,21,21);
	border-bottom-right-radius: 25px;
	position: relative;
	z-index: 10000;
}
#sec2, #sec5 {
	background-color: #3398CC;
	color: #fff;
}
#sec3 {
	background-image: url("../images/video_pic_ff.jpg");
	background-position: center top;
	background-repeat: no-repeat;
	min-height: 550px;
	color: #343434;
	background-size: cover;
	position: relative;
}

.column {
	max-width: 250px;
	width: 100%;
	margin: 0 auto;
}
.columnTitle {
	border-color: #fff;
	border: 2px solid;
	font-size: 1.5em;
	font-weight: 100;
	text-transform: uppercase;
	border-radius: 25px;
	margin: 40px 3px 0px 3px;
	/* width: 50px; */
	text-align: center;
	padding: 20px 20px 13px 20px;
	/* margin:0 auto; */
}
.columnText {
	/* width: 100px; */
	text-align: justify;
	/*overflow: hidden;*/
	padding: 20px;
	white-space: initial;
	margin:0 auto;
	/*height: 325px;*/
}
.contMax {
	max-width:800px;

	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;

	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;

	margin:0 auto;
	text-align: center;
}

.contMax a{
	padding : 14px 5px 0px 5px;
	margin: 5px 3px 0px 3px;
	vertical-align: middle;
	display: inline-block;
}

.contMax img {
	max-width: 100%;
	max-height:512px;
}
#greybg {
	/*background-color: rgba(195,202,150,0.6);*/
	width: 95%;
	max-width: 1000px;
	/*border-radius: 15px;*/
	text-align: center;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.greybox {
	background-color: rgba(255, 255, 255, 0.4);
	color: #000;
	/* width: 400px; */
	font-size: 1.2em;
	font-weight: bold;
	width: 100%;
	margin: 10px auto;
	max-width: 470px;
	/* justify-content: center; */
	/* margin: 10px; */
	padding: 30px 15px;
	border-radius: 15px;
	/* width: calc((80%-40px)/2); */
	/* max-width: 30%; */
	/* z-index: -82; */
	display: inline-block;
}
#ticks {
	width: 40px;
	text-align: center;
	display: inline-block;
}
#s3title, #s4title, #s5title {
	text-transform: uppercase;
	padding: 40px 0 15px 0;
	text-align: center;
	font-size: 1.5em;
}
#s3cont {
	width: 100%;
	text-align: center;
	position: absolute;
	bottom:0;
	margin: 0 0 20px 0;
}
#s4cont, #s5cont {
	max-width: 800px;
	margin: 0 auto;
}
#sec4flex, #sec5flex{
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	padding-bottom: 60px;
}
.line3 {
	line-height:30px;
}
#lb {
	text-align: left;
}
#rb {
	text-align: right;
}
#buttons {
	width: 100%;
	display: flex;
	justify-content:space-around;
	padding: 0 0 10px 0;
}
#rightButton, #leftButton {
	padding: 10px 15px;
	/* width: 200px; */
	display: inline-block;
	background-color: #3398CC;
	color: #fff;
	text-transform: uppercase;
	border-radius:15px;
	margin-top:-15px;
	/* z-index: -5; */
	position: relative;
}
#rightButton {
	/*margin-left:40px;*/
	float:left;
}
#leftButton {
	/*margin-right:40px;*/
	float:right;
}
.contpart {
	text-align: center;
	border-radius: 15px;
	text-transform: uppercase;
	border: 2px solid rgb(51, 152, 204);
	margin:10px;
	padding:10px 0;
	width: 180px;
	height:160px;
	position: relative;
}
.refpart {
	text-align: left;
	margin:10px;
	padding:10px 0;
	width: 140px;
	position: relative;
}
.contparttext {
	position: absolute;
	padding: 5px 0 5px 0;
	bottom: 0;
	text-align: center;
	width: 100%;
}
.ctbold {
	font-weight: bold;
}
.bignum {
	text-align: center;
	font-weight: bold;
	font-size: 4em;
	border-bottom: 2px #fff solid;
	margin-bottom: 15px;
}
.refparttext {
	padding: 15px 0 0 0;
	text-align: justify;
}
.navbar-inverse {
	background-color: rgb(71,71,71) !important;
}
#head {
	width: 100%;
	max-width: 500px;
	color:#fff;
}
#logodiv {
	text-transform: uppercase;
	color: #fff;
	padding-top: 25px;
	padding-bottom: 10px;
	padding-left: 40px;
	background-color: rgb(21,21,21);
}
#logodiv span img {
	max-width: 80px;
	vertical-align: bottom;
}
#logotext {
	text-transform: uppercase;
	font-size: 2.5em;
	font-weight: 100;
	padding-left: 40px;
	padding-bottom: 10px;
}
#textbelowlogo {
	padding-left: 40px;
	padding-top: 6px;
}
.contpart img {
	width: 100px;
}
.columnTitle img {
	width: 50px;
	margin-top: -7px;
}
.greycont {
	max-width: 470px;
	padding: 0px 4px;
}
.refpart img {
	max-height:50px;
}
.refpart p {
	text-align: center;
}

@media screen and (max-width: 825px) {
	#rb, #lb {
		text-align: center;
		font-size: small;
	}
	#rightButton, #leftButton {
		width: 100%;
	}
}

@media screen and (min-width: 767px) {
	.navbar-brand {
		display: none;
	}
}

@media screen and (max-width: 766px) {
	#logodiv img {
		display: none;
	}
}

@media screen and (max-width: 340px)
	#logotext {
		font-size: 140%;
	}
}

@media screen and (max-width: 1300px) {
	#greyarea {
		margin-top:67px;
		z-index: 1000;
	}
}
@media screen and (max-width: 768px) {
	#greyarea {
		margin-top:51px;
		z-index:0;
	}
}
@media screen and (max-width: 520px) {
	#logodiv {
		padding-left:initial;

	}
	#logodiv div {
		width: 100% !important;
		text-align: center;
	}
	#logotext {
		font-size:170%;
		padding:10px;
		text-align: center;
	}
	#textbelowlogo {
		text-align: center;
	}
}

@media screen and (max-width: 455px) {

	.columnTitle {
		margin-top:75px;
	}

	#textbelowlogo {
		display: block;
		background-color: #3398cc;
		padding-bottom: 30px;
		padding-right: 40px;
	}
}

@media screen and (max-width: 420px) {
	.columnTitle {
		margin-top: 100px;
	}

}

@media screen and (max-width: 480px) {
	#s3cont {
		font-size: smaller;
	}

}
