@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@200;300;400;600;700;900&display=swap');

/*@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800&display=swap');*/

/*=== General Variables ===*/
:root {
    --color1: #ffa300;
    --color2: #41a1b9;
    --color3: #808284;
    --color4: #0f0834;
    --color5: #0a0521;
    --color6: #ff76d5;
    --color7: #1ad688;
    --color8: #ffc600;
    --color9: #c40172;
    --color10: #990fff;
    --color11: #ff7500;
    --color12: #00fdfe;
    --color13: #55a61d;
    --color14: #e90133;
    --color15: #02728e;
    --color16: #1ec8bf;
    --color17: #ff4747;
    --color18: #ffe27a;
    --color19: #1f5abc;
    --color20: #d2eaff;
    --transition: all 0.2s cubic-bezier(0.19, 0.68, 0.49, 1.21);
    --transition2: all .3s linear;
    --round: 50%;
    --curve: 3px;
    --full: 100%;
    --font-family2: 'Source Sans Pro', sans-serif;
}

.silver-card {
    background: #d2d2d2;
    color: white;
}

.gold-card {
    background: var(--color1);
    color: white;
}

.platinum-card {
    background: var(--color2);
    color: white !important;
}

.platinum-card h2.text-primary {
    color: #55479f;
}

.bg-color1 {
    background-color: var(--color1) !important;
}

.bg-color2 {
    background-color: var(--color2);
}

.bg-color3 {
    background-color: var(--color3);
}

.bg-color4 {
    background-color: var(--color4);
}

.bg-color5 {
    background-color: var(--color5);
}

.bg-color6 {
    background-color: var(--color6);
}

.bg-color7 {
    background-color: var(--color7);
}

.bg-color8 {
    background-color: var(--color8);
}

.bg-color9 {
    background-color: var(--color9);
}

.bg-color10 {
    background-color: var(--color10);
}

.bg-color11 {
    background-color: var(--color11);
}

.bg-color12 {
    background-color: var(--color12);
}

.bg-color13 {
    background-color: var(--color13);
}

.bg-color14 {
    background-color: var(--color14);
}

.bg-color15 {
    background-color: var(--color15);
}

.bg-color16 {
    background-color: var(--color16);
}

.bg-color17 {
    background-color: var(--color17);
}

.bg-color18 {
    background-color: var(--color18);
}

.bg-color19 {
    background-color: var(--color19);
}

.bg-color20 {
    background-color: var(--color20);
}

.text-color1 {
    color: var(--color1);
}

.text-color2 {
    color: var(--color2);
}

.text-color3 {
    color: var(--color3);
}

.text-color4 {
    color: var(--color4);
}

.text-color5 {
    color: var(--color5);
}

.text-color6 {
    color: var(--color6);
}

.text-color7 {
    color: var(--color7);
}

.text-color8 {
    color: var(--color8);
}

.text-color9 {
    color: var(--color9);
}

.text-color10 {
    color: var(--color10);
}

.text-color11 {
    color: var(--color11);
}

.text-color12 {
    color: var(--color12);
}

.text-color13 {
    color: var(--color13);
}

.text-color14 {
    color: var(--color14);
}

.text-color15 {
    color: var(--color15);
}

.text-color16 {
    color: var(--color16);
}

.text-color17 {
    color: var(--color17);
}

.text-color18 {
    color: var(--color18);
}

.text-color19 {
    color: var(--color19);
}

.text-color20 {
    color: var(--color20);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 800;
    color: black;
}

body {
    padding-top: 0;
    font-size: 14px;
    font-weight: 400;
    color: #333;
    font-family: 'Source Sans Pro', sans-serif;
    /* font-family: 'Montserrat', sans-serif;*/
    overflow-x: hidden;
}

.owl-nav {
    display: none !important;
}

.joinlive {
    position: fixed;
    right: 0px;
    top: 26%;
    width: 70px;
    text-decoration: none;
    color: white !important;
    font-size: 10px;
    text-align: center;
    text-transform: uppercase;
    font-weight: 600;
    border: 1px solid #e6e6e6;
    border-radius: 6px 0 0 6px;
    background: var(--color2);
    z-index: 99;
    padding: 50px 5px 20px;
    line-height: 1.2;
}

.joinlive:hover,
.joinlive:focus {
    color: white;
    background: var(--color1);
    text-decoration: none;
    border-color: var(--color1);
}

.joinlive button {
    position: absolute;
    width: 15px;
    height: 15px;
    background-color: white;
    margin: 0;
    border: 0;
    border-radius: 50%;
    padding: 0;
    outline: 0;
    display: inline;
    left: 25px;
    top: 20px;
}

.joinlive button:after {
    content: "";
    width: 10px;
    height: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    border: 3px solid white;
    border-radius: 50%;
    -webkit-animation: beacon 2s infinite linear;
    animation: beacon 2s infinite linear;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}

@-webkit-keyframes beacon {
    0% {
        width: 0;
        height: 0;
        opacity: 1;
    }

    25% {
        width: 15px;
        height: 15px;
        opacity: 0.7;
    }

    50% {
        width: 25px;
        height: 25px;
    }

    75% {
        width: 35px;
        height: 35px;
        opacity: 0.5;
    }

    100% {
        width: 50px;
        height: 50px;
        opacity: 0;
    }

}

@keyframes beacon {
    0% {
        width: 0;
        height: 0;
        opacity: 1;
    }

    25% {
        width: 15px;
        height: 15px;
        opacity: 0.7;
    }

    50% {
        width: 25px;
        height: 25px;
    }

    75% {
        width: 35px;
        height: 35px;
        opacity: 0.5;
    }

    100% {
        width: 50px;
        height: 50px;
        opacity: 0;
    }

}

.dot {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
    top: -5px;
}

.dot:before {
    content: " ";
    position: absolute;
    z-index: 2;
    left: 0;
    top: 0;
    width: 10px;
    height: 10px;
    background-color: green;
    border-radius: 50%;
}

.dot:after {
    content: " ";
    position: absolute;
    z-index: 1;
    left: 0;
    width: 10px;
    height: 10px;
    background-color: green;
    border-radius: 50%;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3) inset;
    -webkit-animation-name: "ripple";
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: ease;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
}

@keyframes ripple {
    0% {
        left: 5px;
        top: 5px;
        opcity: 75;
        width: 0;
        height: 0;
    }

    100% {
        left: -20px;
        top: -20px;
        opacity: 0;
        width: 50px;
        height: 50px;
    }

}

/*===== About Style 1 =====*/
.about-img {
    position: relative;
    padding-left: 1.875rem;
    padding-bottom: 1.875rem;
}

.about-img:before {
    content: "";
    position: absolute;
    background-image: url(../images/patter-bg2.png);
    height: 22.5rem;
    width: 33.125rem;
    bottom: 0;
    left: 0;
}

.about-img-caro .slick-dots {
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    width: 0.625rem;
    position: absolute;
    right: -2.5rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.about-img-caro .slick-dots li {
    width: 100%;
    margin: 5px 0;
    line-height: initial;
    height: 0.625rem;
}

.about-img-caro .slick-dots li button {
    color: transparent;
    width: 100%;
    padding: 0;
    height: 0.625rem;
}

.about-img-caro .slick-dots li.slick-active,
.about-img-caro .slick-dots li.slick-active button {
    height: 2.625rem;
}

.about-desc>p+.about-info-wrap {
    margin-top: 0.625rem;
}

.about-info {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    border-bottom: 1px solid #e9e9e9;
    padding-bottom: 0.75rem;
    margin-top: 2.1875rem;
}

.about-info>i {
    font-size: 2.8125rem;
    line-height: 3.4375rem;
}

.about-info>i+.about-info-inner {
    padding-left: 0.9375rem;
}

.about-info-inner>span {
    color: #2b2959;
    font-size: 1.125rem;
}

.about-info-inner>span a {
    text-decoration: none;
    color: black;
    font-size: 1rem;
}

.about-info-inner>p {
    text-transform: uppercase;
    color: #2b2959;
    font-size: 1.25rem;
    font-weight: 600;
}

#ytbg {
    height: 400px;
    width: 100%;
}

.video-responsive {
    background: url(https://www.pite.my/assets/images/resized-images/8.jpg) no-repeat;
    position: relative;
    height: 450px;
    overflow: hidden;
    background-size: cover;
}

.with-errors {
    font-size: 12px;
    color: red;
}

.register-btn {
    background: linear-gradient(45deg, #ff7100, red);
    padding: 0.8em 2em 0.4em;
    transition: all ease-in-out 0.22s;
}

.register-btn:hover,
.register-btn:focus {
    background: linear-gradient(45deg, red, #ff7100);
    padding: 0.5em 2em;
    color: white;
    transition: all ease-in-out 0.22s;
}

.nav-tabs .nav-link {
    margin-bottom: -1px;
    background: 0 0;
    border: none;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
    font-weight: bold;
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    background-color: #ffa30000;
    border-bottom: 4px solid var(--color1) !important;
    border-top: 0;
    border-right: 0;
    border-left: 0;
    font-weight: bold;

}

.list-dt dt,
.list-dt dd {
    border-bottom: 1px solid #ccc;
    padding: 10px 5px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    min-height: 31px;
    margin-bottom: 0;
}

@media (min-width:768px) {
    .gallery img {
        height: 160px;
        margin: 5px auto;
    }

    .dl-horizontal dt {
        float: left;
        width: 109px;
        overflow: hidden;
        clear: left;
        text-align: right;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dl-horizontal dd {
        margin-left: 125px;
    }

}

.slider img {

    /*   max-height: 650px !important;*/
    width: 100%;
}

.list-dt dt .fa {
    background: #f1f1f1;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    margin-right: 7px;
    float: left;
    text-align: center;
    line-height: 20px;
    font-size: 10px;
}

.top {
    color: #ffffff;
    position: fixed;
    right: 30px;
    top: 30%;
    /*transform: rotate(-90deg);*/
    z-index: 99;
    width: 30px;
    bottom: 10px;
}

.error {
    font-size: 11px;
    color: red;
    padding-left: 10px;
}

label.error {
    display: none;
}

.dark {
    display: none;
}

#nav.affix .dark {
    display: block;
}

#nav.affix .light {
    display: none;
}

.top ul {
    margin: 0;
}

.top ul li {
    margin: 5px;
    padding: 0;
    list-style: none;
    transform: rotate(-90deg);
    min-height: 120px;
}

.top ul li a {
    border: 1px solid #ccc;
    display: block;
    color: #fff;
    background: var(--color1);
    border-radius: 15px 15px 0 0;
    text-decoration: none;
    padding: 10px 5px;
    width: 120px;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 700;
    text-transform: uppercase;
    box-shadow: 0 -5px 5px #00000040;
}

.top ul li a:hover,
.top ul li a:focus {
    color: #ffffff;
    background: #000;
}

/*.top ul li:last-child a {
border-right: 1px solid #1b2b48;
}*/
.why-exhibit {
    background: #e8e8e8;
}

#accordionExample .card-header,
#accordionExample1 .card-header {
    border: none;
    padding: 0;
}

#accordionExample .btn-link,
#accordionExample1 .btn-link {
    display: block;
    width: 100%;
    text-align: left;
    position: relative;
    color: var(--color1);
    text-decoration: none;
    outline: none;
    box-shadow: none;
    font-weight: 700;
    padding: 10px 1rem;
    background: #4b4b4b;
}

#accordionExample .btn-link .fa,
#accordionExample1 .btn-link .fa {
    position: absolute;
    right: 10px;
    top: 40%;
}

#particle-canvas {
    width: 100%;
    height: 100%;
    min-height: 600px;
    position: fixed !important;
}

.coundown-bg {
    background: rgba(2, 17, 36, 0.82);
    padding: 0px 0;
}

