/*
* ----------------------------------------------------------------------------------------
Author       : DuezaThemes
Author URL   : https://themeforest.net/user/duezathemes
Template Name: Mister Perfect - Minimal CV/Resume/vCard Template
Version      : 1.0                                          
* ----------------------------------------------------------------------------------------
*/

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

-----------------------------------------------------------------------------------

    CSS INDEX
    ===================
  
    1. Theme default CSS
    2. Home One
        2.2 About Section
        2.3 Skills
        2.4 Experience
        2.5 Services
        2.6 Educaion
        2.7 Portfolio
        2.8 Testimonial and Logos
        2.9 Pricing
        2.10 Blog
        2.11 Footer
    3. Home Two
    4. Home Three
    5. Blog 1 Column
    6. Blog 2 Column
    7. Blog column sidebar
    8. Blog details
    9. Contact
    10. Coming
    11. Not Found
    12. Error
    
-----------------------------------------------------------------------------------*/


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


/*  1. Theme default CSS
/*----------------------------------------*/


/*google-font*/

@import url('http://fonts.googleapis.com/css?family=Montserrat:400,700|Lato:300,400,700,900');

.clear {
    clear: both
}

::-moz-selection {
    background: #00b0ff;
    color: #fff;
    text-shadow: none;
}

::selection {
    background: #00b0ff;
    color: #fff;
    text-shadow: none;
}

.no-mar {
    margin: 0!important;
}

.no-pad {
    padding: 0!important;
}

div#preloader {
    background: #000 url("../img/loader.gif") no-repeat scroll center center;
    height: 100%;
    left: 0;
    overflow: visible;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 99999;
}

.sticky-menu-area.navbar-fixed-top {
    box-shadow: 0 4px 12px -4px rgba(0, 0, 0, 0.75);
    left: 0;
    position: fixed !important;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 999;
    display: block;
    background: #fff;
}

.mar-bot-50 {
    margin-bottom: 50px;
}

.mar-bot-40 {
    margin-bottom: 40px;
}

.mar-bot-35 {
    margin-bottom: 35px;
}

.mar-bot-30 {
    margin-bottom: 30px;
}

.mar-top-30 {
    margin-top: 30px;
}

.mar-top-80 {
    margin-top: 80px;
}

.mar-top-80 {
    margin-top: 80px;
}

.mar-top-55 {
    margin-top: 55px;
}

.mar-top-108 {
    margin-top: 108px;
}

.text-left {
    text-align: left;
}

.text-center {
    text-align: center;
}

.text-right {
    text-align: right;
}

*,
*:before,
*:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

*:focus {
    outline: 0;
}

html {
    font-size: 62.5%;
    -webkit-font-smoothing: antialiased;
}

body {
    background: #fff;
    font-weight: normal;
    font-size: 15px;
    letter-spacing: 1.5px;
    color: #888;
    line-height: 30px;
    -webkit-font-smoothing: antialiased;
    /* Fix for webkit rendering */
    -webkit-text-size-adjust: 100%;
}

img {
    max-width: 100%;
    height: auto;
}

button,
input,
textarea {
    letter-spacing: 1px;
}


/* 
Table Of Contents
=========================
- Default Typography
- Custom Typography
=========================
*/


/* 
--------------------------
- Default Typography
--------------------------
*/

body {
    font-family: 'Montserrat', Montserrat;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    font-family: 'Montserrat', Montserrat;
    font-weight: 700;
    color: #000;
    letter-spacing: 1.5px;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
    font-weight: inherit;
    font-family: 'Montserrat', sans-serif;
}

h1 {
    font-size: 36px;
    line-height: 70px;
    letter-spacing: 1px;
    margin-bottom: 0px;
}

h2 {
    font-size: 22px;
    line-height: 24px;
    margin-bottom: 0px;
}

h3 {
    font-size: 24px;
    line-height: 30px;
    margin-bottom: 0px;
}

h4 {
    font-size: 20px;
    line-height: 27px;
}

h5 {
    font-size: 16px;
    line-height: 24px;
}

h6 {
    font-size: 14px;
    line-height: 24px;
}

p {
    font-family: 'Montserrat', Montserrat;
    font-size: 14px;
    font-weight: normal;
    letter-spacing: 0;
    line-height: 28px;
    margin: 0;
}

p img {
    margin: 0;
}

span {
    font-family: 'Montserrat', Montserrat;
}


/* em and strong */

em {
    font: 15px/30px;
}

strong,
b {
    font: 15px/30px;
}

small {
    font-size: 11px;
    line-height: inherit;
}


/*  blockquotes */

blockquote {
    border-left: 0 none;
    font-family: 'Montserrat', Montserrat;
    margin: 10px 0;
    padding-left: 40px;
    position: relative;
}

blockquote::before {
    color: #4e5665;
    content: "";
    font-family: FontAwesome;
    font-size: 36px;
    left: 20px;
    line-height: 0;
    margin: 0;
    opacity: 0.5;
    position: absolute;
    top: 20px;
}

blockquote p {
    font-style: italic;
    padding: 0;
    font-size: 18px;
    line-height: 36px;
}

blockquote cite {
    display: block;
    font-size: 12px;
    font-style: normal;
    line-height: 18px;
}

blockquote cite:before {
    content: "\2014 \0020";
}

blockquote cite a,
blockquote cite a:visited {
    color: #8B9798;
    border: none
}


/* abbreviations */

abbr {
    color: #444;
    font-weight: 700;
    font-variant: small-caps;
    text-transform: lowercase;
    letter-spacing: .6px;
}

abbr:hover {
    cursor: help;
}


/* links */

a,
a:visited {
    text-decoration: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: normal;
    font-size: 12px;
    color: #111;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    outline: 0;
}

a:hover,
a:active {
    color: #008181;
    text-decoration: none;
    outline: 0;
}

a:focus {
    text-decoration: none;
    outline: 0;
}

p a,
p a:visited {
    line-height: inherit;
    outline: 0;
}

a.active-page {
    color: #e6ae48!important;
}


/* list */

ul,
ol {
    margin-bottom: 0px;
    margin-top: 0px;
}

ul {
    margin: 0;
}

ol {
    list-style: decimal;
}

ol,
ul.square,
ul.circle,
ul.disc {
    margin-left: 0px;
}

ul.square {
    list-style: square outside;
}

ul.circle {
    list-style: circle outside;
}

ul.disc {
    list-style: disc outside;
}

ul ul,
ul ol,
ol ol,
ol ul {
    margin: 0;
}

ul ul li,
ul ol li,
ol ol li,
ol ul li {
    margin-bottom: 0px;
}

li {
    line-height: 18px;
    margin-bottom: 0px;
}

ul.large li {}

li p {}


/* definition list */

dl {
    margin: 12px 0;
}

dt {
    margin: 0;
    color: #11ABB0;
}

dd {
    margin: 0 0 0 20px;
}

button {}


/* 
--------------------------
- Custom Typography
--------------------------
*/


/* Your Custom Typography. */

.bg-with-black {
    position: relative;
}

.bg-with-black::before {
    background: #000 none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.3;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0;
}

.bg-with-white {
    position: relative;
}

.bg-with-white::before {
    background: #fff none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.3;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0;
}

.bg-with-blue {
    position: relative;
}

.bg-with-blue::before {
    background: #00bff3 none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.6;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0;
}

.hvr-bs:hover {
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}


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


/*  2. Home One
/*----------------------------------------*/

.hero-area {
    overflow: hidden;
    background: #000 url(../img/home1/hero.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: -50% 0px;
    margin: 0 0 100px;
}

header {
    background: #fff;
    float: left;
    padding: 39px 30px 0 80px;
    width: 374px;
}

.logo {
    margin: 0 0 57px;
}

.logo a {
    display: block;
    color: #000000;
    font-size: 36px;
    line-height: 38px;
    font-weight: 900;
    text-transform: capitalize;
    letter-spacing: 0;
}

.menu {
    border-bottom: 1px solid #898989;
    padding: 0 0 69px;
    margin: 0 0 49px;
}

.menu ul {
    display: block;
    list-style: none;
    padding: 0;
}

.menu ul li {
    display: block;
}

.menu ul li a {
    display: block;
    color: #474747;
    font-size: 18px;
    line-height: 40px;
    letter-spacing: 0;
}

.menu ul li a:hover, .menu ul li.active a {
    color: #008181;
}

.top-newsletter {
    margin: 0 0 50px;
}

.top-newsletter .title {
    color: #353535;
    font-size: 18px;
    line-height: 22px;
    letter-spacing: 0;
    font-weight: 500;
    margin: 0 0 8px;
}

.top-newsletter .text {
    color: #898989;
    line-height: 18px;
    margin: 0 0 30px;
}

.tn-input-box {
    position: relative;
}

.tn-input-box input[type="text"] {
    color: #898989;
    font-size: 14px;
    letter-spacing: 0;
    border: 0;
    border-bottom: 1px solid #898989;
    padding: 0;
    height: 42px;
    width: 100%;
}

.tn-input-box button {
    position: absolute;
    background: transparent;
    border: 0;
    right: 0;
    color: #898989;
    font-size: 18px;
    line-height: 38px;
    top: 0;
}

.top-footer {}

.top-footer .text,
.top-footer .text a {
    color: #898989;
    font-family: 'Montserrat', sans-serif;
    line-height: 18px;
}

.top-footer .text {
    margin: 0 0 22px;
}

.top-footer .text a {
    font-size: 14px;
    color: #3b3b3b;
    font-weight: 700;
}

.top-footer .social {
    list-style: none;
    padding: 0;
}

.top-footer .social li {
    display: inline-block;
    margin-right: 1px;
}

.top-footer .social li a {
  background: #008181 none repeat scroll 0 0;
  border: 1px solid #008181;
  border-radius: 100px;
  color: #fff;
  display: block;
  height: 22px;
  line-height: 20px;
  padding: 0 0 0 1px;
  text-align: center;
  width: 22px;
}

.top-footer .social li a:hover {
    background: #fff;
    color: #008181;
}

.hero-content {
    overflow: hidden;
    position: relative;
}

.hero-content .box {
    margin-top: 34%;
    padding-left: 66px;
    width: 70%;
}

