@charset "utf-8";


@import "https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900";
@import "https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900";
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;300;400;500;600;700&display=swap');

body {color: #222222; font-family: 'Montserrat', sans-serif; }
h2 {font-weight: 800;
    color: #333;
    line-height: 42px;
    margin: 40px 0 20px;}
h2 span { font-weight: 100; font-family: 'Montserrat', sans-serif; }
h3 {font-family: 'Montserrat', sans-serif;color: #333333;font-size: 20px;font-weight: 500;line-height: 27px;margin-bottom: 20px;margin-top: 30px;}
p {line-height: 28px;color: #000; font-size: 16px;font-family: 'Montserrat', sans-serif;}
header {position: relative;background-color: #fff;z-index: 100;width: 100%;}
.logo { float: left; display: inline-block; margin: 30px 0 0 }
.hdr-rt { float: right; display: inline-block }
.hdr-top {/* border-bottom: 1px solid #e9e9e9; */display: inline-block;margin: 13px 0 0 0;padding: 0 0 6px 0;float: right;}
.email-top { color: #808484; font-size: 12px; font-family: 'Montserrat', sans-serif; display: inline-block; float: left; margin: 0 30px 0 0; font-family: 'Open Sans', sans-serif; margin: 5px 20px 0 0 }
.email-top a {color: #868585;}
.email-top span { display: inline-block; color: #333333; font-size: 14px }
.call-top {color: #808484;font-size: 12px;font-family: 'Montserrat', sans-serif;float: left;display: inline-block;font-family: 'Open Sans', sans-serif;margin: 5px 20px 0 0;}
.call-top span {display: inline-block;color: #ff540b;font-size: 17px;font-weight: 700;}
.top-btn { display: inline-block; float: right; margin: 0px 0 0 0 }
.top-btn a{
    border: 2px solid;
    height: 40px;
    text-align: center;
    line-height: 36px;
    /* font-family: 'Cutive Mono',monospace; */
    font-size: 14px;
    cursor: pointer;
    color: #0071bc;
    padding: 8px 23px;
    }
.top-btn .btn {padding: 7px 17px;font-size: 12px;font-weight: 600;text-transform: uppercase;font-family: 'Montserrat', sans-serif;color: #ffffff;background-color: transparent;border-color: transparent;/* border-radius: 25px; *//* display: none; */}
.top-btn .btn:hover { color: #fff; background-color: #f58220 }
.navigation-main .navbar { padding: .5rem 0 }
.navigation-main .navbar-light .navbar-nav .nav-link {font-family: 'Montserrat', sans-serif;font-size: 16px;padding-bottom: 17px;font;font-weight: 700;}
.navbar-light .navbar-nav .nav-link {color: #333333;}
.navbar-light .navbar-nav .nav-link:hover { color: #d9534f }
.navbar-default .navbar-nav > li.dropdown:hover > a, .navbar-default .navbar-nav > li.dropdown:hover > a:hover, .navbar-default .navbar-nav > li.dropdown:hover > a:focus { background-color: rgb(231, 231, 231); color: rgb(85, 85, 85) }
li.dropdown:hover > .dropdown-menu { display: block }
.navbar-default .navbar-nav > li.dropdown { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease }
.navigation-main .dropdown-menu { position: absolute; top: 100%; left: 0; z-index: 1000; display: none; float: left; min-width: 10rem; padding: .5rem 0; margin: 0; font-size: 14px; color: #292b2c; text-align: left; list-style: none; background-color: #fff; -webkit-background-clip: padding-box; background-clip: padding-box; border: none; border-radius: 0 }
.d-md-block h3 { color: #fff; font-size: 60px; text-align: center; margin: 0 0 30px 0; display: inline-block; font-weight: 700; font-family: 'Montserrat', sans-serif; text-transform: uppercase }
.d-md-block h3 span { font-weight: 100; font-size: 60px; display: block; }
.slider-main .carousel-caption { position: absolute; right: 5%; bottom: 0; left: 5%; z-index: 10; padding-top: 20px; padding-bottom: 20px; color: #fff; text-align: center; top: 306px }
.slider-main .d-block { display: block !important; width: 100% }
.navigation-main .dropdown-item {display: block;width: 100%;padding: 10px 1.5rem;clear: both;font-weight: 400;color: #292b2c;text-align: inherit;white-space: nowrap;background: 0 0;border: 0;font-size: 14px;}
.navigation-main .dropdown-item:hover { color: #d9534f }
.read-more { text-align: left; float: left; display: block }
.read-more a { color: #003e9; font-family: 'Montserrat', sans-serif; font-size: 14px; text-transform: uppercase }
.read-more i { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; position: relative; top: 1px; left: 2px }
.read-more:hover i { margin: 0 0 0 5px }
.slider-text { margin: 0 auto; width: 70% }
.d-md-block p { color: #fff; font-size: 18px; line-height: 26px; text-align: center; font-family: 'Open Sans', sans-serif; font-weight: 400 }
a:focus, a:hover { color: #e31e24; text-decoration: none }
.director-container { background-color: #e31e24; width: 100%; padding-top: 20px }
.director-text { margin: 15px 0 0 }
.director-text h2 { font-family: 'Montserrat', sans-serif; color: #fff; font-size: 24px; margin: 0 0 20px 0; font-weight: 400 }
.director-text p { font-family: 'Montserrat', sans-serif; color: #fff; font-size: 14px; line-height: 24px }
.arrow-right a { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; position: relative; top: 50px; right: 0 }
.arrow-right a:hover { margin: 0 0 0 5px }
.container70 { padding: 50px 0; width: 100%; position: relative;}
.sbox { display: block; position: relative }
.simg img { width: 100% }
.stext { position: absolute; left: 10px; right: 10px; top: 183px }
.link-icon { float: right; display: inline-block }
.sbox h2 { font-family: 'Montserrat', sans-serif; color: #fff; font-size: 22px; float: left; display: inline-block }
.sbox p { color: #787777; font-family: 'Montserrat', sans-serif; font-size: 16px; line-height: 24px; margin: 10px 0 0 0 }
.view-all-btn { margin: 30px auto 0; display: table }
.view-all-btn .btn { border-radius: 0; border: 1px solid #8d8c8c; color: #222222; font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: 400; padding: 15px 40px }
.view-all-btn .btn-secondary:hover { color: #fff; background-color: #003e9a; border-color: #003e9a }
.link-icon i { color: #fff; font-size: 20px; position: relative; top: 4px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease }
.link-icon i:hover { color: #fff; font-size: 20px; position: relative; top: 2px }
.hover01 figure img { -webkit-transform: scale(1); transform: scale(1); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out }
.hover01 figure:hover img { -webkit-transform: scale(1.3); transform: scale(1.3) }
.hover01 figure { width: 350px; height: 218px; margin: 0; padding: 0; background: #fff; overflow: hidden }
.testimonials-container { position: relative }
.testimonial { text-align: center }
.testimonial .description { font-family: 'Montserrat', sans-serif; font-size: 18px; color: #878585; line-height: 27px; margin-bottom: 30px }
.testimonial .pic { display: inline-block; width: 71px; height: 71px; border: 0; margin-bottom: 15px; position: relative }
.testimonial .pic:after { content: ""; border-width: 20px; position: absolute; bottom: -33px; right: 20%; transform: rotate(-15deg); z-index: -1 }
.testimonial .pic img { width: 100%; height: auto }
.testimonial .title { font-family: 'Montserrat', sans-serif; display: block; font-size: 16px; font-weight: 700; color: #413f3f; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 3px }
.testimonial .post { display: block; font-size: 14px; color: #878585 }
.owl-theme .owl-controls { margin-top: 10px }
.owl-theme .owl-controls .owl-page span { width: 30px; height: 3px; background: #585656; border-radius: 0; opacity: 1; transition: all 0.4s ease 0s }
.owl-theme .owl-controls .owl-page.active span, .owl-theme .owl-controls.clickable .owl-page:hover span { background: #1bddc6 }


























footer {padding: 70px 0 20px;background-color: #f4f4f4;}
footer h5 {font-family: 'Montserrat', sans-serif;font-size: 18px;font-weight: 700;color: #002856;line-height: 26px;margin-bottom: 10px;}
footer h6 { font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: 400; color: #dad7d7; line-height: 28px; margin-bottom: 20px }
ul.flink { margin: 0; padding: 0; list-style: none }
ul.flink { display: block; font-family: 'Montserrat', sans-serif; font-size: 14px; line-height: 24px; font-weight: normal }
ul.flink a {color: #002856;-webkit-transition: all 0.3s ease;-o-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-ms-transition: all 0.3s ease;font-weight: 500;font-size: 13px;line-height: 37px!important;}
ul.flink {color: #a7a6a6;}
footer p { color: #a7a6a6 }
ul.flink a:hover {color: #0071bc;}
ul.flink i {margin-right: 5px;}
.copyright { font-family: 'Montserrat', sans-serif; padding: 30px 0 0px 0; background-color: #212120; border-top: 1px solid #2e2e2e; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; margin-top: 70px; color: #a7a6a6; font-size: 14px }
.copyright a { color: #fff; text-decoration: none }
.copyright a:hover { color: #a7a6a6 }
.textr { text-align: right }
.blank-icon { width: 20px; display: inline-block }
.test-center { display: block; margin: 0 auto }
.slider-main .carousel-item {min-height:     min-height: 542px;min-height: 555px;}
.navigation-main .navbar-toggleable-md .navbar-nav .nav-link { padding-right: .0rem; padding-left: 1.8rem }
section.page-banner-section.contact { background: #111 url(../images/ban1.jpg) 50% no-repeat; background-size: cover }
section.page-banner-section:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(64,81,181,.9) }
section.page-banner-section { padding: 70px 0; overflow: hidden; position: relative }
section.page-banner-section h1 { float: left; font-size: 50px; line-height: 60px; font-weight: 400; color: #fff; margin: 0 }
section.page-banner-section a { float: right; color: #3f51b5; font-size: 11px; font-weight: 600; font-family: Montserrat, sans-serif; text-transform: uppercase; padding: 12px 45px; background: #fff; margin-top: 15px; border-radius: 20px; box-shadow: 0 6px 10px #313b75; -webkit-box-shadow: 0 6px 10px #313b75; -moz-box-shadow: 0 6px 10px #313b75; -o-box-shadow: 0 6px 10px #313b75 }
section.page-banner-section a:hover { background: #f64747; color: #fff; box-shadow: 0 12px 25px #2a3263; -webkit-box-shadow: 0 12px 25px #2a3263; -moz-box-shadow: 0 12px 25px #2a3263; -o-box-shadow: 0 12px 25px #2a3263 }
.page-banner-box { position: relative; z-index: 100 }
.title-section { text-align: center; margin-bottom: 40px; position: relative }
.title-section p { max-width: 770px; margin: 0 auto; color: #9a9a9a; font-size: 18px; line-height: 25px }
#map { width: 100%; height: 640px }
section.contact-section .contact-box #map { width: 100%; height: 400px; box-shadow: 0 15px 25px #ebebeb; -webkit-box-shadow: 0 15px 25px #ebebeb; -moz-box-shadow: 0 15px 25px #ebebeb; -o-box-shadow: 0 15px 25px #ebebeb }
section.contact-section #contact-form input[type=text], section.contact-section #contact-form textarea { display: block; width: 100%; padding: 10px 30px; background: #fff; color: #999; font-size: 14px; font-family: Open Sans, sans-serif; outline: none; border: 1px solid #999; margin: 0 0 25px; transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out }
section.contact-section #contact-form textarea { height: 110px; padding: 14px 30px }
section.contact-section #contact-form span.call { display: inline-block; color: #3f51b5; background: transparent; border: 2px solid #eee; margin-right: 8px }
section.contact-section #contact-form input[type=submit], section.contact-section #contact-form span.call { font-size: 11px; font-weight: 600; font-family: Montserrat, sans-serif; text-transform: uppercase; padding: 8px 45px }
section.contact-section #contact-form input[type=submit], section.contact-section #contact-form span.call { font-size: 11px; font-weight: 600; font-family: Montserrat, sans-serif; text-transform: uppercase; padding: 8px 45px }
section.contact-section #contact-form input[type=submit] { color: #fff; background: #1b4e9b; border: 2px solid #1b4e9b; margin-left: 8px; box-shadow: 0 6px 10px #dfe1fd; -webkit-box-shadow: 0 6px 10px #dfe1fd; -moz-box-shadow: 0 6px 10px #dfe1fd; -o-box-shadow: 0 6px 10px #dfe1fd }
section.contact-section #contact-form input[type=submit]:hover { background: #f64747; border-color: #f64747; box-shadow: 0 12px 25px #b9bbd2; -webkit-box-shadow: 0 12px 25px #b9bbd2; -moz-box-shadow: 0 12px 25px #b9bbd2; -o-box-shadow: 0 12px 25px #b9bbd2 }
.contact-form p { color: #999 }
.about-left { font-size: 18px; margin-left: 20px }
.about_bottom_list { margin-top: 20px; display: inline-block; margin-bottom: -15px }
.about_bottom_list p { margin-top: -5px }
.about_bottom_list p span { font-weight: 700; color: #005C97; font-size: 16px }
.about_bottom_list p span { color: #005C97 }
.about_bottom_list p { margin-top: -5px; font-size: 16px; color: #787777 }
.about-warp img { max-width: 100% }
.about_bottom_list i { float: left; margin-right: 30px; font-size: 30px; color: #005C97; margin-bottom: 90px }
.i-bottom .about_bottom_list i { margin-bottom: 190px }
button.accordion { background-color: #fff; color: #444; cursor: pointer; padding: 15px 20px; width: 100%; border: none; text-align: left; outline: none; font-size: 15px; transition: 0.4s; border-bottom: 1px solid #ccc; margin-bottom: 0px; font-family: 'Montserrat', sans-serif; font-weight: 500 }
button.accordion.active, button.accordion:hover { background-color: #ddd }
button.accordion:after { content: '\002B'; color: #777; font-weight: bold; float: right; margin-left: 5px }
button.accordion.active:after { content: "\2212" }
div.panel { padding: 0 18px; background-color: white; max-height: 0; overflow: hidden; transition: max-height 0.2s ease-out }
.media-section { padding: 70px 0 30px; width: 100% }
.media-section .hover01 figure { width: 100%; height: 205px; margin: 0; padding: 0; background: #fff; overflow: hidden }
.media-section .stext { position: relative; left: 0px; right: 0px; top: 10px; display: table; width: 100%; margin-top: 10px; margin-bottom: 20px; border-bottom: 1px solid #f2f0f0; padding-bottom: 10px }
.media-section .sbox h2 { font-family: 'Montserrat', sans-serif; color: #333; font-size: 22px; float: left; display: inline-block; margin-bottom: 0px }
.media-section .link-icon i { color: #333 }
.media-section .sbox { display: block; position: relative; margin-bottom: 40px; border: 1px solid #1b4e9b; padding: 20px; box-sizing: border-box }
.media-section .link-icon { float: none; display: inline-block; margin-bottom: 0px; margin-top: 10px }
.large-text { font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: 300; line-height: 32px; color: #333; font-family: 'Open Sans', sans-serif }
ul.dark-list { list-style: none; margin: 0; padding: 0 }
ul.dark-list li { width: 100%; float: none; display: block; color: #787777 }
ul.dark-list li::before { content: "\f046"; display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #3c59b3; padding-right: 15px }
ul.dark-list2 { list-style: none; margin: 0 0 20px 0; padding: 0 }
ul.dark-list2 li { width: 100%; float: none; display: block; color: #787777 }
ul.dark-list2 li::before { content: "\f046"; display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #3c59b3; padding-right: 15px }
.about-img { border: 1px solid #ccc; padding: 30px }
.gray-container { background-color: #fdfbfb; padding:50px 0; }
.about .feat { padding-right: 30px }

.about .item .fa { height: 50px; width: 50px; line-height: 50px; font-size: 17px; text-align: center; border-radius: 50%; background-color: #d9534f; color: #fff; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; float: left; display: inline-block; margin-right: 15px }
.about .item h4 { color: #d9534f; font-size: 20px; font-weight: 600; line-height: 1.2em; margin: 15px 0; display: inline-block; float: left }
.about p { clear: both; display: block; border-top: 1px solid #f2f0f0; margin-top: 10px; position: relative; top: 10px; padding-top: 10px; margin-bottom: 40px }
.ht30 { height: 30px }
.ht50 { height: 50px }
.bd-callout { padding: 1.25rem; margin-top: 0; margin-bottom: 1.25rem; border: 1px solid #eee; border-left-width: .25rem; border-radius: .25rem }
.bd-callout-warning { border-left-color: #f0ad4e }
.greetings { font-size: 14px; font-weight: 400; color: #fdc2c0; margin-bottom: 10px; margin-top: 0; display: block; font-family: 'Montserrat', sans-serif; border-bottom: none; padding-bottom: 10px }
.director-photo img { width: 100% }
.director-content { display: block; background-color: #d9534f; padding: 20px; box-sizing: border-box }
.director-content .large-text { font-size: 16px; line-height: 22px; color: #fff }
.matri-invest-img img { width: 100% }
.surveillance-bg { background-image: url(../images/surveillance-bg.jpg); background-repeat: no-repeat; background-size: cover; background-attachment: fixed }
.surveillance-bg p { color: #fff }
.faq-img img { width: 100% }
.red-box { display: block; background-color: #e31e24; padding: 40px; box-sizing: border-box }
.red-box p { color: #fff }
.blue-box { display: block; background-color: #0071bc; padding: 40px; box-sizing: border-box }
.blue-box p { color: #fff }
.blue-box ul.circle{ color: #fff }
.blue-box h3{ color: #fff }
.read-more {text-align: center;float: none;display: table;border-radius: 35px;padding: 12px 15px;color: #fff;margin: 25px auto 0;margin: 17px auto 0;background-color: #0071bd;}
.read-more a { color: #fff; font-family: 'Montserrat', sans-serif; font-size: 14px; text-transform: uppercase }
.read-more:hover { color: #fff; background-color: #f4793d }
.read-more i { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; position: relative; top: 1px; left: 5px }
.read-more:hover i { margin: 0 0 0 5px }
.project-box { position: relative }
.project_text { background-color: rgba(255, 255, 255, 0.9); position: absolute; bottom: 30px; left: 30px; right: 30px; padding: 30px 60px; box-sizing: border-box; text-align: center; min-height: 170px }
.project_text h3 { border-bottom: 1px solid #eaeaea; padding-bottom: 10px; font-size: 21px; color: #333333 }
.project_text p { font-size: 12px; margin-bottom: 0; font-family: 'Open Sans', sans-serif }
.welcome-container { padding: 70px 0 0 0 }
.welcome-container h1 { font-size: 56px; color: #333333; font-family: 'Montserrat', sans-serif; font-weight: 100; line-height: 57px }
.welcome-container h1 span { font-size: 42px; display: block; font-weight: 900 }
.welcome-container p span:hover { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; margin-left: 5px }
.top-btn .btn-danger {background-color: #0071bc;}
.email-top i {position: relative;font-size: 16px;margin-right: 5px;color: #ff540b;}
.call-top i {position: relative;font-size: 16px;margin-right: 5px;color: #ff540b;}
#service { margin-top: 90px }
.service, .service i, .service h5 { -moz-transition: 400ms linear; -webkit-transition: 400ms linear; transition: 400ms linear }
.service { padding: 30px 30px; margin-bottom: 30px }
.service p { font-size: 14px }
.service i { font-size: 40px; color: #000; opacity: 0.8; top: 0px; position: relative }
.service .btn-link { font-weight: 400; color: #0275d8; border-radius: 0; font-size: 16px !important }

.icon-right-1 i { font-size: 18px !important; color: #000; opacity: 0.8; top: 0px; position: relative }

.service h5 { opacity: 0.8; margin-top: 28px; margin-bottom: 15px }
.service a, .service span { -moz-transition: all 200ms; -webkit-transition: all 200ms; transition: all 200ms }
.service a { font-size: 18px; font-weight: 600; line-height: 22px; color: #000 !important; opacity: 0.8; outline: none; position: relative }
.icon-right-1:before { content: ''; font-size: 10px; position: relative; top: 0; left: 0 }
.service a:hover, .service a:active, .service a:focus { text-decoration: none; outline: none !important }
.service span { position: absolute; right: 0; opacity: 0; display: inline-block }
.service a:hover span, .service a:focus span { opacity: 1; right: -20px }
.service:hover { border: 1px solid #3b9ad1; box-shadow: 0px 25px 55px 0px rgba(0, 0, 0, 0.2) }
.service:hover i { color: #3b9ad1 }
.service:hover h5 { color: #3b9ad1 }
.service a:hover, .service a:active, .service a:focus { color: #3b9ad1 !important }
.container-services {
    margin-top: 70px;
    margin-bottom: 70px;
    position: relative;
    }
.black-section {background-color: #212121;color: #fff;padding: 70px 0;/* margin: 50px 0 0 0 */}
.clients_logo .owl-carousel .owl-item img { display: block; width: auto; -webkit-transform-style: preserve-3d; padding: 30px; box-sizing: border-box; margin-top: 20px; background-color: #fff }
.clients_logo {background-color: #fff;}
.theme-title { position: relative }
.theme-title h2:before { content: ''; width: 178px; height: 2px; position: absolute; left: 0; bottom: 0; background: #f58220; background: -webkit-gradient(linear, left top, right top, color-stop(81%, #f58220), color-stop(81%, #fff), color-stop(89%, #fff), color-stop(89%, #f58220), to(#f58220)); background: linear-gradient(to right, #f58220 81%, #fff 81%, #fff 89%, #f58220 89%, #f58220 100%) }
.theme-title.text-center h2:before { left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%) }
.theme-title h3:before { content: ''; width: 118px; height: 2px; position: absolute; left: 0; bottom: 0; background: #f58220; background: -webkit-gradient(linear, left top, right top, color-stop(81%, #f58220), color-stop(81%, #fff), color-stop(89%, #fff), color-stop(89%, #f58220), to(#f58220)); background: linear-gradient(to right, #f58220 81%, #fff 81%, #fff 89%, #f58220 89%, #f58220 100%) }
.theme-title.text-center h3:before { left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%) }
.clients_logo .theme-title h2:before { content: ''; width: 178px; height: 2px; position: absolute; left: 0; bottom: 0; background: #f58220; background: -webkit-gradient(linear, left top, right top, color-stop(81%, #f58220), color-stop(81%, #fcfafa), color-stop(89%, #fcfafa), color-stop(89%, #f58220), to(#f58220)); background: linear-gradient(to right, #f58220 81%, #fcfafa 81%, #fcfafa 89%, #f58220 89%, #f58220 100%) }
.clients_logo .theme-title.text-center h2:before { left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%) }
.black-section h2 { font-family: 'Montserrat', sans-serif; font-size: 40px; font-weight: 900; color: #333; line-height: 42px; margin-bottom: 20px; padding-bottom: 30px }
.black-section .theme-title h2:before { content: ''; width: 178px; height: 2px; position: absolute; left: 0; bottom: 0; background: #f58220; background: -webkit-gradient(linear, left top, right top, color-stop(81%, #fff), color-stop(81%, #212121), color-stop(89%, #212121), color-stop(89%, #fff), to(#fff)); background: linear-gradient(to right, #fff 81%, #212121 81%, #212121 89%, #fff 89%, #fff 100%) }
.black-section .theme-title.text-center h2:before { left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%) }
.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.open, .navbar-light .navbar-nav .open>.nav-link {/* color: #6a85a6 */}
.mfeature-box .mfeature-icon { margin-bottom: 5px; position: relative }
.mfeature-box .mfeature-icon .icon-img { position: relative }

.mfeature-box .mfeature-icon .icon-img img { width: 70px }
.mfeature-box .mfeature-icon .icon-bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding-top: 15px }
.mfeature-box .mfeature-icon .icon-bg img { max-width: 223px; width: 100% }
.slider-main .left-slider-heading .carousel-caption {position: absolute;right: 5%;bottom: 0;left: 2%;z-index: 10;padding-top: 20px;padding-bottom: 20px;color: #fff;text-align: left;top: 10%;width: 41%;}
.left-slider-heading .d-md-block h3 {color: #fff;font-size: 60px;text-align: left;margin: 0 0 15px 0;display: inline-block;font-weight: 300;font-family: 'Montserrat', sans-serif;text-transform: none;line-height: 70px;font-size: 56px;line-height: 45px;text-transform: uppercase;}
.left-slider-heading .slider-text { margin: 0 auto; width: auto }
.left-slider-heading .d-md-block p { color: #333; font-size: 16px; line-height: 26px; text-align: left; font-family: 'Open Sans', sans-serif; font-weight: 400 }
.left-slider-heading .read-more {text-align: left;float: left;display: table;border-radius: 35px;padding: 15px 25px;color: #fff;margin: 10px auto 0;background-color: #f68121;}
.theme-inner-banner { background: url(../images/banner-3.jpg) no-repeat center; background-size: cover; margin-bottom: 120px; position: relative;  }
.theme-inner-banner .opacity { background: rgba(255, 141, 25, 0.97); padding: 55px 0 84px; text-align: center }
.theme-inner-banner h2 { font-weight: 900; font-size: 42px; color: #fff; font-family: 'Montserrat', sans-serif }
.theme-inner-banner ul li { font-family: 'Open Sans', sans-serif; display: inline-block; margin: 10px 0 0 5px; color: #fff; vertical-align: middle; text-transform: capitalize }
.theme-inner-banner ul li a { color: #fff; font-weight: normal }
.theme-title h2 { margin-bottom: 40px }
.about-us-img img { width: 100% }
.bg-gray { background-color: #fffcfc }
h3 span { font-weight: 100; font-size: 40px }
.contactUs-address { font-family: 'Open Sans', sans-serif; padding-left: 38px }
.contactUs-address>p { margin: -7px 0 30px 0 }
.contactUs-address .single-address .icon { width: 65px; height: 65px; line-height: 63px; border: 1px solid #e5e5e5; text-align: center; margin-top: 7px; color: #fff; font-size: 30px }
.contactUs-address .single-address h6 { font-weight: 900; font-size: 18px; margin-bottom: 5px; color: #393939 }
.contactUs-address .single-address span { font-size: 16px }
.contactUs-address .single-address { margin-bottom: 30px }
.contactUs-address .single-address .text { padding-left: 26px; margin-top: 10px }
.round-border { border-radius: 50% }
.contactUs-address i { color: #f58220; padding: 19px 0; font-size: 20px }
#main-form input, #main-form textarea { width: 100%; max-width: 100%; font-size: 15px; border: 1px solid #ececec; padding: 0 15px 0 15px; border-radius: 5px }
#main-form input { height: 50px }
#main-form .single-input { margin-bottom: 22px }
#main-form textarea { height: 165px; max-height: 165px; padding: 15px }
.sp-top20 .read-more { float: left; border: none }
.contactUs-address a { color: #f58220 }
ul.s-icons {display: table;margin: 0;list-style: none;padding: 0;}
ul.s-icons li {display: inline-block; margin-right: 6px; float: left}
ul.s-icons li:last-child { margin-right: 0px }
ul.s-icons i {color: #46151e;-webkit-transition: 0.3s ease-in-out;-moz-transition: 0.3s ease-in-out;-o-transition: 0.3s ease-in-out;-ms-transition: 0.3s ease-in-out;transition: 0.3s ease-in-out;padding: 12px;border-radius: 50%;width: 40px;height: 40px;line-height: 14px;color: #333;border: 1px solid #686867;font-size: 16px;text-align: center;}
ul.s-icons i:hover { color: #fff; background-color: #fff; color: #cb7c3b }
ul.services-links { margin: 0 0 0 40px; padding: 0; list-style: none; box-sizing: border-box }
ul.services-links li { font-family: 'Open Sans', sans-serif; font-size: 16px; ma;
margin: 0 0 20px; border-bottom: 1px solid #f8f5f5; padding-bottom: 20px; display: block }
ul.services-links li a { color: #b0b0b0; text-decoration: none }
ul.services-links li a:hover { color: #333; text-decoration: none }
ul.services-links li.active { color: #333; text-decoration: none }
.services-links h3 { padding-bottom: 0 }
.viewbox_gallery .thumbnail img { width: 100% }
.gallerybox { box-shadow: 0 10px 50px rgba(20, 50, 81, 0.04), 0 10px 50px rgba(0, 0, 0, 0.05); background-color: transparent; margin: 0 0 30px 0 }
.viewbox_gallery h5 {float: none;display: block;color: #6a85a6;font-size: 18px;font-weight: normal;text-transform: none;line-height: 24px;padding-top: 20px;font-weight: 700;padding-bottom: 0;}
.viewbox_gallery h5 a{text-decoration: underline; color: #6a85a6}
.viewbox_gallery h5 a:hover{text-decoration: none}
.viewbox_gallery p{ font-size:14px; line-height:22px}
.viewboxlink { float: right; display: inline-block }
.viewboxlink i { position: relative; top: 15px }
.viewbox_content {padding: 5px 10px 10px 10px;display: table;width: 100%;box-sizing: border-box;display: none;}
.columns-pricing-table { width: 100% }
.columns-pricing-table .columns2 { float: left; width: 33.3% !important; padding: 8px }
.price {list-style-type: none;border: 1px solid #eee;margin: 0;padding: 0;-webkit-transition: 0.3s;transition: 0.3s;list-style: none;border-radius: 10px;}
.price:hover { box-shadow: 0 8px 12px 0 rgba(0,0,0,0.2) }
.price .header {background-color: #f58220;color: white;font-size: 25px;border-radius: 10px 10px 0 0;font-weight: 600;}
.price li { border-bottom: 1px solid #eee; padding: 20px 10px; text-align: center; box-sizing: border-box }
.price .grey {background-color: #eee;font-size: 20px;border-radius: 0 0 10px 10px;/* font-weight: 600; */}
.button {background-color: #0275d8;border: none;color: white;padding: 10px 25px;text-align: center;text-decoration: none;font-size: 18px;border-radius: 10px;}
.button:hover {background-color: #f58220;color: white;}
ul.circle { list-style: circle outside }
ul.circle li {margin-bottom: 10px; font-size: 16px; line-height: 24px}
ul.circle2 {list-style: circle outside}
ul.circle2 li {margin-bottom: 10px;font-size: 16px;line-height: 24px;width: 44%;float: left; margin-right: 40px}
.note{font-style: italic; margin: 20px 0 0 0; font-size: 14px; color: #e31e24; display:none}
.carousel-indicators li {background-color: #949090}
.carousel-indicators .active {background-color: #fff;}
@media only screen and (max-width: 600px) {
.columns-pricing-table .columns2 { width: 100% }
}
.columns-pricing-table { width: 100% }
ul.prices_list { display: table; width: 100%; box-sizing: border-box; list-style: none; margin: 0; padding: 0 }
ul.prices_list li span:first-child { display: inline-block; width: 57%; text-align: left; box-sizing: border-box }
ul.prices_list li span:last-child { display: inline-block; width: 40%; text-align: right; box-sizing: border-box }
.blogimg img { width: 100% }
.arrow_link:hover { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; margin-left: 5px }

.portfolio-all .read-more { float: left; display: inline-block }
.hosting-img img { width: 100% }
.gallerybox { margin: 0 0 30px 0 }


/*=============== groth =============*/
.groth_wrap{background:url(../images/groth-bg.jpg)no-repeat; background-position: top right;background-size: cover;    padding-top: 30px;
    padding-bottom: 50px;}
.groth_wrap .text-stroke-title{    padding-bottom: 20px;padding-top: 130px;}
.groth_wrap .text-stroke-title h2{color:transparent;-webkit-text-stroke: 2px #fff;margin-bottom: 0px;}


.groth_wrap .text-stroke-title h3{color: #fff;font-size:8.8em;
    font-weight: 300;
    text-transform: uppercase;position: relative;
    margin-top: -10px;}
.groth_wrap .text-stroke-title h2 b img{    width: 60px;
    margin-top: -10px;}

/*================= heart =====================*/

.animated {
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
}.faa-pulse.animated, .faa-pulse.animated-hover:hover, .faa-parent.animated-hover:hover > .faa-pulse {
    -webkit-animation: pulse 2s linear infinite;
    animation: pulse 2s linear infinite;
}.faa-parent.animated-hover:hover>.faa-pulse, .faa-pulse.animated, .faa-pulse.animated-hover:hover {
    -webkit-animation: pulse 2s linear infinite;
    animation: pulse 2s linear infinite;
}

.blog-box h2 {
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 700;
    color: #333;
    line-height: 33px;
    margin-bottom: 20px;
    padding-bottom: 0;
}

ul.list2 { list-style:none; margin:0; padding:0;}
ul.list2 li{ display:block; margin:0 0 20px; font-family: 'Montserrat', sans-serif; color:#333;}
.left-slider-heading h2{
    font-size: 70px;
    color: #fff;
    text-transform: uppercase;
    position: relative;
    font-weight: 900;
    margin-top: 0;
    margin-bottom: 20px;
    line-height: 64px;
}
.left-slider-heading h3{}
.left-slider-heading h4{
    margin-top: 40px;
    text-transform: uppercase;
}
.left-slider-heading h5{
    color: transparent;
    position: relative;
    -webkit-text-stroke: 2px #fff;
    font-size: 65px;
    font-weight: 800;
    text-transform: uppercase;
    margin-top: -10px;
}
.carousel-control-prev-icon{display:none;}
.carousel-control-next-icon{display:none;}



.thumbnail {
    display: block;
    padding: 4px;
    margin-bottom: 20px;
    line-height: 1.42857143;
    background-color: #fff;
 
    border-radius: 4px;
    -webkit-transition: border .2s ease-in-out;
    -o-transition: border .2s ease-in-out;
    transition: border .2s ease-in-out;
}
.pding0{padding-left: 0px;padding-right: 0px;}
.about-dec{position: relative;}
.about-dec h2{
    font-weight: 400;
    font-size: 32px;
    line-height: inherit;
    color: #000;
    margin-bottom: 15px;
    /* margin: 0; */
    padding: 0;
    }
.about-dec h2 strong{font-weight: 800;font-size: 50px;margin: 0;padding: 0;line-height: 43px;}
.about-dec p{padding-right: 15px;
    margin-bottom: 30px;}
.about-dec p:last-child{margin-bottom: 0px;}
.about-dec .btn-black, .endtoend-box .btn-black{padding: 12px 30px;
    font-weight: 500;
    font-size: 16px;
    border: 2px solid #000;}
.about-dec .btn-black:hover, .endtoend-box .btn-black:hover{border: 2px solid #1b4676;}
.about-dec .btn-black img, .endtoend-box .btn-black img{margin-left: 10px;}
.about-dec .btn-black i{padding-left: 10px;}
.projectssec{
    position: relative;
    margin-left: 60px;
    /* border-bottom: 1px solid #ddd; */
    padding-bottom: 15px;
    /* margin-bottom: 25px; */
    }
.projectssec h2{font-weight: 400;color: #000;font-size: 60px;margin: 0 0 16px;padding: 0;text-align: center;font-family: 'Oswald', sans-serif;}
.projectssec p{font-weight: 400;font-size: 16px;margin: 0;text-align: center;}
.projectssec-bdrnone{border-bottom: none;padding-bottom: 0px;}
.btn-black{border-color: #000; background-color: transparent; color: #000; border-radius: 0px;}
.btn-info:hover {background-color: #1b4676;
    border-color: #1b4676;}
.tenyears{border: 2px solid #000; padding: 0px; border-radius: 0px;margin-left:50px;}
.tenyears img{margin: 80px auto;display: block;}.container-fluid {
    padding-right: 50px;
    padding-left: 50px;
}

.welcome-container .container-fluid {
    padding-right: 50px;

    padding-left: 50px;
}

.read-more2 {text-align: center;float: none;display: table;border-radius: 35px;padding: 11px 25px;color: #fff;margin: 0;background-color: #f68121;}
.read-more2 a { color: #fff; font-family: 'Montserrat', sans-serif; font-size: 14px; text-transform: uppercase }
.read-more2:hover { color: #fff; background-color: #f4793d }














.read-more2 i { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; position: relative; top: 1px; left: 5px }
.read-more2:hover i { margin: 0 0 0 5px }




/*-------- MISSION VISSON US SECTION --------*/

.mission_vission_section{
    padding: 60px 0 60px;
    background-color: #0071bc;
    position: relative;
}
.mission_vission_section .mission_vission_info {
    padding: 0 60px 0 0;
}
.mission_vission_section .mission_vission_info h2{
    /* font-size: 25px; */
    /* line-height: 25px; */
    color: #fff;
    /* font-weight: 800; */
    /* margin-bottom: 10px; */
}
#accordion .panel-heading {padding: 0;background-color: transparent;border: none;}
#accordion .panel-title > a {
	display: block;
	padding: 7px 0px;
	outline: none;
	font-weight:bold;
	text-decoration: none;
	color: #fff;
	font-size: 20px;
	border: none;
}

#accordion .panel-title > a.accordion-toggle::before, #accordion a[data-toggle="collapse"]::before  {
    content:"\f106";
    float: right;
    font-family: 'fontAwesome';
    margin-right: 4px;
    margin-top: 15px;
}
#accordion .panel-title > a.accordion-toggle.collapsed::before, #accordion a.collapsed[data-toggle="collapse"]::before  {
    content:"\f107";
}
.mission_vission_section .panel-default > .panel-heading + .panel-collapse > .panel-body {
    border: none;
    padding: 0 0 0;
}
.mission_vission_section .panel-default > .panel-heading + .panel-collapse > .panel-body p{
    font-size: 14px;
    line-height: 24px;
    color: #fff;
    padding-left: 84px;
    padding-right: 80px;
    padding-bottom: 25px;
}
.mission_vission_section .panel-group .panel {
    margin-bottom: 0;
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #87a9b9;
    border-radius: 0px;
}
.mission_vission_section #accordion .panel-title > a img{
    margin-right: 25px;
    margin-top: -5px;
}
.mission_vission_img img{
    width: 100%;
}
.mission_vission_img::before{
    content: '';
    position: absolute;
    left: 0px;
    top: 82px;
    background-image: url(../images/about-icon.png);
    width: 125px;
    height: 128px;
}
.mission_vission_img::after{
    content: '';
    position: absolute;
    right: -90px;
    bottom: 22px;
    background-image: url(../images/about-icon-2.png);
    width: 100px;
    height: 129px;
}

/*collapse*/


.transition, ul li i:before, ul li i:after, p {
  transition: all 0.25s ease-in-out;
}

.flipIn, ul li, h1 {
  animation: flipdown 0.5s ease both;
}

.mission_vission_section .no-select, h3 {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-touch-callout: none;
  /* -webkit-user-select: none; */
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  /* user-select: none; */
}

@media (max-width: 550px) {
  body {
  
    transform: translate(0, 0);

  }
}


.home-page-collapse p {
  color:#fff;
  font-size: 16px;
  line-height: 26px;
  letter-spacing: 1px;
  position: relative;
  overflow: hidden;
  max-height: 800px;
  opacity: 1;
  transform: translate(0, 0);

    
  z-index: 2;
}

.home-page-collapse ul {
  list-style: none;
  perspective: 900;
  padding: 0;
  margin: 0;
}
.home-page-collapse ul li {
  position: relative;
  padding: 0;
  margin: 0;
  padding-bottom: 4px;
  padding-top: 18px;
  border-top: 1px dotted #dce7eb;
}
.home-page-collapse ul li:nth-of-type(1) {
  animation-delay: 0.5s;
}
.home-page-collapse ul li:nth-of-type(2) {
  animation-delay: 0.75s;
}
.home-page-collapse ul li:nth-of-type(3) {
  animation-delay: 1s;
}
.home-page-collapse ul li:last-of-type {
  padding-bottom: 0;
}
.home-page-collapse ul li i {
  position: absolute;
  transform: translate(-6px, 0);
  margin-top: 6px;
  right: 0;
}
.home-page-collapse ul li i:before, ul li i:after {
  content: "";
  position: absolute;
background-color: #fff;
  width: 3px;
  height: 9px;
}
.home-page-collapse ul li i:before {
  transform: translate(-2px, 0) rotate(45deg);
}
.home-page-collapse ul li i:after {
  transform: translate(2px, 0) rotate(-45deg);
}
.home-page-collapse ul li input[type=checkbox] {
  position: absolute;
  cursor: pointer;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
}
.home-page-collapse ul li input[type=checkbox]:checked ~ p {
  margin-top: 0;
  max-height: 0;
  opacity: 0;
  transform: translate(0, 50%);
}
.home-page-collapse ul li input[type=checkbox]:checked ~ i:before {
  transform: translate(2px, 0) rotate(45deg);
}
.home-page-collapse ul li input[type=checkbox]:checked ~ i:after {
  transform: translate(-2px, 0) rotate(-45deg);
}
/*
@keyframes flipdown {
  0% {
    opacity: 0;
    transform-origin: top center;
    transform: rotateX(-90deg);
  }
  5% {
    opacity: 1;
  }
  80% {
    transform: rotateX(8deg);
  }
  83% {
    transform: rotateX(6deg);
  }
  92% {
    transform: rotateX(-3deg);
  }
  100% {
    transform-origin: top center;
    transform: rotateX(0deg);
  }
}
*/
.home-page-collapse h3{font-size: 22px;color: #fff;margin: 0 0 20px 0;font-weight: 600;line-height: 46px;}

.h1, h1 {
    font-size: 2.5rem;
}.h2, h2 {
    font-size: 2rem;
    font-size: 46px;
    font-weight: 400;
    font-family: 'Oswald', sans-serif;
    line-height: 57px;
}.h3, h3 {
    font-size: 1.75rem;
    font-size: 30px;
    font-weight: 400;
    font-family: 'Oswald', sans-serif;
    line-height: 40px;
}.h4, h4 {
    font-size: 1.5rem;
}.h5, h5 {
    font-size: 1.25rem;
}.h6, h6 {
    font-size: 1rem;
}




.tabs-hdng{}
.tabs-hdng img{
    float: left;
    margin: 0 20px 0 0;
}
.tabs-hdng h3{}


/*============== whats app =================*/
.whatsap{right: 10px;
    position: fixed;
    z-index: 100;
    bottom: 50px;
}
.whatsap a {
    color: #fff;
    font-weight: 600;
}
.whatsap a i {
    border-radius: 50%;
    font-size: 26px;
    color: #fff;
    background: #4CAF50;
    padding: 6px;
    height: 40px;
    width: 40px;
    line-height: 30px;
    text-decoration: none;
    text-align: center;
}


h1 {
    font-size: 60px;
    font-weight: 400;
    font-family: 'Oswald', sans-serif;
    line-height: 70px;
}

.hdng-icon {
    margin: 0 auto;
    display: block;
}
.hdng-icon img {
    margin: 0 auto;
    display: block;
}

p.para{
    font-size: 36px;
    font-weight: 300;
    margin-top: 10px;
    line-height: 45px;
    color: #6b6a6a;
    font-family: 'Montserrat', sans-serif;
    }

.mb50 {
    margin-bottom: 50px !important;
}
.wt70{width: 70%;text-align: center;margin: 0 auto;}


/*service-sections*/
.container-digital-marketing{
    background: url(../images/digital-marketing.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 80px 0;
    }
.s-box{padding-left: 10px;}
.s-n{color: transparent;position: relative;-webkit-text-stroke: 2px #fff;font-size: 80px;font-weight: 800;text-transform: uppercase;font-family: 'Oswald', sans-serif;position: absolute;left: -30px;top: -20px;}
.container-digital-marketing h2{
    font-size: 60px;
    font-weight: 400;
    font-family: 'Oswald', sans-serif;
    line-height: 70px;
    color: #fff;
}
.container-digital-marketing p{
    color: #fff;
    margin-bottom: 30px;
}
a.know-more{
    color: #fff;
    border-radius: 25px;
    border: 1px solid #fff;
    padding: 5px 16px;
    margin-bottom: 14px;
    display: table;
}
a.know-more:hover{ padding: 5px 20px;}

a.know-more2{
    color: #222222;
    border-radius: 25px;
    border: 1px solid #222222;
    padding: 5px 16px;
    margin-bottom: 14px;
    display: table;
}
a.know-more2:hover{ padding: 5px 20px;}

ul.list-service{margin: 0;padding: 0;list-style: none;display: table;}
ul.list-service li{color: #fff;width: 42%;display: inline-block;margin: 0 20px 0 0;}
ul.list-service li a{color: #fff;font-size: 16px;line-height: 40px;font-weight: 500;text-decoration: underline;}
ul.list-service li a:hover{color: #fff;text-decoration: none;}

ul.list-service2{margin: 0;padding: 0;list-style: none;display: table;width: 100%;}
ul.list-service2 li{color: #222222;width: 42%;display: inline-block;margin: 0 20px 0 0;}
ul.list-service2 li a{color: #222222;font-size: 16px;line-height: 40px;font-weight: 500;text-decoration: underline;}
ul.list-service2 li a:hover{color: #222222;text-decoration: none;}

/*service-sections*/
.container-web-designing{
    background: url(../images/web-designing.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 80px 0;
    }



.container-web-designing h2{
    font-size: 60px;
    font-weight: 400;
    font-family: 'Oswald', sans-serif;
    line-height: 70px;
    color: #fff;
}
.container-web-designing p{
    color: #fff;
    margin-bottom: 30px;
}

/*service-sections*/
.container-web-development{
    background: url(../images/web-development.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 80px 0;
    }



.container-web-development h2{
    font-size: 60px;
    font-weight: 400;
    font-family: 'Oswald', sans-serif;
    line-height: 70px;
    color: #fff;
}
.container-web-development p{
    color: #fff;
    margin-bottom: 30px;
}


/*service-sections*/
.container-app-development{
    background: url(../images/app-development.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 80px 0;
    display: none;
    }


.s-n{color: transparent;position: relative;-webkit-text-stroke: 2px #222222;font-size: 80px;font-weight: 800;text-transform: uppercase;font-family: 'Oswald', sans-serif;position: absolute;left: -30px;top: -20px;}
.container-app-development h2{
    font-size: 60px;
    font-weight: 400;
    font-family: 'Oswald', sans-serif;
    line-height: 70px;
    color: #222222;
}
.container-app-development p{
    color: #222222;
    margin-bottom: 30px;
}


.s-n{color: transparent;position: relative;-webkit-text-stroke: 2px #fff;font-size: 80px;font-weight: 800;text-transform: uppercase;font-family: 'Oswald', sans-serif;position: absolute;left: -30px;top: -20px;}

.container-app-development .s-n{color: transparent;position: relative;-webkit-text-stroke: 2px #222222;font-size: 80px;font-weight: 800;text-transform: uppercase;font-family: 'Oswald', sans-serif;position: absolute;left: -30px;top: -20px;}

.container-domain-hosting .s-n{color: transparent;position: relative;-webkit-text-stroke: 2px #222222;font-size: 80px;font-weight: 800;text-transform: uppercase;font-family: 'Oswald', sans-serif;position: absolute;left: -30px;top: -20px;}

/*service-sections*/
.container-domain-hosting{
    background: url(../images/domain-hosting.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 80px 0;
    }


.container-domain-hosting h2{
    font-size: 60px;
    font-weight: 400;
    font-family: 'Oswald', sans-serif;
    line-height: 70px;
    color: #222222;
}
.container-domain-hosting p{
    color: #222222;
    margin-bottom: 30px;
}

.free-hosting{margin-top: 150px;}
.free-hosting img{}

.next-icon {
    position: absolute;
    z-index: 1000;
    left: 50%;
    bottom: -111px;
}
.next-icon img{
   
}


.mb20{ margin-botto:20px}



/*-------- BANNER SECTION --------*/
.inner_banner_box{
    text-align: center;
}
.inner_banner_box h1 span{
    color: transparent;
    -webkit-text-stroke: 1px #fff;
}
.inner_banner_box img{
    margin-bottom: 0;
}
.inner_page_img{  
    width: 100%;
}
.inner_banner_box .title img {
    margin: -11px 0 0;
}

.inner_banner_box h1{
    font-size: 60px;
    line-height: 70px;
    font-weight: 800;
    text-transform: uppercase;
    color: #fff;
    margin: 35px 0;
}
.inner_banner_box .title_1 {
    font-size: 90px;
}
.inner_banner_box .title_1 img {
    margin: -131px 0 0;
}
.inner_banner_box .title{
    font-size: 56px;
}
.inner_banner_box p{
    font-size: 18px;
    line-height: 30px;
    color: #fff;
}

/*-------- PSD TO HTML PAGE SECTION --------*/
.psdto_html_section{
    padding: 60px 0 60px;
    position: relative;
}
.psdto_html_section::before{
    content: '';
    width: 260px;
    height: 272px;
    position: absolute;
    bottom: 50px;
    left: 0;
    /* background-image: url(../images/psd-icon1.png); */
}
.psdto_html_section::after{
    content: '';
    width: 260px;
    height: 272px;
    position: absolute;
    bottom: 50px;
    right: 0;
    /* background-image: url(../images/psd-icon1.png); */
}
.psdto_html_section .psdto_html_info{
    text-align: center;
}
.psdto_html_section .psdto_html_info h2{
    text-transform: uppercase;
    color: #0f5373;
    font-size: 18px;
    margin: 0 0 0;
    font-weight: 600;
}
.psdto_html_section  .psdto_html_info h3{
    font-size: 40px;
    font-weight: 700;
    margin-top: 15px;
    margin-bottom: 22px;
}
.psdto_html_section .psdto_html_info p{
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    color: #000;
    padding: 0 22px 0;
}
.psdto_html_section .psd_bottom_img {
    display: inline-block;
    margin: 50px 80px 0px;
}
.bg_1 {
    background-image: url(../images/psd-to-html-banner.jpg);
}

.bg_2 {
    background-image: url(../images/web-designing-services-bg.jpg);
}
.bg_3 {
    background-image: url(../images/ui-ux-design-bg.jpg);
}

.bg_4{
    background-image: url(../images/landing-page-design-bg.jpg);
}
.bg_5{
    background-image: url(../images/logo-design-bg.jpg);
}

.bg_6{
    background-image: url(../images/responsive-web-design-bg.jpg);
}

.bg_7{
    background-image: url(../images/free-web-hosting.jpg);
}

.bg_8{
    background-image: url(../images/grow-your-business.jpg);
}

.img1{margin-bottom: 20px;}
.img3 { margin-left: -50px; margin-top: -50px;}
.img4 {
    bottom: -83px;
    position: absolute;
}
.img5{ display: block; margin: 40px auto 0;} 
.img5 img{ display: block; margin: 0 auto;} 
.img6 { position: absolute; margin-right: -34px;}

.img9 {
    margin-left: -50px;}

.img7 {position: absolute;bottom: -70px;}

.img8 {top: 70px;
    position: absolute;}

.img10{ max-width: 240px}
.img10 img{ max-width: 240px}

.img1 img, .img2 img, .img3 img, .img4 img, .img5 img, .img6 img, .img7 img, .img8 img, .img9 img, .img11 img, .img12 img, .img14 img { width: 100%;}

.img11{position: absolute;bottom: 28px;width: 90%;}

.img12{position: absolute;
    margin-right: -34px;
    bottom: -50px;}

.img13{    max-width: 488px;
    margin: 100px 0 0;}

.img14 {    top: -50px;
    position: absolute;}

.inner_banner_section {
    padding: 30px 0 30px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.body-text{ text-align:center;}

ul.list-2{margin: 0 0 0 36px;padding: 0;list-style: none;display: table;}
ul.list-2 li{color: #000;display: block;margin: 0 20px 30px 0;font-size: 14px;position: relative;}
ul.list-2 li a{color: #222222;font-size: 16px;line-height: 40px;font-weight: 500;text-decoration: underline;}
ul.list-2 li a:hover{color: #222222;text-decoration: none;}


ul.list-2 li:before {content: "\f00c";display: inline-block;font: normal normal normal 14px/1 FontAwesome;font-size: inherit;text-rendering: auto;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;position: absolute;top: 3px;left: -22px;}

.text80{    width: 80%;
    margin: 0 auto;}

.gray-container {
    background-color: #fdfbfb;
    padding: 50px 0;
}



.box-40mg-left{ margin-left: 40px;}


.blue-lines-bg{}

.responsive-blue {}

.blue-lines-bg {
    background: url(../images/blue-lines-bg.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 40px 0 70px;
}

.text-white-section h2{ color: #fff;}

.text-white-section h3{ color: #fff;}
.text-white-section p{ color: #fff;}
.text-white-section ul.list-2 li{color: #fff;display:}
.text-white-section ul.list-2 li a{color: #fff;}
.text-white-section ul.list-2 li a:hover{color: #fff;}

.text-white-section ul.list-3 li{color: #fff;display:}
.text-white-section ul.list-3 li a{color: #fff;}
.text-white-section ul.list-3 li a:hover{color: #fff;}

.p-mg-tp-100{ margin-top: 100px}
.p-mg-tp-50{ margin-top: 50px}
.black-container{background-color: #000;
    padding: 50px 0;}
.black-container-landing-page{background-color: #000;
    padding: 50px 0 0;}


ul.list-3{margin: 0 0 0 30px;padding: 0;list-style: none;display: table;}
ul.list-3 li{color: #000;display: block;margin: 0 20px 30px 0;font-size: 14px;position: relative;}
ul.list-3 li a{color: #222222;font-size: 16px;line-height: 40px;font-weight: 500;text-decoration: underline;}
ul.list-3 li a:hover{color: #222222;text-decoration: none;}
ul.list-3 li strong{font-weight: 700}

ul.list-3 li:before {
    content: "\f111";
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    top: 5px;
    left: -18px;
    font-size: 9px;
}

.responsive-blue{ background-color: #0071bc;   position: relative;
    padding: 40px 0 70px;}

.responsive-orange{ background-color: #f58220;   position: relative;
    padding: 40px 0 70px;}

.container-promotion{padding: 70px 0 0;
    width: 100%;}
.container-promotion p{font-size: 15px;}

.bg-psd-to-html{
    background: url(../images/bg-psd-to-html.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 55px 0;
    }

.bg-psd-to-html-box{background-color:#0071bd;padding: 10px 40px 30px;}
.pd-tp-30{padding-top:30px}
.website-Maintenance2{
    background: url(../images/Website-Maintenance2.jpg) no-repeat center;
    background-size: contain;
    position: relative;
    padding: 20px 0 60px;
    background-position: right;
    background-color: #f58220;
    }
.website-maintenance3{    background-color: #0071bc;
    position: relative;
    padding: 70px 0 0;}
.website-maintenance3 h2{ margin-top:0px;}

.website-redesign-service{background: url(../images/website-redesign-service.jpg) no-repeat center;
    background-size: contain;
    position: relative;
    padding: 20px 0 60px;
    background-position: right;
    background-color: #0071bc;}

.website-redesign-service h2{font-size: 40px;}


 
.website-redesign{
    background: url(../images/why-choose-website-redesign.jpg) no-repeat center;
    background-size: contain;
    position: relative;
    padding: 20px 0 60px;
   background-position: right top;
    
    }

.importance-of-website-redesign{
    background: url("../images/importance-of-website-redesign.jpg") no-repeat center;
    background-size: contain;
    position: relative;
    padding: 20px 0 60px;
   background-position: right top;
    
    }
.social-media-marketing{
    background: url(../images/social-media-marketing.jpg) no-repeat center;
    background-size: contain;
    position: relative;
    padding: 20px 0 60px;
   background-position: right top;
    border-bottom: 5px solid #0071bc;
    
    }
.lead-generation{
    background: url(../images/lead-generation.jpg) no-repeat center;
    background-size: contain;
    position: relative;
    padding: 20px 0 60px;
   background-position: right top;
    
    }
.smm-webbizgrow{}
.box-smm{text-align: center;box-shadow: 0px 0px 22px 0px #f9f5f5;padding: 20px;min-height: 344px;}
.box-smm h4{font-size: 17px;font-weight: 700;line-height: 26px;margin-bottom: 20px;}

.container40 {
    padding: 40px 0 70px;
    width: 100%;
}

.ppc-advertising{
    background: url(../images/ppc-advertising.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 55px 0;
}

.ppc-box{background-color:#f7f7f7;padding:20px;text-align:center;margin-top: 40px;min-height: 722px;position: relative;}

.ppc-box h3{text-align:center}
.ppc-box p{text-align:center}
    
.youtube-marketing{
    background: url(../images/why-youtube-marketing.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 55px 0;
}

.why-social-media-optimization{
    background: url(../images/why-social-media-optimization.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 55px 0;
}

.domain-registration{
    background: url(../images/domain-registration-bg.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 55px 0;
}

.domain-registration-services{ position:relative;}

.why-domain-registration{position:relative;}

.web-hosting-services{
    background: url(../images/web-hosting-services.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 55px 0;
}

.container-domain-hosting h2, .container-app-development h2, .container-web-development h2, .container-web-designing h2, .container-digital-marketing h2 {margin: 0px 0 20px;}

.leading-web-designing-company{
    background: url(../images/leading-web-designing-company.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 55px 0; min-height: 545px;
}
.width70{ width:70%; margin:0 auto;}

.wordpress-development {
    background-color: #0071bc;
    position: relative;
    padding: 70px 0 70px;
}
.main-menu ul>li .dropdown-menu li h2 a {
    font-weight: 700;
    font-size: 20px;
    color: #0071bc!important;
    line-height: normal;
    text-transform: none;
    margin-bottom: 20px;
}

.main-menu ul>li .dropdown-menu li h2 a:hover {
     color: #f58220!important; 
}


.messagebox {
    color: #333;
    background-color: #f58220;
    animation-name: message;
    animation-duration: 4s;
    animation-iteration-count: infinite;
    width: 100%;
    padding: 12px 50px;
    text-align: center;
    line-height: 40px;
    font-size: 30px;
    text-transform: uppercase;
    font-weight: 500;
    display: none;
}

@keyframes message {
  0%   {background-color:#f58220;}
  25%  {background-color: white;}

}


.wt80{ width:80%; text-align:center; margin:0 auto;}

.owl-carousel .owl-item {
    border: 1px solid #0071bc;
}

.footer-first{margin-bottom: 40px;}

.mobile-number{
    position: relative;
    border: none;
    font-weight: 600;
    letter-spacing: 6px;
    color: #0071bc;
    -webkit-text-stroke: snow;
    margin-bottom: 10px;
    font-size: 22px;
    font-size: 41px;
    font-weight: 400;
    font-family: 'Oswald', sans-serif;
    line-height: 39px;
    color: #000;
    }

.whatsap2{
    color: #000;
    font-weight: 400;
}

.whatsap2 i {border-radius: 50%;
    color: #fff;
    background: #4caf50;
    padding: 3px;
    height: 25px;
    width: 25px;
    text-align: center;}

.whatsap2 a{ color: #000;}
.contact-ftr a{ color: #000;}

.contact-ftr{ margin:30px 0 0}

.email-ftr {margin:20px 0 0 0; font-size:15px
}
.email-ftr i {margin: 0 10px 0 0;}
.email-ftr a:hover{color: #0071bc;}

.footer-second{ padding:40px 0 0}
ul.flink2 { margin: 0; padding: 0; list-style: none }
ul.flink2 li {display: inline-block;font-family: 'Montserrat', sans-serif;font-size: 13px;line-height: 24px;font-weight: normal;text-transform: uppercase;margin: 0 40px 0 0;}
ul.flink2 a {color: #002856;-webkit-transition: all 0.3s ease;-o-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-ms-transition: all 0.3s ease;font-weight: 500;font-size: 13px;line-height: 37px!important;}
ul.flink2 {color: #a7a6a6;}
ul.flink2 a:hover {color: #0071bc;}
.copyright-text{
    text-align: right;
    font-size: 13px;
}

.why-digital-marketing {
    background: url(../images/why-digital-marketing.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 55px 0;
}


ul.s-icons .home-page-collapse ul li i:before, ul li i:after {
    content: "";
    position: absolute;
    background-color: none;
    width: 3px;
    height: 9px;
}

.search-engine-optimization {
    background: url(../images/search-engine-optimization.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 55px 0;
}

.white-box{
    background-color: #fff;
    padding: 10px 40px 30px;
}

.web-application-development-bg{
    background: url(../images/web-application-development-bg.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 55px 0;
}

.web-application-development-bg h2 {
  margin:0px 0 20px;    
}

.benefits-web-application-development{
    background: url(../images/benefits-web-application-development.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 55px 0;
}

.blue-container {
    background-color: #0071bc;
    position: relative;
    padding: 70px 0 70px;
}
.why-webbizgrow-custom-web {
    background: url(../images/why-webbizgrow-custom-web.jpg) no-repeat center;
    background-size: cover;
    position: relative;
    padding: 55px 0;
}




.btn2 {
	color: #fff;
	border: 1px solid #fff;
	position: relative;
	z-index: 1;
	display: inline-block;
	background-color: transparent;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	padding: 12px 50px;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	letter-spacing: 1.5px;
	margin-top: 20px;
	font-weight: 700;
	font-size: 14px;
    z-index: 1000;
}
.btn2 a{
	color: #fff; }
.btn2:before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 0;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	background-color: #0071bc;
	z-index: -1;
}
.btn2:hover {
	border: 1px solid #0071bc;
	background-color: transparent;
	color: #ffffff;
}
.btn2:hover:before {
	width: 100%;
}

.carousel-control-next, .carousel-control-prev {
     width: 1px !important;
}


   

.hosting {
      display: inline-block;
    float: left;
    margin: 0 30px 0 0;
    font-family: 'Open Sans', sans-serif;
    margin: 5px 20px 0 0;
    font-weight: 500;
    animation-name: message2;
    animation-duration: 4s;
    animation-iteration-count: infinite;
color:#0071bc; display:none;
}

@keyframes message2{
  0%   {color:#0071bc;}
  25%  {color: #f58220;}
}
 .blog-box{margin:0 0 30px 0}


ul.list-4{margin: 0 0 0 30px;padding: 0;list-style: none;display: table; width:100%}
ul.list-4 li{text-align: left;color: #000;font-weight: 600;display:inline-block;width: 41%;float:left;margin: 0 20px 31px 0;}
ul.list-4 li a{color: #0071bd;font-family: 'Montserrat', sans-serif;font-size: 16px;text-decoration: underline;}
ul.list-4 li a:hover{color: #ef8633;/* background-color: #0071bc */     text-decoration: none;}

ul.list-4 li i {-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;-ms-transition: all 0.3s ease;transition: all 0.3s ease;position: relative;top: 1px;left: 20px;}
ul.list-4 li:hover i { margin: 0 0 0 5px }

.form-outer h3{
    margin: 0 0 10px; font-size: 26px;
}
.form-outer{
    padding: 20px;
    width: 100%;
    box-shadow: 0 8px 80px rgb(0 0 0 / 22%);
    position: relative;
    z-index: 3;
    border-radius: 6px;
    overflow: hidden;
    margin: 10px 0 10px;
    background-color: #fff;
}
.form-tip{
    font-size: 12px;
}



.inner_banner_section2 {
    padding: 30px 0 60px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.inner_banner_box2 {    text-align: center;}
.inner_banner_box2 h1{
     font-size: 44px;
    line-height: 70px;
    font-weight: 800;
    text-transform: uppercase;
    color: #fff;
    margin: 0px 0;
}
.inner_banner_box2 h1 span {
    color: transparent;
    -webkit-text-stroke: 1px #fff;
}

.form-outer{}

.form-outer #main-form input {
    height: 41px;
}

.form-outer .read-more {
    text-align: left;
    float: left;
    display: table;
    border-radius: 35px;
    padding: 10px 20px;
    color: #fff;
    margin: 25px auto 0;
    margin: 0px auto 0;
    background-color: #0071bd;
    font-size: 14px;
}

.form-outer .form-group {
    margin-bottom: 10px;
}


.banner-heading h1 {
    font-size: 80px;
    line-height: 75px;
    font-weight: 800;
    text-transform: uppercase;
    color: #0269ae;
    margin: 38px 0;
}

.banner-heading h1 span {
    color: transparent;
    -webkit-text-stroke: 1px #0267ab;
}


.landing-page-banner-section { border-top: 1px solid #f7f7f7;
    padding: 40px 0 120px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.seo-offer-border{
    border: 1px solid #fff;
    border-radius: 10px;
    padding: 15px;
}


.digital-marketing-offer {display: block;padding: 40px;box-sizing: border-box;border-radius: 10px;}
.digital-marketing-offer h2 {color: #fff;font-size: 34px;line-height: 73px;}
.digital-marketing-offer h2 span{color: #fff;font-size: 78px;font-weight:200;display:block;}
.digital-marketing-offer h3 {color: #fdfbfb;font-size: 61px;line-height: 58px;}
.digital-marketing-offer .theme-title h2:before { content: ''; width: 178px; height: 2px; position: absolute; left: 0; bottom: 0; background: #f58220; background: -webkit-gradient(linear, left top, right top, color-stop(81%, #fff), color-stop(81%, #e31e24), color-stop(89%, #212121), color-stop(89%, #fff), to(#fff)); background: linear-gradient(to right, #fff 81%, #e31e24 81%, #e31e24 89%, #fff 89%, #fff 100%) }
.digital-marketing-offer .theme-title.text-center h2:before { left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%) }

.blue-seo{background-color: #0275d8;}
.orange-seo{background-color: #f58220;}

.box-smm2 {
    text-align: left;
    box-shadow: 0px 0px 22px 0px #f9f5f5;
    padding: 20px; min-height: 344px;
}


.box-smm3 {
  text-align: left;
    padding: 20px 20px 10px 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
}



/* question-section css start */
.tabs-portfolio{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: -20px;
  list-style: none;
  border-bottom: 1px solid #dfdfdf;
}
.tabs-portfolio li {
    width: calc((100% / 4) - 30px);
    box-shadow: none;
    border-radius: 999px;
    margin-bottom: 0px;
    width: 24%;
    text-align: center;
    border-radius: 0;
}
.active-portfolio{
  /*  background-image: -moz-linear-gradient( 90deg, rgb(59,38,219) 1%, rgb(123,25,203) 100%);
  background-image: -webkit-linear-gradient( 90deg, rgb(59,38,219) 1%, rgb(123,25,203) 100%);
  background-image: -ms-linear-gradient( 90deg, rgb(59,38,219) 1%, rgb(123,25,203) 100%);*/
  box-shadow: none;
  color: #0275d8!important;
  border-radius: 999px;
  background-color: transparent;
  box-shadow: none;
  border-bottom: 3px solid #0275d8;
  }
.tabs-portfolio li:hover {
  
}
.tabs-portfolio li a {
  padding: 5px 30px;
  display: block;
  font-size: 18px;
  font-weight: 600;
  border-radius: 0;
  color: #ccc;
}
.tabs-portfolio li:hover a {
  color: #0275d8;
       border-bottom: 3px solid #0275d8;
}

.mb-65 {
    margin-bottom: 32px;
}

        .xc-demo-item {
            padding: 17px;
            padding-bottom: 30px;
            background-color: #f7f7f7;
        }

        .xc-demo-thumb {
            height: 470px;
            overflow: hidden;
            /* border-radius: 10px; */
            margin-bottom: 30px;
            transition: all 5s linear;
            background-size: 100%;
            background-repeat: no-repeat;
            /* box-shadow: 0 10px 20px rgb(195 192 192 / 10%); */
            /* box-shadow: 0 5px 5px rgb(203 201 201 / 10%); */
        }

            .xc-demo-thumb:hover {
                background-position: bottom;
            }

        .xc-demo-thumb-overlay {
            position: relative;
        }

            .xc-demo-thumb-overlay::after {
                position: absolute;
                content: "";
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                border-radius: 2px;
                background: rgba(79, 88, 122, 0.5);
                box-shadow: 0px 2px 4px 0px rgba(23, 23, 24, 0.1), 0px -1px 0px 0px rgba(36, 62, 21, 0.5);
                backdrop-filter: blur(12.5px);
            }
.wlink{display: table;width: 100%;font-weight: 600;}
.website-link {float: left;display: inline-block;}
.website-link2 {float: right;display: inline-block;}

.website-link a{text-decoration: underline;}
.website-link a:hover{text-decoration:none;}
.website-link2 a{background-color: #0275d8;border-radius: 5px;color: #fff;padding: 5px 10px;font-size: 12px;}

.website-link2 a:hover{background-color: #ff540b; }


.containerportfolio {
    padding: 30px 0 50px;
    width: 100%;
    position: relative;
}