/*--------------------------------------------------------------------------
Template name: Eduaid
Template URI: https://www.foxcoders.com/demo/eduaid/
Author Name: Khakon
Author URI: 
Tag: Modern, Agency, Business
Verson: 1.0.0
Description: Eduaid is a responsive html5 education template 

===========================
CSS Index
===========================
1. header
2. Start Slider
3. Start Services
4. Start Featured Section
05. Start Popup Videos Section
06. Start Our Team Carousel
07 .Start Events Section
08. Start Testimonials Section
09. Start Blog Section
10. Start Footer
14. scroll-top
15. About Page
15.1 Start Featured-2 Section
15.2 Start Full Width Container
15.3 Start Contact And Countdown
15.4 Start Contact Section
16. Courses Page
17. Teacher Details
18. Gallery Page
19. Blog Style One
20. Apply Form Page
21. Notice page
22. Events Page
23. Results Page
24. Department Page
25. Blog Details
------------------------------------------------------------------------------*/



.button_four {
  display: inline-block;
  position: relative;
  background-color: #fff;
  border: 2px solid #ff5202;
  color: #ff5202;
  padding: 10px 25px;
  transition: all .4s linear 0s;
  font-size: 15px;
  font-weight: 400;
  text-transform: uppercase;
  cursor: pointer; }
  .button_four.active {
    background-color: #ff5202;
    color: #fff; }
  @media (max-width: 575px) {
    .button_four {
      padding: 10px; } }
  .button_four:hover {
    text-decoration: none;
    background-color: #ff5202;
    color: #fff; }


.button_block {
  display: block;
  width: 100%;
  height: 50px;
  border: 0;
  color: #fff;
  text-transform: uppercase;
  font-weight: 500;
  transition: all .4s linear 0s; }


/* .link_btn {
  display: inline-block;
  color: #ff5202;
  font-weight: 500;
  text-transform: uppercase;
  font-size: 15px;
  transition: all .4s linear 0s; }
  .link_btn i {
    transition: all .4s linear 0s; }
  .link_btn:hover {
    text-decoration: none;
    color: #ff5202; }
    .link_btn:hover i {
      padding-left: 5px; } */


/**********************************
15. About Page
***********************************/


.image-gallery .owl-item {
  position: relative;
  z-index: 1;
  margin-top: 25px; }
  .image-gallery .owl-item .single-gallery img {
    height: 250px;
    object-fit: cover; }
  .image-gallery .owl-item.active.center {
    position: relative;
    z-index: 999; }
    @media (min-width: 992px) {
      .image-gallery .owl-item.active.center {
        transform: scale(1.3); } }
    .image-gallery .owl-item.active.center .single-gallery img {
      object-position: center center; }
      @media (min-width: 992px) {
        .image-gallery .owl-item.active.center .single-gallery img {
          border: 2px solid #ff5202;
          margin: 12px 0; } }

.image-gallery .owl-dots {
  display: inline-block;
  position: absolute;
  text-align: center;
  margin-top: -50px;
  z-index: 9999;
  left: 44.5%;
  background-color: #ff5202;
  padding: 5px;
  border-radius: 50px; }
  .image-gallery .owl-dots .owl-dot {
    width: 10px;
    height: 10px;
    background-color: rgba(34, 34, 34, 0.3);
    border-radius: 50%;
    margin: 5px; }
    .image-gallery .owl-dots .owl-dot.active {
      background-color: #fff; }
    .image-gallery .owl-dots .owl-dot:focus {
      outline: 0; }

/************************************
15.1 Start Featured-2 Section
****************************************/
.featured-area {
  margin-bottom: -20px; }

.featured-2-icon {
  margin-right: 30px; }
  .featured-2-icon i {
    color: #ff5202;
    font-size: 25px;
    width: 60px;
    height: 60px;
    line-height: 55px;
    text-align: center;
    border-radius: 50%;
    border: 2px solid #ff5202; }

.single-featured-3:hover .featured-2-icon i {
  background: #ff5202;
  color: #fff;
  transition: all .4s linear 0s; }

.featured-2-text h5 {
  color: #002147;
  font-size: 20px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600; }

.half-column-content h2 {
  font-size: 50px; }

/************************
15.2 Start Full Width Container
*************************/
.half-column-video:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(34, 34, 34, 0.3); }

.half-column-video .play-button {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  color: #14bdee;
  background-color: rgba(255, 255, 255, 0.6);
  padding: 15px;
  border-radius: 50%;
  transition: all .4s linear 0s; }
  .half-column-video .play-button i {
    font-size: 30px;
    background-color: #fff;
    padding: 35px;
    border-radius: 50%; }
  .half-column-video .play-button:hover {
    background-color: #14bdee; }

@media (max-width: 768px) {
  .half-column-video {
    padding: 200px 0; } }

@media (max-width: 575px) {
  .half-column-video {
    padding: 200px 0; } }

.contact-form-wrapper h2 {
  font-size: 50px;
  margin-bottom: 30px; }

.contact-form-wrapper input {
  margin-bottom: 30px;
  border-radius: 0;
  background-color: transparent;
  border: 2px solid #032f62;
  border-radius: 40px;
  height: 50px;
  padding: 25px;
  color: #dddddd; }
  .contact-form-wrapper input:focus {
    background-color: transparent;
    color: #dddddd; }

.contact-form-wrapper textarea {
  border-radius: 0;
  background-color: transparent;
  margin-bottom: 30px;
  border-color: #032f62;
  border-radius: 40px;
  padding: 25px;
  color: #dddddd; }
  .contact-form-wrapper textarea:focus {
    background-color: transparent;
    color: #dddddd; }

.contact-form-wrapper ::-webkit-input-placeholder {
  color: #dddddd; }

.contact-form-wrapper ::-moz-placeholder {
  color: #dddddd; }

.contact-form-wrapper :-ms-input-placeholder {
  color: #dddddd; }

.contact-form-wrapper :-moz-placeholder {
  color: #dddddd; }

.equal-height {
  background-size: cover; }

/**************************
15.3 Start Contact And Countdown
***********************************/
.reg-form-area {
  transform: translateY(-25%);
  position: absolute;
  width: 90%; }
  @media (min-width: 768px) and (max-width: 991px) {
    .reg-form-area {
      position: relative;
      margin-bottom: -25%; } }
  @media (max-width: 768px) {
    .reg-form-area {
      position: relative;
      margin-bottom: -35%; } }
  @media (max-width: 575px) {
    .reg-form-area {
      position: relative;
      margin-bottom: -30%; } }
  .reg-form-area h2 {
    margin-bottom: 30px;
    font-weight: 600;
    font-family: "Poppins"; }
  .reg-form-area input {
    border-radius: 0;
    margin-bottom: 30px;
    border: 1px solid #2f345b;
    background-color: #0d1028;
    color: #fff;
    height: 55px; }
    .reg-form-area input:focus {
      background-color: #0d1028; }
  .reg-form-area ::-webkit-input-placeholder {
    color: #fff; }
  .reg-form-area ::-moz-placeholder {
    color: #fff; }
  .reg-form-area :-ms-input-placeholder {
    color: #fff; }
  .reg-form-area :-moz-placeholder {
    color: #fff; }
  .reg-form-area button[type="submit"] {
    border: 0;
    height: 55px;
    background-color: #91c73d;
    color: #fff;
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: 2px; }

/**************************
15.4 Start Contact Section
****************************/
.contact-from-wrapper input {
  border-radius: 0;
  height: 50px;
  background-color: #f9f9ff;
  position: relative; }
  .contact-from-wrapper input:focus {
    background-color: #f5ffe6;
    border-color: #91c73d;
    box-shadow: none; }
    .contact-from-wrapper input:focus label {
      color: #91c73d; }

.contact-from-wrapper label {
  position: absolute;
  right: 40px;
  top: 25px;
  transform: translateY(-50%);
  z-index: 3;
  color: #8a8d91; }

.contact-from-wrapper textarea {
  background-color: #f9f9ff;
  border-radius: 0;
  position: relative; }
  .contact-from-wrapper textarea:focus {
    background-color: #f5ffe6;
    border-color: #91c73d;
    box-shadow: none; }

.contact-from-wrapper button[type="submit"] {
  padding: 15px 25px;
  background-color: #91c73d;
  color: #fff;
  text-transform: uppercase;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  border: 0;
  border-radius: 50px; }
  .contact-from-wrapper button[type="submit"]:focus {
    outline: 0; }

.contact-from-wrapper-2 {
  overflow: hidden; }
  .contact-from-wrapper-2 input {
    border-radius: 0;
    height: 50px;
    background-color: #f9f9ff;
    position: relative; }
    .contact-from-wrapper-2 input:focus {
      background-color: #ffc6ac;
      border-color: #ff5202;
      box-shadow: none;
      color: #ff5202;
      font-weight: 500; }
  .contact-from-wrapper-2 textarea {
    background-color: #f9f9ff;
    border-radius: 0;
    position: relative; }
    .contact-from-wrapper-2 textarea:focus {
      background-color: #ffc6ac;
      border-color: #ff5202;
      box-shadow: none;
      color: #ff5202;
      font-weight: 500; }
  .contact-from-wrapper-2 button[type="submit"] {
    padding: 15px 25px;
    background-color: #ff5202;
    color: #fff;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    border: 0; }
    .contact-from-wrapper-2 button[type="submit"]:focus {
      outline: 0; }

/**********************
16. Courses Page
**************************/
.portfolios-list-2 ul li {
  margin: 5px; }

/******************************
17. Teacher Details
********************************/
.single-timeline h4 {
  color: #002147;
  font-size: 20px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600; }

.single-timeline span {
  color: #ff5202;
  font-size: 14px; }

.single-timeline .timeline-text {
  padding-top: 25px; }

.single-timeline p {
  margin-bottom: 0; }

.timeline-wrapper {
  position: relative; }
  @media (min-width: 992px) {
    .timeline-wrapper:after {
      content: "\f105";
      font-family: "Font Awesome 5 Free";
      font-weight: 900;
      position: absolute;
      right: 0;
      color: #fff;
      background-color: #ff5202;
      border-radius: 50%;
      text-align: center;
      top: -40px;
      width: 30px;
      height: 30px;
      font-size: 22px;
      line-height: 30px; }
    .timeline-wrapper:before {
      content: "";
      position: absolute;
      left: 0;
      background-color: #e8e8e8;
      top: -40px;
      width: 30px;
      height: 30px;
      font-size: 22px;
      line-height: 30px; }
    .timeline-wrapper .single-timeline {
      position: relative; }
      .timeline-wrapper .single-timeline:before {
        content: "\f192";
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        position: absolute;
        top: -50px;
        left: 0;
        width: 50px;
        height: 50px;
        color: #fff;
        background-color: #ff5202;
        border-radius: 50%;
        font-size: 30px;
        line-height: 50px;
        text-align: center; } }

.page-section-title {
  padding-bottom: 60px; }
  .page-section-title h2 {
    font-size: 50px;
    color: #002147;
    font-family: 'Poppins', sans-serif;
    font-weight: 600; }

.half_columnn_image img {
  width: 100%; }

.half_column_content h3 {
  font-size: 35px;
  color: #002147;
  font-weight: 600;
  font-family: 'Poppins', sans-serif; }

.half_column_content h6 {
  font-size: 20px;
  color: #666;
  font-weight: 600; }

.half_column_content p {
  line-height: 28px; }

.secondary-content {
  display: inline-block;
  width: 50%;
  float: left; }
  .secondary-content h6 {
    font-size: 16px;
    color: #002147; }

.single-member-info p {
  margin-bottom: 0; }

.single-member-info .member-intro h3 a {
  font-size: 20px;
  color: #002147;
  transition: all .4s linear 0s; }
  .single-member-info .member-intro h3 a:hover {
    text-decoration: none; }

.single-member-info .member-intro p {
  font-size: 14px;
  color: #666; }
  .single-member-info .member-intro p strong {
    color: #002147; }

.single-member-info .member-intro {
  padding: 20px 0 30px; }

.member-status {
  display: flex;
  justify-content: space-between; }
  .member-status p {
    font-size: 14px;
    color: #666; }
    .member-status p strong {
      color: #002147;
      font-weight: 500; }

.member-image {
  overflow: hidden; }
  .member-image img {
    transition: all .4s linear 0s; }

.single-member {
  transition: all .4s linear 0s; }
  .single-member:hover {
    box-shadow: 0 0.5rem 1rem rgba(34, 34, 34, 0.15) !important; }
    .single-member:hover .member-intro h3 a {
      color: #ff5202; }
    .single-member:hover .member-intro p {
      color: #ff5202; }
      .single-member:hover .member-intro p strong {
        color: #ff5202; }
    .single-member:hover .member-status p strong {
      color: #ff5202; }
    .single-member:hover .member-image img {
      transform: scale3d(1.1, 1.1, 1.1); }

.search-form select {
  border-radius: 0;
  margin-bottom: 20px;
  color: #666;
  height: 50px; }
  .search-form select:focus {
    outline: 0;
    box-shadow: none; }

.search-form input {
  border-radius: 0;
  margin-bottom: 20px;
  color: #666;
  height: 50px; }
  .search-form input:focus {
    outline: 0;
    box-shadow: none; }

.button-widget {
  background-size: cover;
  background-position: center center; }
  .button-widget h3 {
    color: #002147;
    padding-bottom: 15px;
    font-size: 24px;
    line-height: 35px;
    font-weight: 500; }

.widget-video-img {
  position: relative;
  text-align: center; }
  .widget-video-img:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 33, 71, 0.5); }
  .widget-video-img a {
    display: inline-block;
    position: absolute;
    text-align: center;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 60px;
    color: #fff;
    background-color: #ff5202;
    border-radius: 50%;
    line-height: 55px;
    transition: all .4s linear 0s;
    padding: 10px; }
  .widget-video-img:hover a {
    background-color: #fff;
    color: #ff5202; }
  .widget-video-img img {
    width: 100%; }

.highlights-section ul {
  margin: 0;
  padding: 0;
  list-style: none;
  padding: 10px 0; }
  .highlights-section ul li {
    display: inline-block;
    padding: 5px; }
  .highlights-section ul h4 {
    line-height: 35px; }

.highlights-section .social-links ul li a {
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  color: #fff;
  border: 2px solid #fff;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.19);
  transition: all .4s linear 0s;
  text-align: center; }
  .highlights-section .social-links ul li a:hover {
    background-color: #fff;
    border-color: #fff;
    color: #ff5202; }

/*********************************
18. Gallery Page
***********************************/
.gallery-links {
  display: inline-block;
  padding-top: 15px;
  border-top: 2px solid #fff; }
  .gallery-links ul {
    margin: 0;
    padding: 0; }
    .gallery-links ul li {
      display: inline-block;
      margin: 5px; }
      .gallery-links ul li a {
        display: inline-block;
        width: 50px;
        height: 50px;
        text-align: center;
        line-height: 50px;
        background-color: rgba(255, 82, 2, 0.3);
        border-radius: 50%;
        border: 2px solid #fff;
        color: #fff;
        transition: all .4s linear 0s; }
        .gallery-links ul li a:hover {
          background-color: #fff;
          color: #ff5202;
          border-color: #fff; }

.gallery-content {
  text-align: center;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
  opacity: 0;
  visibility: hidden;
  transition: all .4s linear 0s; }
  .gallery-content h3 {
    font-size: 30px;
    color: #fff;
    margin-bottom: 20px;
    padding: 0 25px; }

.single-gallery {
  transition: all .4s linear 0s; }
  .single-gallery .gallery-image {
    position: relative; }
    .single-gallery .gallery-image:before {
      content: "";
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(255, 82, 2, 0.8);
      opacity: 0;
      visibility: hidden;
      transition: all .4s linear 0s; }
    .single-gallery .gallery-image:hover:before {
      opacity: 1;
      visibility: visible; }
    .single-gallery .gallery-image img {
      width: 100%; }
  .single-gallery:hover .gallery-content {
    opacity: 1;
    visibility: visible; }