/* CSS Document */

.bg-one-map {background:#A4A2B6;}

/*HOME*/
.bg-symbols {background: url(../images/symbols.png); background-repeat: no-repeat; background-size: cover; background-position: top center ;overflow: scroll-y; background-repeat-y:repeat; width: 100%; position: relative; top: 0; left: 0;}
article {max-width: 1920px; width: 100%; margin: 0 auto; position: relative; box-sizing: border-box; z-index: 8; padding:0px;}

.topnav-table {display:table; width:100%; margin:25px 0px;}
.topnav-table div {display:table-cell;}
.topnav-table div:nth-child(1) {width:80%;}
.topnav-table div:nth-child(2) {width:20%;}

.lft {float:left;}
.rgt {float:right;}
.margin-30R {margin-right:30px;}
.margin-30B {margin-bottom:30px;}
.row {margin-bottom:30px;}
.overflow {overflow:hidden;}

ul.image-list {list-style:none; margin:0; padding:0;}
ul.image-list li {float:left; margin-bottom:30px;}
ul.image-list li:nth-child(1) {width:64%;}
ul.image-list li:nth-child(2) {width:36%;}

ul.image-listbox {list-style:none; margin:0; padding:0;}
ul.image-listbox li {float:left;}
ul.image-listbox li:nth-child(1) {width:64%;}
ul.image-listbox li:nth-child(2) {width:36%; border:5px solid #3894AE; box-sizing:border-box; padding:40px 100px 20px 0px; text-align:right; line-height:0px; min-height:447px;}
ul.image-listbox li:nth-child(2) h2 {font-size:90px; color:#8BC53E; margin:0; padding:0; line-height:1;}
ul.image-listbox li:nth-child(2) h3 {font-size:66px; color:#585859; line-height:1.1; margin:0; padding:0;}

.container {position: relative;width:100%;}
.image {display: block;width: 100%;height: auto;transition: .5s ease;backface-visibility: hidden; background-color: rgba(248, 247, 216, 0.7);}
.middle {transition: .5s ease;opacity: 0;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); text-align: center; width:100%;}
.container:hover .image {opacity: 0.3;}
.container:hover .middle {opacity: 1;}
.text {color: white;font-size:66px;padding: 16px 32px; font-weight:bold;}
.text span {color:#10084C;}
.text a {color:#fff;}

/*BORDER LOADING ON PAGE*/
.line-loading {display:block;position: relative;}
.line-loading:after {content: '';height: 20px;/*background: blue;*/ width: 0%;display: block; animation: expand 0.80s ease 1s forwards; background-image: linear-gradient(to right, #19174B , #7AAB40);}
@keyframes expand {100% {width: 100%;}
}



.close{ position: absolute; right: 15px; top: 15px; cursor: pointer; font-weight: 600}

/*ONE*/
.skew-background1 {width:50%; background:#F1F6E7; padding:25px 25px 100px 145px; position: absolute; top: 15%; left: 50%; transform: translate(-50%, 10%); margin: 0 auto; box-sizing: border-box; display:none;}
.skew-background1:before {content: '';display: block;width: 99%; height: 72px; background: #F1F6E7; transform: skew(0deg, -2deg); position: absolute; top: 0px; left:10px;transform-origin: left; z-index: -1;}
.skew-background1:after {content: '';display: block; width: 99%; height: 72px; background: #F1F6E7; transform: skew(0deg, -2deg); position: absolute; bottom: -33px; left: 0px;transform-origin: left;z-index: -1;}
.skew-background1 h3 {font-size:40px; font-weight:bold; color:#1B528B; margin-bottom:0px;}
.skew-border1 {position:absolute; top:127px; left:10px;}
.repeat-border {background-image:url(../images/line-border.png); background-repeat:repeat-x; width:100%;}
.skew-map1 {position:absolute; top:-15px; left:-160px;}

.skew-button {width:200px; background:#8BC53E; padding:15px; position:relative;  margin:0 auto; box-sizing:border-box; color:#fff;}
.skew-button:before {content: '';display: block;width: 100%; height:12px; background:#8BC53E; transform: skew(0deg, 3deg); position: absolute; top: -12px; left:0px;transform-origin: left; z-index: 2;}
.skew-button:after {content: '';display: block; width: 100%; height:12px; background:#8BC53E; transform: skew(0deg, 3deg); position: absolute; bottom:0px; left: 0px;transform-origin: left;z-index: 2;}

.skew-table1 {display:table; width:100%; margin-top:35px;}
.skew-table1 div {display:table-cell;}
.skew-table1 div:nth-child(1) {width:65%; padding:0px 20px 0px 0px; box-sizing:border-box; vertical-align:top;}
.skew-table1 div:nth-child(2) {width:35%; text-align:right; vertical-align:top;}
.skew-table1 h3 {font-size:30px; color:#585859; font-weight:500; margin:0px; line-height:1.5;}
.skew-table1 h4 {font-size:30px; color:#1B528B; font-weight:bold; margin:0px; line-height:1.5;}

ul.country-list-blue {list-style:none; margin:0; padding:0; clear:both; padding-bottom:35px;}
ul.country-list-blue li {float:left; font-weight:bold; font-size:16px; width:25%; color:#1B528B;}


/*TWO*/
.skew-background2 {width:50%; background:#F1F6E7; padding:25px 25px 100px 145px; position: absolute; top: 15%; left: 50%; transform: translate(-50%, 10%); margin: 0 auto; box-sizing: border-box; display:none;}
.skew-background2:before {content: '';display: block;width: 99%; height: 72px; background: #F1F6E7; transform: skew(0deg, -2deg); position: absolute; top: 0px; left:10px;transform-origin: left; z-index: -1;}
.skew-background2:after {content: '';display: block; width: 99%; height: 72px; background: #F1F6E7; transform: skew(0deg, -2deg); position: absolute; bottom: -33px; left: 0px;transform-origin: left;z-index: -1;}
.skew-background2 h3 {font-size:40px; font-weight:bold; color:#F37053; margin-bottom:0px;}
.skew-border2 {position:absolute; top:127px; left:10px;}
.skew-map2 {position:absolute; top:-65px; left:-90px;}

.skew-table2 {display:table; width:100%; margin-top:35px;}
.skew-table2 div {display:table-cell;}
.skew-table2 div:nth-child(1) {width:75%; padding:0px 20px 0px 0px; box-sizing:border-box; vertical-align:top;}
.skew-table2 div:nth-child(2) {width:25%; text-align:right; vertical-align:top;}
.skew-table2 h3 {font-size:30px; color:#585859; font-weight:500; margin:0px; line-height:1.5;}
.skew-table2 h4 {font-size:30px; color:#F37053; font-weight:bold; margin:0px; line-height:1.5;}

ul.country-list-red {list-style:none; margin:0; padding:0; clear:both; padding-bottom:35px;}
ul.country-list-red li {float:left; font-weight:bold; font-size:16px; width:25%; color:#F37053;}


/*THREE*/
.skew-background3 {width:50%; background:#F1F6E7; padding:25px 25px 100px 145px; position: absolute; top: 15%; left: 50%; transform: translate(-50%, 10%); margin: 0 auto;  box-sizing: border-box; display:none;}
.skew-background3:before {content: '';display: block;width: 99%; height: 72px; background: #F1F6E7; transform: skew(0deg, -2deg); position: absolute; top: 0px; left:10px;transform-origin: left; z-index: -1;}
.skew-background3:after {content: '';display: block; width: 99%; height: 72px; background: #F1F6E7; transform: skew(0deg, -2deg); position: absolute; bottom: -33px; left: 0px;transform-origin: left;z-index: -1;}
.skew-background3 h3 {font-size:40px; font-weight:bold; color:#3B94AE; margin-bottom:0px;}
.skew-border3 {position:absolute; top:127px; left:10px;}
.skew-map3 {position:absolute; top:-67px; left:-160px;}

.skew-table3 {display:table; width:100%; margin-top:35px;}
.skew-table3 div {display:table-cell;}
.skew-table3 div:nth-child(1) {width:65%; padding:0px 20px 0px 0px; box-sizing:border-box; vertical-align:top;}
.skew-table3 div:nth-child(2) {width:35%; text-align:right; vertical-align:top;}
.skew-table3 h3 {font-size:30px; color:#585859; font-weight:500; margin:0px; line-height:1.5;}
.skew-table3 h4 {font-size:30px; color:#3B94AE; font-weight:bold; margin:0px; line-height:1.5;}

ul.country-list-teal {list-style:none; margin:0; padding:0; clear:both; padding-bottom:35px;}
ul.country-list-teal li {float:left; font-weight:bold; font-size:16px; width:25%; color:#3B94AE;}


/*FOUR*/
.skew-background4 {width: 50%; background: #F1F6E7; padding: 25px 25px 100px 145px; position: absolute; top: 15%; left: 50%; transform: translate(-50%, 10%); margin: 0 auto;  box-sizing: border-box; display:none;}
.skew-background4:before {content: '';display: block;width: 99%; height: 72px; background: #F1F6E7; transform: skew(0deg, -2deg); position: absolute; top: 0px; left:10px;transform-origin: left; z-index: -1;}
.skew-background4:after {content: '';display: block; width: 99%; height: 72px; background: #F1F6E7; transform: skew(0deg, -2deg); position: absolute; bottom: -33px; left: 0px;transform-origin: left;z-index: -1;}
.skew-background4 h3 {font-size:40px; font-weight:bold; color:#8DC63F; margin-bottom:0px;}
.skew-border4 {position:absolute; top:127px; left:10px;}
.skew-map4 {position:absolute; top:-66px; left:-75px;}

.skew-table4 {display:table; width:100%; margin-top:35px;}
.skew-table4 div {display:table-cell;}
.skew-table4 div:nth-child(1) {width:65%; padding:0px 20px 0px 0px; box-sizing:border-box; vertical-align:top;}
.skew-table4 div:nth-child(2) {width:35%; text-align:right; vertical-align:top;}
.skew-table4 h3 {font-size:30px; color:#585859; font-weight:500; margin:0px; line-height:1.5;}
.skew-table4 h4 {font-size:30px; color:#8DC63F; font-weight:bold; margin:0px; line-height:1.5;}

ul.country-list-green {list-style:none; margin:0; padding:0; clear:both; padding-bottom:35px;}
ul.country-list-green li {float:left; font-weight:bold; font-size:16px; width:25%; color:#8DC63F;}


/*GLOBAL FOOTPRINT*/
.footprint-bkr {width: 100%;position: relative;top: 0;left: 0;background: url(../images/footprint.png);background-repeat: no-repeat;background-size: cover;background-position: center top;overflow-x: hidden;overflow-y: scroll;background-repeat-y:repeat;}

.footprint-table {display:table; width:100%;}
.footprint-table div {display:table-cell; width:80%; vertical-align:top;}
.footprint-table div:nth-child(2) {display:table-cell; width:20%; vertical-align:top;}

.footprint-img {position:relative;}
.blue-circle-one {border-radius:50%; border:5px solid #1B528B; width:100px; height:100px; position:absolute; bottom:46px; right:363px;}
.blue-circle-two {border-radius:50%; border:5px solid #1B528B; width:206px; height:206px; position:absolute; bottom:50px; right:469px;}
a:hover.blue-circle-one  {border:8px solid #1B528B; cursor:pointer;}
a:hover.blue-circle-two  {border:8px solid #1B528B; cursor:pointer;}


.red-circle-one {border-radius:50%; border:5px solid #E86D51; width:117px; height:117px; position:absolute; bottom: 10px; left: 354px;}
.red-circle-two {border-radius:50%; border:5px solid #E86D51; width: 140px; height: 140px; position: absolute; bottom: 150px; left: 444px;}
.red-circle-three {border-radius:50%; border:5px solid #E86D51; width:162px; height:162px; position:absolute; bottom:66px; left:682px;}
.red-circle-four {border-radius:50%; border:5px solid #E86D51; width: 80px; height: 80px; position: absolute; top: 447px; left: 831px;}
.red-circle-five {border-radius:50%; border:5px solid #E86D51; width: 66px; height: 66px;  position: absolute; top: 341px; left: 765px;}
.red-circle-six {border-radius:50%; border:5px solid #E86D51; width:115px; height:115px; position:absolute; top: 248px; right: 540px;}
.red-circle-seven {border-radius:50%; border:5px solid #E86D51; width:99px; height:99px; position:absolute; top: 308px; right: 476px;}

a:hover.red-circle-one {border:8px solid #E86D51; cursor:pointer;}
a:hover.red-circle-two {border:8px solid #E86D51; cursor:pointer;}
a:hover.red-circle-three {border:8px solid #E86D51; cursor:pointer;}
a:hover.red-circle-four {border:8px solid #E86D51; cursor:pointer;}
a:hover.red-circle-five {border:8px solid #E86D51; cursor:pointer;}
a:hover.red-circle-six {border:8px solid #E86D51; cursor:pointer;}
a:hover.red-circle-seven {border:8px solid #E86D51; cursor:pointer;}

.green-circle-one {border-radius:50%; border:5px solid #8BC53E; width: 70px; height: 70px; position: absolute; top: 257px; left: 615px;}
a:hover.green-circle-one {border:8px solid #8BC53E; cursor:pointer;}

.turquise-circle-one {border-radius:50%; border:5px solid #3894AE; width: 70px; height: 70px; position: absolute; top: 335px; left: 637px;}
a:hover.turquise-circle-one {border:8px solid #3894AE; cursor:pointer;}
.turquise-circle-two {border-radius:50%; border:5px solid #3894AE; width: 90px; height: 90px; position: absolute; top: 223px; left: 680px;}
a:hover.turquise-circle-two {border:8px solid #3894AE; cursor:pointer;}


/*CHAIRMAN'S STATEMENT*/

.chairmans-bkr {width: 100%;position: relative;top: 0;left: 0;background: url(../images/chairman-bkrground.png);background-repeat: no-repeat;background-size: cover;background-position: center top;background-repeat-y:repeat;overflow-x: hidden;overflow-y: scroll;}

.leftnav-chairman {width: 361px!important; height: 570px; background: #8BC53E; margin: 20px; transform: perspective(300px) rotateX(-2deg) rotateY(-30deg) rotateZ(7deg); position: relative; top: -60px; right: -26px;}
.leftnav-inner {position: absolute; top: 100px; right: 0; width: 250px; height: 370px; display: block; z-index: 1;}
.section-heading {font-size:30px; color:#fff; font-weight:bold; line-height:1; margin:0; padding:0; text-align:right; padding-right:40px; margin-bottom:20px;}
.leftnav-inner ul {list-style: none; margin: 0; padding: 0;}
.leftnav-inner ul li {border-bottom: 1px solid #fff; width:100%; position:relative;}
.leftnav-inner ul li:nth-child(4) {border-bottom:0px solid #fff;}
.leftnav-inner ul li:first-of-type {border-top: 1px solid #fff;}
.leftnav-inner ul li:last-of-type {background: #fff; display: inline-block; width: 313px; position: relative; right: 60px;}
.leftnav-inner ul li:last-of-type p:after {content:url('../images/downloads-arrow.png'); position:absolute; top:13px; right:40px;}
.leftnav-inner ul li p {margin: 0px; padding: 0px; font-size: 16px; margin-right:70px; text-align: right; line-height: 1.4; padding-top: 15px; padding-bottom: 15px; color: #10084C;}
.leftnav-inner ul li p:after {content: url(../images/leftnav-arrow.png); position: absolute; top: 24px; right:40px;}
.leftnav-inner ul li p a {color:#10084C;}

#inside-chairmans {max-width: 1790px; width: 100%; margin: 0 auto; position: relative; box-sizing: border-box; z-index: 9; float:right;}
#inside-chairmans > h3 {font-size:60px; color:#8BC53E;}
#inside-chairmans > h3 span {color:#10084C;}
.chairman-table {display:table; width:100%;}
.chairman-table div {display:table-cell; width:50%; vertical-align:top;}

ul.chairman-list-one {list-style:none; margin:0; padding:0;}
ul.chairman-list-one li {width:30%; float:left;}
ul.chairman-list-one li:nth-child(1) img {position:relative; left:-80px;}
ul.chairman-list-one li:nth-child(2) {width:70%; padding-right:100px; box-sizing:border-box;}

ul.chairman-list-two {list-style:none; margin:0; padding:0;}
ul.chairman-list-two li {float:left; }
ul.chairman-list-two li:nth-child(1) {width:60%;max-height: 600px;overflow-y: scroll;overflow-x: visible;padding-left: 50px;box-sizing: border-box;}
ul.chairman-list-two li:nth-child(2) {width:40%;}

#icon-one, #icon-two, #icon-three, #icon-four, #icon-five, #icon-six  {position:relative;}
#icon-one:before {content:url('../images/icons/1.png'); position:absolute; top:7px; left:-50px;}
#icon-two:before {content:url('../images/icons/2.png'); position:absolute; top:7px; left:-50px;}
#icon-three:before {content:url('../images/icons/3.png'); position:absolute; top:7px; left:-50px;}
#icon-four:before {content:url('../images/icons/4.png'); position:absolute; top:7px; left:-50px;}
#icon-five:before {content:url('../images/icons/5.png'); position:absolute; top:7px; left:-50px;}
#icon-six:before {content:url('../images/icons/6.png');position:absolute;top:7px;left:-50px;}

.chairman-intro {font-size:25px; color:#3995AF; font-weight:bold; font-style:italic; padding-top:100px; line-height:1.4;}
.chairman-name {font-size:25px; color:#10044B; font-weight:bold;}


/*ESG - HOW WE DO BUSINESS*/
#esg-container {max-width: 1790px; width: 100%; margin: 0 auto; position: relative; box-sizing: border-box; z-index: 9; float:right;}
.leftnav-ESG {width: 361px!important; height: 570px; background: #8BC53E; margin: 20px; transform: perspective(300px) rotateX(-2deg) rotateY(-30deg) rotateZ(7deg); position: relative; top:100px; right: -26px;}
.leftnav-inner-ESG {position: absolute; top: 100px; right: 0; width: 250px; height: 370px; display: block; z-index: 1;}
.section-heading {font-size:30px; color:#fff; font-weight:bold; line-height:1; margin:0; padding:0; text-align:right; padding-right:40px; margin-bottom:20px;}
.leftnav-inner-ESG ul {list-style: none; margin: 0; padding: 0;}
.leftnav-inner-ESG ul li {border-bottom: 1px solid #fff; width:100%; position:relative;}
.leftnav-inner-ESG ul li:nth-child(4) {border-bottom:0px solid #fff;}
.leftnav-inner-ESG ul li:first-of-type {border-top: 1px solid #fff;}
.leftnav-inner-ESG ul li:last-of-type {background: #fff; display: inline-block; width: 313px; position: relative; right: 60px;}
.leftnav-inner-ESG ul li:last-of-type p:after {content:url('../images/downloads-arrow.png'); position:absolute; top:24px; right:40px;}
.leftnav-inner-ESG ul li p {margin: 0px; padding: 0px; font-size: 16px; margin-right:70px; text-align: right; line-height: 1.4; padding-top: 25px; padding-bottom: 25px; color: #10084C;}
.leftnav-inner-ESG ul li p:after {content: url(../images/leftnav-arrow.png); position: absolute; top: 24px; right:40px;}
.leftnav-inner-ESG ul li p a {color:#10084C;}


/*SCOPE*/
.scope-bkr {background:#10084C;}

#article-header {max-width: 1820px; width: 100%; margin: 0 auto; position: relative; box-sizing: border-box; z-index: 9;}
article {max-width: 1820px; width: 100%; margin: 0 auto; position: relative; box-sizing: border-box; z-index: 9;}

.heading-row {padding:0px 50px; color:#fff; margin-top:50px; margin-bottom:50px;}
.heading-row h3 {font-size:40px; color:#8DC63F; font-weight:300; margin-bottom:30px;}
.heading-row h3 span {font-weight:bold;}
.white-border {background: url(../images/white-border.png); background-repeat: no-repeat; background-size: cover; background-position: center top; width: 100%; height:20px; position: fixed; top: 0; left: 0; margin-top:120px;}

.scope-table {display:table; width:100%; margin-top:80px;}
.scope-table div {display:table-cell; width:25%; vertical-align:top;}
.scope-table div:nth-child(1) {padding-right:40px; box-sizing:border-box;}
.scope-table div:nth-child(2) {padding-right:40px; box-sizing:border-box;}
.scope-table div:last-of-type {width:50%; text-align:center;}

.fuel-heading {color:#8DC63F; font-size:30px; font-weight:bold; margin:0px;}
.emissions-heading {font-size:20px; font-weight:bold; margin-bottom:0px; color:#fff;}
.excl-heading {font-size:16px; color:#fff; margin-top:0px;}
.numbers {font-size:35px; color:#8DC63F; font-weight:bold; margin-top:0px; margin-bottom:0px;}
.switch-white {color:#fff;}
.nomargin-T {margin-top:0px;}
.margin-20T {margin-top:20px;}


/*ESG SECTION*/
.esg-col2 {display:table; width:100%;}
.esg-col2 div {display:table-cell; width:80%; vertical-align:top;}
.esg-col2 div:nth-child(2) {display:table-cell; width:20%; vertical-align:top;}

ul.top-strip {list-style:none; margin:0;padding:0; clear:both;}
ul.top-strip li {float:left; width:33%; vertical-align:top;}
ul.top-strip li h3 {font-size:50px; color:#8BC53E; margin-top:0px; padding-top:40px;}
ul.top-strip li h3 span {color:#10084C;}
ul.top-strip li h4 { font-size: 19px; color: #3995AF; font-style: italic; padding-top: 40px; line-height: 1.3; margin-top: 20px;}
ul.top-strip li div {background-image:url('../images/esg-clip.png'); background-repeat:no-repeat; width:400px; height:233px; position:relative;}

ul.total-list {list-style:none; margin:0; padding:0; position:absolute; top:35px; left: 40px;}
ul.total-list li {float:none; width:100%; color:#10044B; font-weight:bold; line-height:1.2;}
ul.total-list li:nth-child(1), ul.total-list li:nth-child(3) {font-size:40px;}
ul.total-list li:nth-child(2) {font-size:22px;}
ul.total-list li:nth-child(3) span {font-size:30px!important;}
ul.total-list li:nth-child(4) {font-size:19px; font-weight:normal;}

ul.business-list {list-style:none; margin:0; padding:0; clear:both; margin-top:30px;}
ul.business-list li {float:left; width:25%;}





/*DOWNLOADS*/
.downloads-bkr {width: 100%; position: relative; top: 0; left: 0; background: url(../images/downloads-bkr.png); background-repeat: no-repeat; background-size: cover; background-position: center top; overflow: scroll-y;}
#inside-downloads {max-width: 1590px; width: 100%; margin: 0 auto; position: relative; box-sizing: border-box; z-index: 9; margin-top:200px;}

.downloads-table {display:table; width:100%;}
.downloads-table div {display:table-cell; width:50%; vertical-align:top;}
.downloads-table div h3 {font-size:30px; color:#fff; font-weight:bold; margin:0; padding:0; margin-top:30px;}
.downloads-table div:nth-child(2) h3 {font-size:30px; color:#8BC53E; font-weight:bold; margin:0; padding:0; margin-bottom:30px;}
.downloads-table div:nth-child(1) ul {list-style:none; margin:0; padding:0; margin-top:145px; width:45%;}
.downloads-table div:nth-child(1) ul li {font-size: 17px;color: #10084C;text-transform: uppercase;font-weight: bold; position: relative; line-height: 1.5; padding-top: 10px; padding-bottom: 10px; border-bottom: 1px solid #fff;}
.downloads-table div:nth-child(1) ul li:first-of-type {border-top: 1px solid #fff;}
.downloads-table div:nth-child(1) ul li:after {content:url('../images/leftnav-arrow.png'); position:absolute; top:15px; right:0px;}

.col-2 {width:50%; float:left;}
ul.breakdown-list {list-style:none; margin:0; padding:0;}
ul.breakdown-list p {font-size:17px; font-weight:bold; line-height:1.8; margin-bottom:0; padding-bottom:0; position:relative; margin-left:30px;}
ul.breakdown-list p:before {content:''; position:absolute; top:5px; left:0px; width:15px; height:15px; border:1px solid #8BC53E; border-radius:50%; margin-left:-30px;}
ul.breakdown-list li {font-size:17px; position:relative; line-height:1.8; margin-left:30px;}
ul.breakdown-list li:before {content:''; position:absolute; top:5px; left:0px; width:15px; height:15px; border:1px solid #8BC53E; border-radius:50%; margin-left:-30px;}

.horizontal-box {width: 330px!important; height: 67px; background:#8BC53E; margin: 20px; transform: perspective(300px) rotateX(-2deg) rotateY(0deg) rotateZ(3deg); position:relative; top:50px;}
.horizontal-box:after {content:url('../images/white-download.png'); position:absolute; top:21px; right:42px; transform:rotate(-3deg);}
.horizontal-box:hover {background:#10084C; cursor:pointer;}


.readmore-box {width: 240px!important; height: 67px; background:#8BC53E; margin: 20px; transform: perspective(300px) rotateX(-2deg) rotateY(0deg) rotateZ(3deg); position:relative; top:50px;}
.readmore-box:before {content:'READ MORE'; position:absolute; top:21px; left:61px; font-size:17px; color:#fff; transform:rotate(-3deg); font-weight:bold}
.readmore-box:after {content:url('../images/white-download.png'); position:absolute; top:21px; right:42px; transform:rotate(-3deg);}
.readmore-box:hover {background:#10084C; cursor:pointer;}


.green-border {background-image: url('../images/green-border.png'); background-repeat: no-repeat;background-size: 100% 100%; background-position: top center; padding: 20px; width: calc(100% - 40px); height:calc(100vh - 40px); box-sizing: border-box; margin: 20px;}
.green-border div.bordered {max-width: 25%; margin: 0 auto; /*border: 2px solid #3894AE;*/  border: 5px solid rgba(56,148,174,.5); padding: 40px; box-sizing: border-box; text-align: center; margin-top: 155px; position:relative;}
.green-border div.bordered h3 {color:#8BC53E; font-size:93px; font-weight:bold; line-height:1;}
.green-border div.bordered h4 {color:#585859; font-size:50px; font-weight:bold; line-height:1;}

.homemore-box {width: 240px!important; height: 67px; background: #8BC53E; margin: 20px; transform: perspective(300px) rotateX(-2deg) rotateY(0deg) rotateZ(3deg); position: absolute; left: 20%; bottom: -55px;}
.homemore-box:before {content:'CLICK TO ENTER'; position:absolute; top:21px; left:61px; font-size:17px; color:#fff; transform:rotate(-3deg); font-weight:bold}
.homemore-box:after {content:url('../images/white-download.png'); position:absolute; top:21px; right:42px; transform:rotate(-3deg);}
.homemore-box:hover {background:#10084C; cursor:pointer;}


/*GENERAL*/
.margin-30B {margin-bottom:30px!important;}
.margin-50B {margin-bottom:50px!important;}
.no-marginT {margin-top:0px!important;}
.no-marginB {margin-bottom:0px!important;}
.img-responsive {max-width:100%;}
.downloads-link {padding-top:53px; padding-left:85px; color:#10084C; font-size:20px; position:relative;}
.downloads-link:after {content:url('../images/downloads-arrow.png'); position:absolute; top:128px; right:35px;}
.download-link-box {display:table; position: relative; right: 0px; width:100%; background:black;}

/*SWITCH COLOURS*/
.switch-darkblue {color:#1B528B!important;}
.switch-purple {color:#10084C!important;}
.switch-green {color:#8BC53E!important;}


/*RESPONSIVE*/
@media screen and (max-width: 1440px) {
.skew-background1 {width: 70%; margin-top: 5em;}
.skew-background2 {width: 70%; margin-top: 5em;}
.skew-background3 {width: 70%; margin-top: 5em;}
.skew-background4 {width: 70%; margin-top: 5em;}
.skew-border1 {left: 65px;}

.green-border div.bordered {max-width: 40%;}
}