/*///// TURBOCHECK BLOG //////*/ 

.statistics .anchor-busted, .statistics .anchor-news {display: none}
.busted .anchor-stats, .busted .anchor-news {display: none}
.news .anchor-stats, .news .anchor-busted {display: none}


ol li {
    list-style: decimal; /* Ensures numbers are displayed */
}



#hp-blog h1 {
    text-align: center;
}

#hp-blog-article  h1 {
    text-align: center;
    font-size: 42px;
    margin-bottom: 80px
}

#hp-blog h2.hp-about-title {
    margin: 120px auto 0 auto;
    color: #ff8d61;
    font-weight: 500;
    padding: 0px 15px
}

#hp-blog-article h2.hp-about-title {
    margin: 60px auto 0 auto;
    color: #ff8d61;
    font-weight: 500;
    padding: 0px 15px
}

#hp-blog h2, #hp-blog-article h2  {
    max-width: 1200px;
    margin: 0 auto 80px auto;
    text-align: center;
    padding: 0px 15px
}

#hp-blog .hp-front-page.hp-dark {
background: linear-gradient(40deg, black 26%, #000000 88%, #0b0f1b 100%);
}

.blog-title {
	max-width: 1170px;
    margin: auto;
    color: white;
    padding: 0 68px
}
	
.video-container {
    position: relative;
    width: 550px; /* Adjust width as needed */
    height: 550px; /* Ensure it's square */
    overflow: hidden;
    border-radius: 8px; /* Optional rounded corners */
}

.video-container iframe,
.video-container img {
    position: absolute;
    top: 0%; /* Adjust to crop top and bottom margins */
    left: 0;
    width: 100%;
    height: 100%; /* Height to cover the black margins */
    transform: scale(1); /* Optional scaling to adjust fit */
}


.blog-front-container {
	display: flex;
	width: 1040px;
    margin: auto;
    justify-content: space-between;
}

.blog-video {
	margin: auto 0;
	display: block
}

.blog-menu-card {
 border-radius: 10px;
    display: flex;
    justify-content: inherit;
    flex-direction: column;
    padding: 30px;
    background: hsl(0deg 0% 100% / 6%);
    border: 1px solid white;
    cursor: pointer;
    width: 400px;
    margin-bottom: 20px
}


.blog-menu-card:hover,
.blog-menu-card:active {
	border-color: #ed5e27;
    background: #ed5e271a;
}

.blog-separation {
	display: block;
	width: 30px;
	height: 100px;
	}


.menu-title, .menu-text {

    font-weight: normal;
    font-style: normal;
    font-family: Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif;
    color: white;
}

.menu-title {
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 20px;
}

.blog-menu-card:hover .menu-title,
.blog-menu-card:active .menu-title {
    color: #ff8d61;
}

#hp-blog .blog-article-box:hover .blog-box-title,
#hp-blog .blog-article-box:hover .blog-box-subtitle,
#hp-blog .blog-article-box:active .blog-box-title,
#hp-blog .blog-article-box:active .blog-box-subtitle {
    color: #ff8d61;
}

#hp-blog .blog-article-box:hover .blog-box-date,
#hp-blog .blog-article-box:active .blog-box-date {	
	color: white
}

#hp-blog .blog-article-box:hover .blog-box-summary,
#hp-blog .blog-article-box:active .blog-box-summary {	
	color: #ffffffa1
}

.menu-text {
    font-size: 16px;
    font-weight: 400;
    color: #ffffff6e;
    margin-bottom: -11px;
    line-height: 24px;
    letter-spacing: 1PX;
}

.blog-menu-card:hover .menu-text,
.blog-article-box:active .menu-text {
    color: #ffffffa1;
}


.blog-articles-container {
	max-width: 1170px;
	display: flex;
	flex-wrap: wrap;
    margin: auto;
    margin-top: 30px;
	padding: 0 68px;
	justify-content: space-between
}

.blog-article-box {
    background-color: hsl(0deg 0% 100% / 6%);
    margin-bottom: 30px;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    border: 1px solid #ffffff6e;
    border-radius: 10px;
    overflow: hidden;
}

.blog-article-box img {
	width: 100%;
    border-radius: 10px 10px 0 0;
}

.blog-article-emptybox {
	width: 31%;
	max-width: 370px;
	min-width: 310px;
	background-color: transparent;
}

.blog-subscribe {
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-right: 0;
	margin-bottom: 0;
	min-height: 300px;
	transition: all 0.2s ease-in-out;
	cursor: default;
	height: 550px;
	max-width: 370px;
	padding: 0
}

h3.blog-box-title {
    font-size: 18px;
    font-family: Roboto, Arial;
    font-weight: 500;
    line-height: 26px;
    -webkit-font-smoothing: antialiased;
    margin: 20px 30px 0px 30px;
    color: white;
}


