@import url('https://fonts.googleapis.com/css?family=Abril+Fatface');
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,cite,code,del,dfn,em,img,ins,q,small,strong,sub,sup,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;margin:0;padding:0}article,aside,figure,figure img,figcaption,hgroup,footer,header,nav,section,video,object{display:block}a img{border:0}figure{position:relative}figure img{width:100%}

body {background: #4b4b4b;overflow-x: hidden;overflow-y: scroll;font: normal 1em Arial, sans-serif;}
img { -ms-interpolation-mode: bicubic;height:auto;}
img, object, embed {max-width: 100%;}
ol {padding:0 0 30px 30px;}
p {margin-bottom:30px;}
#bg-white {background:#ffffff;}
#bg-home {background:#4b4b4b url(../images/bg.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;height:700px;width:100%;}
#bg2-home {background:#4b4b4b url(../images/bg-2.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;height:700px;width:100%;}
.container, .container-wrap {display: flex;flex-direction: row;height:100%;align-items: center;max-width: 2000px;}
.container-home {display: flex;flex-direction: column;height:100%;align-items: center;max-width: 2000px;}
.row-third {width:33.3%;flex: 1 1 auto;}
.row-twothirds {width:66.6%;flex: 1 1 auto;}
.row-full {width:100%;flex: 1 1 auto;}
.text-inside {padding:20px;}
.circle-line {width:10em;margin:1em 5em 1em 5em;border-bottom:1px solid #4b4b4b;}
.green-circle {-webkit-border-radius: 20em; -moz-border-radius: 20em;background:#00ffba;width:20em;height:20em;margin-left:auto;margin-right:auto;color:#4b4b4b;text-align:center;}
.green-circle p {line-height:1.1em;font-size:1em;}
.yellow-circle {-webkit-border-radius: 20em; -moz-border-radius: 20em;background:#edff51;width:20em;height:20em;margin-left:auto;margin-right:auto;color:#4b4b4b;text-align:center;}
.gray-diagonal {width: 100%;height: 200px;background-color: #4b4b4b;background-size: cover;clip-path: polygon(0 0%, 0 100%, 100% 100%);-webkit-clip-path: polygon(0 0%, 0 100%, 100% 100%);max-width: 2000px;}
.yellow-diagonal {width: 100%;height: 100px;background-color: #edff51;background-size: cover;clip-path: polygon(0 100%, 100% 100%, 100% 0, 0 100%);-webkit-clip-path: polygon(0 100%, 100% 100%, 100% 0, 0 100%);max-width: 2000px;}
.yellow-diagonal2 {width: 100%;height: 150px;background-color: #edff51;background-size: cover;clip-path: polygon(0 0, 100% 100%, 100% 0, 0 0);-webkit-clip-path: polygon(0 0, 100% 100%, 100% 0, 0 0);max-width: 2000px;}
#yellow-bg {background:#edff51;color:#4b4b4b;}
a, a:link, a:active, a:visited {color:#000000;}
#yellow-bg a, #yellow-bg a:visited, #yellow-bg a:link, .yellow-circle a, .yellow-circle a:visited, .yellow-circle a:link, #green-diagonal a, #green-diagonal a:visited, #green-diagonal a:link {color:#4b4b4b;text-decoration:none;}
#yellow-bg a:hover, #yellow-bg a:active, .yellow-circle a:hover, .yellow-circle a:active, #green-diagonal a:hover, #green-diagonal a:active {color:#000000;text-decoration:underline;}
.article-links-below a, .article-links-below a:visited, .article-links-below a:link {color:#4b4b4b;font:bold 1.3em Arial, sans-serif;text-decoration:none;}
.article-links-below a:hover, .article-links-below a:active {color:#000000;font:bold 1.3em Arial, sans-serif;text-decoration:underline;}
#gray-bg {background:#4b4b4b;color:#00ffba;}
#gray-bg a, #gray-bg a:visited, #gray-bg a:link {color:#00ffba;text-decoration:none;}
#gray-bg a:hover, #gray-bg a:active {color:#ffffff;text-decoration:none;}
h1, h2, h3, h4, h5, .large, #green-diagonal, .article-title {font-family:'Abril Fatface', cursive;font-weight:normal;}
#space-below {padding-bottom:40px;}

/* Large screens */

@media only screen and (min-width: 1024px) {

	.container-wrap-article {display: flex;flex-direction: row;height:100%;align-items:top;max-width: 2000px;}
	.article-body-outside, .article-links-outside, .article-links-below {width:20%;flex: 1 1 auto;}
	.article-body {width:60%;flex: 1 1 auto;}
	#green-diagonal {width: 100%;height: 150px;background-color: #00ffba;background-size: cover;clip-path: polygon(0 0, 0% 100%, 55% 0);-webkit-clip-path: polygon(0 0, 0% 100%, 55% 0);position:sticky;top:0;position: -webkit-sticky;max-width: 2000px;}
	h1, h2 {font-size:6em;line-height:1em;}
	.container-wrap-article h3 {margin-bottom:20px;}
	h3 {font-size:3em;line-height:1em;font-weight: normal;}
	li, p {line-height:1.6em;font-size:1.2em;}
	.large {font-size:3em;margin-bottom:5px;}
	#green-diagonal, .article-title {font-size:5em;line-height:1em;}
	.article-subtitle {font: bold 1.5em Arial, sans-serif;line-height:1em;padding-bottom:40px;}
}

/* Smaller screens */

@media only screen and (max-width: 1023px) {

	.container-wrap-article {display: flex;flex-direction: column;}
	.article-body, .article-body-outside, .article-links-below {width:100%;flex: 1 1 auto;}
	#green-diagonal {width: 100%;height: 150px;background-color: #00ffba;background-size: cover;clip-path: polygon(0 0, 0% 100%, 65% 0);-webkit-clip-path: polygon(0 0, 0% 100%, 65% 0);position:sticky;top:0;position: -webkit-sticky;}
	h1, h2 {font-size:6em;line-height:1em;}
	.container-wrap-article h3 {margin-bottom:15px;}
	h3 {font-size:2.5em;line-height:1em;}
	li, p {line-height:1.5em;font-size:1.1em;}
	.large {font-size:2em;margin-bottom:5px;}
	#green-diagonal, .article-title {font-size:3.5em;line-height:.9em;}
	.article-subtitle {font: bold 1.5em Arial, sans-serif;line-height:1em;padding-bottom:30px;}
}

/* Mobile */

@media handheld, only screen and (max-width: 767px) {

	.container-wrap-article, .container-wrap {display: flex;flex-direction: column;}
	.article-body, .article-links-outside, .article-body-outside, .row-third, .row-twothirds, .article-links-below {width:100%;flex: 1 1 auto;}
	#green-diagonal {width: 100%;height: 150px;background-color: #00ffba;background-size: cover;clip-path: polygon(0 0, 0% 100%, 80% 0);-webkit-clip-path: polygon(0 0, 0% 100%, 80% 0);position:sticky;top:0;position: -webkit-sticky;}
	h1, h2 {font-size:6em;line-height:1em;}
	.container-wrap-article h3 {margin-bottom:10px;}
	h3 {font-size:2em;line-height:1em;}
	li, p {line-height:1.5em;font-size:1em;}
	.article-links-below p {margin-bottom:10px;}
	.large {font-size:2em;line-height:1.2em;margin-bottom:5px;}
	#green-diagonal, .article-title {font-size:2.8em;line-height:1em;}
	.article-subtitle {font: bold 1.2em Arial, sans-serif;line-height:1.2em;padding-bottom:20px;}
	#green-diagonal {height: 100px;}
	#bg-home {background:#4b4b4b url(../images/bg-mobile.jpg) no-repeat top center fixed; height:650px;}
	#bg2-home {background:#4b4b4b url(../images/bg-2-mobile.jpg) no-repeat bottom center fixed;height:650px;}
	#space-below {padding-bottom:50px;}
	#bg-white .gray-diagonal {width: 100%;height: 175px;background-color: #4b4b4b;background-size: cover;clip-path: polygon(0 0, 100% 48%, 100% 100%, 0% 100%);-webkit-clip-path: polygon(0 0, 100% 48%, 100% 100%, 0% 100%);}
}