/**
Template Name: Study Point - Creative Multi-Purpose Education Theme
Author: Crescent Theme
Email: crescenttheme@gmail.com
File: style.css
**/
/* =============
  == Table of Contents==

      01. Custom Css 
      02. Home page Generic css start
          01. slider css start
          02. navbar top css start
          03. welcome to university section start Css
          04. Register section start Css
          05. our teachers section css start
          06. latest news  section start css
          07. our newsletter section start css
          03. footer section start css
      03. coures page css start   
      04. teacher page css start
      05.event page css start
      06.blog gird page start
      07.contact us page start
      08.gallery page start

  ============= */
/*==========Custom-css-start==========*/
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
html,
body {
    font-size: 16px;
    background-color: #ffffff;
    font-family: 'Source Sans Pro';
    height: 96%;
    color: #111111;
    font-weight: 400;
    scroll-behavior: smooth;
}
::-moz-selection {
    /* Code for Firefox */
    
    background: #FAB205;
    color: #111111;
}
::selection {
    background: #F2184F;
    color: #ffffff;
}
a:hover,
a:focus {
    color: #F2184F;
    text-decoration: none;
}
* a {
    color: #111111;
    transition: all 0.3s 0s;
}
*:focus {
    outline: none !important;
}
a {
    cursor: pointer;
}
p {
    line-height: 1.6;
    margin: 0;
}
section {
    /* padding: 60px 0; */
    padding: 30px 0;
    scroll-margin-top: 4.9rem;
}
/* li {
    list-style: none;
} */
ul {
    padding: 0;
}
.m-r-5 {
    margin-right: 5px;
}
.m-l-10 {
    margin-left: 10px;
}
.m-t-10 {
    margin-top: 10px;
}
.m-t-20 {
    margin-top: 20px;
}
.m-t-30 {
    margin-top: 30px;
}
.m-l-0 {
    margin-left: 0;
}
.m-b-20 {
    margin-bottom: 20px;
}
.p-t-0 {
    padding-top: 0;
}
.p-b-0 {
    padding-bottom: 0;
}
.p-t-50 {
    padding-top: 50px;
}
.p-t-b-80 {
    padding: 80px 0;
}
.img-responsive {
    width: 100%;
}

.img-responsive-icon{

    max-width:10%;


}
.img-force{
    max-width: 100%;
    max-height: 240px;
    min-height: 240px;
    /* display: block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto; */
}
.form-control:focus{
    outline: none !important;
    box-shadow: none;
    border-color: #F2184F;
}
.select-icon {
    font-family:Arial, FontAwesome;
}
.select-icon > option::before{
    color: #001A72;
  }
/*scrollup css start*/

.page-title{
    color: #ffffff !important;
    padding-top:40px;
    font-size:25pt;
}

#change_topics_upcoming{

    width:250px;


}

#change_topics{

    width:250px;


}

.id_topics{

    margin-left:-40px;


}

.id_topics_event{

    margin-left:0px;


}

.id_topics_event_past{

    margin-left:0px;


}

.media{

    /* box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px; */
  
}

.center {
    margin: 0;
    position: absolute;
    top:5%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }

.button-join-us {
    background-color:#0077B5; /* Green */
    border: none;
    color: white;
    padding: 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
    margin:center;
  }

  .buttonround {border-radius: 12px;}

.page_tital{

    font-size:20px;
    /* font-family:Source Sans Pro; */
    font-weight:normal;


}

.page_title{
    font-size:30px;
    font-weight:bold;
}

.page_title p{
    font-size: 19px;
    font-weight: 200;
}
.theme_text{

    font-weight:normal;

}
.background-image-header{
    background-color: #cccccc; 
    height: 250px;   
    background-position: 50% 60%; 
    background-repeat: no-repeat; 
    background-size: cover; 
    position: relative;
    background-image: url('https://cdn1.sisiplus.co.id/media/sisiplus/asset/uploads/banner/banner_new.jpg')!important;
}

.scrollup {
    position: fixed;
    bottom: 30px;
    right: 30px;
    display: none;
    z-index: 998;
    background: #F2184F;
    color: #fff;
    border-radius: 0;
    height: 50px;
    width: 50px;
    line-height: 50px;
    padding:0;
    color:#ffffff !important;
    transition:all 0.3s ease 0s;
}
.scrollup:hover {
    background: #202C45;
}
/*scrollup css end*/

.rounded-circle{
    border-radius: 50% !important;
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100px !important;
}

.custom_btn {
    background:#47A0F4;
    border: medium none;
    border-radius: 0;
    font-weight: 600;
    padding: 13px 35px;
    position: relative;
    text-transform: uppercase;
    transform: perspective(1px) translateZ(0px);
    transition: all 0.59s ease 0s;
    color: #ffffff;
}
.custom_btn:hover::before {
    transform: scale(1);
}
.custom_btn::before {
    background: #202C45;
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    transform: scale(0);
    transition-duration: 0.3s;
    transition-property: transform;
    transition-timing-function: ease-out;
    z-index: -1;
}
.custom_btn:hover,
.custom_btn:focus,
.custom_btn:active {
    color: #ffffff;
}
.btn.focus, .btn:focus{
    outline: none;
    box-shadow: none;
}
.profile_btn {
    background: rgba(255, 255, 255, 0.7);;
    border: medium none;
    border-radius: 0;
    font-family: OpenSans-Bold;
    padding: 10px 20px;
    color: black;
    position: relative;
    text-transform: uppercase;
    transform: perspective(1px) translateZ(0px);
    transition: all 0.59s ease 0s;
}
.profile_btn:hover::before {
    transform: scale(1);
}
.profile_btn::before {
    background: #F2184F;
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    transform: scale(0);
    transition-duration: 0.3s;
    transition-property: transform;
    transition-timing-function: ease-out;
    z-index: -1;
}
.profile_btn:hover,
.profile_btn:focus,
.profile_btn:active {
    color: #ffffff;
    background-color: #202C45;
}
.bg_grey{
    background: #f7f7f7;
}
.btn-info{
    background-color: #202C45;
    border-color: #202C45;
}
.btn-info:hover{
    background-color: #F2184F;
    border-color: #F2184F;
}
/*==========Custom-css-End==========*/
/*=====Home page Generic css start=====*/
/*====slider css start====*/

.carousel,
.item,
.active {
    height: 100%;
}
.carousel-inner {
    height: 100%;
}
/* Background images are set within the HTML using inline CSS, not here */

.banner-slide {
    /* height: 100%; */
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    /* position: relative; */
    /* min-height: 90vh; */
    position: relative;
    height: 100vh;
    background-color: lightgray;
    background-image: url('https://cdn1.sisiplus.co.id/media/sisiplus/asset/uploads/banner/banner_new.jpg')!important;
}

.banner-slide:before{
    position: absolute;
    content: "";
    background: rgba(0,0,0,0.5);
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    display: block;
}
.banner .owl-dots{
	display: none;
}
.banner-text {
    z-index: 9999;
    position: relative;
    text-align: left;
    padding:50px;
}
.carousel_txt h1 {
    margin-bottom: 35px;
}
.carousel_txt p {
    font-size: 16px;
}
.banner .owl-nav {
    position: absolute;
    left: 30px;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
}
.banner .owl-next {
    margin-left: auto;
}
.banner .owl-nav .owl-prev i:before,
.banner .owl-nav .owl-next i:before {
    box-shadow: 0px 0px 54px 0px rgba(47, 47, 47, 0.1);
    margin: 0;
    border-radius: 0;
    color: #ff1949;
    opacity: 1;
    transition: all 0.3s ease-in-out;
    font-size: 30px;
    background: #fff;
    width: 50px;
    height: 50px;
    display: inline-block;
    line-height: 50px;
}
.banner .owl-nav .owl-prev i:hover:before,
.banner .owl-nav .owl-next i:hover:before {
    background: #202C45;
    color: #ffffff;
}
/*====slider css end====*/
/*==========top header css start==========*/

