/*!
 * bootstrap-fileinput v5.0.9
 * http://plugins.krajee.com/file-input
 *
 * Krajee Explorer Font Awesome 5.x theme style for bootstrap-fileinput. Load this theme file after loading
 * font awesome 5.x CSS and `fileinput.css`.
 *
 * Author: Kartik Visweswaran
 * Copyright: 2014 - 2019, Kartik Visweswaran, Krajee.com
 *
 * Licensed under the BSD-3-Clause
 * https://github.com/kartik-v/bootstrap-fileinput/blob/master/LICENSE.md
 */
.file-preview{
    min-height: 257px;
}
.theme-explorer-fas .file-upload-indicator, .theme-explorer-fas .file-drag-handle, .theme-explorer-fas .explorer-frame .kv-file-content, .theme-explorer-fas .file-actions, .explorer-frame .file-preview-other {
    text-align: center;
}

.theme-explorer-fas .file-thumb-progress .progress, .theme-explorer-fas .file-thumb-progress .progress-bar {
    height: 13px;
    font-size: 11px;
    line-height: 13px;
    overflow: hidden;
}

.theme-explorer-fas .file-upload-indicator, .theme-explorer-fas .file-drag-handle {
    position: absolute;
    display: inline-block;
    top: 0;
    right: 3px;
    width: 16px;
    height: 16px;
    font-size: 16px;
}

.theme-explorer-fas .file-thumb-progress .progress, .theme-explorer-fas .explorer-caption {
    display: block;
}

.theme-explorer-fas .explorer-frame td {
    vertical-align: middle;
    text-align: left;
}

.theme-explorer-fas .explorer-frame .kv-file-content {
    width: 80px;
    height: 80px;
    padding: 5px;
}

.theme-explorer-fas .file-actions-cell {
    position: relative;
    width: 120px;
    padding: 0;
}

.theme-explorer-fas .file-thumb-progress .progress {
    margin-top: 5px;
}

.theme-explorer-fas .explorer-caption {
    color: #777;
}

.theme-explorer-fas .kvsortable-ghost {
    opacity: 0.6;
    background: #e1edf7;
    border: 2px solid #a1abff;
}

.theme-explorer-fas .file-preview .table {
    margin: 0;
}

.theme-explorer-fas .file-error-message ul {
    padding: 5px 0 0 20px;
}

.explorer-frame .file-preview-text {
    display: inline-block;
    color: #428bca;
    border: 1px solid #ddd;
    font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
    outline: none;
    padding: 8px;
    resize: none;
}

.explorer-frame .file-preview-html {
    display: inline-block;
    border: 1px solid #ddd;
    padding: 8px;
    overflow: auto;
}

.explorer-frame .file-other-icon {
    font-size: 2.6em;
}


.kv-file-remove{
    position: absolute;
    right: 3px;
    top: 3px;
}

@media only screen and (max-width: 767px) {
    .theme-explorer-fas .table, .theme-explorer-fas .table tbody, .theme-explorer-fas .table tr, .theme-explorer-fas .table td {
        display: block;
        width: 100% !important;
    }

    .theme-explorer-fas .table {
        border: none;
    }

    .theme-explorer-fas .table tr {
        margin-top: 5px;
    }

    .theme-explorer-fas .table tr:first-child {
        margin-top: 0;
    }

    .theme-explorer-fas .table td {
        text-align: center;
    }

    .theme-explorer-fas .table .kv-file-content {
        border-bottom: none;
        padding: 4px;
        margin: 0;
    }

    .theme-explorer-fas .table .kv-file-content .file-preview-image {
        max-width: 100%;
        font-size: 20px;
    }

    .theme-explorer-fas .file-details-cell {
        border-top: none;
        border-bottom: none;
        padding-top: 0;
        margin: 0;
    }

    .theme-explorer-fas .file-actions-cell {
        border-top: none;
        padding-bottom: 4px;
    }

    .theme-explorer-fas .explorer-frame .explorer-caption {
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        left: 0;
        right: 0;
        margin: auto;
    }
}

/*noinspection CssOverwrittenProperties*/
.file-zoom-dialog .explorer-frame .file-other-icon {
    font-size: 22em;
    font-size: 50vmin;
}

*{
    margin:0;
    padding:0;
}

html,body {
    height: 100%;
    margin: 0;
}
body{
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size:14px;
    color:#333;
    background:#fff;
    margin:0;
    padding:0;
}

a,button{
    -webkit-transition:all 0.3s ease;
    -moz-transition:all 0.3s ease;
    transition:all 0.3s ease;
    outline:none;
}
h1,h2,h3,h4,h5,h6{
    margin:0;
}
p{
    padding:0;
    margin:0;
}
ul, li{
    list-style:none;
    padding:0;
    margin:0;

}
a,button{
    -webkit-transition:all 0.3s ease;
    -moz-transition:all 0.3s ease;
    transition:all 0.3s ease;
    outline:none;
    box-shadow:none;
    text-decoration:none;
}
a:hover{
    text-decoration:none;
}
.button .btn{
    font-weight:500;
    font-size:15px;
    height:45px;
    color:#888888;
    display:inline-block;
    line-height:45px;
    padding:0 45px 0 45px;
}
.button-head .button .btn{
    padding: 0px 20px 0 20px;
}

.btn {
    border:none;
    border-radius:0px;
}
.section{
    padding:30px 0 60px 0px;
}
.section_gray{
    background: #f6f6f6;
}
.section_white{
    background: #fff;
}
.section_blue{
    background: #007bff;
}
.section-title{
    text-align: center;
    margin-bottom: 40px;
    padding: 0 190px;
}
.section-title h1,.section-title h2{
    font-size:32px;
    font-weight: 500;
    /*text-transform:uppercase;*/
    padding-bottom:10px;
    margin-bottom:15px;
    position:relative;
}
.section-title h1:before,.section-title h2:before{
    content:"";
    width:100px;
    height:1px;
    position:absolute;
    bottom:-1px;
    margin-left:-50px;
    left:50%;
}
.section-title h1::after,.section-title h2::after {
    content: "";
    width: 12px;
    height: 12px;
    position: absolute;
    bottom: -6px;
    margin-left: -3px;
    left: 50%;
    transform: rotate(45deg);
}
.section-title p{
    font-size:15px;
    color:#6c7279;
}
.tlinks{text-indent:-9999px;height:0;line-height:0;font-size:0;overflow:hidden;}


/*breadcrumb*/
.breadcrumb{
    padding:70px 0;
    margin:0;
    background:url('img/breadgramb_bg.jpg');
    background-size:cover;
    background-repeat:no-repeat;
    position:relative;
}
.breadcrumb:before{
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background:#000;
    opacity:0.6;
    content:"";
}
.breadcrumb .breadcrumb-text{
    text-align:center;
}
.breadcrumb .breadcrumb-text h2{
    padding-bottom: 10px;
    color:#fff;
    text-transform:capitalize;
}
.breadcrumb .breadcrumb-text h2 span{
    color:#ED1C24;
    text-shadow:0px 0px 2px #fff;
}
.breadcrumb .breadcrumb-text ul {
    background: #fff3;
    display: inline-block;
    padding: 15px;
    border-radius: 2px;
}
.breadcrumb .breadcrumb-text ul li{
    display:inline-block;
}
.breadcrumb .breadcrumb-text ul li a{
    color:#fff;
    font-size:15px;
}
.breadcrumb .breadcrumb-text ul li a:hover{
    color:#edecec;
}
.breadcrumb .breadcrumb-text ul li i{
    color:#fff;
}

.slicknav_menu{
    display:none;
}

#scrollUp{
    bottom: 20px;
    right: 20px;
    padding: 10px 20px;
    color: #fff;
    font-size: 25px;
    width: 45px;
    height: 45px;
    text-align: center;
    line-height: 45px;
    padding: 0;
    border-radius:2px;
    box-shadow:0px 0px 3px #333;
    transform:rotate(-45deg);
    border-radius:100%;
}
#scrollUp:hover{
    background:#6f6f6f;
    color:#fff;
}

/* Preloader Animaion */
.color-plate {
    position: fixed;
    width: 200px;
    background: #fff;
    z-index: 9999;
    top: 50%;
    margin-top: --100px;
    box-shadow: -3px 0px 50px -2px rgba(0,0,0,0.14);
    right: -200px;
    -moz-transition: all 0.4s ease;
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease;
    padding: 20px;
}
.color-plate.active{
    right:0;
}
.color-plate .icon {
    position: absolute;
    left: -50px;
    width: 50px;
    height: 50px;
    text-align: center;
    line-height: 50px;
    font-size: 20px;
    color: #fff;
    cursor: pointer;
    top: 0;
}
.color-plate h2 {
    text-transform: capitalize;
    color: #000000b3;
    border-bottom: 3px solid #3336;
    padding-bottom: 10px;
    font-size: 20px;
}
.color-plate .color-head {
    margin-left: -10px;
}
.color-plate span {
    width: 40px;
    height: 30px;
    display: inline-block;
    margin-top: 10px;
    margin-left: 10px;
}
.color-plate span:hover{
    cursor:pointer;
}
.color-plate span.color1{
    background:#ed5409;
}
.color-plate span.color2{
    background:#ED1C24;
}
.color-plate span.color3{
    background:#16A085;
}
.color-plate span.color4{
    background:#FF9800;
}
.color-plate span.color5{
    background:#FF6853;
}
.color-plate span.color6{
    background:#82B440;
}
.color-plate span.color7{
    background:#36BFC4;
}
.color-plate span.color8{
    background:#4CAF50;
}
.color-plate span.color9{
    background:#8e44ad;
}
.color-plate span.color10{
    background:#1DABB8;
}

