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

----------------------------------------------------------------------------------------
   1. BASE CSS
    2. TOP AREA
        2.1 MAINMENU AREA
    3. WELCOME SLIDER AREA
    3. ABOUT AREA
    4. SERVICE TOP AREA
    5. ABOUT AREA
    6. SERVICE BOTTOM ARAE
    7. PORTFOLIO AREA
    8. PROMO AREA
    8. TESTMONIAL AREA
    9. TEAM AREA
    10. INFO AREA
    11. TESTMONIAL AREA
    12. PRICE AERA
    13. WIDGETS AREA
    14. CONTACT AREA
    15. FOOTER AREA
    16. SCROLL TO TOP AREA
----------------------------------------------------------------------------------------*/

/*--------------------
   1. BASE CSS
----------------------*/

@import url('https://fonts.googleapis.com/css?family=Raleway:300i,400,600i,700');
.alignleft {
    float: left;
    margin-right: 15px;
}

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

.aligncenter {
    display: block;
    margin: 0 auto 15px;
}

a {
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

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

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

button:focus {
    outline: 0;
}

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

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0 0 15px;
    font-weight: 700;
    line-height: 1.4em;
    text-transform: uppercase;
    color: #292929;
}

html,
body {
    height: 100%
}

body {
    font-family: 'Raleway', sans-serif;
    font-size: 14px;
    line-height: 1.6em;
    font-weight: 400;
    color: #6f6f6f;
}

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

.fix {
    overflow: hidden;
}

.relative {
    position: relative;
    overflow: hidden;
}

.absulute {
    position: absolute;
}

.v-center {
    position: absolute;
    left: 0;
    top: 58%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 100%;
    z-index: 9;
}

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

.flex-v-center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.social-bookmark li {
    display: inline;
}

.social-bookmark li a {
    display: inline-block;
    margin: 0 2px;
    text-align: center;
}

.inline li {
    display: inline;
}

.inline-block li {
    display: inline-block;
    padding: 5px 15px;
}


/* Remove Chrome Input Field's Unwanted Yellow Background Color */

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
}



.section-padding {
    padding: 100px 0;
}

.padding-top {
    padding-top: 100px;
}

.padding-bottom {
    padding-bottom: 100px;
}

.padding-100-70 {
    padding-top: 100px;
    padding-bottom: 70px;
}

.padding-100-50 {
    padding-top: 100px;
    padding-bottom: 50px;
}

.padding-100-40 {
    padding-top: 100px;
    padding-bottom: 40px;
}

.padding-100-30 {
    padding-top: 100px;
    padding-bottom: 30px;
}

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

.mbzero {
    margin-bottom: 0 !important;
}

.mb50 {
    margin-bottom: 50px !important;
}

.mb30 {
    margin-bottom: 30px !important;
}

.mt50 {
    margin-top: 50px !important;
}

.mt30 {
    margin-top: 30px !important;
}

.left,
.right,
.center {
    position: relative;
}

.left {
    text-align: left;
}

.right {
    text-align: right;
}

.center {
    text-align: center;
}

.white,
.white h1,
.white h2,
.white h3,
.white h4,
.white h5,
.white h6,
.white a,
.white small {
    color: #ffffff;
    margin-bottom: 30px;
    cursor: pointer;
}

.area-title,
.section-title {
    margin-bottom: 50px;
    position: relative;
}

.area-title h2 {
    line-height: 1;
    margin-bottom: 30px;
    padding-bottom: 20px;
    position: relative;
}

.area-title h2::after {
    background: #6739B7 none repeat scroll 0 0;
    bottom: 0;
    content: "";
    height: 3px;
    left: 50%;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 25px;
}

.gray-bg {
    background: #eeeeee;
}

.white-gray-bg {
    background: #fbfbfb;
}

.dark-bg {
    background: rgba(0, 0, 0, .85);
    color: #ffffff;
}

.deep-dark-bg {
    background: rgba(0, 0, 0, .9);
    color: #ffffff;
}


a.readmore {
    background: #eb484d none repeat scroll 0 0;
    color: #ffffff;
    display: inline-block;
    letter-spacing: 2px;
    margin-top: 20px;
    min-width: 160px;
    padding: 10px 30px;
    text-align: center;
}