.toolbar {
    background: #202C45;
    color: #ababab;
    font-size: 12px;
}
.thim-have-any-question .mobile {
    display: inline-block;
    line-height: 30px;
    margin-left: 11px;
    padding: 10px 0;
}
.toolbar a {
    font-size: 12px;
    color: #ffffff;
}
.wel_blog:hover a {
    color: #ffffff;
}
.wel_blog a:hover {
    color: #F2184F;
}
.child_login {
    color: #ffffff;
    line-height: 30px;
    padding: 10px 0;
}
.child_login a {
    border-left: 1px solid #666666;
    padding: 0 10px;
    font-weight: 700;
    color: #ffffff;
}
.child_login a:hover {
    color: #F2184F;
}
/*==========top header css end==========*/
/*==========navbar top css start==========*/

.navbar_menu {
    background: rgba(0, 0, 0, 0.8);
    border: medium none;
    padding-top: 10px;
    /* position: fixed; */
    width: 100%;
    z-index: 2;
}
.navbar_menu .navbar-brand {
    color: #ffffff;
    font-family: opensans-bold;
    font-size: 36px;
}
.carousel-caption,
.carousel-indicators {
    z-index: 1;
}
.menu_bar {
    float: right;
}
.menu_bar .nav.navbar-nav a {
    color: #ffffff;
    font-family: OpenSans-Bold;
    font-size: 16px;
    margin: 10px 0;
    padding: 0 20px;
    text-transform: capitalize;
}
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:focus,
.navbar-inverse .navbar-nav > .open > a:hover {
    background-color: transparent;
}
.menu_bar .nav.navbar-nav a:hover,
.menu_bar .nav.navbar-nav a.active {
    color: #fab205;
    background: none;
}
.menu_bar .nav.navbar-nav > li:last-child a {
    padding-right: 0px;
}
.navbar-fixed-top {
    background: #111111;
    padding: 15px;
    position: fixed;
    z-index: 9999;
}
.navbar-fixed-top .navbar-brand {
    padding-top: 10px;
}
/*==========navbar top css end==========*/
/*==========login modal css start==========*/

.modal-dialog.login_modal {
    width: 500px;
}
/*==========login modal css end==========*/
/*==========welcome to university section start Css==========*/

.tital_border {
    border: 2px solid #F2184F;
    width: 100px;
    display: inline-block;
}
.tital_border_tow {
    border: 1px solid #F2184F;
    width: 70px;
    display: inline-block;
}
.wel_blog {
    background: #F2184F none repeat scroll 0 0;
    padding: 30px 25px;
    text-align: center;
    transition: all 0.59s ease 0s;
    color: #ffffff;
}
.wel_blog .fa {
    font-size: 50px;
}
.wel_blog:hover {
    background: #202C45 none repeat scroll 0 0;
    color: #ffffff;
    cursor: pointer;
    transform: scale(1.05);
    transition: all 0.59s ease 0s;
}
.wel_blog p {
    font-size: 12px;
    min-height: 75px;
    color: #ffffff;
}
.wel_blog a{
    color: #ffffff;
}
.wel_blog:hover p {
    color: #ffffff;
}
.wel_blog h5 {
    margin: 15px 0 20px;
}

.study_block,
.study_block *{
transition: all 0.3s ease 0s;
}
.study_block {
/* border: 2px solid #202C45; */
/* padding: 100px 15px; */
margin:30px 0 0;
height: 350px;
background-repeat: no-repeat;
/* background-attachment: fixed; */
background-position: center;
}
.icon_block {
margin-top: -50px;
}
.icon_block i {
color: #202C45;
font-size: 32px;
width: 70px;
height: 70px;
line-height: 70px;
border-radius: 100px;
background: #fff;
text-align: center;
border: 2px solid #202C45;
}
.study_info h3 {
margin: 15px 0;
color: #202C45;
}
.study_info p{
    font-weight: 600;
}
.study_info .read_more {
margin-top: 20px;
display: block;
}
.study_block:hover{
border-color: #F2184F;
}
.study_block:hover .icon_block i{
border-color: #F2184F;
color: #F2184F;
}
.study_block:hover h3{
color: #F2184F;
}

/*==========Register section start Css==========*/

.register_bg {
    background-attachment: fixed;
    background-image: linear-gradient(rgba(32,44,69), rgba(0, 0, 0, 0.6)), url("../../assets/images/register_bg.png");
    background-repeat: no-repeat;
    background-size: cover;
}
.register_now > h2 {
    color: #ffffff;
    margin: 35px 0;
}
.register_now a {
    color: #F2184F;
    font-size: 28px;
}
.right_icon {
    color: #F2184F;
    font-family: "PTSerif-Italic";
    font-size: 28px;
    font-weight: 400;
    letter-spacing: 0.7px;
    margin-bottom: 50px;
}
/*=== timmer css ====*/

.clock_countdown {
    padding: 0;
}
.clock_countdown li {
    border: 2px solid #F2184F;
    display: inline-block;
    margin: 0 15px;
    padding: 20px;
    text-align: center;
    width: 17%;
}
.clock_countdown li p {
    color: #ffffff;
    font-family: opensans-bold;
    text-transform: uppercase;
    padding-top: 10px;
}
.register_now_form {
    background: #ffffff;
}
.register_title {
    background-color: #F2184F;
    border-radius: 0 0 100% 100%;
    color: #ffffff;
    line-height: 1.5;
    padding: 40px;
    text-align: center;
}
.form_det {
    padding: 40px 25px;
}
.form_det input {
    border-radius: 0;
    height: 45px;
    margin-bottom: 0;
    padding: 0 20px;
}
.form_btn {
    background-color: #202C45;
    border: medium none;
    border-radius: 0;
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    color: #ffffff;
    margin-top: 10px;
    padding: 10px 0;
    width: 100%;
    transition: all 0.59s ease 0s;
}
.form_btn:hover,
.form_btn:active,
.form_btn:focus {
    background-color: #F2184F;
    color: #ffffff;
    transition: all 0.59s ease 0s;
}
/*our teachers section css start*/

.teacher_text .profile_btn {
    margin-top: 10px;
}
.teacher_text h6 {
    color: #ababab;
    font-weight: bold;
}
.custom_hover_img::after {
    background: rgba(0, 0, 0, 0) url("../../assets/images/hover_icon.png") no-repeat scroll center center;
    content: "";
    height: 29px;
    left: 50%;
    margin-left: -14.5px;
    margin-top: -14.5px;
    opacity: 0;
    position: absolute;
    top: 50%;
    transform: scale(0);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1) 0s, opacity 0.4s ease 0s;
    width: 29px;
    z-index: 2;
}
.custom_hover_img::before {
    background: #202C45 none repeat scroll 0 0;
    content: "";
    display: block;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transform: scale(0);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1) 0s, opacity 0.4s ease 0s;
    width: 100%;
    z-index: 1;
}
.custom_hover_img:hover::before {
    opacity: 0.7;
    transform: scale(1);
}
.custom_hover_img:hover::after {
    opacity: 1;
    transform: scale(1);
}
.custom_hover_img {
    display: block;
    max-width: 100%;
    overflow: hidden;
    position: relative;
    vertical-align: top;
}
.custom_hover_img:hover img{
    transition: all 0.5s ease 0.1s;
}
.custom_hover_img:hover img{
    transform: scale(1.1)rotate(1deg);
}
.teacher_text p {
    font-family: opensans-bold;
}
.teacher_text a {
    font-size: 16px;
}
.teacher_text a:hover {
    color: #F2184F;
}
/*========== latest news  section start css==========*/

.new_blog {
    margin-bottom: 0px;
    position: relative;
}

.tanggal{

    font-size:8px;
    display:none;


}

.search_by_topik{

    margin-bottom:100px !important;


}
.news_date {
    background: #202C45 none repeat scroll 0 0;
    bottom: 0px;
    color: #ffffff;
    display: inline-block;
    left: 25px;
    padding: 10px 20px;
    position: absolute;
    z-index: 1;
}
.new_border {
    border: 2px solid #202C45;
    margin-left: 25px;
    margin-top: 10px;
}
.author_name span {
    border-left: 2px solid #ababab;
    color: #666666;
    font-family: ptserif-italic;
    font-size: 16px;
    padding: 0 20px;
}
.author_name > span:first-child {
    border: medium none;
    padding-left: 0;
}

