@import url("https://bautemp.hu/ms-admin/skin/bootstrap/css/bootstrap.min.css");
@import url("https://bautemp.hu/ms-admin/skin/bootstrap/css/bootstrap-grid.min.css");
@import url("https://bautemp.hu/ms-admin/skin/bootstrap/css/bootstrap-reboot.min.css");
@import url("https://bautemp.hu/page/plugs/page_move.css");
@import url("https://fonts.googleapis.com/css2?family=Archivo:wght@400;700&family=Teko:wght@500&display=swap");
/*******************************************
font-family: "Teko", sans-serif;
font-family: "Work Sans", sans-serif;

font-family: "Archivo", sans-serif;
font-family: "Teko", sans-serif;
*******************************************/

:root{
    --black:#000000;
    --white:#FFFFFF;

	--black_opacity:rgba(0,0,0,.6);

	--yellow:#176eb5;
	--red:#e62331;
	--purp:#be4794;
	--green:#176eb5;
	--orange:#176eb5;
	--cian:#40b9bb;

	--font1:"Archivo", sans-serif;
	--font2:"Teko", sans-serif;
}

*{font-size:1rem; font-family:var(--font1); color:var(--black); text-decoration:none; list-style:none; margin:0; padding:0;}
a,a:hover{text-decoration:none;}
h1,h2,h3,h4,h5{font-family:var(--font2);}
h1{font-size:2.2rem;}
h2{font-size:2rem;}
h3{font-size:1.8rem;}
h4{font-size:1.6rem;}
h5{font-size:1.4rem;}
.row{margin:0;padding:0;}
.fancybox-container *{color:var(--white); font-size:.8rem;}
.btn{box-shadow:none!important;}
.form-control{box-shadow:none!important;}
.form-control:focus{border-color:var(--black);}
.dabsolute{width:100%; height:100%; position:absolute; left:0; top:0;}
.fullbg{background:no-repeat center center / cover; background-attachment: fixed;}
.header-top{padding-top:89px!important;}

.btn.v1{background:var(--orange); color:var(--white); border:solid 1px var(--orange); padding:5px 30px; transition:all .5s; border-radius:0;}
.btn.v1:hover{background:var(--white); color:var(--orange);}
.btn.v2{background:var(--cian); color:var(--white); border:solid 1px var(--white); padding:5px 30px; transition:all .5s; border-radius:0;}
.btn.v2:hover{background:var(--white); color:var(--cian);}
.btn.v3{background:var(--red); color:var(--white); border:solid 1px var(--red); padding:5px 30px; transition:all .5s; border-radius:0;}
.btn.v3:hover{background:var(--white); color:var(--red);}
.btn.v3_invert{background:var(--white); color:var(--red)!important; border:solid 1px var(--white); padding:5px 30px; transition:all .5s; border-radius:0;}
.btn.v3_invert:hover{background:var(--red); color:var(--white)!important;}
.btn.v4{background:transparent; color:var(--black); border:solid 3px var(--black); padding:5px 30px; transition:all .5s; border-radius:0; font-weight:bold;}
.btn.v4:hover{background:var(--black); color:var(--white);}
.btn.v4.small{background:transparent; color:var(--black); border:solid 1px var(--black); padding:5px 30px; transition:all .5s; border-radius:0; font-weight:normal;}


.btn.vG{background:var(--orange); color:var(--white)!important; border:solid 1px var(--orange); padding:5px 30px; transition:all .5s; border-radius:0;}
.btn.vG:hover{background:var(--white); color:var(--orange)!important;}

::-webkit-scrollbar {width: 10px;}
::-webkit-scrollbar-track {background: var(--white);}
::-webkit-scrollbar-thumb {  background:var(--black); opacity:.4;}
::-webkit-scrollbar-thumb:hover {opacity:1;}

#welcome{}
#welcome > a img{position: absolute; left: 15px; top: 15px; z-index: 3; width: 120px;}
#welcome .glass{background:var(--black); z-index:1; opacity:.6;}
#welcome .container{height:var(--wh); display:flex; align-items:center; position:relative; z-index:2; overflow:hidden;}
#welcome .container h2{font-size:4rem; color:var(--white); text-transform:uppercase; position:relative; top:-50vh;}
#welcome .container p{margin:0; margin-top:1.5rem; color:var(--white);position:relative; opacity:0; font-size:1.4rem;}
#welcome .container .btn{color:var(--white); padding:.5rem .75rem; background:var(--orange); margin-top:3rem; border:solid 3px var(--orange); transition:all .25s; border-radius:0;}
#welcome .container .btn:hover{color:var(--white); background:transparent;}