a.readmore:hover {
    background: #ffffff none repeat scroll 0 0;
    color: #eb484d;
}


.area-bg {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.area-bg::after {
    background: #000 none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.8;
    position: absolute;
    top: 0;
    width: 100%;
}

.promo-area .area-bg {
    background: rgba(0, 0, 0, 0) url("img/promo/promo-bg.jpg") no-repeat scroll center center / cover;
}

/*--------------------------
    2. TOP AREA
---------------------------*/

.call-to-action {
    padding: 15px 0 5px;
}

.call-to-action p {
    display: inline-block;
    margin-right: 10px;
}

.call-to-action p a {
    color: #292929;
    margin-left: 10px;
}

.header-social-bookmark {
    padding: 14px 0;
}

.header-social-bookmark .social-bookmark {
    text-align: right;
}
.header-social-bookmark .social-bookmark li a {
    /* background: #ababab none repeat scroll 0 0; */
    border-radius: 50%;
    color: #333;
    display: inline-block;
    font-size: 14px;
    height: 30px;
    padding-top: 3px;
    width: 30px;
    padding: 3px;
}
.client-login{
    background:#6739b7;
   color:  #fff !important;
}
.header-login-signup {
    padding: 14px 0;
}
.header-login-signup .login-signup {
    text-align: right;
}
.header-login-signup .login-signup li a {
    /* background: #ababab none repeat scroll 0 0; */
    border-radius: 5px;
    color: #333;
    display: inline-block;
    font-size: 14px;
    /* height: 30px; */
    /* padding-top: 3px; */
    /* width: 30px; */
    padding: 3px;
    font-weight: 600;
}
.login-signup li{
    display: inline;
}
.login-signup li a {
    display: inline-block;
    margin: 0 2px;
    text-align: center;
}

.header-login-signup .login-signup li a:hover {
    /*background: #6739B7 none repeat scroll 0 0;*/
    color: #6739B7;;
}

.header-social-bookmark .social-bookmark li a:hover {
    background: #2c105d none repeat scroll 0 0;
    color: #ffffff;
}
.client-login{
    background:#6739b7;
   color:  #fff;
}
/*---------------------------------
    2.1 MAINMENU AREA
-----------------------------------*/

.header-top-area {
    left: 0;
    position: relative;
    top: 0;
    width: 100%;
    z-index: 999;
    background: #ffffff;
}

.mainmenu-area {
    background: #ffffff;
    position: relative;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    z-index: 9999;
}

.navbar-header {
    /*margin-top: 14px;*/
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.navbar {
    border-bottom: 0 none;
    border-top: 0 none;
    margin-bottom: 0;
}

.navbar-brand > img {
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.is-sticky .navbar-brand > img {
    max-width: 80%;
}

ul#nav {
    float: right;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

ul#nav li a {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #333;
    font-size: 14px;
    font-weight: 700;
    /*letter-spacing: 1px;*/
    padding: 30px 10px;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

ul#nav li a:hover,
ul#nav li.active a {
    color: #6739B7;
}

.is-sticky ul#nav li a {
    padding: 26px 10px;
}

.is-sticky ul#nav li a:hover,
.is-sticky ul#nav li.active a {
    color: #6739B7;
}

.is-sticky .navbar-header {
    margin-top: -8px;
}

.is-sticky .mainmenu-area {
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
    z-index: 99999;
}

.menu-toggle.full {
    border: 1px solid;
    height: 40px;
    letter-spacing: 2px;
    padding-top: 11px;
    position: absolute;
    right: 15px;
    text-align: center;
    top: 20px;
    width: 110px;
}

.is-sticky .menu-toggle.full {
    top: 8px;
}

ul#nav li ul a,
.is-sticky ul#nav li ul a {
    border-bottom: 1px solid #1a1a1a;
    padding: 10px;
    padding-left: 15px;
}



/*-----------------------------------
    3. WELCOME SLIDER AREA
-------------------------------------*/

.welcome-slider-area {
    color: #fff;
    overflow: hidden;
    width: 100%;
    position: relative;
}

.welcome-single-slide {
    height: 750px;
    width: 100%;
}

.slide-bg-overlay {
    height: 100%;
    left: 0;
    opacity: 0.9;
    position: absolute;
    top: 0;
    width: 100%;
}