.countdown {
    text-transform: uppercase;
    padding: 0 0 20px;
    /*background: rgba(0, 0, 0, 0.43);*/
    display: inline-block;
    margin-top: 0;
}

.countdown>div {
    display: inline-block;
    margin: 0 30px;
    position: relative;
}

/*.countdown>div:first-child {color: #ed1539; } .countdown>div:nth-child(2) {color: #fec006; } .countdown>div:nth-child(3) {color: purple; } .countdown>div:nth-child(4) {color: white; }*/
.countdown>div>span {
    display: block;
    text-align: center;
    margin: 5px 0 0;
    position: relative;
}

.countdown-container {
    margin: 0 3px;
}

.countdown-container .countdown-heading {
    font-size: 14px;
    margin: 3px;
}

.countdown-container .countdown-value {
    font-size: 4em;
    padding: 10px 0 0;
    font-weight: 900;
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4);
    border-radius: 5px;
}

.highlights {
    position: absolute;
    z-index: 9;
    transform: rotate(-90deg);
    right: 0;
    top: 43%;
    left: 84%;
    background: var(--color1);
    padding: 5px 15px;
    height: auto;
    white-space: nowrap;
    width: 200px;
    border-radius: 4px;
    font-weight: 700;
    color: white;
    text-transform: uppercase;
    text-align: center;
    font-size: 15px;
}

}

header .item {
    height: 400px;
    position: relative;
}

header .item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

header .item .cover {
    padding: 15px 0;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.14);
    display: flex;
    align-items: center;
}

header .item .cover .header-content {
    position: relative;
    padding: 56px;
    overflow: hidden;
    display: none;
}

header .item .cover .header-content .line {
    content: "";
    display: inline-block;
    width: 100%;
    height: 80%;
    left: 20px;
    top: 10%;
    position: absolute;
    border: 9px solid #fff;
    -webkit-clip-path: polygon(0 0, 60% 0, 36% 100%, 0 100%);
    clip-path: polygon(0 0, 60% 0, 36% 100%, 0 100%);
}

header .item .cover .header-content h2 {
    font-weight: 300;
    font-size: 35px;
    color: #fff;
}

header .item .cover .header-content h1 {
    font-size: 56px;
    font-weight: 600;
    margin: 5px 0 20px;
    word-spacing: 3px;
    color: #fff;
}

header .item .cover .header-content h4 {
    font-size: 24px;
    font-weight: 300;
    line-height: 36px;
    color: #fff;
}

header .owl-item.active h1 {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-name: fadeInDown;
    animation-delay: 0.3s;
}

header .owl-item.active h2 {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-name: fadeInDown;
    animation-delay: 0.3s;
}

header .owl-item.active h4 {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-name: fadeInUp;
    animation-delay: 0.3s;
}

header .owl-item.active .line {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-name: fadeInLeft;
    animation-delay: 0.3s;
}

header .owl-nav .owl-prev {
    position: absolute;
    left: 15px;
    top: 43%;
    opacity: 0;
    -webkit-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
    background: rgba(0, 0, 0, 0.5) !important;
    width: 40px;
    cursor: pointer;
    height: 40px;
    position: absolute;
    display: block;
    z-index: 1000;
    border-radius: 0;
}

header .owl-nav .owl-prev span {
    font-size: 1.6875rem;
    color: #fff;
}

header .owl-nav .owl-prev:focus {
    outline: 0;
}

header .owl-nav .owl-prev:hover {
    background: #000 !important;
}

header .owl-nav .owl-next {
    position: absolute;
    right: 15px;
    top: 43%;
    opacity: 0;
    -webkit-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
    background: rgba(0, 0, 0, 0.5) !important;
    width: 40px;
    cursor: pointer;
    height: 40px;
    position: absolute;
    display: block;
    z-index: 1000;
    border-radius: 0;
}

header .owl-nav .owl-next span {
    font-size: 1.6875rem;
    color: #fff;
}

header .owl-nav .owl-next:focus {
    outline: 0;
}

header .owl-nav .owl-next:hover {
    background: #000 !important;
}

header:hover .owl-prev {
    left: 0px;
    opacity: 1;
}

header:hover .owl-next {
    right: 0px;
    opacity: 1;
}

.grid {
    position: relative;
    margin: 0 auto;
    padding: 1em 0 4em;
    max-width: 100%;
    list-style: none;
    text-align: center;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}

/* Common style */
.grid figure {
    position: relative;
    float: left;
    overflow: hidden;
    margin: 10px 1%;
    min-width: 320px;
    max-width: 480px;
    max-height: 360px;
    width: 48%;
    background: #3085a3;
    text-align: center;
    cursor: pointer;
}

.grid1 figure {
    position: relative;
    float: left;
    overflow: hidden;
    margin: 10px 1%;
    min-width: 320px;
    max-width: 480px;
    max-height: 260px;
    width: 31%;
    background: #3085a3;
    text-align: center;
    cursor: pointer;
}

.grid figure img {
    position: relative;
    display: block;
    min-height: 100%;
    max-width: 100%;
    opacity: 0.8;
}

.grid figure figcaption {
    padding: 2em;
    color: #fff;
    text-transform: uppercase;
    font-size: 1.25em;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
    pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption>a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.connectivity img {
    max-height: 200px;
    display: block;
    margin: 0 auto;
}

/* Anchor will cover the whole item by default */

/* For some effects it will show as a button */
.grid figure figcaption>a {
    z-index: 99;
    text-indent: 200%;
    white-space: nowrap;
    font-size: 0;
    opacity: 0;
}

.grid figure h2 {
    word-spacing: -0.15em;
    font-weight: 300;
}

.grid figure h2 span {
    font-weight: 800;
}

.grid figure h2,
.grid figure p {
    margin: 0;
}

.grid figure p {
    letter-spacing: 0px;
    font-size: 68.5%;
}

/*---------------*/

/***** Roxy *****/

/*---------------*/

figure.effect-roxy {
    background: #000;
}

figure.effect-roxy img {
    max-width: none;
    width: -webkit-calc(100% + 60px);
    width: calc(100% + 60px);
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: translate3d(-50px, 0, 0);
    transform: translate3d(-50px, 0, 0);
}

figure.effect-roxy figcaption::before {
    position: absolute;
    top: 20px;
    right: 20px;
    bottom: 20px;
    left: 20px;
    border: 1px solid #fff;
    content: '';
    opacity: 0;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
}

.mfp-hide {
    display: none !important;
}

.mfp-close-btn-in .mfp-close {
    color: #fff;
}

figure.effect-roxy figcaption {
    padding: 2em;
    text-align: left;
}

figure.effect-roxy h2 {
    padding: 2px 0 10px 0;
    font-size: 2vw;
    color: white;
}

figure.effect-roxy p {
    opacity: 0;
    text-transform: none;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
}

figure.effect-roxy:hover img {
    opacity: 0.4;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

figure.effect-roxy:hover figcaption::before,
figure.effect-roxy:hover p {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

/*---------------*/

/* #content {position: absolute; z-index: 99; left: 0; right: 0; height: 100%; top: 0; background: rgba(35, 64, 68, 0.58); } */

.slider-logo img {
    padding: 0 8% 20px;
}

#particle-canvas:after {
    content: '';
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    height: 100%;
    opacity: 0.6;
    top: 0;
    /*background: #505cfd; background: linear-gradient(to left, #00dbde, #505cfd); */
}

/*#particle-canvas:after {content: ''; position: absolute; z-index: 1; left: 45%; right: 30%; height: 100%; top: 0; background: rgba(0, 0, 0, 0.58); transform: skewX(-25deg); } #particle-canvas:before {content: ''; position: absolute; z-index: 2; right: 45%; left: 30%; height: 100%; top: 0; background: rgba(0, 0, 0, 0.58); transform: skewX(25deg); } */

/* -----Menu Style---------- */

.logo {
    position: relative;
    z-index: 123;
    padding: 0;
    float: left;
    margin-right: 15px;
}

#cssmenu ul {
    float: right;
}

#cssmenu {
    /*border-top: 1px solid #a2a2a2;
border-bottom: 1px solid #a2a2a2;*/
    background: #ff9800;
}

#cssmenu,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #head-mobile {
    list-style: none;
    line-height: 1;
    display: block;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 0;
}

#cssmenu:after,
#cssmenu>ul:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0
}

#cssmenu #head-mobile {
    display: none
}

/* #cssmenu {background: #00a65a } */
#cssmenu>ul>li {
    float: none;
    display: inline-block;
}

#cssmenu>ul>li>a {
    padding: 0.6em 10px;
    text-decoration: none;
    color: white;
    /*text-transform: uppercase;*/
    font-weight: 500;
    position: relative;
    font-size: 16px;
    /*   background: #ffffffc4;
border-radius: 24px;*/
    margin: 0 1px;
}

/*#cssmenu>ul>li>a::after {
position: absolute;
background: rgba(255, 255, 255, .8);
display: block;
height: 1px;
width: 20px;
bottom: -1px;
left: 50%;
margin-left: -10px;
content: "";
transition: all .3s ease-out;
}

#cssmenu>ul>li>a:hover::after {
background: #fff;
margin-left: 0;
width: 100%;
left: 0;
}*/
#nav.affix #cssmenu>ul>li>a {

    /*padding: 1.2em 10px;*/
    transition: all ease-in-out 0.22s;
}

#cssmenu>ul>li:hover>a,
#cssmenu ul li.active a {
    color: #fff;
    background: transparent;
    text-decoration: underline;
}

.box-why-exhibit .sub-head {
    color: #ff9800;
    border-left: none;
    padding: 2px 0 2px 10px;
    height: 37px;
    vertical-align: middle;
    display: block;
    text-align: center;
}

.box-why-exhibit {
    padding: 7% 10%;
    /* margin-bottom: 15px;
font-size: 13px;

letter-spacing: -0.02em;
background: rgba(255, 255, 255, 0.95);
padding: 5px;
/*min-height: 270px; */
}

.box-why-exhibit h4 {
    font-size: 14px;
    /*margin-top: 1rem;*/
    font-weight: 600;
    color: black;
    margin: 0;
}

.box-why-exhibit .card-body {
    display: flex;
    justify-content: center;
    align-items: center;
}

