/*** INNER ***/
DIV.inner-left{width: 300px; float: left}
DIV.inner-left H1, DIV.inner-left H2, DIV.inner-left H3, DIV.inner-left P.header{text-align: right; padding-top: 10px}
DIV.inner-left H1{padding-top: 0px}
DIV.inner-right{margin-left: 350px; padding: 10px 50px 0px 0px}
DIV.inner-right-top{padding-top: 0px}


/*** INFOBOXES ***/
DIV.infobox{margin: 10px 0px 25px 0px; padding: 20px 20px 5px 20px; border: solid 1px var(--border-color); border-top-right-radius: 15px; border-bottom-left-radius: 15px}
DIV.infobox-no-margin{margin-bottom: 0px}
DIV.infobox-yellow{background: #fffff0}
DIV.infobox-grey{background: #f8f8f8}
DIV.infobox-more-margin{margin-bottom: 35px}
DIV.infobox-extra-margin{margin-bottom: 45px}
DIV.infobox P.main:last-child{padding-bottom: 15px}


/*** IMAGES ***/
DIV.iso-img{margin: 15px 0px 40px 0px; border: solid 1px var(--border-color)}
DIV.iso-img-less-bottom-margin{margin-bottom: 25px}
DIV.iso-img-no-border{border: none}
DIV.iso-img PICTURE, DIV.iso-img IMG{width: 100%; height: auto}

P.iso-img, P.iso-img A{color: #006098; font-size: 14px; line-height: 20px; font-style: italic}
P.iso-img A{text-decoration: none}
P.iso-img A:hover{text-decoration: underline}
P.iso-img{margin-top: -15px; padding: 0px 0px 40px 0px}


/*** VIDEO ***/
DIV.video{width: 100%; height: 0px; margin: 20px 0px 40px 0px; padding-bottom: 48%; border: solid 1px var(--border-color); position: relative; overflow: hidden}
DIV.video IFRAME{width: 100%; height: 100%; border: none; position: absolute; top: 0px; left: 0px; z-index: 100; background: transparent}
DIV.video IMG.video{width: 100%; height: auto; aspect-ratio: attr(width) / attr(height); margin: auto; display: block; position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px}
DIV.video IMG.play{width: 72px; height: 54px; margin-left: -36px; margin-top: -27px; cursor: pointer; position: absolute; left: 50%; top: 50%}


/*** QUOTES ***/
DIV.articles-quote{margin: 20px 0px 40px 0px; padding: 40px 0px 45px 100px; border: solid 5px #e8e8e8; border-left: none; border-right: none; background: url(../images/backgrounds/quote-blue.png) no-repeat 0px 45px}
DIV.articles-quote-less-bottom-margin{margin-bottom: 25px}
DIV.articles-quote P.quote{color: #0070a8; font-size: 32px; line-height: 42px; padding: 0px}
DIV.articles-quote P.credit, DIV.articles-quote P.credit SPAN{color: #202020; font-size: 16px; line-height: 22px; font-weight: bold}
DIV.articles-quote P.credit SPAN{font-style: italic}
DIV.articles-quote P.credit{padding: 35px 0px 0px 0px}


/*** INFOGRAPHICS ***/	
DIV.infographic{margin: 20px auto 40px}

DIV.infographic IMG{width: 100%; height: auto; aspect-ratio: attr(width) / attr(height)}
DIV.infographic IMG.revisions-iso-9001{margin-top: 10px}
DIV.infographic IMG.remote-certification{max-width: 900px}
DIV.infographic IMG.ultimate-guide{margin-top: 10px}
DIV.infographic IMG.europe-survey{border: solid 5px #e8e8e8; border-left: none; border-right: none}
DIV.infographic IMG.pdca-cycle{max-width: 770px; margin: 30px 0px 10px 0px}


/*** TIP TABLES ***/
DIV.tip-table{padding: 0px 0px 25px 0px}
DIV.tip-table DIV.tip-table-left{width: 40px; padding: 2px 0px 0px 25px; display: inline-block; vertical-align: top; background: url(../images/backgrounds/bg-arrow-tip.png) no-repeat 0px 4px}
DIV.tip-table DIV.tip-table-right{width: calc(100% - 40px - 25px); padding-left: 25px; display: inline-block; vertical-align: top}
DIV.tip-table P, DIV.tip-table P A{color: #404040; font-size: 16px; line-height: 22px; padding: 0px}
DIV.tip-table P A{color: #3366bb; text-decoration: none}
DIV.tip-table P A:hover{text-decoration: underline}
DIV.tip-table DIV.tip-table-left P{font-weight: bold}


/*** RECOMMENDATIONS BOX ***/
#recommendations-box-outer{margin-top: 60px; padding: 0px}
#recommendations-box{padding: 50px 0px; position: relative; border-top-right-radius: 20px; background: #265986}
#recommendations-box-left, #recommendations-box-right{height: 270px; display: inline-block; vertical-align: middle}
#recommendations-box-left{width: 50%; height: 280px; background: #fff}
#recommendations-box-left-inner{height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center}
P.recommendations-box-left{color: #000; font-size: 22px; line-height: 30px; font-weight: bold; padding: 0px 40px 40px 0px}
#recommendations-box-left A.link{color: #0070a8; font-size: 16px; line-height: 16px; font-weight: bold; text-transform: uppercase; text-decoration: none; padding-right: 40px; display: inline-block; position: relative; transition: all .3s ease}
#recommendations-box-left A.link:hover{padding-right: 45px}
#recommendations-box-left A.link SPAN.arrow-container{top: -1px}		
#recommendations-box-right{width: calc(50% - 100px); max-width: 374px; height: auto; margin: 0px 50px}


/*** ARTICLES LISTINGS ***/
DIV.article-row{margin-bottom: 36px; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex}
DIV.article-row A.article{text-decoration: none; width: calc(50% - 20px); padding: 0px 0px 75px 0px; border: solid 1px var(--border-color); border-top-right-radius: 15px; border-bottom-left-radius: 15px; position: relative; background: #fff}
DIV.article-row A.article-left{margin-right: 18px}
DIV.article-row A.article-right{margin-left: 18px}

DIV.article-row A.article IMG{width: 100%; height: auto; aspect-ratio: attr(width) / attr(height); margin: 0px 0px 25px 0px; border-top-right-radius: 15px}
DIV.article-row A.article P{padding-left: 20px; padding-right: 20px}
DIV.article-row A.article P.date{color: #000; font-size: 14px; line-height: 14px; font-weight: bold}
DIV.article-row A.article P.header{color: #0070a8; font-size: 20px; line-height: 26px; padding-top: 15px; padding-bottom: 20px}
DIV.article-row A.article P.description{color: #606060; font-size: 16px; line-height: 22px}
DIV.article-row A.article P.link{color: #303030; text-decoration: none; font-size: 14px; line-height: 14px; font-weight: bold; text-transform: uppercase; padding-right: 40px; display: inline-block; transition: all .3s ease; position: absolute; left: 0px; bottom: 25px}
DIV.article-row A.article:hover P.link{padding-right: 45px}
DIV.article-row A.article P.link SPAN.arrow-container{top: -2px}


/*** ARTICLES INNER ***/
#date{color: #000; font-size: 14px; line-height: 14px; margin-top: -5px; padding: 0px 0px 30px 0px}
#body DIV.inner-left #date{display: none}


/*** RELATED ARTICLES ***/
#related-articles{padding: 60px 0px 20px 0px; border-top: solid 1px var(--border-color); background: #f2f2f2}
#related-articles DIV.container{padding: 0px}
#related-articles H2{color: #202020; font-size: 32px; line-height: 38px; padding: 0px 0px 30px 0px}
	
	
/*** ARTICLES INNER: BAR CHART ***/	
DIV.bar-chart-outer{margin: 10px auto 35px; padding: 35px 0px 40px 0px; border: solid 5px #e8e8e8; border-left: none; border-right: none}
DIV.bar-chart-outer P.bar-chart-header{color: #0070a8; font-size: 30px; line-height: 36px; letter-spacing: -1px; text-align: center; padding: 0px 0px 20px 0px}
DIV.bar-chart-outer P.intro{color: #202020; font-size: 18px; line-height: 26px; text-align: center; padding: 0px 0px 35px 0px}
DIV.bar-chart, DIV.bar-chart-sector{max-width: 600px; margin: 0px auto}
DIV.bar-chart-sector{max-width: 800px}

DIV.bar-chart P.country, DIV.bar-chart P.sector{color: #000; font-size: 14px; line-height: 14px; text-align: right; width: 80px; padding: 9px 0px 0px 0px; clear: both; float: left}	
DIV.bar-chart P.sector{width: 130px}	

DIV.bar-chart DIV.bar-outer, DIV.bar-chart DIV.bar-outer-sector{height: 30px; margin: 0px 0px -1px 100px; border: solid 1px var(--border-color); position: relative; background: #fff}	
DIV.bar-chart DIV.bar-outer-sector{margin-left: 150px; margin-bottom: -1px}	

DIV.bar-chart DIV.bar-inner{height: 30px; border-right: solid 1px var(--border-color); background: #d2efff}
DIV.bar-chart:nth-child(even) DIV.bar-inner{background: #f0f8ff}
DIV.bar-chart P.number, DIV.bar-chart P.number-sector{font-size: 12px; line-height: 12px; position: absolute; right: 10px; top: 10px}	


/*** ARTICLES INNER: SOURCES ***/
#sources{padding: 15px 0px 20px 0px}
#sources P.header{color: #0070a8}
#sources P.sources-header{font-size: 14px; line-height: 14px; font-weight: bold; padding: 20px 0px 10px 1px}
#sources P.sources-header-top{padding-top: 5px}
#sources P.sources, #sources P.sources A, #sources P.sources SPAN{font-size: 14px; line-height: 20px}
#sources P.sources A{color: #3366bb; text-decoration: none}
#sources P.sources A:hover{text-decoration: underline}
#sources P.sources SPAN.italic{font-style: italic}
#sources P.sources{padding: 0px 0px 6px 25px; background: url(../images/backgrounds/bg-bullet.png) no-repeat 1px 6px}
	

/*** CONTACT ***/
P.contact{font-size: 18px; line-height: 26px}