/* 
------------------
Template Name: Retellect - Personal Portfolio HTML 5 Template
Author: Ingenious_team
Author Email: ingeniousteam786@gmail.com
Version: 1
------------------
----------------
Table of Content
----------------
        1. Newsletter Modal part
        2. Navbar Part 
        3. banner part
        4. About part
        5. My Service part
        6. My Recent Work part
        7. My Experiences part 
        8. Testimonials part
        9. Latest Blogs part
        10. Contact part

Other pages:
        11. Contact page
        12. Blog Details page
        13. Blog Details With Sidebar page
      
    
*/
@import url('https://fonts.googleapis.com/css?family=Abril+Fatface|Ubuntu:300,400,500,600,700');

/*============Common CSS Start===============*/

* {
    margin: 0;
    padding: 0;
    outline: 0;
}

a {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}
button:focus {
    outline: 5px auto transparent;
}
img {
    vertical-align: middle;
}

ul,
ol {
    list-style: none;
}

.m-t-30 {
    margin-top: 30px;
}
body{
    overflow-x: hidden;
}
/*============Common CSS End===============*/

/*=============Preloader Part CSS Start===================*/

.loading{
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #fff;
  z-index: 9999999999;
}

.gooey {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 180px;
  height: 200px;
  margin: -20px 0 0 -82px;
  background: #fff;
  filter: contrast(20);
}
.gooey .dot {
  position: absolute;
  width: 32px;
  height: 32px;
  top: 10px;
  left: 21px;
  filter: blur(4px);
  background: #f05456;
  border-radius: 50%;
  transform: translateX(0);
  animation: dot 3s infinite;
}
.gooey .dots {
  transform: translateX(0);
  margin-top: 12px;
  margin-left: 31px;
  animation: dots 3s infinite;
}
.gooey .dots span {
  display: block;
  float: left;
  width: 26px;
  height: 26px;
  margin-left: 16px;
  filter: blur(4px);
  background: #f05456;
  border-radius: 50%;
}
@-moz-keyframes dot {
  50% {
    transform: translateX(100px);
  }
}
@-webkit-keyframes dot {
  50% {
    transform: translateX(100px);
  }
}
@-o-keyframes dot {
  50% {
    transform: translateX(100px);
  }
}
@keyframes dot {
  50% {
    transform: translateX(100px);
  }
}
@-moz-keyframes dots {
  50% {
    transform: translateX(-26px);
  }
}
@-webkit-keyframes dots {
  50% {
    transform: translateX(-26px);
  }
}
@-o-keyframes dots {
  50% {
    transform: translateX(-26px);
  }
}
@keyframes dots {
  50% {
    transform: translateX(-26px);
  }
}

/*=============Preloader Part CSS End===================*/

/*============NewsLetter Modal Part CSS Start===============*/

.modal-content {
    border-radius: 0;
    overflow: hidden;
    padding-bottom: 0px;
    margin-top: 11%;
}

.modal-header i {
    position: absolute;
}

.modal-header {
    border-bottom: none;
}
.modal-dialog {
    margin-top: 100px;
    max-width: 1024px !important;
    z-index: 99999;
}

.download-close {
    float: right;
    background: #f05456;
    border-radius: 45px;
    border: 1px solid transparent;
    width: 36px;
    height: 63px;
    z-index: 99999;
    position: absolute;
    right: 10px;
    top: -15px;
    padding: 11px 0;
}

.download-close span {
    font-size: 16px;
    color: #ffffff;
    font-weight: 400;
    line-height: 45px;
    padding: 5px 14px;
}

.download-icon {
    margin-left: 59%;
    transform: translateX(-50%);
    margin-top: 30px;
}
#letter5,
.letter_inner {
    text-align: center;
}

.letter_inner img {
    margin-top: 10px;
}

.letter_inner h2 {
    color: #f05456;
    font-size: 32px;
    font-weight: 400;
    font-family: 'Abril Fatface', sans-serif;
    padding: 60px 0 20px;
    line-height: 24px;
}

.letter_inner p {
    font-size: 16px;
    color: #444444;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 400;
    line-height: 24px;
    padding: 0 18%;
    padding-bottom: 15px;
}

#letter5 input {
    margin-bottom: 10px;
    position: relative;
    color: #ccc;
    text-transform: capitalize;
    resize: none;
    font-weight: 300;
    border: 0.5px solid #ccc;
    font-size: 14px;
    border-radius: 50px;
    font-family: 'Ubuntu', sans-serif;
    height: 40px;
    background: transparent;
    width: 600px;
    padding-left: 20px;
    z-index: 9;
    margin-bottom: 55px;
    box-shadow: none;
}

#letter5 input:focus {
    outline: none !important;
    border-color: #ccc;
    color: #999;
}

#letter5::placeholder {
    color: #999;
    opacity: 1;
    /* Firefox */
}

.letter_inner ul {
    display: inline-block;
    margin-bottom: 30px;
}

.letter_inner ul li {
    float: left;
}

.input-group-btn a {
    color: #ffffff;
    font-size: 18px;
    font-weight: 400;
    font-family: 'Ubuntu', sans-serif;
    line-height: 24px;
}

.button {
    background: #f05456;
    border: 0 none;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
    outline: 0 none;
    padding: 8px 22px;
    position: absolute;
    text-align: center;
    text-decoration: none;
    z-index: 99;
    transform: translateX(-100%) translateY(0%);
}

.button:hover {
    box-shadow: 0px 0px 40px 4px rgba(249, 220, 4, .3);
    -webkit-box-shadow: 0px 0px 40px 4px rgba(249, 220, 4, .3);
    -moz-box-shadow: 0px 0px 40px 4px rgba(249, 220, 4, .3);
    -o-box-shadow: 0px 0px 40px 4px rgba(249, 220, 4, .3);
    transition: all 0.4s ease;
}
.modal.fade .modal-dialog{
    top: 35%;
        transition: -webkit-transform .4s ease;
    transition: transform .4s ease;
    transition: transform .4s ease,-webkit-transform .4s ease;
    -webkit-transform: translate(0,-50%);
    transform: translate(0,-50%);
}

/*=============================
NewsLetter Modal Part CSS End
==============================*/

/*===============Navbar Part CSS Start===============*/

#header {
    background: #f5f5f5;
    position: relative;
    z-index: 11;
}

#header .side-text p {
    font-family: 'Abril Fatface', cursive;
    font-size: 111px;
    text-transform: uppercase;
    color: #222222;
    writing-mode: vertical-rl;
    position: absolute;
    top: 50%;
    transform: translateY(-50%) rotate(180deg);
    -webkit-transform: translateY(-50%) rotate(180deg);
    -moz-transform: translateY(-50%) rotate(180deg);
    -o-transform: translateY(-50%) rotate(180deg);
    opacity: 0.05;
    left: -20px;
    margin: 0;
}

.navbar {
    position: absolute;
    width: 100%;
    top: 0;
    margin: 0!important;
    padding: 0px 0 9px!important;
    z-index: 111;
    transition: all ease .4s;
    -webkit-transition: all ease .4s;
    -moz-transition: all ease .4s;
    -o-transition: all ease .4s;
}

.sticky {
    background: #F5F5F5;
    box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    -moz-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    -o-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
}

.sticky.navbar {
    padding: 0px 0 10px;
    position: fixed;
    animation: sticky .7s;
    -webkit-animation: sticky .7s;
    -moz-animation: sticky .7s;
    -o-animation: sticky .7s;
    z-index: 1000;
}

@keyframes sticky {
    from {
        top: -50px;
    }

    to {
        top: 0;
    }
}
.header-nav .navbar-nav .nav-link {
    font-family: 'Ubuntu', sans-serif;
    font-size: 16px;
    font-weight: 500;
    color: #999999;
    text-transform: capitalize;
    position: relative;
    z-index: 9;
    transition: all linear .3s;
    -webkit-transition: all linear .3s;
    -moz-transition: all linear .3s;
    -o-transition: all linear .3s;
}

.navbar-nav .nav-link {
  transition: 0.3s ease;
  border-top: 4px solid transparent;
  padding: 30px 0;
}
.navbar-nav .active,
.navbar-nav .nav-link:hover {
  border-top: 4px solid #f05456;
    color: #f05456!important;
}
.navbar-expand-md .navbar-nav a {
        margin: 0 10px;
}

