/*-----------------------------------------------------------------------------------

    Template Name: Teslainvestmentcompany - HYIP Investment Business HTML Template
    Template URI: http://rockstheme.com
    Description: This is html5 template
    Author: Rocks_theme
    Author URI: http://rockstheme.com
    Version: 1.0

-----------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------  
     CSS INDEX
    ===================

    1. Theme Default CSS (body, link color, section etc)
    2. Header Top Area
    2.1 Header Bottom Area 
    2.2. Sticky Header Area
    2.3. Mobile Menu Area
    3. Intro Area
    4. Count Area
    5. Invest Area
    6. support-service-area  Area
    7. Self Area Css
    8. work-proses area
    9. Payment History area
    10. Banner area.
    11. Blog Area
    12. Reviews Area Css
    13. FAQ  Area
    14. Footer Area
    15. Home 02 Area
    16. Bread cumb area
    17.	About page  CSS
    18.Feature Area
    19. Team Area
    20. Login And Register page
    21. Blog Sidebar Area
    22. Blog Details
    23.Contact CSS
    24.	Animation  CSS



`-----------------------------------------------------------------------------------*/
/*----------------------------------------*/
/*  Google Fonts
/*----------------------------------------*/
@import url("https://fonts.googleapis.com/css?family=Nunito:300,400,600,700,800&display=swap");

