@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400&display=swap');

body, html, input, select, textarea, h1, h2, h3, h4, h5, h6,
.ui.button, .ui.header, .ui.menu, .ui.text.container, .ui.input > input, .ui.list > .item .header,
.ui.steps .step .title, .ui.message .header, .ui.form .field input, .ui.form .fields input,
.ui.form .field textarea, .ui.form .fields textarea, .ui.form .field label, .ui.form .fields label,
.ui.cards > .card > .content > .header, .ui.card > .content > .header, .ui.items > .item > .content > .header,
.ui.statistics .statistic > .value, .ui.statistic > .value, .ui.statistics .statistic > .label, .ui.statistic > .label,
.ui.accordion .title:not(.ui), .ui.modal > .header, .ui.popup > .header, .ui.search > .results .result .title,
.ui.search > .results > .message .header, .ui.category.search > .results .category > .name,
.ui, .ui *, .ui > *, .ui > * > *, .ui > * > * > *, .ui > * > * > * > *, .swal2-modal, input, textarea, select {
    font-family: 'Poppins', -apple-system, system-ui, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, 'Segoe UI', Roboto, 'Fira Sans', Ubuntu, Oxygen, 'Oxygen Sans', Cantarell, 'Droid Sans','Lucida Grande', Helvetica, Arial, sans-serif;
}