.nav-item a {
    color: #999999;
}
.navbar-brand{
    margin-top: 6px;
}
.btn-bar a {
    margin-top: 6px;
    position: relative;
    display: inline-block;
    font-size: 16px;
    vertical-align: top;
    text-align: center;
    line-height: 24px;
    color: #ffffff;
    font-weight: 400;
    font-family: 'Ubuntu', sans-serif;
    padding: 12px;
    border-radius: 35px;
    width: 200px;
    height: 48px;
    -webkit-transition: ease all .7s;
    -moz-transition: ease all .7s;
    -o-transition: ease all .7s;
    transition: ease all .7s;
    background: #f05456;

}

.btn-bar a:hover {
    background: #ffffff;
    color: #f05456;
    box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -webkit-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -moz-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -o-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
}

.navbar-nav .m-nav {
    margin-left: 60px;
}


/* dropdown menu css */
.dropdown-menu {
    padding: 14px 0px;
    width: 230px;
    top: 64px;
    min-width: 210px;
    box-shadow: 0 2px 3px 0px rgba(0, 0, 0, .2);
    border-radius: 0;
    background: #F5F5F5;
    border: none;
    -webkit-transition: all ease 0.4s;
    -moz-transition: all ease 0.4s;
    -ms-transition: all ease 0.4s;
    -o-transition: all ease 0.4s;

}

.nav .open > a,
.nav .open > a:focus,
.nav .open > a:hover {
    background: none;
}

.dropdown-menu > li {
    padding: 10px 10px;
}

.dropdown-menu > li > a {
    font-size: 16px;
    position: relative;
    line-height: 24px;
    font-weight: 400;
    font-family: 'Ubuntu', sans-serif;
    color: #999999;
}

.dropdown-menu > li > a:focus,
.dropdown-menu > li:hover a {
    background: none;
    color: #f05456 !important;
    font-weight: 500;
    transition: all ease .4s;
    -webkit-transition: all ease 0.4s;
    -moz-transition: all ease 0.4s;
    -ms-transition: all ease 0.4s;
    -o-transition: all ease 0.4s;
}

.dropdown-menu > li > a {
    color: #999 !important;
    padding: 10px 8px !important;
    text-align: left;
    margin: 0 !important;
    font-weight: 500 !important;
}

.header-nav .navbar-nav li .active span,
.header-nav .navbar-nav li a:hover span,
.header-nav .navbar-nav li a:focus span {
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    transform: translateY(-100%);
}

.custom_nav ul > li > a:focus:after,
.custom_nav ul > li.active > a:after,
.custom_nav ul > li:hover > a:after {
    opacity: 1;
}

@media(min-width:768px) {
    .dropdown-menu {
        display: block;
        visibility: hidden;
        opacity: 0;
        top: 110%;

    }

    .custom_nav ul > li:hover > .dropdown-menu {
        opacity: 1;
        visibility: visible;
        top: 106%;
    }

    .navbar-right .dropdown-menu {
        right: 0;
        left: 2px;
        width: 240px;
    }
}
/* =============Navbar Part CSS End============= */


/* ===============Banner Part CSS Start=========== */

.banner {
    background: url(../images/banner-image.jpg);
    background-position:top;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 100px 0px;
    position: relative;
    overflow-x: hidden;
}

.banner-text {
    padding: 60px 0 80px;
}

.banner-text p {
    font-family: 'Ubuntu', sans-serif;
    font-size: 30px;
    font-weight: 600;
    color: #f05456;
    margin: 0;
    text-align: left;
    padding-left: 38px;
}

.banner-text h1 {
    font-family: 'Abril Fatface', cursive;
    font-size: 60px;
    color: #f05456;
    text-transform: capitalize;
    margin: 0;
}

.banner-text h3 {
    font-family: 'Ubuntu', sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: #444444;
    text-transform: capitalize;
    margin: 0;
}

.banner-text h3 span {
    padding: 0 7px;
}

.banner-btn {
    margin-top: 40px;
}

.banner-btn a {
    display: inline-block;
    font-size: 16px;
    vertical-align: top;
    text-align: center;
    line-height: 22px;
    color: #ffffff;
    font-weight: 500;
    font-family: 'Ubuntu', sans-serif;
    padding: 10px 20px;
    border-radius: 35px;
    -webkit-transition: all ease .7s;
    -moz-transition: all ease .7s;
    -o-transition: all ease .7s;
    transition: all ease .7s;
    background: #f05456;
}

.banner-btn a:hover {
    background: #ffffff;
    color: #f05456;
    box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -webkit-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -moz-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -o-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
}

.banner-l {
    position: relative;
}

.banner-left {
    position: absolute;
    content: '';
    top: 75%;
    right: 40px;
    transform: translateY(-50%);
}

.banner-left a {
    display: inline-block;
    font-size: 16px;
    vertical-align: top;
    text-align: center;
    line-height: 22px;
    color: #f05456;
    font-weight: 500;
    font-family: 'Ubuntu', sans-serif;
    padding: 10px 15px;
    border-radius: 35px;
    -webkit-transition: ease all .7s;
    -moz-transition: ease all .7s;
    -o-transition: ease all .7s;
    transition: ease all .7s;
    background: #fff;
}

.banner-left a:hover {
    background: #f05456;
    color: #fff;
    box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -webkit-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -moz-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -o-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
}

/*===============Banner Part CSS End============*/

/*==============Banner Chat Modal Part CSS Start=============*/

.bg {
    background: rgba(0, 0, 0, .8);
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    display: none;
}

.bg2 {
    background: rgba(0, 0, 0, .8);
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 11111;
    display: none;
}