/*============================
    Header CSS
==============================*/
.header{
    background:#fff;
    z-index:999999;
}
#header .header-inner.sticky{
    z-index:99999;

}
#header .navbar-collapse{
    padding:0;
}

#header .header-inner {
    z-index:999;
    height: 80px;
    background:#fff;
    border-bottom: 1px solid #eee;

}

/* Sticky */
#header .sticky {
    position: fixed;
    width: 100%;
    top: 0;
    animation: fadeInDown 0.8s both 0s;
}

#header .navbar{
    color: #333;
    width: 100%;
}

#header a{
    color: #333;
}

#header .navbar a:hover{
    color: #007bff;
}

#header .navbar-brand{margin-right: 30px;}
#header .navbar-brand img{display: inline-block; margin-right: 10px;}

#header .dropdown-menu{
    width: 100%;
    background-color: #fff;
}

#header .menu-large {
    position: static !important;
}

#header .dropdown-menu li.mega-sub{
    float:left;
    border-right:1px dashed #d7d7d7;
    margin-bottom:20px;
    margin-top:20px;
    max-width: 220px;
    width: 100%;
    padding:5px 0 30px 0;
}
#header .dropdown-menu li.mega-sub h4{
    font-size: 14px;
    color: #747475;
    font-weight: 700;
    margin-bottom: 15px;
    padding-left: 15px;
}

#header .dropdown-menu li.mega-sub ul li{
    padding: 6px 0;
}

#header .dropdown-menu li.mega-sub ul li a{
    color: #2b2a2f;
    padding: 6px 0 6px 50px;
    font-size: 14px;
}
#header .dropdown-menu li.mega-sub ul li a:hover{
    color: #007bff;
}
#header .dropdown-menu li.mega-sub ul li:hover{
    background-color: #f6f6f6;
}

#header .dropdown-menu a.pdf_to_word{
    background:url(../img/tools/convert-pdf-to-word.png) no-repeat 15px center;
    background-size: 25px 25px;
}
#header .dropdown-menu a.pdf_to_excel{
    background:url(../img/tools/convert-pdf-to-excel.png) no-repeat 15px center;
    background-size: 25px 25px;
}
#header .dropdown-menu a.pdf_to_ppt{
    background:url(../img/tools/convert-pdf-to-ppt.png) no-repeat 15px center;
    background-size: 25px 25px;
}
#header .dropdown-menu a.pdf_to_jpg{
    background:url(../img/tools/convert-pdf-to-jpg.png) no-repeat 15px center;
    background-size: 25px 25px;
}
#header .dropdown-menu a.word_to_pdf{
    background:url(../img/tools/convert-word-to-pdf.png) no-repeat 15px center;
    background-size: 25px 25px;
}
#header .dropdown-menu a.excel_to_pdf{
    background:url(../img/tools/convert-excel-to-pdf.png) no-repeat 15px center;
    background-size: 25px 25px;
}
#header .dropdown-menu a.ppt_to_pdf{
    background:url(../img/tools/convert-ppt-to-pdf.png) no-repeat 15px center;
    background-size: 25px 25px;
}
#header .dropdown-menu a.jpg_to_pdf{
    background:url(../img/tools/convert-jpg-to-pdf.png) no-repeat 15px center;
    background-size: 25px 25px;
}
#header .dropdown-menu a.pdf_protect{
    background:url(../img/tools/protect-pdf.png) no-repeat 15px center;
    background-size: 25px 25px;
}
#header .dropdown-menu a.pdf_unlock{
    background:url(../img/tools/unlock-pdf.png) no-repeat 15px center;
    background-size: 25px 25px;
}
#header .dropdown-menu a.pdf_merge{
    background:url(../img/tools/merge-pdf.png) no-repeat 15px center;
    background-size: 25px 25px;
}
#header .dropdown-menu a.pdf_split{
    background:url(../img/tools/split-pdf.png) no-repeat 15px center;
    background-size: 25px 25px;
}
#header .navbar .navbar-nav{
    width: 100%;
}
#header .navbar li.login
{
    /*float: right;*/
    position: absolute;
    right: 10px;
}
#header .navbar li.login-success
{
    /*float: right;*/
    position: absolute;
    right: 10px;
}
#header .navbar li.login-success a img
{
    margin-right: 10px;
}
#header .navbar li.register
{
    float: right;
}

#header .navbar li.register a{
    color: #007bff;
    border: 1px solid #007bff;
    border-radius: 20px;
    padding: 4px 30px;
    font-size: 12px;
    display:inline-block;
    overflow:hidden;
    margin-top: 5px;
}
#header .navbar li.register a:hover{
    background-color: rgba(0, 125, 255, 0.75);
    color:#fff;
}



/*===================
    End Header CSS
=====================*/

/*
* ----------------------------------------------------------------------------------------
* START TOOLS DESIGN
* ----------------------------------------------------------------------------------------
*/
.single_tools {
    background: #fff none repeat scroll 0 0;
    border-bottom: 1px solid #e8e8e9;
    border-right: 1px solid #e8e8e9;
    padding: 30px 20px;
    transition: all 0.4s ease 0s;
    text-align: center;
    position: relative;
}
.single_tools:last-child { border-right: 0px }
.single_tools:hover {box-shadow:0 3px 45px 0 rgba(0, 0, 0, 0.2);z-index:999; }
.single_tools img {
    display: inline-block;
    font-size: 24px;
    height: 60px;
    line-height: 60px;
    margin: 0 0 54px 0;
    text-align: center;
    text-decoration: none;
    transition: all 0.5s ease-in-out 0s;
    width: 60px;
}
.color-one{background: #2a80b9 none repeat scroll 0 0;}
.color-two{background: #f72459 none repeat scroll 0 0;}
.color-three{background: #8f44ad none repeat scroll 0 0;}
.color-four{background: #7ab55c none repeat scroll 0 0;}
.single_tools a {
    color: #333;
    font-weight: 700;
    /*text-transform: uppercase;*/
    letter-spacing: 1px;
    transition: all 0.5s ease-in-out 0s;
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding-top: 110px;
    cursor: pointer;
}
.single_tools p {
    -webkit-transition: all 0.2s ease-in-out 0s;
    transition: all 0.2s ease-in-out 0s;
    color: #333;

}
.single_tools:hover img {
    transform: scale(1.1);
}
/*
* ----------------------------------------------------------------------------------------
* END TOOLS  DESIGN
* ----------------------------------------------------------------------------------------
*/

/*===================
    FAQ
=====================*/

.accordion-heading .accordion-toggle {
    display: block;
    cursor: pointer;
    border-top: 1px solid #F5F5F5;
    padding: 6px 0;
    line-height: 28.75px;
    color: #1a1a1a;
    background-color: #f6f6f6;
    outline: none !important;
    text-decoration: none;
}

.accordion-heading .accordion-toggle i{
    font-weight: 600;
    color: #007bff;
    margin-right: 6px;
}

.accordion-body .accordion-inner{
    background: #fff;
    padding: 30px 15px;
    color: #666;
}

/*===================
    End FAQ
=====================*/


/*===================
	Slider CSS
=====================*/
#slider{
    position:relative;
}
#slider .single-slider{
    height:630px;
    background-size:cover;
    background-position:center;
}
#slider .single-slider:before{
    position:absolute;
    content:"";
    left:0;
    top:0;
    height:100%;
    width:100%;
    background:#000;
    opacity:0.9;
}
#slider .single-slider .text{
    margin-top:150px;
    text-align:center;
}
#slider .single-slider h1{
    color:#fff;
    font-size:60px;
    font-weight:600;
    line-height:75px;
    text-transform:capitalize;
}
#slider .single-slider h2{
    color:#fff;
    font-size:20px;
    font-weight:600;
    line-height:40px;
    margin-bottom: 15px;
    text-transform:capitalize;
}
#slider .single-slider p {
    color: #fff;
    margin: 5px 0px;
    font-weight: 300;
    font-size: 14px;
    padding: 0;
}

#slider .button-head{
    text-align:center;
}

#slider .rc img{
    width: 120px;
    height: 120px;
    margin-top: 10px;
}

#slider .button{
    margin-top:20px;
    text-align:center;
    display:inline-block;
    position:relative;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}


#slider .button .btn::before {
    position: absolute;
    content: "";
    right: 0;
    bottom: 0;
    height: 2px;
    width: 40px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
#slider .button:hover .btn::before{
    width: 100%;
}
#slider .button .btn:after{
    position:absolute;
    content:"";
    right:0;
    bottom:0;
    height:30px;
    width:2px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;

}
#slider .button:hover .btn::after{
    height: 100%;
}
#slider .button span::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    height: 2px;
    width: 40px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