.author_name h3 a {

   
    font-weight:bold;
    color:black;
   


}

.author_name a,
.author_name p {
    color: #666666;
}
.author_name a:hover {
    color: #202C45;
}
.author_name h5 {
    margin: 20px 0;
}
.author_name h5 a {
    color: #111111;
    font-size: 16px;
}
.news_sec .owl-nav {
    position: absolute;
    top: -70px;
    right: 0;
}

.news_sec .owl-carousel .owl-nav .owl-prev, 
.news_sec .owl-carousel .owl-nav .owl-next {
    padding: 0 0 0 10px !important;
}
.news_sec .owl-nav .owl-prev i:before, 
.news_sec .owl-nav .owl-next i:before {
    box-shadow: 0px 0px 54px 0px rgba(47, 47, 47, 0.1);
    margin: 0;
    border-radius: 0;
    color: #ff1949;
    opacity: 1;
    transition: all 0.3s ease-in-out;
    font-size: 30px;
    background: #fff;
    width: 50px;
    height: 50px;
    display: inline-block;
    line-height: 50px;
}
.news_sec .owl-nav .owl-prev i:hover:before, 
.news_sec .owl-nav .owl-next i:hover:before{
    background: #202C45;
    color:#ffffff;
}
/*========== our newsletter section start css==========*/

.newsletter_sec {
    background: #202C45;
    padding: 50px 0;
}
.newsletter_text h2,
.newsletter_text p {
    color: #ffffff;
}
.subscribe_form input {
    border: medium none;
    height: 50px;
    padding-left: 10px;
    width: 70%;
}
form.form-group.subscribe_form  .custom_btn::before{
    background: #111111;
}
.newsletter_text .tital_border {
    margin: 10px 0;
}
/*========== footer section start css==========*/

footer {
    background:  #333333;
    padding: 50px 0;
}
.footer_title h2 {
    color: #ffffff;
    font-family: opensans-regular;
    margin-bottom: 30px;
}
.footer_title > p {
    color: #ababab;
}
.social_icon li {
    display: inline-block;
}
.social_icon {
    margin-top: 30px;
}
.social_icon a {
    border: 1px solid #F2184F;
    color: #F2184F;
    display: inline-block;
    margin-right: 14px;
    padding: 8px 12px;
    font-size: 16px;
}
.social_icon a:hover {
    background-color: #F2184F;
    color: #ffffff;
}
.social_icon a i {
    transition: all 0.4s ease 0s;
}
.social_icon a:hover i {
    transform: rotate(360deg);
}
.footer_link {
    /* padding-left: 20px; */
    margin-top:40px;
    list-style: none;
}
.footer_link > li {
    margin-bottom: 20px;
}
.event_blog,
.contact_us {
    padding: 0;
}
.event_blog li {
    display: inline-block;
    margin: 0 10px 15px 0;
}
.contact_us li {
    color: #ababab;
    margin: 10px 0;
}
.footer_title a {
    color: #ababab;
    transition: all 0.3s ease 0s;
}
.contact_us a:hover,
.footer_link a:hover {
    color: #F2184F;
}
.footer_link i{
    transition: all 0.3s ease 0s;
}
.footer_link a:hover i {
    margin-right: 5px;
}
.copy_right {
    background:  #333333 none repeat scroll 0 0;
    padding: 20px 0;
    text-align: center;
}
.copy_right p {
    color: #ababab;
}
/*=====Generic css end=====*/
/*03. coures page css start*/

.header_bg,
.course_bg,
.teacher_bg,
.event_bg,
.blgo_bg,
.contact_bg,
.gallery_bg {
    background-image: url("../../assets/images/course/courses_1.png");
    background-size: cover;
    background-repeat: no-repeat;
    height: 400px;
    position: relative;
    background-position: center;
}
.header_title {
    position: absolute;
    text-align: center;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    color:white;
}
.breadcrumb_bg {
    background: #202C45;
    display: inline-block;
    width: 100%;
}
.breadcrumb_menu > li {
    display: inline-block;
    padding: 15px 0;
}
.breadcrumb_menu a {
    color: #ffffff;
}
.breadcrumb_menu a:hover {
    color: #fab205;
}
.breadcrumb-arrow {
    margin: 20px 0;
}
.breadcrumb-arrow li:first-child a {
    border-radius: 4px 0 0 4px;
    -webkit-border-radius: 4px 0 0 4px;
    -moz-border-radius: 4px 0 0 4px
}
.breadcrumb-arrow li,
.breadcrumb-arrow li a,
.breadcrumb-arrow li span {
    display: inline-block;
    vertical-align: top
}
.breadcrumb-arrow li:not(:first-child) {
    margin-left: -5px
}
.breadcrumb-arrow li+li:before {
    padding: 0;
    content: ""
}
.breadcrumb-arrow li span {
    padding: 0 10px
}
.breadcrumb-arrow li a,
.breadcrumb-arrow li:not(:first-child) span {
    height: 36px;
    padding: 0 10px 0 25px;
    line-height: 36px
}
.breadcrumb-arrow li:first-child a {
    padding: 0 10px
}
.breadcrumb-arrow li a {
    position: relative;
    color: #fff;
    text-decoration: none;
    background-color: #F2184F;
    border: 1px solid #F2184F;
}
.breadcrumb-arrow li:first-child a {
    padding-left: 10px
}
.breadcrumb-arrow li a:after,
.breadcrumb-arrow li a:before {
    position: absolute;
    top: -1px;
    width: 0;
    height: 0;
    content: '';
    border-top: 18px solid transparent;
    border-bottom: 18px solid transparent
}
.breadcrumb-arrow li a:before {
    right: -10px;
    z-index: 3;
    border-left-color: #F2184F;
    border-left-style: solid;
    border-left-width: 11px
}
.breadcrumb-arrow li a:after {
    right: -11px;
    z-index: 2;
    border-left: 11px solid #F2184F;
}
.breadcrumb-arrow li a:focus,
.breadcrumb-arrow li a:hover {
    background-color: #F2184F;
    border: 1px solid #F2184F
}
.breadcrumb-arrow li a:focus:before,
.breadcrumb-arrow li a:hover:before {
    border-left-color: #F2184F
}
.breadcrumb-arrow li a:active {
    background-color: #2494be;
    border: 1px solid #2494be
}
.breadcrumb-arrow li a:active:after,
.breadcrumb-arrow li a:active:before {
    border-left-color: #2494be
}
.breadcrumb-arrow li span {
    color: #434a54
}
.event_title {
    border: 1px solid #e0e0e0;
    margin-bottom: 30px;
}
.event_title a:hover {
    color: #F2184F;
}
.event_title h4 {
    margin-bottom: 15px;
    margin-top: 20px;
    text-align: center;
}
.event_title p {
    margin-bottom: 20px;
    text-align: center;
}
.event_price {
    background-color: #f4f4f4;
    border-top: 1px solid #e0e0e0;
    padding: 10px;
    font-family: 'raleway-bold';
}
.event_price p {
    color: #F2184F;
    display: inline-block;
    margin: 0;
}
.event_price span {
    float: right;
    padding-right: 15px;
}
.event_price .fa {
    padding: 0 5px;
}
/* loader css start */

.page-loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('../images/page-loader.gif') 50% 50% no-repeat rgb(249, 249, 249);
}
/* loader css start */
/*sidebar css start*/

.coures_pagination li {
    display: inline-block;
}
.coures_pagination a {
    border: 1px solid #111111;
    font-size: 18px;
    padding: 10px 20px;
}
.coures_pagination a:hover {
    background: #F2184F;
    border-color: #F2184F;
    color: #ffffff;
}
.coures_searchbox ul li {
    padding-bottom: 11px;
    padding-top: 20px;
    list-style: none;
}
.coures_searchbox ul li a:hover {
    color: #F2184F;
}
.coures_searchbox ul li .active {
    font-weight: bold;
}
.coures_searchbox ul li:first-child {
    padding-top: 0;
}
.coures_searchbox button, 
.search-query.form-control {
    border-radius: 0;
}
.post_title {
    margin: 0px 0;
}
.post_text a:hover {
    color: #F2184F;
   
}



