@font-face {
    font-family: 'Roboto';
    src: url('../fonts/Roboto-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Roboto-Thin';
    src: url('../fonts/Roboto-Thin.ttf') format('truetype');
}

@font-face {
    font-family: 'Roboto-Light';
    src: url('../fonts/Roboto-Light.ttf') format('truetype');
}

@font-face {
    font-family: 'Roboto-Medium';
    src: url('../fonts/Roboto-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'Roboto-Bold';
    src: url('../Fonts/Roboto-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'Roboto-Black';
    src: url('../Fonts/Roboto-Black.ttf') format('truetype');
}

@font-face {
    font-family: 'fontawesome-webfont';
    src: url('../Fonts/fontawesome-webfont.ttf');
}

html {
    font-family: 'Roboto', sans-serif !important;
    color: black;
}

h2{
    font-family: 'Roboto', sans-serif !important;
    color: black; 
}

p{
    font-family: 'Roboto', sans-serif !important;
    color: black;  
}

.orange-nav{
    color: rgb(255, 87, 34) !important;
}



.uk-modal-body.p-align-justify > p{
    text-align:justify;
    text-indent: 20px;
}

@media (min-width: 1201px) {
    .logo {
        width: 150px;
    }
    footer {
        height: 50px;
    }
    .bgHead {
        background-image: url(../images/headerBG.jpg);
        background-position: 50% 50%;
        height: 600px;
    }
    h1.as-h1-white {
        font-family: 'Roboto-Thin', sans-serif !important;
        font-size: 3rem;
        color: white;
    }
    h1.as-h1-black {
        font-family: 'Roboto-Thin', sans-serif !important;
        font-size: 3rem;
        color: black;
    }
    .padding-header {
        padding-top: 250px !important;
    }

    .app{
        padding-top: 80px !important; 
        width: 200px !important;  
    }
    .uk-button-default {
        background-color: rgba(255, 87, 34, 0.8);
        border: 1px solid rgba(255, 87, 34, 0.8);
        font-family: 'Roboto', sans-serif !important;
        color: white;
        font-size: 20px;
        text-transform: none;
    }

    p.as-p-black {
        font-family: 'Roboto', sans-serif !important;
        font-size: 1.5rem;
        color: black;
    }

    .padding-block-bottom {
        padding-bottom: 90px;
    }

    .padding-block-top {
        padding-top: 90px;
    }

    .bgValue {
        background-image: url(../images/valueBG.jpg);
        background-position: 50% 50%;
        height: 700px;
    }
    
    h2.as-h2-white {
        font-family: 'Roboto-Medium', sans-serif !important;
        font-size: 2.1rem;
        color: white;
    }

    ul.as-p-white>li {
        font-family: 'Roboto', sans-serif !important;
        font-size: 1.5rem;
        color: white;
    }

    .uk-textarea {
        font-family: 'Roboto', sans-serif;
        font-size: 20px !important;
    }
    /* Focus */
    .uk-input:focus,
    .uk-select:focus,
    .uk-textarea:focus {
        outline: none;
        background-color: #fff;
        color: black !important;
        border-color: black !important;
        font-size: 20px !important;
    }
    textarea:-ms-input-placeholder {
        font-family: 'Roboto', sans-serif;
        color: #999 !important;
        font-size: 20px !important;
    }
    textarea::-moz-placeholder {
        font-family: 'Roboto', sans-serif;
        color: #999;
        font-size: 20px !important;
    }
    textarea::-webkit-input-placeholder {
        font-family: 'Roboto', sans-serif;
        color: #999;
        font-size: 20px !important;
    }
}

@media (min-width: 961px) and (max-width: 1200px) {
    .logo {
        width: 150px;
    }
    footer {
        height: 50px;
    }
    .bgHead {
        background-image: url(../images/headerBG.jpg);
        background-position: 50% 50%;
        height: 600px;
    }
    h1.as-h1-white {
        font-family: 'Roboto-Thin', sans-serif !important;
        font-size: 2.5rem;
        color: white;
    }
    h1.as-h1-black {
        font-family: 'Roboto-Thin', sans-serif !important;
        font-size: 2.5rem;
        color: black;
    }
    h2.as-h2-white {
        font-family: 'Roboto-Medium', sans-serif !important;
        font-size: 1.7rem;
        color: white;
    }
    .padding-header {
        padding-top: 250px !important;
    }

    .app{
        padding-top: 80px !important; 
        width: 150px !important;  
    }
    .uk-button-default {
        background-color: rgba(255, 87, 34, 0.8);
        border: 1px solid rgba(255, 87, 34, 0.8);
        font-family: 'Roboto', sans-serif !important;
        color: white;
        font-size: 20px;
        text-transform: none;
    }
    p.as-p-black {
        font-family: 'Roboto', sans-serif !important;
        font-size: 1.2rem;
        color: black;
    }
    .imgValue {
        width: 80px !important;
    }
    .padding-block-bottom {
        padding-bottom: 90px;
    }
    .padding-block-top {
        padding-top: 90px;
    }
    .bgValue {
        background-image: url(../images/valueBG.jpg);
        background-position: 50% 50%;
        height: 700px;
    }
    
    ul.as-p-white>li {
        font-family: 'Roboto', sans-serif !important;
        font-size: 1.4rem;
        color: white;
    }



    .uk-textarea {
        font-family: 'Roboto', sans-serif;
        font-size: 20px !important;
    }
    /* Focus */
    .uk-input:focus,
    .uk-select:focus,
    .uk-textarea:focus {
        outline: none;
        background-color: #fff;
        color: black !important;
        border-color: black !important;
        font-size: 20px !important;
    }
    textarea:-ms-input-placeholder {
        font-family: 'Roboto', sans-serif;
        color: #999 !important;
        font-size: 20px !important;
    }
    textarea::-moz-placeholder {
        font-family: 'Roboto', sans-serif;
        color: #999;
        font-size: 20px !important;
    }
    textarea::-webkit-input-placeholder {
        font-family: 'Roboto', sans-serif;
        color: #999;
        font-size: 20px !important;
    }
}

@media (max-width: 960px) {
    .uk-navbar-nav > li > a,
    .uk-navbar-item,
    .uk-navbar-toggle  {
        height: 50px !important;
    }
    footer {
        font-family: 'RobotoCondensed-Bold', sans-serif;
        color: black !important;
        font-size: 12px !important;
        position: fixed;
        bottom: 0;
        border-top: 1px solid rgb(236, 239, 241) !important;
        max-height: 50px;
        line-height: 20px;
    }

    .logo {
        width: 110px;
    }
    .bgHead {
        background-image: url(../images/headerBG.jpg);
        background-position: 100% 100%;
        height: 500px !important;
    }

    .app{
        padding-top: 50px;
        width: 140px !important;  
    }
    h1.as-h1-white {
        font-family: 'Roboto-Thin', sans-serif !important;
        font-size: 28px;
        color: white;
    }
    h1.as-h1-black {
        font-family: 'Roboto-Thin', sans-serif !important;
        font-size: 28px;
        color: black;
    }
    h2.as-h2-white {
        font-family: 'Roboto-Medium', sans-serif !important;
        font-size:  18px !important;
        color: white;
    }
    .padding-header {
        padding-top: 100px !important;
    }
    .uk-button-default {
        background-color: rgba(255, 87, 34, 0.8);
        border: 1px solid rgba(255, 87, 34, 0.8);
        font-family: 'Roboto', sans-serif !important;
        color: white;
        font-size: 16px;
        text-transform: none;
        line-height: 43px !important;
    }
    p.as-p-black {
        font-family: 'Roboto', sans-serif !important;
        font-size: 16px;
        color: black;
    }
    .imgValue {
        width: 60px !important;
    }
    .padding-block-bottom {
        padding-bottom: 60px;
    }
    .padding-block-top {
        padding-top: 60px;
    }
    .bgValue {
        background-image: url(../images/valueBG.jpg);
        min-height: 600px;
        max-height: 950px;
    }

    h2.as-h2-white {
        font-family: 'Roboto-TMedium', sans-serif !important;
        font-size: 24px;
        color: white;
    }

    ul.as-p-white>li {
        font-family: 'Roboto', sans-serif !important;
        font-size: 16px;
        color: white;
    }

    .uk-form-large {
        font-size: 16px;
    }
    .uk-form-large:not(textarea):not([multiple]):not([size]) {
        height: 45px;
        padding-left: 10px;
        padding-right: 10px;
    }
    .uk-form-large:not(select):not(input):not(textarea) {
        line-height: 43px;
    }
    .uk-textarea {
        font-family: 'Roboto', sans-serif;
        font-size: 16px !important;
    }
    .uk-input:focus,
    .uk-select:focus,
    .uk-textarea:focus {
        outline: none;
        background-color: #fff;
        color: black !important;
        border-color: black !important;
        font-size: 16px !important;
    }
    textarea:-ms-input-placeholder {
        font-family: 'Roboto', sans-serif;
        color: #999 !important;
        font-size: 16px !important;
    }
    textarea::-moz-placeholder {
        font-family: 'Roboto', sans-serif;
        color: #999;
        font-size: 16px !important;
    }
    textarea::-webkit-input-placeholder {
        font-family: 'Roboto', sans-serif;
        color: #999;
        font-size: 16px !important;
    }

    .uk-offcanvas-bar{
        background-color: #373A3C;
    }
}


/*padding*/

.as-b-5 {
    padding-bottom: 50px;
}

.as-font-roboto-size-20 {
    font-family: 'Roboto', sans-serif !important;
    font-size: 16px;
}

nav.uk-navbar {
    background-color: #fff !important;
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.2)
}

ul.uk-navbar-nav>li>a {
    font-family: 'Roboto', sans-serif !important;
    text-transform: none;
    font-size: 18px;
    color: black;
}

ul.uk-navbar-nav>li>a:hover {
    text-decoration: none;
    color: rgb(255, 87, 34);
    text-decoration: underline;
}

.uk-navbar-item {
    font-family: 'Roboto', sans-serif !important;
    text-transform: none;
    font-size: 18px;
    color: black;
}

.uk-navbar-item:hover {
    text-decoration: none;
    color: rgb(255, 87, 34);
}

ul.uk-navbar-nav>li.uk-active>a {
    text-decoration: none;
    color: rgb(255, 87, 34) !important;
    text-decoration: underline;
    text-decoration-color: rgb(255, 87, 34);
}


/*Offcanvas*/

ul.uk-nav.as-offcanvas>li>a {
    font-family: 'Roboto', sans-serif !important;
    font-size: 16px;
    line-height: 40px;
}

.uk-button-default:hover,
.uk-button-default:focus {
    background-color: rgba(255, 87, 34, 0.9);
    border: 1px solid rgba(255, 87, 34, 0.9);
    color: white;
}

.uk-offcanvas-close{
    top: 10px;
    right: 10px;
    padding: 5px;
}

/* OnClick + Active */

.uk-button-default:active,
.uk-button-default.uk-active {
    background-color: rgba(255, 87, 34, 1);
    border: 1px solid rgba(255, 87, 34, 1);
    color: white;
}

footer {
    font-family: 'RobotoCondensed-Bold', sans-serif;
    color: black !important;
    font-size: 18px;
    position: fixed;
    bottom: 0;
    border-top: 1px solid rgb(236, 239, 241) !important;
    max-height: 50px;
    line-height: 20px;
}

footer.uk-container {
    padding: 15px 10px 15px 10px;
    background-color: #fff;
}

.error-border {
    border: 1px solid red;
}

.massage-error {
    text-align: left !important;
    margin-top: -15px !important;
    margin-bottom: -15px !important;
    color: red;
}