#slider .button:hover span::before{
    width: 100%;
}
#slider .button span::after {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    height: 30px;
    width: 2px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
#slider .button:hover span::after{
    height: 100%;
}

#slider .single-slider #particles-js{
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
}
.hero-area.animate-text .cd-headline .cd-words-wrapper {
    padding: 0;
    font-weight: 400;
}
.cd-words-wrapper{
    top:-13px;
}
.cd-headline.clip .cd-words-wrapper::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 2px;
    height: 100%;
    background-color: #fff;
}

/*=========================
	features CSS
===========================*/
#features{}
#features .feature-left{}
#features .feature-left img {
    height: 368px;
    width: 100%;
    margin-top: 30px;
}
#features .feature-right{}
#features .single-right{
    position:relative;
    margin-top:30px;
}
#features .single-right i{
    font-size:26px;
    position:absolute;
    left:50px;
    top:0;
    height:64px;
    width:64px;
    line-height:64px;
    border:1px solid #ddd;
    border-radius:100%;
    text-align:center;
    transition:all 0.4s ease;
}
#features .single-right:hover i{
    transform:scale(1.1);
    border-color:transparent;
}
#features .single-right .right-content{
    margin-left:133px;
}
#features .single-right .right-content h3{
    font-size: 22px;
    color: #000;
    margin: 0;
    padding: 0;
}
#features .single-right .right-content p{
    color:#989898;
}

/*=========================
    End features CSS
===========================*/

/*=========================
    introduction CSS
===========================*/

#introduction img{
    height: 368px;
    width: 100%;
    margin-top: 10px;
}

.introduction-left{
    padding: 50px 0 0 0;
}

#introduction p{ margin: 30px 0 0 0; }

/*=========================
    End introduction CSS
===========================*/

/*===================
    Start Upload Css
=====================*/
.file-type{ padding: 10px; }
#config-info{
    padding: 10px 0;
    font-size: 18px;
    /*color: rgba(0,0,0,.5);*/
    color: #333;
}
#config-info .dst-title{padding-right: 15px;}
#config-info .dst-note{ color: #333; font-size: 16px; }
.operation-status{  }
.soft-down{ margin-top: 15px;}
/*===================
    End Upload Css
=====================*/


/*===================
    Start pdf-features Css
=====================*/

.pdf-features {
    margin-bottom: 50px;
}
.pdf-features-content {
    padding: 0 15px;
    margin-top: 20px;
    color: #6c7279;
    font-weight: 400;
}
.pdf-features .fa {
    color: #666;
    font-size: 36px;
    padding-left: 15px;
}
.pdf-features-content h4 {
    font-size: 16px;
    color: #2d3033;
    /*text-transform: uppercase;*/
    font-weight: 700;
    margin-bottom: 10px;
}
.pdf-features-content p{
    font-size: 14px;
    line-height: 22.4px;
    /*color: #6c7279;*/
    color: #333;
}

/*===================
    End pdf-features Css
=====================*/

/* procedure Section
--------------------------------*/
#procedure {
    padding: 60px 0 60px 0;
}

#procedure .about-img {
    overflow: hidden;
}

#procedure .about-img img {
    margin-left: -15px;
    max-width: 100%;
}

@media (max-width: 768px) {
    #procedure .about-img {
        height: auto;
    }
    #procedure .about-img img {
        margin-left: 0;
        padding-bottom: 30px;
    }
}

#procedure .content h2{
    color: #555;
    font-weight: 700;
    font-size: 26px;
    line-height: 26px;
    margin: 0 0 20px 0;

}

#procedure .content p {
    line-height: 26px;
    margin: 0 0 20px 0;
    /*color: #6c7279;*/
    color: #333;
}

#procedure .content p:last-child {
    margin-bottom: 0;
}

#procedure .content i {
    padding-right: 4px;
    color: #888;
}

#procedure .content ul {
    list-style: none;
    padding: 0;
}

#procedure .content ul li {
    padding: 5px 0;
}



/*=========================
	services CSS
===========================*/
#Services{
    background:#fff;
}
#Services .single-service {
    padding: 20px;
    background: #F6F6F6;
    margin-top: 30px;
    text-align: center;
    transition: all 0.6s ease;
    position:relative;
    box-shadow: 0px 0px 7px #0003;
}

#Services .single-service i {
    font-size: 32px;
    color: #fff;
    height: 66px;
    width: 66px;
    line-height: 66px;
    border-radius: 100%;
    transition:all 0.4s ease;
}
#Services .single-service h3::before {
    position: absolute;
    content: "";
    left: 50%;
    top: 27px;
    border: 2px solid;
    height: 54px;
    width: 54px;
    border-radius: 100%;
    margin-left: -27px;
    transition:all 0.4s ease;
}
#Services .single-service:hover h3::before{
    top: 13px;
    height: 80px;
    width: 80px;
    margin-left: -40px;
}


#Services .single-service h3{
    margin:20px 0px;
    color:#5c5e5f;
}

#Services .single-service p{
    color:#9f9f9f;
}


/*=========================
	End services CSS
===========================*/



/*===================
	Latest Works CSS
=====================*/
.latest-works{

}
.latest-works .works-menu{
    text-align:center;
    padding-top:10px;
    padding-bottom:80px;
}
.latest-works .works-menu ul{}
.latest-works .works-menu ul li {
    font-size: 15px;
    color: #888;
    display: inline-block;
    margin-right: 35px;
}

.latest-works .works-menu ul li:hover:before,.latest-works .works-menu ul li.active:before{
    left:50%;
    opacity:1;
    visibility:visible;
}
.latest-works .works-menu ul li:hover,.latest-works .works-menu ul li.active{
    cursor:pointer;
}
.latest-works .works-menu ul li:last-child{
    margin:0;
}

.latest-works .single-work{
    position:relative;
    margin-bottom:30px;
    overflow:hidden;
}
.latest-works .single-work:before{
    position:absolute;
    left:0;
    top:0;
    height:100%;
    width:100%;
    content:"";
    background:#000;
    opacity:0;
    visibility:hidden;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
    z-index:99;
}
.latest-works .single-work:hover:before{
    opacity:0.8;
    visibility:visible;
}
.latest-works .single-work img{
    width:100%;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
.latest-works .single-work:hover img{
    transform:scale(1.1);
    z-index:-2;
}
.latest-works .single-work .works-hover{
    text-align:center;
    position:absolute;
    top:-130px;
    left:0;
    width:100%;
    height:100%;
    padding:30px;
    opacity:0;
    visibility:hidden;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
    z-index:999;
}
.latest-works .single-work:hover .works-hover{
    top:50px;
}
.latest-works .single-work:hover .works-hover{
    opacity:1;
    visibility:visible;
}
.latest-works .single-work .works-hover h4 {
    color: #fff;
    font-size: 18px;
    margin-bottom: 20px;
}

.latest-works .single-work .works-hover a{
    margin-right:10px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}

.latest-works .single-work .works-hover a i{
    color:#fff;
    font-size: 25px;
    border:1px solid #fff;
    padding: 5px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}

.latest-works .button-head{
    text-align:center;
}

.latest-works .button{
    margin-top:55px;
    text-align:center;
    display:inline-block;
    position:relative;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
.latest-works .button .btn{
    color:#333333b3;
}


.latest-works .button .btn::before {
    position: absolute;
    content: "";
    right: 0;
    bottom: 0;
    background: #333333b3;
    height: 2px;
    width: 40px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
.latest-works .button:hover .btn::before{
    width: 100%;
}
.latest-works .button .btn:after{
    position:absolute;
    content:"";
    right:0;
    bottom:0;
    background:#333333b3;
    height:30px;
    width:2px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;

}
.latest-works .button:hover .btn::after{
    height: 100%;
}
.latest-works .button span::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    background: #333333b3;
    height: 2px;
    width: 40px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
.latest-works .button:hover span::before{
    width: 100%;
}
.latest-works .button span::after {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    background: #333333b3;
    height: 30px;
    width: 2px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
.latest-works .button:hover span::after{
    height: 100%;
}

/*=======================
    End Latest Works CSS
=========================*/


/* single-pf*/


#single-pf{
    background:#fff;
}

#single-pf .news-head{
    float:left;
    overflow:hidden;
    background:#F6F6F6;
}
#single-pf .single-news{
    background:#F6F6F6;
    border:1px solid #eeeeee;
    float:right;
    margin-bottom: 40px;
}
#single-pf .single-news img {
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
    height: 400px;
    width: 500px;

}
#single-pf .single-news img:hover{
    transform:scale(1.1);
}

#single-pf .single-news .news-body {
    padding: 30px;
    margin-top: 15px;
    position: relative;
    margin-left: 500px;
    background:#F6F6F6;
}

#single-pf .single-news .news-body h2 {
    font-size: 18px;
    margin-top: -20px;
    text-transform: capitalize;
    margin-bottom: 15px;
}
#single-pf .single-news .news-body h2 a{
    text-decoration:none;
    color:#333333e6;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}

