/*
	Oyos Yazılım
	04 Ağustos 2017 - ismail ihsan bülbül - e-ben@msn.com
*/
body {font-family: 'PT Sans', sans-serif; font-size:14px; background:#ececec; border-top:5px solid #f19118;}
a {color:#296398;}
a:hover {color:#f19118;}
p {margin-bottom:10px;}
strong {font-weight:700;}

.abaslik {width:100%; float:left; margin-bottom:30px; color:#414140;}
	.abaslik h3 {width:100%; float:left; font-size:22px; font-weight:700; text-align:center;}
	.abaslik h3>span.bm {color:#f19118;}
	.abaslik>span {width:530px; margin:auto; text-align:center; display:block;}
	
a.detay {padding:0 10px; background:#f19118; font-size:9px; color:#fff; border-radius:3px; display:block; height:22px; line-height:22px;}
a.detay:hover {}

#header {width:100%; margin:auto; margin-top:20px;}
	#header #hust {width:1000px; margin:auto; height:95px;}
	#header #hust h1 {float:left;}
	#header #hust h1 a {width:304px; height:80px; display:block; background:url('../images/logo.png') top left no-repeat; float:left; text-indent:-9999px; background-size:contain !important;}

	#header #hust #hiletisim {width:360px; float:left; margin-left:45px; margin-top:5px;}
	#header #hust #hiletisim .ikutu {width:170px; float:left; margin-right:10px; position:relative; margin-top:15px;}
	#header #hust #hiletisim .ikutu i {width:35px; height:35px; line-height:35px; text-align:center; border-radius:100%; font-size:18px; color:#fff; background:#f19118; position:absolute; left:0px; top:4px;}
	#header #hust #hiletisim .ikutu h6 {width:130px; float:right; font-size:12px; color:#585858; margin-bottom:5px;}
	#header #hust #hiletisim .ikutu span {width:130px; float:right; font-size:14px; font-weight:700; color:#3a3a3a;}

	#header #hust #ssyl_ara {width:265px; float:right;}
	#header #hust #ssyl_ara #sosyal {width:100%; float:left; border-radius:3px; overflow:hidden; background:#363636; height:35px; margin-bottom:8px;}
	#header #hust #ssyl_ara #sosyal span {float:left; line-height:35px; height:35px; margin-left:15px; font-size:12px; color:#fff;}
	#header #hust #ssyl_ara #sosyal ul {float:right; list-style:none;}
	#header #hust #ssyl_ara #sosyal ul li {float:left;}
	#header #hust #ssyl_ara #sosyal ul li a {width:35px; height:35px; line-height:35px; text-align:center; color:#fff; background:#282828;}
	#header #hust #ssyl_ara #sosyal ul li a.fa-facebook {background:#1168c1;}
	#header #hust #ssyl_ara #sosyal ul li a.fa-twitter {background:#3ba7c2;}
	#header #hust #ssyl_ara #sosyal ul li a.fa-instagram {background:#8a3ab9;}
	#header #hust #ssyl_ara #sosyal ul li a.fa-google-plus {background:#f02b33;}

	#header #hust #ssyl_ara #ara {width:100%; float:left; position:relative;}
	#header #hust #ssyl_ara #ara form {width:100%; float:left;}
	#header #hust #ssyl_ara #ara form input {width:100%; float:left; height:40px; padding-left:15px; padding-right:30px; border-radius:3px; line-height:40px; border:1px solid #d2d2d2; box-sizing:border-box;}
	#header #hust #ssyl_ara #ara form i {font-size:16px; color:#585858; position:absolute; right:8px; top:11px;}

	#header #halt {width:100%; float:left; height:50px; background:#00367d;}
	#header #halt ul {list-style:none; width:1000px; margin:auto;}
	#header #halt ul li {float:left; border-left:1px solid #032a5e;}
	#header #halt ul li:first-child {border-left:none;}
	#header #halt ul li a {float:left; height:50px; line-height:50px; font-size:15px; color:#fff; font-weight:700; padding:0 38px; transition:all 0.5s;}
	#header #halt ul li a.fa-home {height:50px; line-height:50px; text-align:center; font-size:18px; color:#fff; background:#f19118; width:50px; padding:0px;}
	#header #halt ul li a:hover {background:#f19118;}
	#header #halt select {display:none;}
	
#slider {width:100%; height:700px; margin:auto; position:relative; display:block; background:#000; margin-bottom:30px; overflow:hidden;}
	#slider ul {list-style:none; float:left; width:100%; height:700px;}
	#slider ul li {width:100%; height:700px; display:block; position:relative;}

	#slider ul li .syazi {color:#fff; width:800px; position:absolute; top:50%; left:50%; transform: translateX(-50%) translateY(50%); text-align:center; text-shadow:2px 2px 5px #000c;}
	#slider ul li .syazi h1 {font-size:28px; font-weight:700;}
	#slider ul li .syazi .sydetay {font-size:16px; font-style:italic;}
	
	#slider #sayfalar {width:1000px; position:absolute; z-index:99; bottom:0px; left:50%; transform:translateX(-50%);}
	#slider #sayfalar a.ss {padding:20px; box-sizing:border-box; width:250px; float:left; border-right:1px solid #545454; background:#000; opacity:0.8;}
	#slider #sayfalar a.ss:last-child {border-right:none;}
	#slider #sayfalar a.ss i {float:left; border-radius:100%; width:27px; height:27px; line-height:27px; display:block; background:#fff; color:#303030; font-size:16px; font-weight:700; text-align:center; margin-top:3px;}
	#slider #sayfalar a.ss h4 {width:170px; float:right; font-size:13px; color:#fff; color:#fff; font-weight:700;}
	#slider #sayfalar a.ss span {width:170px; float:right; color:#fff; font-size:12px;}
	
	#slider #sayfalar a.ss:hover, #slider #sayfalar a.aktif {background:#fff; color:#303030;}
	#slider #sayfalar a.ss:hover i, #slider #sayfalar a.aktif i {background:#303030; color:#fff;}
	#slider #sayfalar a.ss.aktif h4, #slider #sayfalar a.aktif span, #slider #sayfalar a.ss:hover h4,#slider #sayfalar a.ss:hover span {color:#303030;}
	
#kutular {width:1000px; margin:auto; margin-bottom:30px;}
	#kutular .kutu {float:left; margin-right:35px; width:309px; color:#303030;}
	#kutular .kutu:nth-child(3) {float:right; margin-right:0px;}
	#kutular .kutu i {width:100%; float:left; margin-bottom:10px; font-size:65px; text-align:center;}
	#kutular .kutu h5 {width:100%; float:left; margin-bottom:10px; text-align:center; font-size:16px; font-weight:700;}
	#kutular .kutu span {width:100%; float:left; text-align:center;}
	
#bhaberler {width:1000px; margin:auto; margin-bottom:20px;}
	#bhaberler #bh_cerceve {width:1020px;}
	#bhaberler #bh_cerceve .bhaber {width:490px; margin-right:20px; margin-bottom:20px; float:left; color:#d5dae0; padding:15px; box-sizing:border-box; color:#292929; background:#d5dae0; height:190px;}
	#bhaberler #bh_cerceve .bhaber a {float:left;}
	#bhaberler #bh_cerceve .bhaber a img {width:145px; height:145px; display:block; float:left; background:#ccc;}
	#bhaberler #bh_cerceve .bhaber h2 {width:300px; float:right; margin-bottom:5px; font-size:15px; font-weight:700;}
	#bhaberler #bh_cerceve .bhaber h2 a {color:#181612; float:left;}
	#bhaberler #bh_cerceve .bhaber span {width:300px; float:right;}
	#bhaberler #bh_cerceve .bhaber a.detay {float:right;}
	
#ugruplari {width:1000px; margin:auto; margin-bottom:20px;}
	#ugruplari #ug_cerceve {width:1020px; float:left;}
	#ugruplari #ug_cerceve .ugrup {width:490px; background:#d5dae0; float:left; margin-right:19px; margin-bottom:19px; float:left;}
	#ugruplari #ug_cerceve .ugrup img {width:490px; height:220px; float:left; background:#ccc;}
	#ugruplari #ug_cerceve .ugrup .ug_text {width:100%; padding:25px; box-sizing:border-box; float:left; position:relative; height:140px;}
	#ugruplari #ug_cerceve .ugrup .ug_text h2 {width:100%; float:left; margin-bottom:10px; font-size:18px; font-weight:700;}
	#ugruplari #ug_cerceve .ugrup .ug_text h2 a {float:left; color:#181612;}
	#ugruplari #ug_cerceve .ugrup .ug_text a.detay {position:absolute; right:25px; top:25px;}
	#ugruplari #ug_cerceve .ugrup .ug_text span {width:100%; float:left;}

#footer {width:1000px; margin:auto; margin-bottom:30px;}
	#footer #fust {width:100%; float:left; padding:30px; box-sizing:border-box; background:#171717; color:#fff;}
	#footer #fust .fmenu {width:170px; float:left;}
	#footer #fust .fmenu h4 {font-size:21px; float:left; width:100%; margin-bottom:10px; font-weight:700;}
	#footer #fust .fmenu ul {list-style:none; width:100%; float:left; padding-left:20px; box-sizing:border-box;}
	#footer #fust .fmenu ul li {width:100%; float:left; margin-bottom:8px;}
	#footer #fust .fmenu ul li a {float:left; color:#fff;}
	#footer #fust .fmenu ul li i {}
	
	#footer #fust #amenu {width:400px;}
	#footer #fust #amenu ul li {width:50%; }
	#footer #fust #sosyal {}
	#footer #fust #sosyal ul li i {width:30px; height:30px; text-align:center; line-height:30px; background:#595959; font-size:16px; color:#fff; margin-right:10px; border-radius:100%;}
	#footer #fust #iletisim {float:right; width:370px; background:url('../images/iletisim_bg.png') center center no-repeat;}
	#footer #fust #iletisim ul li i {float:left; margin-right:5px; margin-top:5px;}
	
	#footer #falt {width:100%; float:left; margin:auto; background:#0f0f0f; padding:20px; box-sizing:border-box; color:#fff;}	
	#footer #falt span {float:left; font-size:11px; width:600px;}	
	#footer #falt a {float:right; width:51px; height:29px; background:url('../images/oyos.png') top left no-repeat; text-indent:-99999px;}	

#sayfa_cerceve {width:100%; float:left; margin:20px 0;}	
#sayfa {width:960px; padding:20px; margin:auto; position:relative; z-index:1; background:#fff;}
	#sayfa #sayfa_haberler {width:918px; float:left;}
	#sayfa #sayfa_haberler .haber {width:440px;}
	#sayfa #sayfa_haberler .haber:first-child {float:left;}
	#sayfa #sayfa_haberler .haber:last-child {float:right;}
	#sayfa #sayfa_haberler .haber a.resim {float:left;}
	#sayfa #sayfa_haberler .haber a.resim img {width:120px; height:120px; border-radius:120px; float:left; margin-right:15px; display:block; background:#ebebeb;}
	#sayfa #sayfa_haberler .haber h2 {width:305px; float:left; margin-bottom:5px; font-size:18px; margin-top:9px;}
	#sayfa #sayfa_haberler .haber h2 a {float:left;}
	#sayfa #sayfa_haberler .haber span {width:305px; float:left;}
	
	#sayfa #sayfa_orta {width:760px; float:left;}
	#sayfa #sayfa_orta .iresim {float:left; max-width:300px; display:block; margin-right:10px; margin-bottom:10px;}
	#sayfa #sayfa_orta img {max-width:760px;}
	
	#sayfa #sayfa_orta .meta {width:380px; padding:10px; float:left; background:#1c1c1c; border-bottom:1px solid #131313; color:#fff;}
	#sayfa #sayfa_orta .meta span:first-child {float:left; width:200px; font-weight:700;}
	#sayfa #sayfa_orta .meta span:last-child {float:left;}
	
	#sayfa #sayfa_orta #urun_slide {width:660px; padding:25px; height:360px; float:left; background:#232323; position:relative; margin-bottom:10px;}
	#sayfa #sayfa_orta #urun_slide a#sol_ok{font-size:40px; position:absolute; color:#c4c4c4; top:180px; left:6px; z-index:99;}
	#sayfa #sayfa_orta #urun_slide a#sol_ok:hover{color:#c98f3b;}
	#sayfa #sayfa_orta #urun_slide a#sag_ok{font-size:40px; position:absolute; color:#c4c4c4; top:180px; right:6px; z-index:99;}
	#sayfa #sayfa_orta #urun_slide a#sag_ok:hover{color:#c98f3b;}
	#sayfa #sayfa_orta #urun_slide ul {list-style:none; width:660px; height:360px; overflow:hidden; display:block;}
	#sayfa #sayfa_orta #urun_slide ul li {float:left;}
	#sayfa #sayfa_orta #urun_slide ul li a {float:left}
	#sayfa #sayfa_orta #urun_slide ul li a img {width:660px; height:360px; display:block;}
	
	#sayfa #sayfa_orta h1 {width:760px; float:left; font-size:22px; padding-bottom:5px; margin-bottom:10px; color:#122307; font-weight:700;     border-bottom: 1px solid #BDB9B9;}
	#sayfa #sayfa_orta h1.urun_baslik {width:360px; float:left; font-size:18px; padding-bottom:5px; margin-bottom:10px; border-bottom:1px dotted #454545;}
	#sayfa #sayfa_orta #urun_resim {width:340px; float:left; margin-bottom:10px; margin-right:10px;}
	
	#sayfa #sayfa_orta #haberler {width:760px; float:left;}
	#sayfa #sayfa_orta #haberler .haber {width:710px; float:left; margin-bottom:10px; padding-bottom:10px; background:url(../images/hc_bg.png) bottom left repeat-x;}
	#sayfa #sayfa_orta #haberler .haber a.resim {float:left;}
	#sayfa #sayfa_orta #haberler .haber a.resim img {width:120px; height:120px; float:left; margin-right:15px; display:block; background:#fff; border-radius:5px;}
	#sayfa #sayfa_orta #haberler .haber a.resim img.vesika {width:120px; height:160px;}
	#sayfa #sayfa_orta #haberler .haber h2 {width:575px; float:left; margin-bottom:5px; font-size:22px; margin-top:9px;}
	#sayfa #sayfa_orta #haberler .haber h2 a {float:left;}
	#sayfa #sayfa_orta #haberler .haber span {width:575px; float:left;}
	
	#sayfa #sayfa_orta #haberler .kadro {width:160px; height:250px; float:left; margin-right:10px; margin-bottom:10px;}
	#sayfa #sayfa_orta #haberler .kadro img {width:160px; height:200px; float:left;}
	#sayfa #sayfa_orta #haberler .kadro h3 {width:100%; float:left; height:30px; line-height:30px; color:#fff; font-size:14px; font-weight:700; background:#0082c5; text-align:center; font-weight:700;}
	#sayfa #sayfa_orta #haberler .kadro span {width:100%; height:20px; line-height:20px; float:left;  color:#fff; background:#066a9d; text-align:center; font-size:12px;}
	
	#sayfa #sayfa_orta #haberler .urun {width:170px; height:170px; float:left; margin-bottom:10px; margin-right:10px; position:relative;}
	#sayfa #sayfa_orta #haberler .urun a.resim {float:left; width:170px; height:170px;}
	#sayfa #sayfa_orta #haberler .urun a.resim img {width:170px; height:170px; float:left; margin-right:15px; display:block; background:#fff; border-radius:5px; box-shadow:0 0 5px #e6e6e6;}
	#sayfa #sayfa_orta #haberler .urun h2 {margin-bottom:5px; font-size:14px; margin-top:9px; font-weight:700; position:absolute; bottom:10px; background:#000; padding:5px 10px; right:0px; border-radius:2px 0 0 2px; opacity:0.9;}
	#sayfa #sayfa_orta #haberler .urun h2 a {float:left; color:#fff;}
	
	#sayfa #sayfa_orta #haberler .urun h4 {font-size:18px; font-weight:700; position:absolute; top:10px; background:#000; padding:5px 10px; left:0px; border-radius:0 2px 2px 0; opacity:0.9; background:#AD0A13;}
	#sayfa #sayfa_orta #haberler .urun h4 a {float:left; color:#fff;}
	
	#sayfa #sayfa_orta #haberler .urun span {position:absolute; background:#000; border-radius:0 5px 5px 0; color:#fff; font-size:12px; padding:4px 8px; left:00px; top:10px; opacity:0.5;}
	
	#sayfa #sayfa_orta #haberler .kat {width:170px; height:170px; float:left; margin-bottom:10px; margin-right:10px; position:relative;}
	#sayfa #sayfa_orta #haberler .kat a.resim {float:left;}
	#sayfa #sayfa_orta #haberler .kat a.resim img {width:170px; height:170px; float:left; margin-right:15px; display:block; background:#fff; border-radius:5px;}
	#sayfa #sayfa_orta #haberler .kat h2 {margin-bottom:5px; font-size:14px; margin-top:9px; font-weight:700; position:absolute; bottom:10px; background:#692008; padding:5px 10px; right:0px; border-radius:5px 0 0 5px;}
	#sayfa #sayfa_orta #haberler .kat h2 a {float:left;}
	
	#sayfa #sayfa_orta .gallery {list-style:none; width:100%;}
	#sayfa #sayfa_orta .gallery li {float:left; padding:8px; box-sizing:border-box; width:25%;}
	#sayfa #sayfa_orta .gallery li a{width:100%; float:left;}
	#sayfa #sayfa_orta .gallery li a img {width:100%; height:auto; display:block; }
	
	#sayfa #sayfa_sidebar {width:180px; float:right;}
	#sayfa #sayfa_sidebar h2 {width:100%; float:left; font-size:22px; padding-bottom:5px; margin-bottom:10px; border-bottom: 1px solid #BDB9B9; color:#122307; font-weight:700;}
	#sayfa #sayfa_sidebar ul {list-style:none; float:left; margin-bottom:10px;}
	#sayfa #sayfa_sidebar ul li {width:100%; margin-left:20px; margin-bottom:6px; font-size:13px;}
	#sayfa #sayfa_sidebar ul li span {display:block; background: url('../images/nokta.png'); width: 4px; height: 6px; float:left; margin-right:5px; margin-top:6px;}
	#sayfa #sayfa_sidebar ul li i {margin-right:5px; color:#eca112;}
	
	#sayfa #sayfa_sidebar #facebook {float:left; margin-top:15px;}
	
	.form {width:710px; float:left;}
	.form .text {width:710px; float:left;}
	.form .text .acik {float:left; margin-bottom:5px; font-weight:700;}
	.form .text .macik {float:right;  margin-bottom:5px; font-size:11px; color:#ccc;}
	.form .text input[type="text"] {padding:10px; width:688px; float:left; margin-bottom:10px; border:1px solid #cdcdcd; border-radius:5px;}
	.form .text select {padding:10px; width:710px; float:left; margin-bottom:10px; border:1px solid #cdcdcd; border-radius:5px;}
	.form .text input[type="file"] {padding:10px; width:688px; float:left; margin-bottom:10px; border:1px solid #cdcdcd; border-radius:5px;}
	.form .text textarea {padding:10px; width:688px; height:100px; float:left; margin-bottom:10px; border:1px solid #cdcdcd; border-radius:5px;}
	input.error, textarea.error {border:3px solid #cf2727 !important; width:685px !important;}
	label.error {display:none !important;}
	
	#sayfa #sayfa_orta #iletisim1 {width:390px; float:right;}
	#sayfa #sayfa_orta #iletisim1 h1 {width:100%; float:left;}

	#sayfa #sayfa_orta #iletisim2 {width:345px; float:left;}
	#sayfa #sayfa_orta #iletisim2 h1 {width:100%; float:left;}
	#sayfa #sayfa_orta #iletisim2 .form {width:100%;}
	#sayfa #sayfa_orta #iletisim2 .form .text {width:100%;}
	#sayfa #sayfa_orta #iletisim2 .form .text input {padding:10px 4px; width:100%  !important; border:1px solid #cdcdcd; border-radius:5px; box-sizing:border-box;}
	#sayfa #sayfa_orta #iletisim2 .form .text textarea {width:100% !important; padding:10px 4px; border:1px solid #cdcdcd; border-radius:5px;  box-sizing:border-box;}
	#sayfa #sayfa_orta #iletisim2 input.error, #sayfa #sayfa_orta #iletisim2 textarea.error {border:1px solid #cf2727 !important;}
	
	#sayfala {float:left; margin-top:20px;}
	#sayfala  a{font-size:11px; font-weight:700; padding:3px 8px; display:block; background:#00367d; color:#fff; float:left; margin-left:3px; border-radius:3px;}
	#sayfala  a:hover {background:#d1a04c; color:#4f3a16;}
	#sayfala .aktif {background:#d1a04c; color:#4f3a16;}

.button1 {
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6));
	background:-moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0);
	background-color:#ffffff;
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
	border-radius:15px;
	border:1px solid #dcdcdc;
	display:inline-block;
	cursor:pointer;
	color:#666666;
	font-family:arial;
	font-size:11px;
	font-weight:bold;
	padding:6px 12px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
}
.button1:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6f6f6), color-stop(1, #ffffff));
	background:-moz-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-webkit-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-o-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-ms-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0);
	background-color:#f6f6f6;
}
.button1:active {
	position:relative;
	top:1px;
}

#yorumlar {width:690px; float:left; margin-bottom:10px; margin-top:40px;}
#yorumlar h3 {width:690px; float:left; padding-bottom:5px; margin-bottom:10px; border-bottom:1px solid #e3e3e3; font-weight:700; font-size:18px;}

#yorumlar #yorum_yaz {width:690px; float:left;}
#yorumlar #yorum_yaz form {float:left; margin-bottom:20px;}
#yorumlar #yorum_yaz input[type="text"] {padding:10px; border:1px solid #cbcbcb; width:46%; font-size:12px; font-family: 'PT Sans', sans-serif;}
#yorumlar #yorum_yaz textarea {font-size:12px; border:1px solid #cbcbcb; width:670px; float:left; margin:15px 0; padding:10px; font-family: 'PT Sans', sans-serif; height:80px;}
#yorumlar #yorum_yaz span {float:right; font-size:12px; color:#cbcbcb;}
#yorumlar #yorum_yaz input[type="submit"] {float:right; border:none; padding:10px 15px; font-family: 'PT Sans', sans-serif; background:#f9b60a; color:#fff;}

#yorumlar #tum_yorumlar {width:690px; float:left;}
#yorumlar #tum_yorumlar #yorum_yok {width:660px; float:left; padding:15px; background:#ffeec2; border-bottom:1px solid #d3c39c;}
#yorumlar #tum_yorumlar .yorum {width:670px; padding:10px; background:#f0f0f0; border-bottom:1px solid #cdcdcd; margin-bottom:10px; float:left;}
#yorumlar #tum_yorumlar .yorum h4 {width:670px; font-size:13px; float:left; padding-bottom:10px; margin-bottom:10px; border-bottom:1px solid #cdcdcd;}
#yorumlar #tum_yorumlar .yorum h4 .tarih {font-size:11px; float:right;}
#yorumlar #tum_yorumlar .yorum span.yrm {width:670px; float:left;}

.kgaleri {width:238px; height:220px; float:left; margin-right:15px; margin-bottom:15px;}
	.kgaleri a {float:left; width:100%;}
	.kgaleri span.img {width:100%; height:160px; float:left; margin-bottom:10px;}
	.kgaleri span.gb {font-size:16px; margin-bottom:2px; width:100%; float:left; text-align:center; color:#296398; font-weight:700;}
	.kgaleri span.ga {font-size:13px; width:100%; float:left; text-align:center; color:#5d5d5d;}
	
	
#yeni_urunler {width:790px; float:left;}
	 .yurun {width:370px; float:left; margin-right:18px; margin-bottom:18px; border:1px solid #d5dae0; transition:all 0.5s;}
	.yurun:hover {border:1px solid #f19118;}
	.yurun a {float:left;}
	.yurun a img {width:370px; height:210px; display:block; float:left;}
	.yurun .yu_text {width:100%; float:left; padding:15px; background:#d5dae0; box-sizing:border-box; transition:all 0.5s;}
	.yurun:hover .yu_text {background:#f19118 !important;}
	.yurun .yu_text h2 {width:100% float:left; font-size:16px; font-weight:700; margin-bottom:2px;}
	.yurun .yu_text h2 a {float:left;}
	.yurun:hover .yu_text h2 a {color:#000;}
	.yurun .yu_text span {width:100%; float:left;}

	.yurun2 {width:360px; height:314px; float:left; margin-right:18px; margin-bottom:18px; border:1px solid #d5dae0; transition:all 0.5s;}
	.yurun2:hover {border:1px solid #f19118;}
	.yurun2 a {float:left;}
	.yurun2 a img {width:360px; height:210px; display:block; float:left;}
	.yurun2 .yu_text {width:100%; float:left; padding:15px; background:#d5dae0; box-sizing:border-box; transition:all 0.5s;}
	.yurun2:hover .yu_text {background:#f19118 !important;}
	.yurun2 .yu_text h2 {width:100% float:left; font-size:16px; font-weight:700; margin-bottom:2px;}
	.yurun2 .yu_text h2 a {float:left;}
	.yurun2:hover .yu_text h2 a {color:#000;}
	.yurun2 .yu_text span {width:100%; float:left;}

@media screen and (max-width:768px) {
	.abaslik>span {width:100%; float:left;}

	#header {float:left; margin-top:0px;}
	#header #hust {width:100%; float:left; height:auto; padding:15px; box-sizing:border-box;}
	#header #hust h1 {width:100%; float:left; text-align:center; margin-bottom:10px;}
	#header #hust h1 a {width:230px; height:61px; display:inline-block; float:initial;}
	#header #hust #hiletisim {display:none;}
	#header #hust #ssyl_ara {width:100%;}

	#header #halt {height:auto; float:left; padding:10px; box-sizing:border-box;}
	#header #halt ul {display:none;}
	#header #halt select {display:block; width:100%; float:left; height:40px; line-height:40px; padding:0 15px; box-sizing:border-box; font-family: 'PT Sans', sans-serif; border:none; background:#fff; border-radius:5px;}

	#slider {height:600px;}
	#slider ul {height:600px;}
	#slider ul li {height:600px;}
	#slider ul li .syazi {width:100%; transform: inherit; top:inherit; left:inherit; left:0px; padding:20px; bottom:210px; box-sizing:border-box;}
	#slider #sayfalar {width:100%; left:initial; transform:initial;}
	#slider #sayfalar a.ss {width:100%; border-right:none; position:relative; padding:10px; border-bottom:1px solid #ffffff30;}
	#slider #sayfalar a.ss i {position:absolute; top:10px; left:10px; margin-top:0px;}
	#slider #sayfalar a.ss h4 {width:100%; padding-left:40px; box-sizing:border-box;}
	#slider #sayfalar a.ss span {width:100%; padding-left:40px; box-sizing:border-box;}

	#kutular {width:100%; padding:20px; box-sizing:border-box;}
	#kutular .kutu {margin-right:0px; width:100%; margin-bottom:20px;}

	#bhaberler {width:100%; float:left; padding:20px; box-sizing:border-box;}
	#bhaberler #bh_cerceve {width:100%; float:left;}
	#bhaberler #bh_cerceve .bhaber {width:100%; float:left; margin-right:0px; padding:15px; height:auto;}
	#bhaberler #bh_cerceve .bhaber a.bhimg {width:100%; float:left;}
	#bhaberler #bh_cerceve .bhaber a.bhimg img {width:100%; height:auto; margin-bottom:10px;}
	#bhaberler #bh_cerceve .bhaber h2, 
	#bhaberler #bh_cerceve .bhaber span {width:100%;}
	#bhaberler #bh_cerceve .bhaber a.detay {margin-top:15px;}

	#ugruplari {width:100%; float:left; padding:20px; box-sizing:border-box;}
	#ugruplari #ug_cerceve {width:100%; float:left;}
	#ugruplari #ug_cerceve .ugrup {width:100%; float:left;}
	#ugruplari #ug_cerceve .ugrup img {width:100%; float:left; height:auto;}
	#ugruplari #ug_cerceve .ugrup .ug_text {height:auto; padding:15px;}
	#ugruplari #ug_cerceve .ugrup .ug_text a.detay {position:relative; right:initial; top:initial; float:right; margin-top:15px;}

	#footer {width:100%; float:left; margin-bottom:0px;}
	#footer #fust {}
	#footer #fust .fmenu {width:100% !important; margin-bottom:20px;}
	#footer #fust .fmenu ul {padding-left:0px;}
	#footer #fust #amenu ul li {width:100%;}

	#footer #falt span {width:100%;}
	#footer #falt a {float:left; margin-top:15px;}


	#yeni_urunler {width:100%;}
	.yurun {width:100%; float:left;}
	.yurun a img {width:100%; height:auto;}
	.yurun2 {width:100%; margin-right:0px; height:auto;}

	.kgaleri {width:100%; margin-right:0px; height:auto;}

	#sayfa_cerceve {margin:0px;}
	#sayfa {width:100%; float:left; box-sizing:border-box;}
	#sayfa #sayfa_orta {width:100%; word-wrap: break-word;}
	#sayfa #sayfa_orta h1 {width:100%; font-size:18px;}
	#sayfa #sayfa_orta img, 
	#sayfa #sayfa_orta #urun_resim {width:100% !important; height:auto !important;}
	#sayfa #sayfa_orta iframe {width:100% !important; height:250px !important;}
	#sayfa #sayfa_orta #haberler {width:100%;}
	#sayfa #sayfa_orta .gallery li {width:50%;}
	#sayfa #sayfa_orta #iletisim1 {width:100%; margin-top:20px;}
	#sayfa #sayfa_orta #iletisim2 {width:100%; margin-top:20px;}

	#sayfa #sayfa_sidebar {width:100%; margin-top:20px;}
	#sayfa #sayfa_sidebar ul {width:100%;}
	#sayfa #sayfa_sidebar ul li {margin-left:0px; margin-left:0px; padding:0 20px; box-sizing:border-box;}
}

@media screen and (min-width:768px) {
	body {min-width:1020px;}
}

.urun_bilgilendirme {width:100%; margin-top:20px; border-radius:5px; background:#f9bf3b; float:left; padding:20px; box-sizing:border-box; }
	.urun_bilgilendirme a {background:#00367d; color:#fff; font-size:18px; text-align:center; padding:15px; box-sizing:border-box; width:100%; color:#fff; float:left; font-weight:700; border-radius:5px; margin-top:15px; transition:all 0.5s;}
	.urun_bilgilendirme a:hover {transform:scale(1.02);}


/*
	Mıngır
*/
@import url('https://fonts.googleapis.com/css2?family=Kodchasan:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kodchasan:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,200;1,300;1,400;1,500;1,600;1,700&family=Truculenta:opsz,wght@12..72,100..900&display=swap');

.bg-transparent{
    background:rgba(0,0,0,0) !important
}
@keyframes rotate{
    0%{
        transform:rotate(0deg)
    }
    100%{
        transform:rotate(360deg)
    }
}
.button{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    border-radius:5px;
    padding:10px 20px;
    transition:color .3s ease-in-out,background .3s ease-in-out,border-color .3s ease-in-out,opacity .3s ease-in-out;
    width:fit-content;
    border:none;
    cursor:pointer;
    outline:none
}
@media(max-width: 600px){
    .button{
        padding:5px 10px;
        font-size:14px
    }
}
.button--offer{
    height:45px;
    background:#257fc4;
    color:#fff;
    font-weight:700
}
.button--offer:hover{
    background:#0b0033;
    color:#fff
}
.button--lang{
    height:45px;
    gap:5px;
    border:1px solid rgba(52,52,52,.1882352941);
    padding:0 7px;
    color:#343434
}
.button--lang img{
    width:30px;
    height:30px;
    border-radius:3px
}
@media(max-width: 600px){
    .button--lang img{
        display:none
    }
}
.button--lang:hover{
    background:#0b0033;
    color:#fff;
    border-color:#0b0033
}
.button--menu{
    height:45px;
    width:45px;
    border:1px solid rgba(52,52,52,.1882352941);
    color:#343434;
    font-size:36px
}
.button--menu:hover{
    background:#0b0033;
    color:#fff;
    border-color:#0b0033
}
.button--slide-white{
    padding:10px 25px;
    background:#fff;
    color:#257fc4;
    border-radius:45px
}
@media(max-width: 600px){
    .button--slide-white{
        padding:10px 15px
    }
}
.button--slide-white:hover{
    background:#0b0033;
    color:#fff
}
.button--slide-ghost{
    padding:10px 25px;
    border:1px solid #fff;
    color:#fff;
    border-radius:45px
}
@media(max-width: 600px){
    .button--slide-ghost{
        padding:10px 15px
    }
}
.button--slide-ghost:hover{
    background:#fff;
    color:#257fc4
}
.button--main{
    padding:10px 25px;
    background:#2387d3;
    color:#fff;
    border-radius:45px
}
.button--main:hover{
    background:#0b0033;
    color:#fff
}
.button--all{
    padding:8px 30px;
    border:1px solid rgba(52,52,52,.2);
    border-radius:43px;
    color:#343434
}
@media(max-width: 600px){
    .button--all{
        padding:8px 15px
    }
}
.button--all:hover{
    border-color:#257fc4
}
.button--product-category{
    padding:8px 15px;
    border:1px solid #257fc4;
    font-size:14px;
    color:#257fc4
}
.button--product-detail{
    padding:0px;
    position:relative;
    width:55px;
    overflow:hidden
}
.button--product-detail i{
    height:40px;
    width:40px;
    background:#257fc4;
    color:#fff;
    font-size:24px;
    position:relative;
    z-index:2;
    border-radius:5px;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:background .3s ease-in-out,color .3s ease-in-out
}
.button--product-detail::before{
    content:"";
    width:20px;
    height:50px;
    background:#257fc4;
    left:5px;
    bottom:3px;
    display:block;
    position:absolute;
    border-radius:10px 5px 5px 5px;
    transform:perspective(50px) rotateX(40deg);
    z-index:1;
    transition:background .3s ease-in-out
}
.button--blog-category{
    padding:6px 10px;
    color:#fff;
    background:#257fc4;
    font-size:14px;
    font-weight:300
}
.button--detail-category{
    border:1px solid rgba(52,52,52,.4);
    color:#343434
}
.button--detail-category:hover{
    border-color:#257fc4;
    color:#257fc4
}
.button--detail-offer{
    background:#257fc4;
    color:#fff
}
.button--detail-offer:hover{
    background:#0b0033;
    color:#fff
}
.button--related-all{
    border:1px solid #257fc4;
    color:#257fc4
}
.button--related-all:hover{
    background:#257fc4;
    color:#fff
}
.button--card-info{
    position:absolute;
    z-index:3;
    background:#257fc4;
    color:#fff
}
.button--card-info:hover{
    background:#0b0033;
    color:#fff
}
.button--form-clear{
    padding:0px;
    background:none;
    color:#343434;
    font-size:14px;
    font-weight:500;
    opacity:.5
}
.button--form-clear:hover{
    opacity:1
}
.button--form-submit{
    background:#257fc4;
    color:#fff;
    font-weight:500
}
.button--form-submit:hover{
    background:#0b0033;
    color:#fff
}
.title{
    width:100%;
    text-align:center;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:10px
}
.title h4,.title h5{
    font-weight:400;
    max-width:980px;
    font-size:26px
}
@media(max-width: 600px){
    .title h4,.title h5{
        font-size:18px
    }
}
.title h4 span,.title h5 span{
    border-bottom:10px solid #c3e5ff;
    display:inline-block;
    line-height:.5;
    font-weight:600
}
.title>span{
    font-weight:300;
    max-width:980px
}
@media(max-width: 600px){
    .title>span{
        font-size:14px
    }
}
.title--faq{
    align-items:start;
    text-align:left;
    width:535px;
    flex-shrink:0
}
@media(max-width: 600px){
    .title--faq{
        width:100%
    }
}
ul.menu{
    display:flex;
    gap:10px;
    align-items:center;
    justify-content:center
}
@media(max-width: 600px){
    ul.menu{
        width:100%;
        overflow:auto;
        justify-content:start
    }
}
ul.menu li{
    display:flex
}
ul.menu a{
    padding:10px 20px;
    border:1px solid rgba(52,52,52,.4);
    border-radius:5px;
    color:#343434;
    white-space:nowrap
}
ul.menu a.active{
    border-color:#257fc4;
    background:#257fc4;
    color:#fff !important
}
ul.menu a:hover{
    border-color:#257fc4;
    color:#257fc4
}
.pagination{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:15px
}
.pagination a.uil{
    color:#0b0033;
    font-size:24px;
    opacity:.3;
    transition:opacity .3s ease-in-out
}
.pagination a.uil:hover{
    opacity:1
}
.pagination ul{
    display:flex;
    gap:10px
}
.pagination ul li{
    display:flex
}
.pagination ul a{
    border:1px solid rgba(52,52,52,.4);
    border-radius:5px;
    color:#343434;
    width:40px;
    height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:600
}
.pagination ul a:hover{
    border-color:#257fc4;
    color:#257fc4
}
.pagination ul a.active{
    border-color:#257fc4;
    background:#257fc4;
    color:#fff !important
}
.title-sub{
    height:350px;
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    overflow:hidden;
    color:#fff
}
@media(max-width: 600px){
    .title-sub{
        height:auto
    }
}
.title-sub__container{
    width:1200px;
    height:100%;
    display:flex;
    flex-direction:column;
    justify-content:center;
    position:relative;
    z-index:90
}
@media(max-width: 600px){
    .title-sub__container{
        width:100%
    }
}
.title-sub__container::before{
    content:"";
    position:absolute;
    width:400px;
    height:400px;
    background:url("../images/icon-e.png") center center no-repeat;
    background-size:contain;
    opacity:.3;
    right:-50px;
    bottom:-100px;
    animation:rotate 60s linear infinite;
    filter:brightness(1000%);
    z-index:-1;
    pointer-events:none
}
.title-sub__wrapper{
    max-width:830px;
    height:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center
}
@media(max-width: 600px){
    .title-sub__wrapper{
        max-width:100%;
        padding:30px 15px
    }
}
.title-sub__wrapper h1{
    font-size:56px;
    font-weight:600;
    width:100%
}
@media(max-width: 600px){
    .title-sub__wrapper h1{
        font-size:26px
    }
}
@media(max-width: 600px){
    .title-sub__wrapper span{
        font-size:14px
    }
}
.title-sub .breadcrumb{
    height:60px
}
@media(max-width: 600px){
    .title-sub .breadcrumb{
        height:auto;
        padding:10px 15px;
        background:rgba(255,255,255,.7019607843);
        backdrop-filter:blur(10px);
        display:none
    }
}
.title-sub__img{
    width:100%;
    height:100%;
    position:absolute;
    z-index:1;
    top:0;
    left:0;
    object-fit:cover
}
.title-sub::before{
    content:"";
    width:100%;
    height:100%;
    position:absolute;
    z-index:2;
    top:0;
    left:0;
    background:rgba(37,127,196,.7019607843);
    backdrop-filter:blur(10px)
}
.title-sub::after{
    content:"";
    background:rgba(255,255,255,.7019607843);
    backdrop-filter:blur(10px);
    height:60px;
    width:calc((100% + 150px - 1200px)/2 + 1200px);
    position:absolute;
    bottom:-5px;
    left:-100px;
    z-index:3;
    border-radius:0 20px 0 0;
    transform:perspective(800px) rotateX(20deg)
}
@media(max-width: 600px){
    .title-sub::after{
        display:none
    }
}
.breadcrumb{
    display:flex;
    align-items:center;
    gap:20px;
    color:#343434;
    font-size:14px;
    position:relative
}
.breadcrumb li{
    display:flex
}
.breadcrumb li.uil-angle-right{
    font-size:16px;
    opacity:.5
}
.breadcrumb li.code{
    position:absolute;
    right:50px
}
.breadcrumb a{
    color:#343434
}
.breadcrumb a:hover{
    color:#257fc4
}
.social{
    display:flex;
    gap:10px
}
.social li{
    display:flex
}
.social a{
    padding:10px;
    border-radius:10px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#0b0033;
    background:rgba(37,127,196,.1019607843);
    font-size:18px;
    transition:color .3s ease-in-out,background .3s ease-in-out
}
.social a:hover{
    background:#257fc4;
    color:#fff
}
.header--open{
    overflow:hidden
}
.header--open .header{
    height:100%;
    min-height:680px;
    width:100%;
    overflow:hidden;
    z-index:99
}
@media(max-width: 600px){
    .header--open .header{
        overflow:auto;
        min-height:auto
    }
}
.header--open .header::before{
    opacity:1
}
.header--open .header__phone{
    opacity:0
}
.header--open .header__logo{
    left:0%;
    transform:translateX(0%)
}
.header--open .header__bottom{
    height:100%;
    opacity:1
}
@media(max-width: 600px){
    .header--open .header__bottom{
        overflow:auto
    }
}
.header{
    background:#fff;
    box-shadow:0px 5px 15px rgba(0,0,0,.0509803922);
    display:flex;
    justify-content:center;
    position:fixed;
    width:100%;
    top:0px;
    left:0px;
    z-index:99;
    transition:all .3s ease-in-out;
    height:90px
}
@media(max-width: 600px){
    .header{
        height:70px
    }
}
.header::before{
    content:"";
    position:absolute;
    width:590px;
    height:590px;
    background:url("../images/icon-e.png") center center no-repeat;
    background-size:contain;
    opacity:.3;
    right:-150px;
    bottom:-150px;
    animation:rotate 60s linear infinite;
    opacity:0;
    transition:opacity .3s ease-in-out
}
@media(max-width: 600px){
    .header::before{
        display:none
    }
}
.header__container{
    width:1200px;
    display:flex;
    position:relative;
    flex-direction:column
}
@media(max-width: 600px){
    .header__container{
        width:100%
    }
}
.header__top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    position:relative;
    flex-shrink:0;
    width:100%;
    z-index:90;
    background:#fff;
    height:90px
}
@media(max-width: 600px){
    .header__top{
        height:70px;
        padding:0 15px;
        position:fixed
    }
}
.header__phone{
    display:flex;
    flex-direction:column;
    transition:opacity .3s ease-in-out
}
@media(max-width: 600px){
    .header__phone{
        display:none
    }
}
.header__phone span{
    font-size:12px
}
.header__phone a{
    font-size:18px
}
.header__logo{
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    transition:all .3s ease-in-out
}
.header__logo img{
    max-height:50px
}
@media(max-width: 600px){
    .header__logo img{
        max-height:40px
    }
}
@media(max-width: 600px){
    .header__logo{
        position:relative;
        left:0;
        transform:translateX(0)
    }
}
.header__right{
    display:flex;
    gap:10px;
    align-items:center
}
@media(max-width: 600px){
    .header__right .button--offer{
        display:none
    }
}
.header__lang{
    display:flex;
    position:relative
}
.header__lang:hover .button--lang{
    background:#0b0033;
    color:#fff;
    border-color:#0b0033
}
.header__lang:hover .header__lang-sub{
    display:block
}
.header__lang-sub{
    display:none;
    position:absolute;
    padding-top:5px;
    top:45px;
    right:0px
}
.header__lang-sub>ul{
    display:flex;
    flex-direction:column;
    padding:15px;
    background:#fff;
    border-radius:5px;
    box-shadow:0px 5px 15px rgba(0,0,0,.0509803922);
    border:1px solid #f4f4f4
}
.header__lang-sub>ul li{
    display:flex
}
.header__lang-sub>ul a{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:5px;
    font-size:14px;
    transition:color .3s ease-in-out,background .3s ease-in-out;
    gap:5px;
    border-radius:5px;
    width:100%
}
.header__lang-sub>ul a:hover{
    background:#257fc4;
    color:#fff
}
.header__lang-sub>ul img{
    width:20px;
    height:20px;
    border-radius:3px
}
.header__bottom{
    display:flex;
    overflow:hidden;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    height:0px;
    opacity:0;
    transition:all .3s ease-in-out
}
@media(max-width: 600px){
    .header__bottom{
        padding:15px;
        justify-content:start;
        padding-top:70px
    }
}
.header__bottom-wrapper{
    display:flex;
    align-items:start;
    justify-content:space-between;
    gap:30px
}
@media(max-width: 600px){
    .header__bottom-wrapper{
        flex-direction:column
    }
}
.header__bottom .contact-card{
    padding:0 80px
}
@media(max-width: 600px){
    .header__bottom .contact-card{
        padding:0
    }
}
.header__nav{
    width:650px;
    padding:0 80px;
    border-right:1px solid #f4f4f4
}
@media(max-width: 600px){
    .header__nav{
        width:100%;
        padding:0;
        border-right:none
    }
}
.header__nav>ul{
    display:flex;
    flex-direction:column;
    gap:20px
}
@media(max-width: 600px){
    .header__nav>ul{
        gap:10px
    }
}
.header__nav>ul>li{
    display:flex;
    flex-direction:column
}
.header__nav>ul>li>a{
    display:flex;
    align-items:center;
    justify-content:space-between;
    font-size:28px;
    font-weight:600
}
@media(max-width: 600px){
    .header__nav>ul>li>a{
        font-size:18px
    }
}
.header__nav>ul>li ul{
    padding-left:30px;
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:10px;
    margin-top:10px
}
.slider{
    width:100%;
    background:red;
    overflow:hidden;
    display:flex;
    position:relative
}
.slider__container{
    width:100%;
    display:flex
}
.slider__item{
    width:100%;
    height:calc(100vh - 90px);
    background:blue;
    min-height:768px;
    position:relative;
    display:flex;
    align-items:end;
    color:#fff;
    justify-content:center;
    overflow:hidden
}
@media(max-width: 600px){
    .slider__item{
        height:calc(100vh - 70px);
        min-height:500px
    }
}
.slider__item-wrapper{
    width:1200px;
    position:relative;
    z-index:3
}
@media(max-width: 600px){
    .slider__item-wrapper{
        width:100%;
        padding:15px;
        margin-bottom:45px
    }
}
.slider__item-info{
    display:flex;
    flex-direction:column;
    width:600px;
    position:relative;
    padding-bottom:100px;
    height:430px;
    justify-content:center
}
@media(max-width: 600px){
    .slider__item-info{
        width:100%;
        height:auto;
        padding:20px;
        border-radius:10px;
        background:rgba(37,127,196,.7019607843);
        backdrop-filter:blur(10px)
    }
}
.slider__item-info h2{
    font-size:46px;
    font-weight:600
}
@media(max-width: 600px){
    .slider__item-info h2{
        font-size:26px
    }
}
.slider__item-info h2 a{
    color:#fff
}
.slider__item-info span{
    margin-bottom:15px
}
@media(max-width: 600px){
    .slider__item-info span{
        font-size:14px
    }
}
.slider__item-buttons{
    display:flex;
    align-items:center;
    gap:20px;
    gap:10px
}
.slider__item img{
    width:100%;
    height:100%;
    object-fit:cover;
    position:absolute;
    top:0;
    left:0;
    background:gray;
    z-index:1
}
.slider__item-bg{
    content:"";
    background:rgba(37,127,196,.7019607843);
    backdrop-filter:blur(10px);
    height:460px;
    width:calc((100% + 150px - 1200px)/2 + 650px);
    position:absolute;
    bottom:-5px;
    left:-100px;
    z-index:2;
    border-radius:0 40px 0 0;
    transform:perspective(800px) rotateX(20deg)
}
@media(max-width: 600px){
    .slider__item-bg{
        display:none
    }
}
.slider__pagination{
    position:absolute;
    padding:40px 0 130px 40px;
    bottom:0px;
    right:0px;
    z-index:3;
    width:calc((100% - 1200px)/2 + 650px);
    display:flex;
    align-items:center
}
@media(max-width: 600px){
    .slider__pagination{
        padding:0;
        width:100%;
        justify-content:center;
        bottom:10px
    }
}
.slider__pagination-container{
    display:flex;
    align-items:center;
    gap:15px
}
.slider__pagination-container i{
    cursor:pointer;
    font-size:32px;
    color:#0b0033;
    opacity:.5;
    transition:opacity .3s ease-in-out
}
.slider__pagination-container i:hover{
    opacity:1
}
.slider__pagination-wrapper{
    display:flex;
    align-items:center;
    gap:10px
}
.slider__pagination-wrapper span{
    width:15px;
    height:15px;
    border-radius:100%;
    background:#0b0033;
    cursor:pointer;
    opacity:.5;
    transition:opacity .3s ease-in-out,background .3s ease-in-out
}
.slider__pagination-wrapper span.swiper-pagination-bullet-active{
    background:#2387d3;
    opacity:1
}
.slider__pagination-wrapper span:hover{
    opacity:1
}
.slider__pagination::before{
    content:"";
    background:rgba(255,255,255,.7019607843);
    backdrop-filter:blur(10px);
    height:220px;
    position:absolute;
    bottom:-5px;
    width:calc(100% + 130px);
    right:-100px;
    z-index:-1;
    border-radius:30px 0 0 0;
    transform:perspective(800px) rotateX(20deg)
}
@media(max-width: 600px){
    .slider__pagination::before{
        display:none
    }
}
.about{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    margin-top:-100px;
    position:relative;
    z-index:90
}
@media(max-width: 600px){
    .about{
        margin:0px
    }
}
.about__container{
    width:1200px;
    display:flex;
    justify-content:space-between;
    padding:50px;
    background:#fff;
    border-radius:20px;
    gap:50px;
    position:relative;
    overflow:hidden;
    transition:box-shadow .3s ease-in-out
}
@media(max-width: 600px){
    .about__container{
        width:100%;
        flex-direction:column;
        padding:30px 15px;
        border-radius:0px;
        gap:20px
    }
}
.about__container::before{
    content:"";
    position:absolute;
    width:400px;
    height:400px;
    background:url("../images/icon-e.png") center center no-repeat;
    background-size:contain;
    opacity:.3;
    right:-50px;
    bottom:-100px;
    animation:rotate 60s linear infinite
}
.about__container:hover{
    box-shadow:0px 10px 10px rgba(0,0,0,.0509803922)
}
.about__container:hover::before{
    animation-play-state:paused
}
.about__img{
    width:530px;
    display:flex;
    flex-shrink:0;
    position:relative
}
@media(max-width: 600px){
    .about__img{
        width:100%
    }
}
.about__img-mask{
    width:100%;
    height:345px;
    mask-image:url("../images/mask-big-img.svg");
    -webkit-mask-image:url("../images/mask-big-img.svg");
    mask-repeat:no-repeat;
    -webkit-mask-repeat:no-repeat
}
@media(max-width: 600px){
    .about__img-mask{
        width:100%;
        height:300px;
        mask-image:none;
        -webkit-mask-image:none
    }
}
.about__img-mask img{
    width:100%;
    height:100%;
    object-fit:cover
}
@media(max-width: 600px){
    .about__img-mask img{
        border-radius:20px
    }
}
.about__img-mask-video{
    width:285px;
    height:210px;
    position:absolute;
    bottom:-20px;
    right:-20px;
    mask-image:url("../images/mask-small-img.svg");
    -webkit-mask-image:url("../images/mask-small-img.svg");
    mask-repeat:no-repeat;
    -webkit-mask-repeat:no-repeat
}
@media(max-width: 600px){
    .about__img-mask-video{
        mask-image:none;
        -webkit-mask-image:none;
        width:150px;
        height:150px;
        bottom:10px;
        right:10px;
        border-radius:10px;
        overflow:hidden
    }
}
.about__img-mask-video img{
    width:100%;
    height:100%;
    object-fit:cover;
    position:relative;
    z-index:1
}
.about__img-mask-video i{
    width:50px;
    height:50px;
    border-radius:100%;
    background:#fff;
    color:#2387d3;
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:3;
    font-size:32px;
    transition:transform .3s ease-in-out,background .3s ease-in-out,color .3s ease-in-out
}
.about__img-mask-video::before{
    content:"";
    width:100%;
    height:100%;
    background:rgba(37,127,196,.7019607843);
    position:absolute;
    left:0px;
    top:0px;
    z-index:2;
    transition:background .3s ease-in-out
}
.about__img-mask-video:hover i{
    transform:translate(-50%, -50%) scale(1.2);
    background:#0b0033;
    color:#fff
}
.about__img-mask-video:hover::before{
    background:rgba(37,127,196,.9176470588)
}
.about__info{
    display:flex;
    flex-direction:column;
    align-items:start;
    gap:10px
}
.about__info h3{
    font-size:32px;
    font-weight:600;
    color:#0b0033
}
@media(max-width: 600px){
    .about__info h3{
        font-size:22px
    }
}
.about__info h3 span{
    border-bottom:10px solid #c3e5ff;
    display:inline-block;
    line-height:.5
}
.about__info-text{
    line-height:28px
}
.slogans{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    padding:80px 0
}
@media(max-width: 600px){
    .slogans{
        padding:30px 15px
    }
}
.slogans__container{
    width:1200px;
    display:flex;
    flex-direction:column;
    gap:30px
}
@media(max-width: 600px){
    .slogans__container{
        width:100%;
        gap:20px
    }
}
.slogans__wrapper{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:25px
}
@media(max-width: 600px){
    .slogans__wrapper{
        grid-template-columns:repeat(1, 1fr);
        gap:10px
    }
}
.slogan{
    padding:30px;
    background:#fff;
    border-radius:20px;
    display:flex;
    gap:10px;
    transition:box-shadow .5s ease-in-out
}
.slogan:hover{
    box-shadow:0px 10px 10px rgba(0,0,0,.0509803922)
}
.slogan img{
    width:65px;
    height:65px;
    object-fit:contain
}
@media(max-width: 600px){
    .slogan img{
        width:50px;
        height:50px
    }
}
.slogan__info{
    display:flex;
    flex-direction:column;
    gap:3px
}
.slogan__info h5{
    font-size:18px;
    font-weight:600;
    color:#0b0033
}
.slogan__info span{
    font-size:14px
}
.products{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    padding:80px 0;
    background:#fff
}
@media(max-width: 600px){
    .products{
        padding:30px 15px
    }
}
.products__container{
    width:1200px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:30px
}
@media(max-width: 600px){
    .products__container{
        width:100%;
        gap:20px
    }
}
.products__wrapper{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:25px
}
@media(max-width: 600px){
    .products__wrapper{
        grid-template-columns:repeat(1, 1fr);
        gap:10px
    }
}
.product{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center
}
.product:hover .product__text{
    background:#257fc4;
    color:#fff
}
.product:hover .product__text h2 a{
    color:#fff
}
.product:hover .button--product-category{
    border-color:#fff;
    color:#fff
}
.product:hover .button--product-detail i{
    background:#fff;
    color:#257fc4
}
.product:hover .button--product-detail::before{
    background:#fff
}
.product__img{
    width:100%;
    display:flex
}
.product__img img{
    aspect-ratio:12/9;
    object-fit:cover;
    width:100%;
    border-radius:20px
}
.product__text{
    margin:0 15px;
    width:calc(100% - 30px);
    background:rgba(37,127,196,.0509803922);
    padding:20px 25px;
    display:flex;
    flex-direction:column;
    border-radius:0px 0px 10px 10px;
    transition:background .5s ease-in-out
}
.product__text>h2{
    font-size:16px;
    font-weight:600;
    margin-bottom:5px
}
.product__text>span{
    font-size:14px;
    margin-bottom:15px;
    transition:color .5s ease-in-out
}
.product__info{
    display:flex;
    align-items:center;
    justify-content:space-between
}
.product-detail{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    padding:80px 0
}
.product-detail__container{
    width:1200px;
    display:flex;
    justify-content:space-between;
    gap:30px
}
.faq{
    display:flex;
    justify-content:center;
    padding:80px 0
}
@media(max-width: 600px){
    .faq{
        padding:30px 15px
    }
}
.faq__container{
    width:1200px;
    display:flex;
    justify-content:space-between;
    align-items:start;
    gap:30px
}
@media(max-width: 600px){
    .faq__container{
        width:100%;
        flex-direction:column;
        gap:20px
    }
}
.faq__wrapper{
    display:flex;
    gap:20px;
    flex-direction:column
}
@media(max-width: 600px){
    .faq__wrapper{
        gap:10px
    }
}
.faq-item{
    display:flex;
    background:#fff;
    border-radius:10px;
    overflow:hidden;
    transition:all .5s ease-in-out
}
.faq-item__icon{
    width:55px;
    justify-content:center;
    display:flex;
    color:#fff;
    background:#257fc4;
    padding-top:15px;
    flex-shrink:0;
    transition:all .5s ease-in-out;
    cursor:pointer
}
.faq-item__icon i::before{
    content:""
}
.faq-item__text{
    padding:15px
}
.faq-item__text h4{
    font-size:18px;
    font-weight:600;
    color:#0b0033
}
.faq-item__info{
    display:flex;
    height:0px;
    overflow:hidden;
    flex-direction:column;
    opacity:0;
    transition:all .5s ease-in-out
}
.faq-item__info p:last-child{
    margin-bottom:0
}
.faq-item.active .faq-item__icon{
    background:rgba(37,127,196,.0509803922);
    color:#257fc4
}
.faq-item.active .faq-item__icon i::before{
    content:""
}
.faq-item.active .faq-item__info{
    display:flex;
    height:100%;
    opacity:1
}
.blogs{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    padding:80px 0;
    background:#fff
}
@media(max-width: 600px){
    .blogs{
        padding:30px 15px
    }
}
.blogs__container{
    width:1200px;
    display:flex;
    flex-direction:column;
    gap:30px
}
@media(max-width: 600px){
    .blogs__container{
        width:100%;
        gap:20px
    }
}
.blogs__wrapper{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:25px
}
@media(max-width: 600px){
    .blogs__wrapper{
        grid-template-columns:repeat(1, 1fr);
        gap:10px
    }
}
.blog{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center
}
.blog:hover .blog__text{
    background:#257fc4;
    color:#fff
}
.blog:hover .blog__text h3 a{
    color:#fff
}
.blog:hover .button--blog-category{
    background:#fff;
    color:#257fc4
}
.blog__img{
    width:100%;
    display:flex
}
.blog__img img{
    aspect-ratio:13/9;
    object-fit:cover;
    width:100%;
    border-radius:20px
}
.blog__text{
    margin:0 15px;
    width:calc(100% - 30px);
    background:rgba(37,127,196,.0509803922);
    padding:20px 25px;
    display:flex;
    flex-direction:column;
    border-radius:0px 0px 10px 10px;
    transition:background .3s ease-in-out
}
.blog__text>h3{
    font-size:16px;
    font-weight:600;
    margin-bottom:5px
}
.blog__text>span{
    font-size:14px;
    margin-bottom:15px;
    transition:color .3s ease-in-out
}
.blog__info{
    display:flex;
    align-items:center;
    justify-content:space-between
}
.blog__date{
    font-size:14px;
    opacity:.7;
    transition:color .3s ease-in-out
}
.contact{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    padding-top:80px
}
@media(max-width: 600px){
    .contact{
        padding:30px 15px 0 15px
    }
}
.contact__container{
    width:1200px;
    display:flex;
    align-items:center;
    gap:40px;
    padding:80px 50px;
    border-radius:20px;
    background:rgba(37,127,196,.0509803922);
    overflow:hidden;
    position:relative;
    transition:box-shadow .3s ease-in-out
}
@media(max-width: 600px){
    .contact__container{
        width:100%;
        flex-direction:column;
        gap:20px;
        padding:30px
    }
}
.contact__container::before{
    content:"";
    position:absolute;
    width:300px;
    height:300px;
    background:url("../images/icon-e.png") center center no-repeat;
    background-size:contain;
    opacity:.5;
    right:-50px;
    bottom:-100px;
    animation:rotate 60s linear infinite
}
.contact__container:hover{
    box-shadow:0px 10px 10px rgba(0,0,0,.0509803922)
}
.contact__container:hover::before{
    animation-play-state:paused
}
.contact__text{
    width:550px;
    flex-shrink:0;
    display:flex;
    flex-direction:column;
    gap:15px
}
@media(max-width: 600px){
    .contact__text{
        width:100%
    }
}
.contact__text h6{
    font-size:46px;
    font-weight:600px;
    line-height:55px;
    color:#0b0033
}
@media(max-width: 600px){
    .contact__text h6{
        font-size:26px;
        line-height:30px
    }
}
.contact__text h6 span{
    color:#257fc4
}
.contact-card{
    display:flex;
    flex-direction:column;
    gap:15px
}
.contact-card__row{
    display:flex;
    gap:30px
}
@media(max-width: 600px){
    .contact-card__row{
        flex-direction:column;
        gap:15px
    }
}
.contact-item{
    display:flex;
    flex-direction:column;
    max-width:320px
}
.contact-item span:first-child{
    font-size:14px;
    font-weight:300
}
.contact-item a{
    width:max-content
}
.contact-item__phone{
    font-size:32px
}
.gallery{
    display:flex;
    flex-direction:column;
    padding-top:80px;
    gap:30px
}
@media(max-width: 600px){
    .gallery{
        padding:30px 15px 0 15px;
        gap:20px
    }
}
.gallery__slider{
    display:flex;
    overflow:hidden;
    position:relative
}
.gallery__slider-wrapper{
    display:flex
}
.gallery__slider-item{
    width:100%;
    display:flex;
    max-width:320px;
    aspect-ratio:12/9;
    overflow:hidden;
    border-radius:20px
}
@media(max-width: 600px){
    .gallery__slider-item{
        max-width:100%
    }
}
.gallery__slider-item img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .3s ease-in-out
}
.gallery__slider-item:hover img{
    transform:scale(1.2)
}
.gallery__slider i{
    position:absolute;
    width:100px;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:45px;
    opacity:.5;
    transition:opacity .3s ease-in-out;
    cursor:pointer;
    z-index:99
}
@media(max-width: 600px){
    .gallery__slider i{
        background:none !important;
        width:50px
    }
}
.gallery__slider i:hover{
    opacity:1
}
.gallery__slider i.uil-angle-left-b{
    left:0px;
    background:linear-gradient(270deg, rgba(246, 246, 246, 0) 12.29%, #F6F6F6 100%)
}
.gallery__slider i.uil-angle-right-b{
    right:0px;
    background:linear-gradient(270deg, #F6F6F6 12.29%, rgba(246, 246, 246, 0) 100%)
}
.footer{
    margin-top:80px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    background:#fff
}
@media(max-width: 600px){
    .footer{
        margin-top:30px
    }
}
.footer__top{
    padding:80px 0;
    display:flex;
    align-items:center;
    justify-content:center
}
@media(max-width: 600px){
    .footer__top{
        padding:30px 15px
    }
}
.footer__top-container{
    width:1200px;
    display:flex;
    justify-content:space-between;
    gap:35px
}
@media(max-width: 600px){
    .footer__top-container{
        width:100%;
        flex-direction:column;
        gap:20px
    }
}
.footer__bottom{
    border-top:1px solid #f4f4f4;
    padding:50px 0;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%
}
@media(max-width: 600px){
    .footer__bottom{
        padding:30px 15px
    }
}
.footer__bottom-container{
    max-width:860px;
    text-align:center;
    font-size:14px;
    font-weight:300
}
.footer__bottom-container .vevona{
    display:inline-block;
    align-items:center;
    justify-content:center;
    gap:10px
}
.footer__bottom-container .vevona img{
    transition:transform .3s ease-in-out
}
.footer__bottom-container .vevona:hover img{
    transform:perspective(1000px) rotateX(360deg)
}
.footer__cop{
    display:flex;
    flex-direction:column;
    gap:20px;
    width:440px;
    flex-shrink:0
}
@media(max-width: 600px){
    .footer__cop{
        width:100%
    }
}
.footer__logo{
    display:flex
}
.footer__logo img{
    max-height:35px
}
.footer__menu{
    display:flex;
    flex-direction:column;
    gap:10px
}
.footer__menu h6{
    font-size:16px;
    font-weight:600;
    color:#0b0033
}
.footer__menu ul{
    display:flex;
    gap:10px;
    flex-direction:column
}
.footer__menu ul li{
    display:flex
}
.footer__menu ul a{
    font-size:14px;
    color:#343434
}
.footer__menu ul a:hover{
    color:#257fc4
}
.footer__menu--2col ul{
    display:grid;
    grid-template-columns:repeat(2, 1fr)
}
.product-detail{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    padding-top:50px
}
@media(max-width: 600px){
    .product-detail{
        padding:30px 15px 0 15px
    }
}
.product-detail__container{
    width:1200px;
    display:flex;
    justify-content:space-between;
    gap:30px
}
@media(max-width: 600px){
    .product-detail__container{
        width:100%;
        flex-direction:column
    }
}
.product-detail__content{
    width:890px;
    flex-shrink:0;
    display:flex;
    flex-direction:column
}
@media(max-width: 600px){
    .product-detail__content{
        width:100%
    }
}
.product-detail__sidebar{
    display:flex;
    flex-direction:column;
    gap:20px;
    width:280px
}
@media(max-width: 600px){
    .product-detail__sidebar{
        width:100%
    }
}
.sidebar-categories{
    display:flex;
    gap:15px;
    flex-direction:column;
    margin-bottom:10px
}
.sidebar-categories h4{
    font-weight:400;
    max-width:980px;
    font-size:22px
}
.sidebar-categories h4 span{
    border-bottom:10px solid #c3e5ff;
    display:inline-block;
    line-height:.5;
    font-weight:600
}
.sidebar-categories ul{
    display:flex;
    flex-direction:column;
    width:100%;
    background:rgba(37,127,196,.0509803922);
    border-radius:10px;
    padding:20px
}
.sidebar-categories ul li{
    display:flex;
    width:100%
}
.sidebar-categories ul li:last-child a{
    border-bottom:none
}
.sidebar-categories ul a{
    display:flex;
    width:100%;
    align-items:center;
    justify-content:space-between;
    padding:10px 0;
    border-bottom:1px solid rgba(37,127,196,.1019607843);
    font-weight:500
}
.sidebar-categories ul a i{
    font-size:24px;
    opacity:.1;
    transition:opacity .3s ease-in-out
}
.sidebar-categories ul a:hover i{
    opacity:1
}
.sidebar-item{
    width:100%;
    position:relative;
    display:flex;
    border-radius:10px;
    overflow:hidden
}
.sidebar-item img{
    width:100%;
    height:160px;
    object-fit:cover
}
@media(max-width: 600px){
    .sidebar-item img{
        height:auto;
        aspect-ratio:16/9
    }
}
.sidebar-item span{
    position:absolute;
    bottom:0px;
    left:0px;
    padding:15px 20px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    background:rgba(255,255,255,.7019607843);
    backdrop-filter:blur(10px);
    border-radius:0 10px 0 0;
    font-weight:500
}
.product-slider{
    width:100%;
    overflow:hidden;
    position:relative
}
.product-slider__wrapper{
    width:100%
}
.product-slider__item{
    display:flex;
    width:100%
}
.product-slider__item img{
    width:100%;
    height:520px;
    object-fit:cover;
    border-radius:20px
}
@media(max-width: 600px){
    .product-slider__item img{
        height:auto;
        aspect-ratio:12/9
    }
}
.product-slider__pagination{
    position:absolute;
    z-index:90;
    bottom:30px !important;
    display:flex;
    gap:10px;
    z-index:90;
    align-items:center;
    justify-content:center;
    width:100%
}
@media(max-width: 600px){
    .product-slider__pagination{
        bottom:15px !important
    }
}
.product-slider__pagination span{
    width:15px;
    height:15px;
    border-radius:100%;
    background:#0b0033;
    opacity:.5;
    cursor:pointer;
    transition:background .3s ease-in-out,opacity .3s ease-in-out
}
.product-slider__pagination span:hover{
    opacity:1
}
.product-slider__pagination span.swiper-pagination-bullet-active{
    background:#257fc4;
    opacity:1
}
.product-slider__arrow{
    width:55px;
    height:55px;
    font-size:32px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:100%;
    background:#fff;
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    cursor:pointer;
    z-index:90;
    opacity:.5;
    transition:opacity .3s ease-in-out
}
.product-slider__arrow:hover{
    opacity:1
}
.product-slider__arrow.uil-angle-left-b{
    left:30px
}
@media(max-width: 600px){
    .product-slider__arrow.uil-angle-left-b{
        left:15px
    }
}
.product-slider__arrow.uil-angle-right-b{
    right:30px
}
@media(max-width: 600px){
    .product-slider__arrow.uil-angle-right-b{
        right:15px
    }
}
.detail-info{
    display:flex;
    width:100%;
    justify-content:space-between;
    align-items:center;
    margin:20px 0
}
.detail-info__left{
    display:flex;
    gap:20px;
    align-items:center
}
.detail-content{
    letter-spacing:.3px;
    line-height:26px
}
.detail-content h1,.detail-content h2,.detail-content h3,.detail-content h4,.detail-content h5,.detail-content h6{
    font-weight:600;
    color:#0b0033;
    margin-bottom:10px;
    line-height:normal
}
.detail-content h1 span,.detail-content h2 span,.detail-content h3 span,.detail-content h4 span,.detail-content h5 span,.detail-content h6 span{
    border-bottom:10px solid #c3e5ff;
    display:inline-block;
    line-height:.5
}
.detail-content table{
    width:100%;
    border-collapse:collapse;
    margin:20px 0;
    background:rgba(37,127,196,.0509803922)
}
.detail-content table th,.detail-content table td{
    text-align:left;
    border:1px solid rgba(37,127,196,.1019607843);
    padding:10px
}
.detail-content table th{
    background:rgba(37,127,196,.0509803922)
}
.detail-content table tr:hover{
    background:rgba(37,127,196,.0509803922)
}
.related{
    padding-top:80px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column
}
@media(max-width: 600px){
    .related{
        padding:30px 15px 0 15px
    }
}
.related__container{
    width:1200px;
    display:flex;
    flex-direction:column;
    gap:30px
}
@media(max-width: 600px){
    .related__container{
        width:100%;
        gap:20px
    }
}
.related__title{
    display:flex;
    align-items:center;
    justify-content:space-between
}
.related__title h4{
    font-weight:400;
    max-width:980px;
    font-size:26px
}
@media(max-width: 600px){
    .related__title h4{
        font-size:22px
    }
}
.related__title h4 span{
    border-bottom:10px solid #c3e5ff;
    display:inline-block;
    line-height:.5;
    font-weight:600
}
.related__slider{
    width:100%;
    overflow:hidden;
    position:relative
}
.related__slider-wrapper{
    width:100%;
    display:flex
}
.related__slider-wrapper .product{
    max-width:385px
}
.related__slider-arrow{
    width:55px;
    height:55px;
    font-size:32px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:100%;
    background:#fff;
    position:absolute;
    top:110px;
    cursor:pointer;
    z-index:90;
    opacity:.5;
    transition:opacity .3s ease-in-out
}
.related__slider-arrow:hover{
    opacity:1
}
.related__slider-arrow.uil-angle-left-b{
    left:15px
}
.related__slider-arrow.uil-angle-right-b{
    right:15px
}
.corporate{
    padding-top:80px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column
}
@media(max-width: 600px){
    .corporate{
        padding:30px 15px 0 15px
    }
}
.corporate__container{
    width:1200px;
    display:flex;
    flex-direction:column;
    gap:50px
}
@media(max-width: 600px){
    .corporate__container{
        width:100%;
        gap:20px
    }
}
.card-info{
    width:100%;
    display:flex;
    gap:50px;
    align-items:center;
    justify-content:space-between
}
@media(max-width: 600px){
    .card-info{
        flex-direction:column !important;
        gap:10px
    }
}
.card-info__img{
    position:relative;
    display:flex
}
.card-info__img-mask{
    width:585px;
    height:340px;
    mask-image:url("../images/mask-card-info-img-left.svg");
    -webkit-mask-image:url("../images/mask-card-info-img-left.svg");
    mask-repeat:no-repeat;
    -webkit-mask-repeat:no-repeat;
    position:relative;
    z-index:2
}
@media(max-width: 600px){
    .card-info__img-mask{
        width:100%;
        height:auto;
        mask-image:none !important;
        -webkit-mask-image:none !important
    }
}
.card-info__img-mask img{
    width:585px;
    height:340px;
    object-fit:cover;
    position:relative;
    z-index:1
}
@media(max-width: 600px){
    .card-info__img-mask img{
        width:100%;
        height:auto;
        aspect-ratio:12/9;
        border-radius:20px
    }
}
.card-info__img-shadow{
    width:320px;
    height:230px;
    position:absolute;
    z-index:1;
    background:url("../images/card-info-shadow-left.svg") top left no-repeat;
    bottom:-30px;
    right:-15px
}
@media(max-width: 600px){
    .card-info__img-shadow{
        display:none
    }
}
.card-info__img .button--card-info{
    bottom:30px;
    right:15px
}
@media(max-width: 600px){
    .card-info__img .button--card-info{
        bottom:20px;
        right:20px;
        left:initial !important
    }
}
.card-info__content{
    width:100%;
    max-width:585px;
    display:flex;
    flex-direction:column;
    gap:10px
}
.card-info__content h2{
    font-weight:400;
    font-size:32px
}
@media(max-width: 600px){
    .card-info__content h2{
        font-size:26px
    }
}
.card-info__content h2 span{
    border-bottom:10px solid #c3e5ff;
    display:inline-block;
    line-height:.5;
    font-weight:600
}
@media(max-width: 600px){
    .card-info__content h2 span{
        border-bottom:none;
        line-height:normal
    }
}
.card-info__text{
    line-height:28px;
    letter-spacing:.3px
}
.card-info--right{
    flex-direction:row-reverse
}
@media(max-width: 600px){
    .card-info--right{
        flex-direction:initial
    }
}
.card-info--right .card-info__img .card-info__img-mask{
    mask-image:url("../images/mask-card-info-img-right.svg");
    -webkit-mask-image:url("../images/mask-card-info-img-right.svg")
}
.card-info--right .card-info__img .card-info__img-shadow{
    background:url("../images/card-info-shadow-right.svg") top left no-repeat;
    bottom:-30px;
    left:-15px
}
.card-info--right .card-info__img .button--card-info{
    bottom:30px;
    left:15px
}
.about-detail{
    padding:80px 0;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column
}
@media(max-width: 600px){
    .about-detail{
        padding:30px 15px
    }
}
.about-detail__container{
    width:1200px;
    display:flex;
    flex-direction:column;
    gap:30px
}
@media(max-width: 600px){
    .about-detail__container{
        width:100%
    }
}
.about-video{
    position:relative;
    overflow:hidden;
    border-radius:20px;
    width:100%;
    height:530px
}
@media(max-width: 600px){
    .about-video{
        width:100%;
        height:100%;
        aspect-ratio:16/9
    }
}
.about-video img{
    width:100%;
    height:100%;
    object-fit:cover;
    position:relative;
    z-index:1
}
.about-video i{
    width:50px;
    height:50px;
    border-radius:100%;
    background:#fff;
    color:#2387d3;
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:3;
    font-size:32px;
    transition:transform .3s ease-in-out,background .3s ease-in-out,color .3s ease-in-out
}
.about-video::before{
    content:"";
    width:100%;
    height:100%;
    background:rgba(37,127,196,.7019607843);
    position:absolute;
    left:0px;
    top:0px;
    z-index:2;
    transition:background .3s ease-in-out
}
.about-video:hover i{
    transform:translate(-50%, -50%) scale(1.2);
    background:#0b0033;
    color:#fff
}
.about-video:hover::before{
    background:rgba(37,127,196,.9176470588)
}
.about-info{
    padding:80px 0 50px;
    background:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column
}
@media(max-width: 600px){
    .about-info{
        padding:30px 15px
    }
}
.about-info__container{
    width:1200px;
    display:flex;
    flex-direction:column;
    gap:50px
}
@media(max-width: 600px){
    .about-info__container{
        width:100%;
        gap:20px
    }
}
.about-info__numbers{
    display:flex;
    gap:50px
}
@media(max-width: 600px){
    .about-info__numbers{
        gap:20px;
        flex-direction:column
    }
}
.about-info__numbers-title{
    display:flex;
    flex-direction:column;
    gap:5px;
    width:500px;
    flex-shrink:0
}
@media(max-width: 600px){
    .about-info__numbers-title{
        width:100%
    }
}
.about-info__numbers-title h5{
    font-weight:600;
    font-size:32px;
    color:#0b0033
}
@media(max-width: 600px){
    .about-info__numbers-title h5{
        font-size:22px
    }
}
.about-info__numbers-title span{
    letter-spacing:.3px;
    line-height:26px
}
@media(max-width: 600px){
    .about-info__numbers-title span{
        font-size:14px;
        line-height:normal;
        letter-spacing:normal
    }
}
.about-info__numbers-logo{
    font-weight:400;
    color:#343434
}
.about-info__numbers-logo strong{
    color:#257fc4
}
.about-info__numbers-wrapper{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    width:100%;
    gap:30px
}
@media(max-width: 600px){
    .about-info__numbers-wrapper{
        grid-template-columns:repeat(1, 1fr)
    }
}
.about-info__content{
    display:flex;
    gap:30px
}
@media(max-width: 600px){
    .about-info__content{
        flex-direction:column;
        gap:10px
    }
}
.about-info__content img{
    width:640px;
    height:385px;
    object-fit:cover;
    flex-shrink:0;
    border-radius:20px;
    position:relative;
    z-index:2
}
@media(max-width: 600px){
    .about-info__content img{
        width:100%;
        height:100%;
        aspect-ratio:16/9
    }
}
.about-info__text{
    display:flex;
    flex-direction:column
}
.about-info__text h3,.about-info__text h4,.about-info__text h5,.about-info__text h6{
    font-weight:600;
    color:#0b0033;
    font-size:32px;
    margin-bottom:10px
}
@media(max-width: 600px){
    .about-info__text h3,.about-info__text h4,.about-info__text h5,.about-info__text h6{
        font-size:22px;
        margin-bottom:0px
    }
}
.number-item{
    display:flex;
    gap:10px
}
.number-item__number{
    font-size:76px;
    font-weight:700;
    line-height:76px;
    color:#257fc4
}
.number-item__text{
    display:flex;
    justify-content:center;
    flex-direction:column
}
.number-item__text span{
    font-size:22px
}
.number-item__text span:first-child{
    font-weight:600;
    color:#0b0033
}
.about-slogan{
    padding:110px 0 60px 0;
    background:#257fc4;
    color:#fff;
    font-size:26px;
    font-weight:600;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    position:relative;
    z-index:1;
    margin-top:-110px
}
@media(max-width: 600px){
    .about-slogan{
        padding:30px 15px;
        margin:0px;
        font-size:18px
    }
}
.about-slogan__container{
    width:1200px
}
@media(max-width: 600px){
    .about-slogan__container{
        width:100%
    }
}
.timeline{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:80px 0px;
    background:#fff;
    position:relative
}
@media(max-width: 600px){
    .timeline{
        padding:30px 15px
    }
}
.timeline::before{
    content:"";
    width:100%;
    height:1px;
    background:#257fc4;
    position:absolute;
    left:0px;
    top:50%;
    z-index:1;
    transform:translateY(-50%)
}
@media(max-width: 600px){
    .timeline::before{
        width:1px;
        height:100%;
        left:50px;
        top:0px;
        transform:none
    }
}
.timeline__container{
    width:1200px;
    display:flex;
    justify-content:space-between
}
@media(max-width: 600px){
    .timeline__container{
        width:100%;
        flex-direction:column;
        gap:40px
    }
}
.timeline__item{
    display:flex;
    height:200px;
    flex-direction:column;
    position:relative
}
@media(max-width: 600px){
    .timeline__item{
        height:auto;
        padding-left:70px
    }
}
.timeline__item:nth-child(2n){
    justify-content:end
}
.timeline__item::before{
    content:"";
    width:15px;
    height:15px;
    border-radius:100%;
    background:#257fc4;
    position:absolute;
    left:-15px;
    top:50%;
    transform:translateY(-50%);
    border:15px solid #e9f2f9
}
@media(max-width: 600px){
    .timeline__item::before{
        left:13px
    }
}
.timeline__item h6{
    font-size:26px;
    font-weight:700;
    color:#1f7ec2;
    line-height:1
}
.timeline__item span{
    font-weight:600
}
.human-resources{
    padding:80px 0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center
}
@media(max-width: 600px){
    .human-resources{
        padding:30px 15px
    }
}
.human-resources__container{
    width:1200px;
    display:flex;
    flex-direction:column
}
@media(max-width: 600px){
    .human-resources__container{
        width:100%
    }
}
.job-application{
    padding:80px 0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    background:#fff
}
@media(max-width: 600px){
    .job-application{
        padding:30px 15px
    }
}
.job-application__container{
    width:1200px;
    display:flex;
    flex-direction:column;
    gap:30px
}
@media(max-width: 600px){
    .job-application__container{
        width:100%;
        gap:20px
    }
}
.forms{
    width:100%;
    display:flex;
    gap:20px;
    flex-direction:column
}
.forms__row{
    display:flex;
    width:100%;
    gap:20px
}
@media(max-width: 600px){
    .forms__row{
        flex-direction:column
    }
}
.forms__buttons{
    display:flex;
    gap:20px;
    align-items:center;
    justify-content:end
}
.forms__item{
    width:100%;
    position:relative
}
.forms__item input,.forms__item select,.forms__item textarea{
    width:100%;
    padding:10px 15px;
    border:2px solid #eee;
    border-radius:5px
}
.forms__item input:focus,.forms__item select:focus,.forms__item textarea:focus{
    border:2px solid #257fc4
}
.forms__item input:not(:placeholder-shown):not(:focus):valid+label,.forms__item input:focus+label,.forms__item select:not(:placeholder-shown):not(:focus):valid+label,.forms__item select:focus+label,.forms__item textarea:not(:placeholder-shown):not(:focus):valid+label,.forms__item textarea:focus+label{
    top:-6px;
    left:10px;
    font-size:12px;
    font-weight:300;
    padding:0px 10px
}
.forms__item textarea{
    height:200px
}
.forms__item label{
    position:absolute;
    left:2px;
    top:2px;
    font-weight:400;
    color:#343434;
    transition:all .3s ease;
    padding:10px 15px;
    border-radius:5px;
    background:#fff;
    pointer-events:none;
    transition:all .3s ease
}
.blog-detail{
    padding:80px 0;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#fff;
    position:relative
}
@media(max-width: 600px){
    .blog-detail{
        padding:30px 15px
    }
}
.blog-detail::before{
    position:absolute;
    width:100%;
    height:500px;
    content:"";
    background:#f6f6f6;
    left:0px;
    top:0px
}
@media(max-width: 600px){
    .blog-detail::before{
        display:none
    }
}
.blog-detail__container{
    display:flex;
    flex-direction:column;
    width:960px;
    position:relative;
    z-index:2
}
@media(max-width: 600px){
    .blog-detail__container{
        width:100%
    }
}
.blog-detail__title{
    display:flex;
    flex-direction:column;
    margin-bottom:30px
}
@media(max-width: 600px){
    .blog-detail__title{
        margin-bottom:20px
    }
}
.blog-detail__title .breadcrumb{
    height:auto;
    margin-bottom:10px
}
@media(max-width: 600px){
    .blog-detail__title .breadcrumb{
        display:none
    }
}
.blog-detail__title h1{
    font-size:26px;
    font-weight:600;
    color:#0b0033
}
@media(max-width: 600px){
    .blog-detail__title h1{
        font-size:22px
    }
}
.blog-detail__title span{
    letter-spacing:.3px;
    line-height:28px
}
.blog-detail__img{
    width:calc(100% + 240px);
    margin-left:-120px;
    border-radius:20px;
    max-height:530px;
    object-fit:cover;
    margin-bottom:30px
}
@media(max-width: 600px){
    .blog-detail__img{
        width:calc(100% + 30px);
        margin-left:-15px;
        border-radius:0px;
        aspect-ratio:16/9
    }
}
.blog-detail__content{
    width:100%;
    margin-bottom:30px
}
@media(max-width: 600px){
    .blog-detail__content{
        margin-bottom:20px
    }
}
.blog-detail__content img{
    width:100%;
    max-height:550px;
    border-radius:20px;
    object-fit:cover;
    margin:10px 0
}
.offer-popup{
    max-width:850px;
    background:#fff;
    padding:40px;
    position:relative;
    margin:auto;
    border-radius:20px
}
@media(max-width: 600px){
    .offer-popup{
        padding:20px
    }
}
.offer-popup h1{
    font-weight:600;
    font-size:22px;
    margin-bottom:15px
}
@media(max-width: 600px){
    .offer-popup h1{
        font-size:18px
    }
}
.page{
    padding-top:80px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column
}
@media(max-width: 600px){
    .page{
        padding:30px 15px 0px 15px
    }
}
.page__container{
    width:1200px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:30px
}
@media(max-width: 600px){
    .page__container{
        width:100%;
        gap:20px
    }
}
.photo-gallery{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:20px
}
@media(max-width: 600px){
    .photo-gallery{
        grid-template-columns:repeat(2, 1fr)
    }
}
.photo-gallery li{
    display:flex
}
.photo-gallery a{
    display:flex;
    position:relative;
    border-radius:10px;
    overflow:hidden
}
.photo-gallery a::before{
    content:"";
    width:100%;
    height:100%;
    position:absolute;
    left:0px;
    top:0px;
    background:rgba(37,127,196,.5);
    z-index:1;
    transition:all .3s ease;
    opacity:0
}
.photo-gallery a:hover i{
    opacity:1
}
.photo-gallery a:hover::before{
    opacity:1
}
.photo-gallery img{
    width:100%;
    height:auto;
    aspect-ratio:300/220;
    object-fit:cover
}
.photo-gallery i{
    position:absolute;
    width:55px;
    height:55px;
    border-radius:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:32px;
    color:#257fc4;
    background:#fff;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
    opacity:0;
    z-index:2;
    transition:all .3s ease
}
.document-gallery{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:20px
}
@media(max-width: 600px){
    .document-gallery{
        grid-template-columns:repeat(2, 1fr)
    }
}
.document-gallery li{
    display:flex
}
.document-gallery a{
    display:flex;
    position:relative;
    flex-direction:column;
    gap:5px;
    text-align:center
}
.document-gallery img{
    width:100%;
    height:auto;
    border-radius:10px;
    aspect-ratio:9/12;
    object-fit:cover
}
.document-gallery i{
    position:absolute;
    width:55px;
    height:55px;
    border-radius:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:32px;
    color:#257fc4;
    background:#fff;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
    opacity:0;
    z-index:2;
    transition:all .3s ease
}
.contact-map{
    width:100%;
    height:600px;
    margin-bottom:30px;
    background:#fff;
    border-radius:20px;
    overflow:hidden;
    margin-bottom:20px
}
@media(max-width: 600px){
    .contact-map{
        aspect-ratio:16/9;
        height:auto
    }
}
.contact-page{
    width:100%;
    display:flex;
    justify-content:space-between;
    gap:50px
}
@media(max-width: 600px){
    .contact-page{
        flex-direction:column;
        gap:20px
    }
}
.contact-page__content{
    width:470px;
    flex-shrink:0;
    display:flex;
    flex-direction:column
}
@media(max-width: 600px){
    .contact-page__content{
        width:100%
    }
}
.contact-page__content>h3{
    font-size:26px;
    font-weight:600;
    color:#0b0033
}
.contact-page__content>span{
    font-weight:300;
    letter-spacing:.3px;
    line-height:28px;
    margin-bottom:20px
}
.contact-page__wrapper{
    display:flex;
    flex-direction:column;
    gap:20px
}
.contact-page__item{
    display:flex;
    gap:15px
}
.contact-page__item i{
    font-size:24px;
    color:#257fc4;
    border-radius:10px;
    width:55px;
    height:55px;
    flex-shrink:0;
    background:#fff;
    display:flex;
    align-items:center;
    justify-content:center
}
.contact-page__item-info{
    display:flex;
    flex-direction:column
}
.contact-page__item-info span:first-child{
    font-size:12px;
    font-weight:300
}
.contact-page__item-info a{
    font-size:18px
}
.contact-page__forms{
    padding:40px;
    background:#fff;
    border-radius:20px
}
@media(max-width: 600px){
    .contact-page__forms{
        padding:20px
    }
}
	