.banner-modal {
    position: fixed;
    bottom: 0px;
    right: 130px;
    width: 310px;
    margin: 0 auto;
    background: #fff;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    z-index: 1111111;
    display: none;
}
.banner-modal-head {
    background: #f05456;
    text-align: left;
    padding: 6px 12px;
    display: -webkit-box;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.banner-modal-head i{
    color: #fff;
}
.banner-modal-head h4 {
    font-family: 'Ubuntu', sans-serif;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    text-transform: capitalize;
    margin: 0;
    padding-top: 4px;
    padding-left: 7px;
}

.banner-modal-content {
    padding: 20px;
}

.chat-person {
    padding: 5px;
}

.chat-person img {
    border-radius: 50%;
}

.chat-msg,
.chat-msg2 {
    background: #F1F1F1;
    padding: 10px;
    position: relative;
    margin-bottom: 30px;
    font-family: 'Ubuntu', sans-serif;
    font-size: 16px;
}
.chat-msg2{
    background: #f05456;
    color: #fff;
    text-align: right;
}
.chat-msg {    
    padding-left: 20px;
    color: #444;
    text-align: left;
}

.chat-msg3 {
    border-radius: 5px;
    position: relative;
    background: #F1F1F1;
    padding-top: 6px;
    padding-bottom: 6px;
    padding-left: 2px;
    margin-top: 20px;
}

.banner-modal2 .chat-msg3 {
    border-radius: 5px;
    position: relative;
    background: #F1F1F1;
    padding-top: 10px;
    padding-bottom: 6px;
    margin-top: 20px;
    padding-left: 22px;
}

.chat-msg:before {
    position: absolute;
    content: '';
    width: 25px;
    border-radius: 3px;
    height: 25px;
    background: #F1F1F1;
    top: 50%;
    transform: translateY(-50%) rotate(-45deg);
    -webkit-transform: translateY(-50%) rotate(-45deg);
    -moz-transform: translateY(-50%) rotate(-45deg);
    -o-transform: translateY(-50%) rotate(-45deg);
    left: -8px;
}

.chat-msg2:before {
    position: absolute;
    content: '';
    width: 25px;
    height: 25px;
    border-radius: 3px;
    background: #f05456;
    top: 50%;
    transform: translateY(-50%) rotate(-45deg);
    -webkit-transform: translateY(-50%) rotate(-45deg);
    -moz-transform: translateY(-50%) rotate(-45deg);
    -o-transform: translateY(-50%) rotate(-45deg);
    right: -8px;
    z-index: -4;
}

.chat-msg3:before {
    position: absolute;
    content: '';
    width: 25px;
    height: 25px;
    border-radius: 3px;
    background: #F1F1F1;
    top: 50%;
    transform: translateY(-50%) rotate(-45deg);
    -webkit-transform: translateY(-50%) rotate(-45deg);
    -moz-transform: translateY(-50%) rotate(-45deg);
    -o-transform: translateY(-50%) rotate(-45deg);
    left: -8px;
}

.chat-msg p,
.chat-msg2 p {
    font-family: 'Ubuntu', sans-serif;
    font-weight: 400;
    font-size: 13px;
    line-height: 22px;
    margin: 0;
}

.chat-msg3 i {
    font-size: 30px;
    color: #999999;
    background: #F1F1F1;
}

.banner-modal-form {
    border-top: 1px solid #f1f1f1;
    padding: 10px 20px;
}

.banner-modal-form form .form-control {
    border-radius: 0px;
    box-shadow: none;
    font-family: 'Ubuntu', sans-serif;
    font-size: 15px;
    font-weight: 400;
    font-style: normal;
    color: #999999;
    height: 25px;
    border: 0;
    padding-left: 0;
}

.input-grpm {
    position: relative;
    text-align: left;
}

.input-grpm input {
    width: 180px;
    padding-bottom: 10px;
}
.input-icon i {
    color: #454545;
    font-size: 15px;
    padding-right: 17px;
}

.banner-modal-form form button {
    background: none;
    border: 0;
}


/*==============Banner Chat Modal Part CSS End============*/



/*=====================================
 get social class start 
=======================================*/
.other-nav{
    background: #F5F5F5;
}
.bg-c{
    background: #F5F5F5;
    -webkit-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
	box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
      transition: all ease 0.7s;
    -webkit-transition: all ease 0.7s;
    -moz-transition: all ease 0.7s;
    -ms-transition: all ease 0.7s;
    -o-transition: all ease 0.7s;
}
.bg-none{
    background: transparent;
      transition: all ease 0.7s;
    -webkit-transition: all ease 0.7s;
    -moz-transition: all ease 0.7s;
    -ms-transition: all ease 0.7s;
    -o-transition: all ease 0.7s;
}
.social_icon {
	position: absolute;
	left: calc(100% - 60px);
	top: 50%;
    width: 60px;
	z-index: 199;
    height: 100%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
}
.social_icon ul li:first-child{
    transform: translateX(-0px) rotate(-0deg);
    text-align: center;
    cursor: pointer;
    color: #f05456;
    padding: 36px 30px 36px 30px!important;
     margin-bottom: 103%;
    border-bottom: 1px solid #ddd;
}
.otherpage .social_icon ul li:first-child{
    margin-bottom: 45%;
}
.social_icon ul li:first-child i{
     color: #f05456;
}
.social_icon ul li:first-child:hover{
    transform: translateX(0px) rotate(-0deg);
     -webkit-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
	box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
}
.social_icon ul li {
   transform: translateY(0px) rotate(-90deg);
    padding: 20px 28px 20px 28px;
      transition: all linear 0.7s;
    -webkit-transition: all linear 0.7s;
    -moz-transition: all linear 0.7s;
    -ms-transition: all linear 0.7s;
    -o-transition: all linear 0.7s;
}
.otherpage .social_icon ul li{
    padding: 16px 29px 16px 28px;
}
.social_icon ul li a {
    position: relative;
	color: #999;
	font-size: 14px;
	font-weight: 500;    
    font-family: 'Ubuntu', sans-serif;
	text-decoration: none;
}

.social_icon ul li a i {
	font-size: 16px;
	text-align: center;
	text-decoration: none;
}
.social_icon ul .facebook{
    margin-left: 4px;
}
.social_icon ul .facebook a:after{
    position: absolute;
    content: 'facebook';
    font-size: 11px;
    color: #999;
    opacity: 0;
    top: -3px;
    right: -53px;
}
.social_icon ul .google a:after{
    position: absolute;
    content: 'google +';
    font-size: 11px;
    color: #999;
    opacity: 0;
    top: -3px;
    right: -48px;
}
.social_icon ul .behance a:after{
    position: absolute;
    content: 'behance';
    color: #999;
    font-size: 11px;
    opacity: 0;
    top: -3px;
    right: -50px;
}
.social_icon ul .twitter a:after{
    position: absolute;
    content: 'twitter';
    color: #999;
    font-size: 11px;
    opacity: 0;
    top: -3px;
    right: -45px;
}
.social_icon ul .linkedin a:after{
    position: absolute;
    content: 'linkedin';
    color: #999;
    font-size: 11px;
    opacity: 0;
    top: -3px;
    right: -48px;
}
.social_icon ul .google:hover a:after,
.social_icon ul .linkedin:hover a:after,
.social_icon ul .twitter:hover a:after,
.social_icon ul .facebook:hover a:after,
.social_icon ul .behance:hover a:after{
     color: red;
     opacity: 1;
       transition: all linear 1s;
    -webkit-transition: all linear 1s;
    -moz-transition: all linear 1s;
    -ms-transition: all linear 1s;
    -o-transition: all linear 1s;
}
.social_icon li:hover a{
    color: red;
}
.social_icon ul li:hover{
    transform: translateY(22px) rotate(-90deg);
    transition: all linear 0.5s;
    -webkit-transition: all linear 0.5s;
    -moz-transition: all linear 0.5s;
    -ms-transition: all linear 0.5s;
    -o-transition: all linear 0.5s;
}

.full_nav .fa-time > li:first-child i{
    transform: translateX(0px) rotate(90deg);
      transition: all linear 0.5s;
    -webkit-transition: all linear 0.5s;
    -moz-transition: all linear 0.5s;
    -ms-transition: all linear 0.5s;
    -o-transition: all linear 0.5s;
      opacity: 1;
}
.menu-inner.tog-nav .fa-times{
    opacity: 0;
     transition: all linear 0.6s;
    -webkit-transition: all linear 0.6s;
    -moz-transition: all linear 0.6s;
    -ms-transition: all linear 0.6s;
    -o-transition: all linear 0.6s;
}
.menu-inner.tog-nav i.fa-align-right{
    opacity: 1;
     transition: all linear 0.7s;
    -webkit-transition: all linear0.71s;
    -moz-transition: all linear 0.7s;
    -ms-transition: all linear 0.7s;
    -o-transition: all linear 0.7s;
}

.menu-inner.tog-nav .google a,
.menu-inner.tog-nav .behance a,
.menu-inner.tog-nav .linkedin a,
.menu-inner.tog-nav .twitter a,
.menu-inner.tog-nav .facebook a{
    opacity: 1;
    transition: all linear 0.7s;
    -webkit-transition: all linear 0.7s;
    -moz-transition: all linear 0.7s;
    -ms-transition: all linear 0.7s;
    -o-transition: all linear 0.7s;
}
.menu-inner.fa-time .google a,
.menu-inner.fa-time .behance a,
.menu-inner.fa-time .linkedin a,
.menu-inner.fa-time .twitter a,
.menu-inner.fa-time .facebook a{
    opacity: 0;   
    transition: all linear 0.7s;
    -webkit-transition: all linear 0.7s;
    -moz-transition: all linear 0.7s;
    -ms-transition: all linear 0.7s;
    -o-transition: all linear 0.7s;
}
/*=====================================
 get social class end 
=======================================*/

/*=================About Part CSS Start================*/

#about {
    padding-top: 65px;
    padding-bottom: 30px;
    position: relative;
}

.about-inner h2 {
    font-family: 'Abril Fatface', cursive;
    font-size: 32px;
    color: #222222;
    text-transform: capitalize;
}

.about-inner p {
    font-family: 'Ubuntu', sans-serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    color: #f05456;
    padding: 30px 0;
    margin: 0;
}

.about-inner span {
    font-family: 'Ubuntu', sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    color: #444444;
    margin: 0;
}

.about-cont {
    padding-bottom: 40px;
    padding-top: 30px;
    padding-left: 40px;
    padding-right: 40px;
}

.about-cont h2,
.about-cont1 h2 {
    font-size: 40px;
    color: #f05456;
    font-family: 'Abril Fatface', cursive;
    font-weight: 400;
}

.about-text {
    padding-right: 20px;
}

.about-cont h3,
.about-cont1 h3 {
    font-size: 24px;
    color: #444444;
    font-family: 'Abril Fatface', cursive;
    font-weight: 400;
}

.about-count {
    position: relative;
    padding-top: 30px;
    width: 90%;
}

.about-border {
    border-bottom: 1px solid #ddd;
}

.about-count:after {
    position: absolute;
    content: '';
    top: 51%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 260px;
    border-left: 1px solid #ddd;
}

.about-photo img {
    margin-top: -140px;
}

.about-photo {
    position: relative;
}

.about-photo:after {
    position: absolute;
    content: '';
    top: -173px;
    left: 20px;
    width: 400px;
    height: 650px;
    border: 2px solid #f7ea66;
}

/*=====================================
 Counter
======================================*/
.conter-res .col-md-1 {
    max-width: 10.333333%;
}

