/* ************************* MEDIA SCREEN ************************* */

@media (min-width: 860px) {
    .content-md {
        max-width: 860px;
        margin: 0 auto;
    }
}

@media (min-width: 1250px) {
    .container {
        max-width: 1250px;
    }
}

@media (min-width: 1200xpx) and (max-width:1499.98px) {
    #highlight-top {
        background-size: 100%;
    }
}

/* ************************* XX-Large (Desktop) ************************* */
@media (min-width: 992px) {
    .navbar-expand-lg .navbar-nav .dropdown-menu {
        background-color: #30343c;
    }
    .pdl-35 {
        padding-left: 35px;
    }
    .pdr-35 {
        padding-right: 35px;
    }
    .pdl-0 {
        padding-left: 0;
    }
    .pdr-0 {
        padding-right: 0;
    }
    .onlyPC {
        display: block !important;
    }
    #navbar_main .nav-item ul {
        display: none;
        visibility: hidden;
        position: absolute;
        top: 55px;
        left: 0;
        width: 200px;
        background-color: var(--dark);
        border-radius: 10px;
        padding-left: 0;
        transition: all 0.3s ease;
    }
    #navbar_main .nav-item:hover>ul {
        display: block;
        visibility: visible;
        top: 35px;
    }
    .logo-mobile {
        display: none;
    }
}


/* ************************* Medium Devices (Tablets) ************************* */

@media (max-width: 991.98px) {
    #btn-menu {
        margin-right: 10px;
        position: relative;
        z-index: 4;
        background: none;
        border: none;
        transition: all 0.2s ease;
    }
    .onlyMobile #dropLang {
        position: relative;
        top: -3px !important;
        right: 45px;
    }
    .onlyMobile {
        display: block !important;
    }
    #navbar_main .nav-item ul li a {
        font-family: var(--font_m) !important;
        color: var(--text-d) !important;
        font-size: 12px !important;
        padding: 7px 15px !important;
    }
    #navbar_main .nav-item ul li {
        width: calc(100% / 2);
        float: left;
    }
    #navbar_main .nav-item ul {
        width: 100%;
        padding-left: 0;
    }
    #header {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    #navbar_main .navbar-nav .nav-item .nav-link {
        padding: 13px 0;
        color: var(--white) !important;
        font-size: 20px;
    }
    #navbar_main .navbar-nav {
        margin-top: 10px;
    }
    #navbar_main .navbar-nav .active .nav-link {
        color: var(--orange) !important;
    }
    #navbar_main .navbar-nav .nav-item .nav-link:after {
        left: -2px;
        bottom: 26px;
        width: 20px;
        border-radius: 0;
    }
    #sign .btn-a {
        padding: 5px 50px 5px 20px !important;
    }
    #sign .btn-a img {
        width: 24px;
        height: 24px;
        top: 5px;
        right: 5px;
    }
    .btn-close {
        padding: 10px !important;
        margin-top: 0 !important;
    }
    .navbar-brand {
        display: block;
        padding: 20px 0;
    }
    .navbar-brand img {
        margin-top: 10px;
        margin-left: 18px;
        width: 150px;
    }
    .logo-brand {
        display: none;
    }
    #header {
        animation-fill-mode: none;
        padding: 15px;
    }
    #header .float-end {
        margin-top: 7px;
    }
    .container-fluid {
        overflow-x: hidden;
    }
    .offcanvas-header {
        display: block;
    }
    .mobile-offcanvas {
        visibility: hidden;
        transform: translateX(-100%);
        border-radius: 0;
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        background: var(--dark_2);
        height: 2000%;
        z-index: 10;
        width: 80%;
        box-shadow: 5px 0px 15px rgba(0, 14, 87, 0.7);
        overflow-y: scroll;
        overflow-x: hidden;
        transition: visibility 0.3s ease-in-out, transform 0.3s ease-in-out;
    }
    .mobile-offcanvas.show {
        visibility: visible;
        transform: translateX(0);
    }
    .mobile-offcanvas .container,
    .mobile-offcanvas .container-fluid {
        display: block;
    }
	
	#navbar_main .btn-close{
		font-size: 21px;
		position: relative;
		top: 22px;
	}
    #btn-menu span {
        width: 27px;
        height: 2px;
        margin-bottom: 9px;
        background-color: #fff;
        display: block;
    }
    #btn-menu img {
        width: 32px;
        height: 32px;
    }
    .logo-mobile img {
        max-width: 140px;
        margin-top: 5px;
    }
    .sticky {
        padding: 12px 15px !important;
        background: rgba(122, 90, 126, 0.2);
        border-bottom: 0;
    }
    #navbar_main {
        background: linear-gradient(to bottom, #241646 0%, #0A0221 100%);
        background-size: 230px;
    }
}

@media (max-width: 1200px) {
    .slick-slide {
        padding-top: 0px;
    }
    .slick-slide.slick-active {
        padding-top: 0px;
    }
}


/* ************************* Options Devices (All Devices) ************************* */

@media (min-width: 768px) {
    .custom-select-container {
        display: none !important;
    }
}

