.base img {
        width: 100%;
        height: 227px !important;
    }

.telefonda-gizle {
}

.telefonda-goster {
    display: none;
}

@media (max-width: 767px) {


    .telefonda-gizle {
        display: none !important;
    }

    .telefonda-goster {
        display: inline;
    }
    .base img {
        width: 100%;
        height: 330px !important;
    }
}

   

    .fill img {
        object-fit: fill;
    }

    .contain img {
        object-fit: contain;
    }

    .cover img {
        object-fit: cover;
    }

    .scale-down img {
        object-fit: scale-down;
    }

    .none img {
        object-fit: none;
    }



    @font-face {
        font-family: 'DINPro-CondensedRegular';
        src: url("../../fonts/DINPro-CondensedRegular.eot");
        src: url("../../fonts/DINPro-CondensedRegular.eot?#iefix") format("embedded-opentype"), url("../../fonts/DINPro-CondensedRegular.woff") format("woff"), url("../../fonts/DINPro-CondensedRegular.woff2") format("woff2"), url("../../fonts/DINPro-CondensedRegular.otf") format("otf"), url("../../fonts/DINPro-CondensedRegular.svg") format("svg"), url("../../fonts/DINPro-CondensedRegular.ttf") format("truetype");
        font-weight: normal;
        font-style: normal;
    }

    /*bu hareketli baslk css i*/
    #Skill-PHP {
        animation: Animate-PHP 4s;
        -webkit-animation: Animate-PHP 4s;
        -moz-animation: Animate-PHP 4s;
        -o-animation: Animate-PHP 4s;
        width: 20%;
        height: 2px;
        background-color: #ecb045;
    }

    @keyframes Animate-PHP {
        from {
            width: 10px;
        }

        to {
            width: 20%
        }
    }

    @-webkit-keyframes Animate-PHP {
        from {
            width: 10px;
        }

        to {
            width: 20%
        }
    }

    @-moz-keyframes Animate-PHP {
        from {
            width: 10px;
        }

        to {
            width: 20%
        }
    }

    @-o-keyframes Animate-PHP {
        from {
            width: 10px;
        }

        to {
            width: 20%
        }
    }

    /*//bu hareketli baslk css i*/

    @media (min-width: 767px) {

        .bgresim {
            background: url(../../assets/images/footer.jpg) center bottom no-repeat;
            padding-top: 15px;
            margin-top: 15px;
        }

        .edit {
            text-align: right;
        }

        .slider-content h2 {
            font-size: 50px;
            line-height: 30px;
            margin-bottom: 15px;
        }
    }




    @media (max-width: 767px) {

        .bgresim {
            background: #595959;
            padding-top: 15px;
            margin-top: 15px;
        }
    }





    .bas-cizgi {
        width: 45px;
        height: 3px;
        background: #595959;
        position: relative;
        float: left;
        top: 10px;
        margin-right: 5px;
    }

    .box1 img, .box1:after, .box1:before {
        width: 100%;
        transition: all .3s ease 0s
    }

    .box1 .icon, .box2, .box3, .box4, .box5 .icon li a {
        text-align: center
    }

        .box10:after, .box10:before, .box1:after, .box1:before, .box2 .inner-content:after, .box3:after, .box3:before, .box4:before, .box5:after, .box5:before, .box6:after, .box7:after, .box7:before {
            content: ""
        }

    .box1, .box11, .box12, .box13, .box14, .box16, .box17, .box18, .box2, .box20, .box21, .box3, .box4, .box5, .box5 .icon li a, .box6, .box7, .box8 {
        overflow: hidden
    }

        .box1 .title, .box10 .title, .box4 .title, .box7 .title {
            letter-spacing: 1px
        }

        .box3 .post, .box4 .post, .box5 .post, .box7 .post {
            font-style: italic
        }

    body {
    }

    .mt-30 {
        margin-top: 30px
    }

    .mt-40 {
        margin-top: 40px
    }

    .mb-30 {
        margin-bottom: 30px
    }

    .box1 .icon, .box1 .title {
        margin: 0;
        position: absolute
    }

    .box1 {
        box-shadow: 0 0 3px rgba(0,0,0,.3);
        position: relative
    }

        .box1:after, .box1:before {
            height: 50%;
            background: rgba(0,0,0,.5);
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
            transform-origin: 100% 0;
            transform: rotateZ(90deg)
        }

        .box1:after {
            top: auto;
            bottom: 0;
            transform-origin: 0 100%
        }

        .box1:hover:after, .box1:hover:before {
            transform: rotateZ(0)
        }

        .box1 img {
            height: auto;
            transform: scale(1) rotate(0)
        }

        .box1:hover img {
            filter: sepia(80%);
            transform: scale(1.3) rotate(10deg)
        }

        .box1 .title {
            font-size: 19px;
            font-weight: 600;
            color: #fff;
            text-transform: uppercase;
            text-shadow: 0 0 1px #004cbf;
            bottom: 10px;
            left: 10px;
            opacity: 0;
            z-index: 2;
            transform: scale(0);
            transition: all .5s ease .2s
        }

        .box1:hover .title {
            opacity: 1;
            transform: scale(1)
        }

        .box1 .icon {
            padding: 7px 5px;
            list-style: none;
            background: #004cbf;
            border-radius: 0 0 0 10px;
            top: -100%;
            right: 0;
            z-index: 2;
            transition: all .3s ease .2s
        }

        .box1:hover .icon {
            top: 0
        }

        .box1 .icon li {
            display: block;
            margin: 10px 0
        }

            .box1 .icon li a {
                display: block;
                width: 35px;
                height: 35px;
                line-height: 35px;
                border-radius: 10px;
                font-size: 18px;
                color: #fff;
                transition: all .3s ease 0s
            }

    .box2 .icon li a, .box3 .icon a:hover, .box4 .icon li a:hover, .box5 .icon li a, .box6 .icon li a {
        border-radius: 50%
    }

    .box1 .icon li a:hover {
        color: #fff;
        box-shadow: 0 0 10px #595959 inset,0 0 0 3px #fff
    }

    @media only screen and (max-width:990px) {
        .box1 {
            margin-bottom: 30px
        }
    }
    /*********************** Demo - 2 *******************/
    .box2 {
        position: relative
    }

        .box2 img {
            width: 100%;
            height: auto
        }

        .box2 .box-content {
            width: 100%;
            height: 100%;
            position: absolute;
            top: 50%;
            left: 50%;
            z-index: 2;
            transform: translate(-50%,-50%)
        }

            .box2 .box-content:after, .box2 .box-content:before, .box2:after, .box2:before {
                content: "";
                width: 80%;
                height: 80%;
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%,-50%) rotate(45deg);
                transition: all .5s ease 0s
            }

        .box2:before {
            background: linear-gradient(45deg,rgba(0,0,0,.2) 49%,transparent 50%);
            left: -100%
        }

        .box2:after {
            background: linear-gradient(45deg,transparent 49%,rgba(0,0,0,.2) 50%);
            left: 160%
        }

        .box2 .box-content:after, .box2 .box-content:before {
            width: 65%;
            height: 65%;
            background: linear-gradient(45deg,rgba(0,0,0,.3) 49%,transparent 50%);
            left: -100%;
            transition-delay: .1s
        }

    .box1 .box-content:after {
        background: linear-gradient(45deg,transparent 49%,rgba(0,0,0,.3) 50%);
        left: 160%
    }

    .box2:hover .box-content:after, .box2:hover .box-content:before, .box2:hover:after, .box2:hover:before {
        left: 50%
    }

    .box2 .inner-content {
        width: 50%;
        height: 50%;
        color: #fff;
        padding: 40px 0;
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 2;
        transform: translate(-50%,-50%) scale(0);
        transition: all .3s ease .2s
    }

        .box2 .inner-content:after {
            width: 100%;
            height: 100%;
            background: rgba(255,79,79,.8);
            position: absolute;
            top: 50%;
            left: 50%;
            z-index: -1;
            transform: translate(-50%,-50%) rotate(45deg)
        }

    .box2:hover .inner-content {
        transform: translate(-50%,-50%) scale(1);
        transition: all .3s ease 0s
    }

    .box2 .title {
        font-size: 18px;
        font-weight: 700;
        text-transform: uppercase;
        margin-bottom: 5px
    }

    .box2 .post {
        display: block;
        font-size: 14px;
        text-transform: capitalize;
        margin-bottom: 7px
    }

    .box10 .title, .box11 .title, .box4 .title, .box5 .title, .box6 .box-content, .box7 .title {
        text-transform: uppercase
    }

    .box2 .icon {
        padding: 0;
        margin: 0;
        list-style: none;
        transform: rotateY(360deg) scale(0);
        transition: all .3s ease 0s
    }

    .box2:hover .icon {
        transform: rotateY(0) scale(1)
    }

    .box2 .icon li {
        display: inline-block;
        margin: 0 3px
    }

        .box2 .icon li a {
            display: block;
            width: 35px;
            height: 35px;
            line-height: 35px;
            background: #fff;
            font-size: 16px;
            color: #505050;
            transition: all .3s ease 0s
        }

            .box2 .icon li a:hover {
                box-shadow: 0 0 0 5px rgba(0,0,0,.5);
                background: #fff;
                color: #ff4f4f
            }

    @media only screen and (max-width:990px) {
        .box2 {
            margin-bottom: 30px
        }
    }

    @media only screen and (max-width:320px) {
        .box2 .inner-content {
            padding: 25px 0
        }

        .box2 .title {
            font-size: 16px
        }
    }
    /*********************** Demo - 3 *******************/
    .box3 {
        box-shadow: 0 0 3px rgba(0,0,0,.3);
        position: relative
    }

        .box3 .box-content, .box3:after, .box3:before {
            position: absolute;
            left: 7%;
            right: 7%;
            transition: all .3s
        }

        .box3:after, .box3:before {
            display: block;
            background: rgba(0,0,0,.3);
            top: 10%;
            bottom: 10%;
            z-index: 1;
            transform: scale(0,1)
        }

        .box3:after {
            top: 10.8%;
            bottom: 10.8%;
            transform: scale(1,0)
        }

        .box3:hover:after, .box3:hover:before {
            transform: scale(1);
            animation: animate 1.5s
        }

        .box3:hover:before {
            border-top: 3px solid #fff;
            border-bottom: 3px solid #fff
        }

    .box:hover:after {
        border-left: 3px solid #fff;
        border-right: 3px solid #fff
    }

    .box img {
        width: 100%;
        height: auto;
        transition: all .3s
    }

    .box3:hover img {
        transform: scale(1.2);
        filter: blur(5px);
        -moz-filter: blur(5px);
        -webkit-filter: blur(5px)
    }

    .box3 .box-content {
        padding: 30px 10px;
        top: 10%;
        bottom: 10%;
        opacity: 0;
        z-index: 2
    }

    .box3:hover .box-content {
        box-shadow: 0 0 0 35px rgba(255,255,255,.3);
        opacity: 1;
        transition: all .3s
    }

    .box3 .title {
        font-size: 24px;
        font-weight: 600;
        color: #88c425;
        margin: 0 0 5px
    }

    .box3 .post {
        display: block;
        margin: 0 0 5px;
        font-size: 14px;
        color: rgba(255,255,255,.8)
    }

    .box3 .description {
        font-size: 14px;
        color: #fff;
        margin: 0 0 20px
    }

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

        .box3 .icon li {
            display: inline-block;
            margin: 0 10px 0 0
        }

            .box3 .icon li a {
                display: block;
                width: 30px;
                height: 30px;
                line-height: 30px;
                color: #fff;
                background: #88c425;
                transition: all .5s
            }

        .box3 .icon a:hover {
            text-decoration: none;
            animation: animate-hover .5s;
            transition: all .3s
        }

    @keyframes animate {
        0%,100% {
            opacity: 1
        }
    }

    @keyframes animate-hover {
        0% {
            box-shadow: 0 0 0 10px rgba(255,255,255,.3)
        }

        50% {
            box-shadow: 0 0 0 5px rgba(255,255,255,.3)
        }

        100% {
            box-shadow: 0 0 0 0 rgba(255,255,255,.3)
        }
    }

    .box10, .box11, .box12, .box14, .box4, .box5, .box6, .box7, .box9 {
        box-shadow: 0 0 3px rgba(0,0,0,.3)
    }

    @media only screen and (max-width:990px) {
        .box3 {
            margin-bottom: 30px
        }

            .box3 .box-content {
                padding: 10px
            }

            .box3 .description {
                margin-bottom: 10px
            }
    }

    @media only screen and (max-width:479px) {
        .box3 .title {
            margin: 0
        }
    }

    /*********************** Demo - 4 *******************/
    .box4 {
        position: relative
    }

        .box4:before {
            width: 0;
            height: 200%;
            background: rgba(0,0,0,.5);
            position: absolute;
            top: 0;
            left: -250px;
            bottom: 0;
            transform: skewX(-36deg);
            transition: all .5s ease 0s
        }

        .box4:hover:before {
            width: 200%
        }

        .box4 img {
            width: 100%;
            height: auto
        }

        .box4 .box-content {
            width: 100%;
            height: 100%;
            padding-top: 20%;
            position: absolute;
            top: 0;
            left: 0;
            transform: scale(0);
            transition: all .3s ease 0s
        }

        .box4 .icon, .box5 .icon {
            list-style: none;
            padding: 0
        }

        .box4:hover .box-content {
            transform: scale(1)
        }

        .box4 .title {
            font-size: 22px;
            font-weight: 700;
            color: #fff;
            margin: 0 0 10px
        }

        .box4 .post {
            display: block;
            font-size: 15px;
            font-weight: 600;
            color: #fff;
            margin-bottom: 20px
        }

        .box4 .icon {
            margin: 0
        }

            .box4 .icon li {
                display: inline-block
            }

                .box4 .icon li a {
                    display: block;
                    width: 35px;
                    height: 35px;
                    line-height: 35px;
                    font-size: 20px;
                    background: #fff;
                    color: #ee4266;
                    margin-right: 10px;
                    transition: all .3s ease 0s
                }

    .box5 .icon, .box5 .icon li {
        display: inline-block
    }

    @media only screen and (max-width:990px) {
        .box4 {
            margin-bottom: 30px
        }
    }

    @media only screen and (max-width:767px) {
        .box4:before {
            left: -400px
        }

        .box4:hover:before {
            width: 300%
        }
    }

    /*********************** Demo - 5 *******************/
    .box5 {
        background: #444;
        position: relative
    }

        .box5:after, .box5:before {
            width: 50px;
            height: 50px;
            border-radius: 50%;
            background: #10a5b8;
            position: absolute;
            top: -80px;
            left: 15px;
            opacity: 0;
            z-index: 1;
            transition: all .35s ease
        }

        .box5:after {
            top: auto;
            left: auto;
            bottom: -80px;
            right: 15px
        }

        .box5:hover:after, .box5:hover:before {
            opacity: .75;
            transform: scale(8);
            transition-delay: .15s
        }

        .box5 img {
            width: 100%;
            height: auto;
            transition: all .35s ease-out 0s
        }

        .box5:hover img {
            opacity: .4
        }

        .box5 .icon {
            margin: 0;
            position: absolute;
            bottom: 15px;
            right: 15px;
            z-index: 2;
            transform: scale(0);
            transition: all .35s ease-out
        }

        .box5:hover .icon {
            transform: scale(1);
            transition-delay: .15s
        }

        .box5 .icon li a {
            display: block;
            width: 35px;
            height: 35px;
            line-height: 35px;
            background: #fff;
            font-size: 18px;
            color: #444;
            margin-right: 10px;
            position: relative;
            transition: all .5s ease 0s
        }

            .box5 .icon li a:hover {
                background: #444;
                color: #fff
            }

        .box5 .box-content {
            padding: 20px 15px;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1
        }

        .box5 .title {
            font-size: 20px;
            font-weight: 800;
            color: #fff;
            margin: 0 0 5px;
            opacity: 0;
            transform: translate(-20px,-20px);
            transition: all .35s ease-out
        }

        .box5:hover .title {
            opacity: 1;
            transform: translate(0,0);
            transition-delay: .15s
        }

        .box5 .post {
            display: inline-block;
            font-size: 16px;
            color: #fff;
            opacity: 0;
            transform: translate(-20px,-20px);
            transition: all .35s ease-out
        }

        .box5:hover .post {
            opacity: 1;
            transform: translate(0,0);
            transition-delay: .15s
        }

    .box6 .title, .box6 img, .box6:after {
        transition: all .35s ease 0s
    }

    @media only screen and (max-width:990px) {
        .box5 {
            margin-bottom: 30px
        }
    }
    /*********************** Demo - 6 *******************/
    .box6 {
        background: #595959;
        position: relative
    }

        .box6:after {
            background: rgba(0,0,0,.7);
            position: absolute;
            top: 0;
            left: -30%;
            bottom: 0;
            right: 70%;
            transform: skew(20deg) translateX(-75%)
        }

        .box6:hover:after {
            transform: skew(20deg) translateX(0)
        }

        .box6 img {
            width: 100%;
            height: auto
        }

        .box6:hover img {
            opacity: .5
        }

        .box6 .box-content {
            padding: 20px;
            text-align: right;
            position: absolute;
            top: 0;
            right: 0;
            z-index: 1
        }

        .box6 .icon, .box7 .icon {
            padding: 0;
            list-style: none
        }

            .box10 .icon li a, .box11, .box12, .box13, .box14, .box6 .icon li a, .box7, .box7 .icon li a, .box8, .box8 .icon li a {
                text-align: center
            }

        .box6 .title {
            font-size: 20px;
            font-weight: 900;
            color: #fff;
            margin: 0 0 10px;
            transform: scale(0)
        }

        .box6:hover .title {
            transform: scale(1)
        }

        .box6 .icon li, .box6 .post {
            opacity: 0;
            transform: translateX(40px);
            transition: all .35s ease 0s
        }

        .box6 .post {
            display: block;
            font-size: 14px;
            color: #fff;
            margin-bottom: 5px
        }

        .box6 .icon {
            display: inline-block;
            margin: 0
        }

        .box6:hover .icon li, .box6:hover .post {
            opacity: 1;
            transform: translateX(0)
        }

            .box6:hover .icon li:first-child {
                transition-delay: .1s
            }

            .box6:hover .icon li:nth-child(2) {
                transition-delay: .2s
            }

        .box6 .icon li a {
            display: block;
            width: 35px;
            height: 35px;
            line-height: 35px;
            background: #fff;
            font-size: 18px;
            color: #605f5f;
            margin-bottom: 5px;
            transition: all .35s ease
        }

            .box6 .icon li a:hover {
                background: #605f5f;
                color: #fff
            }

    @media only screen and (max-width:990px) {
        .box6 {
            margin-bottom: 30px
        }
    }

    /*********************** Demo - 7 *******************/
    .box7 {
        position: relative
    }

        .box7:after, .box7:before {
            width: 100%;
            height: 100%;
            background: rgba(11,33,47,.9);
            position: absolute;
            top: 0;
            left: 0;
            opacity: 0;
            transition: all .5s ease 0s;
            z-index:1
        }

        .box7:after {
            background: rgba(255,255,255,.3);
            border: 2px solid #ecb045;
            top: 0;
            left: 170%;
            opacity: 1;
            z-index: 1;
            transform: skewX(45deg);
            transition: all 1s ease 0s
        }

        .box7:hover:before {
            opacity: 1
        }

        .box7:hover:after {
            left: -170%
        }

        .box7 img {
            width: 100%;
            height: auto
        }

        .box7 .box-content {
            width: 100%;
            position: absolute;
            bottom: -100%;
            left: 0;
            transition: all .5s ease 0s;
            z-index: 2;
        }

        .box7:hover .box-content {
            bottom: 30%
        }