.post_text  a{

    font-size:20px;
    text-align:justify;
   
}



.lambangpanah{

 margin-top:50px;
 width:49px;
 height:49px;
 margin-left:500px;


}

.event_text_news{
    margin-top:-30px;
    padding:10px 10px;


}

.img-responsive-latest{

    width:296px;
    height:166px;


}




.post_text_news{

    margin-left:0px;
}

.post_title p {
    color: #ababab;
    margin-top: 20px;
}

.post_title h4{

    margin-left:0px;
    margin-top:10px;


}
/*course singale page */

.admin_profile {
    border-right: 1px solid #ababab;
    display: flex;
}
.admin_profile {
    align-items: center;
    border-right: 2px solid #ababab;
    height: 50px;
    margin: 30px 0;
}
.admin_profile h5 {
    margin-left: 30px;
}
.admin_profile .fa {
    font-size: 40px;
}
.admin_profile .fa-star {
    color: #fab205;
    font-size: 16px;
}
.course_bg,
.teacher_bg,
.event_bg,
.blgo_bg,
.contact_bg,
.gallery_bg {
    background-image: url(../../assets/images/course/courses_banner.png);
}
/*-- Course_Tabulation Section Start --*/

/* .nav-tabs {
    border: 0px;
} */
.course_tab_hd ul li a {
    border-radius: 0px;
    color: #000;
}
.course_tab_hd ul li a:hover {
    background-color: #F2184F;
    color: #ffffff;
    transition: 0.59s;
}
.course_tab_hd ul li a:hover p,
.nav-tabs > li.active > a p,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover p{
    color: #ffffff;
}
.course_tab_hd ul li a {
    border: 1px solid #ababab;
    background-color: #F9F9F9;
    padding: 12px 15px;
}
.course_tab_hd ul li a i {
    padding-right: 10px;
}
.course_tab_hd ul li a p {
    display: inline-block;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover {
    color: #ffffff;
    background: #F2184F;
}
.course_tab_hd .nav li {
    width: calc(25% - 6px);
    display: grid;
    text-align: center;
    margin: 0 3px;
}
.progress {
    height: 10px;
    width: 90%;
}
.progress-bar {
    background-color: #F2184F;
}
.progress-bar_1 {
    width: 100%;
}
.progress-bar_2 {
    width: 50%;
}
.progress-bar_3 {
    width: 80%;
}
/*-- Course_Tabulation Section End --*/
/*-- Course_Study Section Start --*/

.course_study_det ul li {
    padding-bottom: 5px;
}
.course_study_det ul li i {
    padding-right: 15px;
    font-size: 16px;
}
/*-- Course_Study Section End --*/
/*04. teacher page css start*/

.register_heding {
    color: #ffffff;
    font-family: raleway-bold;
    font-size: 36px;
    text-transform: uppercase;
}
.teacher_bg {
    background-image: url("../../assets/images/teachers/teacher_banner.png");
}
.teacher_contect a {
    margin-right: 20px;
}
.teacher_contect {
    margin-top: 15px;
}
.teacher_contect .fa {
    color: #F2184F;
    margin-right: 15px;
}
.teacher_contect p {
    color: #666666;
}
.banner_bg {
    background-attachment: fixed;
    background-color: #f2f2f2;
    background-repeat: no-repeat;
    background-size: cover;
    /* padding: 60px 0; */
    background-position: center;
}
.banner_bg {
    background-attachment: fixed;
    background-color: #cccccc;
    background-repeat: no-repeat;
    /* padding: 60px 0; */
    background-position: center;
}
.counter_bg {
    background-attachment: fixed;
    background-image: url("../../assets/images/teachers/counter_bg.png");
    background-repeat: no-repeat;
    background-size: cover;
    padding: 60px 0;
    background-position: center;
}
.audience_bg {
    background-attachment: fixed;
    background-color: #000000;
    background-repeat: no-repeat;
    background-size: cover;
    /* padding: 60px 0; */
    background-position: center;
}
.audience_text{
    margin: 10% 0;
    width: 50%;
    color: #ffffff;
    text-align: center;
    padding: 10px;
}

.audience_count{
    color: #DBB95E;
}
.audience_count::after {
    content: "+";
  }

.counter_text {
    color: #ffffff;
    text-align: center;
}
.counter_text .fa {
    font-size: 54px;
}
.counter_text > h1 {
    margin: 20px 0 25px;
}
.counter_title {
    color: #ffffff;
    font-size: 36px;
}
.counter_text h4 {
    text-transform: uppercase;
}
.skill_border {
    border: 1px solid #ababab;
}
.skill_title {
    padding: 30px;
}
/*04. teacher page css end*/
/*05.event page css start*/

.event_bg {
    background-image: url("../../assets/images/event/event_bg.png");
}
.event_text a {
    font-size: 18px;
}
.event_text p {
    height: 200px;
}
.event_text_short{
    height: 60px !important;
    margin-top:-20px;
}
.event_text a:hover {
    color: #F2184F;
}
.event_content {
    text-align: left;
    text-justify: inter-word;
    font-size:14px;
    font-weight:normal;
    margin-top: -20px;
}



.mt-3-event {

    font-size:24px;


}

.mt-3-topik{


    font-size:14px;


}

.datesection{

    font-size:12px;;


}
.event_img {
    margin: 30px 0;
    overflow: hidden;
    height: 200px !important;
}
.event_img:hover img {
    transform: scale(1.1)rotate(2deg);
    transform-origin: center center 0;
}
.event_img img {
    transition: all 0.8s ease 0s;
}
.event_text .fa {
    color: black;
    margin-right: 7px;
}
.event_clock {
    float: right;
}
.event_text > p {
    color: #666666;
    margin: 15px 0;
  
}
.event_text {
    color: #666666;
    margin-top:-30px;
    padding:10px 10px;
    
}
.event_related{
    background-color: #F5F4EF;
}

.side_bar_profile{
    background-color: #CDD5DA;
    /* margin-left:-188px; */
}

.grid_mobile_detail_news{

    display: none;


}

.profile_detail h2 {
    margin: 30px 0 20px;
}
.profile_detail .info-box label {
    display: block;
    font-size: 18px;
    text-transform: uppercase;
}
.profile_detail .info-box span {
    color: #666666;
    font-size: 14px;
}
.profile_detail p {
    color: #666666;
    margin-bottom: 20px;
}
.profile_detail .point-list li::after {
    content: "\f101";
    font-family: FontAwesome;
    left: 0;
    position: absolute;
    top: 0;
}
.profile_detail .point-list li {
    color: #666666;
    font-size: 16px;
    line-height: 30px;
    padding: 0 0 0 20px;
    position: relative;
}
.event_mapping {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}



.event_details_header {
    background-color: #f2f2f2;
}

.event_speaker_img{
    width:200px;
    height: 80px !important;
    width: 80px !important;
}
/*05.event page end start*/
/*06.blog gird page start*/

.blgo_bg {
    background-image: url("../../assets/images/blog/blog_bg.png");
}
.blog_date {
    border: 2px solid #F2184F;
    color: #F2184F;
    padding: 10px;
    text-align: center;
}
.blog_date h2 {
    color: #F2184F;
}
.blog_text a {
    font-size: 16px;
}
.blog_text a:hover {
    color: #F2184F ;
}
.blog_grid {
    margin: 20px 0 50px;
}
.blog_text span {
    color: #202C45;
    display: inline-block;
    margin: 15px 5px;
    font-size: 14px;
}
.blog_text .block_color{
   color: #ffffff;
}
.blog_text p {
    color: #111111;
}
.blog_list h4 {
    color: #202C45;
    margin-top: 20px;
}
.blog_list a {
    font-size: 18px;
}
.blog_list p {
    margin: 15px 0;
}
.blog_btn a {
    border: 1px solid #F2184F;
    border-radius: 100%;
    color: #F2184F;
    display: inline-block;
    height: 30px;
    line-height: 2;
    margin: 5px;
    text-align: center;
    width: 30px;
}
.blog_btn a:hover {
    background: #F2184F;
    color: #ffffff;
}
.blog_btn span {
    float: right;
}
.blog_list blockquote {
    background: #F2184F;
    border-left: 0 none;
    font-family: Raleway-Bold;
    font-size: 16px;
    letter-spacing: 0.5px;
    line-height: 26px;
    padding: 28px 70px 50px 106px;
    position: relative;
    color: #fff;
}
.blog_list blockquote::before {
    color: #202C45;
    content: "\f10d";
    font-family: fontawesome;
    font-size: 36px;
    left: 5%;
    line-height: 2;
    position: absolute;
}
/*========comment section css start========*/

.comment_slide {
    display: block;
    width: 100%;
}
.comment_box::after {
    background: #F2184F;
    bottom: -2px;
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    width: 100px;
    transition: all 0.8s 0s;
}
.comment_box:hover::after {
    width: 100%;
    transition: all 0.3s 0s;
}
.comment_box {
    border-bottom: 1px solid #cccccc;
    margin-bottom: 30px;
    padding: 0 0 20px 130px;
    position: relative;
}
.comment_box .comment_img {
    left: 0;
    position: absolute;
    top: 0;
}
.comment_box .replay {
    position: absolute;
    right: 0;
    top: 0;
}
.comment_box .replay a {
    color: #666666;
    font-size: 16px;
}
.comment_box .replay a:hover {
    color: #F2184F;
}
.comment_box .replay .fa {
    padding: 0 5px 0 0;
}
.comment_box .date {
    color: #666666;
    display: block;
    line-height: 20px;
    padding: 10px 0;
}
.comment_box p {
    color: #666666;
    font-size: 14px;
    line-height: 24px;
    margin: 0;
}
.comment_reply {
    margin-left: 110px;
}
/*06.blog gird page end*/
/*07.contact us page start*/

.contact_bg {
    background-image: url("../../assets/images/contact/contact_bg.png");
}
.be_our_sponsor_bg{
    background-image: url("../../assets/images/contact/sponsor.jpg") !important;
    border-radius: 25px;
}

.be_our_partner_bg{
    background-image: url("../../assets/images/contact/partner.jpg") !important;
    border-radius: 25px;
}

.emial_icon {
    text-align: center;
}
.emial_icon .fa {
    border: 2px solid #F2184F;
    border-radius: 100%;
    color: #F2184F;
    font-size: 34px;
    height: 80px;
    line-height: 78px;
    width: 80px;
}
.emial_icon .fa:hover {
    background: #F2184F;
    color: #ffffff;
}
.emial_icon h5 {
    padding: 20px 0;
}
.contact_form1 {
    max-width: 800px;
}
.contact_form1 .form-control {
    border: 2px solid #ababab;
    border-radius: 0;
    font-family: opensans-bold;
    height: 40px;
}
.contact_form1 .form_message {
    margin: 30px 0;
    min-height: 200px;
}

.map_text{

   

    margin-left:0%;

   


}

.map_text p{

   

    font-size: 20px;

   


}


.profile{

    margin-top:-30px;


}

.map_text_name{

    margin-left:0%;


}

.map_text_marketing{

    margin-left:28%;
   


}

.map_text_marketing_name{

    margin-top:70px;

}

.map_text_marketing_name h4{

    margin-left:40%;
   


}


.map_text_marketing_name p{

    margin-left:35%;
   


}

.map_text_marketing p{

    margin-top:10%;
   


}
.map_icon {
    color: #F2184F;
    float: left;
    font-size: 36px;
    line-height: 36px;
    margin-right: 20px;
    width: 35px;
}
.icon_box {
    /* border-top: 1px solid #ababab; */
    padding: 15px 0;
}
.contact_us1 div > p {
    color: #666666;
    font-family: opensans-bold;
    font-size: 12px;
}
.contact_us1 div > span {
    color: #666666;
    font-size: 12px;
}
.contact_us1 span a {
    color: #666666;
    font-size: 12px;
}
.coantct-map iframe {
    height: 350px;
}
/*07.contact us page end*/
/*08.gallery page start*/

.gallery_bg {
    background-image: url("../../assets/images/gallery_bg.png");
}
#gallery-header-center-left-title {
    color: #111111;
    float: left;
    font-family: opensans-bold;
    font-size: 28px;
    line-height: 25px;
}
.masonry_gallery {
    margin-bottom: 50px;
}
.masonry_gallery .filter-button-group {
    text-align: right;
}
.masonry_gallery .button {
    background: none;
    border: medium none;
}
.masonry_gallery .button.active {
    background: #32bee9 none repeat scroll 0 0;
    color: #ffffff;
    padding: 10px;
}
.gallery_btn {
    color: #F2184F;
    border: 1px solid #F2184F;
    border-radius: 0;
}
.gallery_btn:hover {
    background: #202C45;
    color: #fff;
    border: 1px solid #202C45;
    border-radius: 0;
}
/*08.gallery page end*/