.box-why-exhibit .card {
    background: linear-gradient(45deg, #eaeaea, #ffffff);
    border: none;
    text-align: center;
    margin-bottom: 15px;
    /*
box-shadow: 0 0px 14px 12px #00000021;*/
    transition: all ease-in-out 0.22s;
}

.box-why-exhibit .card:hover {

    /* margin-top: -5px;*/
    transition: all ease-in-out 0.22s;
}

.box-why-exhibit a:hover span {
    opacity: 1;
    transition: all ease-in-out 0.22s;
}

.box-why-exhibit a span {
    opacity: 0;
    transition: all ease-in-out 0.22s;
    color: #069;
    font-size: 10px;
    position: absolute;
    bottom: -1.5rem;
    right: 0;
}

.box-why-exhibit1 {
    margin-bottom: 15px;
    font-weight: 400;
    background: rgba(255, 255, 255, 0.95);
    padding: 5px;
    /*min-height: 270px;*/
    border-radius: 5px;
}

.box-why-exhibit .card-body:hover .fa {
    transition: all ease-in-out 0.33s;
    color: #ffa31c !important;
}

.box-why-exhibit li {
    text-align: center;
    display: inline-block;
    vertical-align: top;
    margin: 10px;
    transition: all ease-in-out 0.33s;
}

.box-why-exhibit .fa {
    text-align: center;
    transition: all ease-in-out 0.22s;
    color: var(--color3) !important;
    display: inline-block;
    position: relative;
    /*  margin-top: 15px;*/
}

.box-why-exhibit a {
    color: #58585a;
    text-decoration: none;
    font-size: 14px;
    display: block;
    position: relative;
    height: 100%;
}

/*.box-why-exhibit a span {
position: absolute;
right: 0;
bottom: 5px;
font-size: 12px;
color: #069;
float: right;
top: 96%;
opacity: 0;

}*/
.box-why-exhibit li:hover a {
    color: #069;
    text-decoration: none;
}

.box-why-exhibit1 .fa {
    display: inline-block;
    font-size: 30px;
    margin: 25px;
    text-align: center;
    transition: all ease-in-out 0.22s;
    color: #16375d;
}

.box-why-exhibit:hover .fa {
    transition: all ease-in-out 0.22s;
}

.sub-headings {
    text-align: center;
    font-weight: 300;
}

/* .btn-group-sm>.btn, .btn-sm {padding: .25rem .5rem; font-size: .875rem; line-height: 1.1; border-radius: .2rem; } */
.line-height {
    line-height: 24px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

#cssmenu>ul>li:hover,
#cssmenu ul li.active:hover,
#cssmenu ul li.active,
#cssmenu ul li.has-sub.active:hover {
    background: transparent;
    -webkit-transition: background .3s ease;
    -ms-transition: background .3s ease;
    transition: background .3s ease;
}

/* #cssmenu>ul>li.has-sub>a {padding-right: 30px } #cssmenu>ul>li.has-sub>a:after {position: absolute; top: 50%; right: 11px; width: 8px; height: 2px; display: block; background: #333; content: ''} #cssmenu>ul>li.has-sub>a:before {position: absolute; top: 45%; right: 14px; display: block; width: 2px; height: 8px; background: #333; content: ''; -webkit-transition: all .25s ease; -ms-transition: all .25s ease; transition: all .25s ease } #cssmenu>ul>li.has-sub:hover>a:before {top: 50%; height: 0; color: #ffffff; } */
#cssmenu ul ul {
    position: absolute;
    left: -9999px;
    z-index: 9999;
    border-radius: 0 0 10px 10px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.18);
    overflow: hidden;
}

#cssmenu ul ul li {
    height: 0;
    -webkit-transition: all .25s ease;
    -ms-transition: all .25s ease;
    background: #4b4b4b;
    transition: all .25s ease
}

#cssmenu ul ul li:last-child {
    border-radius: 0 0 3px 3px;
}

#cssmenu ul ul li:hover {}

#cssmenu li:hover>ul {
    left: auto;
    margin: 0;
    padding: 0
}

#cssmenu li:hover>ul>li {
    height: auto;
    border-bottom: 1px solid rgba(150, 150, 150, 0.15);
}

#cssmenu ul ul ul {
    margin-left: 100% !important;
    top: 0
}

#cssmenu ul ul li a {
    padding: 10px 15px;
    width: 210px;
    text-transform: capitalize;
    text-decoration: none;
    color: #ffffff;
    font-weight: 300;
    text-align: left;
}

#cssmenu ul ul li:last-child>a,
#cssmenu ul ul li.last-item>a {
    border-bottom: 0
}

#cssmenu ul ul li:hover>a,
#cssmenu ul ul li a:hover {
    color: #000;
    background: white;
}

#cssmenu ul ul li.has-sub>a:after {
    position: absolute;
    top: 16px;
    right: 11px;
    width: 8px;
    height: 2px;
    display: block;
    background: #333;
    content: ''
}

#cssmenu ul ul li.has-sub>a:before {
    position: absolute;
    top: 13px;
    right: 14px;
    display: block;
    width: 2px;
    height: 8px;
    background: #333;
    content: '';
    -webkit-transition: all .25s ease;
    -ms-transition: all .25s ease;
    transition: all .25s ease
}

#cssmenu ul ul>li.has-sub:hover>a:before {
    top: 17px;
    height: 0
}

#cssmenu ul ul li.has-sub:hover,
#cssmenu ul li.has-sub ul li.has-sub ul li:hover {
    background: #f3f3f3;
}

#cssmenu ul ul ul li.active a {
    border-left: 1px solid #ffffff
}

#cssmenu>ul>li.has-sub>ul>li.active>a,
#cssmenu>ul ul>li.has-sub>ul>li.active>a {
    border-top: 1px solid #ffffff
}

#horizontal-form {
    padding: 30px 0 0;
    color: #ffffff;
}

.short-description {
    height: auto;
    overflow: hidden;
    /* font-size: 13px;*/
    color: #333;
    margin-bottom: 0;
    /*   width: 95%;*/

    /*padding: 5px;*/
    /*text-align: justify;  */
    /* border: 1px solid #ccc; */

    /* border-radius: 5px; */
}

h5.sub-heading {
    text-transform: uppercase;
    text-align: left;
    font-weight: 700;
    font-size: 20px;
}

.short-description ol {
    padding-left: 15px
}

.sub-heading {
    text-transform: uppercase;
    text-align: center;
    font-weight: 600;
}

.logo img {
    max-height: 50px;
    margin: 10px 0;
}

@media screen and (max-width:1000px) {

    /*    .logo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px;
    text-align: center;
    padding: 0;
    float: none
}*/


    .logo2 {
        display: none
    }

    nav {
        width: 100%;
    }

    #cssmenu {
        width: 100%
    }

    #cssmenu ul {
        width: 100%;
        display: none;
        margin: 0;
        padding: 0;
        top: 5px;
        overflow: auto;
        background: #4a4a4a;
        position: absolute;
        flex-direction: column;
    }

    #cssmenu ul li {
        width: 100%;
        border-top: 1px solid #444444
    }

    #cssmenu ul li:hover {
        background: #1c3b5f;
    }

    #cssmenu ul ul li,
    #cssmenu li:hover>ul>li {
        height: auto
    }

    #cssmenu ul li a,
    #cssmenu ul ul li a {
        width: 100%;
        border-bottom: 0;
        padding: 15px;
        color: #ffffff;
        background: none;
        text-align: left;
    }

    #nav.affix #cssmenu>ul>li>a {
        padding: 15px 15px;
        color: #ffffff;
        transition: all ease-in-out 0.22s;
    }

    #cssmenu>ul>li:hover>a,
    #cssmenu ul li.active a {
        color: #fff;
        background: #363636;
    }

    #cssmenu>ul>li {
        float: none;
        clear: both;
    }

    #cssmenu ul ul li a {
        padding-left: 25px
    }

    #cssmenu ul ul li {
        background: #363636 !important;
        clear: both;
    }

    #cssmenu ul ul li:hover {
        background: #363636 !important
    }

    #cssmenu ul ul ul li a {
        padding-left: 35px
    }

    #cssmenu ul ul li a {
        color: #fff;
        background: none
    }

    #cssmenu ul ul li:hover>a,
    #cssmenu ul ul li.active>a {
        color: #ffffff;
        background: #353535;
    }

    #cssmenu ul ul,
    #cssmenu ul ul ul {
        position: relative;
        left: 0;
        width: 100%;
        margin: 0;
        text-align: left;
        box-shadow: none;
        top: 0;
    }

    #cssmenu>ul>li.has-sub>a:after,
    #cssmenu>ul>li.has-sub>a:before,
    #cssmenu ul ul>li.has-sub>a:after,
    #cssmenu ul ul>li.has-sub>a:before {
        display: none
    }

    #cssmenu #head-mobile {
        display: block;
        padding: 23px;
        color: #333;
        font-size: 12px;
        font-weight: 700
    }

    .button {
        width: 55px;
        height: 46px;
        position: absolute;
        right: 0;
        top: -50px;
        cursor: pointer;
        z-index: 12399994;
    }

    .button:after {
        position: absolute;
        top: 22px;
        right: 20px;
        display: block;
        height: 4px;
        width: 20px;
        border-top: 2px solid white;
        border-bottom: 2px solid white;
        content: ''
    }

    .button:before {
        -webkit-transition: all .3s ease;
        -ms-transition: all .3s ease;
        transition: all .3s ease;
        position: absolute;
        top: 16px;
        right: 20px;
        display: block;
        height: 2px;
        width: 20px;
        background: #fff;
        content: ''
    }

    .button.menu-opened:after {
        -webkit-transition: all .3s ease;
        -ms-transition: all .3s ease;
        transition: all .3s ease;
        top: 23px;
        border: 0;
        height: 2px;
        width: 19px;
        background: #fff;
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg)
    }

    .button.menu-opened:before {
        top: 23px;
        background: #fff;
        width: 19px;
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }

    #cssmenu .submenu-button {
        position: absolute;
        z-index: 99;
        right: 0;
        top: 0;
        display: block;
        border-left: 1px solid #444444;
        height: 47px;
        width: 47px;
        cursor: pointer
    }

    #cssmenu .submenu-button.submenu-opened {
        background: #363636
    }

    #cssmenu ul ul .submenu-button {
        height: 46px;
        width: 46px;
    }

    #cssmenu .submenu-button:after {
        position: absolute;
        top: 22px;
        right: 19px;
        width: 8px;
        height: 2px;
        display: block;
        background: #ffffff;
        content: ''
    }

    #cssmenu ul ul .submenu-button:after {
        top: 22px;
        right: 19px
    }

    #cssmenu .submenu-button.submenu-opened:after {
        background: #fff
    }

    #cssmenu .submenu-button:before {
        position: absolute;
        top: 19px;
        right: 22px;
        display: block;
        width: 2px;
        height: 8px;
        background: #ffffff;
        content: ''
    }

    #cssmenu ul ul .submenu-button:before {
        top: 19px;
        right: 22px;
    }

    #cssmenu .submenu-button.submenu-opened:before {
        display: none
    }

    #cssmenu ul ul ul li.active a {
        border-left: none
    }

    #cssmenu>ul>li.has-sub>ul>li.active>a,
    #cssmenu>ul ul>li.has-sub>ul>li.active>a {
        border-top: none
    }

}

/*------------end Menu-------------*/
.navbar-default .navbar-toggle:focus,
.navbar-default .navbar-toggle:hover {
    background-color: #fff;
}

.navbar-default .navbar-toggle {
    border-color: #fff;
    border: none;
    color: #fff;
}

.navbar-toggle {
    margin-top: 8px;
}

.navbar-default {
    background-color: #00000063;
    border: none;
    padding: 0;
    top: 0;
    min-height: 60px;
    border-radius: 0;
    margin: 0;
    z-index: 99;
    position: fixed;
    width: 100%;
    /*box-shadow: 0 1px 20px #00000029;*/
}

.profile .box {
    padding: 30px 30px 0;
    color: #fff;
    transition: all ease-in-out 0.22s;
    margin-bottom: 5px;
    font-size: 14px;
    text-align: center;
}

.profile .box [class^="pe-7s-"],
.profile .box [class*=" pe-7s-"] {
    color: #00e2ff;
    background: #fff;
    height: 100px;
    width: 100px;
    border: 1px solid #ccc;
    line-height: 100px;
    border-radius: 50%;
}

.profile .box h4 {
    font-size: 18px;
    text-align: center;
    text-transform: uppercase;
    padding: 15px 0 0;
}

.company-profile {
    padding: 12vh 0 0;
    color: #fff;
}

.article {
    padding: 30px 0;
    font-size: 18px;
    color: #333;
    text-align: justify;
    line-height: 30px;
}

.navbar-default .navbar-nav>li>a:hover {
    color: #00e2ff;
    background: none;
}

.navbar-default .navbar-nav>li>a {
    color: #333;
    font-weight: 400;
    text-transform: uppercase;
}

.navbar-brand {
    margin: 0;
    padding: 0px;
    font-size: 36px;
    letter-spacing: -0.02em;
}

.navbar-brand a {
    color: #fff;
    text-decoration: none;
}

.navbar-brand span {
    font-size: 14px;
    color: #00e2ff;
}