@media(min-width:792px) {
	.box7 .title {
		display: block;
		font-size: 22px;
		font-weight: 700;
		color: #fff;
		margin: 0 0 10px
	}

	.search-can {
		font-size: 30px;
	}
}

@media(max-width:792px) and (min-width:609px) {
	.box7 .title {
		display: block;
		font-size: 15px;
		font-weight: 700;
		color: #fff;
		margin: 0 0 0
	}

	.search-can {
		font-size: 20px;
	}
}

@media(max-width:608px) and (min-width:576px) {
	.box7 .title {
		display: block;
		font-size: 13px;
		font-weight: 700;
		color: #fff;
		margin: 0 0 0
	}

	.search-can {
		font-size: 16px;
	}
}

@media(max-width:575px) {
	.box7 .title {
		display: block;
		font-size: 22px;
		font-weight: 700;
		color: #fff;
		margin: 0 0 10px
	}

	.search-can {
		font-size: 30px;
	}
}

        .box7 .post {
            display: block;
            font-size: 15px;
            font-weight: 600;
            color: #fff;
            margin-bottom: 10px
        }

        .box7 .icon {
            margin: 0
        }

            .box7 .icon li {
                display: inline-block
            }

                .box7 .icon li a {
                    display: block;
                    width: 35px;
                    height: 35px;
                    line-height: 35px;
                    border-radius: 50%;
                    background: #ecb045;
                    font-size: 18px;
                    color: #fff;
                    margin-right: 10px;
                    transition: all .5s ease 0s
                }

    .box8 .icon li, .box8 .title {
        display: inline-block
    }

    .box7 .icon li a:hover {
        transform: rotate(360deg)
    }

    @media only screen and (max-width:990px) {
        .box {
            margin-bottom: 30px
        }
    }

    /*========================================================================================================
                                        defolt-css here
 ========================================================================================================*/
    @import url('https://fonts.googleapis.com/css?family=Poppins:400,400i,500,500i,600,700,800,900');

    * {
        margin: 0;
        padding: 0;
    }

 

    .floatleft {
        float: left;
    }

    .floatright {
        float: right;
    }

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

    .fix {
        overflow: hidden
    }

    p {
        margin: 0px;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        margin-bottom: 10px;
        margin-top: 0px;
    }

    input:focus,
    select:focus {
        outline: none;
    }

    input,
    button {
        transition: all .3s;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
    }

    a {
        -webkit-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
        text-decoration: none;
        color: #333132;
    }

        a:hover {
            color: #ecb045;
        }

        a:active,
        a:hover,
        a:focus {
            outline: none;
            text-decoration: none;
        }

    button:focus {
        outline: none;
    }

    ul {
        list-style: outside none none;
        margin: 0;
        padding: 0;
    }

    :before,
    :after {
        transition: all .3s;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
    }

    div {
        transition: all .3s;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
    }

    .black-opacity {
        position: relative;
        z-index: 9;
    }

        .black-opacity:before {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            content: "";
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
        }

    .bg-img-1 {
        background: url(../images/bg/1.jpg) no-repeat center center / cover
    }

    .bg-img-2 {
        background: url(../images/bg/2.jpg) no-repeat center center / cover
    }

    .bg-img-3 {
        background: url(../images/bg/3.jpg) no-repeat center center / cover
    }

    .bg-img-4 {
        background: url(../images/bg/4.jpg) no-repeat center center / cover
    }

    .bg-img-5 {
        background: url(../images/bg/5.jpg) no-repeat center center / cover
    }

    .bg-img-6 {
        background: url(../images/bg/6.jpg) no-repeat center center / cover
    }

    .pt-120 {
        padding-top: 120px;
    }

    .ptb-120 {
        padding: 90px 0;
    }

    .mb-40 {
        margin-bottom: 40px;
    }

    .bg-fff {
        background: #fff;
    }

    a#scrollUp {
        position: fixed;
        right: 10px;
        bottom: 20px;
        height: 45px;
        width: 45px;
        background: #222;
        text-align: center;
        line-height: 45px;
        color: #fff;
        font-size: 12px;
        border-radius: 5px;
    }

        a#scrollUp:hover {
            background: #ecb045;
        }

    /*--------header-area start---------*/
    .logo {
        margin: 20px 0px 10px 0px;
    }

    .mainmenu {
        padding: 31px 0px;
    }

        .mainmenu ul,
        .search-wrapper ul {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: end;
            -ms-flex-pack: end;
            justify-content: flex-end;
        }

            .mainmenu ul li {
                margin-left: 20px;
                position: relative;
            }

                .mainmenu ul li:first-child {
                    margin-left: 0px;
                }

                .mainmenu ul li a {
                    display: block;
                    text-transform: uppercase;
                    padding: 5px 7px;
                    font-weight: 400;
                    color: #333132;
                }

                .mainmenu ul li.active > a,
                .mainmenu ul li:hover > a {
                    background: #ecb045;
                }

                .mainmenu ul li > ul {
                    display: block;
                    position: absolute;
                    left: 0;
                    top: 100%;
                    width: 200px;
                    background: #fff;
                    padding: 20px;
                    z-index: 999;
                    visibility: hidden;
                    opacity: 0;
                    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
                    transition: all .3s;
                    -webkit-transition: all .3s;
                    -moz-transition: all .3s;
                    box-shadow: 0px 2px 10px rgba(0, 0, 0, .1);
                }

                .mainmenu ul li:hover > ul {
                    visibility: visible;
                    opacity: 1;
                    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
                }

                .mainmenu ul li > ul li {
                    margin-left: 0px;
                    display: block;
                }

                    .mainmenu ul li > ul li a {
                        text-transform: capitalize;
                    }

                    .mainmenu ul li > ul li:hover a {
                        background: transparent;
                        color: #ecb045;
                        padding-left: 20px;
                    }

            .search-wrapper ul li {
                position: relative;
            }

                .search-wrapper ul li a {
                    padding: 35px 38px;
                    display: block;
                }

                .search-wrapper ul li > ul {
                    position: absolute;
                    right: 0;
                    top: 77%;
                    width: 300px;
                    background: #595959;
                    padding: 5px 10px 1px 10px;
                    visibility: hidden;
                    opacity: 0;
                    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
                    transition: all .3s;
                    -webkit-transition: all .3s;
                    -moz-transition: all .3s;
                    z-index: 999;
                }

                .search-wrapper ul li:hover > ul {
                    opacity: 1;
                    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
                    visibility: visible;
                    top: 100%;
                }

                .search-wrapper ul li > ul li {
                    display: block;
                    padding: 0px;
                }

                    .search-wrapper ul li > ul li form {
                        position: relative;
                    }

                    .search-wrapper ul li > ul li input {
                        border: 1px solid #e5e5e5;
                        padding: 0px 45px 0px 15px;
                    }

                    .search-wrapper ul li > ul li button {
                        position: absolute;
                        right: 0;
                        top: 0;
                        width: 45px;
                        height: 45px;
                        background: #ecb045;
                        color: #333132;
                        border: none;
                        cursor: pointer;
                    }

                        .search-wrapper ul li > ul li button:hover {
                            background: #222;
                            color: #fff;
                        }
    /*--------header-area end---------*/

    /*---------------------------- responsiv-area start --------------------------*/
    .responsive-menu-wrap {
        position: relative;
    }

        .responsive-menu-wrap .slicknav_btn {
            background-color: transparent;
            border-radius: 0;
            display: block;
            float: right;
            margin: 0;
            padding: 0px 0px;
            text-decoration: none;
            text-shadow: none;
            vertical-align: middle;
        }

    .slicknav_menu .slicknav_icon {
        margin: 2px 8px;
    }

    .responsive-menu-wrap .slicknav_menu .slicknav_menutxt {
        display: none;
    }

    .responsive-menu-wrap .slicknav_menu {
        background: transparent none repeat scroll 0 0;
        font-size: 15px;
        padding: 57px 0;
        position: absolute;
        right: 0px;
        top: 0;
    }

        .responsive-menu-wrap .slicknav_menu .slicknav_icon-bar {
            border-radius: 0;
            box-shadow: none;
            -webkit-box-shadow: none;
            -moz-box-shadow: none;
            display: block;
            height: 2px;
            width: 25px;
            background: #333132;
        }

    .responsive-menu-wrap .slicknav_nav {
        background: #333132 none repeat scroll 0 0;
        border-radius: 0px;
        clear: both;
        color: #fff;
        font-size: 15px;
        margin: 0;
        padding: 5px 0;
        position: relative;
        top: 57px;
        width: 690px;
        z-index: 99;
        right: 0px;
        z-index: 999;
        position: relative;
    }