h3.blog-box-subtitle {
    font-size: 18px;
    font-family: Roboto, Arial;
    font-weight: 500;
    line-height: 26px;
    -webkit-font-smoothing: antialiased;
    margin: 0px 30px 10px 30px;
    color: white;
}

.blog-article-box.blog-subscribe:hover {
	box-shadow: none;
	background-image: linear-gradient(25deg, #91cbff, aliceblue);
}

#blog-subscribe-form {transition: 1s all ease-in-out}
#blog-subscribe-confirmed {
	opacity: 0; 
	transition: 1s opacity ease-in-out;
	display: none}

.blog-article-box:hover,
.blog-article-box:active {
    border-color: #ed5e27;
    background: #ed5e271a;
}

.blog-article-box:hover .blog-box-cover img,
.blog-article-box:active .blog-box-cover img {
	filter: brightness(1.3)
}


.blog-article-box:hover .blog-box-cover img.less-bright,
.blog-article-box:active .blog-box-cover img.less-bright {
	filter: brightness(1.1)
}

h5.blog-box-date {
    font-size: 14px;
    font-family: Roboto, Arial;
    font-weight: 500;
    line-height: 18px;
    -webkit-font-smoothing: antialiased;
    margin: 0px 30px 20px 30px;
    color: #ffffffc9;
}


h4.blog-box-summary {
	font-size: 16px;
    font-family: Roboto, Arial;
    font-weight: 400;
    line-height: 24px;
    -webkit-font-smoothing: antialiased;
    margin: 0 30px;
    color: #ffffff6e;
    height: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

 h4.blog-post-section {
     font-size: 18px;
    font-weight: 500;
    line-height: 30px;
    text-align: justify;
    font-family: Roboto, Arial;
    color: black;
    }
    
h4.blog-post-section.large-font {
	font-size: 20px;
    margin-bottom: 5px;
}

.blog-box-btn {
    font-size: 14px;
    font-family: Roboto, Arial;
    font-weight: 400;
    margin: 20px 0 30px 30px;
    padding: 5px 15px 5px 5px;
    background-color: #ee5e27;
    display: inline-block;
    color: white;
}

.hp-next-arrow {
    width: 9px;
    height: 18px;
    position: absolute;
    margin-left: 3px;
    fill: white;
}

#blog-subscribe {
	position: relative
}

.blog-article-box:hover .blog-box-btn,
.blog-article-box:active .blog-box-btn {
	background-color: #ee5e27;
	margin: 18px 0 28px 28px;	
	border: 2px solid #ee5e27 
}

form input[type="text"].blog-email-field {
	height: 40px;
	margin: 0 30px 15px 30px;
    width: calc(100% - 60px); 	
}

form input[type="text"], form input[type="password"] {
    font-family: Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif;
    color: #666;
    background-color: #fff;
    position: relative;
    padding: 0 8px;
    font-size: 15px;
    line-height: 21px;
    font-weight: normal;
    border: 1px solid #B4C2CD;
    box-sizing: border-box;
    border-radius: 4px;
    cursor: text;
}


input.blog-email-field::placeholder {
    color: #666;
    opacity: 1;
    font-style: italic;
}

.error.blog-error {
	height: 40px;
    margin: 0 30px 15px 30px;
    width: calc(100% - 60px);
    padding: 0 8px;
    font-size: 15px;
    line-height: 40px;
    border: 1px solid white;
    box-sizing: border-box;
    border-radius: 4px
}

.hp-subscribe-btn {
	font-size: 17px;
    line-height: 21px;
    font-weight: 400;
    width: calc(100% - 60px); 
    text-align: center;
    margin: 0 30px;
}

.blog-subscribe .blog-box-title {
    text-align: center;
    margin: -45px 30px 35px 30px;
}

.blog-share {
	width: 48px;
	height: 48px;
	left: 0;
	cursor: pointer;
	position: relative;
	display: block;
	transition: all 0.3s ease-in-out;
}

.blog-container{ 
	position: fixed;
	width: 48px;
	height: 48px;
	left: 0;
	transition: all 0.3s ease-in-out;
	z-index: 100
}

.blog-container:hover{width: 112px}
.blog-container:hover .blog-share {margin-left: 5px}
.blog-container:hover .blog-share-text {left: 50px; opacity: 1}



@media (min-width: 740px){

.blog-article-box {
	width: 46%;
    max-width: 440px;
    min-width: 310px;
}
}


@media (min-width: 1140px){

.blog-article-box {
	width: 31%;
	max-width: 370px;
    min-width: 310px;
}
}




@media (max-width: 1139px){
.blog-front-container {display: block; margin: auto; width: 100%}
.blog-separation, .blog-menu {display: none}
.video-container {margin: auto}
}

@media (max-width: 739px){

.desktop-only {display: none}	
	
#hp-blog h2.hp-about-title {
    margin: 60px auto 0 auto;
    color: #ff8d61;
    font-weight: 500;
}

