@font-face {
  font-family: 'rubik';
  src: url('/home/mhs/workspace/miu-responsive/assets/font/rubik/Rubik-Regular.eot');
  src: url('/home/mhs/workspace/miu-responsive/assets/font/rubik/Rubik-Regular.eot?#iefix') format('embedded-opentype'),
   url('/home/mhs/workspace/miu-responsive/assets/font/rubik/Rubik-Regular.woff') format('woff'), 
   url('/home/mhs/workspace/miu-responsive/assets/font/rubik/Rubik-Regular.ttf') format('truetype'), 
   url('/home/mhs/workspace/miu-responsive/assets/font/rubik/Rubik-Regular') format('woff2');
  font-weight: normal;
  font-style: normal;
}

body {
  font-family: 'rubik', sans-serif;
  height: auto;
  overflow-y: auto;
}

:focus {
  outline: none;
}

button:focus {
  outline: none;
}

a{
  text-decoration: none;
  color: #212121;
  font-size: 14px;
}

a:hover {
  text-decoration: none;
}

ul {
  list-style: none;
}

ul li {
  padding-bottom: .5rem;
}

img {
  width: 100%;
}

/* Nav Bar */
.logo {
  width: 50px;
  height: 50px;
}

.navbar-collapse ul {
  padding-left: 0px;
  list-style: none;
}

.navbar-collapse ul li {
  padding: 5px;
}

.navbar-collapse ul li a{
  color: #ffffff;
}

.navbar-toggler {
  border: none !important;
  border-radius: 0;
  border-left: 1px solid #1e5872 !important;
}

.menu-collapse {
  width: 8px;
  transform: rotate(90deg);
}

.search-icon {
  width: 24px;
}

.menu-icon {
  width: 20px;
}

/*footer*/
footer {
  background-color: #0a1c30;
  color: #ffffff !important;
}

footer p {
  color: #ffffff !important;
}

.footer-logo {
  width: 120px;
}

.social img {
  width: 20px;
}

/*Color*/
.bg-nav {
  background-color: #0a1c30 !important;
}

.bg-menu {
  background-color: #1a3b59 !important;
}

.bg-white {
  background-color: #ffffff !important;
}

.bg-gray {
  background-color: #f4f4f4 !important;
}

.bg-blue {
  background-color: #3986e2 !important;
}

.bg-yellow {
  background-color: #e59e00 !important;
}

.border-blue {
  border-color: #3986e2 !important;
}

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

.border-top-gray {
  border-top: 1px solid #dee2e62e;
}

.text-blue {
  color: #3986e2 !important;
}

.text-yellow {
  color:  #e59e00 !important;
}

.text-white {
  color: #ffffff !important;
}

.text-gray {
  color: #666666 !important;
}

.text-black {
  color: #212121 !important;
}

/*Font Size*/
h3 {
  font-size: 24px;
}

h5 {
  font-size: 16px;
}

p {
  font-size: 14px;
  text-align: left;
  color:  #212121;
}

.font-12 {
  font-size: 12px !important;
}

.font-14 {
  font-size: 14px !important;
}

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

.font-18 {
  font-size: 18px !important;
}

.font-22 {
  font-size: 22px !important;
}

.font-24 {
  font-size: 24px !important;
}

/*width*/
.w-16 {
  width: 16px !important;
}

.w-28 {
  width: 28px !important;
}

/*Margin*/
.mt__40 {
  margin-top: -40px;
}

/*List Style*/
.list-type-disc {
  list-style-type: disc !important;
}

.list-type-number {
  list-style-type: decimal !important;
}

.underline {
  text-decoration: underline;
}

.bg-img {
  position: relative;
  overflow: hidden;
  background-color: #000;
}

.bg-img div {
  position: relative;
  z-index: 2;
}

.bg-img img {
  position: absolute;
  left: 0px;
  top: -178px;
  width: 100%;
  height: auto;
  opacity: 0.3;
}

.title-img {
  width: 60px;
  height: 60px;
}

/*Swiper*/
.swiper-button-next {
  --swiper-theme-color: #343a40 !important;
  /*background-image: url("home/hlaing/workspace/miu_static/images/next.svg") !important;
  background-repeat: no-repeat;*/
}

.swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  background: #7c7c7c;
  opacity: 1;
}

.swiper-pagination-bullet-active {
  background: #e59e00 !important;
}

/*Card*/
.card {
  border: none !important;
  width: 100%;
}

.absolute {
  position: absolute !important;
}

.relative {
  position: relative !important;
}

.bottom-68 {
  bottom: 68px !important;
}

/* Partner Page */
.partner-img-slider .swiper-wrapper .swiper-slide {
  width: 70% !important;
} 

.partner-img-slider .swiper-button-next {
  background-color:#ced4dae6;
  height: 100%;
  width: 64px;
  top: 12%;
  right: 0;
  left: auto;
}

/* Event and Activity */
#events-slider .swiper-wrapper .swiper-slide {
  display: flex;
  width: 60% !important;
}

.date-block {
  padding: 5px;
  color: white;
  text-align: center;
  width: 55px;
  height: 60px;
  background-color: #e59e00;
}

#event-gallery-slider .swiper-wrapper .swiper-slide {
  width: 70% !important;
}

/* student life at MIU */
.studentlife{
    /* background-image: url('../images/graduated.png'); */
    width: 100%;
    height: auto;
    background-size: cover;                 
    background-repeat:   no-repeat;
    background-position: center center;
  }
  .f-20{
    font-size: 25px;  
    color: #fff;
    text-align: center;
   
  }
  .f-12{
      font-size:12px
  }
  .paddingb-4{
      padding-bottom: 30px;;
  }

  .btn-warning{
      background-color: #e49e00;
      color: #fff;
      border-radius: 0;
      padding-top: 4px;
      
  }

  /* MIU Gallery */

	/* Style the Image Used to Trigger the Modal */
		.myImg {
		   border-radius: none;
		   cursor: pointer;
		   transition: 0.3s;
	   }
	   
	   .myImg:hover {opacity: 0.7;}
	   
	   /* The Modal (background) */
	   .modal {
		   display: none; /* Hidden by default */
		   position: fixed; /* Stay in place */
		   z-index: 1; /* Sit on top */
		   padding-top: 100px; /* Location of the box */
		   left: 0;
		   top: 0;
		   width: 100%; /* Full width */
		   height: 100%; /* Full height */
		   overflow: auto; /* Enable scroll if needed */
		   background-color: rgb(0,0,0); /* Fallback color */
		   background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
	   }
	   
	   /* Modal Content (Image) */
	   .modal-content {
		   margin: auto;
		   display: block;
		   width: 80%;
		   max-width: 700px;
	   }
	   
	   /* Caption of Modal Image (Image Text) - Same Width as the Image */
	   #caption {
		   margin: auto;
		   display: block;
		   width: 80%;
		   max-width: 700px;
		   text-align: center;
		   color: #ccc;
		   padding: 10px 0;
		   height: 150px;
	   }
	   
	   /* Add Animation - Zoom in the Modal */
	   .modal-content, #caption {
		   -webkit-animation-name: zoom;
		   -webkit-animation-duration: 0.6s;
		   animation-name: zoom;
		   animation-duration: 0.6s;
	   }
	   
	   @-webkit-keyframes zoom {
		   from {-webkit-transform:scale(0)}
		   to {-webkit-transform:scale(1)}
	   }
	   
	   @keyframes zoom {
		   from {transform:scale(0)}
		   to {transform:scale(1)}
	   }
	   
	   /* The Close Button */
	   .close {
		   position: absolute;
		   top: 65px;
		   right: 10px;
		   color: #fff;
		   font-size: 30px;
		   font-weight: 100;
		   transition: 0.3s;
	   }
	   
	   .close:hover,
	   .close:focus {
		   color: #bbb;
		   text-decoration: none;
		   cursor: pointer;

	   }
	   .count{
		   opacity: .5;
		  
	   }
	   .count-text{
		position: relative;
		
		
	   }
	   
	   .count-text p{
		position: absolute;
		top: -56px;
		right: 23px;
		margin: 5%;
		font-weight: bold;
		color: #ffffff;
		font-size: 30px;
	   }
	   
	   /* 100% Image Width on Smaller Screens */
	   @media only screen and (max-width: 700px){
		   .modal-content {
			   width: 100%;
		   }
	   }

  /* End MIU Gallery */


  /* Mobile Gallery Carousel */

  /* The Modal (background) */
	   .corousel-bg {
        /* Hidden by default */
		   position: fixed; /* Stay in place */
		   z-index: 1; /* Sit on top */
		   padding-top: 100px; /* Location of the box */
		   left: 0;
		   top: 0;
		   width: 100%; /* Full width */
		   height: 100%; /* Full height */
		   overflow: auto; /* Enable scroll if needed */
		   background-color: #010305; /* Fallback color */
		   background-color: #010305; /* Black w/ opacity */
	   }
	   /* The Close Button */
	   .close1 {
		   position: absolute;
		   top: -37px;
		   right: 10px;
		   color: #fff;
		   font-size: 30px;
		   font-weight: 100;
		   transition: 0.3s;
	   }
	   
	   .close1:hover,
	   .close1:focus {
		   color: #bbb;
		   text-decoration: none;
		   cursor: pointer;

	   }
	   .count{
		   opacity: .5;
		  
	   }
	   .count-text{
		position: relative;
		
		
	   }
	   
	   /* .count-text p{
		position: absolute;
		top: -86px;
		right: 23px;
		margin: 5%;
		font-weight: bold;
		color: #ffffff;
		font-size: 40px;
	   } */

  /* End Mobile Carousel */


  /* Start Event Mobile */
  .breadcrumb-item.active {
    color: #007bff !important;
}