.hero-content .box .intro {
    color: #fefefe;
    font-size: 36PX;
    line-height: 40px;
    letter-spacing: 0;
    font-weight: 300;
    margin: 0 0 27px;
    position: relative;
}

.hero-content .box .intro:before {
    background: #e9e9e9;
    position: absolute;
    content: "";
    bottom: -6px;
    left: 0;
    height: 1px;
    width: 100%;
}

.hero-content .box .name {
    color: #fefefe;
    font-size: 72px;
    line-height: 76px;
    letter-spacing: 0;
    font-weight: 300;
    margin: 0 0 3px;
}

.hero-content .box .desg {
    color: #c0c0c0;
    font-size: 18px;
    line-height: 22px;
}


/*sticky-menu*/

.sticky-menu-area {
    display: none;
}

.sticky-menu {}

.sticky-menu ul {
    list-style: none;
    padding: 0;
}

.sticky-menu ul li {
    display: inline-block;
}

.sticky-menu ul li a {
    display: block;
    color: #474747;
    font-size: 18px;
    line-height: 40px;
    letter-spacing: 0;
    padding: 10px 22px;
}

.sticky-menu ul li.active a {
    color: #008181;
}

.sticky-menu ul li a:first-child {
    padding-left: 0;
}


/*2.2 About Section*/

.about-section-area {
    padding: 0 0 70px;
}

.asa-box-shadow {
    -webkit-box-shadow: 0px 1px 5px -2px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 1px 5px -2px rgba(0, 0, 0, 0.75);
}

.as-intro {
    -webkit-box-shadow: 0px 1px 5px -2px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 1px 5px -2px rgba(0, 0, 0, 0.75);
}

.as-intro .as-intro-img {
    position: relative;
    margin: 0 0 10px
}

.as-intro .as-intro-img>img {}

.as-intro .as-intro-img .img-2 {
    position: absolute;
    border: 5px solid #fff;
    bottom: -74px;
    left: 14px;
    height: 110px;
    width: 110px;
    border-radius: 100px;
    overflow: hidden;
}

.as-intro .as-intro-img .img-2 img {}

.as-intro .as-intro-name {
    margin: 0 0 54px 138px;
}

.as-intro .as-intro-name .name {
    font-family: 'Montserrat', sans-serif;
    color: #323232;
    font-size: 26px;
    letter-spacing: 0;
    font-weight: 400;
    line-height: 30px;
}

.as-intro .as-intro-name .name span {
    font-family: 'Montserrat', sans-serif;
    font-weight: 300;
}

.as-intro .as-intro-name .desg {
    font-family: 'Montserrat', sans-serif;
    color: #666666;
    font-size: 13px;
    line-height: 17px;
}

.as-intro .as-intro-info {
    padding: 0 20px 0 36px;
    margin: 0 0 45px;
}

.as-intro .as-intro-info .as-intro-info-box {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
}

.as-intro .as-intro-info .as-intro-info-box .title {
    float: left;
    width: 28%;
    color: #202020;
    letter-spacing: 0;
    font-size: 15px;
    line-height: 34px;
}

.as-intro .as-intro-info .as-intro-info-box .text {
    flex: 1;
    color: #6a6a6a;
    font-size: 14px;
    line-height: 32px;
    letter-spacing: 0;
}

.as-intro .available {
    text-align: center;
    border-top: 1px solid #eeeeee;
    padding: 8px 0px;
}

.as-intro .available .button {
    display: block;
    -webkit-box-shadow: 1px 1px 5px -2px rgba(0, 0, 0, 0.75);
    box-shadow: 1px 1px 5px -2px rgba(0, 0, 0, 0.75);
    letter-spacing: 0;
    font-family: 'Montserrat', Montserrat;
    color: #666666;
    font-size: 14px;
    line-height: 18px;
    background: #e7e7e7;
    margin: 0 18px;
    padding: 12px 10px;
}

.as-intro .available .button:hover {
    background: #008181;
    color: #ffffff;
}

.as-content {
    padding: 56px 20px 20px 0;
}

.as-content .title {
    color: #24262a;
    letter-spacing: 0;
    font-weight: 500;
    margin: 0 0 17px;
}

.as-content .text {
    color: #313131;
    line-height: 24px;
    margin: 0 0 63px;
}

.as-content .download-contact {
    margin: 0 0 69px;
}

.as-content .download-contact a {
    display: inline-block;
    background: #008181;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0;
    color: #fff;
    padding: 10px 21px;
    margin: 0 9px 8px 0;
}

.as-content .download-contact a:hover {
    background: #efefef;
    color: #24262a;
}

.as-content .download-contact a:nth-child(even) {
    background: #efefef;
    color: #24262a;
}

.as-content .download-contact a:nth-child(even):hover {
    background: #008181;
    color: #fff;
}

.as-content .social {
    list-style: none;
    padding: 0;
}

.as-content .social li {
    display: inline-block;
    margin-right: 13px;
}

.as-content .social li a {
    border: 1px solid #008181;
    display: block;
    background: #008181;
    font-size: 18px;
    color: #fff;
    height: 40px;
    width: 40px;
    line-height: 40px;
    border-radius: 100px;
    text-align: center;
}

.as-content .social li a:hover {
    background: #fff;
    color: #008181;
}


/*2.3 Skills*/


/*section-titile-start*/

.section-title {
    position: relative;
    top: -40px;
}

.section-title h2 {
    background: #008181;
    display: inline-block;
    color: #fff;
    font-size: 30px;
    line-height: 34px;
    letter-spacing: 0;
    font-weight: 300;
    padding: 4px 15px;
    min-width: 290px;
    position: relative;
}

.section-title h2::before {
    content: "";
    position: absolute;
    height: 1px;
    background: #008181;
    width: 100%;
    bottom: 0;
    left: -100%;
}


/*section-titile-end*/

.skills-area {
    margin: 40px 0 0;
    padding: 30px 0 140px;
}

.skills-box {
    -webkit-box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    padding: 44px 32px 5px 32px;
    position: relative;
    margin: 28px 0 0;
}

.skills-box .icon {
    position: absolute;
    top: -28px;
    left: 7px;
    background: #008181;
    height: 60px;
    width: 60px;
    display: inline-block;
    line-height: 60px;
    border-radius: 100px;
    text-align: center;
    color: #fff;
    font-size: 28px;
}

.skills-box .title {
    background: #008181;
    display: inline-block;
    letter-spacing: 0;
    color: #fff;
    font-size: 18px;
    line-height: 22px;
    padding: 2px 10px;
    font-weight: 400;
    min-width: 237px;
    margin: 0 0 30px;
}

.skills-box .all-progess {}

.skills-box .skills-progress {
    margin: 0 0 28px;
}

.skills-box .skills-progress .progressbar-title {
    color: #24262a;
    display: block;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0;
    margin: 0 0 10px;
}

.skills-box .skills-progress .progress {
    background: #008181;
    height: 1px;
    overflow: visible;
}

.skills-box .skills-progress .progress .progress-bar {
    background: transparent;
    height: 1px;
    border: 0;
    box-shadow: none;
    position: relative;
}

.skills-box .skills-progress .progress .progress-bar span {
    background: #008181;
    height: 20px;
    position: absolute;
    right: 0;
    top: -19px;
    z-index: 9;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0;
    font-weight: 500;
    padding: 2px 16px;
}

.left-anim {
    animation: animate-positive 2s;
    opacity: 1;
}

@keyframes animate-positive {
    0% {
        width: 0%;
    }
}


/*2.4 Experience*/

.experience-area {
    background: #ededed;
    padding: 17px 0 0;
}

.experience-area .section-title {
    top: -58px;
}

.experience-area .section-title h2 {}

.experience-side {}

.experience-box {
    background: #fff;
    -webkit-box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    position: relative;
    padding: 21px 50px 44px 34px;
    margin: 0 0 58px;
}

.experience-box .title {
    color: #7b7b7b;
    font-size: 18px;
    line-height: 22px;
    letter-spacing: 0;
    font-weight: 400;
    margin: 0 0 10px;
}

.experience-box .desg {
    border-bottom: 1px solid #008181;
    margin: 0 0 16px;
}

.experience-box .desg span {
    display: inline-block;
    background: #008181;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0;
    color: #fff;
    font-weight: 400;
    padding: 3px 6px;
    min-width: 136px;
}

.experience-box .text {
    color: #24262a;
    line-height: 25px;
}

.experience-box .date {
    background: #008181;
    display: inline-block;
    position: absolute;
    right: 30px;
    bottom: 10px;
    color: #fff;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0;
    padding: 1px 4px;
}

.experience-box .date::before {
    content: "";
    position: absolute;
    top: 6px;
    left: -6px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4.5px 6px 4.5px 0;
    border-color: transparent #008181 transparent transparent;
}


/*2.5 Services*/

.service-area {
    padding: 140px 0 28px;
}

.service-area .section-title {}

.service-area .section-title h2 {}

.service-side {}

