@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700,700i,900');

:root {
    /*COLORS*/
    --light: rgb(252, 251, 250);
    --dark: #000929;
    --clr-1: #1b273d;;
    --clr-2: #554bb9;
    --clr-3: rgb(248, 163, 6);
    --clr-4: rgb(241, 185, 80);
    --clr-5: rgb(213, 199, 166);
    --clr-6: rgb(102, 124, 148);
    --clr-7: rgb(250, 251, 252);
}

body { 
    overflow-x: hidden !important;
    width: 100% !important;
    color: var(--dark);
    position: relative;
}

* {
    font-family: 'Poppins', sans-serif !important;
}

.btn,
.form-control {
    border: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

::selection {
    color: #fff;
    background: var(--clr-2); /* WebKit/Blink Browsers */
}

::-moz-selection {
    color: #fff;
    background: var(--clr-2); /* Gecko Browsers */
}

/** COLORS **/

.clr-light {
    color: var(--light) !important;
}

.clr-dark {
    color: var(--dark) !important;
}

.clr-1 {
    color: var(--clr-1) !important;
}

.clr-2 {
    color: var(--clr-2) !important;
}

.clr-3 {
    color: var(--clr-3) !important;
}

.clr-4 {
    color: var(--clr-4) !important;
}

.clr-5 {
    color: var(--clr-5) !important;
}

.clr-6 {
    color: var(--clr-6) !important;
}

.clr-7 {
    color: var(--clr-7) !important;
}

/** BACKGROUNDS **/

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

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

.bg-1 {
    background: var(--clr-1) !important;
}

.bg-2 {
    background: var(--clr-2) !important;
}

.bg-3 {
    background: var(--clr-3) !important;
}

.bg-4 {
    background: var(--clr-4) !important;
}

.bg-5 {
    background: var(--clr-5) !important;
}

.bg-6 {
    background: var(--clr-6) !important;
}

.bg-7 {
    background: var(--clr-7) !important;
}

/** Text Formating **/

.weight-100 {
    font-weight: 100;
}

.weight-200 {
    font-weight: 200;
}

.weight-300 {
    font-weight: 300;
}

.weight-400 {
    font-weight: 400;
}

.weight-500 {
    font-weight: 500;
}

.weight-600 {
    font-weight: 600;
}

.weight-700 {
    font-weight: 700;
}

.weight-800 {
    font-weight: 800;
}

.weight-900 {
    font-weight: 900;
}

/** Padding Formating **/
.p-10 {
    padding: 10px;
}

.p-20 {
    padding: 20px;
}

.p-30 {
    padding: 30px;
}

.p-40 {
    padding: 40px;
}

.p-50 {
    padding: 50px;
}

.p-60 {
    padding: 60px;
}

.p-70 {
    padding: 70px;
}

.p-80 {
    padding: 80px;
}

.p-90 {
    padding: 90px;
}

.p-100 {
    padding: 100px;
}

.p-150 {
    padding: 150px;
}

.p-200 {
    padding: 200px;
}

.pt-10 {
    padding-top: 10px;
}

.pt-20 {
    padding-top: 20px;
}

.pt-30 {
    padding-top: 30px;
}

.pt-40 {
    padding-top: 40px;
}

.pt-50 {
    padding-top: 50px;
}

.pt-60 {
    padding-top: 60px;
}

.pt-70 {
    padding-top: 70px;
}

.pt-80 {
    padding-top: 80px;
}

.pt-90 {
    padding-top: 90px;
}

.pt-100 {
    padding-top: 100px;
}

.pt-150 {
    padding-top: 150px;
}

.pt-200 {
    padding-top: 200px;
}

.pb-10 {
    padding-bottom: 10px;
}

.pb-20 {
    padding-bottom: 20px;
}

.pb-30 {
    padding-bottom: 30px;
}

.pb-40 {
    padding-bottom: 40px;
}

.pb-50 {
    padding-bottom: 50px;
}

.pb-60 {
    padding-bottom: 60px;
}

.pb-70 {
    padding-bottom: 70px;
}

.pb-80 {
    padding-bottom: 80px;
}

.pb-90 {
    padding-bottom: 90px;
}

.pb-100 {
    padding-bottom: 100px;
}

.pb-150 {
    padding-bottom: 150px;
}

.pb-200 {
    padding-bottom: 200px;
}

.pl-10 {
    padding-top: 10px;
}

.pl-20 {
    padding-top: 20px;
}

.pl-30 {
    padding-top: 30px;
}

.pl-40 {
    padding-top: 40px;
}

.pl-50 {
    padding-top: 50px;
}

.pl-60 {
    padding-top: 60px;
}

.pl-70 {
    padding-top: 70px;
}

.pl-80 {
    padding-top: 80px;
}

.pl-90 {
    padding-top: 90px;
}

.pl-100 {
    padding-top: 100px;
}

.pl-150 {
    padding-top: 150px;
}

.pl-200 {
    padding-top: 200px;
}

.pr-10 {
    padding-right: 10px;
}

.pr-20 {
    padding-right: 20px;
}

.pr-30 {
    padding-right: 30px;
}

.pr-40 {
    padding-right: 40px;
}

.pr-50 {
    padding-right: 50px;
}

.pr-60 {
    padding-right: 60px;
}

.pr-70 {
    padding-right: 70px;
}

.pr-80 {
    padding-right: 80px;
}

.pr-90 {
    padding-right: 90px;
}

.pr-100 {
    padding-right: 100px;
}

.pr-150 {
    padding-right: 150px;
}

.pr-200 {
    padding-right: 200px;
}


/** Margin Formating **/
.m-10 {
    margin: 10px;
}

.m-20 {
    margin: 20px;
}

.m-30 {
    margin: 30px;
}

.m-40 {
    margin: 40px;
}

.m-50 {
    margin: 50px;
}

.m-60 {
    margin: 60px;
}

.m-70 {
    margin: 70px;
}

.m-80 {
    margin: 80px;
}

.m-90 {
    margin: 90px;
}

.m-100 {
    margin: 100px;
}

.m-150 {
    margin: 150px;
}

.m-200 {
    margin: 200px;
}

.mt-10 {
    margin-top: 10px;
}

.mt-20 {
    margin-top: 20px;
}

.mt-30 {
    margin-top: 30px;
}

.mt-40 {
    margin-top: 40px;
}

.mt-50 {
    margin-top: 50px;
}

.mt-60 {
    margin-top: 60px;
}

.mt-70 {
    margin-top: 70px;
}

.mt-80 {
    margin-top: 80px;
}

.mt-90 {
    margin-top: 90px;
}

.mt-100 {
    margin-top: 100px;
}

.mt-150 {
    margin-top: 150px;
}

.mt-200 {
    margin-top: 200px;
}

.mb-10 {
    margin-bottom: 10px;
}

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

.mb-30 {
    margin-bottom: 30px;
}

.mb-40 {
    margin-bottom: 40px;
}

.mb-50 {
    margin-bottom: 50px;
}

.mb-60 {
    margin-bottom: 60px;
}

.mb-70 {
    margin-bottom: 70px;
}

.mb-80 {
    margin-bottom: 80px;
}

.mb-90 {
    margin-bottom: 90px;
}

.mb-100 {
    margin-bottom: 100px;
}

.mb-150 {
    margin-bottom: 150px;
}

.mb-200 {
    margin-bottom: 200px;
}

.ml-10 {
    margin-top: 10px;
}

.ml-20 {
    margin-top: 20px;
}

.ml-30 {
    margin-top: 30px;
}

.ml-40 {
    margin-top: 40px;
}

.ml-50 {
    margin-top: 50px;
}

.ml-60 {
    margin-top: 60px;
}

.ml-70 {
    margin-top: 70px;
}

.ml-80 {
    margin-top: 80px;
}

.ml-90 {
    margin-top: 90px;
}

.ml-100 {
    margin-top: 100px;
}

.ml-150 {
    margin-top: 150px;
}

.ml-200 {
    margin-top: 200px;
}

.mr-10 {
    margin-right: 10px;
}

.mr-20 {
    margin-right: 20px;
}

.mr-30 {
    margin-right: 30px;
}

.mr-40 {
    margin-right: 40px;
}

.mr-50 {
    margin-right: 50px;
}

.mr-60 {
    margin-right: 60px;
}

.mr-70 {
    margin-right: 70px;
}

.mr-80 {
    margin-right: 80px;
}

.mr-90 {
    margin-right: 90px;
}

.mr-100 {
    margin-right: 100px;
}

.mr-150 {
    margin-right: 150px;
}

.mr-200 {
    margin-right: 200px;
}


.shadow-1 {
    --webkit-box-shadow: 0 10px 20px -12px rgba(0, 0, 0, .42), 0 3px 20px 0 rgba(0, 0, 0, .12), 0 8px 10px -5px rgba(0, 0, 0, .2);
    -o-box-shadow: 0 10px 20px -12px rgba(0, 0, 0, .42), 0 3px 20px 0 rgba(0, 0, 0, .12), 0 8px 10px -5px rgba(0, 0, 0, .2);
    box-shadow: 0 10px 20px -12px rgba(0, 0, 0, .42), 0 3px 20px 0 rgba(0, 0, 0, .12), 0 8px 10px -5px rgba(0, 0, 0, .2);
}

/** Links Formating **/
a {
    color: var(--clr-2);
    text-decoration: none;
    background-color: transparent;
}

a:hover,
button:hover,
button:focus {
    color: var(--clr-3);
    text-decoration: none !important;
}


section.dark {
    color: var(--light);
}


/* NAVBAR */
.nav-main-container-fake {
    height: 80px;
    background: var(--dark);
}
nav.main .navbar-brand img {
    max-height: 60px;
}

nav.main.scroll {
    background: var(--dark);
    --webkit-box-shadow: 0 10px 20px -12px rgba(0, 0, 0, .42), 0 3px 20px 0 rgba(0, 0, 0, .12), 0 8px 10px -5px rgba(0, 0, 0, .2);
    -o-box-shadow: 0 10px 20px -12px rgba(0, 0, 0, .42), 0 3px 20px 0 rgba(0, 0, 0, .12), 0 8px 10px -5px rgba(0, 0, 0, .2);
    box-shadow: 0 10px 20px -12px rgba(0, 0, 0, .42), 0 3px 20px 0 rgba(0, 0, 0, .12), 0 8px 10px -5px rgba(0, 0, 0, .2);
    transition: 1s all ease ;
}

nav.main .nav-link {
    color: rgba(255,255,255,.8);
    font-weight: 600;
    text-transform: uppercase;
    position: relative;
}
nav.main .nav-link:before,
nav.main .nav-link.active:before
{
    transform: scaleX(0);
    width: 0;
    transition: 0.3s all ease;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: -1;
    content: '';
}
nav.main .nav-link:hover:before,
nav.main .nav-link.active:before
{
    left: 0;
    bottom: 19px;
    width: 100%;
    height: 3px;
    background: #e62f92;
    position: absolute;
    transform: scaleX(1);
    z-index: -1;
}

nav.main .nav-link.active,
nav.main .nav-link:hover {
    color: var(--light);
}


.main .navbar-toggler,
.main .navbar-toggler:focus,
.main .navbar-toggler:active {
    outline: 0;
    position: relative;
    border: 0;
}

.main .navbar-toggler span {
    display: block;
    background-color: #fff;
    height: 3px;
    width: 25px;
    margin-top: 4px;
    margin-bottom: 4px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    position: relative;
    left: 0;
    opacity: 1;
}

.main .navbar-toggler span:nth-child(1),
.main .navbar-toggler span:nth-child(3) {
    -webkit-transition: transform .35s ease-in-out;
    -moz-transition: transform .35s ease-in-out;
    -o-transition: transform .35s ease-in-out;
    transition: transform .35s ease-in-out;
}

.main .navbarPlus::after {
    display: none;
}

.main .navbar-toggler:not(.collapsed) span:nth-child(1) {
    position: absolute;
    left: 12px;
    top: 10px;
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg);
    opacity: 0.9;
}

