/*** VARIABLE ***/
/*============================================================================
#Typography variables
==============================================================================*/
/*============================================================================
#Variable
==============================================================================*/
/*============================================================================
#Function
==============================================================================*/
/*=======================================================================
# MIXIN
========================================================================*/
/*========================================================================*/
/*============================== SOCIAL MEDIA ============================*/
/*========================================================================*/
.hv-bg-facebook {
  background: #fff; }
  .hv-bg-facebook:hover {
    background: #47649e !important;
    color: #fff; }
    .hv-bg-facebook:hover .fa {
      color: #fff;
      font-size: 1.42857em; }

.bg-gray {
  background: #d7d7d7;
  color: #fff; }
  .bg-gray .fa {
    color: #fff; }

.txt-facebook {
  color: #47649e !important; }

.hv-txt-facebook:hover {
  color: #47649e !important; }

.hv-bd-facebook:hover {
  border: #47649e 1px solid !important; }

.hv-bg-twitter {
  background: #fff; }
  .hv-bg-twitter:hover {
    background: #00a0d1 !important;
    color: #fff; }
    .hv-bg-twitter:hover .fa {
      color: #fff;
      font-size: 1.42857em; }

.bg-gray {
  background: #d7d7d7;
  color: #fff; }
  .bg-gray .fa {
    color: #fff; }

.txt-twitter {
  color: #00a0d1 !important; }

.hv-txt-twitter:hover {
  color: #00a0d1 !important; }

.hv-bd-twitter:hover {
  border: #00a0d1 1px solid !important; }

.hv-bg-google-plus {
  background: #fff; }
  .hv-bg-google-plus:hover {
    background: #dd4b39 !important;
    color: #fff; }
    .hv-bg-google-plus:hover .fa {
      color: #fff;
      font-size: 1.42857em; }

.bg-gray {
  background: #d7d7d7;
  color: #fff; }
  .bg-gray .fa {
    color: #fff; }

.txt-google-plus {
  color: #dd4b39 !important; }

.hv-txt-google-plus:hover {
  color: #dd4b39 !important; }

.hv-bd-google-plus:hover {
  border: #dd4b39 1px solid !important; }

.hv-bg-youtube {
  background: #fff; }
  .hv-bg-youtube:hover {
    background: #c4302b !important;
    color: #fff; }
    .hv-bg-youtube:hover .fa {
      color: #fff;
      font-size: 1.42857em; }

.bg-gray {
  background: #d7d7d7;
  color: #fff; }
  .bg-gray .fa {
    color: #fff; }

.txt-youtube {
  color: #c4302b !important; }

.hv-txt-youtube:hover {
  color: #c4302b !important; }

.hv-bd-youtube:hover {
  border: #c4302b 1px solid !important; }

.hv-bg-instagram {
  background: #fff; }
  .hv-bg-instagram:hover {
    background: #e4405f !important;
    color: #fff; }
    .hv-bg-instagram:hover .fa {
      color: #fff;
      font-size: 1.42857em; }

.bg-gray {
  background: #d7d7d7;
  color: #fff; }
  .bg-gray .fa {
    color: #fff; }

.txt-instagram {
  color: #e4405f !important; }

.hv-txt-instagram:hover {
  color: #e4405f !important; }

.hv-bd-instagram:hover {
  border: #e4405f 1px solid !important; }

.social-icons .fa {
  font-size: 1.07143em;
  -webkit-transition: all ease 500ms;
  -moz-transition: all ease 500ms;
  -ms-transition: all ease 500ms;
  -o-transition: all ease 500ms;
  transition: all ease 500ms; }

.social-icons li {
  float: left; }
  .social-icons li:not(:last-child) {
    margin-right: 5px; }
  .social-icons li:hover a {
    -webkit-border-radius: 0 10px;
    border-radius: 0 10px; }

.social-icons a {
  width: 35px;
  height: 35px;
  color: #243ba5;
  border: #dedede 1px solid;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-border-radius: 10px 0;
  border-radius: 10px 0;
  -webkit-transition: all ease 500ms;
  -moz-transition: all ease 500ms;
  -ms-transition: all ease 500ms;
  -o-transition: all ease 500ms;
  transition: all ease 500ms; }

.social-media {
  width: 100%;
  float: left; }
  .social-media label {
    display: inline-block; }
  .social-media a {
    margin-right: 5px;
    float: left; }

/*========================================================================*/
/*=============================== TAG STYLE ==============================*/
/*========================================================================*/
.tags-list {
  width: 100%;
  float: left;
  padding: 0; }
  .tags-list a {
    color: #656565;
    font-size: 0.85714em;
    padding: 5px 10px;
    border: #dedede 1px solid;
    margin: 0 10px 10px 0;
    display: inline-block;
    float: left;
    position: relative;
    overflow: hidden;
    -webkit-transition: all ease 150ms;
    -o-transition: all ease 150ms;
    transition: all ease 150ms; }
    .tags-list a:before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: -3px;
      width: 3px;
      background: #243ba5;
      z-index: 2;
      -webkit-transition: all ease 300ms;
      -o-transition: all ease 300ms;
      transition: all ease 300ms; }
    .tags-list a:after {
      border-top: 10px solid transparent;
      border-left: 5px solid #243ba5;
      border-bottom: 10px solid transparent;
      content: "";
      position: absolute;
      left: -5px;
      top: 20%;
      z-index: 1;
      -webkit-transition: all ease 300ms;
      -o-transition: all ease 300ms;
      transition: all ease 300ms; }
  .tags-list .tag_hover_style_1:hover {
    color: #243ba5;
    border-color: #243ba5;
    padding: 5px 5px 5px 15px; }
    .tags-list .tag_hover_style_1:hover:before {
      -webkit-transform: translateX(3px);
      -ms-transform: translateX(3px);
      transform: translateX(3px); }
    .tags-list .tag_hover_style_1:hover:after {
      -webkit-transform: translateX(7px);
      -ms-transform: translateX(7px);
      transform: translateX(7px);
      width: 5px;
      overflow: hidden; }
  .tags-list .tag_hover_style_2:hover {
    background: #beeace; }

/*========================================================================*/
/*============================== HOVER BUTTON ============================*/
/*========================================================================*/
.button-hover-1 {
  background: #243ba5;
  color: #fff;
  border: none;
  position: relative;
  font-size: 1em;
  padding: 0 2em;
  cursor: pointer;
  transition: 800ms ease all;
  outline: none; }
  .button-hover-1 span:before, .button-hover-1 span:after {
    content: '';
    position: absolute;
    width: 2px;
    height: 0;
    background: #243ba5;
    -webkit-transition: 400ms ease all;
    -o-transition: 400ms ease all;
    transition: 400ms ease all; }
  .button-hover-1 span:before {
    top: 0;
    left: 0; }
  .button-hover-1 span:after {
    bottom: 0;
    right: 0; }
  .button-hover-1:before, .button-hover-1:after {
    content: '';
    position: absolute;
    height: 2px;
    width: 0;
    background: #243ba5;
    -webkit-transition: 400ms ease all;
    -o-transition: 400ms ease all;
    transition: 400ms ease all; }
  .button-hover-1:before {
    top: 0;
    right: 0; }
  .button-hover-1:after {
    left: 0;
    bottom: 0; }
  .button-hover-1:hover {
    background: #fff !important;
    color: #243ba5 !important; }
    .button-hover-1:hover:before, .button-hover-1:hover:after {
      width: 100%;
      transition: 800ms ease all; }
    .button-hover-1:hover span:before, .button-hover-1:hover span:after {
      height: 100%;
      transition: 800ms ease all; }

.button-hover-2 {
  color: #fff !important;
  position: relative;
  text-transform: uppercase;
  background: #243ba5; }
  .button-hover-2 span {
    z-index: 9;
    position: relative; }
  .button-hover-2:before {
    position: absolute;
    content: "";
    top: 0;
    bottom: 0;
    left: 0;
    width: 0;
    z-index: 1;
    background: #ff0000; }
    @media (min-width: 1200px) {
      .button-hover-2:before {
        -webkit-transition: width ease-in 300ms;
        -moz-transition: width ease-in 300ms;
        -ms-transition: width ease-in 300ms;
        -o-transition: width ease-in 300ms;
        transition: width ease-in 300ms; } }
  .button-hover-2:hover:before {
    width: 100%; }

.button-hover-3 {
  color: #fff !important;
  position: relative;
  background: #243ba5;
  -webkit-transition: background linear 300ms;
  -moz-transition: background linear 300ms;
  -ms-transition: background linear 300ms;
  -o-transition: background linear 300ms;
  transition: background linear 300ms; }
  .button-hover-3:hover {
    background: #ff0000 !important; }

.libra-health___button {
  color: #fff !important;
  position: relative;
  background: #243ba5;
  -webkit-transition: all linear 300ms;
  -moz-transition: all linear 300ms;
  -ms-transition: all linear 300ms;
  -o-transition: all linear 300ms;
  transition: all linear 300ms; }
  .libra-health___button:hover {
    background: #f79124; }

/*========================================================================*/
/*============================== HOVER LINK ==============================*/
/*========================================================================*/
.link-hover-1 {
  position: relative; }
  .link-hover-1 > a {
    padding: 5px 20px 5px 10px !important;
    position: relative;
    z-index: 3; }
  .link-hover-1 > .bg-link {
    position: absolute;
    background: #ff0000;
    width: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    height: 100%; }
    @media (min-width: 1200px) {
      .link-hover-1 > .bg-link {
        -webkit-transition: all 200ms ease-out 0s;
        -moz-transition: all 200ms ease-out 0s;
        -ms-transition: all 200ms ease-out 0s;
        -o-transition: all 200ms ease-out 0s;
        transition: all 200ms ease-out 0s; } }
  .link-hover-1:hover > a {
    color: #fff !important;
    background-color: transparent !important; }
  .link-hover-1:hover > .bg-link {
    width: 100%; }

.link-hover-top {
  position: relative; }
  .link-hover-top > a {
    padding: 5px 20px !important;
    position: relative;
    z-index: 3; }
  .link-hover-top > .bg-link {
    position: absolute;
    background: #ff0000;
    height: 0;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 2;
    -webkit-transition: all 200ms ease-out 0s;
    -moz-transition: all 200ms ease-out 0s;
    -ms-transition: all 200ms ease-out 0s;
    -o-transition: all 200ms ease-out 0s;
    transition: all 200ms ease-out 0s; }
  .link-hover-top:hover > a {
    color: #fff !important;
    background-color: transparent !important; }
  .link-hover-top:hover > .bg-link {
    height: 100%; }

/*========================================================================*/
/*============================== HOVER IMAGE =============================*/
/*========================================================================*/
@media (min-width: 1200px) {
  .image-hover-1 {
    position: relative; }
    .image-hover-1:before, .image-hover-1:after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      -webkit-transition: 0.6s;
      -o-transition: 0.6s;
      transition: 0.6s; }
    .image-hover-1:hover:before {
      top: 50%;
      bottom: 50%;
      -webkit-transition: 0.6s;
      -o-transition: 0.6s;
      transition: 0.6s;
      background-color: rgba(255, 255, 255, 0.5); }
    .image-hover-1:hover:after {
      left: 50%;
      right: 50%;
      -webkit-transition: 0.6s;
      -o-transition: 0.6s;
      transition: 0.6s;
      background-color: rgba(255, 255, 255, 0.5); }
  .image-hover-line {
    position: relative;
    z-index: 1;
    text-align: center; }
    .image-hover-line .image-line:after {
      content: '';
      position: absolute;
      z-index: 1;
      width: 100%;
      height: 0;
      top: 0;
      left: 0;
      -moz-transition: all 500ms ease;
      -webkit-transition: all 500ms ease;
      -o-transition: all 500ms ease;
      transition: all 500ms ease;
      -moz-backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
      backface-visibility: hidden;
      background: rgba(0, 0, 0, 0.18); }
    .image-hover-line .effect-line {
      position: absolute;
      content: "";
      top: 0;
      right: 0;
      left: 0;
      bottom: 0;
      z-index: 1; }
      .image-hover-line .effect-line:before {
        z-index: 1;
        content: "";
        position: absolute;
        left: 10px;
        right: 10px;
        top: 10px;
        bottom: 10px;
        border-top: 2px solid #fff;
        border-bottom: 2px solid #fff;
        transform: scale(0, 1);
        -moz-transform: scale(0, 1);
        -webkit-transform: scale(0, 1);
        -ms-transform: scale(0, 1);
        transition: all 0.4s ease-in-out 0s;
        -moz-transition: all 0.4s ease-in-out 0s;
        -webkit-transition: all 0.4s ease-in-out 0s; }
      .image-hover-line .effect-line:after {
        z-index: 1;
        content: "";
        position: absolute;
        left: 10px;
        right: 10px;
        top: 10px;
        bottom: 10px;
        border-left: 2px solid #fff;
        border-right: 2px solid #fff;
        transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(0, 1);
        transition: all 0.4s ease-in-out 0s;
        -moz-transition: all 0.4s ease-in-out 0s;
        -webkit-transition: all 0.4s ease-in-out 0s; }
      .image-hover-line .effect-line:hover:before, .image-hover-line .effect-line:hover:after {
        transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1); }
  .image-hover-2 {
    overflow: hidden;
    position: relative;
    display: block;
    text-align: center; }
    .image-hover-2:before {
      content: '';
      height: 100%;
      background: rgba(0, 0, 0, 0.3) url("icon-plusf15d.png?v=47") no-repeat scroll center center;
      left: 0;
      opacity: 0;
      -moz-opacity: 0;
      -webkit-opacity: 0;
      position: absolute;
      top: 0;
      transform: scale(0.5) rotateY(180deg);
      -moz-transform: scale(0.5) rotateY(180deg);
      -webkit-transform: scale(0.5) rotateY(180deg);
      -ms-transform: scale(0.5) rotateY(180deg);
      transition: all 0.4s ease-in-out 0s;
      -moz-transition: all 0.4s ease-in-out 0s;
      -webkit-transition: all 0.4s ease-in-out 0s;
      visibility: hidden;
      width: 100%;
      z-index: 9; }
    .image-hover-2:hover:before {
      transform: scale(1) rotateY(0deg);
      -moz-transform: scale(1) rotateY(0deg);
      -webkit-transform: scale(1) rotateY(0deg);
      -ms-transform: scale(1) rotateY(0deg);
      visibility: visible;
      opacity: 1;
      -moz-opacity: 1;
      -webkit-opacity: 1; } }

/*========================================================================*/
/*============================== HOVER ITEM =============================*/
/*========================================================================*/
.item-hover-1 {
  position: relative; }
  .item-hover-1:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: #ff0000;
    height: 5px;
    -moz-transform: scaleX(0);
    -o-transform: scaleX(0);
    -ms-transform: scaleX(0);
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all ease-in-out 300ms;
    -moz-transition: all ease-in-out 300ms;
    -ms-transition: all ease-in-out 300ms;
    -o-transition: all ease-in-out 300ms;
    transition: all ease-in-out 300ms; }
  .item-hover-1:hover:before {
    -moz-transform: scaleX(1);
    -o-transform: scaleX(1);
    -ms-transform: scaleX(1);
    -webkit-transform: scaleX(1);
    transform: scaleX(1); }

/*========================================================================*/
/*============================== HOVER BORDER ============================*/
/*========================================================================*/
.aniborder_title {
  position: relative; }
  .aniborder_title .heading-line {
    position: absolute;
    bottom: -9px; }
  .aniborder_title .short-line {
    display: inline-block;
    width: 0;
    height: 3px;
    background-color: #243ba5;
    border-radius: 10px;
    position: relative;
    margin-right: 10px;
    transition: all .4s linear;
    -webkit-transition: background ease 500ms;
    -moz-transition: background ease 500ms;
    -ms-transition: background ease 500ms;
    -o-transition: background ease 500ms;
    transition: background ease 500ms;
    -webkit-animation: move-short 2.5s infinite linear;
    animation: move-short 2.5s infinite linear; }
  .aniborder_title .long-line {
    display: inline-block;
    width: 130px;
    height: 3px;
    background-color: #243ba5;
    border-radius: 10px;
    position: relative;
    transition: all .4s linear;
    -webkit-transition: background ease 500ms;
    -moz-transition: background ease 500ms;
    -ms-transition: background ease 500ms;
    -o-transition: background ease 500ms;
    transition: background ease 500ms;
    -webkit-animation: move 2.5s infinite linear;
    animation: move 2.5s infinite linear; }
  .aniborder_title:hover .short-line {
    background: #ff0000; }
  .aniborder_title:hover .long-line {
    background: #ff0000; }

@-webkit-keyframes move-short {
  100% {
    width: 140px;
    margin-right: 0; } }

@keyframes move-short {
  100% {
    width: 140px;
    margin-right: 0; } }

@-webkit-keyframes move {
  100% {
    width: 0; } }

@keyframes move {
  100% {
    width: 0; } }