.service-box {
    background: #f1f1f1;
    -webkit-box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    padding: 30px 34px 60px 34px;
    position: relative;
    margin: 60px 0 114px;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.service-box:hover {
    background: #fff;
}

.service-box .icon {
    -webkit-box-shadow: 0px 0px 10px -3px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 0px 10px -3px rgba(0, 0, 0, 0.75);
    position: absolute;
    top: -60px;
    left: 9px;
    background: #008181;
    height: 78px;
    width: 78px;
    display: inline-block;
    line-height: 60px;
    border-radius: 100px;
    text-align: center;
    color: #fff;
    font-size: 28px;
    border: 9px solid #fff;
}

.service-box .title {
    margin: 0 0 38px;
}

.service-box .title span {
    border: 2px solid #fff;
    background: #eaeaea;
    color: #7e7e7e;
    font-size: 18px;
    line-height: 22px;
    letter-spacing: 0;
    font-weight: 400;
    padding: 2px 22px;
    min-width: 242px;
    display: inline-block;
}

.service-box .text {
    color: #24262a;
    line-height: 25px;
}


/*2.6 Educaion*/

.education-area {
    background: #ededed;
    padding: 0 0 28px;
}

.education-area .section-title {}

.education-area .section-title h2 {}

.education-side {
    padding: 19px 0 0;
}

.education-box {
    margin: 0 0 37px;
}

.education-box .head {
    margin: 0 0 5px;
}

.education-box .head .title {
    display: inline-block;
    letter-spacing: 0;
    color: #7e7e7e;
    font-size: 18px;
    line-height: 22px;
    font-weight: 400;
    border: 2px solid #fff;
    padding: 2px 23px;
    min-width: 242px;
}

.education-box .head .time {
    background: #008181;
    display: inline-block;
    position: relative;
    color: #fff;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0;
    padding: 1px 4px;
    margin-left: 16px;
}

.education-box .head .time::before {
    content: "";
    position: absolute;
    top: 6px;
    left: -6px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4.5px 6px 4.5px 0;
    border-color: transparent #008181 transparent transparent;
}

.education-box .content {
    -webkit-box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    padding: 30px 20px 25px 20px;
    background: #fff;
}

.education-box .content .text {
    color: #24262a;
    line-height: 25px;
}


/*2.7 Portfolio*/

.portfolio-area {
    padding: 142px 0 144px;
}

.portfolio-area .section-title {
    margin: 0 0 22px;
}

.portfolio-area .section-title h2 {}

.portfolio {}

.portfolio-menu {
    text-align: center;
    margin: 0 0 60px;
}

.portfolio-menu .button {
  background: transparent none repeat scroll 0 0;
  border: 0 none;
  color: #676767;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 18px;
  margin: 0 33px;
  padding: 11px 30px;
  text-transform: uppercase;
  transition: all 0.3s ease 0s;
}

.portfolio-menu .button:hover,
.portfolio-menu .button:focus,
.portfolio-menu .button.is-checked {
    color: #008181;
    background: #f3f3f3;
    -webkit-box-shadow: 0px 2px 27px -7px rgba(0, 0, 0, 0.30);
    box-shadow: 0px 2px 27px -7px rgba(0, 0, 0, 0.30);
}

.all-portfolio {}

.all-portfolio .grid {
    margin: 0 0 50px;
}

.portfolio-box {
    position: relative;
}

.portfolio-box:hover {
    -webkit-box-shadow: 0px 1px 27px -7px rgba(0, 0, 0, 0.50);
    box-shadow: 0px 1px 27px -7px rgba(0, 0, 0, 0.50);
    display: inline-block;
}

.portfolio-box::before {
    content: "";
    position: absolute;
    border: 10px solid #fff;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
    opacity: 0;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.portfolio-box:hover::before {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

.portfolio-box>img {}

.portfolio-box .content {
    background: rgba(104, 104, 104, 0.9);
    position: absolute;
    bottom: 25px;
    left: 25px;
    right: 25px;
    padding: 17px 36px 46px 14px;
    transition: 0.3s;
    opacity: 0;
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    -o-transform: translateY(-10px);
    transform: translateY(-10px);
}

.portfolio-box:hover .content {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}

.portfolio-box .content .zoom-link {
    padding: 0;
    list-style: none;
    text-align: center;
    margin: 0 0 62px;
}

.portfolio-box .content .zoom-link li {
    display: inline-block;
}

.portfolio-box .content .zoom-link li a {
    display: block;
    height: 36px;
    width: 36px;
    border: 1px solid #fff;
    border-radius: 100px;
    line-height: 36px;
    font-size: 14px;
    color: #fff;
}

.portfolio-box .content .zoom-link li a:hover {
    background: #008181;
    border-color: #008181;
}

.portfolio-box .content .title {
    color: #fff;
    letter-spacing: 0;
    text-decoration: underline;
    text-transform: uppercase;
}

.portfolio-box .content .type {
    color: #fff;
    line-height: 24px;
    text-decoration: underline;
}

.portfolio-box .content .link {
    display: inline-block;
    position: absolute;
    right: 14px;
    bottom: 60px;
    color: #fff;
    font-size: 18px;
    line-height: 22px;
}

.all-portfolio .more {
    text-align: center;
    margin: 17px 0 0;
}

.all-portfolio .more a {
    display: inline-block;
    background: #008181;
    color: #fff;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0;
    font-weight: 700;
    padding: 14px 22px;
    border-radius: 25px;
    -webkit-box-shadow: 0px 1px 27px -7px rgba(0, 0, 0, 0.50);
    box-shadow: 0px 1px 27px -7px rgba(0, 0, 0, 0.50);
}

.all-portfolio .more a span {
    margin-left: 24px;
}


/*2.8 Testimonial and Logos*/

.testimonial-area {
    padding: 0 0 64px;
}

.testimonial {}

.testimonial-box {
    border: 15px solid #f2f2f2;
    padding: 57px 30px 30px 182px;
    position: relative;
}

.testimonial-box::before {
    content: "\f10d";
    position: absolute;
    font-family: fontawesome;
    color: #e5e5e5;
    font-size: 81px;
    top: 50%;
    left: 84px;
}

.testimonial-box .text {
    color: #000000;
    font-size: 22px;
    line-height: 30px;
    letter-spacing: 0;
    margin: 0 0 5px;
    font-family: 'Montserrat', sans-serif;
}

.testimonial-box .name {
    color: #626262;
    text-transform: uppercase;
    letter-spacing: 0;
    margin-left: 27px;
    position: relative;
}

.testimonial-box .name::before {
    content: "";
    position: absolute;
    top: 11px;
    left: -26px;
    background: #7f7f7f;
    width: 15px;
    height: 2px;
}

.testimonial-box .desg {
    margin-left: 27px;
    color: #24262a;
    font-size: 12px;
    line-height: 16px;
}


/*logos*/

.logo-area {
    padding: 0 0 80px;
}

.logos {
  margin: auto;
  width: 90%;
}

.logo-box {
    display: inline-block;
    height: 80px;
    text-align: center;
}

.logo-box img {}

.logo-carousel .owl-dots {
    text-align: center;
}

.logo-carousel .owl-dots .owl-dot {
    background: #cccccc;
    height: 5px;
    width: 5px;
    display: inline-block;
    border-radius: 100px;
    margin: 0 5px;
}

.logo-carousel .owl-dots .owl-dot.active {
    background: #000;
}

.logo-carousel .owl-nav {}

.logo-carousel .owl-nav > div {
  position: absolute;
  top: 10%;
}

.logo-carousel .owl-nav .owl-prev {
  left: -30px;
}

.logo-carousel .owl-nav .owl-next {
  right: -30px;
}


/*2.9 Pricing*/

.pricing-area {
    padding: 51px 0 70px;
}

.pricing-area .section-title {}

.pricing-area .section-title h2 {}

.single-princing {
    text-align: center;
    list-style: none;
}

.single-princing .content {
    -webkit-box-shadow: 0px 2px 20px -4px rgba(135, 132, 135, 1);
    box-shadow: 0px 2px 20px -4px rgba(135, 132, 135, 1);
    background: #fff;
    border-top: 6px solid #1d253f;
    padding: 50px 0px 39px;
    margin: 0 0 17px;
}

.single-princing:hover .content {
    border-color: #008181;
}

.single-princing .content .title {
    color: #1d253f;
    font-size: 30px;
    line-height: 34px;
    font-weight: 300;
    letter-spacing: 0;
    margin: 0 0 24px;
}

.single-princing .content .list {
    padding: 0;
    list-style: none;
    margin: 0 0 24px;
}

.single-princing .content .list li {
    border-bottom: 1px solid #dfe5f7;
    display: block;
    color: #24262a;
    font-size: 16px;
    line-height: 48px;
    letter-spacing: 0;
}

.single-princing .content .list li:last-child {
    border-bottom: none;
}

.single-princing .content .price {
    color: #1d253f;
    font-size: 50px;
    line-height: 54px;
    letter-spacing: 0;
    font-weight: 300;
}

.single-princing .buy {}

.single-princing .buy a {
    display: block;
    background: #008181;
    color: #fff;
    letter-spacing: 0;
    font-size: 16px;
    line-height: 24px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 16px 0;
    -webkit-box-shadow: 0px 2px 20px -4px #008181;
    box-shadow: 0px 2px 20px -4px #008181;
}

.single-princing.active {
    position: relative;
    top: -12px
}

.single-princing.active .content {
    padding: 50px 0px 51px;
}

.single-princing.active .content .title {
    font-weight: 700;
    font-size: 40px;
    line-height: 44px;
    margin: 0 0 24px;
}


/*2.10 Blog*/

.blog-area {
    padding: 80px 0 142px;
}

.blog-area .section-title {}

.blog-area .section-title h2 {}

.single-blog {
    position: relative;
}

.single-blog .sb-left {
  float: left;
  position: relative;
  width: 240px;
}

.single-blog .sb-left a {
    display: block;
}

.single-blog .sb-left a img {}

.single-blog .sb-left .sb1-img-content {
  bottom: 21px;
  left: 29px;
  position: absolute;
}

.single-blog .sb-left .sb1-img-content .button {
  background: #008181 none repeat scroll 0 0;
  border-radius: 100px;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-size: 18px;
  height: 35px;
  letter-spacing: -5px;
  line-height: 24px;
  padding: 0 5px 0 0;
  text-align: center;
  width: 35px;
}

.single-blog .sb-left .sb1-img-content .list {
  background: rgba(0, 0, 0, 0.7) none repeat scroll 0 0;
  border-radius: 5px;
  display: inline-block;
  list-style: outside none none;
  opacity: 0;
  padding: 0;
  position: relative;
  text-align: center;
  transition: all 0.3s ease 0s;
  visibility: hidden;
}

.single-blog .sb-left .sb1-img-content .list::before {
  border-color: transparent rgba(0, 0, 0, 0.7) transparent transparent;
  border-style: solid;
  border-width: 5px 8px 5px 0;
  content: "";
  height: 0;
  left: -8px;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 0;
}

.single-blog .sb-left .sb1-img-content:hover .list {
  opacity: 1;
  visibility: visible;
}

.single-blog .sb-left .sb1-img-content .list li {
  border-right: 1px solid #69696a;
  display: inline-block;
  min-width: 36px;
  padding: 4px 7px 3px 0;
}

.single-blog .sb-left .sb1-img-content .list li a {
  color: #fff;
  display: block;
  font-size: 12px;
  letter-spacing: 0;
  line-height: 24px;
}

.single-blog .sb-left .sb1-img-content .list li a span {
  margin-left: 3px;
}

.single-blog .sb-right {
    overflow: hidden;
    -webkit-box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    min-height: 213px;
    padding: 34px 20px 0 30px;
}

.single-blog .sb-right .date {
    display: block;
    letter-spacing: 0;
    color: #008181;
    font-size: 13px;
    line-height: 17px;
    margin: 0 0 2px;
}

.single-blog .sb-right .title {
    font-size: 18px;
    line-height: 22px;
    letter-spacing: 0;
    font-weight: 400;
    color: #323232;
    margin: 0 0 16px;
}

.single-blog .sb-right .text {
    color: #313131;
    line-height: 24px;
    font-weight: 300;
    margin: 0 0 13px;
}

.single-blog .sb-right .more {
    display: inline-block;
    letter-spacing: 0;
    color: #008181;
    font-weight: 700;
}

.single-blog .sb-right .more span {
    margin-left: 14px;
}


/*2.11 Footer*/

footer {
    background: #f7f7f7;
    border-top: 3px solid #008181;
    text-align: center;
}

.footer-top {
    padding: 76px 0 30px;
    position: relative;
}

.footer-top .go-top {
    position: absolute;
    right: 0;
    top: -35px;
    background: #008181;
    height: 70px;
    width: 70px;
    border-radius: 100px;
}

.footer-top .go-top a {
    display: block;
    font-size: 30px;
    color: #fff;
    line-height: 70px;
    border-radius: 100px;
    -webkit-box-shadow: 0px 2px 20px -4px rgba(135, 132, 135, 1);
    box-shadow: 0px 2px 20px -4px rgba(135, 132, 135, 1);
}

.footer-top .intro {
    color: #474747;
    font-size: 16px;
    line-height: 24px;
    margin: 0 0 12px;
}

.footer-top .title {
    color: #24262a;
    font-size: 32px;
    line-height: 36px;
    letter-spacing: 0;
    font-weight: 500;
    margin: 0 0 46px;
}

.footer-top .get-quote {}

.footer-top .get-quote a {
    display: inline-block;
    background: #008181;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0;
    padding: 12px 24px;
    border-radius: 25px;
    color: #fff;
}

.footer-top .get-quote a span {
    margin-right: 10px;
}

.footer-bottom {
    padding: 40px 0 64px;
}

.footer-bottom .copyright {
    color: #24262a;
    line-height: 24px;
    margin: 0 0 16px;
}

.footer-bottom .social {
    list-style: none;
    padding: 0;
}

.footer-bottom .social li {
    display: inline-block;
    margin-right: 13px;
}

.footer-bottom .social li a {
    border: 1px solid #008181;
    display: block;
    background: #008181;
    font-size: 15px;
    color: #fff;
    height: 35px;
    width: 35px;
    line-height: 35px;
    border-radius: 100px;
    text-align: center;
}

.footer-bottom .social li a:hover {
    background: #fff;
    color: #008181;
}


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


/*  3. Home Two
/*----------------------------------------*/

.home2-hero-area {
    background-color: #15161b;
    background-image: url(../img/home2/hero-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 40px -50%;
    padding: 558px 0 194px;
}

.home2-hero {}

.home2-hero .intro {
    border-bottom: 1px solid #fff;
    color: #fff;
    font-size: 36px;
    line-height: 40px;
    letter-spacing: 0;
    font-weight: 300;
    margin: 0 0 32px;
}

.home2-hero .name {
    color: #fff;
    font-size: 72px;
    line-height: 76px;
    letter-spacing: 0;
    font-weight: 300;
    margin: 0 0 4px;
}

.home2-hero .desg {
    color: #c0c0c0;
    font-size: 18px;
    line-height: 22px;
}


/*home2-menu*/

.home2-menu-area {
    position: relative;
    top: -34px;
    z-index: 9;
    padding: 0 0 70px;
}

.home2-menu {
    background: #fff;
    text-align: center;
    -webkit-box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    margin: 0 60px;
}

.home2-menu ul {
    list-style: none;
    padding: 0;
}

.home2-menu ul li {
    display: inline-block;
}

.home2-menu ul li a {
    color: #24262a;
    font-size: 18px;
    letter-spacing: 0;
    line-height: 24px;
    padding: 32px 18px;
    display: block;
}

.home2-menu ul li a:hover, .home2-menu ul li.active a {
    color: #008181;
}


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


/*  4. Home Three
/*----------------------------------------*/

.home3-hero-area {
    overflow: hidden;
    background: #15161b url(../img/home3/hero-bg.jpg);
    background-size: 70%;
    background-repeat: no-repeat;
    background-position: left bottom;
    margin: 0 0 100px;
}

.home3-hero-area header {
    float: right;
}

.home3-hero-area .hero-content {
    float: left;
    width: 74%;
}

.home3-hero-area .hero-content .box {
    width: 100%;
    padding-left: 50%;
    margin-top: 50%;
}

.home3-hero-area .hero-content .box .desg {
    color: #fff;
}


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


/*  5. Blog 1 Column
/*----------------------------------------*/

.blog-hero-area {
    background-image: url(../img/blog1-column/hero-bg.png);
    background-size: 88%;
    background-repeat: no-repeat;
    background-position: right bottom;
    min-height: 200px;
    position: relative;
}

.blog-hero {
    overflow: hidden;
    padding: 44px 0;
}

.blog-hero .title {
    display: inline-block;
    color: #fff;
    font-size: 30px;
    line-height: 34px;
    letter-spacing: 0;
    font-weight: 500;
}

.blog-hero .links {
    float: right;
    padding: 0;
    list-style: none;
}

.blog-hero .links li {
    display: inline-block;
    position: relative;
    padding-right: 20px;
}

.blog-hero .links li:last-child {
    padding-right: 0;
}

.blog-hero .links li:after {
    position: absolute;
    content: "/";
    right: 0;
    top: 0;
    color: #fff;
}

.blog-hero .links li:last-child:after {
    display: none;
}

.blog-hero .links li a {
    display: block;
    color: #fff;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0;
}


/*blog-menu*/

.blog-menu-area {
    position: absolute;
    left: 20px;
    top: 48px;
    z-index: 99;
}

.blog-menu-area .blog-menu-show {
    color: #008181;
    font-size: 30px;
    line-height: 34px;
    cursor: pointer;
}

.blog-menu {
    display: inline-block;
    position: relative;
    top: 130px;
}

.blog-menu ul {
    padding: 0;
    list-style: none;
    background: #f7f7f7;
    margin-left: 30px;
}

.blog-menu ul li {
    display: inline-block;
}

.blog-menu ul li a {
    display: block;
    letter-spacing: 0;
    font-size: 18px;
    line-height: 22px;
    padding: 16px 14px;
}

.blog1-column-area {
    padding: 110px 0 140px;
}

.blog1-column {}

.single-blog1 {
  margin: 0 0 80px;
}

.single-blog1 .sb1-img {
    float: left;
    width: 50%;
    position: relative;
}

.single-blog1 .sb1-img img {}

.single-blog1 .sb1-img .sb1-img-content {
    position: absolute;
    bottom: 21px;
    left: 29px;
}

.single-blog1 .sb1-img .sb1-img-content .button {
  background: #008181 none repeat scroll 0 0;
  border-radius: 100px;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-size: 18px;
  height: 35px;
  letter-spacing: -5px;
  line-height: 24px;
  padding: 0 5px 0 0;
  text-align: center;
  width: 35px;
}

.single-blog1 .sb1-img .sb1-img-content .list {
    display: inline-block;
    padding: 0;
    list-style: none;
    background: rgba(0, 0, 0, 0.7);
    border-radius: 5px;
    text-align: center;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
    position: relative;
}

.single-blog1 .sb1-img .sb1-img-content .list::before {
  border-color: transparent rgba(0, 0, 0, 0.7) transparent transparent;
  border-style: solid;
  border-width: 5px 8px 5px 0;
  content: "";
  height: 0;
  left: -8px;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 0;
}

.single-blog1 .sb1-img .sb1-img-content:hover .list {
    opacity: 1;
    visibility: visible;
}

.single-blog1 .sb1-img .sb1-img-content .list li {
    display: inline-block;
    min-width: 36px;
    border-right: 1px solid #69696a;
    padding: 4px 7px 3px 0;
}

.single-blog1 .sb1-img .sb1-img-content .list li:last-child {
    border-right: none;
}

.single-blog1 .sb1-img .sb1-img-content .list li a {
    display: block;
    color: #fff;
    font-size: 12px;
    letter-spacing: 0;
    line-height: 24px;
}

.single-blog1 .sb1-img .sb1-img-content .list li a span {
    margin-left: 3px;
}

.single-blog1 .sb1-content {
    overflow: hidden;
    -webkit-box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    padding: 74px 0 47px 24px;
}

.single-blog1 .sb1-content .date {
    color: #008181;
    display: block;
    letter-spacing: 0;
    font-size: 14px;
    line-height: 18px;
    margin: 0 0 2px;
}

.single-blog1 .sb1-content .title {
    color: #404040;
    font-size: 24px;
    line-height: 30px;
    letter-spacing: 0;
    font-weight: 400;
    margin: 0 0 26px;
}

.single-blog1 .sb1-content .text {
  color: #5e5e5e;
  line-height: 24px;
  margin: 0 0 20px;
  width: 96%;
}

.single-blog1 .sb1-content .more {
    display: inline-block;
    letter-spacing: 0;
    color: #008181;
    text-transform: uppercase;
}

.single-blog1 .sb1-content .more span {
    margin-left: 8px;
}

.blog-pagination {}

.blog-pagination ul {
    text-align: center;
    list-style: none;
    padding: 0;
}

.blog-pagination ul li {
    display: inline-block;
    margin: 0 7px;
}

.blog-pagination ul li a {
    height: 30px;
    width: 44px;
    letter-spacing: 0;
    color: #707070;
    font-size: 14px;
    line-height: 18px;
    font-weight: 700;
}

.blog-pagination ul li a:hover {
    color: #008181;
}

.blog-pagination ul li.next-prev {}

.blog-pagination ul li.next-prev a {
    position: relative;
}

.blog-pagination ul li.next-prev a .two {
    opacity: 0;
    position: absolute;
    left: 0;
    top: -4px;
}

.blog-pagination ul li.next-prev a:hover .one {
    opacity: 0;
}

.blog-pagination ul li.next-prev a:hover .two {
    opacity: 1;
}


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


/*  6. Blog 2 Column
/*----------------------------------------*/

.blog2-column-area {
    padding: 128px 0 150px;
}

.single-blog2 {
    overflow: hidden;
    margin: 0 0 80px;
}

.single-blog2 .sb1-img {
    float: left;
    width: 50%;
    position: relative;
}

.single-blog2 .sb1-img img {}

.single-blog2 .sb1-img .sb1-img-content {
    position: absolute;
    bottom: 21px;
    left: 29px;
}

.single-blog2 .sb1-img .sb1-img-content .button {
    background: #008181;
    width: 35px;
    height: 35px;
    display: inline-block;
    border-radius: 100px;
    text-align: center;
    font-size: 18px;
    color: #fff;
    line-height: 24px;
    letter-spacing: -2px;
    cursor: pointer;
    display: inline-block;
}

.single-blog2 .sb1-img .sb1-img-content .list {
    display: inline-block;
    padding: 0;
    list-style: none;
    background: rgba(0, 0, 0, 0.7);
    border-radius: 5px;
    text-align: center;
    opacity: 0;
    position: relative;
    visibility: hidden;
    transition: 0.3s;
}

.single-blog2 .sb1-img .sb1-img-content .list::before {
  border-color: transparent rgba(0, 0, 0, 0.7) transparent transparent;
  border-style: solid;
  border-width: 5px 8px 5px 0;
  content: "";
  height: 0;
  left: -8px;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 0;
}

.single-blog2 .sb1-img .sb1-img-content:hover .list {
    opacity: 1;
    visibility: visible;
}

.single-blog2 .sb1-img .sb1-img-content .list li {
    display: inline-block;
    min-width: 36px;
    border-right: 1px solid #69696a;
    padding: 4px 7px 3px 0;
}

.single-blog2 .sb1-img .sb1-img-content .list li:last-child {
    border-right: none;
}

.single-blog2 .sb1-img .sb1-img-content .list li a {
    display: block;
    color: #fff;
    font-size: 12px;
    letter-spacing: 0;
    line-height: 24px;
}

.single-blog2 .sb1-img .sb1-img-content .list li a span {
    margin-left: 3px;
}

.single-blog2 .sb1-content {
    overflow: hidden;
    -webkit-box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    padding: 10px 6px 8px 16px;
}

.single-blog2 .sb1-content .date {
    color: #008181;
    display: block;
    letter-spacing: 0;
    font-size: 13px;
    line-height: 18px;
    margin: 0 0 1px;
}

.single-blog2 .sb1-content .title {
    color: #404040;
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 0;
    font-weight: 400;
    margin: 0 0 15px;
}

.single-blog2 .sb1-content .text {
    color: #5e5e5e;
    line-height: 24px;
    margin: 0 0 13px;
}

.single-blog2 .sb1-content .more {
    display: inline-block;
    letter-spacing: 0;
    color: #008181;
    text-transform: uppercase;
}

.single-blog2 .sb1-content .more span {
    margin-left: 8px;
}

.blog2-column-area .more {
    text-align: center;
    margin: 17px 0 0;
}

.blog2-column-area .more a {
    display: inline-block;
    background: #008181;
    color: #fff;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0;
    font-weight: 700;
    padding: 14px 22px;
    border-radius: 25px;
    -webkit-box-shadow: 0px 1px 27px -7px rgba(0, 0, 0, 0.50);
    box-shadow: 0px 1px 27px -7px rgba(0, 0, 0, 0.50);
}


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


/*  7. Blog column sidebar
/*----------------------------------------*/

.bcs-blog-hero-area {
    background-color: #f7f7f7;
}

.blog-column-sidebar-area {
    background: #f7f7f7;
    padding: 120px 0 130px;
}

.bcsa-left {}

.bcsa-left .single-blog2 {
    background: #fff;
}

.bcsa-left .single-blog2 .sb1-img {}

.bcsa-left .single-blog2 .sb1-content {
    padding: 45px 18px 54px 20px;
}


/*sidebar*/

.sidebar {}

.sidebar-widget {
    -webkit-box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    background: #fff;
    padding: 30px;
    margin: 0 0 30px;
}

.sidebar-widget .sw-title {
    border-bottom: 1px solid #008181;
    margin: 0 0 30px;
}

.sidebar-widget .sw-title span {
    display: inline-block;
    background: #008181;
    color: #fff;
    font-weight: 300;
    letter-spacing: 0;
    padding: 0 12px;
    min-width: 143px;
}

.search-widget {}

.search-widget form {}

.search-widget .sw-input-box {
    position: relative;
}

.search-widget .sw-input-box input[type="text"] {
    border: none;
    border-bottom: 1px solid #e1e1e1;
    color: #313131;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0;
    padding: 0;
    height: 46px;
    width: 100%;
}

.search-widget .sw-input-box button {
    position: absolute;
    right: 0;
    top: 0;
    background: 0;
    border: 0;
    color: #008181;
    font-size: 14px;
    line-height: 40px;
}

.category-widget {}

.category-widget ul {
    list-style: none;
    padding: 0;
}

.category-widget ul li {
    display: block;
    margin: 0 0 25px;
}

.category-widget ul li:last-child {
    margin: 0;
}

.category-widget ul li a {
    display: block;
    color: #313131;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 24px;
}

.category-widget ul li a:hover {
    color: #008181;
}

.category-widget ul li a span {
    float: right;
    background: #f3f3f3;
    display: inline-block;
    color: #909090;
    border-radius: 15px;
    padding: 01px 10px;
}

.category-widget ul li a:hover span {
    background: #008181;
    color: #fff;
    -webkit-box-shadow: 0px 0px 10px -3px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 0px 10px -3px rgba(0, 0, 0, 0.75);
}

.recent-widget {}

.recent-widget ul {
    padding: 0;
    list-style: none;
}

.recent-widget ul li {
    display: block;
    margin: 0 0 30px;
}

.recent-widget ul li:last-child {
    margin: 0;
}

.recent-widget ul li a {
    display: block;
    overflow: hidden;
}

.recent-widget ul li a .img {
    float: left;
    width: 70px;
}

.recent-widget ul li a .img img {}

.recent-widget ul li a .content {
    display: block;
    padding-left: 14px;
    overflow: hidden;
}

.recent-widget ul li a .content .title {
    display: block;
    letter-spacing: 0;
    color: #404040;
    font-size: 14px;
    line-height: 18px;
    margin: 0 0 12px;
}

.recent-widget ul li a .content .title:hover {
    color: #008181;
}

.single-blog1 .sb1-content .title {
  color: #404040;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 24px;
  margin: 0 0 26px;
}

.insta-widget {
    padding-bottom: 0;
}

.insta-widget ul {
    padding: 0;
    list-style: none;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
}

.insta-widget ul li {
    margin: 0 0 30px;
    width: 33%;
}

.insta-widget ul li {
    margin: 0 0 30px;
    width: 33%;
}

.insta-widget ul li a {}

.tags-widget {}

.tags-widget ul {
    padding: 0;
    list-style: none;
}

.tags-widget ul li {
    display: inline-block;
    margin: 0 0 8px;
}

.tags-widget ul li a {
    display: block;
    background: #f7f7f7;
    letter-spacing: 0;
    border-radius: 25px;
    color: #909090;
    font-size: 14px;
    line-height: 24px;
    padding: 1px 15px;
}

.tags-widget ul li a:hover {
    -webkit-box-shadow: 0px 0px 10px -3px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 0px 10px -3px rgba(0, 0, 0, 0.75);
    background: #008181;
    color: #fff;
}


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


/*  8. Blog details
/*----------------------------------------*/

.blog-details-area {
    padding: 160px 0 130px;
}

.blog-details {}

.bd-img {
    margin: 0 0 47px;
    position: relative;
}

.bd-img img {}

.bd-img .sb1-img-content {
    position: absolute;
    bottom: 21px;
    left: 29px;
}

.bd-img .sb1-img-content .button {
    background: #008181;
    width: 35px;
    height: 35px;
    display: inline-block;
    border-radius: 100px;
    text-align: center;
    font-size: 18px;
    color: #fff;
    line-height: 24px;
    letter-spacing: -2px;
    cursor: pointer;
}

.bd-img .sb1-img-content .list {
    display: inline-block;
    padding: 0;
    list-style: none;
    background: rgba(0, 0, 0, 0.7);
    border-radius: 5px;
    text-align: center;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
}

.bd-img .sb1-img-content:hover .list {
    opacity: 1;
    visibility: visible;
}

.bd-img .sb1-img-content .list li {
    display: inline-block;
    min-width: 36px;
    border-right: 1px solid #69696a;
    padding: 4px 7px 3px 0;
}

.bd-img .sb1-img-content .list li:last-child {
    border-right: none;
}

.bd-img .sb1-img-content .list li a {
    display: block;
    color: #fff;
    font-size: 12px;
    letter-spacing: 0;
    line-height: 24px;
}

.bd-img .sb1-img-content .list li a span {
    margin-left: 3px;
}

.blog-details .date {
    display: block;
    letter-spacing: 0;
    color: #008181;
    font-size: 14px;
    line-height: 18px;
    margin: 0 0 3px;
}

.blog-details .title {
    color: #404040;
    letter-spacing: 0;
    font-weight: 404;
    font-size: 24px;
    line-height: 28px;
    margin: 0 0 38px;
}

.blog-details .text {
    color: #3c3c3c;
    line-height: 24px;
    margin: 0 0 39px;
}

.blog-details blockquote {
    border-left: 30px solid #008181;
    color: #6b6b6b;
    font-size: 16px;
    line-height: 30px;
    letter-spacing: 0;
    font-style: italic;
    background: #f7f7f7;
    padding: 23px 20px 23px 27px;
    margin: 0 0 32px;
}

.blog-details blockquote::before {
    color: #f4984d;
    left: -22px;
    font-size: 18px;
    opacity: 1;
}

.blog-details blockquote::after {
    content: "\f10e";
    color: #f4984d;
    position: absolute;
    left: -22px;
    bottom: 0;
    font-family: fontawesome;
}

.blog-details .tags {
    margin: 0 0 86px;
}

.blog-details .tags .icon {
    display: inline-block;
    background: #008181;
    height: 28px;
    width: 28px;
    line-height: 28px;
    color: #fff;
    text-align: center;
    border-radius: 100px;
    font-size: 13px;
    -webkit-box-shadow: 0px 1px 27px -7px rgba(0, 0, 0, 0.50);
    box-shadow: 0px 1px 27px -7px rgba(0, 0, 0, 0.50);
    margin-right: 8px;
}

.blog-details .tags ul {
    padding: 0;
    list-style: none;
    display: inline-block;
}

.blog-details .tags ul li {
    display: inline-block;
}

.blog-details .tags ul li a {
    display: block;
    letter-spacing: 0;
    background: #f7f7f7;
    border-radius: 25px;
    color: #909090;
    font-size: 13px;
    line-height: 24px;
    padding: 2px 17px;
}

.blog-details .tags ul li a:hover {
    background: #008181;
    color: #fff;
    -webkit-box-shadow: 0px 1px 27px -7px rgba(0, 0, 0, 0.50);
    box-shadow: 0px 1px 27px -7px rgba(0, 0, 0, 0.50);
}

.blog-details .post-type-share {
    overflow: hidden;
}

.blog-details .post-type-share .post-type {
    display: inline-block;
}

.blog-details .post-type-share .post-type ul {
    display: inline-block;
    list-style: none;
    padding: 0;
}

.blog-details .post-type-share .post-type ul li {
    display: inline-block;
}

.blog-details .post-type-share .post-type ul li a {
    display: block;
    background: #008181;
    text-transform: uppercase;
    letter-spacing: 0;
    color: #fff;
    padding: 5px 18px;
    font-size: 11px;
    font-weight: 700;
}

.blog-details .post-type-share .share {
    float: right;
    margin: 0 0 27px;
}

.blog-details .post-type-share .share .title {
    color: #333333;
    letter-spacing: 0;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 700;
    line-height: 16px;
}

.blog-details .post-type-share .share ul {
    display: inline-block;
    list-style: none;
    padding: 0;
}

.blog-details .post-type-share .share ul li {
    display: inline-block;
}

.blog-details .post-type-share .share ul li a {
    display: block;
    color: #fff;
    background: #ccc;
    height: 32px;
    width: 32px;
    border-radius: 100px;
    text-align: center;
    line-height: 32px;
}

.blog-details .post-type-share .share ul li.facebook a {
    background: #3b579d;
}

.blog-details .post-type-share .share ul li.twitter a {
    background: #2caae1;
}

.blog-details .post-type-share .share ul li.linkedin a {
    background: #007bb6;
}

.blog-details .post-type-share .share ul li.gplus a {
    background: #dd4b39;
}

.blog-details .next-prev {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-wrap: wrap;
    border-top: 1px solid #767676;
    border-bottom: 1px solid #767676;
    padding: 20px 0;
    margin: 0 0 120px;
}

.blog-details .next-prev div {
    flex: 1;
}

.blog-details .next-prev .prev {}

.blog-details .next-prev .prev a {
    color: #232323;
    line-height: 16px;
    letter-spacing: 0;
    text-transform: uppercase;
}

.blog-details .next-prev .prev a span {
    display: inline-block;
    margin-right: 20px;
}

.blog-details .next-prev .middle {
    text-align: center;
}

.blog-details .next-prev .middle span {
    color: #232323;
}

.blog-details .next-prev .next {
    text-align: right;
}

.blog-details .next-prev .next a {
    color: #232323;
    line-height: 16px;
    letter-spacing: 0;
    text-transform: uppercase;
}

.blog-details .next-prev .next a span {
    display: inline-block;
    margin-left: 20px;
}

.blog-details .about-author {
    -webkit-box-shadow: 0px 1px 5px -2px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 1px 5px -2px rgba(0, 0, 0, 0.75);
    overflow: hidden;
    margin: 0 0 114px;
}

.blog-details .about-author .left {
    background: #008181;
    text-align: center;
    float: left;
    width: 166px;
    padding: 35px 0 18px 0;
}

.blog-details .about-author .left img {
    border-radius: 100px;
}

.blog-details .about-author .left .social {
    list-style: none;
    padding: 0;
    margin: 22px 0 0;
}

.blog-details .about-author .left .social li {
    display: inline-block;
}

.blog-details .about-author .left .social li a {
    display: block;
    color: #fff;
    margin: 0 3px;
}

.blog-details .about-author .right {
    overflow: hidden;
    padding: 31px 26px 0;
}

.blog-details .about-author .right .title {
    font-size: 16px;
    line-height: 20px;
    margin: 0 0 22px;
    font-weight: 700;
}

.blog-details .about-author .right .text {
    margin: 0;
}

.blog-details .comments {
    margin: 0 0 120px;
}

.blog-details .comments .title {}

.blog-details .comments ul {
    list-style: none;
    padding: 0;
}

.blog-details .comments ul li {
    display: block;
}

.blog-details .comments ul li .comment-box {
    margin: 0 0 30px;
}

.blog-details .comments ul li ul {
    margin-left: 108px;
}

.comment-box .img {
    float: left;
    margin-right: 10px;
    width: 72px;
}

.comment-box .img img {}

.comment-box .content {
    overflow: hidden;
    position: relative;
    border: 1px solid #ececec;
    padding: 14px 16px 46px 43px;
}

.comment-box .content .title {
    color: #222222;
    font-size: 14px;
    line-height: 18px;
    margin: 0 0 4px;
}

.comment-box .content .date {
    margin: 0 0 19px;
}

.comment-box .content .text {
    margin: 0;
}

.comment-box .content .reply {
    position: absolute;
    right: 18px;
    top: 10px;
    color: #008181;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 18px;
    text-transform: uppercase;
}

.blog-details .content .reply span {}

.blog-details .leave-comment {
    -webkit-box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    padding: 40px 29px;
    margin: 0 0 50px;
}

.blog-details .leave-comment .title {
    font-size: 14px;
    line-height: 18px;
    margin: 0 0 53px;
    position: relative;
}

.blog-details .leave-comment .title::after {
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    background: #008181;
    height: 1px;
    width: 36%;
}

.blog-details .leave-comment .title span {
    display: inline-block;
    background: #008181;
    color: #fff;
    font-weight: 300;
    letter-spacing: 0;
    padding: 2px 12px;
    min-width: 143px;
}

.blog-details .leave-comment .leave-comment-input-box {
    position: relative;
    margin: 0 0 20px;
}

.blog-details .leave-comment .leave-comment-input-box .icon {
    position: absolute;
    top: 0;
    left: 0;
    color: #008181;
    font-size: 14px;
    z-index: 9;
}

.blog-details .leave-comment .leave-comment-input-box input[type="text"] {
    color: #909090;
    border: none;
    border-bottom: 1px solid #e1e1e1;
    font-size: 14px;
    height: 36px;
    padding: 0 28px;
    letter-spacing: 0;
    width: 100%;
}

.blog-details .leave-comment .leave-comment-input-box input[type="text"]:focus {
    border-color: #008181;
}

.blog-details .leave-comment .leave-comment-input-box textarea {
    color: #909090;
    border: none;
    border-bottom: 1px solid #e1e1e1;
    font-size: 14px;
    height: 100px;
    padding: 0 28px;
    letter-spacing: 0;
    width: 100%;
}

.blog-details .leave-comment .leave-comment-input-box textarea:focus {
    border-color: #008181;
}

.blog-details .leave-comment .submit {
    text-align: right;
}

.blog-details .leave-comment .submit .send {
    background: #008181;
    border: 0;
    color: #fff;
    letter-spacing: 0;
    font-size: 14px;
    line-height: 18px;
    border-radius: 25px;
    padding: 11px 23px;
    -webkit-box-shadow: 0px 0px 10px -3px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 0px 10px -3px rgba(0, 0, 0, 0.75);
}

.blog-details .leave-comment .submit .send span {
    margin-left: 10px;
}


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


/*  9. Contact
/*----------------------------------------*/

.contact-area {
    padding: 154px 0 142px;
}

.contact-area .head {
    text-align: center;
    margin: 0 0 93px;
}

.contact-area .head .title {
    color: #555555;
    font-size: 30px;
    line-height: 34px;
    letter-spacing: 0;
    font-weight: 500;
    margin: 0 0 35px;
}

.contact-area .head .text {
    color: #444444;
    line-height: 24px;
}

.contact-form-area {
    -webkit-box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 1px 15px -5px rgba(0, 0, 0, 0.75);
    padding: 44px 68px 1px 120px;
    margin: 0 0 58px;
}

.contact-form-area .cfa-input-box {
    margin: 0 0 17px;
    width: 80%;
}

.contact-form-area .cfa-input-box.msg {
    width: 91%;
}

.contact-form-area .cfa-input-box label {
    display: block;
    color: #555555;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 20px;
    margin: 0 0 6px;
}

.contact-form-area .cfa-input-box input[type="text"] {
    border: none;
    border-bottom: 2px solid #e1e1e1;
    width: 100%;
    letter-spacing: 0;
    font-size: 12px;
    line-height: 16px;
    height: 40px;
}

.contact-form-area .cfa-input-box textarea {
    border: none;
    border-bottom: 2px solid #e1e1e1;
    width: 100%;
    letter-spacing: 0;
    font-size: 12px;
    line-height: 16px;
    height: 94px;
}

.contact-form-area .cfa-input-box button {
    border: 0;
    background: #008181;
    letter-spacing: 0;
    color: #fff;
    font-size: 16px;
    line-height: 20px;
    padding: 7px 10px;
}

.contact-form-area .cfa-input-box .required {
    color: #464646;
    font-size: 12px;
    letter-spacing: 0;
    line-height: 16px;
    text-transform: capitalize;
}


/*mail*/

.cf-msg {
    padding: 10px;
    text-align: center;
    margin-bottom: 30px;
}

.cf-msg p {
    margin-bottom: 0;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 0;
    color: #fff;
    text-transform: capitalize;
}

.contact-area .foot-info {}

.contact-area .foot-info .list {
    list-style: none;
    padding: 0;
}

.contact-area .foot-info .list li {
    display: block;
    color: #555555;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0;
}

.contact-area .foot-info .list li span {
    display: inline-block;
    font-weight: 700;
}


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


/*  10. Coming
/*----------------------------------------*/

.coming-area {
    background-image: url(../img/coming/bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 33% 0;
    padding: 165px 0 45px;
}

.coming {
    text-align: center;
}

.coming .title {
    color: #fff;
    font-size: 60px;
    line-height: 64px;
    letter-spacing: 0;
    margin: 0 0 24px;
}

.coming .text {
    color: #fff;
    font-size: 24px;
    line-height: 30px;
    margin: 0 0 76px;
}

.coming .timer-area {
    margin: 143px 0 142px;
}

.coming .timer-area .cdown {
    display: inline-block;
    margin: 0 44px;
    min-width: 94px;
}

.coming .timer-area .cdown:first-child {
    margin-left: 0;
}

.coming .timer-area .cdown:last-child {
    margin-right: 0;
}

.coming .timer-area .cdown .time-count {
    display: block;
    color: #fff;
    font-size: 76px;
    line-height: 80px;
    font-weight: 900;
    position: relative;
    padding: 0 0 27px;
    margin: 0 0 26px;
    font-family: 'Montserrat', sans-serif;
}

.coming .timer-area .cdown .time-count::after {
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    background: #008181;
    width: 55px;
    height: 5px;
    right: 0;
    margin: auto;
}

.coming .timer-area .cdown p {
    color: #fff;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 18px;
    line-height: 22px;
}

.coming .subscribe-area {}

.coming .subscribe-area .text {}

.coming .subscribe-area .input-box {
    margin: 0 0 84px;
}

.coming .subscribe-area .input-box input[type="text"] {
    border-radius: 25px 0 0 25px;
    height: 54px;
    border: 2px solid #fff;
    background: #36393f;
    color: #fff;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0;
    padding: 0 18px;
    min-width: 350px;
}

.coming .subscribe-area .input-box input[type="submit"] {
    background: #008181;
    letter-spacing: 0;
    height: 54px;
    border-radius: 0 25px 25px 0;
    margin-left: -14px;
    position: relative;
    border: 2px solid #008181;
    top: -1px;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    min-width: 216px;
}

.coming .subscribe-area .social {
    list-style: none;
    padding: 0;
}

.coming .subscribe-area .social li {
    display: inline-block;
    margin-right: 13px;
}

.coming .subscribe-area .social li a {
    border: 1px solid #008181;
    display: block;
    background: #008181;
    font-size: 18px;
    color: #fff;
    height: 40px;
    width: 40px;
    line-height: 40px;
    border-radius: 100px;
    text-align: center;
}

.coming .subscribe-area .social li a:hover {
    background: #fff;
    color: #008181;
}


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


/*  11. Not Found
/*----------------------------------------*/

.not-found-area {
    background-image: url(../img/not-found/bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 0;
    padding: 151px 0 371px;
}

.not-found {
    text-align: center;
}

.not-found .logo {}

.not-found .logo a {
    color: #fff;
}

.not-found .title {
    color: #fff;
    font-size: 60px;
    line-height: 64px;
    letter-spacing: 0;
    font-weight: 400;
    margin: 173px 0 35px;
}

.not-found .text {
    color: #fff;
    font-size: 26px;
    line-height: 30px;
    margin: 0 0 88px;
}

.not-found .input-box {
    position: relative;
    display: inline-block;
}

.not-found .input-box input[type="text"] {
    width: 370px;
    border: 2px solid #d0d1d2;
    border-radius: 40px;
    height: 60px;
    background: transparent;
    color: #fff;
    font-size: 20px;
    letter-spacing: 0;
    padding: 0 20px;
}

.not-found .input-box button {
    position: absolute;
    right: 16px;
    top: 10px;
    cursor: pointer;
    background: transparent;
    border: 0;
    color: #fff;
    font-size: 26px;
}


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


/*  12. Error
/*----------------------------------------*/

.error-area {
    padding: 272px 0 355px;
}

.error {}

.error .intro {
    color: #16171c;
    font-size: 36px;
    line-height: 38px;
    letter-spacing: 0;
    font-weight: 900;
    position: relative;
    margin: 0 0 35px;
}

.error .intro::after {
    position: absolute;
    content: "";
    background: #008181;
    width: 158px;
    height: 3px;
    bottom: 0;
    left: 0;
}

.error .title {
    color: #222222;
    font-size: 100px;
    line-height: 90px;
    letter-spacing: 0;
    margin: 0 0 29px;
}

.error .text {
    color: #696969;
    font-size: 16px;
    line-height: 30px;
}

.error .text a {
  color: #008181;
  display: inline-block;
  font-size: 16px;
  line-height: 30px;
}
/*
* ----------------------------------------------------------------------------------------
Author       : DuezaThemes
Author URL   : https://themeforest.net/user/duezathemes
Template Name: Mister Perfect - Minimal CV/Resume/vCard Template
Version      : 1.0                                          
* ----------------------------------------------------------------------------------------
*/


/* Medium Layout: 1367px. */

@media only screen and (min-width: 1200px) and (max-width: 1367px) {
    /*home1*/
    .hero-content .box {
        margin-top: 50%;
    }
    /*home2*/
    .home2-hero-area {
        padding: 358px 0 194px;
    }
    /*home3*/
    .home3-hero-area .hero-content {
        float: left;
        width: 68%;
    }
    .home3-hero-area {
        background-size: 70%;
    }
    .home3-hero-area .hero-content .box {
        margin-top: 64%;
    }
    /*blog1-column*/
    .blog-hero-area {
        background-size: 95%;
        background-position: right top
    }
    /*error*/
    .error-area {
        padding: 200px 0 155px;
    }
}




/* Medium Layout: 1280px. */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    /*home1*/
    .hero-area {
        background-position: 10% 0px;
    }
    /*sticky*/
    .sticky-menu ul li a {
        padding: 10px 10px;
    }
    /*home2*/
    .home2-hero-area {
        padding: 200px 0;
    }
    .home2-menu ul li a {
        padding: 32px 4px;
    }
    /*home3*/
    .home3-hero-area .hero-content {
        width: 60%;
    }
    .home3-hero-area {
        background-position: bottom left;
    }
    /*blog1-column*/
    .blog-hero-area {
        background-size: 94%;
        background-position: top right;
    }
    .blog-menu ul li a {
        padding: 16px 6px;
    }
    .single-blog1 .sb1-content {
        padding: 0 14px 0 16px;
    }
    .blog-hero .title {
        margin-left: 40px;
    }
    /*blog2-column*/
    .single-blog2 .sb1-content .title {
        font-size: 16px;
        line-height: 22px;
        margin: 0 0 8px;
    }
    .single-blog2 .sb1-content .text {
        margin: 0 0 0;
    }
    .single-blog2 .sb1-content .more {
        margin: 3px 0 0;
    }
    /*coming*/
    .coming .timer-area .cdown .time-count {
        font-size: 46px;
        line-height: 50px;
    }
    .coming .timer-area .cdown {
        margin: 0 18px;
    }
    /*not-found*/
    .not-found-area {
        background-position: 64% 0;
    }
    /*error*/
    .error .title {
        font-size: 70px;
        line-height: 70px;
    }
}




/* Tablet Layout: 768px. */

@media only screen and (min-width: 768px) and (max-width: 991px) {
    /*home1*/
    .sticky-menu ul li a {
        font-size: 14px;
        padding: 8px 4px;
    }
    .hero-area {
        background-position: 30% 0px;
    }
    header {
        background: #fff;
        float: left;
        padding: 40px 30px 30px 30px;
        width: 280px;
    }
    .hero-content .box .intro {
        font-size: 26PX;
        line-height: 30px;
    }
    .hero-content .box .name {
        font-size: 42px;
        line-height: 46px;
    }
    .as-intro .as-intro-name .name {
        font-size: 18px;
        line-height: 22px;
    }
    .as-intro .as-intro-info .as-intro-info-box .title {
        font-size: 12px;
        line-height: 28px;
    }
    .as-intro .as-intro-info .as-intro-info-box .text {
        font-size: 12px;
        line-height: 30px;
    }
    .as-content {
        padding: 30px 20px 20px 0;
    }
    .as-content .text {
        margin: 0 0 43px;
    }
    .as-content .download-contact {
        margin: 0 0 20px;
    }
    .as-intro .available .button {
        font-size: 14px;
        padding: 12px 6px;
    }
    .skills-box .skills-progress .progressbar-title {
        margin: 0 0 26px;
    }
    .portfolio-menu .button {
        padding: 11px 16px;
        margin: 0 8px;
    }
    .single-blog {
        margin: 0 0 30px;
    }
    /*home2*/
    .home2-hero .intro {
        font-size: 22px;
        line-height: 26px;
        width: 60%;
    }
    .home2-hero .name {
        font-size: 32px;
        line-height: 36px;
    }
    .home2-hero .desg {
        font-size: 16px;
        line-height: 20px;
    }
    .home2-hero-area {
        padding: 100px 0;
    }
    .home2-menu-area {
        top: 0;
    }
    .home2-menu {
        margin: 16px 15px auto;
    }
    .home2-menu.mean-container .mean-bar {
        background: #000;
    }
    /*home3*/
    .home3-hero-area .hero-content {
        width: 66%;
    }
    .home3-hero-area {
        background-position: left bottom;
    }
    .home3-hero-area .hero-content .box {
        margin-top: 100%;
    }
    /*blog1-column*/
    .blog-hero-area {
        background-position: top;
        background-size: 100%;
    }
    .single-blog1 .sb1-content {
        -webkit-box-shadow: none;
        box-shadow: none;
        padding: 20px 12px 12px 20px;
    }
    /*blog2-column*/
    .single-blog2 .sb1-img {
        width: 100%;
    }
    /*blog-detials*/
    .blog-details .post-type-share .share {
        float: none;
        margin: 30px 0 27px;
    }
    .blog-details .comments ul li ul {
        margin-left: 40px;
    }
    /*coming*/
    .coming .timer-area .cdown .time-count {
        font-size: 46px;
        line-height: 50px;
    }
    .coming .timer-area .cdown {
        margin: 0 18px;
    }
    /*not-found*/
    .not-found-area {
        background-position: 66% 0;
    }
    /*error*/
    .error-area {
        padding: 200px 0 155px;
    }
    .error .title {
        font-size: 70px;
        line-height: 70px;
    }
}




/* Mobile Layout: 320px. */

@media only screen and (max-width: 767px) {}




/* Wide Mobile Layout: 480px. */

@media only screen and (min-width: 481px) and (max-width: 767px) {

    header {
        float: none;
        padding: 40px 30px 40px 20px;
        width: auto;
    }
    .sticky-menu-area.navbar-fixed-top {
        display: none;
    }
    .hero-area {
        background-position: 57% 687px;
    }
    .hero-content .box {
        margin-top: 30%;
        padding-left: 30px;
        width: 100%;
        padding-bottom: 40px;
        padding-right: 20px;
    }
    .hero-content .box .intro {
        font-size: 18PX;
        line-height: 22px;
    }
    .hero-content .box .intro:before {
        width: 90%;
    }
    .hero-content .box .name {
        font-size: 26px;
        line-height: 30px;
        margin: 0 0 20px;
    }
    .as-intro .as-intro-name {
        margin: 0 0 54px 126px;
    }
    .as-intro .as-intro-name .name {
        font-size: 20px;
        line-height: 24px;
    }
    .as-intro .as-intro-info {
        padding: 0 16px 0 16px;
    }
    .as-intro .available .button {
        font-size: 12px;
        padding: 12px 6px;
    }
    .as-intro .as-intro-img>img {
        width: 100%;
    }
    .as-content {
        padding: 36px 10px 20px 30px;
    }
    .as-content .social li {
        margin-right: 0px;
        margin-bottom: 8px;
    }
    .section-title h2 {
        min-width: 200px;
    }
    .skills-box .skills-progress .progressbar-title {
        margin: 0 0 24px;
    }
    .skills-box {
        margin: 28px 0 20px;
    }
    .service-box .title span {
        font-size: 16px;
        min-width: 200px;
    }
    .testimonial-box {
        padding: 20px;
    }
    .testimonial-box:before {
        display: none;
    }
    .single-princing {
        margin: auto auto 30px;
        width: 420px;
    }
    .single-blog {
        margin: 0 0 30px;
    }
    .footer-bottom .social li {
        margin-right: 2px;
    }
    .portfolio-box {
        width: 370px;
        margin: auto;
    }
    /*home2*/
    .home2-hero .intro {
        font-size: 22px;
        line-height: 26px;
        width: 60%;
    }
    .home2-hero .name {
        font-size: 32px;
        line-height: 36px;
    }
    .home2-hero .desg {
        font-size: 16px;
        line-height: 20px;
    }
    .home2-hero-area {
        padding: 100px 0;
    }
    .home2-menu-area {
        top: 0;
    }
    .home2-menu {
        margin: 16px 15px auto;
    }
    .home2-menu.mean-container .mean-bar {
        background: #000;
    }
    /*home3*/
    .home3-hero-area .hero-content {
        width: 100%;
        float: none;
    }
    .home3-hero-area .hero-content .box {
        width: 100%;
        padding-left: 40px;
        margin-top: 20%;
    }
    .home3-hero-area header {
        float: none;
    }
    /*blog1-column*/
    .blog-hero-area {
        background-size: cover;
        background-position: -65px -2px;
    }
    .single-blog1 .sb1-img {
        width: 100%;
    }
    .single-blog1 .sb1-content {
        padding: 30px 12px;
    }
    /*blog2-column*/
    .single-blog2 .sb1-img {
        width: 100%;
    }
    .single-blog2 .sb1-img img {
        width: 100%;
    }
    /*blog-column-sidebar*/
    .sidebar {
        margin: 60px auto auto;
        width: 360px;
    }
    /*blog-details*/
    .blog-details .title {
        font-size: 18px;
        line-height: 24px;
    }
    .blog-details .post-type-share .post-type {
        margin: 0 0 30px;
    }
    .blog-details .about-author .right {
        padding: 10px 20px 0px;
    }
    .comment-box .img {
        float: none;
    }
    .comment-box .content {
        display: block;
        padding: 14px 16px 30px 14px;
    }
    .blog-details .comments ul li ul {
        margin-left: 30px;
    }
    /*contact*/
    .contact-form-area {
        padding: 30px 30px 1px 30px;
    }
    .contact-form-area .cfa-input-box {
        width: 100%;
    }
    .contact-area .foot-info .list {
        margin: 0 0 30px;
    }
    /*coming*/
    .coming .title {
        font-size: 24px;
        line-height: 28px;
    }
    .coming .text {
        font-size: 20px;
        line-height: 24px;
    }
    .coming .timer-area .cdown .time-count {
        font-size: 36px;
        line-height: 40px;
    }
    .coming .timer-area .cdown {
        margin: 0 0 30px;
        min-width: 94px;
    }
    .coming .subscribe-area .input-box input[type="text"] {
        min-width: 150px;
    }
    .coming .subscribe-area .input-box input[type="submit"] {
        min-width: 130px;
    }
    /*not-found*/
    .not-found .input-box input[type="text"] {
        width: 100%;
    }
    .not-found .title {
        font-size: 34px;
        line-height: 38px;
    }
    /*error*/
    .error-area {
        padding: 100px 0 155px;
    }
    .error .title {
        font-size: 50px;
        line-height: 50px;
    }
}




/* Small Mobile Layout: 480px. */

@media only screen and (min-width: 240px) and (max-width: 480px) {
    /*home1*/
    header {
        float: none;
        padding: 40px 30px 40px 20px;
        width: auto;
    }
    .sticky-menu-area.navbar-fixed-top {
        display: none;
    }
    .hero-area {
        background-position: 57% 687px;
    }
    .hero-content .box {
        margin-top: 30%;
        padding-left: 30px;
        width: 100%;
        padding-bottom: 40px;
        padding-right: 20px;
    }
    .hero-content .box .intro {
        font-size: 18PX;
        line-height: 22px;
    }
    .hero-content .box .intro:before {
        width: 90%;
    }
    .hero-content .box .name {
        font-size: 26px;
        line-height: 30px;
        margin: 0 0 20px;
    }
    .as-intro .as-intro-name {
        margin: 0 0 54px 126px;
    }
    .as-intro .as-intro-name .name {
        font-size: 20px;
        line-height: 24px;
    }
    .as-intro .as-intro-info {
        padding: 0 16px 0 16px;
    }
    .as-intro .as-intro-info .as-intro-info-box .text {
        font-size: 12px;
        line-height: 30px;
    }
    .as-intro .as-intro-info .as-intro-info-box .title {
        font-size: 12px;
        line-height: 32px;
    }
    .as-intro .available .button {
        font-size: 12px;
        padding: 12px 6px;
    }
    .as-content {
        padding: 36px 10px 20px 30px;
    }
    .as-content .social li {
        margin-right: 0px;
        margin-bottom: 8px;
    }
    .section-title h2 {
        min-width: 200px;
    }
    .skills-box .skills-progress .progressbar-title {
        margin: 0 0 24px;
    }
    .skills-box {
        margin: 28px 0 20px;
    }
    .service-box .title span {
        font-size: 16px;
        min-width: 200px;
    }
    .portfolio-menu .button {
        font-size: 14px;
        padding: 10px 14px;
        margin: 0 5px;
    }
    .testimonial-box {
        padding: 20px;
    }
    .testimonial-box:before {
        display: none;
    }
    .single-princing {
        margin: 0 0 30px;
    }
    .single-blog {
        margin: 0 0 30px;
    }
    .footer-bottom .social li {
        margin-right: 2px;
    }
    .single-blog .sb-left {
        float: none;
        text-align: center;
        width: 100%;
    }
    /*home2*/
    .home2-hero .intro {
        font-size: 22px;
        line-height: 26px;
    }
    .home2-hero .name {
        font-size: 32px;
        line-height: 36px;
    }
    .home2-hero .desg {
        font-size: 16px;
        line-height: 20px;
    }
    .home2-hero-area {
        padding: 100px 0;
    }
    .home2-menu-area {
        top: 0;
    }
    .home2-menu {
        margin: 16px 15px auto;
    }
    .home2-menu.mean-container .mean-bar {
        background: #000;
    }
    /*home3*/
    .home3-hero-area .hero-content {
        width: 100%;
    }
    .home3-hero-area .hero-content .box {
        width: 100%;
        padding-left: 40px;
        margin-top: 20%;
    }
    /*blog1-column*/
    .blog-hero-area {
        background-size: cover;
    }
    .single-blog1 .sb1-img {
        width: 100%;
    }
    .single-blog1 .sb1-content {
        padding: 30px 12px;
    }
    /*blog2-column*/
    .single-blog2 .sb1-img {
        width: 100%;
    }
    /*blog-column-sidebar*/
    .sidebar {
        margin: 60px auto auto;
    }
    /*blog-details*/
    .blog-details .title {
        font-size: 18px;
        line-height: 24px;
    }
    .blog-details .post-type-share .post-type {
        margin: 0 0 30px;
    }
    .blog-details .about-author .left {
        width: 100%;
    }
    .blog-details .about-author .right {
        padding: 31px 26px 20px;
    }
    .comment-box .img {
        float: none;
    }
    .comment-box .content {
        display: block;
        padding: 14px 16px 30px 14px;
    }
    .blog-details .comments ul li ul {
        margin-left: 30px;
    }
    /*contact*/
    .contact-form-area {
        padding: 30px 30px 1px 30px;
    }
    .contact-form-area .cfa-input-box {
        width: 100%;
    }
    .contact-area .foot-info .list {
        margin: 0 0 30px;
    }
    /*coming*/
    .coming .title {
        font-size: 24px;
        line-height: 28px;
    }
    .coming .text {
        font-size: 20px;
        line-height: 24px;
    }
    .coming .timer-area .cdown .time-count {
        font-size: 36px;
        line-height: 40px;
    }
    .coming .timer-area .cdown {
        margin: 0 0 30px;
        min-width: 94px;
        width: 32%;
    }
    .coming .subscribe-area .input-box input[type="text"] {
        border-radius: 25px;
        min-width: 150px;
    }
    .coming .subscribe-area .input-box input[type="submit"] {
        border-radius: 25px;
        margin-left: 0;
        top: 14px;
    }
    /*not-found*/
    .not-found .input-box input[type="text"] {
        width: 100%;
    }
    .not-found .title {
        font-size: 34px;
        line-height: 38px;
    }
    /*error*/
    .error-area {
        padding: 100px 0 155px;
    }
    .error .title {
        font-size: 50px;
        line-height: 50px;
    }
}