/*----------------------------------------*/
/*  1.  Theme default CSS
/*----------------------------------------*/
html,
body {
  height: 100%;
}
.floatleft {
  float: left;
}
.floatright {
  float: right;
}
.alignleft {
  float: left;
  margin-right: 15px;
  margin-bottom: 15px;
}
.alignright {
  float: right;
  margin-left: 15px;
  margin-bottom: 15px;
}
.aligncenter {
  display: block;
  margin: 0 auto 15px;
}
a:focus {
  outline: 0px solid;
}
img {
  max-width: 100%;
  height: auto;
}
.fix {
  overflow: hidden;
}
p {
  margin: 0 0 15px;
  color: #5d6471;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Nunito", sans-serif;
  margin: 0 0 15px;
  color: #151b2c;
  font-weight: 600;
}
h1 {
  font-size: 48px;
  line-height: 50px;
}
h2 {
  font-size: 38px;
  line-height: 46px;
}
h3 {
  font-size: 30px;
  line-height: 38px;
}
h4 {
  font-size: 24px;
  line-height: 34px;
}
h5 {
  font-size: 20px;
  line-height: 30px;
}
h6 {
  font-size: 16px;
  line-height: 28px;
}
a {
  transition: all 0.3s ease 0s;
  text-decoration: none;
}
a:hover {
  color: #5a165a;
  text-decoration: none;
}
a:active,
a:hover {
  outline: 0 none;
}
a:hover,
a:focus {
  color: #3d5368;
  text-decoration: none;
}
body {
  background: #fff none repeat scroll 0 0;
  color: #5d6471;
  font-family: "Nunito", sans-serif;
  font-size: 16px;
  text-align: left;
  overflow-x: hidden;
  line-height: 26px;
}
#scrollUp {
  bottom: 40px;
  font-size: 20px;
  line-height: 48px;
  right: 30px;
  width: 44px;
  background-color: #5a165a;
  color: #fff;
  text-align: center;
  height: 44px;
  border-radius: 3px;
  -webkit-transition-duration: 500ms;
  transition-duration: 500ms;
}
#scrollUp:hover {
  bottom: 45px;
  transition-duration: 500ms;
}
.clear {
  clear: both;
}
ul {
  list-style: outside none none;
  margin: 0;
  padding: 0;
}
input,
select,
textarea,
input[type="text"],
input[type="date"],
input[type="url"],
input[type="email"],
input[type="password"],
input[type="tel"],
button,
button[type="submit"] {
  -moz-appearance: none;
  box-shadow: none !important;
}
input:focus,
textarea:focus,
select:focus {
  outline: none;
}
div#preloader {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 99999;
  width: 100%;
  height: 100%;
  overflow: visible;
}
.navbar-collapse {
  padding-left: 0px;
}
::-moz-selection {
  background: #5a165a;
  text-shadow: none;
}
::selection {
  background: #5a165a;
  text-shadow: none;
}
.bg-color {
  background: #fafafa;
}
.browserupgrade {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0;
}
.area-padding {
  padding: 100px 0px;
}
.area-padding-2 {
  padding: 100px 0px 70px;
}
.page-padding {
  padding: 130px 0px 100px;
}
.page-padding-2 {
  padding: 130px 0px 70px;
}
.white-headline h3 {
  color: #fff;
}
.section-headline {
  padding-bottom: 40px;
  position: relative;
}
.section-headline.review-head {
  padding-bottom: 20px;
}
.section-headline h3 {
  font-size: 40px;
  line-height: 46px;
}
.section-headline p {
  font-size: 16px;
  max-width: 510px;
  margin: 0px auto;
}
.mar-row {
  margin-top: 50px;
}
.color {
  color: #5a165a;
}
/*--------------------------------*/
/*  2. Header top Area
/*--------------------------------*/
.topbar-left ul li {
  display: inline-block;
}
.topbar-area {
  background: rgba(4, 23, 46, 0.7) none repeat scroll 0 0;
}
.topbar-left ul li a {
  color: #ddd;
  display: block;
  font-weight: 600;
  margin-right: 20px;
  padding: 12px 0;
  text-decoration: none;
  font-size: 16px;
}
.topbar-left ul li a i {
  color: #5a165a;
  font-size: 16px;
  padding-right: 7px;
}
.topbar-right {
  position: relative;
  display: block;
  float: right;
}
.top-social {
  float: left;
  padding: 11px 0px;
  margin-left: 10px;
}
.top-social ul li {
  display: inline-block;
}
.top-social ul li a {
  color: #ddd;
  margin-right: 5px;
  display: block;
  text-align: center;
  font-size: 15px;
  width: 26px;
  height: 26px;
  border-radius: 5px;
  line-height: 26px;
}
.top-social ul li a:hover {
  color: #fff;
  background: #5a165a;
}
/*----------------------------------------*/
/*  2.1 Header Bottom Area 
/*----------------------------------------*/
.header-one {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  z-index: 999;
}
.header-area {
  background: transparent;
}
.logo {
  display: block;
}
.logo a {
  display: inline-block;
  height: auto;
  padding: 18px 0;
}
.center-bg {
  display: block;
  background: #fff;
  padding: 0px 20px 0px 0px;
}
.main-menu ul.navbar-nav li {
  float: left;
  position: relative;
}
.main-menu ul.navbar-nav li a {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  padding: 33px 15px;
  text-transform: uppercase;
  position: relative;
}
.main-menu ul.navbar-nav li a:hover {
  color: #5a165a;
}
.main-menu ul.navbar-nav li.active a:focus {
  color: #fff;
}
.main-menu ul.navbar-nav li.active a {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  color: #5a165a;
  position: relative;
  z-index: 9999999;
}
.navbar {
  border: medium none;
  margin-bottom: 0;
}
.navbar-default {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
}
.main-menu ul.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  background: none;
  color: #fff;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  background-color: transparent;
  color: #fff;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
  background: none;
}
.main-menu ul.nav li ul.sub-menu {
  background: #fff;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 115%;
  transition: all 0.3s ease 0s;
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
  visibility: hidden;
  width: 200px;
  z-index: -99;
  padding: 10px 0px;
  border-radius: 3px;
}
.pagess {
  position: relative;
}
.navbar.navbar-default {
  float: right;
}
.main-menu ul.nav li ul.sub-menu li {
  padding: 0;
  position: relative;
  width: 100%;
}
.main-menu ul.nav li:hover ul.sub-menu {
  top: 100%;
  opacity: 1;
  z-index: 999;
  visibility: visible;
}
.main-menu ul.nav li ul.sub-menu li a {
  color: #3d5368;
  display: block;
  font-size: 14px;
  padding: 5px 20px;
}
.main-menu ul.nav li ul.sub-menu li a span {
  color: #5a165a;
}
.main-menu ul.nav li:hover ul.sub-menu li a:hover {
  color: #5a165a;
}
.header-right-link {
  float: right;
  width: 115px;
  padding: 30px 0px;
  margin-left: 60px;
  text-align: right;
}
.slice-btn {
  display: inline-block;
  padding: 0px 15px;
}
.slice-btn span {
  font-size: 20px;
  font-weight: 500;
  color: #3d5368;
  cursor: pointer;
  line-height: 28px;
}
.s-menu {
  padding: 10px 25px;
  border: 1px solid #5a165a;
  background: #5a165a;
  color: #fff;
  transition: 0.4s;
  font-size: 15px;
  font-weight: 700;
  border-radius: 3px;
  text-transform: uppercase;
}
.s-menu:hover {
  border: 1px solid #fff;
  background: #fff;
  color: #5a165a;
  transition: 0.4s;
}
.header-area.stick .header-right-link {
  padding: 29px 0px;
}
.logo a.black-logo {
  display: none;
}
/*--------------------------------*/
/* 2.2. Sticky Header Area
/*--------------------------------*/
.header-area.stick {
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999999;
  box-shadow: 0px 0px 3px #ddd, -2px -2px 3px #ddd;
  background: #fff;
}
.header-area.stick .logo a {
  display: inline-block;
  height: auto;
  padding: 17px 0;
}
.header-area.stick .main-menu ul.navbar-nav li a {
  padding: 32px 15px;
  color: #151b2c;
}
.header-area.stick .main-menu ul.nav li ul.sub-menu li a {
  color: #151b2c;
  display: block;
  padding: 5px 15px;
}
.header-area.stick .main-menu ul.nav li ul.sub-menu li a:hover {
  color: #5a165a;
}
.header-area.stick .logo a.white-logo {
  display: none;
}
.header-area.stick .logo a.black-logo {
  display: block;
}
.header-area.stick .s-menu {
  border: 1px solid #5a165a;
  background: #5a165a;
  color: #fff;
  transition: 0.4s;
}
.header-area.stick .s-menu:hover {
  border: 1px solid #5a165a;
  background: #fff;
  color: #5a165a;
  transition: 0.4s;
}
/*----------------------------------------*/
/*  2.3. Mobile Menu Area
/*----------------------------------------*/
.mobile-menu-area {
  background: #fdfcfc none repeat scroll 0 0;
  padding: 10px 0px;
}
.mean-container .mean-bar::after {
  content: "";
  font-size: 21px;
  left: 5%;
  position: absolute;
  top: 12px;
  text-transform: uppercase;
  font-weight: 500;
}
.mean-container a.meanmenu-reveal:hover {
  color: #5a165a;
}
.mean-container .mean-nav ul {
  list-style-type: none;
  margin: 20px 0px;
  padding: 0;
  width: 100%;
}
.mean-container .mean-nav ul li a {
  background: #fdfcfc none repeat scroll 0 0;
  color: #3d5368;
  display: block;
  float: left;
  font-size: 14px;
  font-weight: 400;
  margin: 0;
  padding: 13px 10px;
  text-align: left;
  text-decoration: none;
  text-transform: capitalize;
  width: 90%;
}
.mean-nav ul li.mean-last {
  margin-bottom: 20px;
}
.mean-container .mean-nav ul li a.mean-expand {
  color: #3d5368;
  line-height: 17px;
}
.mean-container .mean-nav ul li {
  width: 99.7%;
}
/*----------------------------------------*/
/*  3. Intro Area
/*----------------------------------------*/
.slide-area {
  background: rgba(0, 0, 0, 0) url(img/slider/h111.jpg) no-repeat scroll top
    center / cover;
  width: 100%;
  height: 100%;
  z-index: 1;
  position: relative;
}
.slide-area::after {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  background: rgba(10, 24, 40, 0.8) none repeat scroll 0 0;
  content: "";
  z-index: -1;
}
.display-table {
  width: 100%;
  height: 100%;
  display: table;
}
.display-table-cell {
  width: 100%;
  height: 100%;
  display: table-cell;
  vertical-align: middle;
}
.slide-content {
  margin-top: 60px;
}
.title2 {
  font-size: 50px;
  line-height: 92px;
  margin: 0px auto;
  color: #fff;
  padding-bottom: 20px;
  max-width: 900px;
  font-weight: 500;
}
.ready-btn {
  border: 1px solid #5a165a;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  margin-top: 20px;
  padding: 12px 10px;
  text-align: center;
  text-transform: uppercase;
  transition: all 0.4s ease 0s;
  z-index: 2;
  background: #5a165a;
  width: 160px;
  border-radius: 2px;
}
.ready-btn.right-btn {
  margin-left: 15px;
  background: #fff;
  border: 1px solid #fff;
  color: #444;
}
.ready-btn.right-btn:hover {
  background: #5a165a;
  border: 1px solid #5a165a;
  color: #fff;
  transition: 0.4s;
}
.ready-btn.left-btn:hover {
  background: #fff;
  border: 1px solid #fff;
  color: #5a165a;
  transition: 0.4s;
}
.slide-area .video-content {
  display: inline-block;
  margin-left: 40px;
}
.slide-content .video-play.vid-zone i {
  border-radius: 50%;
  display: inline-block;
  text-align: center;
  height: 30px;
  width: 30px;
  line-height: 30px;
  position: relative;
  font-size: 14px;
  background: #fff;
  color: #5a165a;
  margin-right: 10px;
  transition: 0.4s;
}
.slide-content .video-content a span {
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  transition: 0.4s;
}
.slide-content .video-content a:hover i {
  background: #5a165a;
  color: #fff;
  transition: 0.4s;
}
.slide-content .video-content a:hover span {
  color: #5a165a;
  transition: 0.4s;
}
/*----------------------------------------*/
/* 4. Count Area
/*----------------------------------------*/
.counter-area {
  position: relative;
  overflow: hidden;
}
.counter-inner {
  background: #f5f5f5;
  padding: 100px 30px 100px 70px;
}
.fun-title h3 {
  color: #f5f5f5;
  font-size: 32px;
  line-height: 42px;
  margin-bottom: 0px;
  font-weight: 600;
}
.fun-content {
  display: block;
}
.fun_text i {
  font-size: 44px;
  color: #fff;
  background: #5a165a;
  margin-bottom: 20px;
  display: inline-block;
  line-height: 78px;
  font-weight: 100;
  width: 80px;
  height: 80px;
  border-radius: 50%;
}
.fun_text {
  text-align: center;
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
  padding: 40px 30px;
  position: relative;
  margin-bottom: 30px;
}
.fun_text::after {
  position: absolute;
  content: "";
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 1px;
  background: #5a165a;
}
.fun_text .counter {
  color: #444;
  display: block;
  font-size: 20px;
  font-weight: bold;
  padding-bottom: 10px;
}
.fun_text h4 {
  margin-bottom: 0px;
}
.fun_text > h5 {
  color: #444;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 0;
  line-height: 20px;
}
/*----------------------------------------*/
/*  5. Invest Area
/*----------------------------------------*/
.per-day {
  color: #444;
  font-size: 24px;
  text-transform: capitalize;
  margin-top: 15px;
  display: block;
  font-weight: 600;
}
span.users {
  color: #444;
}
.prices {
  font-size: 40px;
  font-weight: 700;
  color: #5a165a;
  padding-right: 10px;
  line-height: 40px;
}
.pri_table_list {
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
  padding: 40px;
  position: relative;
  overflow: hidden;
  border: 1px solid #5a165a;
  margin-bottom: 30px;
}
.pricing-text {
  padding: 10px 0px;
  display: block;
}
.pri_table_list ol li {
  padding: 5px 0px;
  font-size: 15px;
}
.price-btn a {
  color: #fff;
  text-transform: uppercase;
  transition: all 0.4s ease 0s;
  border-radius: 2px;
  font-weight: 700;
  font-size: 14px;
  padding: 8px 20px;
  background: #5a165a;
  display: inline-block;
  border: 1px solid #5a165a;
}
.price-btn a:hover {
  background: transparent;
  color: #5a165a;
  border: 1px solid #5a165a;
  transition: all 0.4s ease 0s;
}
.pri_table_list > h3 {
  color: #455454;
  font-size: 24px;
  font-weight: 400;
  line-height: 25px;
  text-transform: capitalize;
  transition: all 0.4s ease 0s;
}
.pri_table_list ol {
  list-style: outside none none;
}
.base {
  position: absolute;
  right: -52px;
  top: 24px;
  background: #1aa15f;
  width: 180px;
  text-align: center;
  height: 30px;
  line-height: 28px;
  color: #fff;
  transform: rotate(45deg);
}
/*--------------------------------*/
/* 6. support-service-area  Area
/*--------------------------------*/
.support-services {
  background: #fff;
  position: relative;
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
  z-index: 1;
  padding: 40px;
  overflow: hidden;
  border-radius: 3px;
  transition: 0.4s;
  z-index: 1;
  margin-bottom: 30px;
  border: 1px solid #5a165a;
}
.support-services::after {
  position: absolute;
  content: "";
  left: 0px;
  top: 0;
  width: 100%;
  height: 100%;
  background: #5a165a;
  transition: 0.4s;
  opacity: 0;
  z-index: -1;
}
.support-images {
  float: left;
  font-size: 44px;
  color: #5a165a;
  line-height: 70px;
  width: 70px;
  height: 70px;
  border: 1px solid #5a165a;
  text-align: center;
  margin-right: 30px;
  border-radius: 50%;
}
.support-content {
  padding-left: 100px;
}
.support-content h4 {
  font-size: 24px;
  text-transform: capitalize;
  color: #151b2c;
}
.support-content p {
  margin-bottom: 0px;
}
.support-services:hover::after {
  transition: 0.4s;
  opacity: 1;
}
.support-services:hover .support-images {
  transition: 0.4s;
  color: #fff;
  border: 1px solid #fff;
}
.support-services:hover .support-content h4,
.support-services:hover .support-content p {
  color: #fff;
}
/*----------------------------------------
 7.Self Area Css
----------------------------------------*/
.self-area {
  background: url(img/background/ag1.webp);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  background-attachment: scroll;
  z-index: 1;
  position: relative;
}
.self-area:after {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(6, 34, 65, 0.4) none repeat scroll 0 0;
  content: "";
  z-index: -1;
}
.self-content {
  background: #fff;
  padding: 50px 30px 50px 50px;
  border-radius: 4px;
}
.talk-text {
  font-size: 18px;
  color: #666;
}
/*----------------------------------------*/
/*  8.work-proses area
/*----------------------------------------*/
.single-proses {
  margin-top: 10px;
  margin-bottom: 30px;
}
.proses-icon a {
  width: 100px;
  height: 100px;
  line-height: 97px;
  font-size: 36px;
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
  display: inline-block;
  border-radius: 50%;
  margin-bottom: 30px;
  background: #fff;
}
.proses-icon {
  position: relative;
  display: inline-block;
}
.point-view {
  width: 40px;
  height: 40px;
  line-height: 37px;
  font-size: 16px;
  color: #fff;
  border-radius: 50%;
  position: absolute;
  left: -10px;
  top: -10px;
}
.proses-text p {
  margin-bottom: 0px;
}
.point-blue .point-view {
  background: #5a165a;
  border: 1px solid #5a165a;
}
.point-orange .point-view {
  background: #b91ca8;
  border: 1px solid #b91ca8;
}
.point-green .point-view {
  background: #1aa15f;
  border: 1px solid #1aa15f;
}
.point-blue.proses-icon a {
  color: #5a165a;
}
.point-orange.proses-icon a {
  color: #b91ca8;
}
.point-green.proses-icon a {
  color: #1aa15f;
}
.proses-text h4 {
  text-transform: capitalize;
  font-size: 22px;
  max-width: 270px;
  margin: 0px auto;
}
/*----------------------------------------*/
/*  9.Payment History area
/*----------------------------------------*/
.payment-history-area {
  background: url(img/background/bg3.jpg);
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  z-index: 1;
  position: relative;
  overflow: hidden;
}
.payment-history-area::after {
  background: rgba(255, 255, 255, 0.8) none repeat scroll 0 0;
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.deposite-content {
  position: relative;
}
.deposite-content table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}
.deposite-content td,
.deposite-content th {
  border: 1px solid #ccc;
  text-align: left;
  padding: 8px;
}
.deposite-content tr:nth-child(even) {
  background-color: #e9ebec;
}
.diposite-box {
  width: 80%;
  margin: 0 auto;
  background: #f5f5f5;
  padding: 40px;
  margin-bottom: 30px;
  position: relative;
}
.diposite-box::after {
  position: absolute;
  content: "";
  left: 0;
  top: 0px;
  width: 100%;
  height: 5px;
  background: #5a165a;
}
.diposite-box h4 {
  display: inline-block;
  font-size: 26px;
  background: #5a165a;
  padding: 10px 30px;
  margin-bottom: 25px;
  border-radius: 3px;
  color: #fff;
}
.diposite-box span {
  float: right;
  font-size: 28px;
  color: #fff;
  background: #5a165a;
  padding: 10px 20px;
  border-radius: 3px;
  line-height: 32px;
}
/*----------------------------------------*/
/*  10. banner Area
/*----------------------------------------*/
.banner-area {
  background: rgba(0, 0, 0, 0) url(img/background/fg.png) no-repeat scroll top
    center / cover;
  position: relative;
  z-index: 1;
}
.banner-area:after {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(6, 34, 65, 0.7) none repeat scroll 0 0;
  content: "";
  z-index: -1;
}
.banner-btn {
  border: 1px solid #5a165a;
  display: inline-block;
  padding: 12px 25px;
  color: #fff;
  font-weight: 500;
  font-size: 20px;
  background: #5a165a;
  border-radius: 2px;
}
.banner-btn:hover {
  background: transparent;
  border: 1px solid #fff;
  color: #fff;
}
.banner-content h3 {
  color: #fff;
  font-size: 40px;
  max-width: 840px;
  line-height: 46px;
  font-weight: 600;
  margin: 0 auto 40px;
}
.banner-content {
  overflow: hidden;
  padding: 0px 40px;
}
/*----------------------------------------*/
/*  10. Blog Area
/*----------------------------------------*/
.blog-content {
  padding: 30px;
  position: relative;
  z-index: 1;
  transition: 0.5s;
  overflow: hidden;
}
.blog-content a h4 {
  font-size: 21px;
  color: #2a354e;
  line-height: 30px;
  transition: 0.4s;
}
.home-blog .blog-content a h4 {
  margin-bottom: 0px;
}
.admin-type i,
.date-type i,
.comments-type i {
  color: #5a165a;
  margin-right: 5px;
}
.single-blog:hover .blog-content::after {
  transition: 0.4s;
  opacity: 1;
  top: 0px;
}
.blog-content p {
  line-height: 28px;
  transition: 0.4s;
}
.blog-content a h4:hover {
  color: #5a165a;
  transition: 0.4s;
}
.blog-meta span {
  color: #757b82;
  font-size: 14px;
  font-weight: 400;
  padding-right: 10px;
}
.admin-type img {
  width: 50px;
  height: 50px;
  border-radius: 50px;
  border: 2px solid #5a165a;
  margin-right: 10px;
}
.single-blog {
  position: relative;
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
  margin-bottom: 30px;
}
.blog-meta {
  margin-bottom: 15px;
}
.blog-btn {
  color: #fff;
  display: inline-block;
  font-size: 16px;
  font-weight: 400;
  transition: all 0.4s ease 0s;
  border: 1px solid #5a165a;
  background: #5a165a;
  padding: 7px 24px;
  margin-top: 10px;
  border-radius: 3px;
}
.blog-btn:hover {
  color: #5a165a;
  background: transparent;
  transition: all 0.4s ease 0s;
}
/*----------------------------------------
  12. Reviews Area Css
----------------------------------------*/
.reviews-area {
  position: relative;
}
.testimonial-inner {
  padding: 0px 50px 0px 0px;
}
.review-head h3 {
  font-size: 34px;
  line-height: 40px;
}
.review-head p {
  font-size: 17px;
}
.reviews-btn {
  border: 1px solid #5a165a;
  background: #5a165a;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-size: 18px;
  font-weight: 600;
  margin-top: 20px;
  padding: 10px 20px;
  text-align: center;
  text-transform: capitalize;
  transition: all 0.4s ease 0s;
  border-radius: 2px;
}
.reviews-btn:hover {
  border: 1px solid #5a165a;
  background: #fff;
  color: #5a165a;
}
.single-testi {
  margin: 0px 0px 40px;
}
.clients-text {
  padding: 30px 30px;
  position: relative;
  background-color: #fff;
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
}
.testi-img {
  position: relative;
  margin-top: 30px;
}
.testi-img img {
  width: 100%;
  display: inline-block !important;
  max-width: 80px;
  height: auto;
  border-radius: 50px;
  margin-right: 20px;
}
.reviews-content .active.center .testi-img img {
  border: 1px solid #5a165a;
}
.guest-details {
  display: inline-block;
  text-align: left;
  top: 15px;
  position: relative;
}
.reviews-content {
  margin-bottom: 5px;
}
.testi-text h4 {
  font-weight: 600;
  text-transform: uppercase;
  font-size: 15px;
  margin-bottom: 0px;
}
.testi-text p {
  margin-bottom: 0px;
}
.client-rating {
  margin-bottom: 10px;
}
.testi-text span a {
  color: #5a165a;
}
.testi-text h5 {
  color: #2a354e;
  font-size: 20px;
}
.client-rating a {
  display: inline-block;
  color: #fec731;
  font-size: 20px;
  padding: 0px 5px 0px 0px;
}
.reviews-content .active.center .single-testi .clients-text {
  border: 1px solid #5a165a;
}
.reviews-content .active.center .single-testi .clients-text p {
  color: #444;
}
.testimonial-carousel.owl-carousel.owl-theme
  .owl-controls
  .owl-dots
  div.owl-dot
  > span {
  background: #2a354e none repeat scroll 0 0;
  display: inline-block;
  height: 8px;
  width: 8px;
  -moz-transition: 0.4s;
  -webkit-transition: 0.4s;
  -o-transition: 0.4s;
  -ms-transition: 0.4s;
  transition: 0.4s;
  border-radius: 50%;
}
.testimonial-carousel.owl-carousel.owl-theme .owl-controls .owl-dots {
  bottom: -10px;
  display: block;
  left: 50%;
  margin-left: -40px;
  position: absolute;
}
.testimonial-content {
  margin-bottom: 15px;
}
.testimonial-carousel.owl-carousel.owl-theme
  .owl-controls
  .owl-dots
  div.owl-dot {
  display: inline-block;
  margin: 0 3px;
}
.testimonial-carousel.owl-carousel.owl-theme
  .owl-controls
  .owl-dots
  div.owl-dot.active
  span {
  background: #5a165a;
  width: 30px;
  border-radius: 3px;
}
.review-page-area .testi-img img {
  border: 1px solid #5a165a;
}
/*----------------------------------------*/
/*  13. FAQ  Area
/*----------------------------------------*/
.company-faq {
  display: block;
  overflow: hidden;
}
.faq-details .panel-heading {
  padding: 0;
}
.panel {
  margin-bottom: 20px;
  background-color: transparent;
  border: none;
  border-radius: 4px;
}
.panel-default {
  border-color: #f5f5f5;
  border-radius: 0 !important;
}
.panel-group .panel + .panel {
  margin-top: 0px;
}
.panel-default > .panel-heading {
  color: #151b2c;
  background: transparent;
}
.panel-default > .panel-heading + .panel-collapse > .panel-body {
  border: none;
  background: transparent;
}
.faq-details h4.check-title a {
  color: #151b2c;
  display: block;
  padding: 15px 10px 15px 70px;
  text-decoration: none;
  background: transparent;
}
.panel-body {
  padding: 0px 15px 0px 70px;
}
.faq-details h4.check-title {
  color: #5a165a;
  font-size: 18px;
  margin-bottom: 0px;
  text-transform: capitalize;
  font-weight: 400;
}
.faq-details .panel-heading h4 a {
  position: relative;
}
.faq-details .panel-heading h4 a::before {
  color: #151b2c;
  content: "\e648 ";
  font-family: themify;
  font-size: 16px;
  left: 0px;
  line-height: 52px;
  position: absolute;
  text-align: center;
  top: 6px;
  width: 50px;
  height: 100%;
}
.faq-details .panel-heading h4 a.active::before {
  color: #fff;
  content: "\e64b";
  font-family: themify;
  font-size: 16px;
  left: 0px;
  line-height: 61px;
  position: absolute;
  text-align: center;
  top: 0px;
  width: 50px;
  height: 100%;
  background: #5a165a;
}
.faq-area .col-md-6 {
  padding-left: 0px;
  padding-right: 0px;
}
.faq-area .faq-content {
  margin-left: 80px;
  padding: 30px;
  border-radius: 2px;
  border: 1px solid #5a165a;
  background: #fafafa;
}
.faq-area .contact-form input[type="text"],
.faq-area .contact-form input[type="email"] {
  border: 1px solid #ccc;
  border-radius: 0;
  height: 44px;
  margin-bottom: 15px;
  padding-left: 20px;
  width: 100%;
  background: transparent;
  color: #5d6471;
}
.faq-content h4 {
  color: #151b2c;
  padding-bottom: 20px;
}
.faq-area .faq-content .contact-form textarea#message {
  height: 135px;
  background: transparent;
  color: #5d6471;
  border: 1px solid #ccc;
  border-radius: 0;
}
.faq-area .quote-btn {
  font-weight: 600;
  color: #fff;
  background: #5a165a;
  display: inline-block;
  border: 1px solid #5a165a;
  padding: 10px 20px;
  width: 134px;
  text-transform: uppercase;
  border-radius: 3px;
  transition: 0.4s;
  margin-top: 10px;
}
.faq-area .quote-btn:hover {
  background: transparent;
  color: #5a165a;
  transition: 0.4s;
}
/*----------------------------------------*/
/*  14. Footer Area
/*----------------------------------------*/
.footer1 {
  background: url(img/background/fg.png);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  z-index: 1;
  position: relative;
  overflow: hidden;
}
.footer1::after {
  background: rgba(255, 255, 255, 0.98) none repeat scroll 0 0;
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.footer-area {
  padding: 100px 0px;
}
.footer-content {
  overflow: hidden;
}
.footer-logo {
  margin-bottom: 20px;
}
.footer-head p {
  color: #5d6471;
}
.logo-footer .footer-head p {
  color: #5d6471;
  margin-bottom: 0px;
}
.footer-head h4 {
  color: #444;
  font-size: 22px;
  margin-bottom: 30px;
  text-transform: capitalize;
  font-weight: 600;
}
.footer-icons ul li {
  display: inline-block;
}
.footer-icons ul li a {
  color: #fff;
  display: block;
  font-size: 15px;
  line-height: 28px;
  text-align: center;
  margin-right: 3px;
  width: 30px;
  height: 30px;
  border: 1px solid #5a165a;
  border-radius: 2px;
  background: #5a165a;
  transition: 0.4s;
}
.footer-tags li a:hover,
.footer-icons ul li a:hover {
  color: #5a165a;
  background: #fff;
  transition: 0.4s;
}
.footer-tags {
  display: block;
  overflow: hidden;
}
.footer-tags li {
  float: left;
}
.footer-tags li a {
  color: #757b82;
  display: block;
  font-size: 14px;
  font-weight: 500;
  padding: 3px 5px;
}
.footer-icons {
  margin-top: 30px;
}
.footer-list {
  width: 50%;
  float: left;
}
.footer-contacts p span {
  color: #5a165a;
  font-weight: 700;
}
.subs-feilds {
  margin-top: 30px;
}
.suscribe-input {
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
  width: 95%;
}
.footer-content.logo-footer {
  padding-right: 30px;
}
.suscribe-input input {
  color: #757b82;
  font-size: 15px;
  line-height: 24px;
  padding: 6px 15px;
  height: 46px;
  border-radius: 0;
  width: 64%;
  float: left;
  background: #fff;
}
.suscribe-input button {
  background: #5a165a;
  border: none;
  color: #fff;
  font-size: 15px;
  padding: 10px 5px;
  width: 36%;
  font-weight: 600;
  height: 46px;
  border: 1px solid #5a165a;
  transition: 0.4s;
}
.suscribe-input button:hover {
  color: #5a165a;
  background: #fff;
  transition: 0.4s;
}
.footer-list li a {
  color: #5d6471;
  padding: 7px 0px 7px 20px;
  display: block;
  position: relative;
  font-weight: 400;
}
.footer-list li a:first-child {
  padding-top: 0px;
}
.footer-list li a::after {
  position: absolute;
  content: "\e649";
  right: auto;
  top: 0px;
  left: 0;
  font-family: themify;
  font-size: 12px;
}
.footer-list li a:hover {
  color: #5a165a;
}
.footer-list li a:hover::after {
  color: #5a165a;
}
.footer-area-bottom {
  padding: 25px 0;
  background: #f4f4f4;
}
.copyright-text a:hover {
  text-decoration: underline;
  color: #5a165a;
}
.copyright-text a {
  color: #5a165a;
}
.copyright > p {
  margin-bottom: 0;
  color: #5d6471;
}
.copyright a {
  color: #5a165a;
}
/*----------------------------------------*/
/*  15. Home 02 area
/*----------------------------------------*/
.intro-content {
  position: relative;
  z-index: 1;
}
.intro-content::after {
  background: rgba(4, 23, 46, 0.75) none repeat scroll 0 0;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}
.slider-content {
  position: absolute;
  right: 0;
  text-align: left;
  top: 50%;
  z-index: 3;
  left: 0;
  margin: 0 auto;
  margin-top: -135px;
}
.intro-area .slide-content {
  margin-top: 30px;
}

.intro-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-prev,
.intro-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-next {
  color: #fff;
  font-size: 24px;
  margin-top: -20px;
  position: absolute;
  top: 50%;
  text-align: center;
  line-height: 50px;
  opacity: 0;
  border: 1px solid #fff;
  width: 50px;
  height: 50px;
  border-radius: 3px;
}
.intro-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-prev {
  left: 10%;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  -ms-transition: 0.4s;
}
.intro-carousel.owl-carousel.owl-theme .owl-controls .owl-nav div.owl-next {
  right: 10%;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  -ms-transition: 0.4s;
}
.intro-carousel.owl-carousel.owl-theme:hover
  .owl-controls
  .owl-nav
  div.owl-next {
  right: 2%;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  -ms-transition: 0.4s;
  opacity: 1;
}
.intro-carousel.owl-carousel.owl-theme:hover
  .owl-controls
  .owl-nav
  div.owl-prev {
  left: 2%;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  -ms-transition: 0.4s;
  opacity: 1;
}
.intro-carousel.owl-carousel.owl-theme:hover
  .owl-controls
  .owl-nav
  div.owl-next:hover,
.intro-carousel.owl-carousel.owl-theme:hover
  .owl-controls
  .owl-nav
  div.owl-prev:hover {
  color: #fff;
  background: #5a165a;
  border: 1px solid #5a165a;
}
.intro-carousel .owl-item.active .slider-images img {
  transform: scale(1.1);
  transition: 10s;
}
/*----------------------------------------*/
/*  16.	Breadcumbs  CSS
/*----------------------------------------*/
.page-area {
  position: relative;
}
.page-area {
  background: url(img/background/b.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}
.breadcumb-overlay {
  position: absolute;
  background: rgba(10, 24, 40, 0.8) none repeat scroll 0 0;
  top: 0;
  width: 100%;
  left: 0;
  height: 100%;
}
.breadcrumb {
  padding: 190px 0px 60px;
  background-color: transparent;
  margin-bottom: 0;
}
.breadcrumb-bg {
  position: relative;
  top: 93px;
  background: #0a1828;
  border-radius: 5px;
  padding: 22px 30px;
  z-index: 99;
  max-width: 80%;
  margin: 0 auto;
}
.breadcrumb .section-headline h3 {
  font-size: 38px;
  line-height: 42px;
  text-transform: uppercase;
  position: relative;
  top: 15px;
  font-weight: 700;
  padding: 40px 0px;
}
.breadcrumb .section-headline {
  padding-bottom: 0px;
}
.breadcrumb .section-headline h3::after {
  display: none;
}
.breadcrumb ul li {
  display: inline-block;
  color: #f3f0ff;
  padding: 0px 10px 0px 20px;
  position: relative;
  font-size: 15px;
  text-transform: uppercase;
  font-weight: 700;
}
.breadcrumb ul li.home-bread {
  padding-left: 0px;
}
.breadcrumb ul li.home-bread::after {
  position: absolute;
  content: "\f105";
  font-family: fontAwesome;
  right: -10px;
  top: 0;
}
.breadcrumb .section-headline::after {
  display: none;
}
/*----------------------------------------*/
/*  17.	About page  CSS
/*----------------------------------------*/
.about-content h3 {
  line-height: 36px;
  font-size: 29px;
  position: relative;
  font-weight: 700;
}
.about-content p {
  font-size: 15px;
  letter-spacing: 0.4px;
  line-height: 24px;
  margin-bottom: 5px;
}
.about-content {
  margin-top: 30px;
}
.about-details {
  overflow: hidden;
  display: block;
  padding-top: 10px;
}
.marker-list li {
  color: #777;
  padding-left: 30px;
  margin: 10px 0px;
  position: relative;
  font-size: 15px;
}
.marker-list li::after {
  position: absolute;
  content: "";
  left: 5px;
  top: 10px;
  background: #5a165a;
  width: 5px;
  height: 5px;
}
.about-image {
  border-radius: 5px;
  position: relative;
  overflow: hidden;
  margin-right: 40px;
}
.about-image img {
  border-radius: 5px;
}
.about-image::after {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 50%;
  height: 100%;
  content: "";
  background: rgba(6, 34, 65, 0.6) none repeat scroll 0 0;
}
.about-image .video-content {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  margin: 0 auto;
  margin-top: -50px;
  text-align: center;
  z-index: 9;
}
.about-image .video-play.vid-zone {
  background: #5a165a;
  border-radius: 100%;
  display: inline-block;
  font-size: 34px;
  height: 100px;
  line-height: 96px;
  width: 100px;
  overflow: hidden;
  transition: 0.4s;
}
.about-image .video-play.vid-zone i {
  color: #fff;
  margin-left: 5px;
}
.about-image .video-play.vid-zone:hover {
  background: #fff;
  color: #5a165a;
  transition: 0.4s;
}
.about-image .video-play.vid-zone:hover i {
  color: #5a165a;
}
.mission-about {
  border: 1px solid #ccc;
  padding: 20px 35px;
  display: block;
  position: relative;
  text-align: center;
  margin-bottom: 30px;
}
.mission-icon {
  display: block;
}
.mission-icon i {
  font-size: 40px;
  width: 80px;
  height: 80px;
  border: 1px solid #ccc;
  display: inline-block;
  text-align: center;
  line-height: 80px;
  position: relative;
  top: -60px;
  background: #fff;
  color: #5a165a;
  border-radius: 50%;
  transition: 0.4s;
}
.mission-text {
  margin-top: -25px;
}
.mission-text p {
  font-size: 16px;
}
.mission-about:hover .mission-icon i {
  border: 1px solid #5a165a;
  background: #5a165a;
  color: #fff;
  transition: 0.4s;
}
.mission-about {
  margin-top: 40px;
}
/*--------------------------------*/
/* 18.Feature Area
/*--------------------------------*/
.feature-area {
  position: relative;
}
.feature-text {
  margin-top: 50px;
}
.feature-image {
  border-radius: 10px;
  position: relative;
  overflow: hidden;
}
.feature-text h3 {
  font-size: 40px;
  line-height: 46px;
}
.feature-text li {
  display: block;
  position: relative;
}
.feature-text ul li a {
  font-size: 15px;
  color: #5d6471;
  padding: 6px 0px 6px 35px;
  display: block;
}
.feature-text li::after {
  position: absolute;
  left: 0px;
  top: 6px;
  content: "\e64c";
  font-family: themify;
  width: 24px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  border-radius: 50px;
  font-size: 12px;
  color: #fff;
  background: #5a165a;
}
.feature-btn {
  padding: 10px 20px;
  border: 1px solid #5a165a;
  background: #5a165a;
  color: #fff;
  transition: 0.4s;
  font-size: 14px;
  font-weight: 600;
  border-radius: 2px;
  margin-top: 20px;
  display: inline-block;
  text-transform: uppercase;
}
.feature-btn:hover {
  border: 1px solid #5a165a;
  background: #fff;
  color: #5a165a;
  transition: 0.4s;
}
.margin-row {
  margin-top: 60px;
}
/*----------------------------------------*/
/*  19. Team Area
/*----------------------------------------*/
.team-area {
  background: #fff;
}
.single-member {
  margin-bottom: 30px;
  border: 1px solid #f4f4f4;
  padding: 30px 20px;
}
.single-member .team-img {
  display: inline-block;
  position: relative;
  overflow: hidden;
  max-height: 200px;
  max-width: 200px;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 2px solid #5a165a;
}
.team-hover li {
  display: inline-block;
  margin-right: 5px;
}
.team-hover li a {
  color: #fff;
  border: 1px solid #5a165a;
  background: #5a165a;
  display: block;
  width: 34px;
  height: 34px;
  line-height: 32px;
  border-radius: 50%;
}
.team-hover li a:hover {
  color: #fff;
  border: 1px solid #1fc157;
  background: #1fc157;
}
.team-hover {
  padding: 15px 0 0px;
  text-align: center;
  transition: all 0.4s ease 0s;
}
.single-member .team-img a {
  display: block;
}
.team-content {
  padding: 10px 0px 0px;
}
.team-content h5 a {
  color: #666;
}
.team-content p {
  margin-bottom: 0;
}
.team-content h5 {
  font-size: 18px;
  margin: 10px 0px;
  text-transform: capitalize;
  font-weight: 600;
}
/*----------------------------------------
20. Login And Register page
----------------------------------------*/
.login-page {
  display: block;
  overflow: hidden;
  border: 1px solid #ccc;
  width: 50%;
  margin: 0 auto;
  text-align: center;
  border-radius: 3px;
}
.login-form {
  background: #fff;
  padding: 40px;
  overflow: hidden;
}
.login-image {
  width: 50%;
  float: left;
}
.login-image,
.log-inner img {
  height: 100%;
  max-height: 535px;
  object-fit: cover;
}
.login-area form#contactForm {
  border: none;
  border-radius: 0;
  box-shadow: none;
  background: #fff;
}
.login-form .form-control {
  display: block;
  width: 100%;
  height: 50px;
  padding: 7px 15px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 0px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out 0.15s,
    -webkit-box-shadow ease-in-out 0.15s;
  -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  min-height: 36px;
  margin-bottom: 20px;
}
.login-title {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 30px;
}
.login-btn {
  padding: 10px 30px;
  border: 1px solid #5a165a;
  background: #5a165a;
  color: #fff;
  transition: 0.4s;
  font-size: 15px;
  font-weight: 700;
  border-radius: 2px;
  text-transform: uppercase;
  display: block;
  width: 100%;
}
.login-btn:hover {
  border: 1px solid #5a165a;
  background: transparent;
  color: #5a165a;
  transition: 0.4s;
}
.flex-box {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
}
.check-group {
  position: relative;
  margin: 0px 0px 20px;
}
.check-box {
  color: #151b2c;
  font-weight: 300;
  letter-spacing: 0;
  margin-bottom: 0;
  outline: none;
  display: -webkit-inline-box;
  display: inline-flex;
  -webkit-box-align: center;
  align-items: center;
  padding-left: 0;
}
.check-box-input {
  position: absolute;
  left: 0px;
  top: 0px;
  min-height: 25px;
  height: 26px;
  margin: 0 !important;
  padding: 0 !important;
}
.remember-text {
  color: #151b2c;
  font-weight: 300;
  font-size: 12px;
  left: 25px;
  position: absolute;
  top: 2px;
}
.text-muted {
  font-size: 12px;
  float: right;
  margin-top: 2px;
}
.separetor {
  margin-top: 10px;
}
.separetor span {
  background: #fff;
  position: relative;
  top: 10px;
  padding: 10px 0px 0px;
}
.sign-icon {
  display: block;
  overflow: hidden;
  margin-top: 30px;
  text-align: center;
}
.sign-icon ul li {
  display: inline-block;
  margin: 0px 5px;
}
.sign-icon ul li a {
  color: #fff;
  display: block;
  text-transform: uppercase;
  font-size: 15px;
  padding: 0px 30px 0px 0px;
  font-weight: 600;
}
.sign-icon ul li a.facebook {
  color: #3b5998;
}
.sign-icon ul li a.twitter {
  color: #00aced;
}
.sign-icon ul li a.google {
  color: #c32f10;
}
.acc-not {
  font-size: 13px;
  margin-top: 20px;
  font-weight: 600;
}
.signup-form .check-group {
  position: relative;
  margin: 0px 0px 20px;
}
.signup-page .login-image,
.signup-page .log-inner img {
  height: 100%;
  max-height: 588px;
  object-fit: cover;
}
/*----------------------------------------*/
/*  21. Blog Sidebar Area
/*----------------------------------------*/
.blog-page-area .single-blog {
  padding: 5px;
  background: #fff;
}
.blog-page-area .blog-content {
  padding: 10px 15px 20px;
}
.blog-search-option input {
  padding: 5px 15px;
  width: 80%;
  border: none;
  height: 56px;
  background: transparent;
}
.blog-search-option {
  margin-bottom: 30px;
  display: block;
  background: #fff;
  border: 1px solid #5a165a;
  border-radius: 3px;
}
.blog-search-option button {
  background: transparent;
  border: none;
}
.blog-search-option button i {
  line-height: 16px;
  font-size: 18px;
  padding: 0px 10px;
}
.blog-search-option button i:hover {
  color: #5a165a;
}
.left-blog h4 {
  position: relative;
  color: #3d5368;
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 5px;
  padding: 15px 0px;
  text-transform: capitalize;
}
.left-blog h4::after {
  position: absolute;
  content: "";
  left: 0;
  bottom: 0;
  width: 70px;
  height: 1px;
  background: #5a165a;
}
.blog-left-content .blog-content::after {
  display: none;
}
.left-side {
  padding-right: 40px;
}
.right-side {
  padding-left: 40px;
}
.left-blog {
  overflow: hidden;
  padding-bottom: 20px;
}
.blog-category li,
.left-blog li {
  display: block;
  position: relative;
}
.left-blog ul li a {
  color: #3d5368;
  display: inline-block;
  font-size: 15px;
  padding: 7px 0px 7px 25px;
  text-transform: capitalize;
}
.blog-category ul {
  margin-top: 12px;
}
.left-blog ul li span {
  display: inline-block;
  border: 1px solid #5a165a;
  background: #5a165a;
  width: 24px;
  height: 24px;
  text-align: center;
  border-radius: 4px;
  font-size: 13px;
  color: #fff;
  line-height: 24px;
}
.pst-content .date-type {
  font-size: 14px;
}
.blog-category ul li:after {
  position: absolute;
  content: "\e649";
  right: 5px;
  top: 8px;
  font-family: themify;
  color: #3d5368;
  font-size: 13px;
}
.popular-tag.left-blog ul li a:before {
  display: none;
}
.recent-single-post {
  display: block;
  overflow: hidden;
  padding: 15px 0px;
}
.recent-single-post:last-child {
  border-bottom: none;
}
.post-img {
  display: inline-block;
  float: left;
  padding-right: 10px;
}
.left-blog .post-img a {
  display: block;
  border: 1px solid #fafafa;
}
.left-blog .post-img a img {
  border-radius: 4px;
}
.pst-content {
  padding-left: 100px;
}
.pst-content p {
  margin-bottom: 0px;
}
.pst-content p a:hover,
.left-blog ul li a:hover {
  color: #5a165a;
}
.blog-page-area .blog-content {
  background: #f9f9f9;
}
.pst-content p a {
  color: #3d5368;
  font-size: 15px;
}
.blog-tags {
  padding: 1px 0;
}
.recent-single-post img {
  width: 100%;
  max-width: 80px;
  height: 80px;
  object-fit: cover;
  border-radius: 2px;
}
.left-blog li:last-child {
  border-bottom: 0;
}
.popular-tag.left-side-tags.left-blog ul {
  padding: 0px;
}
.left-tags .left-side-tags ul li {
  border-bottom: 0;
  display: inline-block;
  margin: 5px 3px;
}
.left-tags .left-side-tags ul li a {
  padding: 5px 10px;
  width: auto;
  background: #f4f5f4;
  color: #3d5368;
  border-radius: 3px;
  font-weight: 400;
  font-size: 14px;
}
.left-tags .left-side-tags ul li a:hover {
  color: #fff;
  background: #5a165a;
}
.left-side-tags h4 {
  margin-bottom: 15px;
}
.blog-side-area .blog-right-column {
  margin-top: -30px;
}
.pagination {
  display: inline-block;
  padding-left: 0;
  margin: 20px 0 0px;
  border-radius: 4px;
}
.pagination > li > a,
.pagination > li > span {
  position: relative;
  float: left;
  padding: 6px 12px;
  line-height: 1.42857143;
  text-decoration: none;
  color: #3d5368;
  background-color: #f4f5f5;
  border: none;
  margin-left: -1px;
  border-radius: 2px;
}
.pagination > li {
  display: inline-block;
  margin: 0px 3px 0px 0px;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
  z-index: 3;
  color: #fff;
  background-color: #5a165a;
  cursor: default;
  border-radius: 2px;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
  z-index: 2;
  color: #fff;
  background-color: #5a165a;
  border-color: #5a165a;
  border-radius: 2px;
}
.adver-img {
  margin-top: 20px;
}
/*----------------------------------------*/
/*  22. Blog Details
/*----------------------------------------*/
.comments-heading h3,
h3.comment-reply-title {
  border-bottom: 1px solid #ddd;
  color: #3d5368;
  font-size: 18px;
  margin: 0 0 40px;
  padding: 0 0 5px;
  text-transform: capitalize;
}
.comments-list ul li {
  margin-bottom: 25px;
}
.comments-list-img {
  float: left;
  margin-right: 15px;
  border-radius: 50%;
}
.comments-list-img img {
  border-radius: 3px;
  border: 1px solid #ddd;
}
.comments-content-wrap {
  color: #3d5368;
  font-size: 14px;
  margin: 0 0 15px 90px;
  padding: 10px;
  position: relative;
}
blockquote {
  padding: 20px 40px 40px 80px;
  margin: 0 0 20px;
  font-size: 15px;
  border-left: none;
  font-style: italic;
  position: relative;
  background: #f5f5f5;
}
blockquote::before {
  position: absolute;
  top: 20px;
  left: 30px;
  content: "\f10d ";
  font-family: fontawesome;
  font-size: 34px;
  color: #3d5368;
}
blockquote p {
  font-size: 16px !important;
  line-height: 28px;
}
.author-avatar {
  display: inline-block;
  float: left;
  width: 10%;
}
.comments-content-wrap span b {
  margin-right: 5px;
}
.comments-content-wrap span a:hover {
}
span.post-time {
  margin-right: 5px;
}
.comments-content-wrap p {
  color: #3d5368;
  margin-top: 10px;
}
.threaded-comments {
  margin-left: 50px;
}
.comment-respond {
  margin-top: 20px;
}
span.email-notes {
  color: #3d5368;
  display: block;
  font-size: 12px;
  margin-bottom: 10px;
}
.comment-respond p {
  color: #3d5368;
  margin-bottom: 5px;
}
.comment-respond input[type="text"],
.comment-respond input[type="email"] {
  border: 1px solid #ccc;
  border-radius: 0;
  height: 46px;
  margin-bottom: 15px;
  padding: 0 0 0 10px;
  width: 100%;
  background: transparent;
}
.comment-respond textarea#message-box {
  border: 1px solid #ccc;
  border-radius: 0;
  max-width: 100%;
  padding: 10px;
  height: 200px;
  width: 100%;
  background: transparent;
}
.comments-content-wrap span a {
  color: #5a165a;
}
.comments-content-wrap span a:hover {
  color: #5a165a;
}
.comment-respond .add-btn.contact-btn {
  background: #5a165a;
  color: #fff;
  display: block;
  font-size: 16px;
  margin-top: 5px;
  padding: 10px 20px;
  transition: 0.4s;
  border-radius: 2px;
  width: auto !important;
  margin-top: 20px;
  border: 1px solid #5a165a;
  text-transform: capitalize;
  font-weight: 600;
}
.comment-respond .add-btn.contact-btn:hover {
  background: #fff;
  color: #5a165a;
  border: 1px solid #5a165a;
}
.blog-page-details .left-blog-page {
  margin-top: 0px;
  margin-bottom: 30px;
}
.single-post-comments,
.related-post {
  margin-top: 30px;
}
.left-head-blog .pst-content p {
  margin-bottom: 5px;
}
.blog-details .blog-content h4 {
  font-size: 22px;
  line-height: 34px;
  margin-top: 10px;
}
.blog-details .blog-content h5 {
  font-size: 20px;
}
.blog-details .blog-content {
  border: 1px solid #f5f5f5;
  padding: 30px 30px 15px;
}
.blog-details .blog-images img {
  width: 100%;
  height: 100%;
  max-height: 450px;
  object-fit: cover;
}
.blog-details .img-blog {
  margin: 30px 0px;
  width: 100%;
  height: 100%;
  max-height: 350px;
  overflow: hidden;
}
.related-post-list .recent-single-post {
  width: 50%;
  float: left;
  padding: 0px 20px 0px 0px;
}
.related-post-list .recent-single-post:last-child {
  padding: 0px 0px 0px 20px;
}
/*----------------------------------------*/
/* 23.Contact CSS
/*----------------------------------------*/
.contact-area {
  height: auto;
  width: 100%;
}
.contact-content {
  padding: 100px;
  background: #000 none repeat scroll 0 0;
}
.contact-area .contact-form {
  margin-left: 15px;
}
.contact-form input[type="text"],
.contact-form input[type="email"] {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: 1px solid #ccc;
  border-radius: 0;
  color: #3d5368;
  height: 46px;
  margin-bottom: 25px;
  padding-left: 20px;
  width: 100%;
}
.contact-form textarea#message {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: 1px solid #ccc;
  border-radius: 0;
  color: #3d5368;
  height: 160px;
  padding: 20px;
  width: 100%;
}
.contact-form button[type="submit"] {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: 1px solid #5a165a;
  color: #fff;
  display: block;
  font-size: 18px;
  margin-top: 16px;
  padding: 13px 24px;
  border-radius: 2px;
  transition: all 0.3s ease 0s;
  background: #5a165a;
}
.contact-form button[type="submit"]:hover {
  color: #5a165a;
  border: 1px solid #5a165a;
  background: #fff;
  transition: all 0.3s ease 0s;
}
.single-icon i {
  font-size: 64px;
  line-height: 77px;
  margin-bottom: 20px;
  color: #5a165a;
}
.single-icon p {
  font-size: 16px;
  line-height: 30px;
  margin-bottom: 0px;
}
.contact-icon {
  margin-bottom: 50px;
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
  padding: 30px 30px 30px;
  position: relative;
  z-index: 1;
}
/*----------------------------------------*/
/*  24.	Animation  CSS
/*----------------------------------------*/
.last-item {
  margin-bottom: 0px;
}
@-webkit-keyframes bounce {
  0% {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
  }
  50% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }
  100% {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
  }
}