.conter-res {
    position: relative;
    border-radius: 2px;
    margin-top: -70px;
    padding: 40px 10px;
    -webkit-box-shadow: 0px 5px 35px 0px rgba(105, 90, 166, 0.23);
    -moz-box-shadow: 0px 5px 35px 0px rgba(105, 90, 166, 0.23);
    box-shadow: 0px 5px 35px 0px rgba(105, 90, 166, 0.23);
}

.border-count {
    width: 100px;
}

.counter-left h4 {
    font-size: 42px;
    text-shadow: 3px 2px 0px rgba(0, 0, 0, 0.3);
    color: #fff;
    line-height: 24px;
    font-weight: 400;
    font-family: "Anton";
    text-transform: uppercase;
    cursor: auto;
    letter-spacing: 0px;
    padding-top: 20px;
}

.counterinner ul li {
    float: left;
    width: 65px;
    border: 1px solid #300272;
    border-image-source: linear-gradient(#e26aca, #943285);
    border-image-slice: 4;
    margin: 0 5px;
    padding: 19px;
}

.counter-text h3 {
    font-size: 50px;
    color: #943184;
    line-height: 24px;
    font-weight: 400;
    font-family: "Anton", sans-serif;
    text-transform: uppercase;
    cursor: auto;
}


/* =====================================
 Counter end 
======================================= */
/*============About Part CSS End==============*/


/*==============Service Part CSS End==============*/

.services {
    padding: 68px 0 45px;
    position: relative;
    overflow-x: hidden;
}

.services:after {
    position: absolute;
    content: '';
    background: #f7ea66;
    height: 250px;
    top: 0;
    left: 0;
    width: 100%;
    z-index: -1;
}

.title h2 {
    font-size: 32px;
    color: #222222;
    font-weight: 400;
    font-family: 'Abril Fatface', cursive;
    text-transform: capitalize;
    margin-bottom: 30px;
}
.service-details{
    padding-top: 30px;
}
.service-cont {
    position: relative;
    background: #f5f5f5;
    padding: 25px 25px 5px;
    border-radius: 3px;
    z-index: 0;
}
.slick-center .service-cont:after,
.service-cont:after{
    position: absolute;
    content: '';
    width: 1%;
    height: 100%;
    background: #f05456;
    border-radius: 3px;
    top: 0;
    left: 0;
    z-index: 99;
    transition: all ease 0.26s;
    -webkit-transition: all ease 0.26s;
    -moz-transition: all ease 0.26s;
    -ms-transition: all ease 0.26s;
    -o-transition: all ease 0.26s;
}
.slick-center .service-cont:after,
.service-cont:hover:after{
    width: 100%;
    z-index: -1;
    box-shadow: 0px 0px 30px 4px rgba(240, 84, 86, .3);
    -webkit-box-shadow: 0px 0px 30px 4px rgba(240, 84, 86, .3);
    -moz-box-shadow: 0px 0px 30px 4px rgba(240, 84, 86, .3);
    -o-box-shadow: 0px 0px 30px 4px rgba(240, 84, 86, .3);
}
.service-cont h3 {
    font-size: 18px;
    color: #222222;
    font-weight: 400;
    font-family: 'Abril Fatface', cursive;
    text-transform: capitalize;
    margin-top: 15px;
    line-height: 24px;
    z-index: 9;
}

.service-cont p {
    font-size: 13px;
    color: #444444;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 400;
    margin-top: 30px;
    line-height: 24px;
}

.services .slick-center .service-cont {
    color: #fff !important;
    box-shadow: 0px 0px 30px 4px rgba(240, 84, 86, .3);
    -webkit-box-shadow: 0px 0px 30px 4px rgba(240, 84, 86, .3);
    -moz-box-shadow: 0px 0px 30px 4px rgba(240, 84, 86, .3);
    -o-box-shadow: 0px 0px 30px 4px rgba(240, 84, 86, .3);
}

.services .slick-center .service-cont h3,
.services .slick-center .service-cont p {
    color: #fff !important;
}

.service-cont:hover p,
.service-cont:hover h3 {
    color: #fff;
    transition: all linear 0.4s;
    -webkit-transition: all linear 0.4s;
    -moz-transition: all linear 0.4s;
    -ms-transition: all linear 0.4s;
    -o-transition: all linear 0.4s;
}
#service .slick-list {
    overflow: visible !important;
/*    padding: 0!important;*/
}
.service-item a {
    font-size: 16px;
    color: #444444;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 500;
    margin-top: 30px;
    line-height: 24px;

}
.services .service-menu .slick-center a{
    color: #f05456!important;
}

/*=============Service Part CSS End==============*/


/*===============Recent Work Part CSS Start==============*/
#recent-work {
    padding: 20px 0 60px;
    overflow-x: hidden;
}
.button-group li a{
    font-size: 16px;
    color: #444444;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 500;    
    padding: 20px 15px;
    text-transform: capitalize;
    line-height: 24px;
}
.button-group li .active{
    color: #f05456!important;
}
.button-group {
    display: contents;
}
.border-relate{
    position: relative;
    margin-top: 30px;
    padding-top: 30px;
}
.border-relate:after{
    position: absolute;
    content: '';
    border-top: 1px dotted #ddd;
    top: 0;
    width: 560%;
    left: -60%;
}
.pro-row{
    padding-bottom: 50px;
}
.work-cont {
    margin-top: 150px;
}

.work-cont h3 {
    font-size: 24px;
    color: #222222;
    font-weight: 400;
    font-family: 'Abril Fatface', cursive;
    text-transform: capitalize;
    margin-bottom: 30px;
    position: relative;
}

.work-cont img {
    position: absolute;
    top: 0;
    right: 50%;
    justify-content: center;
    transform: translate(50%, 75%);
}

.work-cont p {
    font-size: 14px;
    color: #444444;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 400;
    margin-bottom: 25px;
}

.cont-btn {
    margin-top: 40px;
}

.cont-btn a {
    display: inline-block;
    font-size: 16px;
    vertical-align: top;
    text-align: center;
    line-height: 26px;
    color: #ffffff;
    font-weight: 400;
    font-family: 'Ubuntu', sans-serif;
    padding: 10px 15px;
    border-radius: 35px;
    -webkit-transition: ease all .5s;
    -moz-transition: ease all .5s;
    -o-transition: ease all .5s;
    transition: ease all .5s;
    background: #f05456;
}

.cont-btn a:hover {
    background: #ffffff;
    color: #f05456;
    box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .3);
    -webkit-box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .3);
    -moz-box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .3);
    -o-box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .3);
}

/* pesination */

.sec-pagination ul {
    display: inline-block;
    margin-top: 50px;
}

.sec-pagination ul li {
    float: left;
}

.sec-pagination ul li a {
    color: #999;
    line-height: 24px;
    font-size: 14px;
}

.sec-pagination ul li {
    width: 45px;
    height: 45px;
    border-radius: 100%;
    border: 1px solid #999;
    line-height: 41px;
    margin: 0 5px;
}

.sec-hov li:hover {
    border: 1px solid #f05456;
    background: #f05456;
    transition: all ease 0.4s;
    -webkit-transition: all ease 0.4s;
    -moz-transition: all ease 0.4s;
    -ms-transition: all ease 0.4s;
    -o-transition: all ease 0.4s;
    box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .3);
    -webkit-box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .3);
    -moz-box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .3);
    -o-box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .3);
    border: 1px solid #fff;
}

.sec-hov-color li:hover {
    border: 1px solid #fff;
}

.sec-hov-color li:hover a,
.sec-hov li:hover a {
    color: #fff;
}

/*===============Recent Work Part CSS End===============*/

/*============= My Experience Part CSS Start============*/

#experience {
    padding: 40px 0 50px;
    background: #f5f5f5;
}

.title ul {
    display: inline-block;
}

.title ul li {
    float: left;
    margin-bottom: 20px;
}

.title ul li a {
    font-size: 16px;
    color: #222222;
    font-weight: 500;
    font-family: 'Ubuntu', sans-serif;
    text-transform: capitalize;
    padding-left: 40px;
    line-height: 24px;
    justify-content: center;

}

.title ul li a:hover {
    color: #f05456;
}

.exper-inner {
    background: #f1f1f1;
    border-radius: 5px;
     box-shadow: 0px 1px 15px 0px rgba(0, 0, 0, 0.08);
    -webkit-box-shadow: 0px 1px 15px 0px rgba(0, 0, 0, 0.08);
    -moz-box-shadow: 0px 1px 15px 0px rgba(0, 0, 0, 0.08);
    -o-box-shadow: 0px 1px 15px 0px rgba(0, 0, 0, 0.08);
}