@media (max-width: 767.98px) {
	#project .select-trigger{
		padding:14px 13px 14px 15px;
	}
	
	#project .select-trigger img{
		margin-right:5px;
	}
	
	.infor-tab p{
		font-size:16px;
		bottom:6px;
		line-height:22px;
	}
	
    #project{
        padding-bottom:60px;
    }
    
    .carousel-tier-fund .carousel-control-next, .carousel-tier-fund .carousel-control-prev{
        width:20%;
    }
    
    .carousel-tier-fund .carousel-indicators{
        right:0;
        left:0;
        bottom:-25px;
    }
    
    .carousel-tier-fund{
        margin-left:0;
    }
    
    #project .align-items-start {
        display: block !important;
    }
    #v-pills-tab {
        width: 100%;
        display: block !important;
        position: relative;
        z-index: 2;
        padding: 0;
        margin-bottom: 20px;
    }
    .nav-pills .nav-link img {
        display: block;
        margin: 0 auto;
    }
    .nav-pills .nav-link {
        width: 50%;
        float: left;
        text-align: center;
        padding: 20px 10px !important;
    }
    .infor-tab {
        float: none;
        max-width: 100%;
    }
    #sign {
        display: block !important;
    }
    #sign .btn-action {
        float: left;
        font-family: var(--font_b);
        font-size: 15px;
        width: 130px;
        padding: 10px 0;
    }
    .title-section {
        padding-bottom: 40px;
    }
    footer .fanpages {
        float: none;
        text-align: center;
    }
    .order-b {
        order: 2;
    }
    .order-a {
        order: 1;
    }
    footer {
        padding-bottom: 60px;
    }
    .content-width {
        padding: 0 15px;
    }
    .space_section {
        padding: 50px 0;
    }
    #highlight-top article h1 {
        font-size: 32px;
        line-height: 42px;
    }
    #highlight-top {
        padding: 180px 0 85px;
    }
    #introduction::after {
        z-index: -1;
    }
    .title-section h2 {
        font-size: 24px;
        line-height: 1.3;
    }
    #campaign .title-section {
        margin-top: 30px;
    }
    .row-cols-5 .col {
        width: 100%;
    }
    .item-article .number {
        color: #918A9F;
        font-size: 20px;
        margin-top: 10px;
    }
    .item-article {
        margin-top: 0;
        margin-bottom: 20px;
        width: 100%;
        display: flex;
        align-items: center;
        border-radius: 0;
        background: none;
        border: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        gap: 20px;
        padding: 0 0 10px;
    }
    .row-cols-5 .col:last-child .item-article {
        border-bottom: 0;
        margin-bottom: 0;
    }
    .item-article h6 {
        font-size: 14px;
        text-align: left;
        line-height: 1.6;
    }
    .item-article .p-img {
        margin: 0;
        width: 48px;
        height: 48px;
        padding: 8px;
    }
    .item-article .p-img img {
        width: 32px;
        height: 32px;
    }
    .img-kols {
        width: 100%;
        margin-top: -140px;
        margin-left: 0;
    }
    .bg-content {
        margin-top: 100px;
        background: linear-gradient(135deg, #180D36 0%, #0E0622 100%);
    }
    .box-content-pill article {
        padding: 20px;
    }
    #our-team article {
        margin: 0 auto 20px;
    }
    #our-team .title-section {
        text-align: center !important;
    }
    #our-team article h5 {
        font-size: 18px;
    }
    #our-team article p {
        font-size: 14px;
        line-height: 26px;
    }
    #our-team article .desc {
        padding: 15px;
    }
    .box-content-pill article ul li {
        padding: 15px 10px !important;
    }
    .box-content-pill article ul li span {
        font-size: 15px !important;
    }
    .form-mail {
        margin-top: 20px;
        padding: 20px;
    }
    .modal-content {
        padding: 20px;
    }
    .modal-content .modal-body {
        padding: 0;
    }
    .modal-content .btn-close {
        position: absolute;
        right: 0;
        width: 20px;
        height: 20px;
        padding: 7px !important;
        z-index: 4;
    }
    .contact .title-section h3 {
        font-size: 24px;
		text-transform:none;
		font-family:var(--font_s);
    }
	
	.contact .title-section img{
		display:none;
	}
	
	#launchpad{
		background-size: 700px;
	}	
	
	#v-pills-tabContent{
		margin-top:25px;
	}

    #pills-tab .nav-item .nav-link img {
        margin-right: 5px !important;
        display: inline !important;
    }
    #pills-tab .nav-item .nav-link {
        margin-bottom: 12px;
        text-align: left;
        padding-left: 25px !important;
    }
    .carousel-caption {
        position: static;
        border-radius: 0;
    }
    .bg-dark-logo img {
        width: 170px;
        display: block;
        margin: 0 auto;
    }
}

@media (max-width: 500px) {
    .box-item {
        background: none;
        border: 0px;
        border-radius: 0px;
    }
    .box-item>img {
        position: relative;
        border: 1px solid #3D1AB9;
        border-radius: 24px;
    }
    .box-item p {
        padding: 16px 12px;
		border-radius: 5px;
        border-left: 3px solid #DB26F9;
    }
    .carousel-caption.custome {
        right: 0;
        left: 0;
        position: relative;
        padding: 0px;
        bottom: 0;
        margin-top: 18px;
    }
    .carousel-caption.custome p span {
        font-size: 16px;
    }
    .carousel-caption.custome p small {
        margin-top: 8px;
    }
    .carousel-caption.custome .bg-dark-logo img {
        border-radius: 0px;
        top: 0px;
        position: absolute;
        right: 0px;
        height: 32px;
        width: auto;
        background: #1A0F34;
		padding:8px 16px;
    }
}