#single-pf .single-news .news-body h5{
    color:#555;
    text-transform:capitalize;
}
#single-pf .single-news .news-body span{
    display:block;
    color:#3339;
    margin:10px 0;
    text-transform:capitalize;
}
#single-pf .single-news .news-body span i {
    color:#333c;
    margin-right: 10px;
    font-size: 16px;
}

#single-pf .single-news .news-body span a:hover{
    color:#333c;
}
#single-pf .single-news .news-body p{
    color:#999;
    margin-bottom:25px;
}
#single-pf .single-news .news-body .btn {
    padding: 0;
    margin-top: 48px;
    font-size: 15px;
    text-transform: uppercase;
}
#single-pf .single-news .news-body .btn:hover{
    color:#999
}
#single-pf .single-news .news-body .btn i{
    margin-left:5px;
    font-size:16px;
}



#single-ab .contact-list{
    padding-top: 15px;
}
#single-ab .contact-list div{
    width: 180px;
    text-align: center;
}
#single-ab .contact-list img{
    width: 150px;
    height: 150px;
}
#single-ab .news-body .contact-list p{
    margin: 0;
}


#single-pf .owl-nav{
    margin: 0;
    position: absolute;
    top: 0%;
    width: 100%;
    margin-top:-50px;
    z-index:99999;

}
#single-pf .owl-nav button {
    height: 40px;
    width: 100px;
    line-height: 40px;
    background: #333;
    color: #fff;
    font-size: 12px;
    position: absolute;
    margin: 0;
    font-weight:600;
}


#single-pf .owl-nav button:hover{
    color:#fff;
}
#single-pf .owl-nav .owl-prev {
    left:0;
}
#single-pf .owl-nav .owl-next{
    right:0;
}
/*===================
    End single-pf
=====================*/


/* single-ab*/
#single-ab{
    /*background:#fff;*/
}

#single-ab .news-head{
    padding-top: 20px;
}
#single-ab .news-body{
    margin-bottom: 40px;
}
#single-ab .news-head img {
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
    width: 450px;
    height: 360px;
}
#single-ab .news-head img:hover{
    transform:scale(1.1);
}

#single-ab .news-body {
    padding: 30px;
    margin-top: 15px;
    /*background:#F6F6F6;*/
}

#single-ab .news-body h1{
    font-size: 34px;
    margin-top: -20px;
    text-transform: capitalize;
    margin-bottom: 15px;
}

#single-ab .news-body h2 {
    font-size: 18px;
    margin-top: -20px;
    text-transform: capitalize;
    margin-bottom: 15px;
}
#single-ab .news-body h2 a{
    text-decoration:none;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}

#single-ab .news-body h5{
    color:#555;
    text-transform:capitalize;
}
#single-ab .news-body span{
    display:block;
    color:#3339;
    margin:10px 0;
    /*text-transform:capitalize;*/
}
#single-ab .news-body span i {
    color:#333c;
    margin-right: 10px;
    font-size: 16px;
}

#single-ab .news-body span a:hover{
    color:#333c;
}
#single-ab .news-body p{
    color:#333;
    margin-bottom:25px;
}
#single-ab .news-body .btn {
    padding: 0;
    margin-top: 48px;
    font-size: 15px;
    text-transform: uppercase;
}
#single-ab .news-body .btn:hover{
    color:#999
}
#single-ab .news-body .btn i{
    margin-left:5px;
    font-size:16px;
}


#single-ab .owl-nav{
    margin: 0;
    position: absolute;
    top: 0%;
    width: 100%;
    margin-top:-50px;
    z-index:99999;

}
#single-ab .owl-nav button {
    height: 40px;
    width: 100px;
    line-height: 40px;
    background: #333;
    color: #fff;
    font-size: 12px;
    position: absolute;
    margin: 0;
    font-weight:600;
}


#single-ab .owl-nav button:hover{
    color:#fff;
}
#single-ab .owl-nav .owl-prev {
    left:0;
}
#single-ab .owl-nav .owl-next{
    right:0;
}
/*===================
    End single-ab
=====================*/


/*===================
	Testimonials
=====================*/
#testimonials{
    background-image:url('img/testi-bg.jpg');
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    position:relative;
}
#testimonials .bg:before{
    position:absolute;
    content:"";
    left:0;
    top:0;
    height:100%;
    width:100%;
    background:#000;
    opacity:0.9;
}
#testimonials .single-testimonial{
    padding:0 185px;
    text-align:center;
    position:relative;
}
#testimonials .single-testimonial img {
    height: 65px;
    width: 65px;
    border-radius: 100%;
    border: 3px solid #fff;
    margin-bottom: 10px;
    position: absolute;
    left: 50%;
    top: -70px;
    margin-left: -34px;
}
#testimonials .single-testimonial h2 {
    color: #fff;
    font-size: 33px;
    margin-bottom: 10px;
    margin-top: 70px;
    font-weight: 400;
}
#testimonials .single-testimonial p{
    color:#c8c7c7;
    font-size:14px;
    text-transform:capitalize;
    position:relative;
    font-weight:300;

}
#testimonials .single-testimonial p i {
    margin-right: 10px;
    font-size: 16px;
}
#testimonials .single-testimonial p .fa {
    margin:0px 10px;
}
#testimonials .single-testimonial span{
    margin-top:15px;
    color:#c8c7c7;
    font-size:14px;
    display:block;
}
#testimonials .owl-dots {
    z-index: 333;
    left: 50%;
    width: 100%;
    text-align: center;
    margin-top: 30px;
}
#testimonials .owl-dots button{
    width: 15px;
    height: 8px;
    background: #fff;
    margin-right: 5px;
    border:1px solid transparent;
}
#testimonials .owl-dots button.active{
    background:transparent;
    border-color:#fff;
}
#testimonials .owl-dots button span{
}
/*===================
	End Testimonials
=====================*/

/*===================
	resources
=====================*/

#resources{}
#resources .single-news{
    background:#faf9f9;
    border:1px solid #eeeeee;
}
#resources .single-news img{
    width:100%;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
#resources .single-news{
    position:relative;
}

#resources .single-news .news-body {
    padding: 30px;
    margin-top: 15px;
}

#resources .single-news .news-body .date {
    color: #fff;
    position: absolute;
    left: 0;
    top: 272px;
    padding: 8px 8px;
    font-size: 17px;
}
#resources .single-news .news-body .date span {
    display: block;
    color: #fff;
    text-transform: uppercase;
    padding: 0;
    margin: 0;
}
#resources .single-news .news-body .title {
    margin-left: 40px;
    margin-top: -13px;
}
#resources .single-news .news-body .title span{
    display:inline-block;

}
#resources .single-news .news-body .title .user{
    font-size:14px;
    text-transform:capitalize;
}
#resources .single-news .news-body .title .user i{
    font-size:14px;
    margin-right:5px;
}
#resources .single-news .news-body .title .comment{
    font-size:14px;
    margin-left:10px;
    text-transform:capitalize;
}
#resources .single-news .news-body .title .comment i{
    margin-right:5px;
}

#resources .single-news .news-body h2 {
    font-size: 18px;
    margin-left: 40px;
    margin-top: -20px;
    /*text-transform:capitalize;*/

}
#resources .single-news .news-body h2 a{
    text-decoration:none;
    color:#333333e6;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}

#resources .single-news .news-body span{
    display:block;
    color:#bbb;
    margin:20px 0;
}
#resources .single-news .news-body p{
    color:#333;
    margin-bottom:25px;
}
#resources .single-news .news-body .btn{
    padding:0;
}
#resources .single-news .news-body .btn:hover{
    color:#999
}
#resources .single-news .news-body .btn i{
    margin-left:5px;
}



#resources .button-head{
    text-align:center;
}

#resources .button{
    margin-top:55px;
    text-align:center;
    display:inline-block;
    position:relative;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
#resources .button .btn{
    color:#333333b3;
}


#resources .button .btn::before {
    position: absolute;
    content: "";
    right: 0;
    bottom: 0;
    background: #333333b3;
    height: 2px;
    width: 40px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
#resources .button:hover .btn::before{
    width: 100%;
}
#resources .button .btn:after{
    position:absolute;
    content:"";
    right:0;
    bottom:0;
    background:#333333b3;
    height:30px;
    width:2px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;

}
#resources .button:hover .btn::after{
    height: 100%;
}
#resources .button span::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    background: #333333b3;
    height: 2px;
    width: 40px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
#resources .button:hover span::before{
    width: 100%;
}
#resources .button span::after {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    background: #333333b3;
    height: 30px;
    width: 2px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
#resources .button:hover span::after{
    height: 100%;
}


/* resources Single*/


#resources-single{}
#resources-single .single-news{
    background:#faf9f9;
    border:1px solid #eeeeee;

    margin-bottom: 40px;
}
#resources-single .single-news img{
    width:100%;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}

#resources-single .single-news .news-body {
    padding: 30px;
    margin-top: 15px;
    position: relative;
}