h1, h2, h3, h4, h5 { font-weight: 400; }
header, footer, section { font-size:16px; color:#333; }

.content-body h1, .content-body h2,
.titleColor { color:#003366; }

a, a:link, a:visited { color: #003366; }
a:hover, a:focus { color: #CC0000; }

a, p { font-size:18px; }
.num { font-family: 'Rubik'; }

body { background-repeat: no-repeat; background-size:contain; background-position: top center; background-image: url('/assets/img/pagetop.png'); }
header { border-top: 7px solid #000; padding: 5px 0 5px 0; border-bottom: 1px solid rgba(0,0,0,0.10); }
header.scroll {
  box-shadow: 2px 5px 10px rgba(0,0,0,0.05);
  border-bottom: 1px solid rgba(0,0,0,0.10);
  background: rgba(255,255,255, 0.95);
  transition: background 0.5s linear;
    -moz-transition: background 0.5s linear;
    -webkit-transition: background 0.5s linear;
    -o-transition: background 0.5s linear;
    -ms-transition: background 0.5s linear;
}
header ul.popMenu li a { color:#003366 !important; text-transform: uppercase; font-size:15px !important; font-weight: 600 !important; white-space: nowrap; }
header ul.popMenu li a:hover { color: #CD0200 !important; }
header ul.headSubMenu li a { color:#0E2A3C; text-transform: uppercase; font-size:15px !important; white-space: nowrap; }
header.scroll ul.popMenu li a { color:#0E2A3C; }

.headMenu { list-style: none; padding: 0; margin: 0; display: inline-block; }
.headMenu li { float: left; padding: 0 15px; }
.headMenu li:first-child { padding-left: 0; }
.headMenu li:last-child { padding-right: 0; }
.headMenu li a { font-size: 15px !important; font-weight: 600 !important; text-transform: uppercase; color:#003366  !important; }
.headMenu li a:hover { color:#FF9900 !important; }
.headMenu:after { clear: both; }
.headGrid span.divider { margin-left: 10px; margin-right: 10px; height: 100%; border-left: 1px solid #222; border-right: 1px solid #444; }
.headGrid .linkIcon { cursor: pointer; display: inline-flex; vertical-align: middle; justify-content: center; align-items: center; height: 36px; margin: 0 10px; color:#003366; }
.headGrid .linkIcon:hover { color:#FF9900; }
.headGrid .linkMobile { display: none; cursor: pointer; }
.headGrid .userAvatar { border: 2px solid #FFF; }
ul.popMenu li a, ul.popMenu li a:visited { color: #CCC; font-size: 15px !important; letter-spacing: 1px; font-weight: 500 !important; }
ul.popMenu li a:hover { color: #24BAEF; }
#userInfo h3, #userInfo h5, #userInfo h2 { color: #161B22; }
.inputSearch > input,
.mobileSearch > input { border-top-left-radius:20px !important; border-bottom-left-radius:20px !important; border-top-right-radius:20px !important; border-bottom-right-radius:20px !important; border-color:#CCC !important; }
.mobileSearch { display: none !important; }
.sidebar a { color:#CCC; }
.sidebar a:hover { color:red; }

footer { background-color: #111111; color: #DDD; background-repeat: no-repeat; background-size:cover; background-position: top center; background-image: url('/assets/img/pagebottom.png'); }
footer .title { font-size: 16px; font-weight: 500; color:#FFF; margin-bottom: 20px; letter-spacing: 0.5px; }
footer ul { list-style: none; margin: 0; padding: 0; width: 100%; }
footer ul li a { display: block; padding: 8px 0; letter-spacing: 0.5px; font-size: 14px; font-weight: 300; color: #99CCFF !important; }
footer ul li a:hover { color: #FFF !important; }
footer a { font-size: 14px; font-weight: 300; color: #99CCFF !important; }
footer a:hover { color:#FFF !important; }
footer .seperator { padding: 0 15px; font-weight: 300; }
footer .social i { font-size: 22px; padding: 0 10px; }
footer .social i:hover { color:#FFF; }
footer .social i:first{ padding-left: 0; }
footer .social i:last { padding-right: 0; }

.logoHead { max-height: 82px; }
.logoFoot { max-height: 150px; }
.logoSide { max-height: 150px; }

section { height: auto; min-height: 99vh; margin-top: 130px; }

.patternBlack { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.60); z-index: 0; }
.goal .text-title { font-size: 36px !important; font-weight: 700 !important; color: #003366; }
.text-image { width: 100%; }

.homeSlide { position: relative; width: 100%; height: auto; }
.homeSlide img { width: 100%; }
.swiper-button-next, .swiper-button-prev { color: #EAEAEA; text-shadow:0 3px 5px rgba(0, 0, 0, 0.75); }
.swiper-button-next:hover, .swiper-button-prev:hover { color:#FFF; text-shadow:0 3px 5px rgba(0, 0, 0, 0.95); }
.swiper-pagination { position: relative; z-index: 99; margin-top: 10px; text-align: center; height:25px !important; display: block !important; }
.swiper-pagination-bullet { width: 15px; height: 3px; display: inline-block; border-radius: 0%; cursor: pointer; }
.swiper-pagination-bullet-active { background: #CC0000; }

.slideBottom {
    position: relative;
    text-align: center; border:1px solid #EAEAEA; border-radius: 3%; padding: 20px;
    box-shadow: rgba(100, 100, 111, 0.05) 0px 7px 7px 0px; transition: box-shadow .3s ease-out; min-height: 320px !important;
}
.slideBottom .fad { font-size: 72px; color:#163D66 !important; }
.slideBottom h1, .slideBottom .text-title { font-size: 22px; font-weight: 700 !important; color: #333; }
.slideBottom p, .slideBottom .text-body { font-size: 16px; }
.slideBottom:hover .text-title { color:#FFF; }
.slideBottom:hover {
    box-shadow: rgba(100, 100, 111, 0.20) 0px 7px 30px 0px; background-color: #FFF; border-color: #FFF; cursor:pointer;
    background-color: #FF9900;
    transition: background-color 0.3s linear;
      -moz-transition: background-color 0.3s linear;
      -webkit-transition: background-color 0.3s linear;
      -o-transition: background-color 0.3s linear;
      -ms-transition: background-color 0.3s linear;
}
.slideBottom:hover .fad, .slideBottom:hover p {
    color: #FFF !important;
    transition: color 0.5s linear;
      -moz-transition: color 0.3s linear;
      -webkit-transition: color 0.3s linear;
      -o-transition: color 0.3s linear;
      -ms-transition: color 0.3s linear;
}

.content-top, .content-top .ui.grid { min-height: 190px; height: auto; }
.content-top .title { font-size: 52px; line-height: 55px; font-weight: 300; color:#003366 !important; text-shadow: none; text-transform: uppercase !important; padding: 0 !important; }
.content-top .spot { font-size: 24px; line-height: 30px; font-weight:300; padding-bottom: 30px; text-shadow: none; color:#000; }

.pageTitle { position: relative; font-size: 42px; font-weight: 700; color: #003366; text-align: center; margin-top: 90px; margin-bottom: 90px; }
.jarallax-layer .title { font-size: 42px; line-height: 60px; font-weight: 700; margin-bottom: 30px;}
.jarallax-layer .spot { font-style: normal; color: #FFF; margin-top: 0; font-size: 36px; line-height: 42px; font-weight: 300; }

.eventItem { position: relative; width: 100%; max-width: 420px; }
.eventItem .image { position: relative; width: 100%; height: 180px; background-repeat: no-repeat; background-position: center center; background-size: cover; background-color: #181818; padding: 3px; border:1px solid #EAEAEA; }
.eventItem .content { position: relative; width: 100%; height: 260px; }
.eventItem .title { display: block; font-weight: 600; white-space: nowrap !important; text-overflow: ellipsis !important; overflow: hidden; margin:10px 0; }
.eventItem .info { color: #999 !important; font-size:12px; line-height:17px; padding:10px 0 5px; }
.eventItem .short, .eventItem .short p { font-size: 15px; color: #AAA; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }

.blogItemBig { position: relative; width: 100%; min-height: 540px; background-repeat: no-repeat; background-position: center center; background-size: cover; background-color: #181818; background-image: url(/assets/img/lazy.png); }
.blogItemSmall { position: relative; width: 100%; min-height: 260px; background-repeat: no-repeat; background-position: center center; background-size: cover; background-color: #181818; background-image: url(/assets/img/lazy.png); margin-bottom:20px;}
.blogItemBig .title,
.blogItemSmall .title { position: absolute; left: 0; bottom: 0; width: 100%; padding: 0px 20px 30px 20px; background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); color:#FFF; }
.blogItemSmall .spot { font-size: 16px; color: #CCC; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }

.content-body .title { position: relative; font-size: 42px; font-weight: 300; }
.content-body .info { color: #999 !important; font-size:12px; line-height:17px; padding:10px 0 5px; }
.content-body img { width: 100%; }
.content-body .spot { position: relative; font-size: 24px; font-weight: 300; font-style: italic; margin-bottom: 30px; }
.content-body ul li { padding-bottom: 15px; letter-spacing: 0.5px; }
.content-body .img-left { float:left !important; padding:0 20px 20px 0; }
.content-body .img-right { float:right !important; padding:0 0 20px 20px; }

@media (max-width: 991px) {

    .headGrid .headLink { display: none; }
    .headGrid .linkMobile { display: inline-block; }

}