﻿@font-face {
    font-family: 'Staatliches';
    src: url('fonts/Staatliches-Regular.woff2') format('woff2'),
         url('fonts/Staatliches-Regular.woff') format('woff');
}
@font-face {
    font-family: 'Catamaran';
    src: url('fonts/Catamaran-Regular.woff2') format('woff2'),
         url('fonts/Catamaran-Regular.woff') format('woff');
}
@font-face {
    font-family: 'BiryaniBold';
    src: url('fonts/biryanibold.woff2') format('woff2'),
         url('fonts/biryanibold.woff') format('woff');
}
@font-face {
    font-family: 'OpenSans';
    src: url('fonts/OpenSansRegular.woff2') format('woff2'), 
         url('fonts/OpenSansRegular.woff') format('woff');
}
@font-face {
    font-family: 'OpenSansLight';
    src: url('fonts/OpenSansLight.woff2') format('woff2'), 
         url('fonts/OpenSansLight.woff') format('woff');
}


.MainFont {
    font-family: 'Catamaran' !important;
}
.OpenSansFont {
    font-family: OpenSans;
}
.MediumText{
    font-size: 18px;
}

a {
    text-decoration: none !important;
    color: #014ab8;
}
a:hover {
    text-decoration: none !important;
    color: #3d7ee0;
}
.uk-offcanvas-bar {
    background: #011c77;
}
a.TextLink {
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
    transition: transform 0.2s;
    display: inline-block;
    text-decoration: none !important;
    position: relative;
    padding: 0 0.25em;
}
a.TextLink:hover {
}
a.TextLink::before,
a.TextLink::after {
position: absolute;
top: 0;
font-weight: lighter;
font-size: 140%;
line-height: 1;
opacity: 0;
-webkit-transition: opacity 0.2s, -webkit-transform 0.2s;
transition: opacity 0.2s, transform 0.2s;
}
a.TextLink::before {
left: -0.2em;
content: '[';
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
a.TextLink::after {
right: -0.2em;
content: ']';
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
a.TextLink:hover::before,
a.TextLink:hover::after {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}

html {
    height: 100%;
}
body {
    background: url('/images/allinbackground.png') no-repeat center 1400px;
    font-family: 'OpenSans';
    font-size: 20px;
    /*border-bottom: solid 5px #29be4a;*/
    /*height: 100%;*/
    color: #32363a;
}
footer {
    /*border-bottom: solid 5px #29be4a;*/
    background: #162028;
    min-height: 360px;
}
.uk-offcanvas-content {
    /*height: 100%;*/
}
.Content {
    min-height: calc(100% - 240px);
}
.footerbluebackground {
    min-height: 120px;
    padding-top: 120px;
    /*background: #014ab8;*/
}
.footerbluebackgroundlower {
    /*min-height: 240px;*/
    padding-top: 0px;
    /*background: #0045ae;*/
}
.CopyRight{
    /*padding-top: 60px;*/
}



input[type=text], input[type=password], input[type=number], select, textarea {
    /*border: 1px solid #fee500;*/
    width: calc(100% - 40px);
    padding: 5px 15px;
    height: 40px;
    font-family: OpenSans;
    font-size: 16px;
    /*background-color: transparent !important;*/
    background-color: #ffffff !important;
}
select{
    width: calc(100% - 12px);
}
/*input[type=text], input[type=password], input[type=number]{
    width: 96%;
}*/
/*.ContactForm input[type=text], .ContactForm input[type=password], .ContactForm input[type=number], .ContactForm select, .ContactForm textarea {
    width: 95%;
}*/
select {
    height: 41px;
}
textarea, select.Multiple {
    height: auto;
    /*background: url('/images/textarealeftborder.png') no-repeat left bottom;*/
}

.BlueBackground {
    background: #014ab8;
}

.DesktopNav {
    width: 100%;
    z-index: 10;
}
.Navigation {
    min-height: 80px;
    font-family: 'Catamaran' !important;
}
/*.NavigationTopItem {
    font-size: 18px;
    padding: 0 0 0 50px;
    text-transform: capitalize;
}*/
.NavigationItem {
    font-size: 24px;
    padding: 0 0 0 50px;
    text-transform: capitalize;
}
.NavigationItem:hover, .NavigationItem.Highlight, .NavigationTopItem:hover, .NavigationTopItem.Highlight, .MobileMenu a:hover, .MobileMenu a.Highlight {
    color: #1ea2e0 !important;
    text-transform: capitalize;
}
.MobileMenu .NavigationItem:hover, .MobileMenu .NavigationItem.Highlight {
    color: #1ea2e0 !important;
    text-transform: capitalize;
}
footer .NavigationItem{
    font-size: 16px;
    padding: 0;
}

.PageHeader a.DarkBlueC:hover {
    color: #1ea2e0 !important;
}

.MinimumVideoModalHeight{
    min-height: 580px;
}

.NavigationBottomLine {
    width: 100%;
    height: 0px;
    border-bottom: solid 2px #c8e19f;
}

.NavigationBackgroundShade {
    background: url('/images/navigationbluebackground120.jpg') no-repeat center top;
    position: fixed;
}
.LogoMaxWidth {
    max-width: 50%;
}

h1.Title {
    font-family: Staatliches !important;
    color: #0036e5;
    font-size: 54px;
    line-height: 60px;
    margin-bottom: 0;
}
h1.WhiteTitle {
    font-family: Staatliches !important;
    color: #ffffff;
    font-size: 54px;
    line-height: 60px;
    margin-bottom: 0;
}
h1.Title small {
    font-size: 28px;
    line-height: 34px;
    margin-bottom: 0;
    font-weight: normal;
}
h1.GreenTitle {
    font-family: OpenSans !important;
    color: #61c701;
    font-size: 54px;
    line-height: 60px;
    font-weight: bold;
    margin-bottom: 30px;
}
.HopeAndFutureBackgroundMobile h1.GreenTitle {
    font-size: 38px;
    line-height: 46px;
}
.InterviewsMobile a {
    font-size: 12px;
}

.BlueLine {
    border-bottom: 1px solid #0036e5;
    height: 1px;
}

.MainVideoBackground{
    background: url('/images/mainvideobackgroundonly.jpg') no-repeat center top;
    min-height: 780px;
    background-size: cover;
}
h2.MainVideoTitle {
    color: #0036e5;
    font-size: 33px;
    font-family: OpenSans;
    font-weight: bold;
    line-height: 38px;
}
.MainVideoBackgroundMobile .h2.MainVideoTitle {
    font-size: 26px;
}
.MainVideoBackgroundMobile p {
    /*font-size: 16px;*/
}
.PlayButton {
    color: #0036e5;
    font-size: 26px;
    font-weight: normal;
    cursor: pointer;
}
.PlayButton * {
    display:inline-block;
}
.PlayButton img {
    margin-top: -25px;
}


.AllInBackground {
    /*background: url('/images/allinbackground.jpg') no-repeat center top;
    min-height: 842px;*/
}
.HopeAndFutureBackground {
    /*background: url('/images/whitebackground.png') no-repeat center bottom;*/
    /*background-color: rgba(255,255,255,0.5);*/
    min-height: 830px;
}
.ContactFormBackground {
    background: url('/images/bluebackground.png') no-repeat center top;
    min-height: 600px;
}
.WrapText{
    white-space: normal !important;
}

.Button, .Button:hover {
    padding: 10px 25px 10px 20px;
    color: #32363a !important;
    font-size: 22px;
    text-transform: uppercase;
    border: solid 1px #0036e5;
    cursor: pointer;
    line-height: normal;
    background: transparent !important;
    white-space: nowrap;
}

.HopeAndFutureBackgroundMobile .Button {
    font-size: 16px;
}

.TestimonialsBackground{
    min-height: 380px;
    margin-top: 120px;
}

.Button:hover {
    background: #1ea2e0 !important;
    color: #ffffff !important;
    border: solid 1px #1ea2e0;
}
.WhiteButton, .WhiteButton:hover {
    padding: 10px 25px 10px 20px;
    color: #ffffff !important;
    font-size: 22px;
    text-transform: capitalize;
    border: solid 1px #7e7e7e;
    cursor: pointer;
    line-height: normal;
    background: transparent !important;
    white-space: nowrap;
}
.WhiteButton:hover {
    background: #1ea2e0 !important;
    color: #ffffff !important;
    border: solid 1px #1ea2e0;
}

.Field {
    margin-bottom: 25px;
    -webkit-box-shadow: 0px 0px 16px 5px rgba(0,0,0,0.24);
    -moz-box-shadow: 0px 0px 16px 5px rgba(0,0,0,0.24);
    box-shadow: 0px 0px 16px 5px rgba(0,0,0,0.24);
    border: none;
    background: url('/images/fieldbackground.png') no-repeat left top;
}
.Hide{
    display: none;
}

.LeftGreySeparator {
    border-left: solid 1px #cecece;
}

.homesliderdivitem{
    
}
.HomeSlideContent{
    height: 740px;
}
.HomeSlideContent h1 {
    background-color: #014ab8;
    padding: 5px 15px;
    text-transform: uppercase;
    font-size: 100px;
    letter-spacing: 2px;
    display: inline-block;
    color: #ffffff !important;
    margin-top: 0;
    margin-bottom: 0;
}
.HomeSlideContent h2 {
    text-transform: uppercase;
    font-size: 64px;
    color: #ffffff !important;
    margin-top: 0;
    margin-bottom: 0;
}
.HomeSlideContent h3 {
    font-size: 38px;
    color: #ffffff !important;
    margin-top: 0;
    margin-bottom: 0;
}
.HomeSlideContent h3 b {
    color: #014ab8;
}

.owl-carousel{
    z-index: 0 !important;
}

.PageHeader .HeaderImage, .HomeHeaderImage {
    min-height: 460px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-x: center;
    background-position-y: center;
}
.HomeHeaderImage {
    min-height: 960px;
}
.HomeHeaderImage1 {
    background: url('/images/headerbackground.jpg') no-repeat;
    background-position-x: 64%;
    background-size: cover;
}

h1.HomeHeaderSlogan {
    font-family: OpenSansLight;
    font-size: 38px;
}
h1.HomeHeaderSloganMobile b {
    font-family: OpenSansLight;
    font-size: 34px;
}
h1.HomeHeaderSloganMobile {
    font-family: OpenSansLight;
    font-size: 24px;
}
.SearchVerticalLeftSeparator {
    border-left: solid 1px #ffffff;
    padding-left: 10px;
}

.WhitePlaceholder::placeholder{
    color: #ffffff;
}
.HomepageVideoPreview {
    background: url('/images/homepagevideopreview.jpg') no-repeat center center;
    min-height: 588px;
}
.Height100p{
    height: 100%;
}


.VideoItem {
    border-left: solid 6px #014ab8;
    color: #014ab8;
    cursor: pointer;
    display: block;
    -webkit-box-shadow: 0px 0px 16px 4px rgba(0,0,0,0.15);
    -moz-box-shadow: 0px 0px 16px 4px rgba(0,0,0,0.15);
    box-shadow: 0px 0px 16px 4px rgba(0,0,0,0.15);
}
.VideoItem:hover, .HighlightedVideoItem {
    border-left: solid 8px #ff8019;
    cursor: pointer;
    display: block;
    -webkit-box-shadow: 0px 0px 16px 4px rgba(0,0,0,0.15);
    -moz-box-shadow: 0px 0px 16px 4px rgba(0,0,0,0.15);
    box-shadow: 0px 0px 16px 4px rgba(0,0,0,0.15);
}


.uk-card-hover:hover {
    background-color: #7e827e !important;
    color: #ffffff !important;
}
.uk-card-hover:hover p {
    color: #ffffff !important;
}

.uk-tab::before{
    border-bottom: none;
}
ul.uk-tab li a {
    /*background: url('/images/tabbuttonbackground.jpg') repeat-x left top;*/
    font-family: 'OpenSans';
    text-transform: uppercase;
    color: #0036e5;
    padding: 15px 40px;
    font-size: 26px;
}
ul.uk-tab li.uk-active a, ul.uk-tab li a:hover {
    /*background: url('/images/tabbuttonhighlightbackground.jpg') repeat-x left top;*/
    color: #1ea2e0 !important;
    border: none;
}
.uk-radio:checked, .uk-checkbox:checked, .uk-checkbox:indeterminate, 
.uk-radio:checked:focus,
.uk-checkbox:checked:focus,
.uk-checkbox:indeterminate:focus{
    background-color: #014ab8;
}
h1,h2,h3,h4,h5,h6{
    color: inherit;
}


.MenuButton {
    width: 32px;
    height: 32px;
    padding: 0;
    border: none;
}


.LightButtonGreenBorder {
    padding: 10px 25px 10px 20px;
    font-size: 22px;
    border: solid 1px #014ab8;
    cursor: pointer;
    line-height: normal;
}
.OrangeButton, .OrangeButton:hover {
    /*background: #ff8019 url('/images/buttonrightgripgreen.jpg') no-repeat right center;*/
    padding: 10px 25px 10px 20px;
    color: #ffffff !important;
    font-size: 22px;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
    line-height: normal;
    /*background: #ff8019;*/
    /*background-image: url('/images/buttonrightgripgreen.jpg');*/
    background: url('/images/buttonrightgripgreen.jpg') no-repeat right center, linear-gradient(135deg, #ffab27 0%,#ff7b18 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffab27+0,ff7b18+100 */ /*background: #ffab27;*/ /* Old browsers */
    /*background: -moz-linear-gradient(-45deg, #ffab27 0%, #ff7b18 100%);*/ /* FF3.6-15 */
    /*background: -webkit-linear-gradient(-45deg, #ffab27 0%,#ff7b18 100%);*/ /* Chrome10-25,Safari5.1-6 */
    /*background: linear-gradient(135deg, #ffab27 0%,#ff7b18 100%);*/ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffab27', endColorstr='#ff7b18',GradientType=1 );*/ /* IE6-9 fallback on horizontal gradient */
}
.OrangeButton.Large, .OrangeButton.Large:hover {
    padding: 10px 25px 10px 20px;
    font-size: 30px;
}
.OpenMenuButton {
    background: url('/images/buttonrightmenuicon.png') no-repeat 96% center;
    border: solid 2px #ff8019;
    border-right: none;
    border-bottom: none;
    padding: 10px 38px 10px 20px;
    color: #014ab8 !important;
    font-size: 22px;
    text-transform: uppercase;
}


.Marginbottom-20px{
    margin-bottom: -20px;
}


.SuperLargeText {
    font-size: 68px;
}

.GreenUnderlinedTitle {
    color: #014ab8;
    background: url(/images/titleunderline.png) no-repeat center bottom;
    line-height: 68px;
    /*min-width: 265px;*/
}
.GreenUnderlineSeparator {
    /*color: #014ab8;*/
    background: url(/images/titlegreenunderline.png) no-repeat center bottom;
    /*line-height: 68px;*/
    /*min-width: 265px;*/
}

.WhiteBackground{
    background-color: #ffffff;
}
.LightBlueBackground {
    background-color: #f1f6fc;
}
.BlueBackground {
    background-color: #014ab8;
}
.Underline {
    text-decoration: underline !important;
    text-decoration: underline !important;
}
.LightBlueC, .LightBlueC:hover {
    color: #1e5ec0 !important;
}
.LighterBlueC, .LighterBlueC:hover {
    color: #1fa3e0 !important;
}
.LighterBlue2C, .LighterBlue2C:hover {
    color: #a3b2d9 !important;
}
.LighterBlue3C, .LighterBlue3C:hover {
    color: #04a8cb !important;
}
.BlueC, .BlueC:hover {
    color: #0036e5 !important;
}
.DarkBlueC, .DarkBlueC:hover {
    color: #0e4173 !important;
}
.WhiteC, .WhiteC:hover {
    color: #ffffff;
}
.BlackC, .BlackC:hover {
    color: #000000;
}
.DarkGreyC, .DarkGreyC:hover {
    color: #32353a;
}
.GreenC, .GreenC:hover {
    color: #014ab8;
}
.GreyC, .GreyC:hover{
    color: #7e7e7e !important;
}

.UpperCase{
    text-transform: uppercase;
}

.MarginTop-80px{
    margin-top: -80px;
}
.PlayButtonMarginLeft {
    margin-left: -160px;
}
.Width72p {
    width: 72%;
}

.MarginTop15px{
    margin-top: 5px;
}
.MarginLeft0 { margin-left: 0;}
.MarginLeft40px{ margin-left: 40px; }
.MarginTop-10px{margin-top: -10px;}

.PointerCursor{
    cursor: pointer;
}

.ButtonWhite {
    border: 1px solid #ffffff;
    border-bottom: 4px solid #ffffff;
    padding: 15px 25px 5px 25px;
    color: #ffffff;
    display: inline-block !important;
    text-align: center;
    font-family: 'BiryaniBold';
    font-size: 20px;
    cursor: pointer;
}
.ButtonWhite:hover{
    border: 1px solid #ffffff;
    border-bottom: 4px solid #ffffff;
    padding: 15px 25px 5px 25px;
    color: #ffffff;
    display: inline-block !important;
    text-align: center;
    font-family: 'BiryaniBold';
    font-size: 20px;
    cursor: pointer;
}
.ButtonBlue {
    border: 1px solid #014ab8;
    border-bottom: 4px solid #014ab8;
    padding: 15px 25px 5px 25px;
    color: #014ab8;
    display: inline-block !important;
    text-align: center;
    background: transparent;
    font-family: 'BiryaniBold';
    font-size: 20px;
    cursor: pointer;
}
.ButtonBlue:hover{
    border: 1px solid #014ab8;
    border-bottom: 4px solid #014ab8;
    padding: 15px 25px 5px 25px;
    color: #014ab8;
    display: inline-block !important;
    text-align: center;
    background: transparent;
    font-family: 'BiryaniBold';
    font-size: 20px;
    cursor: pointer;
}

.PaddingTop10px{
    padding-top: 10px;
}

.WhiteSpaceNormal {
    white-space: normal;
}

.Mobile580pxAndLess {
    display: none;
}
.NotMobile580pxAndLess {
    display: block;
}
.DisplayForLarge{
    display: block;
}
.DisplayFor1560pxAndLess {
    display: none;
}
.DisplayFor1200pxAndLess {
    display: none;
}

.BlueBackground404 {
    background: url('/images/navigationbluebackground.jpg') no-repeat left top;
    padding-bottom: 15px;
}


/* Custom HTML: *********************************************/
.ImageFrameShadow {
    -webkit-box-shadow: 0px 0px 15px 15px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 0px 15px 15px rgba(0,0,0,0.1);
    box-shadow: 0px 0px 15px 15px rgba(0,0,0,0.1);
}

ul.uk-tab.ManagementTabs li.uk-active a, ul.uk-tab.ManagementTabs li a:hover {
    color: #0392c5 !important;
    border: none;
    font-size: 18px !important;
    line-height: 32px;
}
/*****************************************************/

@media screen and (max-width: 1700px) {
    .MainVideoBackground {
        /*background-size: 100%;*/
        min-height: 630px;
    }
    .NavigationItem {
        font-size: 18px;
    }
    body{
        background-position-y: 1200px;
    }
}
@media screen and (max-width: 1610px) {
    .DisplayForLarge {
        display: none;
    }
    .DisplayFor1560pxAndLess{
        display: block;
    }
}
@media screen and (max-width: 1460px) {
    .HomeSlideContent {
        padding-left: 25px;
        padding-right: 25px;
        height: 500px;
    }
    .HomeSlideContent .OrangeButton{
        margin-top: 10px !important;
    }
    .PageHeader .HeaderImage {
        min-height: 330px;
    }
    .MainVideoTextBottomPadding{
        display: none;
    }
    /*input[type=text], input[type=password], select {
        width: 90%;
    }.HomeHeaderImage
    select {
        width: 98%;
    }*/
    .NavigationItem {
        font-size: 16px;
    }
    .HomeHeaderImage{
        min-height: 730px;
    }
    .HeaderContentBottomSpace{
        margin-bottom: 60px !important;
    }
    .HomepageHeaderContent{
        width: 40%;
    }
    h1.HomeHeaderSlogan {
        font-size: 25px;
        margin-left: 20px !important;
    }
    /*.MainVideoBackground {
        min-height: 900px;
    }*/
    body{
        background-position-y: 750px;
    }
    .HopeAndFutureBackground {
        min-height: 630px;
    }
}

@media screen and (max-width: 1390px) {
    body {
        background-position-y: 680px;
    }
    .LogoMaxWidth {
        max-width: 75%;
    }
}
@media screen and (max-width: 1360px) {
    input[type=text], input[type=password] {
        width: calc(100% - 30px);
    }
    select {
        width: calc(100% - 2px);
    }
    .DesktopNavigationBar{
        display: none;
    }
    .MobileMenuButtonBar, .MobileMenuButtonBar img {
        display: inline-block !important;
    }
}
@media screen and (max-width: 1200px) {
    .ContactFormBackground {
        background-position-x: 10%;
        /*background-position-y: -80px;*/
        padding-top: 80px;
    }
    .HomeHeaderImage {
        min-height: 580px;
    }
    .ContactFormFirstColumn {
        padding-right: 30px !important;
    }
    .DisplayFor1560pxAndLess {
        display: none;
    }
    .DisplayFor1200pxAndLess {
        display: block;
    }
}
@media screen and (max-width: 960px) {
    .Navigation {
        min-height: 80px;
    }
    .HomeHeaderImage {
        min-height: 580px;
        background-size: cover !important;
    }
    .HomeHeaderImage1 {
        background: url('/images/headerbackgroundmobile.jpg') no-repeat;
        background-position-x: 45%;
    }
    .uk-offcanvas-flip .uk-offcanvas-bar{
        width: 340px;
        padding: 0;
    }

    h1.AboutFinallyUnderstandCOM {
        font-size: 1.40rem;
    }
    .PaddinLeftRightLarge {
        padding-left: 20px;
        padding-right: 20px;
    }
    /*select {
        width: 94%;
    }*/
    .HeaderImage {
        background-position-x: 80% !important;
    }
    .SponsorSubscriptionPage {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .homesliderdivitem {
        background-position-x: 40%;
        background-position-y: 40%;
    }
    .footerbluebackground {
        padding-top: 40px;
    }
}
@media screen and (max-width: 710px) {
    .Mobile580pxAndLess {
        display: block;
    }

    .NotMobile580pxAndLess {
        display: none;
    }

    .GianPaulNameMobile {
        max-width: 48%;
    }

    h1.HomeHeaderSloganMobile b {
        font-family: OpenSansLight;
        font-size: 32px;
    }

    h1.HomeHeaderSloganMobile {
        font-family: OpenSansLight;
        font-size: 22px;
    }
}
@media screen and (max-width: 580px) {
    body{
        background-position: 73% 48%;
    }
    .MinimumVideoModalHeight {
        min-height: 380px;
    }
    .TestimonialsBackground {
        min-height: 80px;
        margin-top: 0px;
    }
    .HomeHeaderContent{
        margin-left: 20px !important;
    }

    h1.HomeHeaderSloganMobile b {
        font-family: OpenSansLight;
        font-size: 24px;
    }

    h1.HomeHeaderSloganMobile {
        font-family: OpenSansLight;
        font-size: 18px;
    }
}
@media screen and (max-width: 380px) {
    .GreenUnderlinedTitle {
        line-height: 48px;
        padding-bottom: 15px;
    }
    .PageHeader .HeaderImage {
        min-height: 200px;
    }
    .uk-container.uk-text-center.uk-margin-medium-top{
        margin-top: 20px !important;
    }
}
@media screen and (max-width: 340px) {
    .HomeSlideContent h1{
        font-size: 40px;
    }
}


.uk-accordion-title::before {
    float: left;
    background-color: #014ab8;
    padding: 8px;
    margin-right: 8px;
    border-left: solid 2px #ff8019;
    margin-left: 0px;
    color: #ffffff;
}
.uk-accordion-title {
    border-bottom: solid 1px #c0c0c0;
}
.uk-container{
    max-width: 1520px;
}


.uk-dotnav > * > * {
    background-color: #0037e6;
    height: 28px;
    width: 4px;
    border-radius: 0;
}
.uk-dotnav > .uk-active > * {
    background-color: #809af1;
}
.MobileDotNav li {
    display: inline-block;
}


#overlay {
    position: fixed; /* Sit on top of the page content */
    display: none; /* Hidden by default */
    width: 100%; /* Full width (cover the whole page) */
    height: 100%; /* Full height (cover the whole page) */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5); /* Black background with opacity */
    z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
    cursor: pointer; /* Add a pointer on hover */
}