#resources-single .single-news .news-body .date {
    color: #fff;
    position: absolute;
    left: 0;
    top:7px;
    padding: 8px 8px;
    font-size: 17px;
}
#resources-single .single-news .news-body .date span {
    display: block;
    color: #fff;
    text-transform: uppercase;
    padding: 0;
    margin: 0;
}
#resources-single .single-news .news-body .title {
    margin-left: 40px;
    margin-top: -13px;
}
#resources-single .single-news .news-body .title span{
    display:inline-block;

}
#resources-single .single-news .news-body .title .user{
    font-size:14px;
    text-transform:capitalize;
}
#resources-single .single-news .news-body .title .user i{
    font-size:14px;
    margin-right:5px;
}
#resources-single .single-news .news-body .title .comment{
    font-size:14px;
    margin-left:10px;
    text-transform:capitalize;
}
#resources-single .single-news .news-body .title .comment i{
    margin-right:5px;
}

#resources-single .single-news .news-body h2 {
    font-size: 18px;
    margin-left: 40px;
    margin-top: -20px;
    text-transform:capitalize;

}
#resources-single .single-news .news-body h2 a{
    text-decoration:none;
    color:#333333e6;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}


#resources-single .single-news .news-body span{
    display:block;
    color:#bbb;
    margin:20px 0;
}
#resources-single .single-news .news-body p{
    color:#333;
    margin-bottom:25px;
}
#resources-single .single-news .news-body .btn{
    padding:0;
}
#resources-single .single-news .news-body .btn:hover{
    color:#999
}
#resources-single .single-news .news-body .btn i{
    margin-left:5px;
}
#resources-single .single-news .news-body .tags {
    margin-top: 15px;
    font-size: 18px;
    text-transform: capitalize;
    color: #666;
}
#resources-single .single-news .news-body .tags li{
    display:inline-block;
    margin-left:5px;
    text-transform:capitalize;
}

#resources-single .single-news .news-body .tags li a {
    font-size: 15px;
    font-weight:300;
}
#resources-single .single-news .news-body .tags li a:hover{
    color:#999;
}

#resources-single .single-news .privacy-agreement h5{
    margin: 8px 0;
}

#resources-single .single-news .privacy-agreement ul{
    margin: 0;
    padding: 10px 0 10px 16px;
}

#resources-single .single-news .privacy-agreement p{
    margin-bottom: 20px;
}

#resources-single .single-news .privacy-agreement p.nb{
    margin-bottom: 0;
}

#resources-single .pagination-head{
    text-align:center;
}
#resources-single .pagination{
    text-align:center;
}
#resources-single .pagination ul{
    border:1px solid #666;
}
#resources-single .pagination ul li{
    display:inline-block;
    border-right:1px solid #666;


}

#resources-single .pagination ul li:last-child{
    border:none;
}
#resources-single .pagination ul li a{
    color:#666;
    text-transform:capitalize;
    display:block;
    padding: 10px 20px;
    font-weight:600;

}
#resources-single .pagination ul li i{
    margin:0px 5px;
}


/*===================
	Fun Facts CSS
=====================*/
.fun-facts{
    text-align:center;
    margin-top:30px;
    background-image:url('img/fun-bg.jpg');
    position:relative;
}
.fun-facts .bf-color:before{
    position:absolute;
    content:"";
    left:0;
    top:0;
    height:100%;
    width:100%;
    background:#000;
    opacity:0.9;

}
/* single-fun */
.fun-facts .single-fun{
    transition:all 0.4s ease;
    padding: 28px;
    background:#FFFFFF4D;
    text-align: center;
}

.fun-facts .single-fun i {
    font-size: 52px;
    color: #fff;
    display: block;
    margin-bottom: 14px;
    line-height: 80px;

}

.fun-facts .single-fun span{
    color:#fff;
    font-weight:600;
    font-size:30px;

}
.fun-facts .single-fun p{
    color:#fff;
    font-size:15px;
}

/*===================
	End Fun
=====================*/


/*===================
	Team
=====================*/
#team{}

/* single-team */
#team .single-team {
    margin-top: 30px;
    overflow: hidden;
    box-shadow: 0px 0px 10px #0000001a;
    padding: 10px;
}
#team .team-head{
    position:relative;
}
#team .team-head:before{
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background:#000;
    opacity:0;
    visibility:hidden;
    content:"";
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
#team .single-team:hover .team-head:before{
    opacity:0.8;
    visibility:visible;
}
#team .team-head{
    position:relative;
    overflow:hidden;
}
#team .team-head img{
    width:100%;
}

#team .team-hover{
    position:absolute;
    top:0;
    width:100%;
    height:100%;
    padding: 65px 15px;
    text-align:center;
    opacity:0;
    visibility:hidden;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
#team .single-team:hover .team-hover{
    opacity:1;
    visibility:visible;
}
/* single-team social */
#team .team-hover .social {
    margin-top: -105px;
}
#team .team-hover .social li {
    margin-right: 8px;
    margin-left: -66px;
    transition: all 0.4s ease;
    display: inline-block;
    margin-top: 168px;
}
#team .single-team:hover .social li{
    margin-left: 0px;
}
#team .team-hover .social li a{
    color:#503723;
    background:#fff;
    width:30px;
    height:30px;
    line-height:30px;
    display:block;
}
#team .team-hover .social li a:hover{
    color:#fff;
}
#team .t-name{
    margin-top:25px;
    text-align:center;
}
#team .t-name h4{
    font-size:21px;
    text-transform:capitalize;
}
#team .t-name h4 span{
    display:block;
    font-weight:400;
    margin-top:10px;
    color:#888888;
    font-size:14px;
}
/*===================
	End Team
=====================*/



/*=======================
  P Table4 CSS
=========================*/

.p-table4{
    background:#F0EDED;
}
.p-table4 .single-table{
    text-align:center;
    box-shadow: 0px 0px 7px #0003;
    background:#FFFFFF;
    overflow:hidden;
    transition:all 0.4s ease;
    margin-top:85px;

}
.p-table4 .table-head{}
.p-table4 .table-head .title-head{



}
.p-table4 .table-head h2.medium{

    color:#000428;
}
.p-table4 .table-head h2 {
    background-color:#000428;

    color:#fff;
    padding: 40px 0px;
    text-transform:uppercase;

}
.p-table4 .table-head .price {
    background-color: #000428;
    top: 52px;
    padding-bottom:135px;

}
.p-table4 .table-head .amount {
    color: #fff;
    font-size: 42px;
    font-weight: 600;
    border-radius: 100%;
    border: 1px solid ;
    height: 140px;
    width: 140px;
    line-height: 140px;
    -webkit-transition: all 2s ease;
    -moz-transition: all 2s ease;
    transition: all 2s ease;
    position: absolute;
    top: 173px;
    left: 50%;
    margin-left: -70px;
}
.p-table4 .single-table:hover .table-head .price .amount{
    transform:scale(1.03);
}

.p-table4 .table-head .price .amount span{
    font-weight:300;
}
.p-table4 .single-table .table-list {

}

.p-table4 .single-table .table-list{}
.p-table4 .single-table .table-list li{
    padding:10px 0px;
    color:#727272;
    border-bottom:1px solid #ebebeb;
}

.p-table4 .single-table .table-list i{
    margin-right:5px;
}

.p-table4 .button-head{
    text-align:center;
}