#welcome .active .container h2{top:0; transition:top .5s;}
#welcome .active .container p{opacity:1; transition:opacity .5s; transition-delay:.5s;}

#connect{background:var(--orange); padding:3rem 0;}
#connect .text{display:flex; align-items:center;}
#connect .text h2{font-size:2rem; color:var(--white); text-align:left;}
#connect .text .cktext *{color:var(--white);}
#connect .btns{display:flex; align-items:center;}
#connect .btns a{padding:.5rem 1.25rem; border:solid 1px var(--white); color:var(--white); font-weight:700;}
#connect .btns a:hover{background:var(--white); color:var(--orange); }



#service{width:var(--ww); overflow:hidden; }
#service .card{border-radius:0; border-color:var(--black); transition:all .5s; transform:scale(.95);}
#service .card:hover{ transform:scale(1);}
#service .card img{width:100px; filter: invert(1); margin:1.5rem calc(50% - 50px) 3rem; }
#service .card img.sale{position:absolute; right:-30px; top:-30px; width:100px; margin:0; padding:0; filter: invert(0); transform:rotate(15deg); }
#service .card .text{border-top:solid 1px rgba(0,0,0,.1);border-bottom:solid 1px rgba(0,0,0,.1); margin:1.5rem; padding:.5rem 0; height:400px; overflow:hidden;}
#service .card .text *{ font-size:.8rem;}
#service .card .text p{text-align:left;}
#service .card .text ul{width:100%;}
#service .card .text ul li{background-image:url("/imgs/checkbox_f29f0e.svg"); text-align:left; background-repeat:no-repeat; background-position:top left; background-size:20px; padding-left:25px; margin:5px 0;}
#service .card .text ul.color_1ca4e9 li{background-image:url("/imgs/sale/checkbox_1ca4e9.svg"); }
#service .card .text ul.color_18b940 li{background-image:url("/imgs/sale/checkbox_18b940.svg"); }
#service .card .text ul.color_73b72d li{background-image:url("/imgs/sale/checkbox_f29f0e.svg"); }
#service .card .text ul.color_be4794 li{background-image:url("/imgs/sale/checkbox_be4794.svg"); }
#service .card .text ul.color_d45511 li{background-image:url("/imgs/sale/checkbox_d45511.svg"); }
#service .card .text ul.color_f29f0e li{background-image:url("/imgs/sale/checkbox_f29f0e.svg"); }
#service .card .h5{display: flex;  height:100px;  align-items: center; flex-wrap:wrap; width:100%; justify-content:center;}
#service .card h5{font-size:2.4rem;}
#service .card h5 span{font-size:1.6rem; opacity:.6; color:var(--red); position:relative; overflow:hidden;}
#service .card h5 span:before{content:""; position:absolute; left:0; top:0; width:100%; height:calc(60%); border-bottom:solid 2px var(--red); transform:rotate(7deg);}
#service .card a.btn{border-radius:0; border:solid 1px var(--orange)!important; background-color:var(--orange)!important; color:var(--white); width:75%; margin:1.5rem auto; transition:all .5s;}
#service .card a.btn:hover{background:var(--white)!important; color:var(--orange);}
#service .card p.best{position:absolute; right:-10px; top:130px; width:min-content; text-transform:uppercase; color:var(--white); padding:5px 5px; -webkit-box-shadow: -1px 1px 5px 0px rgba(0,0,0,0.4); box-shadow: -1px 1px 5px 0px rgba(0,0,0,0.4);}

#choose_me{}
#choose_me h2{color:var(--orange);}
#choose_me ul{width:90%; margin:1.5rem 5%;}
#choose_me ul li{padding:.5rem .5rem .5rem 1.5rem; position:relative;}
#choose_me ul li:before{content:".";font-size:8rem; color:var(--orange); position:absolute; left:0; top:-100px;	 transform:rotate(45deg);}