#nav.affix {
    position: fixed;
    top: 0px;
    left: 0;
    z-index: 999;
    background: linear-gradient(#2d2d2d, #2d2d2d);
    transition: all ease-in-out 0.22s;
    right: 0;
}

#nav.affix .navbar-nav>li>a {
    color: #ffffff;
    font-weight: 400;
    text-transform: uppercase;
    /* letter-spacing: 0.02em; */
    font-size: 14px;
    padding: 15px 15px;
    transition: all ease-in-out 0.22s;
}

#nav.affix .logo img {

    /*max-height: 45px;*/

    /* margin-top: 5px;
 transition: all ease-in-out 0.22s;*/
}

.banner {
    position: relative;
    padding: 30px 0;
    z-index: 999;
    margin-top: -150px;
}

.nav-tabs>li.active>a,
.nav-tabs>li.active>a:focus,
.nav-tabs>li.active>a:hover {
    color: #000;
    cursor: default;
    background-color: #fff;
    /* border-bottom-color: #00e2ff !important; */

    /* background: #ffffff; */
    text-align: center;
    border-width: 0px;
    border-color: #fff;
    border-top: 0;
    border-left: 0;
    border-right: 0;
    box-shadow: 0 3px #00e2ff;
}

.nav-tabs>li.active>a .fa {
    color: #f90;
}

.read-more {
    border: 2px solid #ffffff;
    padding: 15px 45px;
    border-radius: 50px;
    font-size: 18px;
    font-weight: 500;
    transition: all ease-in-out 0.22s;
    text-transform: uppercase;
    position: relative;
    /* background: #FFC107; */
    color: #fff;
    margin-bottom: 20px;
    display: inline-block;
}

.read-more:hover,
.read-more:focus {
    background: #ffffff;
    text-decoration: none;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    color: #000;
}

.text-warning {
    color: #FF9800;
}

/*.read-more:before {position: absolute; border-bottom: 1px solid #00b6f1; /* background: #00b6f1; width: 100%; top: 20px; content: ""; left: -100%; } .read-more:after {position: absolute; border-bottom: 1px solid #00b6f1; /* background: #00b6f1; width: 100%; top: 50%; content: ""; right: -100%; }*/
.read-more1 {
    border: 1px solid #bcbcbc;
    padding: 5px 15px;
    border-radius: 25px;
    font-size: 12px;
    font-weight: 400;
    transition: all ease-in-out 0.22s;
    text-transform: capitalize;
    position: relative;
    display: inline-block;
    margin-bottom: 15px;
    color: #333;
}

.read-more1:hover,
.read-more1:focus {
    background: #5a5a5a;
    text-decoration: none;
    transition: all ease-in-out 0.22s;
    color: #fff;
    border-color: #5a5a5a;
}

.read-more2 {
    border: 1px solid #00e2ff;
    padding: 6px 45px;
    border-radius: 25px;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 15px;
    transition: all ease-in-out 0.22s;
    text-transform: uppercase;
    position: relative;
    display: inline-block;
}

.read-more2:hover,
.read-more2:focus {
    border-left: 3px solid #00e2ff;
    border-right: 3px solid #00e2ff;
    background: rgba(0, 0, 0, 0.6);
    text-decoration: none;
    transition: all ease-in-out 0.22s;
    color: #ffff00;
}

.read-more2:before {
    position: absolute;
    border-bottom: 1px solid #00b6f1;
    /* background: #00b6f1; */
    width: 100%;
    top: 50%;
    content: "";
    left: -100%;
}

/*#owlexample img {filter: invert(100%); transition: all ease-in-out 0.22s; } #owlexample img:hover {filter: invert(0%); transition: all ease-in-out 0.22s; }*/
.clients {

    /*    padding: 50px 0*/
}

.logo {

    /*max-width: 80px;
margin-top: 0px;
position: absolute;
transition: all ease-in-out 0.22s;*/
}

.profile {
    min-height: 60vh;
    box-sizing: content-box;
    /*   background: url(../../../uploads/bg.jpg) center; background-attachment: fixed; background-size: cover;*/
}

/*#content {
z-index: 1;
position: relative;
overflow-x: hidden;
}*/
.profile h4 {
    color: #fbffbd;
    text-transform: uppercase;
    letter-spacing: 0;
    font-size: 2em;
    font-weight: 500;
    text-shadow: 0px 3px 0px rgba(0, 0, 0, 0.1607843137254902);
    line-height: 1.4;
    margin-bottom: 25px;
    letter-spacing: 3px;
}

.bg1 {
    background: #ffffff;
    padding: 40px 0;
    color: #333;
    position: relative;
    z-index: 1;
    background-attachment: fixed;
}

.bg11 {
    background: #ffffff;
    padding: 20px 0 50px 0;
    color: #333;
    position: relative;
    min-height: 60vh
}

.bg2 {
    background: #f3f8fe;
    padding: 0 0 50px 0;
    color: #000000;
    position: relative;
    background-attachment: fixed;
}

.lead {
    font-weight: 300;
}

.bg22 {
    background: #f3f8fe;
    padding: 50px 0;
    color: #000000;
    position: relative;
}

.important-dates {
    background: #54baea;
    padding: 50px 0 50px;
    z-index: 1;
    color: #fff;
    position: relative;
    background-attachment: fixed;
    /*-webkit-animation: slide 20s linear infinite;*/
}

.box {
    background: #fff;
    padding: 20px;
    border-radius: 3px;
}

.box:hover {
    box-shadow: 0 0 15px 0px #ebebeb;
}

.important-dates:before {
    content: '';
    position: absolute;
    z-index: -1;
    left: 45%;
    right: -30%;
    height: 100%;
    top: 0;
    background: #4cacd9;
    transform: skewX(-25deg);
    /*box-shadow: -17px 0 18px -1px #e6e8e8;*/
}

.what-people {
    background: #ecf2f6;
    padding: 50px 0 50px;
    z-index: 1;
    color: #000;
    overflow: hidden;
    position: relative;
    background-attachment: fixed;
    /*-webkit-animation: slide 20s linear infinite;*/
}

.bg2:after {
    content: '';
    position: absolute;
    z-index: -1;
    right: 45%;
    left: -30%;
    height: 100%;
    top: 0;
    background: #a5cbff40;
    transform: skewX(25deg);
    box-shadow: -17px 0 18px -1px #e6e8e8;
}

.bg3 {
    background: #052536;
    padding: 15px 0px 40px;
    color: #ffffff;
    /*-webkit-animation: slide 20s linear infinite;*/
}

.medium {
    color: #fff8be;
    letter-spacing: 3px;
    font-size: 8vh;
    text-transform: uppercase;
    font-weight: 300;
    margin-top: 0;
    padding: 0;
}

.carousel-caption p sup {
    text-transform: none;
}

.carousel-caption p {

    /*letter-spacing: 1px;*/
    font-size: 1.3vw;
    color: #ffffff;
    text-transform: none;
    /* word-spacing: 1px; 
text-transform: uppercase;*/
    display: inline-block;
    padding: 7px 2rem;
    border-radius: 5px;
    border: 1px solid gold;
    margin-top: 10px;
    margin-bottom: 0px;
    font-weight: 700;
    text-align: left;
}

/*.content-box {
padding: 1.5rem;
}*/
.hover-image {
    min-height: 390px;
    overflow: hidden;
    background: url('https://www.pite.my/uploads/attending-as.jpg')no-repeat;
    position: relative;
    background-attachment: scroll;
    background-position: center right;
    background-size: calc(100% - 20%);
    background-color: #fff;
}

.hover-image img {
    transform: scale(1.0, 1.0);
    transition: all linear 0.2s;
    height: 100%;
    position: absolute;
    width: 100%;
    /*height: 600px;*/
}

.why-participate .sub-heading {
    font-size: 14px;
}

.why-participate .card-body {
    height: 100px;
}

/*.hover-image:hover img {
transform: scale(1.4, 1.4);
transition: all linear 0.2s
}*/
.hover-image1 {
    max-height: 350px;
    overflow: hidden;
}

.hover-image1 img {
    transform: scale(1.0, 1.0);
    transition: all linear 0.2s
}

.hover-image1:hover img {
    transform: scale(1.4, 1.4);
    transition: all linear 0.2s
}

.carousel-caption {
    bottom: 30%;
    text-shadow: 0px 10px 15px var(--color5);
}

/*.slider-header {

text-transform: uppercase;
font-weight: 700;
margin-top: 0;
text-shadow: 4px 3px 0px #00000047;
background: #0000007a;
border: 5px solid #FFF;
padding: 2rem;
margin-bottom: 2rem;
font-family: var(--font-family2);
}*/
.slider-header h2 {
    font-size: 1.6vw;
    letter-spacing: 1px;
    line-height: 1;
    text-transform: uppercase;
    font-weight: 700;
    font-family: var(--font-family2);
    margin-top: 15px;
    color: white;
    /*   background: #0000001a;*/
}

/*.slider-header h2 {
font-size: 3vw;
letter-spacing: 4px;
line-height: 1;
text-transform: uppercase;
font-weight: 700;

font-family: var(--font-family2);
}*/
.slider-header h2 span {
    letter-spacing: 0;
    display: block;
}

.slider-header h3 {
    margin-top: 10px;
    font-size: 5vw;
    color: white;
    letter-spacing: 1.8px;
    text-transform: uppercase;
    font-weight: 700;
    line-height: 1;
    /*background: #00000038;*/
    display: inline-block;
    clear: both;
    padding: 10px 2rem;
}

.slider-header h3 span {
    letter-spacing: 1.8px;
    display: block;
}

.de-images {
    position: relative;
    width: 100%;
}

.de-images img {
    border-radius: 5px;
    -webkit-box-shadow: 2px 20px 30px 0px rgba(20, 20, 20, 0.2);
    -moz-box-shadow: 2px 20px 30px 0px rgba(20, 20, 20, 0.2);
    box-shadow: 2px 20px 30px 0px rgba(20, 20, 20, 0.2);
}

.di-small {
    position: absolute;
    width: 50%;
    height: 50%;
    top: 75%;
    left: -35%;
    z-index: -1;
}

.di-small-2 {
    position: absolute;
    width: 42%;
    height: auto;
    right: -19%;
    bottom: -5%;
    z-index: 1;
}

.img-fluid {
    max-width: 100%;
    height: auto;
}

.watch-video {
    text-decoration: none;
    color: var(--color1);
    margin: 2rem 10px;
    text-transform: uppercase;
    font-weight: bold;
    display: flex;
    align-items: center;
}

.watch-video .fa {
    display: flex;
    height: 40px;
    width: 40px;
    margin-right: 10px;
    border-radius: 50%;
    background: linear-gradient(45deg, var(--color1), var(--color6));
    align-items: center;
    justify-content: center;
    color: white;
}

.infographics h4 {
    font-size: 18px;
    /* margin-top: 1rem;*/
    font-weight: 600;
    color: black;
    margin-bottom: 0;
    letter-spacing: -1PX;
}

.infographics .row {
    background: WHITE;
    PADDING: 10PX;
    border-bottom: 1px solid #ccc;
    border-radius: 10PX;
}

.infographics img {
    max-height: 70px;
}

.infographics .fa,
.box-why-exhibit .fa {
    color: var(--color3);
    /*height: 70px;
width: 70px;
border: 1px double var(--color1);*/
    font-size: 18px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    /*border-radius: 50%;*/
    position: relative;
    /*cursor: pointer;*/
    background: linear-gradient(to left, var(--color1) 20%, var(--color2) 40%, var(--color3) 60%, var(--color3) 80%);
    background: linear-gradient(to left, var(--color1) 20%, var(--color2) 40%, var(--color3) 60%, var(--color3) 80%);
    background: linear-gradient(to left, var(--color1) 20%, var(--color2) 40%, var(--color3) 60%, var(--color3) 80%);
    background-size: auto;
    background-clip: border-box;
    background-size: 200% auto;
    color: #074c98;
    background-clip: text;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-animation: shine 5s linear infinite;
    animation: shine 5s linear infinite;
}