.p-table4 .button{
    margin:20px 0px;
    text-align:center;
    display:inline-block;
    position:relative;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
.p-table4 .button .btn{
    text-transform:capitalize;
}
.p-table4 .button .btn i{
    margin-right:10px;
}

.p-table4 .button .btn::before {
    position: absolute;
    content: "";
    right: 0;
    bottom: 0;
    height: 2px;
    width: 0px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
.p-table4 .button:hover .btn::before{
    width: 100%;
}
.p-table4 .button .btn:after{
    position:absolute;
    content:"";
    right:0;
    bottom:0;
    height: 100%;
    width:2px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;

}

.p-table4 .button span::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    height: 2px;
    width: 0px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
.p-table4 .button:hover span::before{
    width: 100%;
}
.p-table4 .button span::after {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    height: 100%;
    width: 2px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}


/*===================
	Error Page
=====================*/
.error {
    background: #fff;
}
.error .error-inner {
    text-align: center;
    padding: 0 280px;
    position:relative;
}
.error .error-inner .wrong {
    position: absolute;
    left: 409px;
    top: 195px;
    height: 40px;
    width: 40px;
}
.error .error-left{
    margin-top:50px;
}
.error .error-left p {
    color: #333;
    font-size: 21px;
}
.error .error-left p span{
    font-weight: 700;
    font-size: 35px;
    margin-right:5px;
}
.error .error-left .p2{
    color: #333;
    margin-top:20px;
    font-weight: 600;
    font-size:15px;
}
.error .error-left h2 {
    font-size: 125px;
    font-weight: 700;
}

.error .error-left .button-head{

}

.error .error-left .button{
    margin-top:40px;
    text-align:center;
    display:inline-block;
    position:relative;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}


.error .error-left .button .btn::before {
    position: absolute;
    content: "";
    right: 0;
    bottom: 0;
    height: 2px;
    width: 40px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
.error .error-left .button:hover .btn::before{
    width: 100%;
}
.error .error-left .button .btn:after{
    position:absolute;
    content:"";
    right:0;
    bottom:0;
    height:30px;
    width:2px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;

}
.error .error-left .button:hover .btn::after{
    height: 100%;
}
.error .error-left .button span::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    height: 2px;
    width: 40px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
.error .error-left .button:hover span::before{
    width: 100%;
}
.error .error-left .button span::after {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    height: 30px;
    width: 2px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
.error .error-left .button:hover span::after{
    height: 100%;
}
.error .error-left .btn i{
    margin-right:10px;
}
.error .error-right{}
.error .error-right img{}


/*===================
	End Error Page
=====================*/


/*===================
	mail success Page
=====================*/
.mail-success{}
.mail-success .mail-head{
    text-align:center;
}
.mail-success .mail-head h2 {
    font-weight: 600;
    margin-top: 10px;
}
.mail-success .mail-head h2 span img {
    height: 50px;
    width: 50px;
    margin-right: 12px;
    margin-top: -8px;
}
.mail-success .mail-head img{
    height: 150px;
    width: 150px;
}
.mail-success .mail-head .btn i{
    margin-right:10px;
}
.mail-success .mail-head .button{
    margin-top:40px;
    text-align:center;
    display:inline-block;
    position:relative;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}



.mail-success .mail-head .button .btn::before {
    position: absolute;
    content: "";
    right: 0;
    bottom: 0;
    height: 2px;
    width: 40px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
.mail-success .mail-head .button:hover .btn::before{
    width: 100%;
}
.mail-success .mail-head .button .btn:after{
    position:absolute;
    content:"";
    right:0;
    bottom:0;
    height:30px;
    width:2px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;

}
.mail-success .mail-head .button:hover .btn::after{
    height: 100%;
}
.mail-success .mail-head .button span::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    height: 2px;
    width: 40px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
.mail-success .mail-head .button:hover span::before{
    width: 100%;
}
.mail-success .mail-head .button span::after {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    height: 30px;
    width: 2px;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
.mail-success .mail-head .button:hover span::after{
    height: 100%;
}

/*===================
	End mail success Page
=====================*/









#gmap{
    background:#333;
}

#gmap #map{
    width: 100%;
    height: 400px;
}


/*===================
	About US CSS
=====================*/
.skill{}
.skill h2 {
    font-size: 25px;
    margin-bottom: 20px;
}
.skill p {
    margin-bottom: 10px;
}
.skill .button .btn {
    color: #fff;
}
.skill .button .btn{
    background:#ED1C24;
}
.skill .button .btn:hover{
    background:#333;
}

.skill .progress .progress-bar{
    background:#ED1C24;
}

.skill .skill-title h4 {
    font-size: 16px;
    margin-bottom: 15px;
    text-transform: capitalize;
    font-weight: 600;
}
.skill .progress {
    overflow: visible;
    border-radius: 0px 5px 5px 0px;
    box-shadow: none;
    background: #fff;
    height: 5px;
}
.skill .progress .progress-bar {
    position: relative;
}
.skill .progress .progress-bar span {
    position: absolute;
    right: 20px;
    top: -36px;
    color: #666;
    font-weight: 500;
    font-size: 14px;
}
.skill .progress .progress-bar span::before {
    position: absolute;
    bottom: -25px;
    left: 50%;
    content: "";
    margin-left: -10px;
    border: 7px solid #ED1C24;
    border-radius: 100%;
}
/*=======================
  End About US CSS
=========================*/





/*===================
	contact
=====================*/
#contact{
    position:relative;
}
/*contact-left*/
#contact .contact-left {
    background: #fff;
    padding: 30px;
    position: relative;
    top: 52px;
    left: 90px;
    z-index: 99;
    box-shadow: -10px 10px 10px #0000004d;
}

#contact .contact-left h3{
    color:#333;
    border-bottom:1px solid;

}

#contact .contact-left p{
    color:#9f9f9f;
    margin-top:10px;
}
#contact .contact-left .p1 {
    margin-top: 22px;
    margin-left: 10px;
}
#contact .contact-left .p1::before {
    position: absolute;
    content: "";
    left: 31px;
    top: 82px;
    height: 75px;
    width: 2px;
}

/*contact-right*/
#contact .contact-right {
    padding:60px 30px 60px 90px;
}
#contact .contact-right::before {
    position: absolute;
    content: "";
    right: 15px;
    top: 0;
    border: 22px solid #fffc;
    border-top: 22px solid transparent;
    border-right: 22px solid transparent;
    border-radius: 0px 0px 0px 4px;
}
#contact .contact-right::after {
    position: absolute;
    content: "";
    right: 15px;
    top: 0;
    border: 24px solid #F6F6F6;
    border-left: 22px solid transparent;
    border-bottom: 22px solid transparent;
}
.contact .form{
    margin-top:30px;
}
.contact .form .form-group{}
.contact .form input {
    width: 100%;
    height: 46px;
    padding-left: 15px;
    text-transform: capitalize;
    background: none;
    border: none;
    color: #fff;
    border-bottom: 1px solid #fff;
}
.contact .form textarea {
    width: 100%;
    height: 200px;
    padding: 15px;
    text-transform: capitalize;
    resize: none;
    background: none;
    color: #fff;
    border: none;
    border: 1px solid #fff;
}
.contact .form .btn {
    color: #333;
    background: #fff;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
    margin-top: 10px;;

}
.contact .form .btn:hover{
    box-shadow: 2px 8px 8px #0000004d;
    transform:scale(1.05);
}
.contact .form .btn i{
    margin-left:5px;
}

/*===================
	End contact
=====================*/


/*===================
	Clients CSS
=====================*/
.clients{
    background:#fff;
}
.clients .single-clients{
    -webkit-transition:all .4s ease;
    -moz-transition:all .4s ease;
    transition:all .4s ease;
    margin:0;
    padding:0;
    padding:0;
}

.clients .single-clients img{

}
/*===================
	End Clients CSS
=====================*/



/*===================
    Footer CSS
=====================*/
.footer{
    padding:0;
    background-color:#F6F6F6;
    border-top: 1px solid #eee;
}
.footer .footer-top{

    padding:50px 0px;

}
.footer .logo{

    margin-bottom:23px;
}
.footer .logo img{
}
.footer .single-footer{
}
.footer .single-footer .contact {

    margin-top: 15px;
}
.footer .single-footer .contact p{
    margin-top:10px;
}
.footer .single-footer .contact i{
    margin-right:10px;
}
.footer .single-footer .contact .location{
    color:#868585;
}
.footer .single-footer .contact .mail-add{
    color:#868585;
}
.footer .single-footer .contact .call{

    color:#868585;
}

.footer .single-footer span i{

    margin-right:5px;
}
.footer .single-footer span{
    display:block;
    color:#868585;
    margin: 12px 0px;
    text-transform:capitalize;
    -webkit-transition:all 0.4s ease;
    -moz-transition:all 0.4s ease;
    transition:all 0.4s ease;
}
.footer .single-footer span:hover{
    cursor:pointer;
}
.footer .single-footer h2{

    color:#333;
    font-size:20px;
    font-weight:600;
    text-transform:capitalize;
    margin-bottom:20px;
    text-transform:uppercase;
}
.footer .single-footer h2 i{

    margin-right:10px;
    padding-right:5px;
    border-right:2px solid;
}
.footer .single-footer p{

    color:#333;
}
.footer .single-footer .mail{

    margin-top:20px;
}
.footer .single-footer .mail input{
    background: transparent;
    border: 1px solid #868585;
    height: 45px;
    line-height: 45px;
    width: 245px;
    margin-right: 15px;
    color: #868585;
    padding-left: 18px;
    display: inline-block;
    float: left;
}
.footer input::-webkit-input-placeholder {
    opacity: 1;
    color: #868585 !important;
}
.footer input::-moz-placeholder {
    opacity: 1;
    color: #868585 !important;
}
.footer input::-ms-input-placeholder {
    opacity: 1;
    color: #868585 !important;
}
.footer input::input-placeholder {
    opacity: 1;
    color: #868585 !important;
}
.footer .single-footer .button {
    height: 37px;
    width: 109px;
    box-shadow: none;
    text-shadow: none;
    border: none;
    margin-top: 10px;
    margin-left: 0;
    font-size: 15px;
    text-transform: capitalize;
}
.footer .single-footer .button a{

    color:#fff;
}
.footer .single-footer .button:hover{

    background:#555;
    color:#c8c8c8;
}
.footer .single-footer .mail i {

    position: absolute;
    left: 0;
    color: #333;
    top: 230px;
}
.footer .single-footer .mail p{

    margin-top:10px;
}
.footer .copyright{
    padding:10px 0;
    background: #fff;
}
.footer .copyright .footer-links{
    padding:2px 0 3px  0;
    color:#333;
    font-size: 12px;
    margin-right: 15px;
}
.footer .copyright .footer-links a{
    color:#333;
}
.footer .copyright .footer-links a:hover{
    color: #007bff;
}
.footer .copyright .footer_nav{
    font-size: 12px;
    margin-right: 15px;
    padding:0 0 3px 0;
}
.footer .copyright .footer_nav p{
    display:inline;
    color:#333;
}
.footer .copyright .footer_nav a{
    color:#333;
}