.breadcrumb-item a {
    color: #6c757d !important;
}

.breadcrumb {
    background: white !important;
}

.video {
    height: 0;
    position: relative;
    padding-bottom: 56.25%; /* Если видео 16/9, то 9/16*100 = 56.25%. Также и с 4/3 - 3/4*100 = 75% */
}
.video iframe {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.eventAlig{
    padding-left: 6% !important;
    padding-right: 10% !important;
}

.eventDetailsALig{
    padding-left: 7% !important;
    padding-right: 7% !important;
}

.carousel-indicators .active {
    opacity: 1;
    background-color: #e59e00;
}

.carousel-indicators li {
    width: 10px;
    height: 10px;
    border-radius: 100%;
    background-color: grey;
}

.eventDetailsMargin{
    padding-left: 7%;
    padding-right: 1%;
}

.gallerySlideMarginLeft{
    margin-left: -32px;
}

.galleryArrow{
    width: 30%;
}

.galleryArrowBackground{
    background: #cecece;
    width: 33px;
}

.galleryMoreEvents-Alig{
    padding-left: 7%;
    padding-right: 10%;
}

/* Show Detail Event */

.eventsAlig1, .text-dark1{
    padding-left: 10% !important;
    padding-right: 8% !important;
}
.football{
    width:13%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.read{
    font-size: 12px;
    color: #007bff !important;
}
.blue{
    color: #3e75ce;
}
/* .dark{
    background-color: #d2d2d2 !important;
   
} */
.gt{
    font-size: 15px;
}
.campus{
    width:40% !important;
    height:40% !important;
}
.f-16{
    font-size: 16px !important;
    
}
/* .f-15{
    font-size: 15px !important;
    
}

.f-12{
    font-size: 12px !important;
    
} */
.clock{
    font-size: 12px !important;
}
.grey{
    background-color: #d2d2d2 !important;
}
.full
{
    width:100%;
}

/* End Show Detail Event */


  /* Start Mobile FAQ */

   
.faqs {
    color: #e59e00;
    font-weight: bold;
    font-size: 25px;
}
.hr-align{
    height:3px;
    border:none;
    color:#f4f4f4;
    background-color:#f4f4f4;
}

.f-120{
    font-size: 120%;
}


.arrow{
    width: 10px;
     height: 10px;
}
.blue-faqs{

    color: #316ecf;
}
.accordion-toggle{
  color:black !important;
}
  /* End Mobile FAQ */