.slide-bg-overlay::after {
    background: #0000008c none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.7;
    position: absolute;
    top: 0;
    width: 100%;
}

.slide-bg-one {
    background: rgba(0, 0, 0, 0) url("img/slider/slide-1.jpg") no-repeat scroll center center / cover;
}

.slide-bg-two {
    background: rgba(0, 0, 0, 0) url("img/slider/accounting_background.jpg") no-repeat scroll center center / cover;
}

.slide-bg-three {
    background: rgba(0, 0, 0, 0) url("img/slider/slide_2.jpg") no-repeat scroll center center / cover;
}

.welcome-area {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 18px;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
}

.welcome-text h4 {
    font-size: 20px;
}

.welcome-text h1 {
    font-size: 40px;
    margin-bottom: 30px;
}

.home-button {
    padding-top: 50px;
}

.home-button a {
    background: #6739B7 none repeat scroll 0 0;
    border-radius: 5px;
    padding: 15px 20px;
    text-align: center;
    text-transform: uppercase;
}

.home-button a:hover {
    background: #ffffff none repeat scroll 0 0;
    color: #6739B7;
}

.owl-item.active .welcome-single-slide .welcome-text h4 {
    -webkit-animation: 1s ease 1s normal both 1 running fadeInUp;
    animation: 1s ease 1s normal both 1 running fadeInUp;
}

.owl-item.active .welcome-single-slide .welcome-text h1 {
    -webkit-animation: 1s ease 1.5s normal both 1 running fadeInUp;
    animation: 1s ease 1.5s normal both 1 running fadeInUp;
}

.owl-item.active .welcome-single-slide .welcome-text p {
    -webkit-animation: 1s ease 2s normal both 1 running fadeInUp;
    animation: 1s ease 2s normal both 1 running fadeInUp;
    ;
}

.owl-item.active .welcome-single-slide .home-button {
    -webkit-animation: 1s ease 2.5s normal both 1 running fadeInUp;
    animation: 1s ease 2.5s normal both 1 running fadeInUp;
}