.footer .copyright .foot-subnav{
    padding: 0 0 3px 0;
    font-size: 12px;
}
.footer .copyright .foot-subnav li{
    display:inline-block;
    margin-right:5px;
}
.footer .copyright .foot-subnav li a{
    color: #333;
    padding: 0 5px 0 0;
    font-weight: 400;
}
.footer .copyright .foot-subnav li a:hover{
    color: #007bff;
}
.footer .copyright .social{
    width: 160px;
    padding:2px 0;
    margin-right:15px;
}

.footer .copyright .social li{
    display:inline-block;
    margin-right:5px;
    line-height:30px;
}
.footer .copyright .social li a{
    color: #333;
    padding: 5px;
}
.footer .copyright .social li a:hover{
    color:#fff;
    background:#007bff;
}
.footer .copyright .social ul li a i{
    font-size:15px;
}

.footer .copyright .multi-language{
    margin-right: 15px;
    width: 120px;
}
.footer .copyright .multi-language .select-btn{
    display: block;
    padding: 6px 12px;
    background-color: rgb(238, 238, 238);
    border-radius: 4px;
    cursor: pointer;
}
.footer .copyright .multi-language .select-btn i{margin-right: 5px;}
.footer .copyright .multi-language .select-btn:hover{
    background-color: #007bff;
    color: #fff;
}
.footer .copyright .multi-language .language-list a{
    padding: 8px 20px;
    display: inline-block;
    text-align: left;
    color: #333;
}
/*===================
    End Footer CSS
=====================*/


/*===================
    Auth CSS
=====================*/
#auth .btn-link-1 {
    display: inline-block;
    height: 50px;
    margin: 5px;
    padding: 16px 20px 0 20px;
    background: #19b9e7;
    font-size: 16px;
    font-weight: 300;
    line-height: 16px;
    color: #fff;
    -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
}
#auth .btn-link-1:hover, #auth .btn-link-1:focus, #auth .btn-link-1:active { outline: 0; opacity: 0.6; color: #fff; }

#auth .btn-link-1.btn-link-1-facebook { background: #4862a3; }
#auth .btn-link-1.btn-link-1-twitter { background: #55acee; }
#auth .btn-link-1.btn-link-1-google-plus { background: #dd4b39; }

#auth .btn-link-1 i {
    padding-right: 5px;
    vertical-align: middle;
    font-size: 20px;
    line-height: 20px;
}

#auth .btn-link-2 {
    display: inline-block;
    height: 50px;
    margin: 5px;
    padding: 15px 20px 0 20px;
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid #fff;
    font-size: 16px;
    font-weight: 300;
    line-height: 16px;
    color: #fff;
    -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
}
#auth .btn-link-2:hover, .btn-link-2:focus,
#auth .btn-link-2:active, .btn-link-2:active:focus { outline: 0; opacity: 0.6; background: rgba(0, 0, 0, 0.3); color: #fff; }

#auth button.btn {
    height: 50px;
    margin: 0;
    padding: 0 20px;
    vertical-align: middle;
    background: #19b9e7;
    border: 0;
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: 300;
    line-height: 50px;
    color: #fff;
    -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
    text-shadow: none;
    -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;
    -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -ms-transition: all .3s; transition: all .3s;
}

#auth button.btn:hover { opacity: 0.6; color: #fff; }

#auth button.btn:active { outline: 0; opacity: 0.6; color: #fff; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; }

#auth button.btn:focus { outline: 0; opacity: 0.6; background: #19b9e7; color: #fff; }

#auth button.btn:active:focus, button.btn.active:focus { outline: 0; opacity: 0.6; background: #19b9e7; color: #fff; }

#auth .form-box {}

#auth .form-top {
    overflow: hidden;
    padding: 0 25px 0 25px;
    background: #fff;
    -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0;
    text-align: left;
}

#auth .form-top-left {
    float: left;
    width: 75%;
}

#auth .form-top-left h3 {
    margin-top: 0;
    font-size: 22px;
    font-weight: 300;
    color: #555;
    margin-bottom: 10px;
}
#auth .form-top-left p{
    color: #888;
}

#auth .form-top-right {
    float: left;
    width: 25%;
    font-size: 66px;
    color: #ddd;
    line-height: 66px;
    text-align: right;
}

#auth .form-bottom {
    padding: 25px 25px 15px 25px;
    /*background: #eee;*/
    -moz-border-radius: 0 0 4px 4px; -webkit-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px;
    text-align: left;
}

#auth .form-bottom form textarea {
    height: 100px;
}

#auth .form-bottom form button.btn {
    width: 100%;
}

#auth .form-bottom form .input-error {
    border-color: #19b9e7;
}

#auth .social-login {

}

#auth .social-login h3 {
    text-align: center;
    padding: 5px 0;
}

#auth .social-login-buttons {

}

#auth .middle-border {
    min-height: 300px;
    margin-top: 170px;
    border-right: 1px solid #fff;
    border-right: 1px solid rgba(255, 255, 255, 0.6);
}

#auth input[type="text"],
#auth input[type="password"],
#auth textarea,
#auth textarea.form-control {
    height: 50px;
    margin: 0;
    padding: 0 20px;
    vertical-align: middle;
    /*background: #f8f8f8;*/
    border: 3px solid #ddd;
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: 300;
    line-height: 50px;
    color: #888;
    -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
    -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;
    -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -ms-transition: all .3s; transition: all .3s;
}

#auth textarea,
#auth textarea.form-control {
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 30px;
}

#auth input[type="text"]:focus,
#auth input[type="password"]:focus,
#auth textarea:focus,
#auth textarea.form-control:focus {
    outline: 0;
    background: #fff;
    border: 3px solid #ccc;
    -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;
}

#auth input[type="text"]:-moz-placeholder,
#auth input[type="password"]:-moz-placeholder,
#auth textarea:-moz-placeholder,
#auth textarea.form-control:-moz-placeholder { color: #888; }

#auth input[type="text"]:-ms-input-placeholder,
#auth input[type="password"]:-ms-input-placeholder,
#auth textarea:-ms-input-placeholder,
#auth textarea.form-control:-ms-input-placeholder { color: #888; }

#auth input[type="text"]::-webkit-input-placeholder,
#auth input[type="password"]::-webkit-input-placeholder,
#auth textarea::-webkit-input-placeholder,
#auth textarea.form-control::-webkit-input-placeholder { color: #888; }

#loginModal .modal-header{
    border-bottom: none;
    padding: 0.5rem 1rem;
}
#loginModal .modal-body{
    padding: 0.5rem 1rem 1rem 1rem;
}
/*===================
    End Auth CSS
=====================*/


/*===================
    Support CSS
=====================*/
#support{
    padding-bottom: 50px;
}
#support h4{
    font-size: 18px;
    margin: 40px 0 15px 0;
}
#support label{
    color: #888;
}
/*===================
    End Support CSS
=====================*/

/*===================
    top_info CSS
=====================*/
#top_info{
    padding: 15px 0;
    font-size: 16px;
}

#top_info .txt{
    padding: 4px 0 0 0;
}

#top_info .btn_down{
    background-color: #007bff;
    color: #fff;
    padding: 4px 10px;
}
/*===================
    End top_info CSS
=====================*/

/*===================
    mask CSS
=====================*/
#mask-main{
    background-color: black;
    opacity: 0.3;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 10;
    border:none;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    -webkit-user-select: none;
    -moz-user-focus: none;
    -moz-user-select: none;
}
#mask-kuang{
    width: 400px;
    height: 300px;
    background-color: #f6f6f6;
    position: absolute;
    z-index: 888;
    left: 200px;
    top: 250px;

}
#mask-con{
    padding: 100px 30px 50px 30px;
}
#mask-con p{
    text-align: center;
    line-height: 24px;
    margin-bottom: 15px;
    font-size: 14px;
}
#mask-con p .down{
    padding: 10px 15px;
    background-color: #007bff;
    color: #fff;
    margin-top: 10px;
    display: block;
}
#mask-con p span{
    color: #007bff;
    font-weight: bold;
}
#mask-close{
    width: 30px;
    height: 24px;
    line-height: 24px;
    /*background-color: #888;*/
    position: absolute;
    top: 10px;
    right: 15px;
    z-index: 999;
}
#mask-close:hover{
    cursor: pointer;
    outline: none;
    text-decoration: none;
    color: #007bff;
}
/*===================
    End mask CSS
=====================*/


/*===================
    downBox CSS
=====================*/

#desktop{padding: 50px 0 0 0;}

#desktop .downBox{
    padding: 0 0 20px 0;
}
#desktop .downBox dl{
    width: 200px;
    margin: 0 auto;
}

#desktop .downBox dl dt{
    font-weight: 700;
    margin:0 auto 10px auto;
    font-size: 20px;
    text-align: left;
}
#desktop .downBox dl dd{
    font-size: 14px;
    text-align: left;
    margin: 5px auto 0 auto;
}
#desktop .downBox dl dd.qr{
    margin-top: 0;
    text-align: center;
}

#desktop .downBox dl dd.download{
    margin-top: 15px;

}

#desktop .downBox dl dd.qr-text{
    text-align: center;
}
#desktop .downBox dl dd.qr-text .red{
    color: #ff0000;
}

#desktop .downBox dl dd.qr img{
    width: 150px;
    height: 150px;
}


