/** * * Master Style Sheet * * Project: Strategist (Multi Purpose HTML5 Template) * Last Changes: 10-13-2019 * Developed By: Muhammad Noman * ***************************** * * General * Header * Login / Register Form * Hero Section * Heading * Hexagon * Services * Why choose us * Consultant * Funfact * Work / Project * Pricing plan * Cleints * Blog * Footer * Scroll up * Inner Pages * SEO Analyser * Team * Service * Single Post * Single Project * Single Team * Contact * Faqs * 404 page */ body { font-family: 'Roboto', sans-serif; font-size: 17px; width: 100%; margin: 0; padding: 0; background:#D20639; } a, a:hover, a:active { color: inherit; outline: 0; text-decoration: inherit; } p { font-family: 'Roboto', sans-serif; font-size: 17px; line-height: 28px; color:#FAF2F4; } h1, h2, h3, h4, h5, h6 { font-family: 'Poppins', sans-serif; font-weight: 700; color:#FFFFFF; } h2 { font-size: 28px; } h3 { font-size: 26px; font-weight: 600; } ul, ol { margin: 0; padding: 0; list-style: none; } figure { margin: 0; } img { max-width: 100%; height: auto; } .form-control:focus, button:focus, textarea:focus, select:focus, input:focus { outline: none; box-shadow: none; } textarea { resize: none; } .form-control { border: 2px solid rgb(246, 246, 254); border: 1px solid #f0f0f0; padding: 11px 17px; } .container-fluid { padding: 0; } .ns-wrap { position: relative; width: 100%; overflow-x: hidden; } .ns-block-box { position: relative; width: 100%; padding: 50px 0; } .sep-sec { position: relative; max-width: 70%; margin: 0 auto; height: 1px; background: #f0f0f0; } /* Default Carousel Style =====================================*/ .owl-theme .owl-nav.disabled + .owl-dots { margin-top: 31px; } .owl-theme .owl-dots .owl-dot { vertical-align: middle; } .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { width: 41px; height: 7px; border: 0; border-left: 20px solid rgb(32, 203, 189); box-shadow: 0 8px 16px 0 rgba(0,0,0,.1),0 2px 4px 0 rgba(0,0,0,.08); } /* Buttons =====================================*/ .btn-hover { position: relative; display: inline-block; width: 200px; font-size: 18px; font-weight: 500; line-height: 1; letter-spacing: 0.3px; color: #fff; cursor: pointer; margin-top: 20px; padding: 19px 31px; text-align:center; border: none; background-size: 300% 100%; -moz-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; -webkit-transition: all .4s ease-in-out; transition: all .4s ease-in-out; } .btn-hover:hover { color: #ffffff; background-position: 100% 0; -moz-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; -webkit-transition: all .4s ease-in-out; transition: all .4s ease-in-out; } .btn-hover:focus { outline: none; } .btn-hover.color-1 { background-image: linear-gradient(to right, #25aae1, #40e495, #30dd8a, #2bb673); box-shadow: 0 4px 15px 0 rgba(49, 196, 190, 0.75); } .btn-hover.color-2 { background-image: linear-gradient(to right, #f5ce62, #e43603, #fa7199, #e85a19); box-shadow: 0 4px 15px 0 rgba(229, 66, 10, 0.75); } .btn-hover.color-3 { background-image: linear-gradient(to right, #667eea, #764ba2, #6B8DD6, #8E37D7); box-shadow: 0 4px 15px 0 rgba(116, 79, 168, 0.75); } .btn-hover.color-4 { background-image: linear-gradient(to right, #fc6076, #ff9a44, #ef9d43, #e75516); box-shadow: 0 4px 15px 0 rgba(252, 104, 110, 0.75); } .btn-hover.color-5 { background-image: linear-gradient(to right, #0ba360, #3cba92, #30dd8a, #2bb673); box-shadow: 0 4px 15px 0 rgba(23, 168, 108, 0.75); } .btn-hover.color-6 { background-image: linear-gradient(to right, #009245, #FCEE21, #00A8C5, #D9E021); box-shadow: 0 4px 15px 0 rgba(83, 176, 57, 0.75); } .btn-hover.color-7 { background-image: linear-gradient(to right, #6253e1, #852D91, #A3A1FF, #F24645); box-shadow: 0 4px 15px 0 rgba(126, 52, 161, 0.75); } .btn-hover.color-8 { background-image: linear-gradient(to right, #29323c, #485563, #2b5876, #4e4376); box-shadow: 0 4px 15px 0 rgba(45, 54, 65, 0.75); } .btn-hover.color-9 { background-image: linear-gradient(to right, #25aae1, #4481eb, #04befe, #3f86ed); box-shadow: 0 4px 15px 0 rgba(65, 132, 234, 0.75); } .btn-hover.color-10 { background-image: linear-gradient(to right, #ed6ea0, #ec8c69, #f7186a , #FBB03B); box-shadow: 0 4px 15px 0 rgba(236, 116, 149, 0.75); } .btn-hover.color-11 { background-image: linear-gradient(to right, #eb3941, #f15e64, #e14e53, #e2373f); box-shadow: 0 5px 15px rgba(242, 97, 103, .4); } .theme-btn { position: relative; display: inline-block; background: #f6f6fe; padding: 13px 31px; font-size: 16px; font-weight: 500; } .theme-btn:hover { background: #333bd5; background: #6975dd; color: #ffffff; } /* Attr box & block =====================================*/ .ns-cell { position: relative; display: table; width: 100%; } .ns-cell .ns-media, .ns-cell .ns-content { display: table-cell; vertical-align: middle; } .ns-box, .ns-iblock, .ns-fblock, .ns-block, .ns-block > .ns-media, .ns-block > .ns-content { display: block; position: relative; } .ns-box .ns-content { position: absolute; left: 0; top: 50%; width: 100%; padding: 15px; text-align: center; } .ns-fblock > .ns-media { float: left; } .ns-fblock > .ns-content { float: right; } .ns-iblock > * { display: inline-block; } /* Background images =====================================*/ .ns-parallax-bg, .ns-moving-bg, .ns-fix-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; z-index: -3; } .ns-fix-bg { background-repeat: no-repeat; background-position: center; } .ns-moving-bg { background-size: cover; background-attachment: fixed; } .ns-grey-bg::before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #222121; z-index: -2; } .ns-grey-bg.h-55::before { height: 55%; } /* Opacity =====================================*/ .ns-opacity1::before { opacity: 1; } .ns-opacity2::before { opacity: 0.2; } .ns-opacity3::before { opacity: 0.3; } .ns-opacity4::before { opacity: 0.4; } .ns-opacity5::before { opacity: 0.5; } .ns-opacity6::before { opacity: 0.6; } .ns-opacity7::before { opacity: 0.7; } .ns-opacity8::before { opacity: 0.8; } .ns-opacity9::before { opacity: 0.9; } /* Menu =====================================*/ .ns-main-menu { z-index: 999; background: #000; border-bottom: 1px solid #f6f6fe; } .ns-main-menu.ns-sticky { position: fixed; top: 0; left: 0; width: 100%; } .ns-main-menu nav { padding: 0 15px; height: 71px; } .ns-main-menu #navbarSupportedContent { height: 100%; } .ns-main-menu .navbar-nav { font-family: 'Poppins', sans-serif; height: 100%; padding-left: 9%; } .ns-main-menu .nav-item { margin-right: 21px; height: 100%; } .ns-main-menu a.nav-link { text-transform: capitalize; font-size: 16px; font-weight: 700; height: 100%; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; color:#fff; } .ns-sideMenu li.drapdown > a::after, .ns-main-menu .dropdown-toggle::after { font-family: 'Font Awesome 5 Free'; font-weight: 900; font-size: 85%; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; width: inherit; height: inherit; margin-left: 5px; vertical-align: inherit; border: 0; } .ns-sideMenu li.drapdown a::after { display: inherit; margin-top: 0; } .ns-main-menu .dropdown-menu { display: inherit; top: -webkit-calc(100% + 35px ); top: -moz-calc(100% + 35px ); top: calc(100% + 35px ); min-width: 15rem; padding: 1.3rem 0; visibility: hidden; opacity: 0; -webkit-transition: all .5s cubic-bezier(.68,-0.55,.27,1.55); -moz-transition: all .5s cubic-bezier(.68,-0.55,.27,1.55); -ms-transition: all .5s cubic-bezier(.68,-0.55,.27,1.55); -o-transition: all .5s cubic-bezier(.68,-0.55,.27,1.55); transition: all .5s cubic-bezier(.68,-0.55,.27,1.55); border-color: transparent; } .ns-main-menu .dropdown-item { color: #484848; padding: .4rem 1.7rem; } .ns-main-menu .dropdown-item:focus, .ns-main-menu .dropdown-item:hover { background-color: inherit; } .ns-main-menu nav ul li.dropdown:hover ul { top: -webkit-calc(100% - 7px ); top: -moz-calc(100% - 7px ); top: calc(100% - 7px ); visibility: visible; opacity: 1; } .ns-logo.navbar-brand { position: relative; padding: 0; font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 27px; margin: 0; } .ns-logo.navbar-brand::before { content: ''; width: 27%; height: 4px; position: absolute; left: 0; bottom: 0; } .ns-logo.navbar-brand::after { content: ''; position: absolute; left: 41px; bottom: 0; width: 13px; height: 4px; } .ns-rlogin { font-family: 'Poppins', sans-serif; font-weight: 500; font-size: 16px; } .ns-rlogin i { display: inline-block; vertical-align: middle; padding-right: 8px; } /* Menu Toggle =====================================*/ .sidebarIconToggle { cursor: pointer; width: 22px; margin-bottom: 0; } .IconToggle { position: absolute; height: 3px; width: 100%; background-color: #6d7393; } .diagonal.part-1 { position: relative; } .horizontal { position: relative; margin-top: 3px; } .diagonal.part-2 { position: relative; margin-top: 3px; } .ns-open > .diagonal.part-1 { -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); margin-top: 8px; } .ns-open > .horizontal { opacity: 0; } .ns-open > .diagonal.part-2 { -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); -ms-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg); margin-top: -9px; } /* Side Element =====================================*/ .sideElement { height: 100%; min-width: 351px; max-width: 351px; position: fixed; z-index: 999; top: 0; right: -351px; visibility: hidden; opacity: 0; background: #ffffff; overflow-x: hidden; padding-top: 60px; box-shadow: 0 0 35px rgba(0,0,0, 0.1); } .sideElement.ns-open { right: 0px; visibility: visible; opacity: 1; } .sideElement > a { padding: 8px 8px 8px 32px; text-decoration: none; font-size: 25px; display: block; } .sideElement > a:hover { color: #f1f1f1; } .sideElement .closebtn { position: absolute; top: 0; right: 25px; font-size: 36px; margin-left: 50px; } .ns-sideMenu { padding: 5px 41px; } .ns-sideMenu li { font-family: 'Poppins', sans-serif; font-size: 18px; margin-bottom: 11px; } .ns-sideMenu ul > li ul { display: none; } .ns-sideMenu ul > li ul { padding-left: 11px; margin-top: 11px; } .ns-sideMenu ul > li ul li { font-size: 17px; } .ns-sideMenu .ns-logo { margin-bottom: 30px; } .form-group i { position: absolute; left: 35px; top: 50%; color: #757575; font-size: 15px; } div.login-register .form-control { padding: 11px 17px 11px 43px; } .forgot-el, .register-el { display: none; } .ns-rememberme { text-align: left; } .ns-rememberme label { position: relative; padding-left: 27px; cursor: pointer; font-size: 15px; } .ns-rememberme label::before { content: ''; position: absolute; left: 0; top: 2px; width: 19px; height: 19px; background: #e0e0fb; cursor: pointer; } .ns-field input[type="checkbox"] { position: absolute; left: 0; opacity: 0; width: 0; cursor: pointer; } .ns-field input[type="checkbox"]:checked + label::after { content: "\f00c"; position: absolute; left: 5px; top: 4px; font-family: 'Font Awesome 5 Free'; font-weight: 900; color: #8e4bff; font-size: 10px; } .ns-forgot { text-align: right; } .ns-forgot a { font-size: 15px; border-bottom: 2px dashed #e0e0fb; } .ns-lr-info { margin-top: 13px; font-size: 15px; margin-bottom: 0; } .login-register .sep-line { width: 111px; font-size: 15px; color: #6974df; } .login-register .sep-line::before { left: -3px; top: 9px; } .login-register .sep-line::after { right: 21px; top: 9px; } .ns-social-login { display: block; width: 100%; padding-top: 13px; } .ns-social-login li { margin-bottom: 11px; margin: 7px auto; text-align: left; display: inline-block; margin-right: 5px; width: 48%; } .ns-social-login li:last-child { margin-right: 0; } .ns-social-login li a { padding: 11px 17px; font-size: 15px; text-align: center; display: inline-block; width: 100%; } .ns-social-login li a i { margin-right: 9px; } .facebook { color: #3d5798; background-color: rgba(61, 87, 152,.1); } .facebook:hover { color: #ffffff; background-color: #3d5798; } .google-plus { color: #c42f11; background: rgba(196, 47, 17,.1); } .google-plus:hover { color: #ffffff; background-color: #c42f11; } /* Hero Sec =====================================*/ .ns-herosec { position: relative; } .subtilte { display: inline-block; position: relative; margin-bottom: 11px; font-size: 16px; font-weight: 500; font-family: 'Poppins', sans-serif; } .subtilte::after, .subtilte::before { content: ''; position: absolute; right: -47px; width: 31px; height: 4px; top: 50%; } .subtilte::after { right: -65px; width: 13px; } .ns-herosec h1 { font-size: 32px; margin-bottom: 25px; } .ns-herosec p { margin-bottom: 15px; font-size: 18px; line-height: 30px; width: 90%; } .ns-playwrap { margin-left: 30px; margin-top: 20px; cursor: pointer; } .ns-playwrap span { font-size: 17px; line-height: 23px; } .ns-play { width: 51px; height: 51px; background: rgb(221, 5, 86,.3); margin-right: 15px; background: #f0f8ff; -webkit-transition: all .5s cubic-bezier(.68,-0.55,.27,1.55); -moz-transition: all .5s cubic-bezier(.68,-0.55,.27,1.55); -ms-transition: all .5s cubic-bezier(.68,-0.55,.27,1.55); -o-transition: all .5s cubic-bezier(.68,-0.55,.27,1.55); transition: all .5s cubic-bezier(.68,-0.55,.27,1.55); } .ns-play i { text-align: center; padding-left: 5px; font-size: 13px; } .ns-playwrap:hover .ns-play { color: #ffffff; } /* Heading =====================================*/ .ns-heading { position: relative; text-align: center; max-width: 100%; margin: 0 auto; padding: 0 15px 47px 15px; margin-top: -5px; } .ns-heading i { font-size: 1.5rem; } .ns-heading h2 { position: relative; text-transform: capitalize; margin-bottom: 15px; } .ns-heading h2 span { color: #F7CE0D; font-weight: 700; } .ns-heading p { font-size: 18px; margin-bottom: 0; color:#EEE7E8; text-align:justify; } .sep-line.with-left { margin-left: 0; } .sep-line.with-right { margin-right: 0; } .sep-line { display: block; margin: 11px auto; margin-bottom: 17px; width: 60px; height: 4px; position: relative; } .sep-line::after { content: ''; position: absolute; right: 0; top: 0; width: 15px; height: 100%; } .sep-line::before { content: ''; position: absolute; left: 0; top: 0; width: 39px; height: 100%; } /* Hexagon =====================================*/ .ns-hexagon { width: 100px; height: 55px; position: relative; display: table; margin: auto; margin-bottom: 2.5rem; box-shadow: 0 8px 16px 0 rgba(0,0,0,.1),0 2px 4px 0 rgba(0,0,0,.08); } .ns-hexagon:before { content: ""; position: absolute; top: -25px; left: 0; width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 25px solid; } .ns-hexagon:after { content: ""; position: absolute; bottom: -25px; left: 0; width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-top: 25px solid; } .ns-hexagon i { display: table-cell; vertical-align: middle; text-align: center; font-size: 27px; font-size: 35px; color: #fff; box-shadow: 0 8px 16px 0 rgba(0,0,0,.1),0 2px 4px 0 rgba(0,0,0,.08); } .ns-hexagon.ns-style2 { width: 55px; height: 55px; background-color: #f6f6fe; margin-top: 1.5rem; box-shadow: inherit; } .ns-hexagon.ns-style2::before { border-left: 27px solid transparent; border-right: 27px solid transparent; border-bottom: 25px solid #f6f6fe; } .ns-hexagon.ns-style2::after { border-left: 27px solid transparent; border-right: 27px solid transparent; border-top: 25px solid #f6f6fe; } .ns-hexagon.ns-style2 i { font-size: 30px; box-shadow: inherit; } /* Services =====================================*/ .ns-services { border: 1px solid #f0f0f0; } .row > div:nth-child(3n+2) > .ns-services { border-left-width: 0; border-right-width: 0; } .row > div:nth-child(n+4) > .ns-services { border-top-width: 0; } .ns-services { padding: 1.5rem; } .ns-services .ns-content { padding-left: 1.5rem; } .ns-services .row img { padding-bottom: 25px; } .ns-services h3 { padding-bottom: 7px; margin-bottom: 0; } .ns-services p { margin-bottom: 0; } /* Why choose us =====================================*/ .row.ns-featr-list { margin-top: 25px; margin-left: -10px; margin-right: -10px; } .row.ns-featr-list li { padding-left: 10px; padding-right: 10px; margin-bottom: 18px; } .featr-info { font-family: 'Poppins', sans-serif; padding: 20px 20px; display: inline-block; width: 100%; padding-left: 70px; border: 1px solid #f0f0f0; font-size: 17px; font-weight: 500; } .featr-info i { font-size: 20px; position: absolute; left: 20px; width: 45px; height: 45px; background-color: #f6f6fe; text-align: center; line-height: 45px; top: 9.5px; } /* Consultant =====================================*/ .ns-contact-form { background: #ffffff; text-align: center; } .form-title { color: #fff; height: 111px; padding: 15px; margin-bottom: 36px; display: table; width: 100%; position: relative; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 102px; } .form-title span { font-family: 'Poppins', sans-serif; font-size: 22px; font-weight: 500; position: relative; display: table-cell; vertical-align: middle; width: 100%; height: 100%; z-index: 1; } .form-title::before { content: ''; position: absolute; left: 0; top: 15px; width: 100%; height: 100%; border-bottom-right-radius: 83px; } .form-title::after { content: ''; position: absolute; left: 0; top: 0px; width: 100%; height: 100%; border-bottom-right-radius: 83px; border-top-left-radius: 7px; border-top-right-radius: 7px; } .form-title i { margin-bottom: 11px; position: absolute; right: 31px; top: 27px; } .ns-contact-form form { padding: 0 2rem 2rem; } .ns-contact-form .theme-btn { width: 100%; padding: 11px; } .ns-msg-wrap { position: fixed; top: 20%; right: 0; max-width: 300px; z-index: 9999; } .ns-msg { position: relative; right: -300px; margin-bottom: 15px; } .ns-msg p { margin: 0; } .ns-msg.active { -webkit-transform: translateX(-320px); -moz-transform: translateX(-320px); -ms-transform: translateX(-320px); -o-transform: translateX(-320px); transform: translateX(-320px); } .ns-list { margin-top: 25px; margin-bottom: 0; padding-left: 5px; } .ns-list li { position: relative; display: table; margin-bottom: 13px; } .ns-list li:last-child { margin-bottom: 0; } .ns-list i { display: table-cell; width: 19px; text-align: center; margin-right: 11px; font-size: 13px; color: rgba(97, 12, 239); } .ns-list li span { display: table-cell; padding-left: 21px; } .ns-list .fa.fa-times { color: #ff4d8c; } .ns-list li i::after { content: ''; position: absolute; left: -4px; top: 1px; width: 27px; height: 27px; background: #f6f6fe; border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%; z-index: -3; } /* Funfact =====================================*/ .ns-funfact i { position: relative; font-size: 57px; width: 1rem; z-index: 1; } .ns-funfact .ns-content { padding-left: 25px; } .ns-funfact p { margin-bottom: 0; } .ns-funfact .clr-01 { color: #6aa6f6; } .ns-funfact .clr-02 { color: #febb59; } .ns-funfact .clr-03 { color: #87cd56; } /* Work =====================================*/ .ns-work { position: relative; margin-bottom: 30px; } .ns-work figure { position: relative; overflow: hidden; } .ns-work figure::before { content: ''; position: absolute; left: 50%; top: 0; width: 11%; height: 100%; background: #000; visibility: hidden; opacity: 0; z-index: 1; } .ns-work:hover figure::before { left: 0; top: 0; width: 100%; height: 100%; opacity: 0.7; visibility: visible; } .ns-work-meta { position: absolute; background: transparent; padding: 19px 27px; z-index: 5; left: 15px; right: 15px; top: 50%; text-align: center; opacity: 0; visibility: hidden; -webkit-transform: translateY(-10%) scale(.5); -moz-transform: translateY(-10%) scale(.5); -ms-transform: translateY(-10%) scale(.5); -o-transform: translateY(-10%) scale(.5); transform: translateY(-10%) scale(.5); } .ns-work:hover .ns-work-meta { opacity: 1; visibility: visible; -webkit-transform: translateY(-50%) scale(1); -moz-transform: translateY(-50%) scale(1); -ms-transform: translateY(-50%) scale(1); -o-transform: translateY(-50%) scale(1); transform: translateY(-50%) scale(1); } .ns-work-meta h3 { color: #ffffff; } .ns-work-meta p { margin: 0; color: #ffffff; font-size: 17px; } .ns-work-meta .openclose { text-align: center; position: relative; width: 33px; height: 33px; line-height: 33px; font-size: 14px; cursor: pointer; color: #ffffff; display: inline-block; margin-top: 11px; } /* Pricing plan =====================================*/ .ns-pricing-box.style2 { border: 1px solid #f0f0f0; } .ns-pricing-box:hover { box-shadow: 0px 0px 25px 0px rgba(207, 207, 207, 0.4); } .ns-pricing-box .theme-btn { background-size: 10%; width: 200px; margin-bottom: 15px; padding: 14px 31px; font-size: 18px; } .ns-pricing-box .theme-btn:hover { background-image: linear-gradient(to right, #667eea, #764ba2, #6B8DD6, #8E37D7); background-size: 300% 100%; } .ns-pricing-box .btn-hover { margin-top: 0; margin-bottom: 15px; } .ns-pricing-box .card { border: 0; } .ns-pricing-box .card-body { padding: 1.25rem 1.25rem 2rem; background:#000000; } .ns-pricing-box ul { padding: 1.25rem 2rem 3rem; } .list-group-item { border: 1px solid #fff; padding: .75rem 1rem; background:#000000; } .ns-plan-price { font-size: 59px; font-weight: 700; } .ns-pricesign { font-size: 31px; vertical-align: top; display: inline-block; } .ns-pointprice { font-size: 31px; display: inline-block; vertical-align: bottom; } .card-header { background-color: #f4f4ff; background-color: #47063A; border-bottom: 1px solid #f0f0f0; font-family: 'Poppins', sans-serif; font-size: 31px; font-weight: 600; } .card-header span { position: relative; bottom: 0; right: 0; font-size: 15px; border: 1px solid rgb(197, 240, 237); padding: .3rem .7rem; font-weight: 400; } .ns-pricing-box li span { font-weight: 600; } /* Cleints =====================================*/ .ns-client-carousel .owl-stage-outer { overflow: initial; } .ns-client-carousel { overflow: hidden; padding: 15px; margin: -15px -15px -35px; } .ns-client { padding: 21px; margin-bottom: 21px; border: 1px solid #f0f0f0; } .ns-client-img { position: relative; } .ns-client-img i { position: absolute; top: -13px; right: -9px; width: 35px; height: 35px; line-height: 35px; color: #fff; font-size: 13px; text-align: center; border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%; } .ns-client p { line-height: 27px; } .ns-client h3 { font-size: 18px; } .ns-client h3 span { display: block; font-family: 'Roboto', sans-serif; font-size: 16px; font-weight: 400; margin-top: 6px; } /* Blog =====================================*/ .ns-blog { position: relative; background: #ffffff; overflow: hidden; } .ns-blog figure { overflow: hidden; } .upper-meta { position: relative; font-size: 15px; font-weight: 500; display: inline-block; margin-bottom: 15px; color: #755757; } div.ns-blog .ns-postmeta { position: relative; padding: 30px; } .ns-postmeta h3 { font-weight: 600; line-height: 31px; } .ns-blog .ns-postmeta > a { display: inline-block; vertical-align: middle; line-height: 1; } .ns-blog .ns-postmeta > a i { display: inline-block; vertical-align: middle; line-height: 1; margin-right: 9px; } .upper-meta span { margin: 0 2px; } /* Footer: About =====================================*/ .ns-footer { position: relative; } .ns-contact-info li { padding-bottom: 9px; } .ns-contact-info li .fa { padding-right: 11px; } .ns-contact-info li a { padding-left: 11px; } /* Footer: Helpfull link =====================================*/ .ns-helpfull-link li { position: relative; margin-bottom: 11px; } .ns-helpfull-link li:last-child { margin-bottom: 0; } .ns-helpfull-link li a { padding-left: 15px; position: relative; color:#fff; font-weight:700; } .ns-helpfull-link a::before { font-family: 'Font Awesome 5 Free'; position: absolute; left: 0; top: 50%; font-weight: 900; line-height: 33px; font-size: 13px; } /* Footer: Newsletter =====================================*/ .ns-newsletter .input-group-text { background-color: #f8f9fa; color: #737573; padding: 0 15px; } .ns-newsletter .fa { font-size: 16px; } .ns-newsletter input { background-color: transparent; border: 1px solid #ced4da; } .ns-newsletter button { display: none; } .ns-newsletter .ns-secure-note { padding-top: 11px; margin: 0; } .ns-newsletter strong { padding-right: 5px; } .ns-social li { display: inline-block; } .ns-social li a { display: table; } .ns-social li i { display: table-cell; vertical-align: middle; } /* Footer: Instagram =====================================*/ .ns-gallery.row { margin-left: -1px; margin-right: -1px; } .ns-gallery.row > div { padding: 1px; } /* Footer: Copyright =====================================*/ .ns-copyright { text-align: center; padding: 21px 21px 57px; border-top: 1px solid #e9ecef } .ns-copyright p { margin: 0; } .ns-copyright .navbar-brand { margin-bottom: 15px; } /* Footer: Scroll up =====================================*/ .ns-scroll-up { position: fixed; bottom: 10px; right: 20px; width: 41px; height: 41px; color: #ffffff; background-color: #1fc7ba; text-align: center; line-height: 41px; cursor: pointer; visibility: hidden; opacity: 0; } .ns-scroll-up.ns-active { visibility: visible; opacity: 1; bottom: 55px; } /* Inner Pages =====================================*/ .ns-inner-pages p { margin-bottom: 1.5rem; color:#FAF2F4; font-size:18px; } .breadCrumb { margin-top: 25px; background: #ffffff; padding: 11px 30px; margin-bottom: 0; position: relative; display: inline-block; z-index: 1; box-shadow: 0 0 35px rgb(238, 238, 252); } .breadCrumb li { display: inline-block; padding-right: 24px; position: relative; } .breadCrumb li:last-child { padding-right: 0px; } .breadCrumb li::before { content: '-'; position: absolute; right: 6px; } .breadCrumb li:last-child::before { content: none; } /* Inner Page: Seo Features =====================================*/ .seo-featr { position: relative; } .ns-analysis-form { max-width: 90%; margin-top: 25px; } .ns-analysis-form .row { margin-left: -5px; margin-right: -5px; } .ns-analysis-form .row > div { padding-left: 5px; padding-right: 5px; } /* Inner Page: See SEO score =====================================*/ .ns-tab > ul { position: relative; } .ns-tab li { position: relative; padding: 45px 35px; font-family: 'Poppins', sans-serif; font-size: 16px; text-transform: capitalize; font-weight: 500; background: #fbfbfb; } .ns-tab li:not(:last-child) { border-right: none; } .ns-tab li a { display: inline-block; } .ns-tab li.active { background: #f4f4f4; } .ns-tab li a span { position: absolute; left: 0; top: 0; padding: 5px 14px; background: #f6f6fe; z-index: -1; font-size: 14px; font-weight: 500; display: none; } .ns-tab li a span i { font-size: 13px; } .ns-tab li:last-child span { display: inline-block; position: relative; margin-bottom: -4px; margin-right: 20px; font-size: 16px; } .ns-tab li a i { font-size: 20px; display: block; text-align: center; margin-bottom: 15px; } .ns-tab li::before { content: ''; position: absolute; top: 50%; left: 0; width: 1px; height: 50%; background: rgba(0,0,0,0.07); } .ns-tab li:last-child::after { right: 0; left: auto; } .ns-tab li:first-child::before, .ns-tab li.active:last-child::after, .ns-tab li.active + li::before, .ns-tab li.active::before { content: none; } .ns-tab li.active::before { position: absolute; content: ''; width: 0; height: 0; border-right: 10px solid transparent; border-left: 10px solid transparent; border-top: 10px solid #f4f4f4; top: auto; bottom: -10px; left: 50%; background: transparent; z-index: 1; } .ns-tab-content { padding-top: 40px; } .ns-tab-content h3 { width: 90%; margin-top: 5px; border-bottom: 1px solid #f0f0f0; padding-bottom: 13px; } /* Inner Page: Team =====================================*/ .ns-team img { margin: 0 auto; } .ns-team h3 span { display: block; font-family: 'Roboto', sans-serif; font-weight: 400; font-size: 16px; margin-top: 6px; } .ns-team p { padding-top: 9px; } .be-social { padding-top: 11px; margin-bottom: -11px; } .be-social li { display: inline-block; vertical-align: middle; padding-right: 4px; margin-bottom: 11px; } .be-social li a { font-size: 13px; display: table; border: 1px solid; width: 41px; height: 41px; text-align: center; } .be-social i { display: table-cell; vertical-align: middle; } .be-social li a:hover { border-color: transparent; } .f-facebook { color: #4474db; background-color: #ffffff; } .f-facebook:hover { color: #ffffff; background-color: #4474db; } .t-twitter { color: #55acee; background-color: #ffffff; } .t-twitter:hover { color: #ffffff; background-color: #55acee; } .v-vimeo { color: #1ab7ae; background-color: #ffffff; } .v-vimeo:hover { color: #ffffff; background-color: #1ab7ae; } .in-linkedin { color: #0077b5; background-color: #ffffff; } .in-linkedin:hover { color: #ffffff; background-color: #0077b5; } /* Inner Pages: services page ==================================== */ .ns-sol-list { margin-bottom: 0; } .ns-sol-list ul { padding-top: 5px; } .ns-sol-list p { margin: 0; } .ns-sol-list > li { margin-bottom: 20px; } ul.ns-sol-list > li:last-child { margin-bottom: 0; } .list-metadata .ns-media { width: 70px; vertical-align: top; } .icon-wrap { background: #ffffff; font-size: 25px; width: 70px; height: 70px; line-height: 70px; text-align: center; color: #6aa6f6; } .list-metadata .ns-content { padding-left: 25px; } .clr-2 { color: #febb59; } .clr-3 { color: #87cd56; } .ns-sol-list li:hover .clr-1 { background: #6aa6f6; color: #ffffff; } .ns-sol-list li:hover .clr-2 { background: #febb59; color: #ffffff; } .ns-sol-list li:hover .clr-3 { background: #87cd56; color: #ffffff; } .ns-sol-list.style2 { margin: 0; } .ns-sol-list.style2 > li { margin-bottom: 50px; } .style2 .list-metadata { text-align: center; padding: 0 15px; } .style2 .list-metadata .ns-content { padding-left: 0; } .style2 .list-metadata .ns-media { margin: 0 auto 20px; } .ns-img { position: relative; text-align: center; } /* Inner Pages: Single post ==================================== */ .ns-service-detail .be-social, .ns-blog-detail .be-social { padding: 0; } .be-social span { margin-right: 9px; } .ns-tag > span { margin-right: 15px; } .ns-tag a { display: inline-block; background: #f9f9f9; padding: 7px 27px; margin-right: 5px; margin-bottom: 15px; } .ns-next-previous { margin-top: 30px; padding: 21px 0; border-top: 1px solid #f4f4f4; border-bottom: 1px solid #f4f4f4; } .ns-next-previous i { font-size: 15px; display: inline-block; vertical-align: middle; } .ns-next-previous .ns-previous i { margin-right: 5px; } .ns-next-previous .ns-next i { margin-left: 5px; } .comment-wrap { position: relative; margin-top: 50px; } .comment-list > li { margin-top: 30px; } .comment-meta { position: relative; display: table; } .comment-avatar { width: 150px; height: 150px; display: table-cell; vertical-align: top; } .comment-content { position: relative; display: table-cell; vertical-align: top; padding-left: 25px; } .comment-title { font-weight: 600; font-size: 18px; margin-bottom: 2px; } .comment-date { font-size: 15px; font-weight: 400; } .comment-reply { position: absolute; top: 0; right: 41px; color: #6975dd; font-weight: 600; } .comment-reply i { margin-right: 7px; font-size: 15px; } .comment-text { margin-top: 11px; margin-bottom: 0; } .comment-list ul { margin-top: 30px; padding-left: 65px; } .comment-wrap form { margin-top: 30px; } aside .widget { padding: 10px; margin-bottom: 30px; border: 1px solid #f0f0f0; } .widget h4 { font-size: inherit; margin-bottom: 15px; } .widget .be-social { padding-top: 0; } .widget .subtilte { font-size: 17px; font-weight: 600; margin: 0; } .ns-pop-post { margin-bottom: 25px; } aside .ns-pop-post:last-child { margin-bottom: 0; } .ns-pop-post figure { margin-bottom: 11px; } .ns-pop-post h5 { font-weight: 600; margin-bottom: 2px; font-size: 17px; } .ns-pop-post > a { font-size: 15px; } /* Inner Pages: Single Project ====================================*/ .ns-inner-pages .ns-postmeta { padding: 30px 0; } .ns-inner-pages .ns-postmeta h2 { margin-bottom: 20px; } .ns-project-detail .ns-postmeta { padding-top: 0; } .ns-project-detail > .row > div[class="col-sm-12"] { margin-bottom: 50px; } .about-project { padding: 40px; background-color: #f9f9f9; } .about-project h3 { margin-bottom: 25px; } .about-project ul li { margin-bottom: 17px; font-size: 17px; display: table; } .about-project ul li:last-child { margin-bottom: 0; } .about-project ul li i { margin-right: 9px; font-size: 14px; width: 25px; text-align: left; } .about-project ul li span { margin-right: 14px; width: 115px; display: table-cell; font-weight: 500; } .ns-content-gallery figure { margin-bottom: 20px; } /* Inner Pages: Single Team ====================================*/ .ns-progress-bar { /* padding: 50px; background-color: #fbfbfb; */ margin: 30px 0; } .ns-progress-bar .progress-bar { background-color: #1fc7ba; } .ns-progress-bar li { font-weight: 500; margin-bottom: 20px; } .ns-progress-bar li span { float: right; } .ns-progress-bar li:last-child { margin-bottom: 0; } .ns-progress-bar .progress { margin-top: 11px; height: 9px; } /* Inner Pages: Contact page ===================================== */ .ns-map { position: relative; width: 100%; height: 100%; } .ns-map #map { height: 100%; max-height: 100%; } /* Inner Page: Faqs =====================================*/ .ns-faq { margin-bottom: 24px; } .ns-faq h3 { position: relative; background: #ffffff; border: 1px solid #f0f0f0; padding: 25px 60px 25px 30px; font-size: 17px; cursor: pointer; margin-bottom: 0; font-weight: 500; } .ns-faq h3 span { text-align: right; display: table; position: relative; width: 33px; height: 33px; line-height: 33px; text-align: center; position: absolute; right: 15px; top: 50%; background: #f0f8ff; color: #20cbbd; font-size: 16px; } .faq-active .openclose i { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } .ns-faq-meta { display: none; padding: 25px 25px 9px 25px; } .ns-faq-meta p { margin: 0; } .ns-still-faq { position: relative; padding-top: 15px; text-align: center; width: 100%; } .ns-still-faq p { font-size: 16px; color: #121713; font-weight: 600; margin-bottom: 0; } .ns-link { text-decoration: underline; } /* Inner pages: 404 page ===================================== */ .ns-404 { margin-top: -11px; text-align: center; } .ns-404 > span { display: inline-block; font-family: 'Poppins', sans-serif; font-size: 101px; font-weight: 700; line-height: 1; letter-spacing: -5px; } .ns-404 h2 { font-weight: 500; font-size: 28px; } .ns-404 p { font-size: 17px; } /* Inner pages: Pagination ===========================*/ .ns-heading.ns-pb0 { padding-bottom: 0; } .ns-inner-pages .ns-blog, .ns-inner-pages .ns-team { margin-bottom: 41px; } .paginationz { text-align: center; } .paginationz li { display: inline-block; margin-right: 4px; } .paginationz li.ns-prev { margin-right: 13px; } .paginationz li.ns-next { margin-left: 6px; } .paginationz li.ns-space { margin: 0 13px; width: 43px; height: 100%; position: relative; } .paginationz li.ns-space span { position: absolute; top: -21px; left: 0; } .paginationz li a { width: 45px; height: 45px; line-height: 45px; background-color: #fbfbfb; display: inline-block; border: 1px solid transparent; font-weight: 500; } .paginationz li a.active, .paginationz li a:hover { background-color: #fff; } .paginationz li.ns-prev a { width: 55px; height: 55px; line-height: 55px; text-align: center; background-color: #fbfbfb; } .paginationz li.ns-next a { width: 55px; height: 55px; line-height: 55px; text-align: center; background-color: #fbfbfb; } .paginationz li.ns-next a:hover, .paginationz li.ns-prev a:hover { color: #ffffff; } /* Cross Browser ====================================*/ .ns-work figure::before, .ns-blog figure img, .ns-work figure img { -webkit-transition: all .4s linear; -moz-transition: all .4s linear; -ms-transition: all .4s linear; -o-transition: all .4s linear; transition: all .4s linear; } .ns-main-menu { -webkit-transition: all .3s ease 0s; -moz-transition: all .3s ease 0s; -ms-transition: all .3s ease 0s; -o-transition: all .3s ease 0s; transition: all .3s ease 0s; } .sideElement, .owl-theme .owl-dots .owl-dot span, .ns-blog h3, .ns-scroll-up, .ns-main-menu, .ns-client, .ns-pricing-box, .ns-faq h3, .featr-info, .icon-wrap, .trans1 { -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; -o-transition: all .5s; transition: all .5s; } .sideElement > a, .IconToggle, .ns-faq h3 span i, .ns-tab li, .ns-sideMenu ul:not(.be-social) a, .ns-main-menu a, .ns-pop-post h5, .ns-helpfull-link li a::before, .ns-helpfull-link li a, .ns-contact-info li, .ns-forgot a, .google-plus, .facebook, .ns-tag a, .ns-next-previous a, .ns-blog .ns-postmeta > a:hover, .paginationz li a, .be-social li a { -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; } .ns-pricing-box .theme-btn, .ns-work-meta { -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } .ns-msg { -webkit-transition: all .41s cubic-bezier(.18,.89,.32,1.28); -moz-transition: all .41s cubic-bezier(.18,.89,.32,1.28); -ms-transition: all .41s cubic-bezier(.18,.89,.32,1.28); -o-transition: all .41s cubic-bezier(.18,.89,.32,1.28); transition: all .41s cubic-bezier(.18,.89,.32,1.28); } .be-social li a, .paginationz li.ns-prev a, .paginationz li.ns-next a, .ns-work-meta .openclose, .ns-faq h3 span, .icon-wrap, .ns-play, .comment-avatar img { -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; } .ns-tag a, .card-header span, .ns-tab li a span, .theme-btn, .btn-hover { -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; -o-border-radius: 30px; border-radius: 30px; } .sep-line, .sep-line::before, .sep-line::after, .subtilte::before, .subtilte::after, .ns-social-login li a { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; } .breadCrumb, .ns-inner-pages figure img, .ns-work figure::before, .ns-work figure img, .ns-work figure, .paginationz li a, .ns-faq h3, .ns-progress-bar, .ns-scroll-up, .ns-blog, .ns-pricing-box.style2, .ns-contact-form .theme-btn, .featr-info i, .ns-rememberme label::before, .ns-logo.navbar-brand::before, .ns-logo.navbar-brand::after, .ns-pop-post img, .ns-team img, .featr-info, .ns-contact-form { -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; } .ns-msg, .ns-client-img i, .icon-wrap, nav ul li.dropdown:hover ul, .ns-faq h3:hover, .ns-scroll-up, .ns-main-menu.ns-sticky, .ns-client:hover, .ns-blog, .featr-info:hover, .ns-box-shadow { -webkit-box-shadow: 0px 0px 25px 0px rgba(0, 0,0, 0.05); -moz-box-shadow: 0px 0px 25px 0px rgba(0, 0,0, 0.05); -ms-box-shadow: 0px 0px 25px 0px rgba(0, 0,0, 0.05); -o-box-shadow: 0px 0px 25px 0px rgba(0, 0,0, 0.05); box-shadow: 0px 0px 25px 0px rgba(0, 0,0, 0.05); } .subtilte::after, .subtilte::before, .ns-helpfull-link a::before, .ns-faq h3 span, .ns-tab li::before, .form-group i, .ns-box .ns-content { -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .ns-tab li.active::before { -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); } .ns-blog:hover figure img, .ns-work:hover figure img, .be-social li a:hover, .ns-playwrap:hover .ns-play { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } .ellipsis-text { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .text-gradient { background: -webkit-linear-gradient(#eee, #333); background: linear-gradient(#eee, #333); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; text-fill-color: transparent; } .vertical-text { transform: rotate(-90deg); transform-origin: left top 0; float: left; } .nowcalling{display:block;position:fixed;bottom:0;width:100%;z-index:9999}.lcol,.rcol{float:left;width:50%}.lcol{background-color:#C20964}.rcol{background-color:#069C3E}.lcol a,.rcol a{display:block;padding:10px 0;text-align:center;text-decoration:none;color:#fff}}