.exp-comp {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    background: #82b541;
       padding: 58px 17px;
    height: 100%;
    text-align: center;
}

.exp-comp span {
    font-size: 20px;
    color: #ffffff;
    font-weight: 500;
    font-family: 'Ubuntu', sans-serif;
}
.exp-comp-right{
    padding-right: 20px;
}
.exp-comp-right h3 {
    font-size: 24px;
    color: #82b541;
    font-weight: 400;
    font-family: 'Abril Fatface', cursive;
    text-transform: capitalize;
    margin-top: 20px;
    line-height: 24px;
}

.exp-comp-right p {
    font-size: 14px;
    color: #444444;
    font-weight: 600;
    font-family: 'Ubuntu', sans-serif;
    text-transform: capitalize;
    line-height: 20px;
    margin-bottom: 8px;
}

.exp-comp-right span {
    font-size: 14px;
    color: #444444;
    font-weight: 400;
    font-family: 'Ubuntu', sans-serif;
    text-transform: capitalize;
    line-height: 21px;
    margin-bottom: 20px;
}
.left1{
    
}
.left2{
    background: #be7e33;
}
.left3{
    background: #3a2c8b;
}
.left4{
    background: #277f75;
}
.exper-inner:hover{
     box-shadow: 0px 1px 15px 0px rgba(0, 0, 0, .2);
    -webkit-box-shadow: 0px 1px 15px 0px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0px 1px 15px 0px rgba(0, 0, 0, .2);
    -o-box-shadow: 0px 1px 15px 0px rgba(0, 0, 0, .2);
    transition: all linear 0.4s;
    -webkit-transition: all linear 0.4s;
    -moz-transition: all linear 0.4s;
    -ms-transition: all linear 0.4s;
    -o-transition: all linear 0.4s;
}
/*============Experience Part CSS End============*/


/*============Testimonial Part CSS End==============*/

#testimonial {
    padding: 65px 0 80px;
}
.testi-inner{
    padding: 0 1px 20px 26px;    
    position: relative;
}
.testi-inner:after {
    position: absolute;
    content: '';
    background: #f5f5f5;
    width: 100%;
    height: 136px;
    top: 88px;
    z-index: -1;
    left: 0;
}
.testi-inner:hover::after{
       box-shadow: 0px 1px 15px 0px rgba(0, 0, 0, .2);
    -webkit-box-shadow: 0px 1px 15px 0px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0px 1px 15px 0px rgba(0, 0, 0, .2);
    -o-box-shadow: 0px 1px 15px 0px rgba(0, 0, 0, .2);
      transition: all linear 0.6s;
    -webkit-transition: all linear 0.6s;
    -moz-transition: all linear 0.6s;
    -ms-transition: all linear 0.6s;
    -o-transition: all linear 0.6s;
}
.testi-in-text h3 {
    font-size: 20px;
    color: #222222;
    font-weight: 400;
    font-family: 'Abril Fatface', cursive;
    text-transform: capitalize;
    line-height: 24px;
    margin: 0;
}

.testi-in-text h5 {
    font-size: 14px;
    color: #444444;
    font-weight: 600;
    font-family: 'Ubuntu', sans-serif;
    text-transform: capitalize;
    line-height: 24px;
     margin: 0;
}

.testi-in-text ul li {
    float: left;
    color: #f05456;
}

.testi-in-text ul {
    box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .2);
    -webkit-box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .2);
    -moz-box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .2);
    -o-box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .2);
    margin-bottom: 60px;
}

.testi-in-text p {
    font-size: 14px;
    color: #444444;
    font-weight: 400;
    font-family: 'Ubuntu', sans-serif;
    line-height: 24px;
}
.testimonial-slick{
    padding-bottom: 30px;
    padding-top: 10px;
}
.testimonial li {
    display: inline-block;
}
.testimonial .slick-dots {
    position: absolute;
    bottom: 25px;
    list-style: none;
    display: block;
    text-align: center;
    padding: 0;
    margin: 0;
    top: calc(100% + 20px);
    width: 100%;
}
.testimonial .slick-dots li button {
    border: 0;
    display: block;
    outline: none;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid #999;
    color: #999;
    margin: 0 6px;
    cursor: pointer;
    transition: all .3s ease;
}
.testimonial .slick-dots .slick-active button {
    background: #f05456;
    color: #fff;
    border: 1px solid #f05456;
    box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .3);
    -webkit-box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .3);
    -moz-box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .3);
    -o-box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .3);
}

/*=================Testimonial Part CSS End==============*/


/*=================Blog Part CSS Start==============*/

#Blog {
    padding: 50px 0 55px;
}

.blog-inner {
    background: #f5f5f5;
    padding: 24px;
      transition: all linear 1s;
    -webkit-transition: all linear 1s;
    -moz-transition: all linear 1s;
    -ms-transition: all linear 1s;
    -o-transition: all linear 1s;
}

.blog-inner h2 {
    font-size: 23px;
    color: #222222;
    font-weight: 400;
    font-family: 'Abril Fatface', cursive;
    line-height: 30px;
}
.blog-hover{
    position: absolute;
    opacity: 0;
    top: 0;
    left: 50%;
    padding-bottom: 20px;
}
.blog-hover p {
    font-size: 16px;
    color: #ffffff;
    font-weight: 400;
    font-family: 'Ubuntu', sans-serif;
    line-height: 24px;
   
}

.blog-hover a {
    font-size: 20px;
    color: #f05456;
    font-weight: 400;
    font-family: 'Abril Fatface', cursive;
    line-height: 24px;
    text-transform: capitalize;
}

.blog-hover i {
    margin-left: 5px;
    line-height: 24px;
}
.blog-inner ul{
    padding-top: 15px;
    padding-bottom: 10px;
}
.blog-inner ul li{
    display: inline-block;
    color: #444;
    margin: 0 4px;
    font-size: 14px;
    line-height: 24px;
    padding: 2px 18px 2px;
    background: #ddd;
    font-family: 'Ubuntu', sans-serif;
    border-radius: 3px;
}
.blog-inner ul li:first-child{
    margin-left: 0;
}
.blog-inner ul li a{
    color: #444;
}
.blog-inner ul .btn-color{
    background: #f05456;
}

.blog-inner ul .btn-color a{
    color: #fff;
}
.blog-in-text p{
    color: #999;
    line-height: 14px;
    font-size: 13px;
    margin-bottom: 0;
    padding-top: 10px;
    font-family: 'Ubuntu', sans-serif;
}
.blog-in-text h4{
    color: #444;
    font-size: 16px;
    margin-bottom: 0;
    line-height: 24px;
    font-family: 'Ubuntu', sans-serif;
}
.blog-in-date{
    border-left: 1px solid #ddd;
    text-align: center;
    margin-left: 20px;
}
.blog-in-date h2{
    font-size: 30px;
    margin-bottom: 0;
    line-height: 24px;
    padding-left: 20px;
    font-family: 'Ubuntu', sans-serif;
}
.blog-in-date span{
    font-size: 20px;
}
.blog-image,
.blog-pos{
    position: relative;
}
.blog-inner{
    position: absolute;
    bottom: 0;
    z-index: 99;
}
.blog-image:hover .blog-inner{
    background-color: transparent;
     transition: all ease 1s;
    -webkit-transition: all ease 1s;
    -moz-transition: all ease 1s;
    -ms-transition: all ease 1s;
    -o-transition: all ease 1s;
}
.blog-image:hover .blog-hover{
    position: relative;
    z-index: 0;
    visibility: visible;
    opacity: 1;
     left: 0%;
    transition: all linear 0.6s;
    -webkit-transition: all linear 0.6s;
    -moz-transition: all linear 0.6s;
    -ms-transition: all linear 0.6s;
    -o-transition: all linear 0.6s;
}
.blog-inner ul .btn-color:hover {
    background: #f7ea66;
    transition: all linear 0.6s;
    -webkit-transition: all linear 0.6s;
    -moz-transition: all linear 0.6s;
    -ms-transition: all linear 0.6s;
    -o-transition: all linear 0.6s;
}
.blog-inner ul .btn-color:hover a{
    color: #444;
}
.blog-hover a:hover {
    color: #f7ea66;
}
.blog-image:hover .blog-inner h2,
.blog-image:hover .blog-in-date h2,
.blog-image:hover .blog-in-text p,
.blog-image:hover .blog-in-text h4{
    color: #fff;
    transition: all linear 0.9s;
    -webkit-transition: all linear 0.9s;
    -moz-transition: all linear 0.9s;
    -ms-transition: all linear 0.9s;
    -o-transition: all linear 0.9s;
}
.blog-image:after{
    position: absolute;
    content: '';
    background: rgba(0,0,0,0);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 0;
}
.blog-image:hover::after{
    background: rgba(0,0,0,0.8);
    transition: all linear 0.9s;
    -webkit-transition: all linear 0.9s;
    -moz-transition: all linear 0.9s;
    -ms-transition: all linear 0.9s;
    -o-transition: all linear 0.9s;
}

