@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700,800,900|Open+Sans:400,600,700,800');
/*-------------------------------------
    Template Name: Academic HTML5 Responsive Teample
    Template URI: http://radontheme.com/
    Description: Academic HTML5 Responsive Teample
    Author: radontheme
    Author URI: http://radontheme.com/
    Version: 1.0
---------------------------------------
    
    CSS INDEX
    ===================
	
    1. Theme Default CSS (body, link color, section etc)
    2.Header Area Start Here
    3.Slider Area Start Here
    4.Search Box Start Here
    5.Popular Courses Start Here
    6.why connect us start Here
    7.Calender Area Start Here
    8.Register Now Start Here
    9.Blog Area Start Here
    10.Video Background Start Here
    11.More Lecturer Area Start Here
    12.Testimonial Area start here
    13.Portfolio One Start Here
    14.Subscribe Area Start Here
    15.Footer Area Start Here
    16.Page Header Section breadcumb Start Here
    17.About Page Start Here 
    18.Event Area Start Here
    19. Sidebar Area Start Here
    20. Pagination Start Here
    21. Event Details Start Here
    22.Blog Page Start Here
    23.Courses Area Start Here
    24.Contact Us page Start Here
    25.Shop Page Start Here
    26.Product Details Page Start Here
    27.Cart Page Area Start
    28.Login and Registration start Here


---------------------------------------*/
/* --------------------------
2.Header Area Start Here 
-----------------------------*/
header .header-top-area {
  background: #0b2f8c;
}
header .header-top-area .header-top-left ul {
  text-align: left;
  margin: 0;
  padding: 0;
}
header .header-top-area .header-top-left ul li {
  display: inline-block;
  position: relative;
  font-size: 12px;
  color: #000000;
  margin-right: 30px;
  padding: 10px 0;
}
header .header-top-area .header-top-left ul li:last-child {
  margin-right: 0;
}
header .header-top-area .header-top-left ul li span {
  font-weight: 400;
  color: #ffffff;
  padding: 0 1px;
}
header .header-top-area .header-top-left ul li:hover ul {
  -ms-transform: scaleY(1);
  /* IE 9 */
  -webkit-transform: scaleY(1);
  /* Safari */
  transform: scaleY(1);
  opacity: 1;
  visibility: visible;
}
header .header-top-area .header-top-left ul li ul {
  position: absolute;
  width: 150px;
  top: 100%;
  transition: all 0.5s ease 0s;
  background: #86bc42;
  left: 0;
  opacity: 0;
  text-align: left;
  transform: scaleY(0);
  transform-origin: 0 0 0;
  visibility: hidden;
  z-index: 99999999;
}
header .header-top-area .header-top-left ul li ul li {
  display: block;
  border-bottom: 1px solid #648e2e;
  margin: 0;
  padding: 0;
}
header .header-top-area .header-top-left ul li ul li:last-child {
  border-bottom: 0px solid #648e2e;
}
header .header-top-area .header-top-left ul li ul li a {
  display: block;
  color: #ffffff;
  transition: all 0.5s ease 0s;
  padding: 5px 10px;
}
header .header-top-area .header-top-left ul li ul li a:hover {
  color: #dddddd;
  background: #648e2e;
}
header .header-top-area .header-top-left ul li a {
  display: block;
  color: #ffffff;
  transition: all 0.5s ease 0s;
}
header .header-top-area .header-top-left ul li a:hover {
  color: #dddddd;
}
header .header-top-area .header-top-left ul li i {
  color: #ffffff;
  margin-right: 10px;
  font-size: 12px;
}
header .header-top-area .header-top-right ul {
  text-align: right;
}
header .header-top-area .header-top-right ul li {
  display: inline-block;
  margin: 0 0 0 20px;
  padding: 10px 0;
}
header .header-top-area .header-top-right ul li a {
  display: block;
  width: 14px;
  height: 14px;
  line-height: 14px;
  transition: all 0.5s ease 0s;
  color: #ffffff;
  font-size: 14px;
  padding: 5px 0;
}
header .header-top-area .header-top-right ul li a:hover {
  color: #a5c0d5;
}
header .header-area {
  padding: 10px 0;
  transition: all 0.5s ease 0s;
 background: rgba(255, 255, 255, 1.0);
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 9;
}
header .header-area.header-two {
  position: inherit;
  background-color: #ffffff;
}
header .header-area.header-two .main-menu ul {
  margin: 0;
  padding: 0;
  text-align: right;
}
header .header-area.header-two .main-menu ul li {
  display: inline-block;
  position: relative;
}
header .header-area.header-two .main-menu ul li.active a {
  color: #86bc42;
}
header .header-area.header-two .main-menu ul li a {
  color: #000000;
  padding: 7px 15px;
}
header .header-area.header-two .main-menu ul li a:hover {
  color: #86bc42;
}
header .header-area.header-two .main-menu ul li a i {
  width: 50px;
  height: 50px;
  line-height: 50px;
  color: #ffffff;
  text-align: center;
  border-radius: 50%;
  background: #86bc42;
}
header .header-area.header-two .main-menu ul li:hover ul {
  transform: scaleY(1);
  visibility: visible;
  opacity: 1;
}
header .header-area.header-two .main-menu ul li ul {
  position: absolute;
  background: rgba(f, f, f, 0.0);
  left: 0;
  opacity: 0;
  top: 100%;
  transform: scaleY(0);
  transform-origin: 0 0 0;
  transition: all 0.5s ease 0s;
  width: 170px;
  z-index: 99999;
  text-align: left;
  visibility: hidden;
}
header .header-area.header-two .main-menu ul li ul li {
  display: block;
  border-bottom: 1px solid #86bc42;
  margin: 0;
  padding: 0;
}
header .header-area.header-two .main-menu ul li ul li a {
  display: block;
  padding: 7px 10px;
  text-decoration: none;
  color: #ffffff !important;
  font-size: 14px;
  font-weight: 300;
  transition: all 0.5s ease 0s;
  text-transform: capitalize;
}
header .header-area.header-two .main-menu ul li ul li a:hover {
  color: #d3d3d3;
  margin-left: 5px;
}
header .header-area.header-two.stick {
  background: rgba(255, 255, 255, 0.8);
  border-bottom: 1px solid #dddddd;
  position: fixed;
  top: 0px;
  z-index: 999;
  margin: 0 !important;
  padding: 0em;
  left: 0;
  right: 0;
  margin: auto;
}
header .header-area.stick {
  background: rgba(255, 255, 255, 0.6);
  border-bottom: 1px solid #ffffff;
  position: fixed;
  top: 0px;
  z-index: 999;
  margin: 0 !important;
  padding: 0em;
  left: 0;
  right: 0;
  margin: auto;
}
header .header-area .logo-area {
  margin-top: 16px;
}
header .header-area .logo-area a {
  display: block;
}
header .header-area .main-menu ul {
  margin: 0;
  padding: 0;
  text-align: right;
}
header .header-area .main-menu ul li {
  display: inline-block;
  position: relative;
}
header .header-area .main-menu ul li.active a {
  color: #86bc42;
}
header .header-area .main-menu ul li a {
  display: block;
  color: #ffffff;
  text-transform: capitalize;
  padding: 10px;
  font-size: 16px;
  transition: all 0.5s ease 0s;
}
header .header-area .main-menu ul li a:hover {
  color: #86bc42;
}
header .header-area .main-menu ul li a i {
  width: 50px;
  height: 50px;
  line-height: 50px;
  color: #ffffff;
  text-align: center;
  border-radius: 50%;
  background: #86bc42;
}
header .header-area .main-menu ul li:hover ul {
  transform: scaleY(1);
  visibility: visible;
  opacity: 1;
}
header .header-area .main-menu ul li ul {
  position: absolute;
  background: rgba(255, 255, 255, 0.8);
  left: 0;
  opacity: 0;
  top: 100%;
  transform: scaleY(0);
  transform-origin: 0 0 0;
  transition: all 0.5s ease 0s;
  width: 170px;
  z-index: 99999;
  text-align: left;
  visibility: hidden;
}
header .header-area .main-menu ul li ul li {
  display: block;
  border-bottom: 1px solid #86bc42;
  margin: 0;
  padding: 0;
}
header .header-area .main-menu ul li ul li a {
  display: block;
  padding: 7px 10px;
  text-decoration: none;
  color: #ffffff !important;
  font-size: 14px;
  font-weight: 300;
  transition: all 0.5s ease 0s;
  text-transform: capitalize;
}
header .header-area .main-menu ul li ul li a:hover {
  color: #d3d3d3;
  margin-left: 5px;
}