.main .navbar-toggler:not(.collapsed) span:nth-child(2) {
    height: 12px;
    visibility: hidden;
    background-color: transparent;
}

.main .navbar-toggler:not(.collapsed) span:nth-child(3) {
    position: absolute;
    left: 12px;
    top: 10px;
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    transform: rotate(-135deg);
    opacity: 0.9;
}

/* SECTION: GENERAL */
section.page {
    padding-bottom: 50px;
}
section .maintitle {
    color: #fff;
    font-size: 36px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 5px 15px;
    background-image: url('../img/splash-purple.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center center;
    display: table;
    margin: 50px auto 30px;
}
section .maintitle.pink {
    background-image: url('../img/splash-pink.png');
}
section .maintitle.green {
    background-image: url('../img/splash-green.png');
}
section .maintitle.orange {
    background-image: url('../img/splash-orange.png');
}
section .maintitle.white {
    background-image: url('../img/splash-white.png');
    color: var(--dark);
}
section .sub-title {
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 15px;
}

/* SECTION: Under Header */

section.under-header {
    background: url('../img/home-bg-1.jpg') center center no-repeat;
    background-size: cover;
    min-height: 750px;
}

section.under-header .recent-events {
    padding: 200px 30px;
}

section.under-header .recent-events .first {
    padding: 20px 0;
}
section.under-header .recent-events .first .title {
    color: var(--light);
    font-size: 50px;
    line-height: 65px;
    margin-bottom: 25px;
    text-transform: uppercase;
    font-weight: 900;
    text-shadow: 0 0 15px #000;
}

#countdown {
    background: url(../img/splash-white.png) center center no-repeat;
    background-size: 100% 100%;
    display: table;
    padding: 25px 50px;
}
#countdown span {
    margin: 0 auto;
    display: table;
}
#countdown div {
    display: inline-block;
    font-weight: 400;
    margin: 5px 15px;
    text-align: center;
    text-transform: uppercase;
    position: relative;
}
#countdown div::after {
    content: ':';
    top: 10px;
    right: -15px;
    position: absolute;
}
#countdown div:last-child::after {
    content: '';
}
#countdown div > span {
    display: block;
    font-weight: 900;
    font-size: 32px;
}
#countdown .days {
    color: #fc2260;
}
#countdown .hours {
    color: #2b93ea ;
}
#countdown .minutes {
    color: #d30472;
}
#countdown .seconds {
    color: #46c1a4 ;
}

