/* Table of Content
==================================================
1. Typography
2. Global Styles (body, link color, gap, ul, section-title, overlay etc)
3. Utilities
4. Overrides
5. Preloader
6. Header Area
7. Info Box
8. Tel Number
9. Testimonials
10. Portfolio Box
11. Inline Form
12. Quote Slider
13. Video Popup
14. Service Box
15. Video Button
16. Infographic
17. Achievements
18. Team
19. Doctors
20. Doctor Box
21. Doctor Info
22. Doctor Social
23. Services
24. Price List
25. Biography
26. Pricing
27. Timetable
28. Contact Form
29. Copyright
30. Messenger Button
31. Back To Top

*/

/* Typography
================================================== */
body {
   font-family: $bodyFont;
   line-height: 26px;
   font-size: 15px;
   color: #666666;
   font-weight:400 !important;
   word-break: break-word;
   -webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4,
h5,
h6 {
   color: $title-color;
   font-family: $Exo;
}

h1,
h2 {
   font-family: $Exo;
}

h1 {
   font-size: 36px;
   line-height: 36px;
   font-weight: 700;
}

h2 {
   font-size: 30px;
   line-height: 36px;
   font-weight: 700;
}

h3 {
   font-size: 24px;
   margin-bottom: 20px;
   font-weight: 700;
}

h4 {
   font-size: 18px;
   line-height: 28px;
   font-weight: 700;
}

h5 {
   font-size: 16px;
   line-height: 24px;
   font-weight: 600;
}
h6 {
   font-size: 14px;
   line-height: 24px;
   font-weight: 600;
}

/* Global styles
================================================== */
body {
   border: 0;
   margin: 0;
   padding: 0;
}

ul {
   margin: 0;
}
iframe {
   border: none; }
   
a:link,
a:visited {
   text-decoration: none;
}

a {
   color: $primary-color;
   @include transition();
}

a:hover {
   text-decoration: none;
   color: $primary-color;
}

a.read-more {
   color: $primary-color;
   font-weight: 700;
}

a.read-more:hover {
   color: $title-color;
}

.body-color {
   background: #161362;
   color: $white-color;
}
a:focus {
   outline: 0;
}

img.pull-left {
   margin-right: 20px;
   margin-bottom: 20px;
}

img.pull-right {
   margin-left: 20px;
   margin-bottom: 20px;
}

button:focus {
   outline: 0;
}

abbr[data-original-title],
abbr[title] {
    border-bottom: 1px dotted;
    text-decoration: none;
}

.unstyled {
   list-style: none;
   margin: 0;
   padding: 0;
}

.dropcap {
   font-size: 48px;
   line-height: 60px;
   padding: 0 7px;
   float: left;
   font-weight: 700;
   margin: 5px 15px 5px 0;
   position: relative;
   text-transform: uppercase;
}

.slick-dots > li > button:before {
   display: none;
}

/** Buttons **/
.btn {
   font-size: 14px;
   font-weight: 700;
   color: $white-color;
   text-transform: uppercase;
   background: $primary-color;
   height: 45px;
   padding: 3px 35px 0;
   line-height: 42px;
   @include border-radius(0px);
   @include transition();
   outline: none;
   text-decoration: none;
   cursor: pointer;
   border: none;

   &:focus {
      outline: none;
   }

   &:hover {
      color: $primary-color;
      background: $white-color;
      box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.15);
   }

   &.fill {
      background: transparent;
      padding: 0 25px;
      color: $white-color;
      margin-left: 20px;
      border: 2px solid $white-color;

      &:hover {
         background: $primary-color;
         border-color: $primary-color;
      }
   }

   &.btn-round {
      @include border-radius(36px);
   }
}

.btn-link {
   font-size: 13px;
   font-weight: 700;
   color: $primary-color;
   text-decoration: none !important;

   i {
      margin-left: 6px;
      position: relative;
      top: 2px;
   }

   &:hover {
      color: $primary-color;
   }
}
.btn-white {
   background: $white-color;
   color: #2c2c2c;
   box-shadow: none;
}
.solid-bg-two {
   background: #f2f2f2;
}

.btn-primary.focus,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show > .btn-primary.dropdown-toggle:focus {
    box-shadow: none;
}


/** Form Controls **/
.mf-input-select {
   cursor: pointer;

   > option {
      color: $title-color;
   }
}

.mf-input {
   &.flatpickr-input {
      &::-webkit-input-placeholder { color: #666; }
      &::-moz-placeholder { color: #666; }
      &:-ms-input-placeholder { color: #666; }
      &:-moz-placeholder { color: #666; }
   }
}


/** Title **/
.title-bg-small {
   font-size: 14px;
   font-weight: 700;
   line-height: 24px;
   margin-bottom: 15px;
   color: $white-color;
   background: $black-color;
   display: inline-block;
   padding: 3px 18px;
   text-transform: uppercase;
}

.section-title,
.column-title {
   font-size: 36px;
   font-weight: 300;
   color: $black-color;
   position: relative;

   span {
      font-weight: 700;
   }

   &:after {
      position: absolute;
      left: 0;
      height: 1px;
      width: 40px;
      background: #ff5d34;
      content: '';
      bottom: -26%;
      display: none;
   }

   &.title-center{
      &:after{
         margin: auto;
         left: 0;
         right: 0;
      }
   }

   &.title-right{
      &:after{
         margin: auto;
         left: auto;
         right: 0;
      }
   }
}

.title-small {
   font-size: 30px;
   font-weight: 700;
}

.xs-title {
   font-size: 24px;
   font-weight: 600;
}

/** Overlay **/
.overlay {
   position: relative;
   z-index: 1;

   &:before {
      @include absolute();
      width: 100%;
      height: 100%;
      content: '';
      background: rgba(0, 0, 0, 0.68);
      z-index: -1;
   }
}

.overlay-two {
   &::before {
      background: rgba(1, 14, 42, 0.6);
   }
}

.main-container {
   padding: 80px 0;

   &.blog,
   &.blog-single {
      padding-top: 110px;
      padding-bottom: 70px;
   }
}

@keyframes slideInUp {
   from {
      transform: translate3d(0, 100%, 0);
      visibility: visible;
   }

   to {
      transform: translate3d(0, 0, 0);
   }
}