@-webkit-keyframes shine {
    to {
        background-position: 200% center;
    }

}

@keyframes shine {
    to {
        background-position: 200% center;
    }

}

.infographics .card-body:hover .fa {
    color: var(--color1);
    cursor: pointer;
}

.bg33 {
    background: #052536;
    padding: 20px 0 50px;
    color: #ffffff;
}

.btn-primary-outline-v2 {
    color: #fff;
    background-color: transparent;
    border-color: #fff8be;
    /* letter-spacing: -0.02em; */
    font-weight: 400;
    font-size: 12px;
    border-width: 2px;
    text-transform: uppercase;
    border-radius: 0;
}

.btn-primary-outline-v2:hover,
.btn-primary-outline-v2:focus {
    color: gold;
    background: rgba(0, 0, 0, 0.5);
}

.text-white {
    color: white !important
}

@-webkit-keyframes slide {
    from {
        background-position: 0 0;
    }

    to {
        background-position: 400px 0;
    }

}

@-webkit-keyframes slide1 {
    from {
        background-position: 0 0;
    }

    to {
        background-position: -400px 0;
    }

}

.headings {
    display: inline-block;
    /* font-weight: 700;*/
    margin-bottom: 1em;
    padding: 10px 0px 0;
    /* color: #333435;*/
    position: relative;
    /* text-transform: uppercase;*/
}

.heading {
    display: block;
    font-weight: 400;
    margin-bottom: 1rem;
    font-size: 2.5rem;
    padding: 10px 0px;
    /*  color: #333;*/
    position: relative;
    /* text-transform: uppercase; */

    /*border-bottom: 1px solid #e2e2e2;*/
}

.nav-pills .nav-link {
    background: gray;
    border: 0;
    border-radius: 0.25rem;
    color: white;
    margin: 0 10px 0 0;
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    color: #fff;
    background-color: #ff9800;
}

/*.headings:before {
content: '';
position: absolute;

right: 30%;
height: 2px;
top: 100%;
width: 40%;
background: #d5d5d5;
transform: skewX(25deg);
left: 30%;
}

.headings:after {
content: '';
position: absolute;

right: 20%;
left: 20%;
height: 2px;
top: 105%;
width: 60%;
background: #FF5722;
transform: skewX(25deg);
}*/
.head {
    display: block;
    font-weight: 300;
    margin-bottom: 1rem;
    color: #234265;
    border-bottom: 1px solid #e2e2e2;
    padding: 0 0em;
    position: relative;
}

.heads {
    display: block;
    font-weight: 300;
    margin-bottom: 1rem;
    font-size: 3vh;
    color: #234265;
    padding: 15px 0em;
    position: relative;
    border-bottom: 1px solid #f2f2f2;
}

.headings span {
    display: block;
    /*font-size: 3vh;*/

    /*color: #2196F3; 
font-weight: 300;/*
padding-bottom: 10px;*/

    /*  text-transform: uppercase;*/
}

.welcome-text {
    font-weight: 600;
    font-size: 9vh;
    color: #fff;
    text-transform: uppercase;
    margin-bottom: 3rem;
    /*text-shadow: 0px 3px 0px rgba(0, 0, 0, 0.1607843137254902);*/
}

.welcome {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #2a2a2a;
    padding: 10px 0;
    color: #fff;
    z-index: 99;
    text-align: left;
}

.welcome a {
    color: #f40;
}

.welcome-text span {
    display: block;
    font-size: 3vh;
    color: #ffffff;
    font-style: normal;
    font-weight: 300;
    padding-top: 20px;
    text-shadow: 0px 3px 0px rgba(0, 0, 0, 0.1607843137254902);
    /*text-transform: uppercase;*/
    letter-spacing: 2px;
}

.typewrite {
    color: #ffffff;
}

.typewrite:hover,
.typewrite:focus {
    color: #dbdbdb;
    text-decoration: none;
}

.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:focus,
.navbar-default .navbar-nav>.active>a:hover {
    color: #00e2ff;
    background-color: rgba(255, 255, 255, 0);
}

#nav.affix .navbar-nav>.active>a,
#nav.affix .navbar-nav>.active>a:focus,
#nav.affix .navbar-nav>.active>a:hover {
    color: #00e2ff;
    background-color: rgba(255, 255, 255, 0);
}

.breadcrumb {
    background: none;
    margin-bottom: 0;
    padding-top: 15px;
}

.btn-primary.active,
.btn-primary:active,
.open>.dropdown-toggle.btn-primary {
    background-image: none;
    background: #035180 !important;
    border-color: #035180 !important;
}

.breadcrumb a {
    color: #2196F3;
}

.programme {
    background: url(../../../uploads/programme.jpg) no-repeat;
    background-size: cover;
    background-attachment: fixed;
    background-position: center top;
    padding-top: 300px;
}

.programme .nav-tabs .nav-link {
    font-weight: 800;
    color: var(--color2);
    font-size: 1.4rem;
    text-transform: uppercase;
}

.programme .nav-tabs .nav-link span {
    font-weight: 400;
    font-size: 14px;
    color: var(--color5);
}

/*.content {
padding: 50px 0 0;
}*/
#section08 {
    padding-top: 60px;
    position: absolute;
    left: 48%;
    right: 48%;
    bottom: 50px;
    text-align: center;
    color: #fff;
    display: none;
}

#section08 span {
    position: absolute;
    top: 0;
    left: 50%;
    width: 30px;
    height: 50px;
    margin-left: -15px;
    border: 2px solid #fff;
    border-radius: 50px;
    box-sizing: border-box;
}

#section08 span::before {
    position: absolute;
    top: 10px;
    left: 50%;
    content: '';
    width: 6px;
    height: 6px;
    margin-left: -3px;
    background-color: #fff;
    border-radius: 100%;
    box-sizing: border-box;
}

.img-background {
    background: #fff;
    background-position: center bottom;
    /*padding: 15px;*/
    position: relative;
    display: block;
    border: 1px solid #fff;
    margin-bottom: 20px;
}

/*.img-background1 .sub-heading {
text-align: center;
color: #4267b2;
text-transform: unset;
font-size: 20px;
font-weight: 900;
text-shadow: 0 0 5px #0000001a;

}*/
.img-background1 {
    background: #fff;
    /* background-position: center bottom; */
    padding: 2rem;
    position: relative;
    display: block;
    margin-bottom: 20px;
    /* border: 1px solid #e8e8e8; */
    min-height: 295px;
    border-radius: 5px;
    box-shadow: 0 5px 10px #00000017;
}

.sub-head {
    color: #000;
    /*border-left: 2px solid #ff9800;*/
    padding: 10px 0;
    font-weight: 700;
    margin: 0;
}

.sub-heading {
    color: #000;
    /* border-left: 2px solid #ff9800;*/
    font-weight: 700;
    margin: 0;
    position: relative;
}

/*.sub-heading:after{
position: absolute;
content: '';
width: 100px;
height: 2px;
background: #ff9800;
left: 0;
bottom:5px;
}*/

/*.img-background:after {
content: '';
position: absolute;
background: url(../../../uploads/6.png) no-repeat;
height: 50px;
bottom: -50px;
background-size: 100%;
left: 0;
right: 0;
}

.img-background1:after {
content: '';
position: absolute;
background: url(../images/6.png) no-repeat;
height: 50px;
bottom: -50px;
background-size: 100%;
left: 0;
right: 0;
}
*/
.headers-all-pages {
    background: url(../../../uploads/bg.jpg) no-repeat;
    /*background-attachment: fixed;*/
    background-size: cover;
    padding: 120px 0 0px;
    position: relative;
    color: #fff;
    background-position: bottom center;
}

.headers-all-pages:before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    height: 100%;
    top: 0;
    /* background: rgba(4, 34, 30, 0.71);*/

    /* transform: skewX(-25deg); */
    width: 100%;
}

.page-headings {
    display: inline-block;
    /*  font-weight: 400;*/
    text-align: center;
    margin-bottom: 1rem;
    padding: 10px 0px;
    color: #fff;
    position: relative;
    text-transform: uppercase;
}

.page-headings span {
    display: block;
    font-weight: 400;
    text-align: center;
    margin-bottom: 1rem;
    padding: 10px 0px;
    color: #fff;
    position: relative;
    text-transform: none;
    font-size: 18px;
}

.headers-all-pages a {
    color: #ffffff;
    text-decoration: none;
    z-index: 999;
    position: relative;
    text-transform: uppercase;
    font-weight: 100;
}

.headers-all-pages a:hover,
.headers-all-pages a:focus {
    color: #ffffff;
    text-decoration: none;
}

.back-top {
    position: fixed;
    bottom: 2em;
    right: 2em;
    border-radius: 15px 15px 2px 2px;
    text-align: center;
    color: #fff;
    background: #043955;
    font-size: 13px;
    padding: 5px 5px;
    display: none;
    z-index: 1111;
    font-weight: 600;
    height: auto;
    -webkit-transition: .2s all linear;
    -moz-transition: .2s all linear;
    -o-transition: .2s all linear;
    transition: .2s all linear;
    transform: scaleY(5px)
}

.back-top:focus,
.back-top:hover {
    background: #03A9F4;
    text-decoration: none;
    color: #fff
}

.footer {
    background: #1b2022;
    padding: 15px 0 0;
    color: #fff;
    font-size: 13px;
    position: relative;
    left: 0;
    right: 0;
    bottom: 0;
    border-top: 1px solid #234265;
}

.footer .form-control {
    background: #3d3d3d;
    border: none;
    color: #fff;
}

.footer .btn {
    display: block;
    background: #FF9800;
    border-color: #ff9800;
    width: 100%;
    text-transform: uppercase;
}

.footer h4 {
    border-bottom: 1px solid #161b1f;
    */ padding-bottom: 7px;
    margin-bottom: 12px;
    padding-left: 5px;
    font-size: 20px;
    /* font-weight: 200; */
    box-shadow: 0 1px 0 #252c2f;
}

.copyright {
    background: #1b2022;
    padding: 5px 0;
    color: #fff;
    font-size: 13px;
    position: relative;
    left: 0;
    right: 0;
    bottom: 0;
}

.footer a,
.copyright a,
.info a {
    color: #FF9800;
    text-decoration: none;
    transition: all ease-in-out 0.22s;
}

.copyright a:hover,
.footer a:hover {
    color: #ffffff;
    text-decoration: none;
    transition: all ease-in-out 0.22s;
}

.info a:hover {
    color: #000;
    text-decoration: none;
    transition: all ease-in-out 0.22s;
}

.steps-box {
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    background: var(--color3);
    height: 100%;
    padding: 2rem;
    border-radius: 5px;
    position: relative;
    box-shadow: 0 0 12px 2px #e0e0e021;
}

.steps-box::after {
    content: '';
    position: absolute;
    left: 100%;
    top: 40%;
    width: 0;
    height: 0;
    border-left: 15px solid #fff;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    clear: both;
}

.steps-box::after::last-child {
    display: none;
}

.steps-box .fa {
    position: absolute;
    height: 60px;
    width: 60px;
    background: #f9f9f9;
    border-radius: 50%;
    display: flex;
    align-items: center;
    top: -30px;
    left: 36%;
    right: unset;
    justify-content: center;
    font-size: 1.5rem;
    color: var(--color1);
    box-shadow: 0 0 10px 0 #0000001c;
}

.accordion-flush .accordion-item {
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    margin-bottom: 4px;
}

.steps-box h4 {
    font-size: 16px;
    padding-top: 1rem;
    /*    text-transform: uppercase;*/
    font-weight: 600;
    color: white;
    font-style: italic;
}

