:root {
  --brand1: #002d5d;
  --brand2: #ffc20e;
  --green3: #cac6a8;


}

@font-face {
    font-family: 'Gotham';
    src: url('fonts/Gotham-Book.otf') format('opentype');
    font-weight: 400;
}
@font-face {
    font-family: 'Gotham';
    src: url('fonts/Gotham-Medium.otf') format('opentype');
    font-weight: 500;
}
@font-face {
    font-family: 'Gotham';
    src: url('fonts/Gotham-Bold.otf') format('opentype');
    font-weight: 600;
}


html{
    scroll-behavior: smooth;
}
body{
    font-family: 'Gotham', sans-serif;
    font-size: 17px; 
    color: #FFF;
    font-weight: 400;
}



a{-webkit-transition: all 0.32s ease-out; -moz-transition: all 0.32s ease-out; -o-transition: all 0.32s ease-out; -ms-transition:  all 0.32s ease-out; transition: all 0.32s ease-out; text-decoration:none;}
a:hover{color: var(--red); text-decoration: none;}

::placeholder { color: 000; opacity: 1; }
:-ms-input-placeholder { color: 000;}
::-ms-input-placeholder { color: 000;}

/*COMMOM STYLES*/
.ff-mo{font-family: 'Montserrat';}

.fw-bl{font-weight: 700;}
.fw-bo{font-weight: 600;}
.fw-me{font-weight: 500;}
.fw-re{font-weight: 400;}
.fw-li{font-weight: 300;}
.fw-th{font-weight: 200;}

.fs-60{font-size: 60px;}
.fs-50{font-size: 50px;}
.fs-38{font-size: 38px;}
.fs-28{font-size: 28px;}

.fs-24{font-size: 24px;}
.fs-20{font-size: 20px;}
.fs-16{font-size: 16px;}
.fs-12{font-size: 12px;}


.ls-1{letter-spacing: 1px;}
.ls-2{letter-spacing: 2px;}

.lh-2{line-height: 2;}


@media screen and (min-width:768px){
    .mt-md-lg{margin-top: 60px!important;}
    .mb-md-lg{margin-bottom: 60px!important;}

    .mt-md-xl{margin-top: 100px!important;}
    .mb-md-xl{margin-bottom: 100px!important;}
  
}