@keyframes bounce {
  0% {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
  }
  50% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }
  100% {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
  }
}

@-webkit-keyframes popcircle {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  99% {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
  }
  100% {
    opacity: 0;
  }
}

@keyframes popcircle {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  99% {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes rotateme {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes rotateme {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-webkit-keyframes animationFramesOne {
  0% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }
  20% {
    -webkit-transform: translate(73px, -1px) rotate(36deg);
    transform: translate(73px, -1px) rotate(36deg);
  }
  40% {
    -webkit-transform: translate(141px, 72px) rotate(72deg);
    transform: translate(141px, 72px) rotate(72deg);
  }
  60% {
    -webkit-transform: translate(83px, 122px) rotate(108deg);
    transform: translate(83px, 122px) rotate(108deg);
  }
  80% {
    -webkit-transform: translate(-40px, 72px) rotate(144deg);
    transform: translate(-40px, 72px) rotate(144deg);
  }
  100% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }
}

@keyframes animationFramesOne {
  0% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }
  20% {
    -webkit-transform: translate(73px, -1px) rotate(36deg);
    transform: translate(73px, -1px) rotate(36deg);
  }
  40% {
    -webkit-transform: translate(141px, 72px) rotate(72deg);
    transform: translate(141px, 72px) rotate(72deg);
  }
  60% {
    -webkit-transform: translate(83px, 122px) rotate(108deg);
    transform: translate(83px, 122px) rotate(108deg);
  }
  80% {
    -webkit-transform: translate(-40px, 72px) rotate(144deg);
    transform: translate(-40px, 72px) rotate(144deg);
  }
  100% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }
}

/*--------------------------------*/
/* .End CSS
/*--------------------------------*/