@font-face {
    font-family: 'TiemposHeadlineWeb-medium';
    src: url(../fonts/TiemposHeadlineWeb-Medium.woff) format('woff');
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: 'PoppinsLight';
    src: url(../fonts/Poppins-Light.ttf);
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: 'PoppinsMedium';
    src: url(../fonts/Poppins-Medium.ttf);
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: 'PoppinsRegular';
    src: url(../fonts/Poppins-Regular.ttf);
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: 'PoppinsBold';
    src: url(../fonts/Poppins-Bold.ttf);
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: 'geomanistBlack';
    src: url(../fonts/geomanistBlack.eot);
    src: url(../fonts/geomanistBlack.woff) format("woff"),
    url(../fonts/geomanistBlack.ttf) format("truetype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: 'geomanistRegular';
    src: url(../fonts/geomanist-regular.woff) format("woff"),
    url(../fonts/geomanist-regular.ttf) format("truetype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: 'geomanistBold';
    src: url(../fonts/geomanistBold.eot);
    src: url(../fonts/geomanistBold.woff) format("woff"),
    url(../fonts/geomanistBold.ttf) format("truetype");
    font-style: normal
}
body{
    font-family: 'PoppinsRegular';

}
h1, h2, h3, h4, h5, h6 {
    font-family: 'TiemposHeadlineWeb-medium';
}

.mapSVG svg {
    width: 100%;
    max-width: 100% !important;
    height: auto;
    display: block;
}

.enabled {
    fill: #21669E;
    cursor: pointer;
}

.description {
    pointer-events: none;
    position: fixed;
    font-size: 16px;
    text-align: center;
    background: white;
    padding: 10px 15px;
    z-index: 5;
    /* height: 30px; */
    line-height: 30px;
    margin: 0 auto;
    color: #21669e;
    border-radius: 5px;
    box-shadow: 0 0 0 1px #eee;
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    display: none;
}

.carousel-section {
    overflow: hidden;
}

.carousel-section
.slick-list {
    overflow: visible;
}

.navbar-brand img {
    max-width: 206px;
}

.articlePage h1,
.articlePage h2,
.articlePage h3,
.articlePage h4,
.articlePage h5,
.articlePage h6,
.articlePage div,
.articlePage p,
.articlePage ul,
.articlePage blockquote,
.articlePage span {
    max-width: 800px;
    margin: auto;
}

.articlePage img {
    max-width: 100%;
    margin: 15px 0;
}

.yemen {
    display: inline-block;
    width: 40px;
    height: 8px;
    background-color: #ce1126;
    box-shadow: 0em 8px 0em 0em white, 0em 16px 0em 0em black;
}
.coursesListContainer {
    background: #2a276a;
}

.coursesListContainer .coursesList:nth-child(2) {
    background: rgba(103, 114, 229, .05);
}

.coursesListContainer .coursesList:nth-child(3) {
    background: rgba(103, 114, 229, .1);
}

.coursesListContainer .coursesList:nth-child(4) {
    background: rgba(103, 114, 229, .15);
}

.coursesListContainer .coursesList:nth-child(5) {
    background: rgba(103, 114, 229, .20);
}

.coursesListContainer .coursesList:nth-child(6) {
    background: rgba(103, 114, 229, .25);
}

.coursesListContainer .coursesList:nth-child(7) {
    background: rgba(103, 114, 229, .30);
}

.coursesListContainer .coursesList:nth-child(8) {
    background: rgba(103, 114, 229, .35);
}

.coursesListContainer .coursesList:nth-child(9) {
    background: rgba(103, 114, 229, .40);
}

.coursesListContainer .coursesList:nth-child(10) {
    background: rgba(103, 114, 229, .45);
}

.coursesListContainer .coursesList:nth-child(11) {
    background: rgba(103, 114, 229, .50);
}

.coursesListContainer .coursesList:nth-child(12) {
    background: rgba(103, 114, 229, .55);
}

.coursesList li .courseTooltip {
    position: absolute;
    left: -10px;
    right: -10px;
    top: 0;
    background-color: #fff;
    border-radius: 4px;
    -webkit-box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08);
    box-shadow: 0 7px 14px rgba(50, 50, 93, .1), 0 3px 6px rgba(0, 0, 0, .08);
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    -webkit-transition-duration: .15s;
    transition-duration: .15s;
    -webkit-transition-timing-function: ease-in-out;
    transition-timing-function: ease-in-out;
    pointer-events: none;
    opacity: 0;
    -webkit-transform: translateY(-100%) scale(.75);
    transform: translateY(-100%) scale(.75);
    -webkit-transform: translateY(calc(-100% + 10px)) scale(.75);
    transform: translateY(calc(-100% + 10px)) scale(.75);
    -webkit-transform-origin: 20px calc(100% + 12px);
    transform-origin: 20px calc(100% + 12px);
    color: #000;
    padding: 15px 20px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.5em;
    max-width: 350px;

}

.courseTooltip:before {
    content: "";
    position: absolute;
    bottom: -6px;
    left: 25px;
    width: 12px;
    height: 12px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    border-radius: 0 0 4px 0;
    background-color: inherit;
    -webkit-box-shadow: 3px 3px 5px rgba(82, 95, 127, .04);
    box-shadow: 3px 3px 5px rgba(82, 95, 127, .04);
}

.coursesList li:hover .courseTooltip {
    opacity: 1;
    -webkit-transition-timing-function: cubic-bezier(.165, .84, .44, 1);
    transition-timing-function: cubic-bezier(.165, .84, .44, 1);
    -webkit-transform: translateY(calc(-100% - 5px));
    transform: translateY(calc(-100% - 5px));
}
.coursesList {
    padding: 100px 0;
    color: #fff;
}
.coursesList li {
    line-height: 2;
    list-style: circle;
    /* opacity: 0.8; */
    color: #fff;
}
.coursesList li a:hover {
    color: #ccc;
}
.coursesList li a {
    color: #fff;
    font-size: 16px;
}.yearCoursesPage {
     background-image: url(../img/pattern.png);
     background-repeat: repeat-x;
     background-size: 750px;
     background-position: center bottom;
 }