#desktop .downBox .downBtn{
    display: block;
    color: #fff;
    padding: 15px 0;
    width: 200px;
    margin: 15px auto 0 auto;
    background-color: #007bff;
    line-height: 16px;
    font-weight: 700;
    font-size: 18px;
    text-align: center;
}

#desktop .downBox .downBtn:hover{
    background-color: #2e83ef;
}

#desktop .downBox .downBtn span{ display: block; }

#desktop .downBox .downBtn .pc{ background: url(../img/btn_icon_pc.png) 55px 0 no-repeat; }
#desktop .downBox .downBtn .android{ background: url(../img/btn_icon_and.png) 55px 0 no-repeat; }

/*===================
    End downBox CSS
=====================*/

/*===================
    addiv CSS
=====================*/
.addiv{
    text-align: center;
    padding: 15px 0 0 0;
}
/*===================
    End addiv CSS
=====================*/

.left_user_info{
    width: 130px;
    margin: 0 auto;
}
.left_user_info ul li{
    text-align: left;
    margin: 0;
    padding: 0;
}
.left_user_info ul li.li_img{
    padding-bottom: 10px;
}
.left_user_info ul li label{
    display: inline-block;
    width: 60px;
    text-align: right;
    margin-bottom: 0;
}

.right_user_info{
    min-height: 350px;
}

.right_user_info ul li{
    padding-bottom: 10px;
}

.right_user_info ul li label{
    display: inline-block;
    width: 100px;
    text-align: right;
    margin-bottom: 0;
}

.right_user_info ul li span.green{
    color:#28a745;
}

.right_user_info ul li span.gray{
    color:#888;
}

.vip-box p{ padding-bottom: 10px; }
.vip-box p a{ margin: 0 5px 0 0; }

.refresh-box{
    display: none;
}
.refresh-box img{
    width: 270px;
    height: 270px;
    margin-bottom: 20px;
    cursor: pointer;
}




@media only screen and (min-width: 768px) and (max-width: 991px) {
    .section-title {
        padding: 0 40px;
    }

    #header .header-inner {
        height: 80px;
    }
    #header .logo {
        padding-top: 28px;
    }
    #header .nav li a {
        padding: 30px 7px;
    }
    #slider .single-slider{
        height:500px;
    }
    #slider .single-slider .text {
        margin-top: 100px;
    }

    #slider .single-slider .button{
        margin-top:30px;
    }
    .latest-works .single-work:hover .works-hover{
        top:10px;
    }
    #resources .single-news {
        margin-top: 30px;
    }
    #resources .single-news .news-body .date {
        top: 503px;
    }
    #single-pf .news-head {
        float:none;
    }
    #single-pf .single-news .news-body {
        margin-left:0px;
    }
    #single-pf .single-news img {
        -webkit-transition: all 0.4s ease;
        -moz-transition: all 0.4s ease;
        transition: all 0.4s ease;
        width: 100%;
        height:100%;
    }
    .fun-facts .single-fun {
        margin-top: 30px;
    }
    .contact .form .btn {
        margin-bottom: 15px;
    }
    #contact .contact-left .p1::before {
        top: 111px;
        height: 153px;
    }
    .footer .single-footer .mail input {
        width: 170px;
    }
    .footer .single-footer .mail i {
        top: 249px;
    }
}

@media only screen and (max-width: 767px){
    .slicknav_menu {
        display: block;
        background: transparent;
        padding: 0;
        margin-top: 14px;
    }
    .slicknav_nav .slicknav_item a i {
        display: none;
    }
    .slicknav_menu .slicknav_btn {
        margin: 0;
        border-radius: 0;
    }
    .slicknav_menu .slicknav_nav{
        background:#333;
    }
    .slicknav_menu .slicknav_btn {
        margin: 0;
        background: #42ACF6;
        position: relative;
        top: -4px;
    }
    .slicknav_menu .slicknav_menutxt{
        text-shadow:none;
    }
    .section-title {
        padding: 0 40px;
    }
    #header .contact{
        float:none;
        text-align:center;
        margin-bottom:5px;
    }
    #header .social li.email {
        color: #fff;
        display: block;
        margin-bottom: 5px;
    }
    #header .social{
        float:none;
        text-align:center;
    }
    #header .right-bar{
        display:none;
    }
    #header .header-inner {
        height: auto;
        padding: 10px 0;
    }
    #header .logo {
        padding-top: 14px;
    }
    #header .nav li a {
        padding: 30px 7px;
    }
    #slider .single-slider{
        height:730px;
    }
    #latest-works .works-menu ul li {
        margin-right: 20px;;
    }
    #slider .single-slider h1 {
        font-size: 22px;
    }
    #slider .single-slider .text {
        margin-top: 75px;
    }
    #slider .single-slider h1 {
        line-height: 32px;
    }
    .cd-words-wrapper{
        top:-4px;
    }
    .cd-headline.clip .cd-words-wrapper::after {
        height: 65%;
        top: 7px;
    }
    #slider .button {
        margin-top: 30px;
    }
    #resources .single-news .news-body .date {
        top: 230px;
    }
    #resources .single-news .news-body .title .comment {
        margin: 0;
        padding: 0;
        margin-bottom: 10px;
    }
    #resources .single-news {
        margin-bottom: 20px;
    }
    #resources-single .pagination ul li a {
        padding: 10px 7px;
    }
    #single-pf .news-head {
        float:none;
    }
    #single-pf .single-news .news-body {
        margin-left:0px;
    }
    #single-pf .single-news img {
        -webkit-transition: all 0.4s ease;
        -moz-transition: all 0.4s ease;
        transition: all 0.4s ease;
        width: 100%;
        height:100%;
    }
    #single-ab .news-head img {
        -webkit-transition: all 0.4s ease;
        -moz-transition: all 0.4s ease;
        transition: all 0.4s ease;
        width: 100%;
        height:100%;
    }
    .fun-facts .single-fun {
        margin-top: 30px;
    }
    #contact .contact-left {
        left: 0px;
    }
    .contact .form .btn {
        margin-bottom: 15px;
    }
    .footer .single-footer {
        margin-top: 25px;
        border-top:2px solid #3333334d;
        padding-top:5px;
    }
    .footer .single-footer .mail i {
        display:none;
    }
    .footer .copyright .social {
    }
    .contact .form input {
        padding-left: 0px;
    }



}

@media only screen and (max-width: 320px){
    .section-title {
        padding: 0 20px;
    }
    #newslatter .form input {
        width: 185px;
    }
    #newslatter .form button {
        height: 50px;
        width: 90px;
    }
}

.mail-success .mail-head .button .btn,
.error .error-left .button .btn,
.error .error-left h2,
.error .error-left p,
#resources-single .pagination ul li:hover a,
#resources-single .single-news .news-body .tags li a,
#resources-single .single-news .news-body .btn,
#resources-single .single-news .news-body h2 a:hover,
#single-pf .single-news .news-body .btn,
#single-pf .single-news .news-body span a,
#single-pf .single-news .news-body h2 a:hover,
#slider .button .btn,.cd-words-wrapper,
#features .single-right i,
.latest-works .works-menu ul li:hover,
.latest-works .works-menu ul li.active,
.latest-works .single-work .works-hover h4:hover,
.latest-works .single-work .works-hover a:hover i,
#testimonials .single-testimonial p .fa,
#resources .single-news .news-body h2:hover a,
#resources .single-news .news-body .btn,
.p-table4 .table-head .price .amount span,
.p-table4 .button .btn,.p-table4 .button .btn i,
#contact .contact-left .p1,.contact .form .btn:hover,
.footer .single-footer .contact i,
.footer .single-footer span:hover,
.footer .single-footer h2 i{
    color:#007bff;
}

.mail-success .mail-head .button .btn::before ,
.mail-success .mail-head .button .btn:after,
.mail-success .mail-head .button span::before,
.mail-success .mail-head .button span::after,
.error .error-left .button span::after ,
.error .error-left .button span::before,
.error .error-left .button .btn:after,
.error .error-left .button .btn::before,
#resources-single .single-news .news-body .date,
#single-pf .owl-nav button:hover,
.color-plate .icon,
#scrollUp,
.section-title h1:before,
.section-title h1::after,
.section-title h2:before,
.section-title h2::after,
#slider .button .btn::before,
#slider .button .btn:after,
#slider .button span::before,
#slider .button span::after,
#Services .single-service i,
#resources .single-news .news-body .date,
#team .team-hover .social li a:hover,
.p-table4 .button .btn::before,
.p-table4 .button .btn:after,
.p-table4 .button span::before,
.p-table4 .button span::after,
#contact .contact-left .p1::before,
#contact .contact-right,
.footer .single-footer .button,
.slicknav_menu .slicknav_btn{
    background:#007bff;
}
#Services .single-service h3::before,
.latest-works .single-work .works-hover a:hover i,
.p-table4 .table-head .amount{
    border-color:#007bff;
}

.p-table4 .single-table:hover .table-head .price .amount{
    box-shadow: 0px 0px 20px #007bff;
}
.footer .single-footer h2 i{
    border-right-color:#007bff;
}
.footer .copyright .multi-language .language-list a:hover{
    color: #007bff;
}