/* CSS Document */

/*============== Web Fonts  ==============*/
@font-face { font-family: 'Dinot-Bold'; src: url('../fonts/dinot-bold-webfont.eot'); src: url('../fonts/dinot-bold-webfont.svg') format('svg'), url('../fonts/dinot-bold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/dinot-bold-webfont.woff') format('woff'), url('../fonts/dinot-bold-webfont.ttf') format('truetype'); font-weight: lighter; font-style: normal; }
@font-face { font-family: 'Dinot'; src: url('../fonts/dinot-regular-webfont-webfont.eot'); src: url('../fonts/dinot-regular-webfont-webfont.svg') format('svg'), url('../fonts/dinot-regular-webfont-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/dinot-regular-webfont-webfont.woff') format('woff'), url('../fonts/dinot-regular-webfont-webfont.ttf') format('truetype'); font-weight: lighter; font-style: normal; }
@font-face { font-family: 'Dinot-Black'; src: url('../fonts/dinot-black-webfont.eot'); src: url('../fonts/dinot-black-webfont.svg') format('svg'), url('../fonts/dinot-black-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/dinot-black-webfont.woff') format('woff'), url('../fonts/dinot-black-webfont.ttf') format('truetype'); font-weight: lighter; font-style: normal; }

/*============== Base Styles   ==============*/
body { margin: 0; padding: 0; color: #000000; background: #ffffff; font-size: 14px; font-family: 'Dinot', Helvetica, Arial, sans-serif; }
table { border-collapse: collapse; }
p, h1, h2, h3, h4, h5, h6 { margin-top: 0px; padding-top: 0px; }

/* links  ==============*/
a { text-decoration: none; }
a:hover { text-decoration: none; }

/* headers  ==============*/
h1, h2, h3, h4, h5, h6 { font-family: 'Dinot', Helvetica, Arial, sans-serif; color: #ffffff; }

/*============== Structure  ==============*/
.container { width: 1365px; margin: auto; }
.grey-border { border: solid 10px #DFDFDF; }

/*============== Header  ==============*/
#topbar { width: 100%; background-color: #DFDFDF; font-family: 'Dinot-Bold', Helvetica, Arial, sans-serif; overflow: hidden; padding-bottom: 8px; }
#stockinfo { font-size: 12px; padding-top: 6px; }
.up { color: #0F723B; }
.down { color: #505050; }
.up, .down { float: left; }
.up span, .down span { font-size: 18px; padding-top: 0px; margin-top: 3px; }
.up span.change { background: url(../img/up.png) left top no-repeat; padding-left: 22px; }
.down span.change { background: url(../img/down.png) left top no-repeat; padding-left: 22px; }
.stockbreak { border-left: solid 1px #C8C8C8; width: 1px; float: left; height: 20px; margin-left: 12px; margin-right: 12px; }
.updated { padding-top: 4px; }
#contact { float: right; background-color: #787878; padding: 4px 14px 4px 14px; }
#contact a { text-transform: uppercase; font-size: 12px; color: #ffffff; }
#contact:hover { transition: background-color 0.5s ease; background-color: #0E4272; }
#logo { margin-top: 15px; float: left; }
#topmenu { margin-top: 25px; float: right; }
#social div { float: right; border-left: solid 1px #C8C8C8; height: 25px; padding: 0px 5px; }
#search, #social { float: right; }
.facebook { border-left: 0px !important; margin-left: 10px; }
.textbox { border: solid 2px #C8C8C8; height: 28px; padding-left: 15px; }
#search form { margin-bottom: 14px; }
#signup_message { color: #ffffff !important; }
form label { display: none; color: #ffffff; }
form input { box-sizing: border-box; }
#spamcheck-dontfillout { display: none; }

/* Navigation  ==============*/
#menu-icon { display: none; background-color: #0E4272; font-family: 'Dinot-Bold', Helvetica, Arial, sans-serif; color: #ffffff; text-transform: uppercase; font-size: 16px; width: 100%; padding: 5px; box-sizing: border-box; transition: background-color 0.5s ease-out, color 0.5s ease-out; }
#menu-icon:hover { background-color: #DFDFDF; color: #0E4272; }
#nav { margin: auto; }
.nav-border {/* border-right:2px #B7B7B7 solid;  width:4px;  height:14px;  display:-moz-inline-stack; display:inline-block; zoom:1; *display:inline;  margin-right:2px;*/  }
#nav ul { margin: 0px; padding: 0px; list-style: none; clear: both; text-align: center; }
#nav ul li { display: -moz-inline-stack; display: inline-block; zoom: 1; *display: inline; position: relative; }
#nav ul li a { padding: 0px 43px 15px 43px; font-size: 14px; display: block; color: #000000; text-decoration: none; text-transform: uppercase; z-index: 20 !important; font-family: 'Dinot', Helvetica, Arial, sans-serif; }
#nav ul li:hover a { color: #055093; }
.navlast { border-right: 0px !important; }
.navfirst a { padding: 0px 43px 15px 0px !important; }
.navlast a { padding: 0px 0px 15px 43px !important; }

/*.navend {padding:0px !important; margin:0px !important; width: 50% !important; height:20px !important;}*/
.navlast .sub { left: auto !important; right: -11px !important; }
.navfirst .sub { right: auto !important; left: -10px !important; }
#nav .sub { position: absolute; display: none; left: 0px; top: 29px; z-index: 500 !important; background-color: #ffffff; border-left: #C8C8C8 2px solid; border-right: #C8C8C8 2px solid; border-bottom: #C8C8C8 2px solid; padding: 5px !important; width: 170px; text-align: left !important; box-sizing: border-box; }
#nav .sub li a { font-family: 'Dinot', Helvetica, Arial, sans-serif !important; text-transform: uppercase !important; font-size: 14px !important; color: #787878 !important; padding: 5px 5px 5px 5px !important; margin: 0px !important; }
#nav .sub li { float: none !important; border-right: none !important; text-align: left !important; display: block !important; }
#nav .sub li a:hover { color: #055093 !important; background-color: #B4D5C3 !important; }

/*============== Banner  ==============*/
#banner { clear: both; }
.banner-text { width: 30%; /*height:64.5%;*/ height: 62.5%; background: url(../img/overlay.png) top left repeat; top: 0px; right: 0px; position: absolute; z-index: 10; padding: 4% 4.5% 4.5% 4.5%; }
.banner-text h1, .banner-text h2 { color: #ffffff; text-transform: uppercase; }
.banner-text h1 { color: #ffffff; text-transform: uppercase; font-family: 'Dinot-Bold', Helvetica, Arial, sans-serif !important; font-size: 45px; margin-bottom: 15px; }
.banner-text h2 { color: #ffffff; text-transform: uppercase; font-family: 'Dinot', Helvetica, Arial, sans-serif !important; font-size: 30px; margin-bottom: 0px; }
.banner-text p { color: #ffffff; font-family: 'Dinot', Helvetica, Arial, sans-serif !important; font-size: 16px; }
.banner-break { width: 100%; border-top: solid #ffffff 5px; margin-bottom: 25px; }

/*============== Browser Hacks  ==============*/
@-moz-document url-prefix() {

    /* Firefox */
    #banner { margin-top: -62px; }
}
@media screen and (-ms-high-contrast:active), (-ms-high-contrast:none) {

    /* IE10+ specific styles go here */
    #banner { margin-top: -3px; }
}

/*==============*/

/*============== Mid  ==============*/

#main { display: block; }
.wrapper h2 { color: #000000; font-size: 24px; text-transform: uppercase; }
.wrapper h2 span { color: #055093 !important; text-transform: none !important; font-size: 48px !important; }
.project { margin-top: -36px !important; margin-bottom: 0px !important; }
.box-text h1, .box-text h2 { color: #ffffff; text-transform: uppercase; }
.box-text h1 { color: #ffffff; text-transform: uppercase; font-family: 'Dinot-Bold', Helvetica, Arial, sans-serif !important; font-size: 35px !important; margin-bottom: 5px; }
.box-text h2 { color: #ffffff; text-transform: uppercase; font-family: 'Dinot', Helvetica, Arial, sans-serif !important; font-size: 23px !important; margin-bottom: 0px; }
.box-text p { color: #ffffff; font-family: 'Dinot', Helvetica, Arial, sans-serif !important; font-size: 16px; text-transform: uppercase; }
#sidebar { width: 24%; float: left; margin-right: 4.5%; }
#news { background: url('../img/bg-news2.jpg') top left no-repeat fixed; -moz-background-size: 100% 100%; -webkit-background-size: 100% 100%; background-size: 100% 100%; padding: 8% 10% 8% 10%; }
#news h2 { color: #ffffff; text-transform: uppercase; font-family: 'Dinot', Helvetica, Arial, sans-serif !important; font-size: 23px !important; }
#news h2.rare { font-size: 20px !important; }
#news a { color: #ffffff; font-family: 'Dinot', Helvetica, Arial, sans-serif !important; font-size: 16px !important; }
#news a span { color: #ffffff; font-family: 'Dinot-Bold', Helvetica, Arial, sans-serif !important; font-size: 14px !important; }
.news-break { background-color: #4079AA; margin-top: 30px; margin-bottom: 30px; height: 1px; width: 100%; }
.industry-title { margin-top: 30px; }
#quote { margin-top: 30px; float: left; clear: right; width: 100% !important; box-sizing: border-box; }
#quote h1 { font-size: 25px; color: #111111; margin-bottom: 15px !important; }
#quote h1 span { color: #055093; }
#quote h2 { font-size: 14px; color: #111111; }
#quote .left { float: left; width: 420px; margin-right: 40px; }
#quote .right { float: left; }
#event { margin-bottom: 30px; float: left; clear: right; width: 100% !important; box-sizing: border-box; }
#event h1 { font-size: 48px; color: #055093; margin-bottom: 10px !important; }
#event h1 span { color: #055093; }
#event h2 { font-size: 25px; color: #111111; }
#event .left { float: left; width: 420px; margin-right: 40px; }
#event .right { float: left; }
#announce { margin-bottom: 30px; float: left; clear: right; width: 100% !important; box-sizing: border-box; }
#announce h1 { font-size: 25px; color: #111111; margin-bottom: 15px !important; }
#announce h1 span { color: #055093; }
#announce h2 { font-size: 14px; color: #111111; }
#announce .left { float: left; width: 420px; margin-right: 40px; }
#announce .right { float: left; }
#content { float: right; width: 71.5%; }
.main-break { border-bottom: 2px #C3C3C3 solid; clear: both; width: 100%; padding-top: 25px; }
.wrapper.big { width: 100%; margin-top: 35px; float: left; }
.wrapper.small { width: 47%; float: left; margin-top: -16px; }
.wrapper.small h2.title { color: #055093; text-transform: none; font-size: 48px; margin: 0 0 8px; }
.bigbox, .smallbox { position: relative; }
.bigbox { background: url(../img/Bigwhopper.jpg) top left no-repeat; padding-bottom: 41%; -moz-background-size: 100% 100%; -webkit-background-size: 100% 100%; background-size: 100% 100%; background-color: #000000; }
.bigbox > div, .smallbox > div { position: absolute; top: 0; bottom: 0; left: 0; right: 0; }
.smallbox > div { background: url(../img/overlay.png) top left repeat; padding: 15% 0px 0px 5%; }
.bigbox > div { background: url(../img/overlay.png) top left repeat; width: 32%; height: auto; padding-left: 2.5%; padding-top: 10%; padding-right: 8px; }
.bigbox img { margin-top: 10px; }
.sustainability { margin-right: 6%; }
.sustainability .smallbox { background: url(../img/bg-sustainability.jpg) top left no-repeat; padding-bottom: 55%; -moz-background-size: 100% 100%; -webkit-background-size: 100% 100%; background-size: 100% 100%; background-color: #000000; }
.investors .smallbox { background: url(../img/bg-investors.jpg) top left no-repeat; padding-bottom: 55%; -moz-background-size: 100% 100%; -webkit-background-size: 100% 100%; background-size: 100% 100%; background-color: #000000; }
.home-button { width: 318px; height: 61px; background: url(../img/bg-button.png) top left no-repeat; color: #ffffff; font-family: 'Dinot-Bold', Helvetica, Arial, sans-serif; font-size: 18px; padding: 22px 0px 0px 0px; margin: 15px auto auto auto; }
.home-button span { padding-left: 30px !important; }

/*============== Footer ==============*/
#footer-a { border-top: 6px solid #057539; background-color: #000000; width: 100%; color: #FFF; margin-top: 50px; clear: both; overflow: hidden; padding: 32px 0px 40px 0px; }
#footer-b { background-color: #0D5598; width: 100%; clear: both; font-size: 12px; }
#footer-b .container div { color: #ffffff !important; text-transform: uppercase !important; padding: 40px 50px 25px 50px; }
#footernav, #footernav div { float: right; }
#footernav div { margin-right: 70px; }
#footernav { margin-top: 15px; }
#signup, #email-signup { float: left; position: relative; }
.grey { background-color: #C8C8C8; border: none !important; color: #333333 !important; }
.submit { width: 72px; height: 28px; background: url(../img/bg-submit.jpg) top left no-repeat; color: #ffffff; border: none; font-family: 'Dinot-Bold', Helvetica, Arial, sans-serif; top: 0px; position: absolute; padding-top: 2px; }
#footernav a { color: #CCC; display: block; margin-bottom: 10px; }

/* ---|Homepage Updates June 2019|--- */
#content .wrapper { display: block; overflow: hidden; }
#content .wrapper.second { margin-top: 30px; }
#content .wrapper .sixty { width: 54%; float: left; margin-right: 1%; }
#content .wrapper .sixty .bigbox { padding-bottom: 50%; }
#content .wrapper .sixty .bigbox > div { width: 40%; }
#content .wrapper .forty { width: 44%; float: left; margin-left: 1%; }
#content .wrapper .forty .bigbox { padding-bottom: 61.4%; }
#content .wrapper .forty .bigbox > div { width: 40%; }
#content .wrapper.why-invest .bigbox { background-image: url(../../../../_resources/images/wrapper-why-invest-bg.jpg); }
#content .wrapper.sustainability .bigbox { background-image: url(../../../../_resources/images/wrapper-sustainability-bg.jpg); }
#content .wrapper.presentation .bigbox { background-image: url(../../../../_resources/images/wrapper-presentation-bg.jpg); }
#content .wrapper.report .bigbox { background-image: url(../../../../_resources/images/wrapper-report-bg.jpg); }
#content .wrapper > h2 { color: #0F5291; font-size: 48px; line-height: 48px; }
#content .wrapper > p { font-size: 20px; }
#content .wrapper .sixty h1 { margin-bottom: 15px; line-height: 35px; }
#content .wrapper .sixty h2 { font-size: 20px !important; }
#content .wrapper .forty h1 { font-size: 20px !important; margin-bottom: 15px; }
#content .wrapper .forty h2 { font-size: 15px !important; }
#content .wrapper.sustainability h1 { font-size: 25px !important; line-height: 25px !important; }

/* ---|Queries|--- */
@media screen and (max-width:1300px) {
    #content .wrapper .box-text { width: 66% !important; }
}
@media screen and (max-width:700px) {
    #content .wrapper > h2 { color: #0F5291; font-size: 30px; line-height: 30px; }
    #content .wrapper .sixty, #content .wrapper .forty { width: 100%; float: none; margin: 15px 0px; }
    #content .wrapper .sixty .bigbox, #content .wrapper .forty .bigbox { padding-bottom: 40%; }
    #content .wrapper .box-text { width: 40% !important; }
}
@media screen and (max-width:550px) {
    #content .wrapper .box-text { width: 66% !important; }
}
@media screen and (max-width:430px) {
    #content .wrapper .sixty .bigbox, #content .wrapper .forty .bigbox { padding-bottom: 60%; }
}

/*============== RESPONSIVE ADJUSTMENTS  ==============*/
@media (max-width:1382px) {
    #nav ul li a { padding: 0px 30px 15px 30px !important; }
    .container { width: 100% !important; }
    #stockinfo { margin-left: 2%; }
    #contact { margin-right: 2%; }
    #topmenu { margin-right: 2%; }
    #main { padding-left: 2%; padding-right: 2%; width: 96% !important }
    #sidebar { width: 23% !important; margin-right: 3.5% !important; }
    #content { width: 73.5% !important; }
    #email-signup { margin-left: 2%; }
}
@media (max-width:1313px) {
    .flex-control-nav li { width: 24.7% !important; }
}
@media (max-width:1275px) {
    #main.banner-text { padding: 2.5% 4.5% 8.5% 4.5%; }
    .smallbox > div { padding: 5% 0px 0px 5%; }
}
@media (max-width:1210px) {
    .bigbox > div { height: auto; padding-top: 10%; }
}
@media (max-width:1200px) {
    #banner h1 { font-size: 38px; }
}
@media (max-width:1190px) {
    #nav ul li a { padding: 0px 18px 15px 18px !important; }
    .bigbox > div { padding-top: 9% }
}
@media (max-width:1100px) {
    .bigbox > div { padding-top: 7%; padding-bottom: 3%; }
    .box-text h1 { font-size: 30px !important; }
}
@media (max-width:1080px) {
    .banner-text { width: 40%; padding: 4% 4.5% 4.5% 4.5%; }
}
@media (max-width:1059px) {
    #quote .left { width: 340px; }
    #event .left { width: 340px; }
    #announce .left { width: 340px; }
}
@media (max-width:1000px) {
    #nav ul li a { padding: 0px 12px 15px 12px !important; }
    .flex-control-nav li div { margin-top: 1% !important; }
}
@media (max-width:960px) {
    #sidebar { width: 100% !important; float: left; margin-right: 0% !important; }
    #news { padding: 1% 2% 1% 2%; }
    #content { width: 100% !important; margin-top: 30px; }
    .project { margin-top: 15px !important; }
    .box-text h1 { font-size: 35px !important; }
    #quote { width: 100% !important; }
    #event { width: 100% !important; }
    #announce { width: 100% !important; }
    .flexslider { margin: 0 0 15px 0px !important; }
    .banner-text { width: 50%; }
    #news a { font-size: 14px !important; }
    #news a span { font-size: 12px !important; }
    .news-break { margin-top: 15px; margin-bottom: 15px; }
    #quote .left { width: 420px; }
    #event .left { width: 420px; }
    #announce .left { width: 420px; }
    .wrapper.small { margin: 0; }
}
@media (max-width:900px) {
    #nav ul li a { padding: 0px 6px 15px 6px !important; }
}
@media (max-width:881px) {
    .flex-control-nav li { width: 24.6% !important; }
}
@media (max-width:805px) {
    #nav ul li a { font-size: 12px; }
    #nav .sub li a { font-size: 12px !important; }
    #nav .sub { top: 28px; }
    .box-text h1 { font-size: 25px !important; }
    #banner p { font-size: 14px; }
}
@media (max-width:780px) {
    #nav ul li a { padding: 0px 5px 15px 5px !important; }
}
@media (max-width:768px) {
    #navigation { display: none; margin-top: 5px !important; }
    #menu-icon { display: -moz-inline-stack; display: inline-block; zoom: 1; *display: inline; }
    #nav { clear: both; margin-bottom: 0px; text-align: center; }
    #nav ul li.nav-border { display: none; }
    #nav ul li { display: block; }
    #nav .sub { background-color: #DFDFDF; position: relative; width: 100%; top: 0px; border-top: #C8C8C8 2px solid; }
    #nav .sub li { text-align: center !important; }
    #nav .sub li a { font-size: 11px !important; }
    #nav ul li a { padding: 5px 0px 5px 0px !important; }
    #banner { display: none !important; }

    /* Hiding the banner for mobile */
    .box-text img { display: none; }
    #sidebar .wrapper h2 { margin-top: 25px; }
    .navfirst .sub { left: 0px !important; }
    .navlast .sub { right: 0px !important; }
    #quote .left { float: none; width: auto; margin-right: 0px; }
    #event .left { float: none; width: auto; margin-right: 0px; }
    #announce .left { float: none; width: auto; margin-right: 0px; }
    #quote .right { float: none; margin-top: 25px; }
    #event .right { float: none; margin-top: 25px; }
    #announce .right { float: none; margin-top: 25px; }
}
@media (max-width:747px) {
    #banner h1 { font-size: 30px; }
    #banner h2 { font-size: 20px; }
}
@media (max-width:745px) {
    #email-signup { float: none; display: -moz-inline-stack; display: inline-block; zoom: 1; *display: inline; width: 270px; }
    #footernav { float: none; display: -moz-inline-stack; display: inline-block; zoom: 1; *display: inline; }
    #footernav div { text-align: left; }
    #footer-a { text-align: center; }
}
@media (max-width:744px) {
    #topmenu { margin-top: 10px; }
}
@media (max-width:690px) {
    .wrapper.small { width: 450px; margin-left: auto !important; margin-right: auto !important; float: none; }
    .bigbox > div { padding-top: 7%; padding-bottom: 13.5%; width: 66%; }
}
@media (max-width:665px) {
    .flex-control-nav li { width: 24.5% !important; }
    #banner p { font-size: 12px; }
}
@media (max-width:600px) {
    #banner h1 { font-size: 25px; }
    #banner h2 { font-size: 15px; }
    .flex-control-nav li { font-size: 12px; }
}
@media (max-width:580px) {
    .banner-text { width: 91%; padding: 6.5% 4.5% 4.5% 4.5%; }
    #topbar { text-align: center; }
    #contact { float: none; display: -moz-inline-stack; display: inline-block; zoom: 1; *display: inline; margin: 2% auto 2% auto; clear: both; }
    #stockinfo, .up, .down, .stockbreak { display: -moz-inline-stack; display: inline-block; zoom: 1; *display: inline; float: none; }
}
@media (max-width:535px) {
    .flex-control-nav li { width: 24.4% !important; }
}
@media (max-width:500px) {
    #banner h1 { font-size: 20px; }
    #banner h2 { font-size: 10px; }
    .banner-break { margin-bottom: 10px; }
}
@media (max-width:485px) {
    #social, #search { display: -moz-inline-stack; display: inline-block; zoom: 1; *display: inline; float: none; }
    #search { margin-top: 10px; }
    #logo { float: none; margin-left: auto; margin-right: auto; width: 289px; }
    #topmenu { width: auto; text-align: center; }
}
@media (max-width:480px) {
    .wrapper.small { width: 100%; }
    #footernav div { float: none; display: block; clear: both; }
    #footernav { display: block; width: 120px; margin: auto; }
    #email-signup { overflow: hidden; margin-bottom: 10px; }
}
@media (max-width:449px) {
    .flex-control-nav li { width: 24.3% !important; }
    .flex-control-nav li { font-size: 10px; }
}
@media (max-width:448px) {
    .bigbox img { display: none; }
}
@media (max-width:432px) {
    .flex-control-nav li { font-size: 9px; }
    .flex-control-nav { bottom: 3px !important; }
}
@media (max-width:387px) {
    .flex-control-nav li { width: 24.2% !important; }
    #banner h1 { font-size: 15px; }
    #banner h2 { font-size: 10px; }
    .banner-break { margin-top: -10px; }
    .box-text h2 { font-size: 14px !important; }
    .bigbox > div { padding-top: 7%; padding-bottom: 13.5%; width: 97%; padding-left: 3%; padding-right: 0; }
}
@media (max-width:367px) {
    .flex-control-nav { bottom: 4px !important; }
    .banner-text { padding: 4.5% 4.5% 6.5% 4.5%; }
}
@media (max-width:350px) {
    #banner p { font-size: 10px; }
    #banner h1 { font-size: 10px; }
    .flex-control-nav li { width: 24.0% !important; }
    .smallbox img { display: none; }
    .home-button { margin: 15px 0px auto 0px; width: 290px; height: 56px; background: url(../img/bg-button-sm.png) top left no-repeat; }
}
#loadOverlay { display: none; }

/* RECAPTCHA */
.recaptcha { transform: scale(0.6); transform-origin: left; opacity: 0; height: 0px; transition: all 0.25s ease-in-out; pointer-events: none; }
.recaptcha.show { opacity: 1; height: 78px; pointer-events: all; margin-bottom: 0px; }