.blog-image .nav > li{
    cursor: pointer;
    position: absolute;
    right: 15px;
    top: 13px;
    color: #fff;
    background: transparent;
    z-index: 9;
}
.nav li .far.heart-fill1,
.nav li .far.heart-fill2,
.nav li .far.heart-fill{
    opacity: 1;
    position: absolute;
    right: 0px;
    top: 6px;
    z-index: -1;
}

.heart-nav1 .more-less1 ,
.heart-nav2 .more-less2 ,
.heart-nav .more-less  {
    color: transparent;
}
.heart-fill1 .more-less1,
.heart-fill2 .more-less2,
.heart-fill .more-less {
    color: #f05456!important;
}
.blog-image i.fa-align-right{
    opacity: 0;
}
.heart-fill1 .heart-fill1,
.heart-fill2 .heart-fill2,
.heart-fill .heart-fill {
    color: transparent;
}
/*=================Blog Part CSS End==============*/


/*==============Contact Part CSS Start=============*/

#contact {
    position: relative;
    padding-bottom: 60px;
}
.contact-left{
    padding-top: 20px;
}
.contact-heading h2 {
    font-size: 24px;
    color: #222222;
    font-weight: 400;
    font-family: 'Abril Fatface', cursive;
    line-height: 24px;
    text-transform: capitalize;
    margin-bottom: 40px;
}

.location-icon i {
    font-size: 14px;
    color: #ffffff;
    background: #f05456;
    width: 45px;
    height: 45px;
    line-height: 45px;
    border-radius: 100%;
    text-align: center;
     transition: all linear 0.6s;
    -webkit-transition: all linear 0.6s;
    -moz-transition: all linear 0.6s;
    -ms-transition: all linear 0.6s;
    -o-transition: all linear 0.6s;
}
.location-icon:hover i{
    box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -webkit-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -moz-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -o-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
}
.location-txt span {
    font-size: 16px;
    color: #444444;
    font-weight: 400;
    font-family: 'Ubuntu', sans-serif;
    line-height: 24px;
}

.pt {
    padding-top: 20px;
}

.ptb-bb {
    padding: 20px 0;
    border-bottom: 1px solid #dddddd;
}

.contact-form {
    margin-bottom: -140px;
     box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -webkit-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -moz-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -o-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    padding: 30px 30px 90px;
}

.contact-form {
    background: #f05456;
}

.contact-form h2 {
    font-size: 24px;
    color: #ffffff;
    font-weight: 400;
    font-family: 'Abril Fatface', cursive;
    line-height: 24px;
    padding-bottom: 20px;
    text-transform: capitalize;
}

.contact-form .form-group textarea,
.contact-form input {
    width: 100%;
    display: inline-block;
    border: 1px solid #ffffff;
    font-size: 14px;
    color: #ddd !important;
    border-radius: 0;
    background: transparent;
    padding-left: 20px;
    font-family: 'Ubuntu', sans-serif;
}

.contact-form .form-group textarea::placeholder,
.contact-form .form-group input::placeholder {
    color: #ffffff;
}

.contact-form .form-control:focus {
    color: #ffffff;
    background-color: transparent;
    border-color: #fff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0);
}

.contact-form .form-group textarea {
    height: 150px;
    padding-top: 10px;
    color: #ffffff;
    resize: none;
}

.contact-form input {
    height: 40px;
}

.contact-form input::placeholder {
    color: #ffffff;
    opacity: 1;
}

.contact-form .casino-btn a {
    filter: drop-shadow(0 0px 20px rgba(255, 214, 121, 0.3));
}

.contact-form .casino-btn a:hover {
    filter: drop-shadow(0 0px 20px rgba(152, 51, 134, 0.6));
}

.contact-form form .btn {
    display: block;
    width: 100%;
    -webkit-transform: unset;
    transform: unset;
    margin-top: 25px;
}

.btn {
    font-weight: 600;
    font-size: 20px;
    font-family: 'Ubuntu', sans-serif;
    padding: 15px 40px;
    text-transform: capitalize;
    background: #f05456;
    color: #ffffff;
    border: 1px solid #ffffff;
    border-radius: 0;
}

.btn:hover {
    background: #ffffff;
    color: #f05456;

}


/*==============Contact Part CSS End=============*/

/*==============Footer Part CSS Start=============*/


#footer {
    background: #f7ea66;
    padding-top: 100px;
}

.footer-menu {
    margin-top: 35px;
    padding-bottom: 20px;
}

.footer-menu ul {
    display: inline-block;
}

.footer-menu ul li {
    float: left;
}

.footer-menu ul li a {
    padding: 20px;
    font-size: 16px;
    color: #444444;
    font-weight: 600;
    font-family: 'Ubuntu', sans-serif;
    line-height: 24px;
    text-transform: capitalize;
}

.footer-menu ul li a:hover {
    color: #f05456;
}
.footer-text p,
.footer-text p a {
    font-size: 14px;
    color: #666666;
    font-weight: 400;
    font-family: 'Ubuntu', sans-serif;
    line-height: 24px;
}

/* chat box */

.footer-chat {
    position: fixed;
    width: 55px;
    height: 55px;
    background: #f05456;
    box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -webkit-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -moz-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    -o-box-shadow: 0px 12px 40px 4px rgba(240, 84, 86, .3);
    border-radius: 50%;
    bottom: 20px;
    right: 20px;
    z-index: 1119;
    cursor: pointer;
}

.footer-chat i {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    font-size: 24px;
    color: #fdfdfd;
}

.chat-close {
    display: none;
}


/*==============Footer Part CSS End==============*/


/*==============================================
                Other's Page CSS Start
        ===============================================*/


/*==============Breadcramb Part CSS Start==============*/
.others{
    position: relative;
    overflow: hidden;
}

.otherpage {
    background: url(../images/other-banner.png) no-repeat;
     background-size: cover;  
    margin-top: 95px; 
}
.bread-inner{
     padding: 90px 0 70px;
}
.otherpage ul.breadcrumb {
    padding: 20px 0 3px;
    display: inline-flex;
    list-style: none;
    background-color: transparent;
    text-align: center;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 500;
}

.bread-inner h2 {
    font-size: 32px;
    color: #f05456;
    font-weight: 400;
    font-family: 'Abril Fatface', cursive;
    line-height: 24px;
    margin-bottom: 35px;
    text-transform: capitalize;
}
.bread-inner p{
    font-size: 16px;
    color: #444;
    font-weight: 400;
    font-family: 'Ubuntu', cursive;
    line-height: 24px;
    margin-bottom: 0;
}
.otherpage ul.breadcrumb li a p {
    color: #444444;
    padding-right: 10px;
}

.otherpage ul.breadcrumb li a p i {
    padding-left: 10px;
}

.otherpage ul.breadcrumb li p {
    display: inline;
    font-size: 18px;
    width: 650px;
    color: #f05456;
    font-weight: 500;
    font-family: 'Ubuntu', sans-serif;
    line-height: 24px;
    margin-bottom: 20px;
    text-transform: capitalize;
}


/*==============Breadcramb Part CSS End==============*/


/*==============Portfolio Page CSS Start==============*/

#por-page {
    padding: 80px 0 60px;
}

.pro-text h3 {
    font-size: 24px;
    color: #222222;
    font-weight: 400;
    font-family: 'Abril Fatface', cursive;
    text-transform: capitalize;
    margin-bottom: 30px;
    position: relative;
}

.pro-text img {
    position: absolute;
    top: 0;
    right: 50%;
    justify-content: center;
    transform: translate(50%, -55%);
}

.pro-text p {
    font-size: 16px;
    color: #444444;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 400;
    margin-bottom: 25px;
}

.pro-pera {
    padding: 30px 0;
    border-bottom: 1px solid #f1f1f1;
}

.pro-pera p {
    font-size: 16px;
    color: #444444;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 400;
    margin-bottom: 25px;
}

#reating {
    padding-bottom: 40px;
}