.welcome-slider-area .owl-nav {
    bottom: -100px;
    position: absolute;
    right: 20px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.welcome-slider-area:hover .owl-nav {
    bottom: 20px;
}

.welcome-slider-area .owl-nav > div {
       background: #2c105d none repeat scroll 0 0;
    bottom: 0;
    display: inline-block;
    font-size: 36px;
    height: 50px;
    margin-left: 10px;
    /* padding-top: 7px; */
    right: 0;
    text-align: center;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 50px;
    padding: 7px 0;
}

.welcome-slider-area .owl-nav > div:hover {
    background: #fff none repeat scroll 0 0;
    color: #2c105d;
}

/*--------------------------------
    4. SERVICE TOP AREA
---------------------------------*/

.single-service {
    position: relative;
    margin-bottom: 50px;
}

.service-icon {
    border: 1px solid #6739B7;
    color: #292929;
    font-size: 30px;
    height: 60px;
    margin: 0 auto 25px;
    padding-top: 14px;
    text-align: center;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 60px;
}

.single-service:hover .service-icon {
    background: #2c105d none repeat scroll 0 0;
    border-color: #6739B7;
    color: #ffffff;
}

.read-more {
    background: #6739B7 none repeat scroll 0 0;
    border-radius: 5px;
    color: #ffffff;
    display: inline-block;
    font-weight: 700;
    margin-top: 10px;
    padding: 10px 29px;
    text-transform: uppercase;
}

.read-more:hover {
    background: #292929 none repeat scroll 0 0;
    color: #fff;
}

/*--------------------------------
    5. ABOUT AREA
----------------------------------*/

.high-light {
    color: #292929;
    font-size: 14px;
    font-weight: 700;
    /*margin-bottom: 30px;*/
     margin-bottom: 10px;
    text-transform: capitalize;
}
.skillst5{
    margin: 50px 0;
}

/*--------------------------------
    6. SERVICE BOTTOM ARAE
---------------------------------*/

.single-service.right {
    padding-right: 80px;
}

.single-service.right .service-icon {
    position: absolute;
    right: 0;
}

.single-service.left {
    padding-left: 80px;
}

.single-service.left .service-icon {
    left: 0;
    position: absolute;
    top: 0;
}

/*--------------------------------
    7. PORTFOLIO AREA
---------------------------------*/

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

.portfolio-menu li {
    color: #292929;
    cursor: pointer;
    display: inline-block;
    font-weight: 700;
    padding: 5px 10px;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.portfolio-menu li.active,
.portfolio-menu li.active {
    color: #6739B7;
}

.single-portfolio {
    margin-bottom: 30px;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.portfolio-thumb {
    position: relative;
    z-index: -1;
}

/*.portfolio-details {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    left: 0;
    position: absolute;
    text-align: center;
    top: 0;
    width: 100%;
    z-index: 1;
}*/

.portfolio-details {
    padding: 5px;
    text-align: center;
}

.single-portfolio::before,
.single-portfolio::after {
    background: #2c105d none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 100%;
}

.single-portfolio::after {
    background: transparent none repeat scroll 0 0;
    border: 1px solid #fff;
    height: calc(100% - 40px);
    left: 20px;
    top: 20px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: calc(100% - 40px);
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
}

.portfolio-details h4,
.portfolio-details p {
    opacity: 0;
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}


.portfolio-details p {
    -webkit-transition: all 0.6s ease 0s;
    transition: all 0.6s ease 0s;
}

.single-portfolio:hover::before,
.single-portfolio:hover::after {
    opacity: 0.9;
    -webkit-transform: scale(1);
    transform: scale(1);
}

.single-portfolio:hover .portfolio-details h4,
.single-portfolio:hover .portfolio-details p {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
}

/*--------------------------------
    8. PROMO AREA
---------------------------------*/

.promo-area.section-padding {
    padding: 150px 0;
}

.download-button {
    border: 1px solid;
    display: inline-block;
    letter-spacing: 1px;
    margin-top: 20px;
    padding: 12px 20px;
    text-transform: uppercase;
}

.download-button:hover {
    background: #fff none repeat scroll 0 0;
    border-color: #fff;
    color: #292929;
}

/*-------------------------------
    9. TEAM AREA
---------------------------------*/

.single-team {
    margin-bottom: 30px;
}

.member-top-details {}

.member-details {
    padding: 20px;
}

.member-top-details::before {
    background: #6739B7 none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 100%;
}

.member-details h4 span,
.member-name-and-designation h4 span {
    display: block;
    font-size: 14px;
    letter-spacing: 3px;
}

.member-bottom-details {
    height: 90px;
    position: relative;
}

.member-bottom-details .member-name-and-designation,
.member-bottom-details .social-bookmark {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #6739B7 none repeat scroll 0 0;
    height: 90px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    place-content: center;
    width: 100%;
    position: absolute;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    left: 0;
    top: 0;
}

.member-bottom-details .social-bookmark {
    opacity: 0;
}

.member-name-and-designation h4 {
    margin-bottom: 0;
}

.member-bottom-details .social-bookmark li a {
    border: 1px solid;
    border-radius: 50%;
    height: 40px;
    margin: 0 5px;
    padding-top: 7px;
    text-align: center;
    -webkit-transform: translateY(80px);
    transform: translateY(80px);
    width: 40px;
}

.member-bottom-details .social-bookmark li a:hover {
    background: #fff none repeat scroll 0 0;
    border-color: #fff;
    color: #6739B7;
}

.single-team:hover .member-bottom-details .social-bookmark {
    opacity: 1;
    z-index: 1;
}

.single-team:hover .member-top-details::before {
    opacity: 0.8;
}

.member-details h4,
.member-details p {
    opacity: 0;
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.member-details p {
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}

.single-team:hover .member-details h4,
.single-team:hover .member-details p {
    opacity: 1;
    -webkit-transform: translate(0px);
    transform: translate(0px);
}

.single-team:hover .member-bottom-details .social-bookmark li a {
    -webkit-transform: translate(0px);
    transform: translate(0px);
}

.single-team:hover .member-bottom-details .social-bookmark li:first-child a {
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.single-team:hover .member-bottom-details .social-bookmark li:nth-child(2) a {
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}

.single-team:hover .member-bottom-details .social-bookmark li:nth-child(3) a {
    -webkit-transition: all 0.6s ease 0s;
    transition: all 0.6s ease 0s;
}

/*---------------------------------
    10. INFO AREA
----------------------------------*/

.info-area .read-more {
    margin-top: 30px;
}

.author-designation {
    margin-bottom: 30px;
}

.author-designation h4 {
    margin-bottom: 5px;
}

.testmonial-author-details {
    font-style: italic;
}

/*---------------------------------
    11. TESTMONIAL AREA
----------------------------------*/

.author-image {
    border-radius: 50%;
    height: 100px;
    margin: 0 auto 20px;
    overflow: hidden;
    width: 100px;
}

.testmonial-area .owl-controls {
    height: 20px;
    margin-top: 30px;
    position: relative;
}

.testmonial-area .owl-dots {
    left: 50%;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.testmonial-area .owl-dots > div {
    border: 1px solid #9d9f9f;
    border-radius: 50%;
    display: inline-block;
    height: 15px;
    margin: 0 5px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 15px;
}

.testmonial-area .owl-dots > div.active {
    background: #2c105d none repeat scroll 0 0;
    border-color: #6739B7;
}

/*---------------------------------
    12. PRICE AERA
-----------------------------------*/

.single-price {
    background: #fff none repeat scroll 0 0;
    margin-bottom: 30px;
}

.price-hidding {
    padding: 30px;
}

.price-hidding h2 {
    margin-bottom: 10px;
}

.price-hidding p {
    margin-bottom: 0;
}

.price-rate {
    background: #6739B7 none repeat scroll 0 0;
    padding: 25px 0;
}

.price-rate h2 {
    margin-bottom: 0;
}

.price-rate h2 span {
    font-size: 18px;
    line-height: 1;
}

.price-details li {
    padding: 10px;
}

.price-details li:nth-child(2n + 1) {
    background: #f7f8f4 none repeat scroll 0 0;
}

.buy-now-button {
    padding: 25px 0;
}

/*---------------------------------
    13. WIDGETS AREA
----------------------------------*/

.feed-widget {
    background: #eeeeee none repeat scroll 0 0;
    overflow: hidden;
    padding: 20px;
}

.feed-widget h4 {
    padding: 15px 0;
    text-align: center;
}

.feed-widget.twitter-feed ul li {
    margin-bottom: 20px;
    padding-left: 40px;
    position: relative;
}

.feed-widget.twitter-feed ul li:last-child {
    margin-bottom: 0;
}

.feed-widget.twitter-feed ul li .twitter-icon {
    color: #6739B7;
    font-size: 20px;
    left: 0;
    position: absolute;
    top: 0;
    width: 40px;
}

.feed-widget.blog-feed .blog-details {
    padding: 20px;
}

.feed-widget.blog-feed .blog-details h4 {
    padding: 0;
}

.blog-feed .owl-nav > div {
    bottom: 0;
    left: 0;
    position: absolute;
}

.feed-widget a {
    color: #292929;
}

.feed-widget a:hover {
    color: #6739B7;
}

.blog-feed .owl-nav > div.owl-next {
    left: auto;
    right: 0;
}

.insta-feed ul li {
    float: left;
    overflow: hidden;
    width: 33.33%;
}

/*---------------------------------
    14. CONTACT AREA
----------------------------------*/

.contact-area h2 {
    margin-bottom: 30px;
}

.contact-address-details {
    padding: 50px 0;
}

.single-contact {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 40px;
    min-height: 60px;
    padding-left: 80px;
    position: relative;
}

.contact-icon {
    background: #2c105d none repeat scroll 0 0;
    border-radius: 50%;
    color: #fff;
    font-size: 30px;
    height: 60px;
    left: 0;
    padding-top: 15px;
    position: absolute;
    text-align: center;
    top: 0;
    width: 60px;
}

.contact-details h5 {
    margin-bottom: 5px;
}

.contact-details p {
    margin-bottom: 0;
}

.single-contact:last-child {
    margin-bottom: 0;
}

.contact-form input,
.contact-form textarea {
    border-radius: 0;
    /*margin-bottom: 20px;*/
    min-height: 50px;
    padding: 10px;
}

.contact-form button {
    background: #2c105d none repeat scroll 0 0;
    border: 0 none;
    color: #fff;
    letter-spacing: 1px;
    padding: 15px 20px;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.contact-form button:hover {
    background: #292929 none repeat scroll 0 0;
    color: #ffffff;
}

.map-area {
    margin-bottom: -50px;
}

/*---------------------------------
    15. FOOTER AREA
----------------------------------*/

.footer-social-bookmark .social-bookmark li a {
    border-radius: 5px;
    font-size: 20px;
    height: 40px;
    margin: 0 5px;
    padding-top: 8px;
    text-align: center;
    width: 40px;
}

.footer-social-bookmark .social-bookmark li a.facebook {
    background: #677fb5;
}

.footer-social-bookmark .social-bookmark li a.twitter {
    background: #70c2e9;
}

.footer-social-bookmark .social-bookmark li a.instagram {
    background: #895a4d;
}

.footer-social-bookmark .social-bookmark li a.google-plus {
    background: #d34836;
}

.footer-social-bookmark .social-bookmark li a.linkedin {
    background: #007ab9;
}

.footer-social-bookmark .social-bookmark li a.dribble {
    background: #e299c2;
}

.footer-social-bookmark .social-bookmark li a.flickr {
    background: #ff3ba4;
}

.footer-social-bookmark .social-bookmark li a.pinterest {
    background: #d8545d;
}

.footer-social-bookmark .social-bookmark li a:hover {
    background: #ffffff;
    color: #2c105d;
}

.footer-copyright {
    padding: 30px 0 15px;
    text-align: left !important;
}

.footer-copyright a:hover {
    color: #6739B7;
}

/*---------------------------------
    16. SCROLL TO TOP AREA
----------------------------------*/

.scrolltotop {
    background: #ffffff none repeat scroll 0 0;
    bottom: 75px !important;
    color: #2c105d;
    display: none;
    font-size: 20px;
    height: 40px;
    padding-top: 8px;
    position: fixed;
    right: 20px;
    text-align: center;
    width: 40px;
    z-index: 9;
}

.scrolltotop:hover {
    background: #2c105d;
    color: #ffffff;
}
.grid_item_overlay {
    position: absolute;
    left: 10%;
    top: 10%;
    width: 80%;
    height: 80%;
    background: #ffeb3bb3;
    color: #fff;
    padding: 20px;
    opacity: 0;
    transition: 0.6s;
    padding-top: 35%;
    z-index: 99;
    cursor: pointer;
}
.separator4 {
    height: 2px;
    width: 30px;
    margin: 20px 0px;
    background: #3095B7;
}
.title h3 {
    color: #fff
    font-family: 'source_sans_proregular';
    font-size: 1.714rem;
    line-height: 2.5rem;
    color: #3e3838 ;  
    font-weight: 300;
    margin: 0;
}
.modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 99999;
}
.modal.on {
    display: block;
    overflow: auto;
}
.modal-container {
    position: relative;
    display: block;
    top: 5%;
    width: 980px;
    margin: 0 auto;
    animation-name: fade-scale;
    animation-duration: 1s;
    animation-fill-mode: both;

}
.modal-container .modal-header {
    background: #3a225de3 !important;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
.modal-container .modal-header {
    position: relative;
    display: block;
    color: #ffffff;
    background: #fff;
}
.modal-container .modal-header .modal-title {
    font-family: 'Roboto', sans-serif;
    font-size: 30px;
    line-height: 1.2;
    color: #fff;
    font-weight: bold;
    text-align: center;
    padding: 20px 0;
}
.modal-container .modal-header span.close {
    position: absolute;
    display: block;
    width: 50px;
    height: 50px;
    top: 30px;
    right: 32px;
    cursor: pointer;
    color: #fff;
    opacity: 1 !important;
    font-size: 40px;
    text-align: center;
    padding: 22px 0;
    margin: 0;
    font-weight: 100 !important;
}
.modal-container .modal-content {
    position: relative;
    display: block;
    background-color: #f20000;
    /* overflow-y: auto; */
    height: 460px;
}
.modal-content {
    border: 0 !important;
    box-shadow: 0 0 0 rgba(57, 57, 57, 0.5) !important;
    padding: 16px 0;
    background-color: #fff !important;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
span.close:hover {
    background-color: #4c2981;
    border-radius: 50%;
}
iframe {
    overflow: scroll;
    height: 100%;
}
.single_portfolio:hover .grid_item_overlay{
    opacity: 1;
}
.grid_item_overlay a:hover i{
    color:#e74c3c;
    background: #fff;
}
.container {
    max-width: 1284px;
}
.container-modal {
    position: relative;
    display: block;
    float: left;
    cursor: pointer;
   /*width: 25%;*/
    /* height: 200px; */
    padding: 0;
}

.pdf{
    height: 18px;
}
.scrollbar
{
  float: left;
  height: 450px;
  overflow-y: scroll;
}
  .style-3::-webkit-scrollbar-track
{
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
  background-color: #F5F5F5;
}

.style-3::-webkit-scrollbar
{
  width: 6px;
  background-color: #F5F5F5;
}

.style-3::-webkit-scrollbar-thumb
{
  background-color: #000000;
}

.widget-iframe {
    border: 2px solid #ffffff;
    overflow: scroll !important;
    min-height: 400px !important;
}
.navbar-brand {
    float: left;
    height: 80px;
    padding: 30px 0px !important;
    font-size: 20PX;
    line-height: 20px;
    font-weight: 900;
    color: #2c105d;
}
.footer-social-bookmark {
    padding: 23px 0;
}
.footer-social-bookmark .social-bookmark {
    text-align: right;
}
.footer-social-bookmark .social-bookmark li a {
    /*background: #ababab none repeat scroll 0 0;*/
    border-radius: 50%;
    color: #fff;
    display: inline-block;
    font-size: 20px;
    height: 30px;
    padding-top: 4px;
    width: 30px;
}
.fa {
    font-family: "Font Awesome 5 Free";
}
.phone-field{
    font-family: sans-serif;
}

git clone git://github.com/smalot/bootstrap-datetimepicker.git

.contact-form input[type="text"], .contact-form input[type="email"],.contact-form select  {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: 1px solid #ccc;
  border-radius: 0;
  color: #444;
  height: 40px;
  margin-bottom: 16px;
  padding-left: 20px;
  width: 100%;
}

.contact-form textarea  {
  background: rgb(255, 255, 255) none repeat scroll 0 0;
  border: 1px solid #ccc;
  border-radius: 0;
  color: #444;
  height: 140px;
  padding: 10px;
  width: 100%;
}

/*.contact-form button[type="submit"] {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: 1px solid #ccc;
  color: #444;
  font-size: 16px;
  font-weight: 700;
  margin-top: 8px;
  padding: 12px 30px;
  text-transform: uppercase;
  transition: all 0.3s ease 0s;
  border-radius: 30px;
}

.contact-form button[type=submit]:hover {
  color: #fff;
  border: 1px solid #3EC1D5;
  background: #3EC1D5;
}
*/
.contact-form  #sendmessage {
  color: #3EC1D5;
  border: 1px solid #3EC1D5;
  display: none;
  text-align: center;
  padding: 15px;
  font-weight: 600;
  margin-bottom: 15px;
}

.contact-form #errormessage {
  color: red;
  display: none;
  border: 1px solid red;
  text-align: center;
  padding: 15px;
  font-weight: 600;
  margin-bottom: 15px;
}

.contact-form #sendmessage.show, .contact-form #errormessage.show, .contact-form .show {
  display: block;
}

#contact .form .validation {
  color: red;
  display: none;
  margin: 0 0 20px;
  font-weight: 400;
  font-size: 13px;
}
/*contact css*/
.arnno-msg, .username-msg, .mobno-msg, .emailid-msg, .cityname-msg, .statename-msg{color: red;position: absolute;right: 0;}
.clsError {
   border-bottom: 2px solid red !important;
   
   color: red !important;
}

.clsSuccess {
    border-bottom: 2px solid #c4d5de !important;
    color: #2b2a2a !important;
}
.main-content img{ max-width: 100% !important; }
#Calc6{height: 531px ;}
@media (max-width: 1080px) {
.modal-container {width: 800px;}
}
@media (max-width: 968px) {
    .modal-container .modal-content {height: 635px;}
    #Calc6 {height: 705px;}
    
    .separator4 {margin: 8px 0px;}
    iframe {overflow: scroll;height: 100%;}
    .modal-container { width: 600px;}
 }
 @media  (max-width: 852px) {
    .grid_item_overlay h3 {font-size: 17px; line-height: 25px;}
}
  @media (max-width: 480px) {
 #Calc6 { height: 790px;}
 .main_menu_bg .navbar-nav > li > a {font-size: 10px;}
}
 @media (max-width: 768px) {
  
    .modal-container { width: 528px;}
    .modal-container .modal-header .modal-title {font-size: 22px;padding-left: 11px;text-align: left;}
    .modal-container .modal-header span.close {top: 21px;width: 45px;height: 45px; right: 8px; padding-top: 18px;}
    .cont_resp {width: 100%;margin: auto !important;}
    .main_trial .col-sm-2{ width: 33%; float: left; }
    .navbar-collapse.in { overflow-y: auto !important; background-color: rgba(255, 255, 255, 0.83);}
    .modal-container { width: 350px;}
    .modal-container .modal-header .modal-title {font-size: 16px;}
  }
  @media (max-width: 479px) {
    .modal-container {width: 280px;}
    .modal-container .modal-header span.close {top: 33px;width: 26px;height: 26px; right: 8px;font-size: 30px;padding: 8px;}
    .grid_item_overlay h3 { font-size: 14px; line-height: 15px;}
    .portfolio-details h4{
        font-size:14px; 
    }
  }
  #planners .container{max-width:100% !important;padding: 0 !important;}
  #planners .col-sm-12{padding: 0 !important;}

  .modal-header .close {
    margin-top: -32px;
}
button.close {
    -webkit-appearance: none;
    padding: 0;
    cursor: pointer;
    background: 0 0;
}
.close {
    float: right;
    font-size: 34px;
    font-weight: 700;
    line-height: 0;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=20);
    opacity: .2;
}
.footer-bottom-area{
    margin-bottom: 0 !important;
}
.source-heading{
                    padding: 0px 23px;
}
.fw-feed-title{
    font-weight: bold;
    margin: 0 20px;
    padding: 20px 0 15px 0;
    word-wrap: break-word;
    border-bottom: 1px solid #dbdee1;
    color: #8fa4ad;
}
.fw-feed-title a:visited {
    color: #8fa4ad;
}
.fw-feed-title a:link {
    color: #8fa4ad;
}

div.fileinputs {
    position: relative;
}

div.fakefile {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1;
    width: 100%;
}

input.file {
    position: relative;
    text-align: right;
    -moz-opacity:0 ;
    filter:alpha(opacity: 0);
    opacity: 0;
    z-index: 2;
    width: 100%;
}
.file-up{border: 1px solid #ccc;width: 333px;color: #000;background-color: #ffffff;
    font-size: 14px;width: 100%;}
.blog-and-feed-area h2{ font-size: 25px; margin-top: 30px;
}
.forms-image{
    width: 169px;
    height: 119px;
    vertical-align: middle;
    display: table-cell;
    border: 1px solid #dedede;
    padding: 10px;
}
.photography{
    margin-bottom: 28px;
}

.mf_iframe{height: 1500px}

 .TableContainer {
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 20px 0 0 0;
        }
/* .TableContainer .table {*/
/*    width: 75%;*/
/*}*/
.GrievanceTitle {
    padding: 40px 0px 10px 0px;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
    /*margin: 0 0 20px;*/
    
    /*display: flex;*/
    /*justify-content: center;*/
}
.SocialMediaBox {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.InvestorCharterBox{
    padding:50px;
}
.InvestorCharterBox a {
      color: #007bff;
      text-decoration: none;
    }

 .InvestorCharterBox  a:hover {
      text-decoration: underline;
    }

.FooterBox{
        padding: 0 20px 0 20px;
}
.FooterContactBox {
    display: flex;
    padding: 50px;
    gap: 100px;
}

@media (max-width: 991px){
    .mf_iframe{height: 2700px !important}
}
@media (max-width: 420px){
    .mf_iframe{height: 2900px !important}
}

@media (max-width: 767px){
.FooterContactBox {
    gap: 25px;
    padding: 15px;
    flex-direction: column;
}
.TableContainer {
    overflow: scroll;
}
.footer-social-bookmark .social-bookmark {
    display: flex;
    justify-content: center;
}
.InvestorCharterBox {
    padding: 15px;
}
}