.common-bg {
    background: url(../../../uploads/common-bg.jpg) no-repeat bottom center;
    padding-bottom: 145px;
    line-height: 30px;
}

/* FORMS ********************************************/
.form-group label {
    font-weight: normal;
}

.datetimepicker {
    z-index: 99999;
}

/* Form controls =========================*/
#contact .form-control {
    border-radius: 3px;
    -webkit-box-shadow: none;
    box-shadow: none;
    background-color: transparent;
    vertical-align: middle;
    border: 1px solid #073e5b;
    font-size: 16px;
    height: auto;
    padding: 10px 15px;
    margin-bottom: 10px;
    font-weight: normal;
}

#contact .form-control:hover,
#contact .form-control:focus {
    border-color: 1px solid #2196F3;
    -webkit-box-shadow: none;
    box-shadow: none;
}

/* .organizers {
    padding: 10px 0 0;
    background: white;
}

.organizers h5 {
    font-size: 16px;
    font-weight: 700;
    margin: 1rem 0 0;
}

.organizers img {
    height: 85px;
    margin: 10px auto;
    background: #fff;
    max-width: 100%;
    padding: 5px;
  
border-radius: 5px;
}

*/

/* Light form control */
.form-control-light {
    border-color: rgba(255, 255, 255, 0.15);
    color: #fff;
}

.form-control-light option {
    color: #333;
}

.form-control-light:hover,
.form-control-light:focus {
    border-color: rgba(255, 255, 255, 0.5);
}

.form-control-light::-webkit-input-placeholder {
    color: rgba(255, 255, 255, 0.4);
}

.form-control-light::-moz-placeholder {
    color: rgba(255, 255, 255, 0.4);
}

.form-control-light:-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.4);
}

.form-control-light:-moz-placeholder {
    color: rgba(255, 255, 255, 0.4);
}

.btn-submit {
    border-radius: 2px;
    text-transform: uppercase;
    font-weight: 300;
    color: #ffffff;
    background: #2196F3;
    padding: 10px;
    border: 1px solid #234265;
}

.btn-submit:hover,
.btn-submit:focus {
    background: #fff;
    color: #333;
    transition: all ease-in-out 0.22s;
}

.contact-heading {
    margin-bottom: 60px;
    display: block;
}

/* Form controls } } =========================*/
.navbar-default .navbar-nav>li>a:focus,
.navbar-default .navbar-nav>li>a:hover {
    color: #00BCD4;
    background-color: transparent;
}

/*#about{ background: url(../images/cost-effectiveness.jpg) no-repeat; }

*/
#about .bg1 {
    padding: 0 0 0px;
    border-bottom: 3px solid #efefef;
}

.custom-btn {
    border-radius: 2px;
    /* background: none; */
    text-transform: uppercase;
    font-weight: 700;
    margin: 20px 0;
    padding: 8px 15px;
    background: #2196F3;
    border-color: #2196F3;
    transition: all ease-in-out 0.22s;
}

.custom-btn:hover {
    background: #0077d5;
    color: #fff;
    border-color: #0077d5;
    transition: all ease-in-out 0.22s;
}

.contact-info .form-group {
    margin-bottom: 0;
}

.box-why-exhibit p {
    max-height: 100px;
    overflow: auto;
}

.folder {
    display: inline-block;
    position: relative;
    height: 10em;
    margin: 0 3em 5em 0;
    width: 7.5em;
}

.folder::before,
.folder::after {
    border-radius: 0 5px 25px 0;
    content: "";
    display: block;
    height: 100%;
    padding-top: 2em;
    position: absolute;
    width: 100%;
}

.folder::before {
    background: #ffe9a0;
    content: attr(title);
    left: -1.2em;
    top: 1.85em;
    -webkit-transform: matrix(0.7, 0.5, 0, 1, 0, 0);
    transform: matrix(0.7, 0.5, 0, 1, 0, 0);
    z-index: 40;
    vertical-align: middle;
}

.folder::after {
    background: #efcd67;
    z-index: 10;
}

.folder img {
    position: absolute;
}

.folder img:first-child {
    left: 0.9em;
    top: 2.1em;
    -webkit-transform: matrix(0.8, 0.35, 0, 1.1, 0, 0);
    transform: matrix(0.8, 0.35, 0, 1.1, 0, 0);
    z-index: 30;
}

.folder img:last-child {
    left: 2em;
    top: 1.5em;
    -webkit-transform: matrix(1, 0.2, 0, 1.1, 0, 0);
    transform: matrix(1, 0.2, 0, 1.1, 0, 0);
    z-index: 20;
}

.buyer-heading {
    font-weight: 700;
    text-transform: uppercase;
}

.benefits {
    position: relative;
    background: black;
    overflow: hidden;
    max-height: 200px;
    margin: 0;
}

.benefits h4 {
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 5px;
    color: white;
    font-weight: 700;
    letter-spacing: -1px;
}

.benefits img {
    opacity: 0.8;
    transform: scale(1.0, 1.0);
    transition: all linear 0.2s;
}

.benefits:hover img {
    opacity: 0.8;
    transform: scale(1.3, 1.3);
    transition: all linear 0.2s;
}

/*.bg-gradient {
min-height: 500px;
background: rgba(255, 146, 10, 1);
background: -moz-linear-gradient(left, rgba(255, 146, 10, 1) 0%, rgba(255, 146, 10, 1) 49%, rgba(255, 146, 10, 0) 49%, rgba(255, 146, 10, 0) 65%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(255, 146, 10, 1)), color-stop(49%, rgba(255, 146, 10, 1)), color-stop(49%, rgba(255, 146, 10, 0)), color-stop(65%, rgba(255, 146, 10, 0)));
background: -webkit-linear-gradient(left, rgba(255, 146, 10, 1) 0%, rgba(255, 146, 10, 1) 49%, rgba(255, 146, 10, 0) 49%, rgba(255, 146, 10, 0) 65%);
background: -o-linear-gradient(left, rgba(255, 146, 10, 1) 0%, rgba(255, 146, 10, 1) 49%, rgba(255, 146, 10, 0) 49%, rgba(255, 146, 10, 0) 65%);
background: -ms-linear-gradient(left, rgba(255, 146, 10, 1) 0%, rgba(255, 146, 10, 1) 49%, rgba(255, 146, 10, 0) 49%, rgba(255, 146, 10, 0) 65%);
background: linear-gradient(to right, rgba(255, 146, 10, 1) 0%, rgba(255, 146, 10, 1) 49%, rgba(255, 146, 10, 0) 49%, rgba(255, 146, 10, 0) 65%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff920a', endColorstr='#ff920a', GradientType=1);
}*/

/*.bg-who {
 min-height: 500px;
background: rgba(255, 255, 255, 0);
background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(245, 245, 245, 0) 50%, rgba(245, 245, 245, 1) 50%, rgba(245, 245, 245, 1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(50%, rgba(245, 245, 245, 0)), color-stop(50%, rgba(245, 245, 245, 1)), color-stop(100%, rgba(245, 245, 245, 1)));
background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(245, 245, 245, 0) 50%, rgba(245, 245, 245, 1) 50%, rgba(245, 245, 245, 1) 100%);
background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(245, 245, 245, 0) 50%, rgba(245, 245, 245, 1) 50%, rgba(245, 245, 245, 1) 100%);
background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(245, 245, 245, 0) 50%, rgba(245, 245, 245, 1) 50%, rgba(245, 245, 245, 1) 100%);
background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(245, 245, 245, 0) 50%, rgba(245, 245, 245, 1) 50%, rgba(245, 245, 245, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f5f5f5', GradientType=1);

}*/
/*
.bg-gradient1 {
 min-height: 500px;
background: rgba(255, 146, 10, 0);
background: -moz-linear-gradient(left, rgba(255, 146, 10, 0) 35%, rgba(255, 146, 10, 0) 51%, rgba(255, 146, 10, 1) 51%, rgba(255, 146, 10, 1) 100%);
background: -webkit-gradient(left top, right top, color-stop(35%, rgba(255, 146, 10, 0)), color-stop(51%, rgba(255, 146, 10, 0)), color-stop(51%, rgba(255, 146, 10, 1)), color-stop(100%, rgba(255, 146, 10, 1)));
background: -webkit-linear-gradient(left, rgba(255, 146, 10, 0) 35%, rgba(255, 146, 10, 0) 51%, rgba(255, 146, 10, 1) 51%, rgba(255, 146, 10, 1) 100%);
background: -o-linear-gradient(left, rgba(255, 146, 10, 0) 35%, rgba(255, 146, 10, 0) 51%, rgba(255, 146, 10, 1) 51%, rgba(255, 146, 10, 1) 100%);
background: -ms-linear-gradient(left, rgba(255, 146, 10, 0) 35%, rgba(255, 146, 10, 0) 51%, rgba(255, 146, 10, 1) 51%, rgba(255, 146, 10, 1) 100%);
background: linear-gradient(to right, rgba(255, 146, 10, 0) 35%, rgba(255, 146, 10, 0) 51%, rgba(255, 146, 10, 1) 51%, rgba(255, 146, 10, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff920a', endColorstr='#ff920a', GradientType=1);
}
.owl-theme .owl-nav{
display: none !important;
}

.bg-bluegradient {
 min-height: 500px;
background: rgba(32, 124, 229, 1);
background: -moz-linear-gradient(left, rgba(32, 124, 229, 1) 50%, rgba(32, 124, 229, 0) 50%, rgba(73, 155, 234, 0) 61%);
background: -webkit-gradient(left top, right top, color-stop(50%, rgba(32, 124, 229, 1)), color-stop(50%, rgba(32, 124, 229, 0)), color-stop(61%, rgba(73, 155, 234, 0)));
background: -webkit-linear-gradient(left, rgba(32, 124, 229, 1) 50%, rgba(32, 124, 229, 0) 50%, rgba(73, 155, 234, 0) 61%);
background: -o-linear-gradient(left, rgba(32, 124, 229, 1) 50%, rgba(32, 124, 229, 0) 50%, rgba(73, 155, 234, 0) 61%);
background: -ms-linear-gradient(left, rgba(32, 124, 229, 1) 50%, rgba(32, 124, 229, 0) 50%, rgba(73, 155, 234, 0) 61%);
background: linear-gradient(to right, rgba(32, 124, 229, 1) 50%, rgba(32, 124, 229, 0) 50%, rgba(73, 155, 234, 0) 61%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#207ce5', endColorstr='#499bea', GradientType=1);
}

.bg-bluegradient1 {
 min-height: 500px;
background: rgba(73, 155, 234, 0);
background: -moz-linear-gradient(left, rgba(73, 155, 234, 0) 39%, rgba(11, 49, 89, 0) 50%, rgba(11, 49, 89, 1) 50%);
background: -webkit-gradient(left top, right top, color-stop(39%, rgba(73, 155, 234, 0)), color-stop(50%, rgba(11, 49, 89, 0)), color-stop(50%, rgba(11, 49, 89, 1)));
background: -webkit-linear-gradient(left, rgba(73, 155, 234, 0) 39%, rgba(11, 49, 89, 0) 50%, rgba(11, 49, 89, 1) 50%);
background: -o-linear-gradient(left, rgba(73, 155, 234, 0) 39%, rgba(11, 49, 89, 0) 50%, rgba(11, 49, 89, 1) 50%);
background: -ms-linear-gradient(left, rgba(73, 155, 234, 0) 39%, rgba(11, 49, 89, 0) 50%, rgba(11, 49, 89, 1) 50%);
background: linear-gradient(to right, rgba(73, 155, 234, 0) 39%, rgba(11, 49, 89, 0) 50%, rgba(11, 49, 89, 1) 50%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#499bea', endColorstr='#0b3159', GradientType=1);
}*/
.pt-5 {
    padding-top: 5rem;
}