.reating .rate{
    display: inline-block;
}
.pro-reating{
    margin-top: -28px;
}
.reating .rate span{
    font-family: 'Open Sans', sans-serif;   
    font-size: 20px;
    font-weight: 500;
    color: #444444;
    margin-right: 16px;
}

.reating .rate i{
    color: #dddddd;
    transition: all linear .5s;
    -webkit-transition: all linear .5s;
    -moz-transition: all linear .5s;
    -o-transition: all linear .5s;
}

.reating .rate i:hover{
    color: #fcc712;
    cursor: pointer;
}

.rate {
    height: 44px;
    padding: 0 10px;
}
.rate:not(:checked) > input {
    position:absolute;
    top:-9999px;
}
.rate:not(:checked) > label {
    float:right;
    width:1em;
    overflow:hidden;
    white-space:nowrap;
    cursor:pointer;
    font-size:30px;
    color:#ccc;
    margin-top: 15px;
}
.rate:not(:checked) > label:before {
    content: '★ ';
}
.rate > input:checked ~ label {
    color: #fcc512;    
}
.rate:not(:checked) > label:hover,
.rate:not(:checked) > label:hover ~ label {
    color: #fcc512;  
}
.rate > input:checked + label:hover,
.rate > input:checked + label:hover ~ label,
.rate > input:checked ~ label:hover,
.rate > input:checked ~ label:hover ~ label,
.rate > label:hover ~ input:checked ~ label {
    color: #fcc512;
}

.pro-reating span {
    font-size: 18px;
    color: #444444;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 600;
    margin-right: 10px;
}
.pro-share{
    display: inline-flex;
}
.pro-share h4{
    font-size: 18px;
    color: #444444;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 600;
    margin-right: 25px;
}
.pro-share ul li {
    float: left;
}

.pro-social_icon ul li {
    transform: translateX(0px);
    padding: 0px 20px 0px 20px;
      transition: all linear 0.7s;
    -webkit-transition: all linear 0.7s;
    -moz-transition: all linear 0.7s;
    -ms-transition: all linear 0.7s;
    -o-transition: all linear 0.7s;
}
.pro-social_icon ul li a {
    position: relative;
	color: #999;
	font-size: 14px;
	font-weight: 500;    
    font-family: 'Ubuntu', sans-serif;
	text-decoration: none;
}

.pro-social_icon ul li a i {
	font-size: 16px;
	text-align: center;
	text-decoration: none;
}
.pro-social_icon ul .facebook{
    margin-left: 4px;
}
.pro-social_icon ul .facebook a:after{
    position: absolute;
    content: 'facebook';
    font-size: 11px;
    color: #999;
    opacity: 0;
    top: -3px;
    right: -53px;
}
.pro-social_icon ul .google a:after{
    position: absolute;
    content: 'google +';
    font-size: 11px;
    color: #999;
    opacity: 0;
    top: -3px;
    right: -48px;
}
.pro-social_icon ul .behance a:after{
    position: absolute;
    content: 'behance';
    color: #999;
    font-size: 11px;
    opacity: 0;
    top: -3px;
    right: -50px;
}
.pro-social_icon ul .twitter a:after{
    position: absolute;
    content: 'twitter';
    color: #999;
    font-size: 11px;
    opacity: 0;
    top: -3px;
    right: -45px;
}
.pro-social_icon ul .linkedin a:after{
    position: absolute;
    content: 'linkedin';
    color: #999;
    font-size: 11px;
    opacity: 0;
    top: -3px;
    right: -48px;
}

.pro-social_icon ul .google:hover a:after,
.pro-social_icon ul .linkedin:hover a:after,
.pro-social_icon ul .twitter:hover a:after,
.pro-social_icon ul .facebook:hover a:after,
.pro-social_icon ul .behance:hover a:after{
     color: red;
     opacity: 1;
       transition: all linear 1s;
    -webkit-transition: all linear 1s;
    -moz-transition: all linear 1s;
    -ms-transition: all linear 1s;
    -o-transition: all linear 1s;
}
.pro-social_icon li:hover a{
    color: red;
}
.pro-social_icon ul li:hover{
    transform: translateX(-22px);
    transition: all linear 0.5s;
    -webkit-transition: all linear 0.5s;
    -moz-transition: all linear 0.5s;
    -ms-transition: all linear 0.5s;
    -o-transition: all linear 0.5s;
}

/* comment */

.comments {
    padding-bottom: 50px;
    border-bottom: 1px solid #eee;
    margin-bottom: 60px;
}

.comments-title {
    border-bottom: 1px solid #eee;
    font-size: 20px;
    font-family: 'Ubuntu', sans-serif;
    color: #151515;
    font-weight: 700;
    line-height: 24px;
    padding: 40px 0 10px;
    text-transform: capitalize;
}

.blog_comments .media {
    padding: 0 0 10px;
}

.media-middle {
    margin-top: 20px;
}

.media_first {
    border-bottom: 1px solid #ddd;
}

.blog_comments .media .media-left img {
    object-fit: cover;
    -o-object-fit: cover;
}

.blog_comments .media .media-left {
    padding-right: 20px;
}

.blog_media .media-heading {
    font-size: 16px;
    font-family: 'Ubuntu', sans-serif;
    line-height: 24px;
    text-align: left;
    font-weight: 600;
    color: #151515;
}

.blog_media .media-heading span {
    float: right;
    color: #999999;
    line-height: 24px;
    font-size: 14px;
    font-weight: 400;
        padding-right: 15px;
}

.blog_media p {
    padding: 10px 0 5px !important;
    font-size: 16px;
    font-family: 'Ubuntu', sans-serif;
    color: #151515;
    line-height: 24px;
    font-weight: 400;
}

.blog_media a {
    color: #777;
}

.blog_media a:hover {
    color: #f05456;
}

.form-detail {
    margin-bottom: 70px;
}

/* contact form */

.form-detail {
    margin-bottom: 70px;
}

.blogdetails_form h4 {
    padding: 15px 0 25px !important;
    text-transform: none;
}

.blogdetails_form .form-group textarea {
    width: 100%;
    height: 120px;
    padding: 5px 10px;
}

.blogdetails_form .form-group {
    margin-left: 0;
}

.blogdetails_form .form-group input,
.blogdetails_form .form-group textarea {
    color: #777;
    text-transform: capitalize;
    resize: none;
    font-family: 'Ubuntu', sans-serif;
    border: 1px solid #ddd;
    border-radius: 0px;
    font-size: 13px;
}
.blogdetails_form .form-group textarea ::-webkit-input-placeholder,
.blogdetails_form .form-group input::-webkit-input-placeholder { 
  font-family: 'Ubuntu', sans-serif;
}
.blogdetails_form .form-group input:-moz-placeholder,
.blogdetails_form .form-group textarea:-moz-placeholder { 
  font-family: 'Ubuntu', sans-serif;
}
.blogdetails_form .form-control:focus{
    box-shadow: 0 0 0 0.2rem rgba(0,123,255,0);
}
.blogdetails_form .book_btn {
    width: 100%;
}

.blog_grid_btn a {
    color: #f05456;
}

.blogdetails_form {
    margin-top: 25px;
    margin-bottom: 80px;
}

.blog-detail-img img {
    width: 100%;
    margin: 50px 0 0;
}

.bro-btn2 {
    text-align: center;
    border: 0.2px solid #ddd;
      box-shadow: 0px 0px 10px 4px rgba(0, 0, 0, .07);
    -webkit-box-shadow: 0px 0px 10px 4px rgba(0, 0, 0, .07);
    -moz-box-shadow: 0px 0px 10px 4px rgba(0, 804, 0, .07);
    -o-box-shadow: 0px 0px 10px 4px rgba(0, 0, 0, .07);
    padding: 10px 0 10px;
    width: 100%;
    font-size: 20px;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 600;
    line-height: 24px;
    text-transform: uppercase;
    z-index: 99;
    display: inline-block;
    position: relative;
    cursor: pointer;
}

.bro-btn2:hover {
    background: #f05456;
    color: #ffffff;
    box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .3);
    -webkit-box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .3);
    -moz-box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .3);
    -o-box-shadow: 0px 0px 40px 4px rgba(240, 84, 86, .3);
}

/*==============Portfolio Page CSS End==============*/


/*============== Blog Details Page CSS Start==============*/

#blog-details,
#blog-details-side {
    padding-top: 80px;
}

.details-img-sub {
    display: inline-flex;
}

