/*
Theme Name: Webisoft
*/

img { max-width:100% !important; height:auto; }
.alignnone { margin-bottom:30px; }
.alignleft { float:left; margin:0 30px 30px 0; }
.alignright { float:right; margin:0 0 30px 30px; }
.aligncenter { display:block; margin:0 auto 30px; }
.wp-caption { max-width:100%; margin-bottom:30px; }
.wp-caption .wp-caption-text { margin-bottom:0; padding:5px; font-style:italic; text-align:center; }

.post_list { margin:0; padding:0; display:grid; align-items:stretch; width:100%; grid-template-columns:repeat(3, 1fr); column-gap:1em; }
.post_block { display:block; margin:0 0 1em 0; padding:16px; background:#000; border-radius:4px; color:#fff; }
.post_block .img { margin:0 0 15px 0; padding:0; border-radius:4px; overflow:hidden; aspect-ratio: 3 / 2; }
.post_block .img .bg { display:block; width:100%; height:100%; background-repeat:no-repeat; background-size:cover; background-position:left center; }
.post_block .img img { margin:0; padding:0; width:100%; height:auto; object-fit:cover; aspect-ratio: 3 / 2; }
.post_block .meta { margin:0 0 16px; padding:0 0 16px; border-bottom:1px dashed #777; display:flex; justify-content:space-between; }
.post_block .meta span { margin:0; padding:0; font-size:12px; text-transform:uppercase; color:#fff; }
.post_block h3 { margin:0 0 16px; font-size:24px; line-height:32px; font-weight:500; color:#fff; }
.post_block h3 a { color:inherit; }

.post_high_block { display:flex; align-items:stretch; grid-template-columns:repeat(2, 1fr); column-gap:1em; margin:0; padding:16px; background:#000; border-radius:4px; color:#fff; }
.post_high_block .desc { margin:0; padding:0 0 50px 0; width:50%; position: relative;  }
.post_high_block .desc .desc_right { margin:0 0 0 118px; padding:0; }
.post_high_block .img { margin:0; padding:0; width:50%; border-radius:4px; overflow:hidden; aspect-ratio: 3 / 2; }
.post_high_block .img .bg { display:block; width:100%; height:100%; background-repeat:no-repeat; background-size:cover; background-position:left center; }
.post_high_block .img img { margin:0; padding:0; width:100%; height:auto; object-fit:cover; aspect-ratio: 3 / 2; }
.post_high_block .meta { margin:0 0 48px; padding:0 0 16px; border-bottom:1px dashed #777; display:flex; justify-content:space-between; }
.post_high_block .meta span { margin:0; padding:0; font-size:12px; text-transform:uppercase; color:#fff; }
.post_high_block h2 { margin:0 0 16px; font-size:42px; line-height:48px; font-weight:500; color:#fff; max-width:600px; }
.post_high_block h2 a { color:inherit; }

.post_filter { margin:24px 0 32px; padding:24px 0 0; border-top:1px dashed #777;  }
.post_filter .post_filter_inner button, .post_filter .post_filter_inner a { white-space: nowrap; flex: 0 0 auto; }
/*.post_filter .post_filter_list {  display: flex;  overflow-x: auto;  cursor: grab;  user-select: none;  scroll-behavior: smooth; }*/

.post_high_block .c-button { background: #DE5849 !important;      position: absolute !important;    bottom: 0; border-color: transparent !important;  }
.post_high_block .c-button:before { border-color: #DE5849 !important; display: none; }
.post_high_block .c-button_icon .c-icon svg { fill: #000 !important; }
.post_high_block .c-button .c-button_label { color: #000000 !important; }

.post_high_block .c-button:hover { background: #DE5849 !important; }
.blog_title { position: absolute; bottom: calc(100% - 15px); left: 50%; margin: 0; padding: 0; color: #000; text-transform: uppercase; font-size: 12px; font-weight: 400; }
.blog_title span { display: none; margin: 0 0 0 auto; }

.pager { margin:30px 0; text-align:center; }

.scroll-container {
  width: 95vw;
  overflow: hidden;
  cursor: grab;
  
}

.scroll-content::-webkit-scrollbar {
  display: none; /* for Chrome, Safari, and Opera */
}
 
.scroll-content {
  display: flex;
  overflow-x: scroll;
  scroll-behavior: smooth;
  -ms-overflow-style: none; /* for Internet Explorer, Edge */
  scrollbar-width: none; /* for Firefox */
  overflow-y: scroll; 
}

 
.item {
  display: flex;
  justify-content: center;
  align-items: center;
  user-select: none;
}


.small_container { max-width: 1200px; margin-left: auto !important; margin-right: auto !important;  }
.blog_back { padding: 0 0 15px 0; margin: 0 0 30px 0; border-bottom: 1px dashed  #777777; }
.blog_back .blog_back_inn { display: flex; align-items: center; justify-content: space-between;  }
.blog_back .back_link { display: inline-block; vertical-align: top; background: url(images/back_arr.svg) no-repeat left center; font-size: 12px; font-weight: 400; color: #000000; padding: 0 0 0 18px; text-transform: uppercase; }
.blog_back .social { display: flex; align-items: center; margin: 0; padding: 0; }
.blog_back .social a { display: inline-block;  margin: 0 0 0 8px; padding: 0; vertical-align: top; font-size: 0; }
.blog_back .social a img { vertical-align: top; }
.blog_back .social h6 { font-size: 12px; font-weight: 400; color: #000000; text-transform: uppercase; margin: 0 8px 0 0; padding: 0; }
.image_block { margin: 0 auto 32px; padding: 0; max-width: 1000px; }
.image_block img { margin: 0; padding: 0; vertical-align: top; width: 100%; }
.text_block { margin: 0 0 24px 0; padding: 0; }
.text_block p { margin: 0 0 24px 0; padding: 0; }
.text_block p:last-child { margin-bottom: 0; }
.text_block ul {     padding: 0 0 0 20px; list-style: disc; }

.blog_top_info { margin: 30px 0 0 0; padding: 15px 0 0 0; border-top: 1px dashed  #777777; }  
.blog_top_info .blog_top_info_inn { padding: 0; max-width:900px; }  
.blog_top_info ul { margin: 0 0 70px 0; padding: 0; display: flex; justify-content: space-between; }
.blog_top_info ul li { margin: 0 0 10px; padding: 0; display: block; font-size: 12px; font-weight: 400; color: #000000; text-transform: uppercase;  }  

#blog_inner h1 { font-size: 2.8em; line-height: 1.15; margin: 0 0 60px 0; font-weight: 500; }
#blog_inner h2 { font-size: 2em; line-height: 1.15; margin: 0 0 40px 0; font-weight: 500; }
.blog_content {margin: 0;padding: 0;position: relative;}
.blog_content .blog_leftbar { margin: 0; padding: 0 20px 0 0; width:70%; }
.blog_content .blog_leftbar p, .blog_content .blog_leftbar ul, .blog_content .blog_leftbar ol { margin-bottom:20px; }
.blog_content .blog_leftbar ul { list-style:disc; margin-left:40px; }
.blog_content .blog_leftbar ol { list-style:decimal; margin-left:40px; }
.blog_content .blog_rightbar {margin: 0;padding: 0;width: 30%; }
.blog_content .blog_rightbar h3 { font-size: 24px; font-weight: 500; color: #000; margin: 0 0 15px 0; padding: 0;     line-height: 1.1; }
.blog_content .blog_rightbar p { font-size: 15px; }
.blog_content .blog_content_inner {margin: 0 auto;padding: 0;position: relative;max-width: 1200px; display:flex;}
.blog_content .blog_rightbar .btn_wrap { display: flex; margin: 30px 0 15px 0; padding: 0 0 15px 0; border-bottom: 1px dashed #777777; }
.blog_content .blog_rightbar .btn_wrap .btn { font-size: 12px; white-space: nowrap; padding: 12px; min-width: 180px; }
.blog_content .blog_rightbar .btn_wrap .btn.call_btn { margin: 0 0 0 8px; min-width: 134px; }
.blog_content .blog_rightbar .btn_wrap .btn.call_btn:after { content: ''; width: 16px; height: 16px; margin: 0 0 0 0; background: url(images/call_btn_icon.svg) no-repeat center center;     z-index: 2; }
.blog_content .blog_rightbar .btn_wrap .btn.call_btn:hover:after{ background: url(images/call_btn_icon_h.svg) no-repeat center center; }
/*.blog_content .blog_rightbar .btn_wrap .btn { display: block; vertical-align: top; font-size: 12px; line-height: 16ox; color: #000; text-transform: uppercase; padding: 10px 12px; border: 1px solid #000000; border-radius: 2px; }
.blog_content .blog_rightbar .btn_wrap .call_btn { margin: 0 0 0 8px; }*/

.blog_content .form_content { margin:0; padding:20px; background:#F0F1F4; position:sticky; top:0; }
.blog_content .form_content .hbspt-form { margin-top:20px; padding-top:20px; border-top: 1px dashed #777777; }

.hbspt-form .field > label { font-family: "SuisseIntlMono", sans-serif; font-weight:normal; text-transform:uppercase; color:#000; }
.hbspt-form .field .input input, .hbspt-form .field .input textarea { border:none !important; background:none !important; border-bottom: 1px dashed #777777 !important; padding:0 !important; }
.hbspt-form .hs-form__virality-link { display:none !important; }
.hbspt-form .actions { text-align:right; }
.hbspt-form .actions .hs-button { width:168px !important; padding:12px 40px 12px 24px; background:url(images/arrow.svg) no-repeat center right 24px !important; border:1px solid #000 !important; color:#000 !important; font-family: "SuisseIntlMono", sans-serif; font-weight:normal; text-transform:uppercase; }
.hbspt-form .actions .hs-button:hover { background-color:#000 !important; color:#fff !important; background-image:url(images/arrow_h.svg) !important; }

.cta_block { background: #000000; margin: 0 0 45px 0; padding: 15px 15px; border-radius: 4px; position: relative;  }
.cta_block h6 { position: absolute; top: 15px; left: 15px; color: #fff; text-transform: uppercase; margin: 0; padding: 0; font-size: 12px; font-weight: 400; }
.cta_block h2 { color: #fff;     max-width: 460px; }
.cta_block .img { position: absolute; bottom: 15px; left: 15px; width: 207px; }
.cta_block .desc { min-height: 490px; position: relative; }
.cta_block .desc p { margin:  auto 0 0 0; color: #fff; position: absolute; bottom: 0; left: 0; text-indent: 50px; font-size: 15px; }
.cta_block .btn { position: absolute !important; bottom: 15px; right: 15px; }
.cta_block .cta_block_inner { position: absolute; left:  calc(-100vw / 2 + 750px / 2); right: 0; bottom: 0; top: 0;background: #000000; border-radius: 4px;}
.cta_block .c-button { background: #DE5849 !important;  border-color: transparent !important; z-index: 22; }
.cta_block .c-button:before { display: none; }
.cta_block .c-icon svg { fill: #000 !important; }
.cta_block .c-button .c-button_label { color: #000000 !important; }
.cta_block .c-button:hover { background: #DE5849 !important; }



.c-hero_header_cta.c-button { background: #DE5849 !important;     border-color: transparent !important;     border-radius: 3px; }
.c-hero_header_cta.c-button:before { border-color: #DE5849 !important; display: none; }
.c-hero_header_cta.c-button .c-button_icon .c-icon svg { fill: #000 !important; }
.c-hero_header_cta.c-button .c-button_label { color: #000000 !important; }
.c-hero_header_cta.c-button:hover { background: #DE5849 !important; }



@media (max-width: 1400px) {

.cta_block .cta_block_inner { left: 0; } 
.cta_block .desc { max-width: none;  margin: 0 0 0 240px !important;   }  

}

@media (max-width: 1200px) {

.cta_block .desc p { bottom: 50px; }

}

@media (max-width: 1024px) {

.post_high_block h2 { font-size: 32px; }
.post_list { grid-template-columns: repeat(2, 1fr); }
.post_high_block .desc .desc_right { margin-left: 0; }
.cta_block .desc {max-width: none; margin-left: 240px; }

.blog_content .blog_rightbar .btn_wrap { display: block; }
.blog_content .blog_rightbar .btn_wrap .btn { min-width: 10px;    width: 100%;    margin: 10px 0 0 0 !important; }

.blog_content .blog_content_inner { display:block; }
.blog_content .blog_leftbar { width:100%; padding-right:0; margin-bottom:40px; }
.blog_content .blog_rightbar { width:100%; }

}

@media (min-width: 700px) {

body .c-header_background_wrapper,body .c-header_bar,body .c-menu_modal_footer,body .c-menu_modal_wrapper,body .c-menu_modal { max-width: 460px;  }


}

@media (max-width: 767px) {
	
.alignnone, .alignleft, .alignright { display:block; float:none; margin:0 auto 30px; }	

.post_high_block { display: block; position: relative; }
.post_high_block .desc { width: 100%; position: static; padding-bottom: 0 !important; }
.post_high_block .img { width: 100%; }
.post_high_block .c-button { position: absolute !important;    bottom: 34px !important;    left: 24px;    right: 24px;           }

.post_list { display: block; }

.small_container { max-width: 100%; }
.cta_block .img { position: relative;    bottom: auto;    left: auto;    width: 100%; margin-bottom: 10px; }
.cta_block .img img { width: 100%;         height: 140px;        object-fit: cover; }
.cta_block .desc { margin: 0 !important; min-height: 10px; }
.cta_block .cta_block_inner { position: static; top: auto; left: auto; right: auto; bottom: auto; }
.cta_block h6 { top: 36px; left: auto; right: 45px;         z-index: 2; }
.cta_block .desc p { position: static;        text-indent: 0;        text-align: right; }
.cta_block { padding-bottom: 70px; }
.cta_block .btn { right: 15px; left: 15px; }
#blog_inner h2 { font-size: 24px; }
.text_block h2 { text-indent: 80px; }
#blog_inner h1 { font-size: 32px; }
.blog_title { position: static;    margin: 0 0.666em; border-bottom: 1px dashed #777777;    padding-bottom: 12px; display: flex; }
.blog_title span { display: block; }
.post_high_block .img span { height: 280px !important; }
.post_high_block h2 { font-size: 24px; line-height: 1.2; }
.post_high_block .desc .desc_right p { display: none; }

}

.toc_list {
	display: none; /* This hides the TOC by default */
}