#hp-blog-article h2.hp-about-title {
    margin: 30px auto 0 auto;
    color: #ff8d61;
    font-weight: 500;
}

h3.blog-box-title,
h3.blog-box-subtitle {
	padding: 0;
    text-align: left;
}
	
h4.blog-title {
font-size: 24px;
        line-height: 36px;
        padding: 0;
        text-align: center;
    }
        
    #hp-blog .hp-front-page.hp-dark {
    padding-top: 0px
    }
    
    .hp-front-page {
    padding-bottom: 0px}
    
    .blog-articles-container {
    padding: 0 5%;
    }
    
    
}


.blog-post-container {width: 86%; max-width: 900px; margin: auto}

h2.blog-post-title {font-size: 34px; font-weight: 500; line-height: 42px; font-family: Roboto, Arial}
h3.blog-post-title {font-size: 34px; font-weight: 400; line-height: 42px; margin-bottom: 15px; margin-top: 60px; font-family: Roboto, Arial}
h5.blog-post-date {
	font-size: 16px; 
	font-weight: 500; 
	line-height: 20px;     
	display: inline-block;
	margin-bottom: 60px;
	font-family: Roboto, Arial;}

.blog-min-box {
	background-color: #ff8d61;
    padding: 5px 10px;
	margin-right: 5px
}

p.blog-post-text, ol.blog-post-text, ul.blog-post-text {font-size: 18px; font-weight: 400; line-height: 30px; text-align: justify; margin-bottom: 25px; font-family: Roboto, Arial}
p.blog-post-highlight {width: 65%; max-width: 680px; font-size: 21px; font-weight: 400; line-height: 32px; font-style:italic; margin: 35px auto; text-align: center; font-family: Roboto, Arial}
p.blog-post-section-title {width: 65%; max-width: 680px; font-size: 21px; font-weight: 500; line-height: 32px; margin: 35px auto; text-align: center; text-decoration: underline; font-family: Roboto, Arial}


ol.blog-post-text {margin-left: 40px; margin-right: 40px}
ul.blog-post-text {margin-left: 40px; margin-right: 40px}

ol.blog-post-text li {margin-bottom: 10px}
ul.blog-post-text li {list-style-type: square; margin-bottom: 10px}

p.blog-post-text strong,
p.blog-post-highlight strong {color:#212529}

.blog-post-text a {color:#085eff}

.blog-quote {font-style: italic}


.blog-post-image {width: 100%; margin-bottom: 30px}


.blog-post-link {
	color: #4d6475;
    text-decoration: underline;
    cursor: pointer;
	font-size: 18px; 
	font-weight: 500; 
	line-height: 30px;
}

.blog-post-link:hover {
    color: #1058aa;
    text-decoration: none;
}

.blog-author-container {
    border-top: 1px solid #B4C2CD;
    margin: 50px 0 100px 0;
    position: relative;
    padding: 50px 0;
    display: flex
;
    flex-direction: row;
	
}

.blog-author-container img {
	width: 100px; 
	height: 100%;
	border-radius: 100%;
 	}

.blog-author-text-container {
	position: absolute;
	left: 115px;
	top: 50%;
	transform: translateY(-50%)
}

.blog-author-name {
	font-size: 16px; 
	font-weight: 400; 
	line-height: 24px;
}

.linkedin-link {
    background-color: #0377b5;
    width: 24px;
    position: relative;
    height: 24px;
    display: block;
	margin-top: 4px;
	cursor: pointer
}

.linkedin-link:hover {
    background-color: #005f92;	
} 

.linkedin-link:active {
	background-color: #005f92;
	box-shadow: 0 0 0 1.5pt #C0D3F0
}

.linkedin-link svg {position: absolute}



@media ( max-width: 774px) {
	#hp-FixHeader-Wrapper {height: 60px; padding-top: 15px}
	.blog-post-header {margin: 80px 0 45px 0}
	
	
h2.blog-post-title {font-size: 24px; font-weight: 500; line-height: 30px; text-align: center}
h3.blog-post-title {font-size: 24px; font-weight: 400; line-height: 30px; margin-bottom: 13px;
	text-align: center}
h5.blog-post-date {
	font-size: 14px; 
	line-height: 20px;     
	display: block;
	margin-bottom: 45px;
	text-align: center}

p.blog-post-text, ol.blog-post-text, ul.blog-post-text {font-size: 16px; line-height: 24px; margin-bottom: 25px}
p.blog-post-highlight, p.blog-post-section-title {width: 100%; max-width: 680px; font-size: 18px; line-height: 28px; margin: 30px auto}
.blog-author-container {margin: 50px 0}


ol.blog-post-text {margin-left: 30px; margin-right: 30px}
ul.blog-post-text {margin-left: 30px; margin-right: 30px}


.blog-post-link {font-size: 16px; line-height: 24px}

}