.ellimargin {
    /*margin-top: 52px;*/
    padding: 28px 0;
}

    .slicknav_nav a {
        color: #f1f1f1;
        text-decoration: none;
        text-transform: capitalize;
    }

        .slicknav_nav a i {
            display: none
        }

        .slicknav_nav a:hover {
            background: transparent none repeat scroll 0 0;
            border-radius: 0;
            text-shadow: 0px 3px 5px rgba(0, 0, 0, .5);
            color: #fff;
        }

    .responsive-menu-wrap .slicknav_nav .slicknav_row:hover {
        background: transparent;
    }

    .responsive-menu-wrap .slicknav_nav .slicknav_arrow {
        font-size: 0px;
        margin: 5px;
    }

    .sticky-menu {
        width: 100%;
        left: 0;
        top: 0px;
        position: fixed;
        z-index: 999;
        background: #fff;
        box-shadow: 0px 1px 2px rgba(0, 0, 0, .1);
        -webkit-transition: all 0.5s ease 0s;
        transition: all 0.5s ease 0s;
    }

        .sticky-menu .logo {
            margin: 15px 0px;
        }

        .sticky-menu .mainmenu {
            padding: 32px 0px;
        }

        .sticky-menu .search-wrapper ul li a {
            padding: 37px 0px;
        }

        .sticky-menu .responsive-menu-wrap .slicknav_menu {
            padding: 42px 0px;
        }

        .sticky-menu .responsive-menu-wrap .slicknav_nav {
            top: 42px;
        }
    /*-------- responsiv-area end ------------*/

    /*--------slider-area start---------*/
    .slider-items {
        position: relative;
    }

        .slider-items img {
            visibility: hidden;
        }

        .slider-items:before {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background: #000;
            content: "";
            opacity: .5;
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
        }

    .slider-content {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 9;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

        .slider-content h2 {
            text-transform: uppercase;
            line-height: 100px;
            color: #fff;
            font-weight: 800;
            margin-left:-13px;
        }

            .slider-content h2 span.color,
            .slider-content p span {
                color: #ecb045;
            }

        .slider-content p {
            color: #fff;
            font-size: 24px;
            margin-bottom: 30px;
        }

        .slider-content a {
            font-size: 16px;
            color: #ecb045;
            font-weight: 500;
        }

    .slider-text {
        position: relative;
        padding-left: 50px;
    }

    .line {
        position: absolute;
        width: 610px;
        height: 410px;
        left: 0;
        top: -40px;
        z-index: -9;
    }

@media(min-width:1197px) {
	.line2 {
		position: absolute;
		width: 710px;
		height: 320px;
		left: 0;
		top: -40px;
		z-index: -9;
	}
}

@media(max-width:1197px) and (min-width:1000px) {
	.line2 {
		position: absolute;
		width: 656px;
		height: 256px;
		left: 0;
		top: -40px;
		z-index: -9;
	}
}

@media(max-width:1000px) and (min-width:991px) {
	.line2 {
		position: absolute;
		width: 640px;
		height: 240px;
		left: 0;
		top: -40px;
		z-index: -9;
	}
}

@media(max-width:992px) and (min-width:767px) {
	.line2 {
		position: absolute;
		width: 710px;
		height: 255px;
		left: 0;
		top: -40px;
		z-index: -9;
	}
}

@media(max-width:767px) and (min-width:576px) {
	.line2 {
		position: absolute;
		width: 390px;
		height: 255px;
		left: 0;
		top: -40px;
		z-index: -9;
	}
}

@media(max-width:576px) {
	.line2 {
		position: absolute;
		width: 333px;
		height: 170px;
		left: 0;
		top: -40px;
		z-index: -9;
	}
}

    .line:before,
    .line:after,
    .blog-wrap2:before,
    .blog-wrap2:after {
        position: absolute;
        left: 0;
        top: 0;
        width: 0;
        height: 0;
        background: transparent;
        border: 2px solid transparent;
        content: "";
        z-index: -9;
    }

    .line2:before,
    .line2:after,
    .blog-wrap2:before,
    .blog-wrap2:after {
        position: absolute;
        left: 0;
        top: 0;
        width: 0;
        height: 0;
        background: transparent;
        border: 2px solid transparent;
        content: "";
        z-index: -9;
    }

    .next-prev-style .owl-item.active .line2:after,
    .blog-wrap2:hover:after {
        -webkit-animation: animate2 1s linear forwards;
        animation: animate2 1s linear forwards;
        -webkit-animation-delay: 1s;
        animation-delay: 1s;
    }

    .next-prev-style .owl-item.active .line2:before,
    .blog-wrap2:hover:before {
        -webkit-animation: animate 1s linear forwards;
        animation: animate 1s linear forwards;
    }

    .next-prev-style .owl-item.active .line:before,
    .blog-wrap2:hover:before {
        -webkit-animation: animate 1s linear forwards;
        animation: animate 1s linear forwards;
    }

    @-webkit-keyframes animate {
        0% {
            width: 0;
            height: 0;
            border-top-color: #ecb045;
            border-right-color: transparent;
            border-bottom-color: transparent;
            border-left-color: transparent;
        }

        50% {
            width: 100%;
            height: 0;
            border-top-color: #ecb045;
            border-right-color: #ecb045;
            border-bottom-color: transparent;
            border-left-color: translate;
        }

        100% {
            width: 100%;
            height: 90%;
            border-top-color: #ecb045;
            border-right-color: #ecb045;
            border-bottom-color: transparent;
            border-left-color: translate;
        }
    }

    @keyframes animate {
        0% {
            width: 0;
            height: 0;
            border-top-color: #ecb045;
            border-right-color: transparent;
            border-bottom-color: transparent;
            border-left-color: transparent;
        }

        50% {
            width: 100%;
            height: 0;
            border-top-color: #ecb045;
            border-right-color: #ecb045;
            border-bottom-color: transparent;
            border-left-color: translate;
        }

        100% {
            width: 100%;
            height: 90%;
            border-top-color: #ecb045;
            border-right-color: #ecb045;
            border-bottom-color: transparent;
            border-left-color: translate;
        }
    }

    .next-prev-style .owl-item.active .line:after,
    .blog-wrap2:hover:after {
        -webkit-animation: animate2 1s linear forwards;
        animation: animate2 1s linear forwards;
        -webkit-animation-delay: 1s;
        animation-delay: 1s;
    }

    @-webkit-keyframes animate2 {
        0% {
            width: 0;
            height: 0;
            border-top-color: translate;
            border-right-color: translate;
            border-bottom-color: translate;
            border-left-color: #ecb045;
        }

        50% {
            width: 0;
            height: 90%;
            border-top-color: translate;
            border-right-color: translate;
            border-bottom-color: #ecb045;
            border-left-color: #ecb045;
        }

        100% {
            width: 100%;
            height: 90%;
            border-top-color: translate;
            border-right-color: translate;
            border-bottom-color: #ecb045;
            border-left-color: #ecb045;
        }
    }

    @keyframes animate2 {
        0% {
            width: 0;
            height: 0;
            border-top-color: translate;
            border-right-color: translate;
            border-bottom-color: translate;
            border-left-color: #ecb045;
        }

        50% {
            width: 0;
            height: 90%;
            border-top-color: translate;
            border-right-color: translate;
            border-bottom-color: #ecb045;
            border-left-color: #ecb045;
        }

        100% {
            width: 100%;
            height: 90%;
            border-top-color: translate;
            border-right-color: translate;
            border-bottom-color: #ecb045;
            border-left-color: #ecb045;
        }
    }

    .next-prev-style .owl-nav div {
        position: absolute;
        left: 0;
        top: 50%;
        height: 60px;
        width: 60px;
        line-height: 60px;
        text-align: center;
        background: #fff;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
    }

        .next-prev-style .owl-nav div:hover {
            background: #ecb045;
        }

        .next-prev-style .owl-nav div.owl-next {
            left: auto;
            right: 0;
        }
    /*--------slider-area end---------*/

    /*--------about-area start---------*/
    .about-wrap {
        position: relative;
        padding: 60px 0px 60px 30px;
        border-top: 2px solid #ecb045;
        border-left: 2px solid #ecb045;
    }

        .about-wrap:before {
            position: absolute;
            left: 0;
            bottom: 0;
            width: 100%;
            height: 2px;
            content: "";
            background: #ecb045;
        }

        .about-wrap:after {
            position: absolute;
            right: -100px;
            top: -2px;
            width: 100px;
            height: 60px;
            border-top: 2px solid #ecb045;
            border-right: 2px solid #ecb045;
            content: "";
        }

        .about-wrap h2 {
            font-size: 30px;
            font-weight: 700;
            text-transform: uppercase;
            margin-bottom: 5px;
        }

        .about-wrap h3 {
            font-weight: 500;
            font-size: 24px;
            margin-bottom: 25px;
        }

        .about-wrap p {
            margin-bottom: 30px;
        }

    .about-content {
        background: #fff;
        box-shadow: 0px 2px 10px rgba(0, 0, 0, .2);
        padding: 30px 0px;
        text-align: center;
    }

        .about-content h4 {
            font-size: 24px;
            font-weight: 400;
            margin-bottom: 5px;
        }

        .about-content p {
            font-size: 13px;
            margin-bottom: 0px;
            line-height: 20px;
        }

    .about-img {
        position: relative;
        margin-top: 100px;
    }

        .about-img:before {
            position: absolute;
            left: -15px;
            bottom: -15px;
            height: 95%;
            width: 98%;
            background: #333132;
            content: "";
            z-index: -9;
        }
    /*--------about-area end---------*/

    /*--------servic-area start---------*/
    .section-title {
        margin-bottom: 40px;
    }

        .section-title h2 {
            font-size: 30px;
            font-weight: 700;
            text-transform: uppercase;
            margin-bottom: 5px;
        }

        .section-title h3 {
            font-weight: 500;
            font-size: 20px;
            margin-bottom: 0px;
        }

    .spacial-img {
        position: relative;
    }

    .spacial-wrap {
        padding: 60px 0px 30px;
    }

    .spacial-item {
        box-shadow: 0px 2px 10px rgba(0, 0, 0, .2);
        text-align: center;
        padding: 49px 0px;
        margin-bottom: 30px;
    }

        .spacial-item:hover {
            background: #ecb045;
        }

        .spacial-item span {
            display: block;
            margin-bottom: 10px;
        }

            .spacial-item span:before {
                font-size: 35px;
            }

        .spacial-item h4 {
            text-transform: uppercase;
            font-size: 16px;
            font-weight: 400;
            margin-bottom: 0px;
        }
    /*--------servic-area end---------*/

    /*--------project-area start---------*/
    .project-area {
        padding: 120px 0px 90px;
    }

    .project-menu button {
        border: 1px solid #ecb045;
        padding: 7px 20px;
        background: transparent;
        text-transform: uppercase;
        font-size: 14px;
        cursor: pointer;
    }

        .project-menu button.active {
            background: #ecb045;
        }

    .project-wrap {
        position: relative;
        margin-bottom: 30px;
    }

        .project-wrap img {
            width: 100%;
        }

        .project-wrap:before {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background: #ecb045;
            opacity: .55;
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=55)";
            content: "";
            transition: all .3s;
            -webkit-transition: all .3s;
            -moz-transition: all .3s;
            -webkit-transform: scaleY(0);
            transform: scaleY(0);
            -webkit-transform-origin: 0 0;
            transform-origin: 0 0;
            -webkit-transition-property: transform;
            -webkit-transition-property: -webkit-transform;
            transition-property: -webkit-transform;
            transition-property: transform;
            transition-property: transform, -webkit-transform;
            -webkit-transition-duration: 0.5s;
            transition-duration: 0.5s;
            -webkit-transition-timing-function: ease-out;
            transition-timing-function: ease-out;
        }

        .project-wrap:hover:before {
            -webkit-transform: scaleY(1);
            transform: scaleY(1);
            -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
            transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
        }

    .project-content {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        visibility: hidden;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        text-align: center;
        transition: all .3s;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
        -webkit-transition-property: transform;
        -webkit-transition-property: -webkit-transform;
        transition-property: -webkit-transform;
        transition-property: transform;
        transition-property: transform, -webkit-transform;
        -webkit-transition-duration: 0.5s;
        transition-duration: 0.5s;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;
    }

    .project-wrap:hover .project-content {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        visibility: visible;
        -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
        transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
    }

    .project-content a {
        font-size: 30px;
        display: inline-block;
        margin-bottom: 15px;
    }

        .project-content a:hover {
            color: #fff;
        }

    .project-content h3 {
        font-size: 18px;
        text-transform: capitalize;
        margin-bottom: 0px;
    }
    /*--------project-area end---------*/

    /*--------service-area start---------*/
    .service-area {
        padding: 120px 0px 90px;
    }

    .service-wrap {
        margin-bottom: 30px;
    }

    .service-img {
        position: relative;
        overflow: hidden;
    }

        .service-img img {
            width: 100%;
            -webkit-transform: scale(1);
            transform: scale(1);
            -webkit-transition: all .3s;
            transition: all .3s;
        }

    .service-wrap:hover .service-img img {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

    .service-img:before {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, .5);
        content: "";
        border: 25px solid rgba(0, 0, 0, .2);
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        z-index: 9;
    }

    .service-wrap:hover .service-img:before {
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }

    .service-content {
        padding: 30px 10px;
        background: #fff;
    }

        .service-content h4 {
            margin-bottom: 20px;
            text-transform: uppercase;
            font-weight: 700;
            font-size: 18px;
        }

        .service-content p {
            margin-bottom: 25px;
        }

        .service-content a {
            height: 35px;
            width: 110px;
            font-size: 14px;
            text-transform: uppercase;
            font-weight: 500;
            text-align: center;
            display: inline-block;
            background: #ecb045;
            line-height: 35px;
        }

            .service-content a:hover {
                background: #333132;
                color: #fff;
            }
    /*--------service-area end---------*/

    /*--------fanfact-area start---------*/
    .fanfact-area {
        padding: 100px 0px;
    }

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

        .funfact-wrap h2 {
            color: #ecb045;
            font-size: 72px;
            margin: 0px auto 20px;
            line-height: 51px;
            font-weight: 300;
            width: 100px;
        }

        .funfact-wrap p {
            text-transform: uppercase;
            font-size: 30px;
            color: #fff;
        }
    /*--------fanfact-area end---------*/

    /*--------team-area start---------*/
    .team-area {
        padding: 120px 0px 90px;
    }

    .team-wrap {
        margin-bottom: 30px;
        position: relative;
        overflow: hidden;
        z-index: 9;
    }

        .team-wrap:before {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background: #ecb045;
            content: "";
            opacity: 0;
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        }

        .team-wrap:hover:before {
            opacity: .75;
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
        }

    .team-content {
        position: absolute;
        left: 0;
        bottom: -108px;
        width: 100%;
        background: #fff;
        padding: 20px 0px 50px;
        text-align: center;
    }

    .team-wrap:hover .team-content {
        bottom: 0px;
        background: transparent;
    }

    .team-content h4 {
        font-weight: 700;
        font-size: 24px;
        text-transform: uppercase;
        margin-bottom: 0px;
    }

    .team-content p {
        margin-bottom: 20px;
    }

    .team-content ul li {
        display: inline-block;
        margin: 0px 2px;
    }

        .team-content ul li a {
            display: block;
            height: 35px;
            width: 35px;
            background: #fff;
            text-align: center;
            line-height: 35px;
            font-size: 14px;
            font-weight: 300
        }

        .team-content ul li:hover a {
            background: #323131;
            color: #fff;
        }
    /*--------team-area end---------*/

    /*--------testmonial-area start---------*/
    .section-title2 h2,
    .section-title2 h3 {
        color: #fff;
    }

    .test-wrap {
        padding: 60px 0px 0px;
        outline: none;
    }

        .test-wrap i {
            color: #ecb045;
            font-size: 36px;
            margin-bottom: 25px;
            margin-left: 1px;
        }

        .test-wrap p {
            color: #fff;
            margin-bottom: 35px;
        }

        .test-wrap h4 {
            font-size: 18px;
            font-weight: 500;
            margin-bottom: 0px;
            color: #fff;
        }

        .test-wrap span {
            display: block;
            font-size: 14px;
            color: #ecb045;
        }

    .test-img-active {
        padding: 60px 30px 0px 0px;
        position: relative;
        z-index: 9;
    }

        .test-img-active:before {
            position: absolute;
            right: 0;
            top: 0;
            width: 85%;
            height: 95%;
            border: 3px solid #ecb045;
            content: "";
            z-index: -9;
        }

    .test-img {
        position: relative;
        padding-left: 30px;
        outline: none;
    }

        .test-img img {
            width: 100%;
        }

        .test-img ul {
            position: absolute;
            left: 30px;
            bottom: 0;
            width: 100%;
            padding: 15px 0;
            text-align: center;
            background: rgba(0, 0, 0, .7);
        }

            .test-img ul li {
                display: inline-block;
                font-size: 18px;
                font-weight: 500;
                color: #fff;
            }

                .test-img ul li i {
                    font-size: 14px;
                    color: #fcb837;
                }

    .test-images {
        height: 110px;
        width: 110px;
        border-radius: 50%;
        border: 3px solid #ecb045;
        left: 0px;
        bottom: 80px;
        position: absolute;
        overflow: hidden;
    }

    ul.slick-dots {
        position: absolute;
        bottom: -50px;
    }

    .slick-dots li {
        display: inline-block;
        margin-right: 5px;
    }

        .slick-dots li button {
            height: 15px;
            width: 15px;
            font-size: 0px;
            border-radius: 50%;
            background: #bcb8b8;
            cursor: pointer;
            border: none;
        }

        .slick-dots li.slick-active button {
            background: #ecb045;
        }
    /*--------testmonial-area end---------*/

    /*--------blog-area start---------*/
    .blog-area {
        padding: 120px 0px 90px;
    }

    .blog-wrap {
        margin-bottom: 30px;
    }

    .blog-img {
        position: relative;
        margin-bottom: 20px;
        overflow: hidden;
    }

        .blog-img img {
            width: 100%;
            transform: scale(1.1);
            -webkit-transform: scale(1.1);
            -moz-transform: scale(1.1);
            transition: all .3s;
            -webkit-transition: all .3s;
            -moz-transition: all .3s;
        }

    .blog-wrap:hover .blog-img img {
        transform: scale(1);
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
    }

    .blog-img:before {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, .5);
        border: 30px solid rgba(0, 0, 0, .3);
        content: "";
        z-index: 9;
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    }

    .blog-wrap:hover .blog-img:before {
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }

    .blog-content ul li {
        display: inline-block;
        font-size: 12px;
        text-transform: uppercase;
    }

    .blog-content h4 {
        text-transform: uppercase;
        line-height: 28px;
        font-size: 18px;
        font-weight: 700;
        border-bottom: 1px solid #ecb045;
        padding-bottom: 10px;
        margin: 10px 0px 20px;
    }

    .blog-content p {
        color: #333132;
    }
    /*--------blog-area end---------*/

    /*--------brand-area start---------*/
    .brand-area {
        padding: 30px 0px;
    }
    /*--------brand-area end---------*/
    #googleMap {
        width: 100%;
        height: 450px;
        background: #ecb045;
    }
    /*--------footer-area start---------*/
    .footer-top {
        padding: 120px 0px 90px;
    }

    .footer-widget {
        margin-bottom: 30px;
    }

    .footer-logo img {
        margin-bottom: 30px;
    }

    .footer-logo p {
        margin-bottom: 20px;
    }

    .footer-logo h4 {
        font-size: 16px;
        text-transform: uppercase;
        margin-bottom: 5px;
    }

    .footer-logo span {
        display: block;
        margin-bottom: 20px;
    }

    .footer-logo ul li {
        display: inline-block;
        margin-right: 10px;
        font-size: 18px;
    }

    .footer-widget h4.widget-title {
        font-size: 18px;
        text-transform: uppercase;
        padding-left: 30px;
        margin: 30px 0px 50px;
        font-weight: 600;
        position: relative;
    }

        .footer-widget h4.widget-title:before {
            position: absolute;
            left: 0;
            top: 5px;
            width: 5px;
            height: 12px;
            background: #ecb045;
            content: "";
        }

    .footer-contact ul li {
        margin-bottom: 20px;
        position: relative;
        padding-left: 40px;
        line-height: 24px;
        font-size: 14px;
    }

        .footer-contact ul li i {
            height: 25px;
            width: 25px;
            font-size: 14px;
            border: 1px solid #ecb045;
            text-align: center;
            line-height: 24px;
            position: absolute;
            left: 0;
            top: 50%;
            transform: translateY(-50%);
            -webkit-transform: translateY(-50%);
            -moz-transform: translateY(-50%);
        }

        .footer-contact ul li:last-child {
            margin-bottom: 0px;
        }

    .footer-menu ul li {
        line-height: 37px;
        padding-left: 30px;
        position: relative;
    }

        .footer-menu ul li:before {
            position: absolute;
            left: 0;
            top: 0;
            content: "\f101";
            font-family: fontawesome;
        }

        .footer-menu ul li:hover:before {
            left: 5px;
            color: #ecb045;
        }

    .newsletter p {
        margin-bottom: 20px;
    }

    .newsletter input {
        width: 100%;
        height: 40px;
        border: 1px solid #e5e5e5;
        padding-left: 15px;
        background: transparent;
        margin-bottom: 10px;
    }

    .newsletter button {
        width: 115px;
        height: 40px;
        line-height: 40px;
        text-align: center;
        text-transform: uppercase;
        font-size: 14px;
        border: none;
        background: #ecb045;
        cursor: pointer;
        border-radius: 3px;
    }

        .newsletter button:hover {
            background: #323131;
            color: #fff;
        }

    .footer-bootem {
        padding: 20px 0px;
        background: #ecb045;
        text-align: center;
    }
    /*--------footer-area end---------*/

    /*=======================================
        home two style here
=======================================*/
    .slider-area2 .slider-text {
        padding-left: 0;
    }

    .slider-area2 .line {
        height: 360px;
        left: 160px;
    }
    /*about*/
    .about-area2 .about-wrap:after {
        left: 0;
        width: 0;
        height: 140px;
    }

    a.readmore-btn {
        display: inline-block;
        padding: 12px 30px;
        text-transform: uppercase;
        font-size: 14px;
        background: #ecb045;
        font-weight: 700;
    }

        a.readmore-btn:hover {
            background: #333132;
            color: #fff;
        }

    .about-area2 .about-wrap {
        padding: 80px 0px 80px 30px;
        border-top: 2px solid #ecb045;
        border-left: none;
        border-right: 2px solid #ecb045;
    }

    .about-area2 .about-img2 {
        position: relative;
        padding-bottom: 70px;
    }

    .about-area2 .about-images {
        position: absolute;
        right: 0;
        bottom: 0;
        border-left: 3px solid #ecb045;
        border-top: 3px solid #ecb045;
    }

        .about-area2 .about-images a {
            position: absolute;
            height: 55px;
            width: 55px;
            background: #fff;
            line-height: 55px;
            text-align: center;
            display: block;
            left: 50%;
            border: 2px solid #ecb045;
            top: 50%;
            border-radius: 50%;
            -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
        }
    /*about*/

    /*---------quote-area start---------*/
    .quote-area {
        padding: 50px 0px;
        background: #ecb045;
    }

    .quote-wrap h2 {
        font-size: 24px;
        margin-bottom: 20px;
        text-transform: uppercase;
        font-weight: 600;
    }

    .quote-wrap a {
        display: inline-block;
        padding: 10px 25px;
        background: #222;
        color: #fff;
        text-transform: uppercase;
        font-weight: 500;
    }

        .quote-wrap a:hover {
            background: #fff;
            color: #222;
        }
    /*---------quote-area end---------*/

    /*---------interior-area start---------*/
    .interior-area {
        background: #ecb045;
        position: relative;
        padding: 80px 0px;
        overflow: hidden;
    }

    .interior-img {
        position: absolute;
        right: 0;
        width: 50%;
        top: 0;
        height: 100%;
        background: url(../images/bg/3.jpg) no-repeat center center / cover;
    }

        .interior-img img {
            visibility: hidden;
        }

    .interior-wrap {
        padding-right: 30px;
    }

        .interior-wrap span {
            display: block;
            margin-bottom: 15px;
        }

            .interior-wrap span:before {
                font-size: 60px;
            }

        .interior-wrap h2 {
            text-transform: uppercase;
            font-size: 30px;
            font-weight: 700;
            margin-bottom: 15px;
        }
    /*---------interior-area end---------*/
    .brand-area2 {
        background: #fff;
    }
    /*------testimonial------*/
    .test-img2 {
        width: 110px;
        height: 110px;
        border-radius: 50%;
        border: 3px solid #ecb045;
        margin: 0px auto 30px;
        overflow: hidden;
    }

    .test-wrap2 i {
        font-size: 36px;
        color: #ecb045;
        margin-bottom: 20px;
        display: block;
    }

    .test-wrap2 p {
        margin-bottom: 50px;
    }

    .test-wrap2 h4 {
        font-size: 18px;
        font-weight: 600;
        text-transform: uppercase;
        margin-bottom: 0px;
    }

    .test-wrap2 span {
        display: block;
        font-style: italic;
        font-size: 14px;
    }

    .test-active {
        padding-bottom: 50px;
    }

        .test-active .owl-nav div {
            position: absolute;
            left: -100px;
            top: 50%;
            transform: translateY(-50%);
            -webkit-transform: translateY(-50%);
            -moz-transform: translateY(-50%);
            font-size: 20px;
        }

            .test-active .owl-nav div:hover {
                color: #ecb045;
            }

            .test-active .owl-nav div.owl-next {
                left: auto;
                right: -100px;
            }

        .test-active .owl-dots {
            position: absolute;
            left: 0;
            bottom: 0;
            right: 0;
            text-align: center;
        }

        .test-active .owl-dot {
            display: inline-block;
            margin: 0px 2px;
            height: 15px;
            width: 15px;
            background: #323131;
            border-radius: 50%;
        }

            .test-active .owl-dot.active {
                background: #ecb045;
            }
    /*------testimonial------*/

    /*-------blog-------*/
    .blog-wrap2 {
        position: relative;
        margin-bottom: 30px;
        z-index: 9;
    }

    .blog-content2 {
        position: absolute;
        left: 0;
        top: 0px;
        width: 100%;
        height: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding: 0px 20px;
        background: rgba(0, 0, 0, .95);
        visibility: hidden;
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    }

    .blog-wrap2:hover .blog-content2 {
        visibility: visible;
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }

    .blog-content2 span {
        display: block;
        color: #777;
        margin-bottom: 5px;
        font-style: italic;
        margin-top: -30px;
        transition: all .3s;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
    }

    .blog-wrap2:hover .blog-content2 span {
        margin-top: 0px;
    }

    .blog-content2 h4 {
        text-transform: uppercase;
        font-size: 18px;
        font-weight: 600;
        line-height: 28px;
        margin-bottom: 15px;
        margin-left: 20px;
        transition: all .3s;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
    }

    .blog-wrap2:hover .blog-content2 h4 {
        margin-left: 0px;
    }

    .blog-content2 h4 a {
        color: #fff;
    }

        .blog-content2 h4 a:hover {
            color: #ecb045;
        }

    .blog-content2 p {
        margin-bottom: 20px;
        color: #f1f1f1;
        font-size: 15px;
        transition: all .3s;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
    }

    .blog-content2 a.readmore {
        text-decoration: underline;
        color: #ecb045;
        display: inline-block;
        transition: all .3s;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
    }

    .blog-wrap2:before,
    .blog-wrap2:after {
        position: absolute;
        left: 0;
        top: 0;
        width: 0;
        height: 0;
        background: transparent;
        border: 3px solid transparent;
        content: "";
        z-index: 9;
    }

    .blog-wrap2:hover:before {
        -webkit-animation: animate3 .6s linear forwards;
        animation: animate3 .6s linear forwards;
    }

    @-webkit-keyframes animate3 {
        0% {
            width: 0;
            height: 0;
            border-top-color: #ecb045;
            border-right-color: transparent;
            border-bottom-color: transparent;
            border-left-color: transparent;
        }

        50% {
            width: 100%;
            height: 0;
            border-top-color: #ecb045;
            border-right-color: #ecb045;
            border-bottom-color: transparent;
            border-left-color: translate;
        }

        100% {
            width: 100%;
            height: 100%;
            border-top-color: #ecb045;
            border-right-color: #ecb045;
            border-bottom-color: transparent;
            border-left-color: translate;
        }
    }

    @keyframes animate3 {
        0% {
            width: 0;
            height: 0;
            border-top-color: #ecb045;
            border-right-color: transparent;
            border-bottom-color: transparent;
            border-left-color: transparent;
        }

        50% {
            width: 100%;
            height: 0;
            border-top-color: #ecb045;
            border-right-color: #ecb045;
            border-bottom-color: transparent;
            border-left-color: translate;
        }

        100% {
            width: 100%;
            height: 100%;
            border-top-color: #ecb045;
            border-right-color: #ecb045;
            border-bottom-color: transparent;
            border-left-color: translate;
        }
    }

    .blog-wrap2:hover:after {
        -webkit-animation: animate4 .6s linear forwards;
        animation: animate4 .6s linear forwards;
        -webkit-animation-delay: .6s;
        animation-delay: .6s;
    }

    @-webkit-keyframes animate4 {
        0% {
            width: 0;
            height: 0;
            border-top-color: translate;
            border-right-color: translate;
            border-left-color: translate;
            border-bottom-color: #ecb045;
        }

        50% {
            width: 0;
            height: 100%;
            border-top-color: translate;
            border-right-color: translate;
            border-left-color: #ecb045;
            border-bottom-color: #ecb045;
        }

        100% {
            width: 100%;
            height: 100%;
            border-top-color: translate;
            border-right-color: translate;
            border-left-color: #ecb045;
            border-bottom-color: #ecb045;
        }
    }

    @keyframes animate4 {
        0% {
            width: 0;
            height: 0;
            border-top-color: translate;
            border-right-color: translate;
            border-left-color: translate;
            border-bottom-color: #ecb045;
        }

        50% {
            width: 0;
            height: 100%;
            border-top-color: translate;
            border-right-color: translate;
            border-left-color: #ecb045;
            border-bottom-color: #ecb045;
        }

        100% {
            width: 100%;
            height: 100%;
            border-top-color: translate;
            border-right-color: translate;
            border-left-color: #ecb045;
            border-bottom-color: #ecb045;
        }
    }
    /*-------blog-------*/

    /*=======================================
        home Three style here
=======================================*/
    .slider-area3 .slider-text {
        text-align: right;
        padding-left: 0px;
        padding-right: 50px;
    }

    .slider-area3 .line {
        left: auto;
        right: 0;
    }
    /*about-area*/
    .about-wrap3 {
        background: #fff;
        padding: 60px 70px;
    }

    .about-active .slick-list.draggable {
        box-shadow: 0px 2px 10px rgba(0, 0, 0, .2);
    }

    .about-wrap3 h2 {
        text-transform: uppercase;
        font-weight: 700;
        font-size: 30px;
    }

    .about-wrap3 h3 {
        font-size: 24px;
        font-weight: 500;
        margin-bottom: 20px;
    }

    .about-wrap3 p {
        margin-bottom: 25px;
    }

    .about-active {
        margin-right: -80px;
        position: relative;
        z-index: 9;
        margin-top: 32px;
    }

    .about-img-active i.slick-arrow {
        position: absolute;
        right: 0;
        bottom: 0;
        height: 40px;
        width: 40px;
        background: #fff;
        line-height: 40px;
        text-align: center;
        cursor: pointer;
    }

        .about-img-active i.slick-arrow:hover {
            background: #ecb045;
        }

        .about-img-active i.slick-arrow.fa-chevron-left {
            right: 40px;
            z-index: 9;
        }

    .about-wrap-2 {
        padding: 86px 0px;
    }

    .about-img-active {
        box-shadow: 0px 2px 8px rgba(0, 0, 0, .1);
    }
    /*about-area*/

    /*skill-area*/
    .skill-wrap {
        padding: 10px 0px;
    }

        .skill-wrap h2 {
            margin-bottom: 30px;
            font-size: 30px;
            font-weight: 700;
            text-transform: uppercase;
        }

        .skill-wrap p {
            text-transform: uppercase;
            margin-bottom: 5px;
        }

    .progress-wrap {
        overflow: hidden;
        padding-bottom: 35px;
    }

    .skill-wrap .progress {
        height: 10px;
        overflow: visible;
        background: #323131;
        border-radius: 5px;
    }

    .skill-wrap .progress-bar {
        position: relative;
        border-radius: 5px;
        background: #ecb045;
    }

        .skill-wrap .progress-bar:before {
            position: absolute;
            right: -2px;
            top: -5px;
            width: 20px;
            height: 20px;
            background: #ecb045;
            content: "";
            z-index: 9;
            border: 2px solid #323131;
            border-radius: 50%;
        }

        .skill-wrap .progress-bar span {
            position: absolute;
            right: 0;
            font-weight: 700;
            color: #323131;
            top: -32px;
            font-size: 14px;
        }

    .skill-img {
        position: relative;
    }

        .skill-img img {
            visibility: hidden;
        }

        .skill-img:before {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, .3);
            content: "";
            border: 50px solid rgba(0, 0, 0, .1);
        }
    /*skill-area*/

    /*newsletter-area*/
    .newsletter-area {
        padding: 100px 0px;
    }

        .newsletter-area.black-opacity:before {
            background: #ecb045;
            opacity: .8;
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
        }

    .newsletter-wrap form {
        position: relative;
    }

    .newsletter-wrap input {
        padding: 0px 165px 0px 20px;
        height: 65px;
        width: 100%;
        background: #fff;
        border: none;
        border-radius: 25px;
    }

    .newsletter-wrap button {
        position: absolute;
        right: 0;
        top: 0;
        width: 165px;
        height: 65px;
        line-height: 65px;
        cursor: pointer;
        background: #323131;
        border: none;
        color: #fff;
        text-align: center;
        text-transform: uppercase;
        border-top-right-radius: 25px;
        border-bottom-right-radius: 25px;
    }

        .newsletter-wrap button:hover {
            background: #ecb045;
            color: #323131;
        }
    /*newsletter-area*/
    /*=======================================
        home Three style here
=======================================*/

    /*=======================================
        about page style here
=======================================*/
    /*--------breadcumb-area start--------*/
    .breadcumb-area {
        height: 180px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .breadcumb-wrap h2 {
        text-transform: uppercase;
        font-size: 35px;
        font-weight: 700;
        color: #ecb045;
        margin-bottom: 5px;
    }

    .breadcumb-wrap ul li {
        display: inline-block;
        text-transform: uppercase;
        color: #fff;
        font-weight: 500;
        font-size: 14px;
    }

        .breadcumb-wrap ul li a {
            color: #fff;
        }

            .breadcumb-wrap ul li a:hover {
                color: #ecb045;
            }
    /*--------breadcumb-area end--------*/
    /*about*/
    .about-page-wrap h2 {
        text-transform: uppercase;
        font-size: 36px;
        font-weight: 600;
        margin-bottom: 20px;
    }

    .about-page-wrap p {
        margin: 25px 0px;
    }

    .about-page-wrap ul {
        position: relative;
    }

        .about-page-wrap ul:before {
            position: absolute;
            left: 0;
            top: 0;
            width: 5px;
            height: 100%;
            background: #393939;
            content: "";
        }

        .about-page-wrap ul:hover:before {
            background: #ecb045;
        }

        .about-page-wrap ul li a {
            display: block;
            line-height: 28px;
            font-size: 16px;
            padding-left: 40px;
            position: relative;
        }

            .about-page-wrap ul li a:before {
                position: absolute;
                left: 5px;
                top: 50%;
                transform: translateY(-50%);
                -webkit-transform: translateY(-50%);
                -moz-transform: translateY(-50%);
                border-style: solid;
                border-width: 8px;
                border-color: transparent transparent transparent #ecb045;
                content: "";
                opacity: 0;
                -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
            }

        .about-page-wrap ul li:hover a:before {
            opacity: 1;
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        }

    .about-sidebar h3 {
        text-transform: uppercase;
        font-size: 24px;
        margin-top: 20px;
        font-weight: 500;
        padding-bottom: 15px;
        border-bottom: 1px solid #393939;
    }

    .about-sidebar ul {
        margin-bottom: 60px;
    }

        .about-sidebar ul li {
            padding-bottom: 13px;
            margin-bottom: 13px;
            border-bottom: 1px solid #393939;
        }

            .about-sidebar ul li:last-child {
                border-bottom: none;
            }

    .about-sidebar-img {
        position: relative;
    }

        .about-sidebar-img img {
            width: 100%;
        }

        .about-sidebar-img:before {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, .5);
            border: 30px solid rgba(0, 0, 0, .5);
            content: "";
        }

        .about-sidebar-img a {
            position: absolute;
            left: 50%;
            display: block;
            height: 50px;
            width: 50px;
            text-align: center;
            line-height: 48px;
            border: 4px solid #fff;
            color: #fff;
            border-radius: 50%;
            z-index: 999;
            top: 50%;
            transform: translate(-50%, -50%);
            -webkit-transform: translate(-50%, -50%);
            -moz-transform: translate(-50%, -50%);
        }

            .about-sidebar-img a:hover {
                background: #ecb045;
                color: #393939;
            }
    /*about*/
    .project-area-without-gutter {
        padding: 120px 0px;
    }

        .project-area-without-gutter .project-wrap {
            margin-bottom: 0px;
        }
    /*blog*/
    .pagination-wrap {
        margin: 20px 0px 30px;
    }

        .pagination-wrap ul li {
            display: inline-block;
        }

            .pagination-wrap ul li a,
            .pagination-wrap ul li span {
                height: 35px;
                width: 35px;
                line-height: 35px;
                background: #333132;
                color: #fff;
                font-weight: 600;
                font-size: 16px;
                display: block;
            }

            .pagination-wrap ul li span,
            .pagination-wrap ul li:hover a {
                background: #ecb045;
                color: #333132;
            }
    /*-------------------------sidebar-area start-------------------------*/
    .widget {
        margin-bottom: 40px;
    }

    .search-wrap form {
        position: relative;
    }

    .search-wrap input {
        width: 100%;
        height: 40px;
        padding-right: 45px;
        border: none;
        border: 1px solid #333132;
        background: transparent;
        padding-left: 15px;
    }

    .search-wrap button {
        position: absolute;
        right: 0px;
        background: #333132;
        border: none;
        color: #fff;
        height: 40px;
        top: 0px;
        width: 40px;
        cursor: pointer;
    }

        .search-wrap button:hover {
            color: #333132;
            background: #ecb045;
        }

    .search-wrap input::-webkit-input-placeholder {
        /* Chrome/Opera/Safari */
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        color: #333132;
    }

    .search-wrap input::-moz-placeholder {
        /* Firefox 19+ */
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        color: #333132;
    }

    .search-wrap input:-ms-input-placeholder {
        /* IE 10+ */
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        color: #333132;
    }

    .search-wrap input:-moz-placeholder {
        /* Firefox 18- */
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        color: #333132;
    }

    .widget .widget-title {
        font-size: 18px;
        font-weight: 600;
        padding-bottom: 10px;
        margin-bottom: 20px;
        border-bottom: 1px solid #333132;
    }

    .sidebar-menu ul li {
        line-height: 30px;
    }

        .sidebar-menu ul li a {
            position: relative;
            padding-left: 20px;
        }

            .sidebar-menu ul li a:before {
                position: absolute;
                left: 0;
                top: 50%;
                content: "\f101";
                font-family: fontawesome;
                -webkit-transform: translateY(-50%);
                transform: translateY(-50%);
            }

            .sidebar-menu ul li a:hover:before {
                left: 5px;
            }

    .recent-post ul li {
        overflow: hidden;
        margin-bottom: 20px;
    }

        .recent-post ul li:last-child {
            margin-bottom: 0px;
        }

    .post-img {
        float: left;
        margin-right: 15px;
    }

    .post-content {
        overflow: hidden;
    }

        .post-content a {
            display: block;
            font-weight: 600;
            line-height: 24px;
            margin-bottom: 10px;
        }

        .post-content p {
            font-size: 12px;
            font-style: italic;
        }

    .tag-wrap ul li {
        display: inline-block;
        margin-bottom: 5px;
    }

        .tag-wrap ul li a {
            display: block;
            padding: 6px 20px;
            border: 1px solid #e5e5e5;
            font-weight: 500;
            border-radius: 3px;
            text-transform: uppercase;
            font-size: 13px;
        }

            .tag-wrap ul li a:hover {
                color: #393939;
                background: #ecb045;
                border-color: #ecb045;
            }

    .tag-wrap {
        margin-bottom: 0px;
    }
    /*-------------------------sidebar-area end-------------------------*/
    .blog-details-area .blog-content h4 {
        font-size: 36px;
    }

    .blog-details-wrap p {
        margin-bottom: 25px;
    }

    .blog-details-wrap blockquote {
        background: #f1f1f1;
        padding: 30px 25px 30px 40px;
        font-size: 16px;
        font-style: italic;
        margin: 40px 0;
        border-left: 10px solid #ecb045;
    }

    .socila-link {
        margin-bottom: 100px;
    }

        .socila-link ul li {
            display: inline-block;
            color: #ecb045;
        }

            .socila-link ul li a {
                font-size: 16px;
                margin-left: 7px;
            }

    .blog-form h3 {
        margin-bottom: 25px;
        font-weight: 700;
    }

    .blog-form span {
        display: block;
        margin-bottom: 3px;
    }

    .blog-form input,
    .blog-form textarea,
    .contact-form input,
    .contact-form textarea {
        width: 100%;
        height: 45px;
        margin-bottom: 25px;
        border-radius: 3px;
        background: transparent;
        border: 1px solid #e5e5e5;
        padding-left: 20px;
    }

    .blog-form textarea,
    .contact-form textarea {
        height: 200px;
        padding-top: 10px;
    }

    .blog-form button,
    .contact-form button {
        padding: 10px 30px;
        background: #ecb045;
        color: #363636;
        text-transform: uppercase;
        font-size: 14px;
        font-weight: 700;
        border-radius: 3px;
        border: none;
        cursor: pointer;
    }

        .blog-form button:hover,
        .contact-form button:hover {
            background: #222;
            color: #ecb045;
        }

    .contact-form textarea {
        height: 270px;
    }

    .contact-wrap ul li {
        position: relative;
        padding: 30px 20px 30px 100px;
        font-size: 18px;
        text-transform: uppercase;
        font-weight: 600;
        background: #ecb045;
        margin-bottom: 25px;
        border-radius: 5px;
    }

        .contact-wrap ul li:last-child {
            margin-bottom: 0px;
        }

        .contact-wrap ul li i {
            position: absolute;
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
            top: 50%;
            left: 30px;
            font-size: 35px;
            color: #222;
        }

        .contact-wrap ul li p {
            font-size: 14px;
            margin-top: 8px;
            font-weight: 400;
            text-transform: capitalize;
        }

            .contact-wrap ul li p span {
                display: block;
            }

    .contact-area #googleMap {
        margin-top: 100px;
    }