section.under-header .recent-events .first .info {
    color: var(--light);
    font-size: 18px;
    padding-top: 15px;
}
section.under-header .recent-events .first .info i {
    color: var(--clr-3);
    margin-right: 5px;
}

section.under-header .recent-events .first .btn {
    padding: 10px 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    text-transform: uppercase;
    font-weight: 600;
    margin-top: 20px;
} 
	
section.under-header .recent-events .poster img { 
    transform: perspective(300px) rotateY(-9deg);
    max-height: 500px;
    max-width: 100%;
    border: 10px solid var(--clr-2);
    box-shadow: 0 10px 20px -12px rgba(0, 0, 0, .42), 0 3px 20px 0 rgba(0, 0, 0, .12), 0 8px 10px -5px rgba(0, 0, 0, .2);
}

p {
    font-size: 16px !important;
}


/* EVENTS */

section.events .about p {
    padding: 5px 20px;
}

section.events .items {

    background: var(--light);
    padding: 30px 20px;
}

section.events .item {
    background: #fff;
    display: table;
    border: 1px solid #ddd;
    width: 100%;
    padding: 20px;
    margin-bottom: 20px;
}
section.events .item:hover,
section.events .item:focus
{
    background-image: -moz-linear-gradient(0deg, #fc5c62 0%, #fdad65 100%);
    background-image: -webkit-linear-gradient(0deg, #fc5c62 0%, #fdad65 100%);
    background-image: -ms-linear-gradient(0deg, #fc5c62 0%, #fdad65 100%);
}
section.events .item:hover .left,
section.events .item:hover a
{
    color: var(--light) !important;
}
section.events .item:hover .left span  {
    border-color: var(--light);
}

section.events .item .left {
    float: left;
    width: 25%;
    text-align: center;
    border-right: 1px solid #ddd;
}
section.events .item .left span {
    font-weight: 600;
    font-size: 30px;
    border-bottom: 2px solid var(--clr-3);
}
section.events .item .left p {
    margin-top: 10px;
}

section.events .item .right {
    float: right;
    width: 75%;
    padding: 0 20px;
}
section.events .item .right .time {
    padding-bottom: 10px;
    text-transform: uppercase;
}

section.events .item .right .title {
    font-size: 24px;
    font-weight: 400;
}

/* SECTION: News */
section.news {
    margin-top: 50px;
    margin-bottom: 50px;
}
section.news .item {
    padding: 0 35px;
}
section.news .card {
    position: relative;
    border: 0;
    margin-top: 70px;
    margin-bottom: 50px;
}

section.news .corner-dots {
    background: #333;
    position: absolute;
    width: 90px;
    height: 90px;
    top: -50px;
    left: -30px;
    background: -webkit-radial-gradient(#ccc 10%, transparent 20%);
    background-size: auto auto;
    background-size: 15px 15px;
    z-index: 0;
}
section.news .date {
    position: absolute;
    z-index: 9;
    top: -33px;
    height: 70px;
    width: 70px;
    background-color: #e62f92;
    left: 20px;
    text-align: center;
    color: #fff;
    padding-top: 12px;
    font-weight: 700;
    font-size: 17px;
}
section.news .card img {
    z-index: 1;
    height: 200px;
}
section.news .card .card-body {
    padding: 25px 0;
}
section.news .card p {
    padding: 5px 0;
}

section.news .card a {
    text-transform: uppercase;
    color: var(--dark);
}

/* SECTION: Contact */

section.contact {
    background: #17daa8;
    padding-bottom: 70px;
}
section.contact .form {
    margin-top: 20px;
}
section.contact textarea {
    min-height: 50px;
    max-height: 100px;
}
section.contact .btn{
    padding: 10px 50px;
}


section.contact .info .title {
    font-weight: 600;
    margin-bottom: 22px;
    font-size: 18px;
    margin-top: 20px;
}
section.contact .info .address {
    font-weight: 600;
    margin-bottom: 22px;
    font-size: 18px;
}



/* SECTION: Blog */

section.blog {
    padding-top: 100px;
}
section.blog .blog-owl .item {
    position: relative;
    display: block;
}
section.blog .blog-owl .item .layer {
    position: absolute;
    left: 10px;
    top: 10px;
    right: 10px;
    bottom: 10px;
    background: rgba(62,15,88,.75);
    opacity: 0;
    transition: 0.3s all ease;
}
section.blog .blog-owl .item:hover .layer  {
    opacity: 1;
}
section.blog .blog-owl .item .layer p {
    margin: 100px auto 20px;
    display: table;
    color: #fff;
}
section.blog .blog-owl .item .layer a {
    margin: 0 auto;
    display: table;
    border-radius: 50px;
    padding: 10px 30px;
    text-transform: uppercase;
    font-size: 14px;
}
section.blog .blog-owl .item img {
    height: 300px;
}
section.blog .owl-dots {
    display: none !important;
}

/* SECTION: Partners */

section.partners {
    padding-top: 50px;
    padding-bottom: 100px;
    background: #f9f9f9;
}

section.partners .item .box {
    padding: 20px;
    border: 1px solid #cdcdcd;
    height: 120px;
    position: relative;
    line-height: 80px;
    margin-bottom: 20px;
}
section.partners .item img {
    height: auto;
    width: auto;
    max-width: 100%;
    max-height: 100%;
    vertical-align: middle;
    display: table;
    margin: 0 auto;
}




/* PAGINATION */

#pagination {
    margin-top: 20px;
    padding-top: 20px;
    background: var(--clr-7);
}
#pagination .page-link {
    position: relative;
    display: block;
    padding: 8px 17px;
    margin-left: -1px;
    line-height: 1.25;
    color: var(--clr-1);
    background-color: #fff;
    border: 0;
    font-weight: 600;
}
#pagination .page-link:hover {
    color: var(--clr-1);
    background-color: var(--clr-7);
}
#pagination .page-item.active .page-link {
    z-index: 1;
    color: #fff;
    background-color: var(--clr-2);
    border-color: var(--clr-2);
    box-shadow: 0px 2px 4px rgba(100,100,100,.3);
}

.social-shares {
    margin: 10px 0;
}

.social-shares i {
    font-size: 22px;
    margin-left: 10px;
}


/* FOOTER */

footer {
    background: url('../img/footer-bg.jpg') center center no-repeat;
    background-size: cover;
}

footer p {
    color: #c2b9ea;
}

footer span {
    margin: 0 10px;
}

footer .social-icons a {
    padding: 4px;
    display: inline-block;
    text-align: center;
    width: 40px;
    height: 40px;
    margin-right: 10px;
    background: rgba(255, 255, 255, .4);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    color: var(--clr-2);
    font-size: 20px;
}

footer .social-icons a:hover {
    background: rgba(255, 255, 255, .7);
}

footer .copyright {
    margin-top: 50px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, .15);
    text-align: center;
}

footer .copyright a {
    color: var(--clr-3);
}