.bg-grey{background-color: #484c4c!important; }
.bg-brand{background-color: var(--green1);}

.text-brand{color:#da1f31!important;}
.text-black{color:#000!important;}

.btn-brand{background-color: #da1f31; border:none; display: inline-block;  transition: all 0.32s ease-out; color: #FFF; font-weight: bold; font-size: 14px; padding: 15px 25px; letter-spacing: 1.5px; }
.btn-brand:hover{background-color: #484c4c; color: #FFF!important;}



.has-bg{background-position: center; background-size: cover; }


.img-linked{
    -webkit-transition: all 0.32s ease-out;
    -moz-transition: all 0.32s ease-out;
    -o-transition: all 0.32s ease-out;
    -ms-transition:  all 0.32s ease-out;
    transition: all 0.32s ease-out;
}
.img-linked:hover{
    transform: scale(1.1);
    cursor: pointer;
}

.text-linked{color: inherit; color: var(--brand2);}
.text-linked:hover{color: inherit; text-decoration: underline;}




/* Navigation */
#bgWrapper{width:  54px; background-image: url('../images/bg.png'); background-position: left; background-repeat: no-repeat; background-size: cover;}
#navWrapper{background-color: var(--brand1); max-width: 100%; width: 1000px;  }
#contentWraper{width: calc(100% - 1054px); }

 #contentWraper{background-image: url('../images/bg-1.jpg'); background-size: cover; transition: background-image 1s ease-in-out; background-position: left;}

#bgWrapper,
#navWrapper,
#contentWraper{float: left; height: 100%; min-height: 100vh; display: flex; align-items: center; }


#navWrapper .nav-link{color: #000; font-size: 14px; font-weight: 500; letter-spacing: 1px; background-color: #FFF; border-radius: 0; border:7px solid var(--brand2); width: 153px; height: 153px; display: flex; align-items: center; justify-content: center; margin: 9px 0px; transition: all .36s ease-in-out ; box-shadow: 5px 5px 10px rgba(0,0,0,0.3); text-align: center; padding: 9px; color: #231f20; float: left; margin: 9px;}
#navWrapper .nav-link:hover,
#navWrapper .nav-link.active{ background-color: var(--brand2);}

#navWrapper .nav-back{
    width: 100%;
    max-width: 330px;
    height: auto;
    min-height: 63px;
    margin-bottom: 18px;
    cursor: pointer;
    border: none;
}

#contentWraper{align-items: flex-start; justify-content: flex-start; overflow: auto;}
#contentWraper section{width: 100%;}
#contentWraper.has-content{
    width: calc(100% - 1054px);
    min-width: 360px;
}

body.has-page-content #bgWrapper,
body.has-page-content #navWrapper,
body.has-page-content #contentWraper.has-content{
    align-items: flex-start;
}

.pdf-modal{
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(0, 29, 61, 0.88);
}

.pdf-modal.is-open{display: flex;}

body.pdf-modal-open{overflow: hidden;}

.pdf-modal-dialog{
    width: min(1200px, 100%);
    max-height: calc(100vh - 48px);
    background: #fff;
    border: 7px solid var(--brand2);
    box-shadow: 5px 5px 20px rgba(0,0,0,0.35);
    display: flex;
    flex-direction: column;
}

.pdf-modal-header{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 20px;
    background: var(--brand1);
    color: #fff;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.pdf-modal-title{
    margin: 0;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 1px;
    white-space: nowrap;
    flex: 0 1 auto;
    min-width: 0;
}

.pdf-modal-controls{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    flex: 0 1 auto;
    min-width: 0;
}

.pdf-zoom-group,
.pdf-action-group{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.pdf-action-group{
    justify-content: flex-end;
}

.pdf-control-btn{
    min-width: 42px;
    height: 42px;
    padding: 0 14px;
    border: 2px solid var(--brand2);
    background: #fff;
    color: #231f20;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    text-decoration: none;
}

.pdf-control-btn:hover{
    background: var(--brand2);
    color: #231f20;
}

.pdf-zoom-level{
    min-width: 56px;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
}

.pdf-modal-body{
    flex: 1;
    overflow: auto;
    background: #f4f4f4;
    position: relative;
}

.pdf-modal-body.is-pan-enabled{
    overflow: hidden;
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
    touch-action: none;
}

.pdf-modal-body.is-pan-enabled.is-dragging{
    cursor: grabbing;
}

.pdf-viewport{
    width: 100%;
    min-height: 60vh;
    position: relative;
}

.pdf-canvas-wrap{
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 16px;
    min-width: 100%;
    will-change: transform;
}

.pdf-page-placeholder{
    width: 100%;
    min-height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.pdf-page-canvas{
    display: block;
    width: auto;
    height: auto;
    max-width: none;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    background: #fff;
}

.pdf-loading,
.pdf-error{
    color: #231f20;
    text-align: center;
    padding: 40px 20px;
    font-size: 14px;
    letter-spacing: 1px;
}

.pdf-control-btn.pdf-close-btn{
    min-width: 42px;
    padding: 0;
    font-size: 22px;
}

@media screen and (max-width: 991px){
    .pdf-modal-header{
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .pdf-modal-title{
        width: 100%;
    }

    .pdf-modal-controls{
        width: 100%;
        justify-content: flex-start;
        gap: 8px;
    }
}

@media screen and (max-width: 767px){
    .pdf-modal{
        padding: 8px;
        align-items: flex-start;
    }

    .pdf-modal-dialog{
        max-height: calc(100vh - 16px);
        border-width: 5px;
    }

    .pdf-modal-header{
        padding: 10px 12px;
        gap: 6px;
    }

    .pdf-modal-controls{
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 6px;
    }

    .pdf-zoom-group,
    .pdf-action-group{
        width: auto;
        justify-content: center;
        gap: 6px;
    }

    .pdf-control-btn{
        min-width: 36px;
        height: 36px;
        padding: 0 10px;
        font-size: 11px;
    }

    .pdf-zoom-level{
        min-width: 42px;
        font-size: 12px;
    }

    .pdf-viewport{
        min-height: auto;
    }

    .pdf-canvas-wrap{
        padding: 10px;
        gap: 8px;
    }
}

.office-hours strong{
    font-size: 18px;
    letter-spacing: 1px;
}

.img-logo-ng{width: 504x;}
.img-logo-lv{width: 225px;}

@media screen and (max-width: 1199px){
    #bgWrapper{width: 24px;}
    #navWrapper{
        width: calc(100% - 24px);
        max-width: none;
    }
    #contentWraper{
        width: 100%;
        float: none;
        clear: both;
        min-height: 40vh;
    }
    #contentWraper.has-content{
        width: 100%;
        min-width: 0;
    }
}

@media screen and (max-width: 991px){
    #bgWrapper,
    #navWrapper,
    #contentWraper{
        float: none;
        width: 100%;
        max-width: 100%;
        min-height: auto;
        height: auto;
    }

    #bgWrapper{
        display: none;
    }

    #navWrapper{
        align-items: flex-start;
    }

    #navWrapper .container{
        max-width: 100%;
        padding-left: 16px;
        padding-right: 16px;
    }

    #navWrapper .nav-link{
        float: none;
        width: calc(50% - 9px);
        height: auto;
        min-height: 63px;
        margin: 0;
    }

    #navWrapper .nav-items .col-12{
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        justify-content: center;
    }

    #navWrapper .nav-back{
        width: 100%;
        max-width: none;
    }

    #contentWraper{
        min-height: 35vh;
    }

    body.has-page-content #bgWrapper,
    body.has-page-content #navWrapper,
    body.has-page-content #contentWraper.has-content{
        float: none;
        width: 100%;
        max-width: 100%;
    }

    .img-logo-ng{
        max-width: 280px;
    }

    .img-logo-lv{
        max-width: 180px;
    }
}

@media screen and (max-width: 767px){
    body{
        overflow-x: hidden;
    }

    #navWrapper .nav-link{
        width: 100%;
        max-width: 100%;
        min-height: 56px;
        margin: 0;
    }

    #navWrapper .nav-items .col-12{
        gap: 8px;
    }

    #contentWraper{
        min-height: 30vh;
    }

    .office-hours{
        font-size: 14px;
    }
}