.details-img-sub img {
    margin-right: 20px;
}
.details-banner{
    position: relative;
}
.details-banner img {
    margin-bottom: 30px;
}
.blog-page-inner ul li{
    display: inline-block;
    color: #444;
    margin: 0 4px;
    font-size: 14px;
    line-height: 24px;
    padding: 2px 18px 2px;
    background: #ddd;
    font-family: 'Ubuntu', sans-serif;
    border-radius: 3px;
}
.blog-page-inner{
    position: absolute;
    top: 15px;
    left: 20px;
}
.blog-page-inner ul li:first-child{
    margin-left: 0;
}
.blog-page-inner ul li a{
    color: #444;
}
.blog-page-inner ul .btn-color{
    background: #f05456;
}
.blog-page-inner ul .btn-color:hover{
    background: #f7ea66;
}
.blog-page-inner ul .btn-color a{
    color: #fff;
}
.blog-page-inner ul .btn-color:hover a{
    color: #444;
}
.details-banner h4 {
    font-size: 24px;
    font-family: 'Abril Fatface', cursive;
    font-weight: 400;
    color: #151515;
    line-height: 32px;
    text-align: left;
    margin-bottom: 30px;
}

.details-img-sub .post-text {
    padding-top: 10px;
}

.post-text {
    padding-top: 4px;
}

.post-text h4 {
    font-size: 14px;
    font-family: 'Ubuntu', sans-serif;
    color: #777777;
    font-weight: 400;
    line-height: 24px;
}
.post-comment{
    text-align: right;
    padding-right: 10px;
}
.post-comment ul {
    margin-top: 20px;
}

.post-comment ul li {
    display: inline-block;
    margin-left: 20px;
}

.post-comment ul li a {
    color: #999999;
    font-size: 14px;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 400;
}

.post-comment ul li a i {
    margin-right: 9px;
}

.blog-detail-inner {
    margin-top: 28px;
}

.blog-detail-inner p {
    font-size: 16px;
    font-family: 'Ubuntu', sans-serif;
    color: #444444;
    line-height: 24px;
    font-weight: 400;
}

.blog_highlights p {
    background-color: #f1f1f1;
    padding: 26px 20px 26px 30px;
    border-left: 3px solid #f05456;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 500;
    font-style: italic;
    color: #444444;
    font-size: 16px;
    margin: 10px 0 30px;
}

.blog-detail-bottom p {
    font-size: 16px;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 400;
    color: #444444;
    line-height: 24px;
    font-weight: 400;
}

.tag {
    display: inline-flex;
    margin-top: 75px;
}

.tag h2 {
    font-size: 20px;
    font-family: 'Ubuntu', sans-serif;
    text-transform: capitalize;
    line-height: 24px;
    font-weight: 700;
    color: #151515;
    padding-bottom: 8px;
    margin-right: 10px;
    margin-top: 12px;
}

.tag a {
    height: 32px;
    padding: 0 10px;
    border: 1px solid #ddd;
    text-align: center;
    line-height: 31px;
    text-transform: capitalize;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 400;
    margin: 10px 12px 0 0;
    font-size: 14px;
    color: #444444;
    outline: 0;
    text-transform: capitalize;
}

.tag a:hover {
    border-color: #f05456;
    color: #f05456;
}

.share,
.share ul li {
    display: inline-flex;
}

.share h2 {
    font-size: 20px;
    font-family: 'Ubuntu', sans-serif;
    text-transform: capitalize;
    line-height: 24px;
    font-weight: 700;
    color: #222;
    padding-bottom: 8px;
    margin-right: 10px;
    margin-top: 40px;
}

.share ul {
    margin-top: 27px;
}

.share ul li a {
    margin: 10px 0 0 10px;
    text-align: center;
    border: 1px solid #777;
    float: left;
    color: #777;
    font-size: 14px;
    width: 36px;
    height: 36px;
    line-height: 36px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

.share ul li a:hover {
    color: #fff;
    background: #f05456;
    border: 1px solid #f05456;
}

/* ============= video part ========*/

.video-watch {
    position: relative;
    text-align: center;
    margin-top: 5px;
}

.side-video {
    margin-top: 30px;
}

.video-watch:before {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.6);
    opacity: 1;
}

.youtube_video a i {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    width: 50px;
    height: 50px;
    background: #f05456;
    border-radius: 50%;
    line-height: 50px;

}


/* ============= Sidebar part Start ========*/

.sidebar_categori h2 {
    font-size: 20px;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 24px;
    font-weight: 700;
    color: #222222;
    padding-bottom: 8px;
}

.sidebar_categori tr td a {
    font-size: 16px;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 400;
    color: #444444;
    line-height: 30px;
    text-align: left;
    text-transform: capitalize;
    text-decoration: none;
}

.sidebar_categori table {
    border: none;
    width: 100%;
}

.sidebar_categori table td {
    color: #444444;
    font-size: 14px;
    text-transform: capitalize;
    font-family: 'Ubuntu', sans-serif;
    font-weight: 600;
    padding: 8px 25px 0 8px;
}

.cat_right {
    text-align: right;
}

.cat_right:hover {
    color: #222;
    font-weight: 600;
}

.sidebar_categori table tr:hover td,
.sidebar_categori table tr:hover td a,
.sidebar_categori table tr td a:focus {
    color: #f05456;
    font-weight: 600;
    margin-left: 35px;
    transition: all 0.4s linear;
    -webkit-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    -ms-transition: all 0.4s linear;
}

.side_tab ul li {
    border: none;
}

.side_tab ul li a {
    font-size: 18px;
    font-family: 'Ubuntu', sans-serif;
    color: #444444;
    text-transform: uppercase;
    font-weight: 600;
    border: none;
    border-radius: 0;
    padding: 0 30px 0 0;
}

.side_tab ul li:last-child a {
    padding: 0;
}

.side_tab ul li.active a:hover,
.side_tab ul li.active a {
    border: none;
    background: none;
}

.side_tab ul > li .active,
.side_tab ul li a:hover {
    border: transparent;
    background: none;
    color: #f05456 !important;
}

.nav-tabs {
    border: none;
    margin-top: 40px;
}

.nav-tabs li {
    border: none;
}

.portfolio_fillter ul.filter .mixitup-control-active {
    text-decoration: none;
    color: #f05456 !important;
    outline: none;
}

.nav-tabs > li > a {
    margin-right: 0;
    line-height: 24px;
}

.tab-content > .active {
    display: initial !important;
}

.tab-content .media {
    border-bottom: 1px solid #dddddd;
    padding: 30px 0 20px;
    margin-top: 0;
}

.tab-content .media:last-child {
    border-bottom: none;
}

.tab-content .media-left .overlay {
    box-shadow: 0 0 0 5px rgba(129, 130, 135, .5) inset;
    -webkit-box-shadow: 0 0 0 5px rgba(129, 130, 135, .5) inset;
}

.tab-content .media-left .img_inner {
    width: 100%;
}

.img_inner {
    height: 100%;
    width: 100%;
    overflow: hidden;
}

.tab-content .media-heading {
    font-size: 16px;
    font-family: 'Ubuntu', sans-serif;
    color: #222222;
    line-height: 24px;
    margin-bottom: 20px;
    display: block;
    font-weight: 600;
}

.tab-content .media-body {
    width: 230px;
    padding-left: 20px;
}

.tab-content .media-body span {
    font-size: 13px;
    color: #999999;
    padding-right: 10px;
    text-transform: capitalize;
    font-family: 'Ubuntu', sans-serif;
}

.media-heading:hover a {
    color: #f05456;
}

.tab-content .media-body span i {
    padding-right: 5px;
}

.tab-content .media:hover .overlay-side,
.home_gallary_img:hover .overlay-side,
.home_blog_div:hover .home_gallary_img .overlay-side {
    height: 100%;
    opacity: 1;
}

.tab_img_div {
    position: relative;
    z-index: 9;
}

.tab-content .media:hover .media-heading {
    color: #f05456 !important;
}

.tab-content .media:hover img {
    transform: scale(1.2);
    transition: all 0.4s linear;
    -webkit-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    -ms-transition: all 0.4s linear;
}

.overlay-side {
    position: absolute;
    width: 100%;
    height: 0%;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.8);
    opacity: 0;
    transition: all 0.4s linear;
    -webkit-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    -ms-transition: all 0.4s linear;
}

.over_link {
    position: relative;
    width: 30px;
    height: 30px;
    line-height: 29px;
    border-radius: 50%;
    background: #fff;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
}

.over_link a,
.over_link a:hover {
    color: #f05456;
    padding: 9px;
    font-size: 14px;
}


/* ============= Sidebar part End ========*/



/*============== Blog Details Page CSS End==============*/
