/*blog*/
body.webshop-cmspage .content>.container-fluid {width:100%;padding:0px}

.blog {font-size:15px}
.blog img {width:100%!important;height:auto!important}

.blog hr {width: 100px;height: 1px;margin: 20px auto 0 auto;background-color:#000;border: none;border-radius: 3px;margin-bottom:50px;}
.blog h1 {text-align: left}

.blog .text-center {text-align: center}
.blog .bgwhite {background:#ffffff}
.blog .bggrey {background:#faf6f6}
.blog .bgdarkgrey {background:#dad8d8}

.blog .head {position: relative;display:flex;justify-content: center;align-items: center}
.blog .head img {filter: brightness(50%);}
.blog .headtext {position: absolute;color:#fff;left:50%;top:0;right:0;bottom:0;display: flex;align-items: center;background:rgba(0,0,0,0.40)}
.headtext div {padding:0 10%}
.blog .headtext h1 {font-size:40px;margin-bottom:10px;color:#fff}
.blog .headtext p {font-weight:normal;font-size:16px;color:#fff}
@media (max-width:779px) {
    .blog .headtext {left:0;text-align: center} 
    .blog .headtext h1 {font-size:22px;text-align: center}
	.blog .headtext h1:after {display:none}
    .blog .headtext p {font-size:13px}
	.blog .head {height:400px}
	.blog .head img {  width: 100%!important;height: 100%!important;object-fit: cover;}
}
.blog .container.text-center {display: block}

.blog .text {padding:60px 0}
.blog .text h2 {text-align: center}

.blog .wrapper {max-width:1370px;margin:0px auto}

.blog .help {display:flex}
.blog .help.reverse {flex-direction:row-reverse}
.blog .help.bggrey h2 {color:#000!important}
.blog .help > div {flex:1}
.blog .help > div:last-child {display: flex;flex-direction: column;justify-content: center;}
.blog .help > div:last-child > div {padding:100px}
.blog .help > div:last-child h2 {color:rgba(115,168,179)}
@media (max-width:779px) {
	.blog .help {flex-direction: column}
	.blog .help.reverse {flex-direction: column}
    .blog .help > div:last-child > div {padding:5%;text-align: center}
    .blog .help > div:last-child > div hr {display: none}
    .blog .help > div:last-child h2 {color:#000;text-align: center}
}

.blogproduct {width:50%;margin:50px auto;display:flex;gap:30px}
.blogproduct img {max-width: 100%!important;}
.blogproduct div {width:50%;display: flex;flex-direction: column;justify-content: center;align-items: flex-start;font-size: 14px;}
@media(max-width:999px) {
    .blogproduct {width:90%}
	
}

.blog .box {padding:50px 0}
.blog .box h2  {text-align: center} 
.blog .box ul {display: flex;list-style: none;margin:50px 0 0 0;padding:10px;gap:50px}
.blog .box ul li {position: relative;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4);padding:40px;border-radius: 20px}
.blog .box i {display: block;font-size:60px}
.blog .box b {display: block;font-size:18px;margin:20px 0}
.blog .box hr {height:3px;position: absolute;bottom:0px;margin-bottom:0;width:calc(100% - 80px - 20%);left:10%; right:10%}
@media (max-width:900px) {
    .blog .box ul {flex-direction: column}
}