/*09.Login Register Model start*/
#scroll-top .to-top a i:before {
    margin: 0;
    font-size: 16px;
}
#scroll-top .to-top:hover {
    background: #ffff00 none repeat scroll 0 0;
    color: #283754;
}
.is-hidden--off-flow {
    opacity: 0;
    transition: all 0.2s ease-in-out;
    z-index: -10;
    /* *1* */
    visibility: hidden;
    /* *1* */
}
.is-shown--off-flow {
    opacity: 1;
    transition: all 0.2s ease-in-out;
    visibility: visible;
}
.l-modal {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    height: 100%;
    margin: 0 auto;
    z-index: 9;
    text-align: center;
}
.l-modal__shadow {
    width: 100%;
    height: 100%;
    position: fixed;
    display: block;
    background: #161616;
    opacity: 0.92;
    z-index: -1;
    cursor: url("../images/cursor.png"), auto;
}
.login_popup {
    display: inline-block;
    text-align: center;
    background: white;
    max-width: 550px;
    width: 100%;
    line-height: 1.48;
}
.login_signup_option {
    background: #2f2f2f;
    position: relative;
    z-index: 9999;
}
.login_signup_option .login_option_btn .nav-tabs {
    border: none;
    padding: 20px 40px 20px;
    background: #fff;
}
.login_signup_option .login_option_btn .nav-tabs .nav-item {
    margin-right: 30px;
}
.login_signup_option .login_option_btn .nav-tabs .nav-item:last-child {
    margin-right: 0;
}
.login_signup_option .login_option_btn .nav-tabs .nav-item .nav-link {
    border: none;
    font-size: 18px;
    font-weight: 600;
    color: #2f2f2f;
    padding: 0;
    background: transparent;
}
.login_signup_option .login_option_btn .nav-tabs .nav-item .nav-link.active,
.login_signup_option .login_option_btn .nav-tabs .nav-item .nav-link:hover {
    color: #ff1949;
}
.login_signup_option .tab-content {
    border: none;
    background: #F5F7FA;
    padding: 40px;
}
.login_signup_option .login_modal_body {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    width: 550px;
    background: #F5F7FA;
}
.login_signup_option .login_modal_body form .form-group {
    margin-bottom: 25px;
}
.login_signup_option .login_modal_body form .form-group label {
    text-align: left;
    font-size: 16px;
    font-weight: 600;
    color: #2f2f2f;
    width: 100%;
}
.login_signup_option .login_modal_body form .form-group input {
    background: transparent;
    border: 1px solid rgba(47, 47, 47, 0.3);
    border-radius: 0px;
    box-shadow: 0 0 10px 0 rgba(255, 255, 255, 0);
    height: 56px;
    padding: 10px 15px;
    transition: all 0.5s ease 0s;
    width: 100%;
    color: #2f2f2f;
    font-size: 16px;
    font-weight: 400;
}
.login_signup_option .login_modal_body form .form-group input:focus {
    border-color: #ff1949;
    outline: none;
    box-shadow: none;
}
.login_signup_option .login_modal_body form .form-group input::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #2f2f2f;
    font-size: 16px;
    font-weight: 400;
}
.login_signup_option .login_modal_body form .form-group input::-moz-placeholder {
    /* Firefox 19+ */
    color: #2f2f2f;
    font-size: 16px;
    font-weight: 400;
}
.login_signup_option .login_modal_body form .form-group input:-ms-input-placeholder {
    /* IE 10+ */
    color: #2f2f2f;
    font-size: 16px;
    font-weight: 400;
}
.login_signup_option .login_modal_body form .form-group input:-moz-placeholder {
    /* Firefox 18- */
    color: #2f2f2f;
    font-size: 16px;
    font-weight: 400;
}
.login_signup_option .login_modal_body form .login_option {
    margin-top: 15px;
}
.login_signup_option .login_modal_body form .login_option .forget_pass {
    color: #ff1949;
    font-size: 16px;
    font-weight: 600;
    padding: 0 !important;
    margin: 0;
    line-height: 54px;
}
.login_signup_option .login_modal_body form .login_option .login_btn {
    height: 54px;
    padding: 0 35px;
    border-radius: 0;
    background: #ff1949;
    font-size: 18px;
    font-weight: 600;
    color: #ffffff;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
}
.login_signup_option .login_modal_body form .login_option .login_btn:hover {
    background: #2f2f2f;
}
.login_signup_option .login_modal_body form .social_login {
    margin-top: 40px;
}
.login_signup_option .login_modal_body form .social_login .social_items {
    flex-wrap: wrap;
    display: flex;
    justify-content: space-between;
}
.login_signup_option .login_modal_body form .social_login .social_items .google_login {
    height: 54px;
    width: 48%;
    border: none;
    margin-bottom: 30px;
    color: #ffffff;
    font-size: 16px;
    font-weight: 500;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
}
.login_signup_option .login_modal_body form .social_login .social_items .google_login:last-child {
    margin-bottom: 0;
}
.login_signup_option .login_modal_body form .social_login .social_items .google {
    background: #d14c3e;
}
.login_signup_option .login_modal_body form .social_login .social_items .google:hover {
    background: #A73D32;
}
.login_signup_option .login_modal_body form .social_login .social_items .facebook {
    background: #3d5a95;
}
.login_signup_option .login_modal_body form .social_login .social_items .facebook:hover {
    background: #314877;
}
.login_signup_option .login_modal_body form .social_login .social_items .twitter {
    background: #57acea;
}
.login_signup_option .login_modal_body form .social_login .social_items .twitter:hover {
    background: #468ABB;
}
.login_signup_option .login_modal_body form .social_login .social_items .linkdin {
    background: #008CC9;
}
.login_signup_option .login_modal_body form .social_login .social_items .linkdin:hover {
    background: #007BB6;
}
.login_signup_option .login_modal_body .register {
    text-align: center;
}
/*09.Login Register Model start*/