.box-why-attent {
    color: black;
    display: flex;
    flex-direction: row;
}

.box-why-attent h4 {
    color: #FF9800;
    font-weight: 900;
    font-size: 20px;
    letter-spacing: 1px;
}

.box-why-attent p {
    min-height: 100px;
}

.box-why-attent h2 {
    color: var(--color1);
    font-size: 24px;
    height: 70px;
    width: 70px;
    margin-right: 1.5rem;
    background: #e7e7e7;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center
}

.pb-5 {
    padding-bottom: 5rem;
}

.btn-secondary {
    padding: 8px 10px;
    border: 1px solid var(--color3);
    border-radius: 0;
    margin: 5px;
    font-size: 14px;
    font-weight: 400;
    text-transform: uppercase;
    border-radius: 3px;
    color: #fff;
    background: var(--color3);
    white-space: normal;
}

.btn-secondary:hover,
.btn-secondary:focus {
    background: #0B3159;
    color: #ffffff;
    border-color: #FFF;
}

#qualifyings,
#qualifying {

    /* background: url(../../../uploads/as-buyer.jpg) no-repeat;
 background-color: rgba(0, 0, 0, 0);*/
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: center right;
    background-size: cover;
    background-color: #ff920a;
    background-position-x: 10%;
    position: relative;
}

#qualifying .rounded {
    position: relative;
    background: #ccc;
}

#qualifying h2 {

    position: absolute;
    top: -25px;
    left: 5%;
    right: 5%;
    background: var(--color2);
    border-radius: 5px;
    text-align: center;
    font-size: 22px;
    padding: 10px;
    color: white;

}

/*#qualifying:before {
background: var(--color2);
position: absolute;
content: '';
height: 100%;
width: 50%;
z-index: 1;
top: 0;
}*/

/*#qualifyings:before {
background: var(--color20);
position: absolute;
content: '';
height: 100%;
width: 50%;
z-index: 1;
top: 0;
right: 0;
}*/

/*#buyer-about:before {
background: var(--color1);
position: absolute;
content: '';
height: 100%;
width: 50%;
z-index: 1;
top: 0;
}*/

#buyer-about .container,
#qualifying .container,
#qualifyings .container {
    position: relative;
    z-index: 9;
}

.be-hosted-byer {
    background: url("https://www.pite.my/uploads/gallery/1684744310-899891349pite-2022-day-3_52513947419_o.jpg") no-repeat;
    background-attachment: scroll;
    padding: 80px 0;
    background-position: center top;
    background-size: cover;
}

#buyer-about {

    /*background: url(../../../assets/images/resized-images/9.jpg) no-repeat;
background-repeat: no-repeat;
background-attachment: scroll;
background-size: auto 120%;   */
    background-color: var(--color1);
    background-position: right top;
    position: relative;
}

.text-justify {
    text-align: justify;
}

/*#who {
background: url('https://www.pite.my/assets/images/resized-images/7.jpg') no-repeat;
background-attachment: scroll;
 background-position: center right; 
background-size: contain;
background-color: #f5f5f5;
background-repeat: no-repeat;
background-position-x: 0;
}*/

.register-btn-new:hover {
    color: white;
    text-decoration: none;
}

.register-btn-new {
    display: block;
    text-decoration: none;
    color: white;
    font-size: 1.6rem;
    font-weight: 800;
    text-align: center;
    border-radius: 4px;
}

#buyer_package {
    background: url(../../../uploads/buyers-bg.jpg) no-repeat;
    background-attachment: scroll;
    background-position: center left;
    background-size: cover;
}

.be-hosted-byer h1 {
    font-weight: 600;
    font-size: 4rem;
    color: #ffffff;
    text-shadow: 0 1px 0 #000;
    margin-bottom: 2rem;
}

.be-hosted-byer .btn {
    border: 3px solid rgba(255, 146, 10, 1);
    padding: 10px 3rem;
    background: transparent;
    color: #ffffff;
    text-transform: uppercase;
    font-size: 18px;
}

.p-5 {
    padding: 5rem;
}

.lib-panel {
    margin-bottom: 20Px;
}

.lib-panel img {
    width: 100%;
    background-color: transparent;
}

.lib-panel .row,
.lib-panel .col-md-6 {
    padding: 0;
    background-color: #FFFFFF;
}

.who-exhibit h4 {
    font-size: 14px;
}

.who-exhibit img {
    max-width: 70%;
    margin: 2rem auto 0;
}

.who-exhibit .fa {
    height: 60px;
    width: 60px;
    background: #dbdbdb;
    color: var(--color1);
    border-radius: 50%;
    margin: 1rem auto;
    font-size: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lib-panel .lib-row {
    padding: 0 20px 0 20px;
}

.lib-header {
    background-color: #FFFFFF;
    font-size: 18px;
    text-transform: uppercase;
}

.lib-panel .lib-row.lib-header .lib-header-seperator {
    height: 2px;
    width: 26px;
    background-color: #d9d9d9;
    margin: 7px 0 7px 0;
}

.lib-panel .lib-row.lib-desc {
    position: relative;
    height: 100%;
    display: block;
    font-size: 14px;
    padding-bottom: 15px;
}

.lib-panel .lib-row.lib-desc a {
    position: absolute;
    width: 100%;
    bottom: 10px;
    left: 20px;
}

.row-margin-bottom {
    margin-bottom: 20px;
}

.box-shadow {
    -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, .10);
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .10);
}

.no-padding {
    padding: 0;
}

@media screen and (min-width:768px) {
    #cssmenu>ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        float: none;
        margin: 0;
        text-align: center;
    }

    .nav>li>a {
        position: relative;
        display: block;
        transition: all ease-in-out 0.22s;
    }

    .border-left {
        border-left: 1px solid #e2e2e2;
    }

    .border-right {
        border-right: 1px solid #e2e2e2;
    }

    .border-bottom {
        border-bottom: 1px solid #f2f2f2;
    }

}

@media(max-width:768px) {


    .box-why-exhibit {
        min-height: auto;
    }

    .copyright {
        position: relative;
    }

    .headings {
        font-size: 24px;
        padding: 5px 0%;
    }

    .headers-all-pages {
        padding: 75px 0 20px;
    }

    .company-profile {
        padding: 15vh 0 0;
        color: #fff;
    }

}

@media(max-width:767px) {

    /*.slider img {
    height: 300px !important;
    width: 100%;
}*/
    #section08 {
        display: none;
    }

    .logo img {
        max-height: 40px;

        margin-left: 5px;
        padding: 0;
    }

    #buyer-about {
        background-image: none !important;
        /* background-color: #ff920a;*/
    }

    #who {
        background: #f8f9fa !important;
    }

    /*#qualifying::before {
    background: var(--color2);
    position: absolute;
    content: '';
    height: 58%;
    width: 100%;
    z-index: 1;
    top: 0;
}*/

    #qualifyings::before {
        /*  background: var(--color3);*/
        position: absolute;
        content: '';
        height: 100%;
        width: 100%;
        z-index: 1;
        top: 0;
    }

    #nav.affix .logo img {
        max-height: 40px;
        margin-top: 0;
        transition: all ease-in-out 0.22s;
    }

    .carousel-caption {
        left: 10% !important;
        right: 10% !important;
        bottom: 20px !important;
    }

    .light {
        display: none;
    }

    .dark {
        display: block;
    }

    .navbar-default {
        background: #373535;
        min-height: 50px;
        padding: 5px 0;
    }

    #buyer-about::before {
        background: var(--color1);
        position: absolute;
        content: '';
        height: 70%;
        width: 100%;
        z-index: -1;
        top: 0;
    }

}

/*.carousel-caption {
top: 30%;
right: 31%;
left: 31%;
}
*/
.penangs-dna div {
    border: 1px solid #ccc;
    margin-top: 20px;
    min-height: 160px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.penangs-dna img {
    max-width: 100%;
    margin: 0 auto;
    padding: 15px;
    max-height: 150px;
}

.footer-menu-link li {
    border-bottom: 1px solid #131719;
    padding: 5px 5px;
    list-style: none;
    box-shadow: 0 1px 0px #31393c;
}

/* Absolute Center Spinner */
#loader {
    position: fixed;
    z-index: 999;
    height: 2em;
    width: 2em;
    overflow: show;
    margin: auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

/* Transparent Overlay */
#loader:before {
    content: '';
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
}

/* :not(:required) hides these rules from IE9 and below */
#loader:not(:required) {

    /* hide "loading..." text */
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0;
}

#loader:not(:required):after {
    content: '';
    display: block;
    font-size: 10px;
    width: 1em;
    height: 1em;
    margin-top: -0.5em;
    -webkit-animation: spinner 1500ms infinite linear;
    -moz-animation: spinner 1500ms infinite linear;
    -ms-animation: spinner 1500ms infinite linear;
    -o-animation: spinner 1500ms infinite linear;
    animation: spinner 1500ms infinite linear;
    border-radius: 0.5em;
    -webkit-box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.5) -1.5em 0 0 0, rgba(0, 0, 0, 0.5) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
    box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) -1.5em 0 0 0, rgba(0, 0, 0, 0.75) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
}

/* Animation */
@-webkit-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }

}

@-moz-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }

}

@-o-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }

}

@keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }

}

::selection {
    background: #f40;
    color: #fff;
}

-webkit::selection {
    background: #f40;
    color: #fff;
}

#rewards .card {
    position: relative;
    border: 0;
    /*
  background: linear-gradient(-45deg, #fe0847, #feae3f);*/
    border-radius: 15px;
    padding: 20px 20px;
    /*
  -webkit-box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);*/
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

#rewards.card:hover {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

/*#rewards .card:nth-child(1),
#rewards .card:nth-child(1) .title .fa {
background: linear-gradient(-45deg, #fff, #64b5f6);
}

#rewards .card:nth-child(2),
#rewards .card:nth-child(2) .title .fa {
background: linear-gradient(-45deg, #fff, #ffba7d);
}

#rewards .card:nth-child(3),
#rewards .card:nth-child(3).title .fa {
background: linear-gradient(-45deg, #fff, #899bff);
}*/

/*#rewards .card::before {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 40%;
background: rgba(255, 255, 255, 0.1);
z-index: 1;
-webkit-transform: skewY(-5deg) scale(1.5);
transform: skewY(-5deg) scale(1.5);
}*/

#rewards .title .fa {
    color: #fff;
    font-size: 60px;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    text-align: center;
    line-height: 100px;
    -webkit-box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
}

#rewards .title h2 {
    position: relative;
    margin: 0;
    padding: 0;
    font-size: 20px;
    z-index: 2;
    text-transform: uppercase;
    background: #ffffff6e;
    box-shadow: 0 0 3px 1px #0000000d;
    padding: 10px 2rem;
    border-radius: 40px;
    font-weight: 700;
    display: inline-block;
}

#rewards .price,
#rewards .option {
    position: relative;
    z-index: 2;
}

#rewards .option {
    position: relative;
    z-index: 2;
    max-height: 270px;
    overflow: auto;
    border: 1px dashed yellow;
    padding: 20px;
    border-radius: 10px;
}

#rewards .price h4 {
    margin: 0;
    padding: 20px 0;
    color: #000;
    font-size: 60px;
    font-weight: 700;
}

#rewards .option ol {
    padding-left: 20px;
}

#rewards .option ul li {
    margin: 0 0 10px;
    padding: 0;
    list-style: none;
    color: #000;
    font-size: 16px;
}

#rewards .card h4 a {
    position: relative;
    z-index: 2;
    background: white;
    color: black;
    width: 150px;
    height: 40px;
    line-height: 40px;
    border-radius: 40px;
    display: block;
    text-align: center;
    margin: 20px auto 0;
    font-size: 16px;
    cursor: pointer;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
}