#references{height:1245px; overflow:hidden; position:relative;}
#references h2{color:var(--orange);}
#references iframe{position:absolute; left:0; top:120px; height:calc(100% - 120px); width:100%; margin:0; padding:0;}

#request{}
#request .form-control{border-radius:0; border-color:var(--black);}
#request .form-control.error{border-color:var(--red);}
#request input[type="number"].form-control::-webkit-outer-spin-button,#request input[type="number"].form-control::-webkit-inner-spin-button {  -webkit-appearance: none;  margin: 0;}
#request p.error{color:var(--red); padding-top:0!important;}
#request textarea.form-control{height:120px; resize:none;}
#request .row p{font-size:.8rem; margin:0; padding:1rem .5rem 0 .5rem;}
#request .row input[type="checkbox"]{width:30px; height:30px; border:none; background:url("https://webflix.hu/page/imgs/checkbox_no_dark.svg") no-repeat center center / 30px; appearance: none; margin-top:8px;}
#request .row input[type="checkbox"]:checked{ background:url("https://webflix.hu/page/imgs/checkbox_ok_dark.svg") no-repeat center center / 30px; }
#request .row .check{margin-top:1.5rem;}
#request .row .check p{font-size:1rem; padding:.5rem; margin-top:3px!important;}
#request .row .check p a{color:var(--red);text-decoration:underline;}
#request .row button{margin-top:1.75rem;}
#request .row .col-md-12 p{font-size:1rem;}

#footer{ overflow:hidden; position:relative;}
#footer #map{}
#footer #map h2{color:var(--orange);}
#footer #map #map_bg{height:440px;}
#footer .black{padding:.75rem 0; display:flex; align-items:center; justify-content:center; background:var(--black);}
#footer .black a{color:var(--white);}

#pageup{width:50px;height:50px;position:fixed;right:35px!important;bottom:98px!important;cursor:pointer;z-index:300}
#pageup div{position:absolute;left:0px;bottom:0px;width:100%;height:100%;overflow:hidden}
#pageup div div{width:50px;height:50px}
#pageup{width:40px;height:40px;position:fixed;bottom:5%;right:5%;border-radius:25px;overflow:hidden;border:solid 2px var(--dark);background:var(--dark);cursor:pointer;z-index:200}
#pageup svg{position:absolute;left:0;top:0;width:40px;height:40px;z-index:1}
#pageup svg circle{cx:18;cy:18;r:25;stroke:var(--orange);stroke-width:50;fill:transparent;stroke-dasharray:160;stroke-dashoffset:160;}
#pageup #arrow{background:url("https://webflix.hu/page/imgs/arrow_green.svg") no-repeat center center / 80%;z-index:2;position:absolute;left:0;top:0;width:100%;height:100%}

#cookie{position:fixed; left:0; bottom:20px; background:var(--white); border:solid 2px var(--black); z-index:20; width:90%; margin:0 5%; display:none;}
#cookie h4{background:url("https://webflix.hu/page/imgs/cookie.svg") no-repeat center left / 40px; padding:.5rem .5rem .5rem 50px; margin:.5rem 0;}
#cookie p{margin:0; padding:.5rem;}
#cookie button{background:var(--orange);color:var(--white); border:solid 1px var(--orange); border-radius:0; transition:all .5s;  margin:.5rem; width:250px;}
#cookie button:hover{color:var(--orange); background:var(--white);}
#cookie a{background:var(--white);color:var(--black); border:solid 1px var(--black); border-radius:0; transition:all .5s;margin:.5rem;}
#cookie a:hover{color:var(--white); background:var(--black); }

@media only screen and (max-width: 1740px) {
	#cookie button,#cookie a{width:100%;}
}

@media only screen and (max-width: 800px) {
	::-webkit-scrollbar {display:none;}
	#service .card .text{height:auto;}
	#references{height:1005px;}
	#request .row .aszf p{width:calc(100% - 30px);}
	#request .row .aszf p.error{width:100%; margin-top:15px!important; font-size:.8rem; text-align:center;}
	#request .row .aszf input{margin-top:20px;}
	#request .row button{width:100%; padding:5px 0; text-align:center;}
	#footer{height:915px;}
}