.logo-block {
    display: inline-block;
    border: 1px solid #ccc;
    padding: 15px;
}

blockquote{
    border-left:none
}

.quote-badge{
    background-color: rgba(0, 0, 0, 0.2);   
}

.quote-box{
    overflow: hidden;
    /* margin-top: -50px; */
    padding-top: -100px;
    /* border-radius: 17px; */
    background-color: #F2F2F2;
    margin-top: 25px;
    /* color:white; */
    width: 325px;
    height:370px;
    /* box-shadow: 2px 2px 2px 2px #E0E0E0; */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    padding:15px;
    /* clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 73% 76%, 72% 95%, 55% 75%, 0% 75%); */
    clip-path: polygon(0% 0%, 100% 0%, 100% 86%, 75% 86%, 75% 98%, 64% 86%, 0 86%);


}

.my-custom-select [slot='button'] {
    display: flex;
    align-items: center;
    gap: 1rem;
  }
  .my-custom-select button {
    border: none;
    margin: 0;
    padding: 0;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    display: grid;
    place-content: center;
  }
  .my-custom-select button::before {
    content: '\25BC';
  }
  .my-custom-select [popup] {
    padding: 0;
  }
  .my-custom-select .section {
    padding: 1rem 0 0;
    background: radial-gradient(ellipse 60% 50px at center top, #000a 0%, transparent 130%);
  }
  .my-custom-select h3 {
    margin: 0 0 1rem 0;
    text-align: center;
    color: white;
  }
  .my-custom-select option {
    text-align: center;
    padding: 0.5rem;
  }

  .quotation-mark{
    position: absolute;
    top: -15px;
    left: -10px;
    font-weight: bold;
    font-size: 100px;
    color: #cccccc;
    font-family: "Times New Roman", Georgia, Serif;
    z-index: 1;    
}

.quote-text{
    height: 160px;
    font-size: 16px;
    font-weight: 300;  
    /* -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;  
    overflow: hidden;
    display: -webkit-box; */
}
.medsos_link_mobile{
    margin-top: 2.7rem;
}

.quote-author{
    font-size: 12px;
    height: 55px;
}

.quote-footer{
    height: 100px;
    display: inline-block;
    width: 100%;
    /* overflow: hidden; */
    /* white-space: nowrap; */
}

.quote-profile{
    height: 60px !important; 
    width: 60px !important; 
    /* float:right;  */
    /* margin-right:10px; */
    /* position: absolute; */
    position: absolute;
    z-index: 1;
    bottom: 35px;
    right: 90px;
}

.table-tentang-kami tr td{
    height: 30px;
    vertical-align: top;
    text-align: left;
    border:none;
    padding: 0.5rem;
}

.table-tentang-kami tr th{
    height: 30px;
    vertical-align: top;
    text-align: left;
    border-bottom: none;
    padding: 0.5rem;
}
.line-clamp {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;  
    overflow: hidden;
  }
/* Styeling custom */


/* End Custom */


/* Timeline */
/* The actual timeline (the vertical ruler) */
.timeline {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
}

/* The actual timeline (the vertical ruler) */
.timeline::after {
    content: '';
    position: absolute;
    width: 6px;
    background-color: #f2f2f2;
    top: 0;
    bottom: 0;
    left: 50%;
    margin-left: -3px;
}

/* Container around content */
.container_timeline {
    padding: 10px 40px;
    position: relative;
    background-color: inherit;
    width: 50%;
}

/* The circles on the timeline */
.container_timeline::after {
    content: '';
    position: absolute;
    width: 25px;
    height: 25px;
    right: -17px;
    background-color: #f2f2f2;
    border: 4px solid #FF9F55;
    top: 15px;
    border-radius: 50%;
    z-index: 1;
}

/* Place the container to the left */
.left_timeline {
    left: 0;
}

/* Place the container to the right */
.right_timeline {
    left: 50%;
}

/* Add arrows to the left container (pointing right) */
.left_timeline::before {
    content: " ";
    height: 0;
    position: absolute;
    top: 22px;
    width: 0;
    z-index: 1;
    right: 30px;
    border: medium solid #f2f2f2;
    border-width: 10px 0 10px 10px;
    border-color: transparent transparent transparent #f2f2f2;
}

/* Add arrows to the right container (pointing left) */
.right_timeline::before {
    content: " ";
    height: 0;
    position: absolute;
    top: 22px;
    width: 0;
    z-index: 1;
    left: 30px;
    border: medium solid #f2f2f2;
    border-width: 10px 10px 10px 0;
    border-color: transparent #f2f2f2 transparent transparent;
}

/* Fix the circle for containers on the right side */
.right_timeline::after {
    left: -16px;
}

/* The actual content */
.content_timeline {
    padding: 20px 30px;
    background-color: #f2f2f2;
    position: relative;
    border-radius: 6px;
}

/* Media queries - Responsive timeline on screens less than 600px wide */
@media screen and (max-width: 600px) {
    /* Place the timelime to the left */
    .timeline::after {
        left: 31px;
    }

    /* Full-width containers */
    .container_timeline {
        width: 100%;
        padding-left: 70px;
        padding-right: 25px;
    }

    /* Make sure that all arrows are pointing leftwards */
    .container_timeline::before {
        left: 60px;
        border: medium solid #f2f2f2;
        border-width: 10px 10px 10px 0;
        border-color: transparent #f2f2f2 transparent transparent;
    }

    /* Make sure all circles are at the same spot */
    .left_timeline::after, .right_timeline::after {
        left: 15px;
    }

    /* Make all right containers behave like the left ones */
    .right_timeline {
        left: 0%;
    }
}

hr {
    margin-top: 1rem;
    margin-bottom: 1rem;
    border: 0;
    border-top: 1px solid #000000;
  }

   .author_name {
        margin-bottom: 0;
        padding: 5px 10px;
        margin-top:-20px;
        

    }
    .author_name_pdf{

        margin-top:-60px;


    }

    .bannerjudul{
        font-size:32pt;
        font-weight:normal;
        font-family:Source Sans Pro;
        margin-top:30px;
        color:white;
        text-align:left;
        width:600px;
        height:406px;
       
    }

    
    .bannerjudul-new p{        
        line-height: 1.1;
    }

        .grid_mobile{

            display: none;


        }

        .mode_dekstop{

            display:block;
    
    
        }

          
     .grid_mobile_events{

        display:none;

     }

    .card-video {
        position: relative;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        min-width: 0;
        word-wrap: break-word;
        background-color: #F2F2F2;
        background-clip: border-box;
        border: 1px solid rgba(0,0,0,.125);
        border-radius: .25rem;
        width:100%;        
    }

    .card {
        transition: 0.3s;
        width: 100%;
        
        }

    .card-article{
        box-shadow: 0 0px 0px 0 #F2F2F2;;
        transition: 0.3s;
        width: 300%;      
    }

    .judularticle{
        padding:5px 5px;
    }

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

    .card-upcoming {
        box-shadow: 0 0px 0px 0 #F5F4EF ;
        transition: 0.3s;
        width: 110%;
        height:100%;    
    }

    hr { background-color:#dedede; height: 1px; border: 0; }

              .card-upcoming img {              
                max-width: 100%;                
              }
              
              .card-upcoming:hover {
                box-shadow: 0 8px 16px 0 #F5F4EF;
              }


              
            .container-video {
                padding: 2px 16px;
               
            }

            .container-video-upcoming {
                padding: 0px 0px;
                background-color:#F5F4EF;
                width:200px;
                margin-top:-10px;
               
            }


            .upcoming_events{

              
                padding: 5px 10px;


            }

            .news_date_mobile{

                font-size:12px;
                margin-top:10px;


            }

            .mb-new{margin-bottom:1.0rem !important;  margin-top: -80px;
             }

            .mb-6{margin-bottom:3rem !important}

            .blog_btn{

                width:115%;
                margin-left:-10px;


            }

            .banner_contact_us{

                height:800px;
                background-color:#F5F4EF;


            }


            .author_name_events{

                padding:5px 10px;


            }


            #load_upcoming_event{

                margin-top:0px;


            }

            #load_past_event{

                margin-top:0px;


            }

            .event_map_speaker{

                margin-top:650px;


            }

            


            .wrapper-dekstop {
                display: grid;
                grid-template-columns: repeat(2, 1fr);
                grid-column-gap: 10px;
                grid-row-gap: 10px;
                width: 80%;
                padding: 0px 10px;
              }

            .medsos_link{


            float:left;


            }

            .border_event{

                border-bottom:solid 2px #ccc;
                margin-bottom: 30px;;
               
               


            }

              div.gallery {
                margin: 5px;
                border: 0px normal #ccc;
                float: left;
                width: 170px;
               
                
              }
              
              div.gallery:hover {
                border: 0px solid #777;
              }
              
              div.gallery img {
                width: 100%;
                height: 106px;
              }
              
              div.desc {
                padding: 5px;
                text-align: left;
                font-size:14px;
                font-weight:bold;
               
              }

              /* khusus speaker */
              div.gallery_speaker {
                margin: 5px;
                border: 0px normal #ccc;
                float: left;
                width: 110px;
                
              }
              
              div.gallery_speaker:hover {
                border: 0px solid #777;
              }
              
              div.gallery_speaker img {
                width: 100%;
                height: 106px;
              }
              
              div.desc_speaker {
                padding: 5px;
                text-align: left;
                font-size:14px;
               
              }


              .desc a{

                color:black;


              }

              .desc-people {

                text-align: center;
                margin:10px;
                font-size:14px;

              }

              .img-responsive-index{

                width:79px;
                height:79px;

              }

              .img-responsive-event{

                
                width:169px;
                height:106px;


              }


              .news_kabar{

                margin-top:-150px;
                margin-bottom: 0px;



              }

              .news_kabar_2{

                margin-top:-80px;
                margin-bottom: 0px;



              }

              .news_distance{

                margin-left:0px;


              }


              /* daerah select topik */

              /* body { font-family:Arial, Helvetica, Sans-Serif; font-size:0.65em; color:#000;} */

              .desc { color:black;}
             
              
              .dropdown dd, .dropdown dt, .dropdown ul { margin:0px; padding:0px; }
              .dropdown dd { position:relative; }
              .dropdown a, .dropdown a:visited { color:black; text-decoration:none; outline:none;}
              .dropdown a:hover { color:black;}
              .dropdown dt a:hover { color:black; border: 1px solid black;width:200px;}
              .dropdown dt a {background:white url('http://www.jankoatwarpspeed.com/wp-content/uploads/examples/reinventing-drop-down/arrow.png') no-repeat scroll right center; display:block; padding-right:20px;
                              border:1px solid #ccc;; width:200px;height: 32px;}
              .dropdown dt a span {cursor:pointer; display:block; padding:5px;border-radius: 5px;}
              .dropdown dd ul { background:white none repeat scroll 0 0; border:1px solid black; color:black; display:none;
                                left:0px; padding:5px 0px; position:absolute; top:2px; width:auto; min-width:200px; list-style:none;}
              .dropdown span.value { display:none;}
              .dropdown dd ul li a { padding:5px; display:block;}
              .dropdown dd ul li a:hover { background-color:white;}
              
              .dropdown img.flag { border:none; vertical-align:middle; margin-left:10px; }
              .flagvisibility { display:none;}


              .dropdown_event dd, .dropdown_event dt, .dropdown_event ul { margin:0px; padding:0px; }
              .dropdown_event dd { position:relative; }
              .dropdown_event a, .dropdown_event a:visited { color:black; text-decoration:none; outline:none;}
              .dropdown_event a:hover { color:black;}
              .dropdown_event dt a:hover { color:black; border: 1px solid black;}
              .dropdown_event dt a {background:transparent url('http://www.jankoatwarpspeed.com/wp-content/uploads/examples/reinventing-drop-down/arrow.png') no-repeat scroll right center; display:block; padding-right:20px;
                              border:1px solid #ccc; width:200px;border-radius: 5px;font-size:14px;}
              .dropdown_event dt a span {cursor:pointer; display:block; padding:5px;width: 230px;}
              .dropdown_event dd ul { background:white none repeat scroll 0 0; border:1px solid black; color:black; display:none;
                                left:0px; padding:5px 0px; position:absolute; top:2px; width:auto;  min-width:200px; list-style:none;border-radius: 5px;
                                z-index: 1;}
              .dropdown_event span.value { display:none;}
              .dropdown_event dd ul li a { padding:5px; display:block;font-size: 12px;}
              .dropdown_event dd ul li a:hover { background-color:transparent;}
              
              .dropdown_event img.flag_event { border:none; vertical-align:middle; margin-left:10px; }
              .flagvisibility { display:none;}


              .dropdown_event_past dd, .dropdown_event_past dt, .dropdown_event_past ul { margin:0px; padding:0px; }
              .dropdown_event_past dd { position:relative; }
              .dropdown_event_past a, .dropdown_event_past a:visited { color:black; text-decoration:none; outline:none;}
              .dropdown_event_past a:hover { color:black;}
              .dropdown_event_past dt a:hover { color:black; border: 1px solid black;}
              .dropdown_event_past dt a {background:transparent url('http://www.jankoatwarpspeed.com/wp-content/uploads/examples/reinventing-drop-down/arrow.png') no-repeat scroll right center; display:block; padding-right:20px;
                              border:1px solid #ccc; width:200px;border-radius: 5px;font-size:12px;}
              .dropdown_event_past dt a span {cursor:pointer; display:block; padding:5px;width: 230px;}
              .dropdown_event_past dd ul { background:white none repeat scroll 0 0; border:1px solid black; color:black; display:none;
                                left:0px; padding:5px 0px; position:absolute; top:2px; width:auto;  min-width:200px; list-style:none;border-radius: 5px;position: absolute;
                                z-index: 1;}
              .dropdown_event_past span.value { display:none;}
              .dropdown_event_past dd ul li a { padding:5px; display:block;font-size: 12px;}
              .dropdown_event_past dd ul li a:hover { background-color:transparent;}
              
              .dropdown_event_past img.flag_event_past { border:none; vertical-align:middle; margin-left:10px; }
              .flagvisibility { display:none;}


              .dropdown_date dd, .dropdown_date dt, .dropdown_date ul { margin:0px; padding:0px; }
              .dropdown_date dd { position:relative; }
              .dropdown_date a, .dropdown_date a:visited { color:black; text-decoration:none; outline:none;}
              .dropdown_date a:hover { color:black;}
              .dropdown_date dt a:hover { color:black; border: 1px solid black;}
              .dropdown_date dt a { 
                background: url(style.css) right center no-repeat scroll transparent;
                display: block;
                border: 1px solid rgb(204, 204, 204);
                width: 180px;
                height: 35px;
                margin-right: 20px;
                border-radius: 5px;
            }
              .dropdown_date dt a span {cursor:pointer; display:block; padding:5px;font-size: 14px;
                font-weight: normal;}
              .dropdown_date dd ul { background:white none repeat scroll 0 0; border:1px solid black; color:black; display:none;
                                left:0px; padding:5px 0px; position:absolute; top:2px; width:auto;  min-width:200px; list-style:none;}
              .dropdown_date span.value { display:none;}
              .dropdown_date dd ul li a { padding:5px; display:block;}
              .dropdown_date dd ul li a:hover { background-color:transparent;}
              
              .dropdown_date img.flag { border:none; vertical-align:middle; margin-left:10px; }
              .flagvisibility { display:none;}


              .dropdown_news dd, .dropdown_news dt, .dropdown_news ul { margin:0px; padding:0px; }
              .dropdown_news dd { position:relative; }
              .dropdown_news a, .dropdown_news a:visited { color:black; text-decoration:none; outline:none;}
              .dropdown_news a:hover { color:black;}
              .dropdown_news dt a:hover { color:black; border: 1px solid black;}
              .dropdown_news dt a {background:white url('') no-repeat scroll right center; display:block; padding-right:20px;
                              border:1px solid #ccc; width:200px;border-radius: 5px;font-size:12px;}
              .dropdown_news dt a span {cursor:pointer; display:block; padding:5px;width: 230px;color:#6c757d;}
              .dropdown_news dd ul { background: white none repeat scroll 0 0; border:1px solid black; color:black; display:none;
                                left:0px; padding:5px 0px; position:absolute; top:2px; width:auto;  min-width:200px; list-style:none;
                                z-index: 1;border-radius:5px;}
              .dropdown_news span.value { display:none;}
              .dropdown_news dd ul li a { padding:5px; display:block;font-size: 12px;}
              .dropdown_news dd ul li a:hover { background-color:white;}
              
              .dropdown_news img.flag_news { border:none; vertical-align:middle; margin-left:10px; }
              .flagvisibility { display:none;}



              .dropdown_videos dd, .dropdown_videos dt, .dropdown_videos ul { margin:0px; padding:0px; }
              .dropdown_videos dd { position:relative; }
              .dropdown_videos a, .dropdown_videos a:visited { color:black; text-decoration:none; outline:none;}
              .dropdown_videos a:hover { color:black;}
              .dropdown_videos dt a:hover { color:black; border: 1px solid black;}
              .dropdown_videos dt a {background:white url() no-repeat scroll right center; display:block; padding-right:20px;
                              border:1px solid #ccc; width:170px;border-radius: 5px;font-size:12px;}
              .dropdown_videos dt a span {cursor:pointer; display:block; padding:5px;width: 230px;color:#6c757d;}
              .dropdown_videos dd ul { background: white none repeat scroll 0 0; border:1px solid black; color:black; display:none;
                                left:0px; padding:5px 0px; position:absolute; top:2px; width:auto;  min-width:200px; list-style:none;
                                z-index: 1;border-radius:5px;}
              .dropdown_videos span.value { display:none;}
              .dropdown_videos dd ul li a { padding:5px; display:block;font-size: 12px;}
              .dropdown_videos dd ul li a:hover { background-color:white;}
              
              .dropdown_videos img.flag_news { border:none; vertical-align:middle; margin-left:10px; }
              .flagvisibility { display:none;}


              /* batas topik */
              .footer_title li  {
                font-size:14px;
                list-style: none!important;
              }
              .footer_title p  {
                font-size:14px;
              }

              #range_tanggal{
                margin-top: -26px;
                margin-left: 32px;
                height: 32px;
                width: 141px;
                /* border: 1px solid #dedede; */
                color: rgb(0, 0, 0);
                font-size: 14px;
                border: none;
              }
              #range_tanggal_video{
                margin-top: -26px;
                margin-left: 32px;
                height: 32px;
                width: 141px;
                /* border: 1px solid #dedede; */
                color: rgb(0, 0, 0);
                font-size: 12px;
                border: none;
                cursor: pointer;
              }
              /* select topik */
              .vodiapicker{
                display: none; 
                font-size:16px;               
              }              
              #a{
                padding-left: 0px;
                position: absolute;

                z-index: 1;
                background-color:white;
                width:96%;
                border: 1px solid rgba(0,0,0,.15);
                border-radius:5px;

              }
              
              #a img, .btn-select img{
                width: 25px;
                
              }
              
              #a li{
                list-style: none;
                padding-top: 0px;
                padding-bottom: 0px;
              }
              
              #a li:hover{
               background-color: #F4F3F3;
              }
              
              #a li img{
                margin: 5px;
              }
              
              #a li span, .btn-select li span{
                margin-left: 0px;
                font-size: 12px;
              }
              
              /* item list */
              
              .b{
                display: none;
                width: 100%;
                max-width: 350px;
                box-shadow: 0 6px 12px rgba(0,0,0,.175);
                border: 1px solid rgba(0,0,0,.15);
                border-radius: 5px;
  
              }
              
              .open{
                display: show !important;
              }
              
              .btn-select{
                margin-top: 10px;
                width: 110%;
                max-width: 350px;
                height: 34px;
                border-radius: 5px;
                background-color: #fff;
                border: 1px solid #ccc;
               
              }
              .btn-select li{
                list-style: none;
                float: left;
                padding-bottom: 0px;
              }

              .btn-select li span{
               font-size:14px;
               margin-left:15px;
              }
              
              .btn-select:hover li{
                margin-left: 0px;
              }
              
              .btn-select:hover{
                background-color: #F4F3F3;
                border: 1px solid transparent;
                box-shadow: inset 0 0px 0px 1px #ccc;
                
                
              }
              
              .btn-select:focus{
                 outline:none;
              }
              
              .lang-select{
                margin-left: 0px;
              }

              .id_topics_news{

                margin-top:-10px;
              }


              .id_topics_video{

                margin-top:-10px;


              }

              .topics_select{

                font-size:14px;
                font-weight:bold;


              }

              .side-panel-event{
                background-color: #F5F4EF;
                max-height: 850px;
                overflow: none;
                max-width:407px;
                margin-top: -200px;
              }


              .side-panel-news{
                background-color: #F5F4EF;
                max-height:500px;
                overflow: none;
                max-width:407px;
              
              }

              .side-panel-video{
                background-color: white;
                max-height:700px;
                overflow: none;
                max-width:407px;
              
              }

              .side-panel-video-event{
                background-color: #F5F4EF;
                max-height:2000px;
                overflow: none;
                max-width:650px;                
                /* margin-top: 100px!important; */
              }

              .side-panel-video-detail{
                background-color: #F5F4EF;
                max-height:2000px;
                overflow: none;
                max-width:650px;                
              }
        
              

              .date_event{

                font-size:13px;
                margin-top:10px;


              }

              .mobile{

                display:none;
              }
              



              
        
/* Owl Carousel custom for header */