#rewards .card a:hover {
    text-decoration: none;
}

#rewards .card a {
    position: relative;
    z-index: 9;
}

@media screen and (max-width:1000px) {

    /*
#buyer-about {
    background: url(../../../uploads/attending-as.jpg) no-repeat;
    background-attachment: scroll;
    background-position: center right;
    background-size: calc(100% - 179px);
    background-color: #ff920a;
    background-repeat: no-repeat;
}*/
}

/*@media screen and (max-width:768px) {
.slider-header {
    display: none;    }
}*/
.bg-why-exhibit {
    background: url(../../../uploads/attending-as.jpg) no-repeat;
    background-attachment: scroll;
    background-position: center top;
    background-size: cover;
    background-color: #ff920a;
}

@media(max-width:1024px) {
    .carousel-caption {
        top: 30%;
        right: 15%;
        left: 15%;
    }

    /*    .logo {
    top: 10px;
    left: 10px;

}*/
}

@media(max-width:768px) {
    .slider-header h2 {
        font-size: 6vw;
        letter-spacing: 0;
    }

    .slider-header h3 {
        font-size: 5vw;
    }

    .page-headings {
        display: inline-block;
        font-weight: 400;
        text-align: center;
        margin-bottom: 0;
        padding: 30px 0px 0;
        color: #fff;
        position: relative;
        text-transform: uppercase;
    }

    .carousel-caption {
        bottom: 0;
    }

    .programme {
        background: url(../../../uploads/programme.jpg) no-repeat;
        background-size: cover;
        background-attachment: fixed;
        background-position: center center;
        padding-top: 100px;
    }

    .p-5 {
        padding: 0;
    }

    .bg-gradient {
        background: rgba(248, 80, 50, 1);
        background: -moz-linear-gradient(left, rgba(248, 80, 50, 1) 0%, rgba(231, 56, 39, 1) 100%);
        background: -webkit-gradient(left top, right top, color-stop(0%, rgba(248, 80, 50, 1)), color-stop(100%, rgba(231, 56, 39, 1)));
        background: -webkit-linear-gradient(left, rgba(248, 80, 50, 1) 0%, rgba(231, 56, 39, 1) 100%);
        background: -o-linear-gradient(left, rgba(248, 80, 50, 1) 0%, rgba(231, 56, 39, 1) 100%);
        background: -ms-linear-gradient(left, rgba(248, 80, 50, 1) 0%, rgba(231, 56, 39, 1) 100%);
        background: linear-gradient(to right, rgba(248, 80, 50, 1) 0%, rgba(231, 56, 39, 1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f85032', endColorstr='#e73827', GradientType=1);
    }

    .bg-bluegradient1 {
        background: #207ce5;
    }

    .bg-bluegradient {
        background: #0e3457;
    }

    .box-why-exhibit p {
        max-height: auto;
    }

    .nav>li>a {
        position: relative;
        display: block;
        padding: 5px 15px;
        transition: all ease-in-out 0.22s;
    }

    .copyright {
        position: relative;
    }

    .company-profile {
        padding: 15px 0 0;
        color: #fff;
    }

    .carousel-caption {
        top: 30%;
        right: 15%;
        left: 15%;
    }

    /* .slider-header {
    font-size: 30px !important;
    letter-spacing: 0px;
    font-weight: 400;
    padding: 0.3rem;
    border-width: 3px;
    margin-bottom: 4px;
}*/

    /*    .slider-header span {
    font-size: 18px !important;
    letter-spacing: 0px;
    font-weight: 400;

}*/

    .register-btn {
        font-size: 16px;
        background: linear-gradient(45deg, #ff7100, red);
        padding: 0.2em 2em 0.4em;
        transition: all ease-in-out 0.22s;
    }

}

@media(max-width:480px) {
    #qualifying h2 {

        font-size: 18px;

    }

    .di-small-2 {
        position: absolute;
        width: 42%;
        height: auto;
        right: -5%;
        bottom: -5%;
        z-index: 1;
    }

    #cssmenu {
        border: none;
    }

    .organizers h5 {
        font-size: 12px;
        font-weight: 400;
        margin: 1rem 0rem;
    }

    .form-group {
        margin-bottom: 10px;
    }

    .bg2:after {
        display: none !important
    }

    .slider-header {
        padding: 2rem 0 0;
    }

    figure.effect-roxy h2 {
        padding: 2px 0 10px 0;
        font-size: 6vw;
        color: white;
    }

    .page-headings {
        display: inline-block;
        font-weight: 400;
        text-align: center;
        margin-bottom: 0;
        padding: 1rem 15px 0;
        color: #fff;
        position: relative;
        text-transform: uppercase;
        font-size: 30px;
    }

    .grid figure p {
        letter-spacing: 0px;
        font-size: 60.5%;
        line-height: 1.3;
    }

    .logo img {
        max-height: 40px;
        margin-left: 5px;
        border-radius: 0 !important;
    }

    .be-hosted-byer h1 {
        font-size: 3rem;
    }

    .buyer-heading {
        font-weight: 700;
        text-transform: uppercase;
        margin: 20px 0;
        font-size: 30px;
    }

    .video-responsive {
        position: relative;
        height: auto;
        max-height: 400px;
        overflow: hidden;
    }

    .highlights {
        position: absolute;
        z-index: 999;
        transform: rotate(0);
        right: 0;
        top: 0%;
        left: 30%;
        border-radius: 0 0 5px 5px;
    }

    .headers-all-pages {
        padding: 10px 0 20px;
    }

    body {
        padding-top: 50px;
    }

    .short-description {
        height: auto;
    }

    /*    .slider img {
    height: 250px !important;
    width: 100%;
}*/
    .carousel-caption {
        top: 0;
        left: 5% !important;
        right: 5% !important;
        bottom: 30px !important;
    }

    .slider-header h3 {
        padding: 0;
    }

    .grid figure {
        width: 100%;
    }

    .carousel-caption p {
        letter-spacing: 0;
        font-size: 11px;
        color: #ffffff;
        font-weight: 400;
        word-spacing: 0;
        text-transform: uppercase;
        text-shadow: 0 1px 7px rgba(0, 0, 0, .5);
        display: inline-block;
        padding: 5px 10px;
        border-radius: 5px;
    }

    #section08 {
        display: none;
    }

    .register-btn {
        background: linear-gradient(45deg, #ff7100, red);
        padding: 0.4em 1rem 0.2em;
        transition: all ease-in-out 0.22s;
        font-size: 14px;
    }

    /*.slider-header {
    font-size: 20px !important;
    letter-spacing: 0px;
    font-weight: 400;
    padding: 0.3rem;
    border-width: 3px;
    margin-bottom: 4px;
}

.slider-header span {
    font-size: 14px !important;
    letter-spacing: 0px;
    font-weight: 400;

}*/
}


/* =========================================================
   PARTNERS / ORGANIZERS SECTION
   ========================================================= */

.organizers {
    position: relative;
    padding: 45px 0 50px;
    background: #f7f9fc;
    overflow: hidden;
}

.organizers .container {
    position: relative;
    z-index: 2;
}

.organizers .row {
    margin-left: 0;
    margin-right: 0;
}

/* Individual partner group */
.organizers .col-auto {
    margin-bottom: 25px;
    text-align: center;
    vertical-align: top;
}

/* Partner category title */
.organizers h5 {
    position: relative;
    display: block;
    margin: 0 0 18px;
    padding-bottom: 10px;

    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.7px;
    text-transform: uppercase;

    color: #183b63;
}

/* Small gold line below heading */
.organizers h5::after {
    content: "";
    display: block;

    width: 38px;
    height: 2px;

    margin: 8px auto 0;

    background: #d69b32;
    border-radius: 10px;
}

/* Logo list */
.organizers ul.list-inline {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;

    gap: 12px;

    margin: 0;
    padding: 0;

    list-style: none;
}

/* Individual logo item */
.organizers ul.list-inline>li {
    display: flex;
    align-items: center;
    justify-content: center;

    margin: 0 !important;
}

/* Logo box */
.organizers ul.list-inline>li>a {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 180px;
    min-height: 90px;
    padding: 12px 18px;

    background: #ffffff;
    border: 1px solid #e7ebf0;
    border-radius: 10px;

    text-decoration: none;

    box-shadow: 0 4px 15px rgba(24, 59, 99, 0.06);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease;
}

/* Logo */
.organizers ul.list-inline>li>a img {
    display: block;

    width: auto;
    max-width: 145px;
    max-height: 62px;

    height: auto;

    object-fit: contain;

    transition: transform 0.3s ease;
}

/* Hover */
.organizers ul.list-inline>li>a:hover {
    transform: translateY(-5px);

    border-color: rgba(214, 155, 50, 0.55);

    box-shadow:
        0 10px 28px rgba(24, 59, 99, 0.12);
}

.organizers ul.list-inline>li>a:hover img {
    transform: scale(1.04);
}


/* =========================================================
   LARGER LOGOS
   ========================================================= */

.organizers img[width="200px"] {
    width: auto !important;
    max-width: 160px !important;
    max-height: 65px;
}


/* =========================================================
   FIRST / MAIN PARTNER GROUP
   ========================================================= */

.organizers>.container>.row>.col-md-12 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}


/* =========================================================
   GROUP SEPARATION
   ========================================================= */

/* The first two groups */
.organizers .text-center>.row:first-child {
    margin-bottom: 10px;
}

/* Main partner groups */
.organizers .text-center>.row {
    row-gap: 15px;
}


/* =========================================================
   SPECIAL GROUPS WITH MANY LOGOS
   ========================================================= */

.organizers .text-center.row {
    width: 100%;
}

.organizers .text-center.row .col-auto {
    max-width: 100%;
}


/* =========================================================
   REMOVE DEFAULT LIST SPACING
   ========================================================= */

.organizers .list-inline-item {
    margin-right: 0 !important;
}


/* =========================================================
   HOVER SHADOW OVERRIDE
   ========================================================= */

.organizers .hvr-float-shadow {
    box-shadow: none;
}

.organizers .hvr-float-shadow:hover {
    box-shadow: none;
}


/* =========================================================
   RESPONSIVE - TABLET
   ========================================================= */

@media (max-width: 991px) {

    .organizers {
        padding: 35px 0 40px;
    }

    .organizers .col-auto {
        margin-bottom: 20px;
    }

    .organizers ul.list-inline>li>a {
        width: 165px;
        min-height: 85px;
        padding: 10px 14px;
    }

    .organizers ul.list-inline>li>a img {
        max-width: 135px;
        max-height: 58px;
    }

}


/* =========================================================
   RESPONSIVE - MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .organizers {
        padding: 30px 12px 35px;
    }

    .organizers .col-md-12 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* .organizers .col-auto {
        width: 100%;
        max-width: 100%;
        margin-bottom: 25px;
    } */

    .organizers h5 {
        font-size: 13px;
        margin-bottom: 14px;
    }

    .organizers ul.list-inline {
        gap: 10px;
    }

    .organizers ul.list-inline>li>a {
        width: 145px;
        min-height: 78px;
        padding: 9px 12px;
        border-radius: 8px;
    }

    .organizers ul.list-inline>li>a img {
        max-width: 120px;
        max-height: 52px;
    }

    .organizers img[width="200px"] {
        max-width: 125px !important;
        max-height: 52px;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 480px) {

    .organizers {
        padding: 25px 8px 30px;
    }

    .organizers ul.list-inline {
        gap: 8px;
    }

    .organizers ul.list-inline>li>a {
        width: 135px;
        min-height: 72px;
        padding: 8px 10px;
    }

    .organizers ul.list-inline>li>a img {
        max-width: 110px;
        max-height: 48px;
    }

    .organizers h5 {
        font-size: 12px;
        letter-spacing: 0.5px;
    }

}