:root {

    --am-font: "Plus Jakarta Sans", sans-serif;

    --am-primary: #1989fb;

    --am-primary-rgb: 25, 137, 251;

    --am-black: #1b1825;

    --am-black-rgb: 27, 24, 37;

    --am-base: #ffffff;

    --am-base-rgb: 255, 255, 255;

    --am-extra: #42d9be;

    --am-extra-rgb: 66, 217, 190;

    --am-bdr-color: #dae3e9;

    --am-bdr-color-rgb: 218, 227, 233;

    --am-bdr-radius: 6px;

}



/* 1.0 - General */

html {scroll-behavior: smooth;}

body{margin: 0; background: var(--am-base); }

table,div{font-family: var(--am-font); font-size:16px; color:var(--am-black); line-height:26px; font-weight: 500;}

a{color: #333333; text-decoration: none; transition: all .2s ease-in-out;}

a:hover{color: #333333; text-decoration: none; }



article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video {display:block}

* {box-sizing: border-box;}

::-webkit-input-placeholder {color: #000000;}/* Chrome/Opera/Safari */

::-moz-placeholder {color: #000000;}/* Firefox 19+ */

:-ms-input-placeholder {color: #000000;}/* IE 10+ */

:-moz-placeholder {color: #000000;}/* Firefox 18- */



.no-js #loader {display: none;}

.js #loader { display: block; position: absolute; left: 100px; top: 0; }

.se-pre-con {position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background: url("http://smallenvelop.com/wp-content/uploads/2014/08/Preloader_2.gif") center no-repeat #fff;}



img{border:none; height: auto}

p{margin:0 0 20px;}

.img-left, .left{float:left;}

.img-right, .right{float:right;}

#logo, #left, #social, #contact-left{float:left;}

#top_link, #right, #copy-logo, #contact-right{float:right;}

:focus {outline: 0;}

a:active {outline: none;}



h1,h2,h3,h4,h5,h6{margin:0 0 20px; }



/*Heading*/

h1{font-size:30px;}

h2{font-size:26px;}

h3{font-size:22px;}

h4{font-size:18px;}

h5{font-size:16px;}

h6{font-size:14px;}



.c-left{text-align: left;}

.c-center{text-align: center;}

.c-right{text-align: right;}

.font-uppercase {text-transform: uppercase;}

.padding-bottom{padding-bottom: 0 !important}

.padding-top{padding-top: 0 !important}



.theme-bg {background: #32c5d2;}

.gray-bg {background: #f5f5f5;}



.img-left{margin-right:10px;}

.img-right{margin-left:10px;}



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

ul li{list-style: disc; margin: 0 0 10px;}



.ul{margin:0; padding-left:0; margin-left:20px;}

.ul li{margin-bottom: 10px;}

/* .ul li{ list-style-image:url(https://www.shoutnhike.com/wp-content/uploads/2025/10/carts.jpg);} */



.mobile{display: none;}

.desktop{display: block;}



/* breadcrumb */

.breadcrumb{margin-bottom:15px; color:#666;} .breadcrumb a{margin-bottom:15px; color:#00003f;} .breadcrumb a:hover{margin-bottom:15px; color:#333;}



/* Responsive Table */

/*.table {border-collapse: collapse; margin: 10px 0 0px; width: 712px;}

.table th {background: none repeat scroll 0 0 #002f92; border: 1px solid var(--am-bdr-color); font-weight: normal; padding: 13px 8px; color: var(--am-base);}

.table td {background: none repeat scroll 0 0 #f3f3f3; border: 1px solid var(--am-bdr-color); padding: 8px;}

.table tr:hover td {background: none repeat scroll 0 0 #d9f5f8;}*/



.dropdown-menu {font-size: inherit;}



.orange-btn{padding: 0 20px; line-height: 50px; height: 50px; background: #f36e30; color: #FFF; border: none; cursor: pointer; font-weight: 600; transition: all .4s ease-in-out; text-transform: uppercase; display: inline-block; border-radius: 8px;}

.orange-btn:hover {color: #FFF; background:#000; box-shadow: 0 5px 12px 0 rgba(255, 255, 255, 0.2);}

.blue-btn{padding: 0 20px; line-height: 50px; height: 50px; background: #0a91f9; color: #FFF; border: none; cursor: pointer; font-weight: 600; transition: all .4s ease-in-out; text-transform: uppercase; display: inline-block; border-radius: 8px;}

.blue-btn:hover {color: #FFF; background:#f36e30; box-shadow: 0 5px 12px 0 rgba(255, 255, 255, 0.2);}

.white-btn{padding: 0 20px; line-height: 50px; height: 50px; background: #FFF; color: #0a91f9; border: 1px solid #0a91f9; cursor: pointer; font-weight: 600; transition: all .4s ease-in-out; text-transform: uppercase; display: inline-block; border-radius: 8px;}

.white-btn:hover {color: #0a91f9; background:#f1f1f1; box-shadow: 0 5px 12px 0 rgba(255, 255, 255, 0.2);}



/** 2.0 - Header **/

.navbar .navbar-header .icon-bar {background-color: #333333; display: block; width: 22px; height: 2px; border-radius: 1px; margin: 4px auto 0; transition: .25s ease-in-out;}

.navbar .navbar-header .nav-toggle.active .icon-bar:nth-child(1){transform: rotate(45deg); margin-top: 0px;}

.navbar .navbar-header .nav-toggle.active .icon-bar:nth-child(2){display: none}

.navbar .navbar-header .nav-toggle.active .icon-bar:nth-child(3){transform: rotate(-45deg); margin-top: -2px;}

#menu-toggle{display: none}

.navbar-inverse{margin: 0; background-color: #0c093d; border-color: transparent; padding: 0}

.navbar{border-radius: 0; position: relative; border: none;}

.navbar-brand{padding: 30px 0; height: auto; text-transform: uppercase; color: #333333; font-size: 30px; margin: 0; display: inline-block; position: relative}

.navbar-brand img.hiring{position: absolute; right: -120px; top: 0;}

.navbar-inverse .navbar-brand:focus, .navbar-inverse .navbar-brand:hover{color: #333333}



.jumbotron{padding: 0; margin: 0; position: relative}

/*.jumbotron:after{background: rgba(0,0,0,.5); position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: '';}*/

.jumbotron .container { max-width: 100%; height: 100%;}

.home-ban{position: relative; background: #0c093d}

.home-ban .ban-text{text-align: center; margin: 0 auto; color: var(--am-base); font-size: 16px; z-index: 1; width: 1320px; padding: 60px 0}

.home-ban .ban-text .left, .home-ban .ban-text .right{width: 48%}

.home-ban .ban-text .left{text-align: left; color: #FFF}

.home-ban .ban-text .left h1{font-size: 44px; line-height: 62px; margin: 0 0 20px; font-weight: bold; color: #FFF}

.home-ban .ban-text .left h1 span{display: block;}

.home-ban .ban-text .left .orange-btn{position: relative; padding-left: 100px; margin: 8px 0 30px}

.home-ban .ban-text .left .orange-btn img{position: absolute; left: 20px; top: -10px;}

.home-ban .ban-text .left .orange-btn:hover {color: #f36e30; background:#FFF;}

.home-ban .ban-text .left .offer{color: #48c969; font-size: 16px;}

.home-ban .ban-text .left .offer span{border: 1px solid #48c969; padding: 8px 15px; border-radius: 30px;}

.home-ban .ban-text .right{background: url(https://www.shoutnhike.com/wp-content/uploads/2025/10/home-ban-bg.png) no-repeat center center; position: relative}

.home-ban .ban-text .right ul{list-style: none; margin: 0; padding: 0; width: 31%; margin: 0 1.16% 10px; float: left;}

.home-ban .ban-text .right ul li{list-style: none; margin: 20px 0; background: #0a91f9; border: 4px solid #0c093d; border-radius: 10px; box-shadow: 0px 0px 3px #0a91f9; padding: 30px 20px; }

.home-ban .ban-text .right ul li img{margin: 0 0 20px;}

.home-ban .ban-text .right ul li span{color: #FFF; display: block; min-height: 52px;}

.home-ban .ban-text .right ul:nth-child(3){margin-top: 60px}

.home-ban .ban-text .right ul:nth-child(4){margin-top: 170px}

.home-ban .ban-text .right .play-icon{position: absolute; width: 177px; height: 177px;; right: 40px; top: -20px;}

.home-ban .ban-text .right .play-icon:before{width: 48px; height: 38px; position: absolute; left: -40px; top: 40px; content: ''; background: url(https://www.shoutnhike.com/wp-content/uploads/2025/10/benfit-arrow.png) no-repeat}

.home-ban .ban-text .right .play-icon img{width: auto; position: absolute; top: 40%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); z-index: 10}

.home-ban .ban-text .right .play-icon span{width: auto; position: absolute; top: 62%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); z-index: 10; display: block; color: #FFF}

.home-ban .ban-text .right .play-icon .rotating{-webkit-transform: rotate(360deg); -webkit-transition-duration: 1s; -webkit-transition-delay: now; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; left: 0; top: 0; z-index: 1;}

.home-ban .ban-text .review-block{margin: 30px 0 0; border: 1px solid #9593bb; border-radius: 15px; background: #1a1755; }

.home-ban .ban-text .review-block .google-partner{float: left; border: 1px solid #9593bb; padding: 46px 30px; color: #FFF; margin: -1px; border-radius: 15px; background: #221f61; width: 50%; text-align: left;}

.home-ban .ban-text .review-block .google-partner h4{color: #FFF; font-size: 24px; font-weight: bold; margin: 0 0 12px;}

.home-ban .ban-text .review-block .google-partner img{float: right;}

.home-ban .ban-text .review-block .google-partner p{margin: 0}

.home-ban .ban-text .review-block .review{float: right; padding: 30px; width: 50%;}

.home-ban .ban-text .review-block .review ul{margin: 0; padding: 0; list-style: none; display: flex; align-items: center;}

.home-ban .ban-text .review-block .review ul li{list-style: none; margin: 0; padding: 0 15px; float: left; color: #FFF}

.home-ban .ban-text .review-block .review ul li:nth-child(1){color: #FFF; text-align: center; width: 30%;}

.home-ban .ban-text .review-block .review ul li:nth-child(1) .star{color: #ff9f07;}

.home-ban .ban-text .review-block .review ul li:nth-child(1) span{display: block; font-size: 36px; font-weight: bold; line-height: 42px}

.home-ban .ban-text .review-block .review ul li:nth-child(1) u{text-decoration: none}

.home-ban .ban-text .review-block .review ul li:nth-child(1) .loader-line{height: 2px;  position: relative; overflow: hidden; background-color: #ddd;}

.home-ban .ban-text .review-block .review ul li:nth-child(1) .loader-line::before { content: ""; position: absolute; left: -50%; height: 3px; width: 40%; background-color: coral; -webkit-animation: lineAnim 1s linear infinite; -moz-animation: lineAnim 1s linear infinite; animation: lineAnim 1s linear infinite; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; }

.home-ban .ban-text .review-block .review ul li:nth-child(2){color: #FFF; text-align: left;}

.home-ban .ban-text .review-block .review ul li:nth-child(2) u{display: block}

.home-ban .ban-text .review-block .review ul li:nth-child(2) p{margin: 10px 0 0}

.home-ban .ban-text .review-block .review ul li:nth-child(3){color: #FFF; text-align: center; width: 22%; position: relative}

.home-ban .ban-text .review-block .review ul li:nth-child(3) .play-icon{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); width: 97px; height: 97px;; z-index: 1   }

.home-ban .ban-text .review-block .review ul li:nth-child(3) .play-icon img{width: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);}

.home-ban .ban-text .review-block .review ul li:nth-child(3) .play-icon .rotating{-webkit-transform: rotate(360deg); -webkit-transition-duration: 1s; -webkit-transition-delay: now; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; left: 0; top: 0;}



.row-am{width: 100%;}



/** 3.0 - Content **/

#content .row-am{padding: 80px 0;}

h2{color: #0c093d; font-size: 40px; margin: 0 0 20px; font-weight: 600; line-height: 52px;}

h2 span{color: #0a91f9}

.title{margin: 0 0 40px;}

.title span{font-size: 14px; text-transform: uppercase; color: #0a91f9; font-weight: 600; position: relative; margin: 0 0 10px; display: inline-block; min-width: 100px;}

.title span:after{position: absolute; bottom: -4px; left: 0; right: 0; margin: 0 auto; content: ''; background: #0a91f9; height: 2px; width: 50px;}

.lead{font-size: 16px; color: var(--am-black); line-height: 26px; font-weight: 500; padding: 0 300px;}



.home-about{}

.home-about .container{border-bottom: 1px solid #d1d1dd;}

.home-about .head{border-bottom: 1px solid #d1d1dd; padding-bottom: 30px;}

.home-about .head .left, .home-about .right{width: 48%;}

.home-about .head .left{position: relative; padding-left: 40px;}

.home-about .head .left span{font-size: 17px; font-weight: 600; color: #0a91f9; transform: rotate(-90deg); display: inline-block; border-bottom: 3px solid #0a91f9; position: absolute; left: -30px; top: 40px; text-transform: uppercase}

.home-about .head .right{padding: 20px; border: 1px dashed #0a91f9; border-radius: 15px; display: flex; justify-content: space-between; align-items: center;}

.home-about .head .right:hover img{transform: rotateY(180deg); transition: transform 0.8s; transform-style: preserve-3d;}

.home-about .head .right h3{margin: 0 20px; font-size: 18px; font-weight: 500; width: 56%}

.home-about .head .right h3 span{font-weight: 600; font-size: 40px; line-height: 50px; display: block}

.home-about .head .right a{color: #f36e30; font-size: 16px; text-transform: uppercase; font-weight: 600;}

.home-about .body .left, .home-about .body .right{width: 50%;}

.home-about .body .left{padding: 40px 40px 40px 0; border-right: 1px solid #d1d1dd; line-height: 31px;}

.home-about .body .left span{color: #0a91f9; font-weight: 600}

.home-about .body .right{}

.home-about .body .right .video{border-bottom: 1px solid #d1d1dd; position: relative; padding: 40px 0 40px 40px;}

.home-about .body .right .video img, .home-about .body .right .video iframe{width: 100%;}

.home-about .body .right .video .play-icon{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); width: 161px; height: 161px;; z-index: 1  }

.home-about .body .right .video .play-icon img{width: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);}

.home-about .body .right .video .play-icon .rotating{-webkit-transform: rotate(360deg); -webkit-transition-duration: 1s; -webkit-transition-delay: now; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; left: 0; top: 0;}

.home-about .body .right .team-exp{background: #0a91f9; border-radius: 20px; margin: 40px 0 40px 40px; display: flex; align-items: center;}

.home-about .body .right .team-exp .team{padding: 20px; border-right: 5px solid #ffffff; border-radius: 20px; width: 60%; float: left; display: flex; align-items: center;}

.home-about .body .right .team-exp .team img{float: left; margin-right: 15px;}

.home-about .body .right .team-exp .team div{font-size: 18px; color: #FFF; font-weight: 500}

.home-about .body .right .team-exp .team span{font-size: 40px; font-weight: bold; display: block; line-height: 40px;}

.home-about .body .right .team-exp .experience{width: 40%; padding: 20px; font-size: 18px; color: #FFF; font-weight: 500}

.home-about .body .right .team-exp .experience span{display: inline-block; background: #0c093d; color: #FFF; font-size: 40px; font-weight: bold; line-height: 40px; padding: 5px 10px 8px; border-radius: 6px;}



.light-blue-bg{background: #f4faff}

.light-brown-bg{background: #fefaf0}

.light-green-bg{background: #f6fbf4}

.light-red-bg{background: #fff8f7}

.sky-blue-bg{background: #f4fdff}

.light-purple-bg{background: #fbfaff}



.blue-border{border: 1px solid #c7e7ff}

.brown-border{border: 1px solid #f8e4b4}

.green-border{border: 1px solid #d0eac9}

.red-border{border: 1px solid #ffd9d6}

.skyblue-border{border: 1px solid #c8f3fd}

.purple-border{border: 1px solid #ece3ff}



.what-we{text-align: center}

.what-we .box{width: 32%; margin: 0 2% 30px 0; float: left; padding: 40px; border-radius: 20px; text-align: left;}

.what-we .box:nth-child(3n+3){margin-right: 0}

.what-we .box img{margin: 0 0 20px}

.what-we .box:hover img{transform: rotateY(180deg); transition: transform 0.8s; transform-style: preserve-3d;}

.what-we .box span{display: block}

.what-we .box h3{font-size: 24px; font-weight: 700; color: #0c093d}

.what-we .box ul{margin: 0 0 20px; padding: 0; list-style: none}

.what-we .box ul li{list-style: none; margin: 0 0 15px; padding-left: 26px; position: relative}

.what-we .box ul li img{position: absolute; left: 0; top: 8px; margin: 0}



.targeted-audience{background: #0c093d; text-align: center}

.targeted-audience h2{color: #FFF}

.targeted-audience ul{list-style: none; margin: 0; padding: 0; text-align: center }

.targeted-audience ul li{list-style: none; width: 22%; font-size: 18px; position: relative; padding: 20px 20px 20px 100px; background: #f2f4fe; border-radius: 50px; margin: 10px; min-height: 100px; display: inline-grid; text-align: left;}

.targeted-audience ul li span{height: 60px; padding: 4px 0 0}   

.targeted-audience ul li span.center{position: relative; top: 11px;}    

.targeted-audience ul li img{position: absolute; left: 15px; top: 15px;}

.targeted-audience ul li:hover img{transform: rotateY(180deg); transition: transform 0.8s; transform-style: preserve-3d;}

.targeted-audience ul li:hover{color: #FFF; background: #0a91f9}



.our-target{}

.our-target .head{margin: 0 0 30px;}

.our-target .head .left, .our-target .head .right{width: 48%;}

.our-target .head .left .title span::after{margin: 0}

.our-target .head .left .title h2 span{font-size: 40px; margin: 0; font-weight: 600; line-height: 52px; text-transform: none;}

.our-target .head .left .title h2 span:after{display: none;}

.our-target .head .left{}

.our-target .head .right{text-align: right}

.our-target .head .right img{max-width: 100%;}

.our-target .box{width: 32%; margin: 0 2% 30px 0; float: left; padding: 40px; border-radius: 20px; text-align: left; border: 1px solid #e2e8fb; background: #f6f8ff}

.our-target .box:nth-child(3n+3){margin-right: 0}

.our-target .box img{margin: 0 0 20px}

.our-target .box:hover img{transform: rotateY(180deg); transition: transform 0.8s; transform-style: preserve-3d;}

.our-target .box span{display: block}

.our-target .box h3{font-size: 24px; font-weight: 700; color: #0c093d}

.our-target .box ul{margin: 0 0 20px; padding: 0; list-style: none}

.our-target .box ul li{list-style: none; margin: 0 0 15px; padding-left: 26px; position: relative; }

.our-target .box ul li img{position: absolute; left: 0; top: 8px; margin: 0}



.get-audit{background: url(https://www.shoutnhike.com/wp-content/uploads/2025/10/expert-bg.png) no-repeat center center; background-size: cover;}

.get-audit .left{width: 60%;}

.get-audit .left .title{color: #FFF}

.get-audit .left .title span::after{margin: 0}

.get-audit .left .title h2{color: #FFF}

.get-audit .right{width: 25%;}

.get-audit .right .profile{width: 100%; background: #FFF; border-radius: 20px; text-align: center; position: relative; padding: 65px 25px 25px;}

.get-audit .right .profile img{position: absolute; top: -30px; left: 0; right: 0; margin: 0 auto;}

.get-audit .right .profile .name{margin: 0 0 10px;}

.get-audit .right .profile .name span{display: block; font-weight: bold;}

.get-audit .right .star{background: #ffd38e; border-radius: 20px; text-align: center; padding: 40px 15px 15px; margin-top: -34px}

.get-audit .right .star span{color: #f36100; display: block}



.our-packages{text-align: center}

.our-packages .title{margin: 0 0 70px;}

.our-packages .box{width: 23%; margin: 0 2.66% 30px 0; float: left; border-radius: 20px; background: #FFF; border: 1px solid #46afff; text-align: center; position: relative; padding: 50px 0 20px;}

.our-packages .box:nth-child(4n+4){margin-right: 0}

.our-packages .box img{position: absolute; top: -34px; left: 0; right: 0; margin: 0 auto;}

.our-packages .box:hover img{transform: rotateY(180deg); transition: transform 0.8s; transform-style: preserve-3d;}

.our-packages .box h3{font-size: 24px; font-weight: 700; color: #0c093d}

.our-packages .box .price{background: #e6f4fe; color: #0c093d; padding: 20px;}

.our-packages .box .price span{display: block}

.our-packages .box .price strong{font-weight: bold; font-size: 20px;}

.our-packages .box ul{margin: 0 0 20px; padding: 0; list-style: none}

.our-packages .box ul li{list-style: none; margin: 0; position: relative; border-bottom: 2px solid #e3f3ff; line-height: 38px;}

.our-packages .orange-btn:hover{background: #000}

.our-packages .star{background: url(https://www.shoutnhike.com/wp-content/uploads/2025/10/review-bg.png) no-repeat center center; background-size: cover; line-height: 37px; display: table; margin: 20px auto 0; padding: 0 80px}

.our-packages .star span{color: #f36100}



.why-choose{text-align: center; background: #f6f8ff}

.ultimate-things{border: 1px dashed #0a91f9; padding: 30px; border-radius: 20px; background: #FFF; margin: 0 0 30px;}

.ultimate-things h3{font-size: 25px; font-weight: bold; margin: 0 0 40px;}

.ultimate-things h3 span{color: #0a91f9}

.ultimate-things ul{list-style: none; margin: 0; padding: 0; }

.ultimate-things ul li{list-style: none; margin: 0 2.66% 0 0; width: 23%; float: left; background: #f6f8ff; padding: 30px; text-align: left; border-radius: 20px; border: 1px solid #0a91f9; box-shadow: 0 3px 0 #0a91f9; position: relative}

.ultimate-things ul li:last-child{margin-right: 0}

.ultimate-things ul li:before{background: #0a91f9; height: 3px; width: 60px; position: absolute; left: 30px; top: 0; content: '';}

.ultimate-things ul li img{margin: 0 0 20px;}

.ultimate-things ul li:hover img{transform: rotateY(180deg); transition: transform 0.8s; transform-style: preserve-3d;}

.ultimate-things ul li h4{font-size: 18px; font-weight: bold; margin: 0 0 30px; min-height: 64px}

.ultimate-things ul li .number{font-size: 30px; font-weight: bold; color: #0a91f9; position: relative; margin: 0 0 -30px;}

.usp{display: flex; justify-content: space-between; margin: 0 0 20px;}

.usp .left{background: url(https://www.shoutnhike.com/wp-content/uploads/2025/10/projects-completed-bg.png) no-repeat center center; background-size: cover; border-radius: 20px; width: 25%; font-size: 18px; color: #FFF; padding: 30px; text-align: left; margin: 0 0 20px;}

.usp .left span{font-size: 45px; font-weight: bold; color: #0a91f9; display: block; line-height: 50px}

.usp .right{width: 72%;}

.usp .right ul{margin: 0; padding: 0; list-style: none}

.usp .right ul li{width: 49%; margin: 0 2% 20px 0; list-style: none; float: left; background: #FFF; border: 1px solid #d6ddf2; border-radius: 20px; padding: 84px 20px 20px; position: relative; text-align: left; font-size: 18px;}

.usp .right ul li:nth-child(2n+2){margin-right: 0}

.usp .right ul li img{position: absolute; right: 20px; top: 20px}

.usp .right ul li span{font-size: 45px; font-weight: bold; color: #0a91f9; display: block; line-height: 50px}



.usp2 ul{margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap;}

.usp2 ul li{width: 32%; margin: 0 2% 0 0; list-style: none; float: left; background: #FFF; border: 1px solid #d6ddf2; border-radius: 20px; padding: 20px; position: relative; text-align: left; font-size: 18px; min-height: 265px;}

.usp2 ul li:last-child{margin-right: 0}

.usp2 ul li img{position: absolute; right: 20px; top: 20px}

.usp2 ul li:hover img{transform: rotateY(180deg); transition: transform 0.8s; transform-style: preserve-3d;}

.usp2 ul li h4{font-size: 18px; font-weight: bold; margin: 0 0 30px; min-height: 67px; padding-top: 20px}

.usp2 ul li span{font-size: 45px; font-weight: bold; color: #0a91f9; display: block; line-height: 50px}



.case-studies{text-align: center}

.case-studies .orange-btn:hover{background: #000}

.case-studies .star{background: url(https://www.shoutnhike.com/wp-content/uploads/2025/10/review-bg.png) no-repeat center center; background-size: cover; line-height: 37px; display: table; margin: 20px auto 0; padding: 0 80px}

.case-studies .star span{color: #f36100}

.case-studies .swiper-container {width: 100%; height: 650px; margin: 20px auto; padding-bottom: 1px}

.case-studies .swiper-slide {text-align: center; font-size: 18px; background: #f6f8ff; width: 60%; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; border: 1px solid #0a91f9; border-radius: 20px; justify-content: space-between; padding: 30px;}

.case-studies .swiper-slide .left, .case-studies .swiper-slide .right{width: 48%;}

.case-studies .swiper-slide .left img{width: 100%;}

.case-studies .swiper-slide .right{text-align: left;}

.case-studies .swiper-slide .right ul {margin: 0; padding: 0; list-style: none;}

.case-studies .swiper-slide .right ul li {width: 100%; margin-bottom: 20px; list-style: none}

.case-studies .swiper-slide .right .left {width: 60%; font-size: 18px; color: #262626; text-align: left; line-height: 30px;}

.case-studies .swiper-slide .right .left img{width: auto;}

.case-studies .swiper-slide .right .right {width: 40%; font-size: 20px; color: #000; font-weight: 400; text-align: right; line-height: 30px;}

.case-studies .swiper-slide .right .right sm {font-size: 15px; }

.case-studies .swiper-slide .right .process {background: #d4d8e8; height: 15px; width: 100%; clear: both; position: relative; border-radius: 10px;}

.case-studies .swiper-slide .right .process .bar {position: absolute; left: 0; background: #0a91f9; height: 15px; border-radius: 10px;}

.case-studies .swiper-slide .right .blue-btn{margin-right: 10px;}

.case-studies .swiper-slide .right h3{font-size: 35px; font-weight: bold; margin: 0; color: #000}

.case-studies .swiper-slide .right h4{font-size: 25px; font-weight: 400; color: #000}

.case-studies .swiper-slide .right span.tag{background: #FFF; border-radius: 20px; font-weight: bold; margin: 0 0 20px; display: inline-block; line-height: 34px; padding: 0 20px; border: 1px solid #cbd2e9}



.get-audit2{background: url(https://www.shoutnhike.com/wp-content/uploads/2025/10/expert-bg.png) no-repeat center center; background-size: cover;}

.get-audit2 .left{width: 60%;}

.get-audit2 .left .title{color: #FFF}

.get-audit2 .left .title span::after{margin: 0}

.get-audit2 .left .title h2{color: #FFF}

.get-audit2 .right{width: 25%; padding-top: 50px;}

.get-audit2 .right .blue-btn{width: 100%; margin: 0 0 10px; text-align: center}

.get-audit2 .right .star{background: #ffd38e; border-radius: 8px; text-align: center; padding: 15px; width: 100%}

.get-audit2 .right .star span{color: #f36100; display: block}



.free-quote{}

.free-quote .box{background: #f6f8ff; border: 1px solid #0a91f9; border-radius: 20px; padding: 30px;}

.free-quote .box h3{font-size: 40px; font-weight: bold; color: #0c093d}

.free-quote .box h3 span{display: block; font-size: 16px; font-weight: normal}

.free-quote .box h3 img{float: left; margin-right: 10px;}

.free-quote .box .left{width: 68%; padding-right: 30px; border-right: 1px solid #d6ddf2}

.free-quote .box .left .input{border: 1px solid #d6ddf2; border-radius: 8px; padding: 0 10px; width: 100%; margin: 0 0 12px; background: #FFF; height: 50px; height: 50px;}

.free-quote .box .left .input.textarea{height: 120px;}

.free-quote .box .left .star{background: #ffd38e; border-radius: 8px; text-align: center; padding: 5px 15px; width: auto; display: table; float: right;}

.free-quote .box .left .star span{color: #f36100; display: block}

.free-quote .box .left .blue-btn{margin-bottom: 12px; width: 314px}

.free-quote .box .right{width: 30%;}

.free-quote .box .right ul {margin: 0; padding: 0; list-style: none;}

.free-quote .box .right ul li {margin-bottom: 30px; position: relative; padding-left: 67px; list-style: none}

.free-quote .box .right ul li .icon {width: 52px; height: 52px; position: absolute; left: 0; }

.free-quote .box .right h4 {font-size: 20px; font-weight: bold;  margin: 0;  color: #0c093d;}

.free-quote .box .right ul li:first-child h4 {line-height: 52px}

.free-quote .box .right ul li:first-child span {line-height: 38px; margin-bottom: 10px;}

.free-quote .box .right ul li:first-child img {float: left; margin-right: 10px; border-radius: 50%;}

.free-quote .box .right a {color: #000;}

.free-quote .box .right a:hover{color: #999}

.free-quote .box .right span {display: block;}



.our-process{text-align: center}

.our-process ul{list-style: none; margin: 0; padding: 0}

.our-process ul li{list-style: none; width: 23%; margin: 0 2.66% 0 0; border: 1px solid #0a91f9; border-radius: 20px; float: left; padding: 30px; box-shadow: 0 3px 0 #0a91f9; position: relative}

.our-process ul li .count{background: #000; border: 2px solid #0a91f9; border-radius: 50%; text-align: center; line-height: 42px; position: absolute; width: 46px; height: 46px; color: #FFF; font-weight: bold; bottom: -20px; left: 50%; transform: translate(-50%,0%); -webkit-transform: translate(-50%,0%);}

.our-process ul li:last-child{margin-right: 0}

.our-process ul li:nth-child(2n+2){box-shadow: 0 -3px 0 #0a91f9}

.our-process ul li:nth-child(2n+2) .count{top: auto; top: -20px;}

.our-process ul li img{margin: 10px 0}

.our-process ul li:hover img{transform: rotateY(180deg); transition: transform 0.8s; transform-style: preserve-3d;}

.our-process ul li h4{font-size: 20px; color: #000; font-weight: 600; margin: 10px 0}

.our-process ul li h4 span{display: block}



.testimonials{text-align: center; background: #0c093d}

.testimonials h2{color: #FFF; margin: 0 0 60px;}

.testimonials ul{margin: 0; padding: 0}

.testimonials ul li .left{width: 25%;}

.testimonials ul li .right{width: 75%; text-align: left;}

.testimonials ul li .right .star{color: #ff9f07}

.testimonials ul li .right p{font-size: 24px; line-height: 38px; color: #FFF}

.testimonials ul li .right .name{color: #FFF; margin: 0 0 20px;}

.testimonials ul li .right .name span{font-size: 22px; font-weight: 600}

.testimonials ul li .right .tag{background: #0c2463; color: #FFF; line-height: 36px; padding: 0 20px; display: inline-block; border-radius: 30px;}

.testimonials .bx-wrapper{padding: 0 70px; margin: 0}

.testimonials .bx-wrapper .bx-controls-direction a{width: 47px; height: 47px;}

.testimonials .bx-wrapper .bx-prev {left: 0px; background: url('https://www.shoutnhike.com/wp-content/uploads/2025/10/pre.png') no-repeat;}

.testimonials .bx-wrapper .bx-next {right: 0px; background: url('https://www.shoutnhike.com/wp-content/uploads/2025/10/next.png') no-repeat;}



.faq{text-align: center}

.faq #accordion2 {width: 100%; margin: 40px auto 0;}

.faq .accordion2 {width: 100%; color: #333}

.faq .accordion2 .box{margin: 0 0 20px; text-align: left; border: 1px solid #ced6f3; background: #f6f8ff; border-radius: 10px;}

.faq .accordion2 .box h4{font-size: 22px; font-weight: bold; color: #000000; margin: 0 0 10px; text-transform: uppercase}

.faq .accordion2 dt {width: 100%; padding: 16px 56px 16px 16px; cursor: pointer; background-image: url(https://www.shoutnhike.com/wp-content/uploads/2025/10/plus-icon.png); background-position: right 20px center; background-repeat: no-repeat; color: #000; font-size: 18px; font-weight: 600; line-height: 36px;}

.faq .accordion2 dt img{float: left; margin-right: 8px;}

/*.faq .accordion2 dt:hover {background-color: #f0531c}*/

.faq .accordion2 .open {background-image: url(https://www.shoutnhike.com/wp-content/uploads/2025/10/minus-icon.png); color: #333}

.faq .accordion2 .open + dd{height: auto !important}

.faq .accordion2 dd {overflow: hidden; margin: 0}

.faq .accordion2 span {display: block; width: 100%; border-top: none; padding: 0 16px 16px;}

.faq .left, .faq .right{width: 49%;}



.latest-updates{text-align: center}

.latest-updates ul{list-style: none; margin: 0; padding: 0}

.latest-updates ul li{list-style: none; margin: 0 2% 0 0; float: left; width: 32%; text-align: left; background: #f6f8ff; border: 1px solid #e2e8fb; padding: 30px; border-radius: 20px;}

.latest-updates ul li:last-child{margin-right: 0}

.latest-updates ul li img{margin-bottom: 20px; width: 100%;}

.latest-updates ul li .tag{font-size: 14px; color: #0a91f9; background: #FFF; display: inline-block; line-height: 26px; padding: 0 8px; margin-right: 5px;}

.latest-updates ul li h4{font-size: 22px; font-weight: 600; color: #0c093d; line-height: 30px; border-bottom: 1px solid #babacb; padding-bottom: 20px; margin: 10px 0 20px;}

.latest-updates ul li .date{float: left; font-size: 14px; color: #7e7d97; line-height: 50px;}

.latest-updates ul li .blue-btn{float: right; border: 1px solid #0a91f9; background: #FFF; color: #0a91f9}

.latest-updates ul li:hover .blue-btn{background: #0a91f9; color: #FFF}

.latest-updates ul li:hover{border: 1px solid #0a91f9; box-shadow: 0 4px 0 #0a91f9}



.certificate{background: #f6f8ff; text-align: center}

.certificate h3{color: #0c093d; font-size: 26px; margin: 0 0 20px; font-weight: 600; line-height: 32px; position: relative;}

.certificate h3:after{position: absolute; bottom: -4px; left: 0; right: 0; margin: 0 auto; content: ''; background: #0a91f9; height: 2px; width: 50px;}

.certificate .left, .certificate .right{width: 48%;}

.certificate .left ul{list-style: none; margin: 0; padding: 0; text-align: center}

.certificate .left ul li{list-style: none; display: inline-block; margin: 0 10px;}

.certificate .left ul li img{max-width: 100%;}

.certificate .right img{width: 100%; border-radius: 20px;}

.certificate .right img:hover{box-shadow: 0 0 10px rgba(0,0,0,0.2)}



/** 4.0 - Footer **/

footer{background: #06032a}

footer .footer1{padding: 60px 0}

footer .footer1 h4{font-size: 20px; font-weight: 700; margin: 0 0 20px; color: var(--am-base); position: relative}

footer .footer1 h4:after{position: absolute; bottom: -9px; left: 0; margin: 0; content: ''; background: #0a91f9; height: 2px; width: 50px;}

footer .footer1 .links ul{margin: 0 ; padding: 0; list-style: none;}

footer .footer1 .links ul li{line-height: 40px; font-size: 16px; list-style: none; position: relative; margin: 0; padding-left: 26px;}

footer .footer1 .links ul li::before {content: ""; background: url(https://www.shoutnhike.com/wp-content/uploads/2025/10/white-dot.png) no-repeat center center; width: 12px; height: 12px; position: absolute; left: 0; top: 16px}

footer .footer1 .links ul li a{color: #FFF;}

footer .footer1 .links ul li a:hover{color: #CCC}



footer .footer3{padding: 60px 0; background: #0c093d}

footer .footer3 h4{font-size: 20px; font-weight: 700; margin: 0 0 20px; color: #FFF; text-transform: uppercase; line-height: 30px;}

footer .footer3 h4 img{float: left; margin-right: 10px;}

footer .footer3 .address{color: #FFF; min-height: 78px; margin: 0 0 20px;}

footer .footer3 p{margin: 0 0 10px; color: #0a91f9}

footer .footer3 p span{color: #625f96}

footer .footer3 p a{color: #FFF}

footer .footer3 p i{color: #0a91f9}

footer .footer3 p a:hover{color: #CCC}



footer .footer2{background: #0c093d; padding: 20px 0}

footer .footer2 .container{display: flex; justify-content: space-between;}

footer .footer2 .left{color: #FFF; line-height: 40px; font-size: 14px;}

footer .footer2 .center{color: #FFF; line-height: 40px; font-size: 14px; float: left; width: 60%; text-align: center}

footer .footer2 .center a{color: #FFF}

footer .footer2 .center a:hover{color: #CCC}

footer .footer2 .right{float: right}

footer .footer2 .right ul{margin: 0; padding: 0; list-style: none;}

footer .footer2 .right ul li{width: 40px; height: 40px; line-height: 40px; text-align: center; border: 1px solid #3d3a64; border-radius: 50%; float: left; margin: 0 0 0 5px; list-style: none;}

footer .footer2 .right ul li:hover{background: #CCCCCC;}

footer .footer2 .right ul li a{display: block; color: #b9b5b7;}

footer .footer2 .right ul li:hover a{color: #000000}



/* */

.ban-in{position: relative; background: #0c093d}

.ban-in .ban-text{text-align: center; margin: 0 auto; color: var(--am-base); font-size: 16px; z-index: 1; width: 1320px; padding: 0; display: flex; align-items: center; gap: 4%; flex-wrap: wrap;}

.ban-in .ban-text .left, .ban-in .ban-text .right{width: 48%}

.ban-in .ban-text .left{text-align: left; color: #FFF}

.ban-in .ban-text .left h1{font-size: 44px; line-height: 62px; margin: 0 0 20px; font-weight: bold; color: #FFF}

.ban-in .ban-text .left h1 span{display: block;}

.ban-in .ban-text .left .orange-btn{position: relative; padding-left: 100px; margin: 8px 0 30px}

.ban-in .ban-text .left .orange-btn img{position: absolute; left: 20px; top: -10px;}

.ban-in .ban-text .left .offer{color: #48c969; font-size: 16px;}

.ban-in .ban-text .left .offer span{border: 1px solid #48c969; padding: 8px 15px; border-radius: 30px;}

.ban-in .ban-text .right img{width: 100%;}



.welcome-seo{}

.welcome-seo .container{display: flex; align-items: center; justify-content: space-between;}

.welcome-seo .left, .welcome-seo .right{width: 48%;}

.welcome-seo .left h2 span{color: #0a91f9}

.welcome-seo .right img{width: 100%;}

.welcome-seo .orange-btn:hover {background: #000;}



.seo-services{text-align: center}

.seo-services .box{width: 49%; margin: 0 2% 30px 0; float: left; padding: 40px; border-radius: 20px; text-align: left; position: relative; padding-left: 150px;}

.seo-services .box:nth-child(2n+2){margin-right: 0}

.seo-services .box img{position: absolute; left: 40px; top: 40px;}

.seo-services .box:hover img{transform: rotateY(180deg); transition: transform 0.8s; transform-style: preserve-3d;}

.seo-services .box span{display: block}

.seo-services .box h3{font-size: 24px; font-weight: 700; color: #0c093d}



.seo-packages{text-align: center}

.seo-packages .title{margin: 0 0 30px;}

.seo-packages .package-box{margin: 0 0 40px;}

.seo-packages .table {border-collapse: collapse; margin: 0; width: 100%; border: 1px solid #46afff; border-bottom: 1.5px solid #46afff;}

.seo-packages .table th {background: #002f92; border: 1px solid #46afff; font-weight: normal; padding: 13px 8px; color: var(--am-base); text-align: left; width: 25%;}

.seo-packages .table th.feature{background: #FFF; font-size: 25px; color: #0c093d; font-weight: bold;}

.seo-packages .table th.silver{background-image: linear-gradient(to right, #d3ecfd , #f2faff); font-size: 25px; color: #1c98f1; font-weight: bold;}

.seo-packages .table th.gold{background-image: linear-gradient(to right, #f5e6ce , #f8f4ed); font-size: 25px; color: #dc921b; font-weight: bold;}

.seo-packages .table th.dedicated{background-image: linear-gradient(to right, #eed8f7 , #faf3ff); font-size: 25px; color: #9f40cb; font-weight: bold;}

.seo-packages .table td {background: #f3f3f3; border-bottom: 1px solid #eeeeee; padding: 8px; text-align: left; border-left: 1px solid #46afff; border-bottom}

.seo-packages .table td.feature{background: #FFF;}

.seo-packages .table td.silver{background: #f2faff;}

.seo-packages .table td.gold{background: #f8f4ed;}

.seo-packages .table td.dedicated{background: #faf3ff;}

.seo-packages .table td.silver .orange-btn{background: #1c98f1; margin: 20px auto; display: block; text-align: center}

.seo-packages .table td.silver .orange-btn:hover{background: #000;}

.seo-packages .table td.gold .orange-btn{background: #dc921b; margin: 20px auto; display: block; text-align: center}

.seo-packages .table td.gold .orange-btn:hover{background: #000;}

.seo-packages .table td.dedicated .orange-btn{background: #9f40cb; margin: 20px auto; display: block; text-align: center}

.seo-packages .table td.dedicated .orange-btn:hover{background: #000;}

.seo-packages .orange-btn:hover{background: #000}

.seo-packages .star{background: url(https://www.shoutnhike.com/wp-content/uploads/2025/10/review-bg.png) no-repeat center center; background-size: cover; line-height: 37px; display: table; margin: 20px auto 0; padding: 0 80px}

.seo-packages .star span{color: #f36100}



.roi-with{background: #fef0ea}

.roi-with .box{display: flex; align-items: center; justify-content: center;}

.roi-with .text{margin-left: 20px;}

.roi-with img{border-radius: 50%;}

.roi-with h4{font-size: 14px; text-transform: uppercase; color: #0a91f9; font-weight: 600; position: relative; margin: 0 0 10px; display: inline-block; min-width: 100px;}

.roi-with h4:after {position: absolute; bottom: -4px; left: 0; right: 0; content: ''; background: #0a91f9; height: 2px; width: 50px;}

.roi-with h2{margin: 0}

.roi-with h3{color: #0c093d; font-size: 30px; margin: 0 0 20px; font-weight: 600; line-height: 42px;}

.roi-with .blue-btn{margin-right: 10px}



.case-study-list{text-align: center}

.case-study-list .btn {background: #daeffe; border-radius: 30px; color: #000; padding: 5px 20px; text-decoration: none; margin: 5px; font-size: 16px; font-weight: bold}

.case-study-list .active {background: #0a91f9; text-decoration: none; color: #FFF}



.case-study-list ul{list-style: none; margin: 30px 0; padding: 0;}

.case-study-list ul li{list-style: none; margin: 0 4% 30px 0; float: left; width: 48%; position: relative; overflow: hidden}

.case-study-list ul li:nth-child(2n+2){margin-right: 0}

.case-study-list ul li img{width: 100%;}

.case-study-list ul li .text{position: absolute; left: 0; bottom: 0; background: rgba(0,0,0,0.7); width: 100%; height: 0; border-radius: 20px; padding: 50px; transition: all .2s ease-in-out; visibility: hidden}

.case-study-list ul li:hover .text{height: 100%; visibility: visible}

.case-study-list ul li .text h4{color: #FFF; text-transform: uppercase; font-size: 16px; margin: 0; text-align: left}

.case-study-list ul li .text h3{color: #FFF; font-size: 24px; font-weight: bold; text-align: left;}

.case-study-list ul li .text .view{position: absolute; right: 50px; top: 40px; width: auto;}

.case-study-list ul li ul {margin: 0; padding: 0; list-style: none;}

.case-study-list ul li ul li {width: 100%; margin-bottom: 20px; list-style: none}

.case-study-list ul li .left img{width: auto;}

.case-study-list ul li .left {width: 70%; font-size: 16px; color: #3fe58d; text-align: left; line-height: 30px; text-transform: uppercase}

.case-study-list ul li .left img{width: auto;}

.case-study-list ul li .right {width: 30%; font-size: 22px; color: #FFF; font-weight: 400; text-align: right; line-height: 30px;}

.case-study-list ul li .right sm {font-size: 15px; }

.case-study-list ul li .process {background: #ffffff; height: 10px; width: 100%; clear: both; position: relative; border-radius: 10px;}

.case-study-list ul li .process .bar {position: absolute; left: 0; background: #0a91f9; height: 10px; border-radius: 10px;}



.paginatation{text-align: center}

.paginatation a{width: 32px; height: 32px; border-radius: 50%; color: #000; display: inline-block; line-height: 32px; background: #e4eff8}

.paginatation a:hover, .paginatation a.active{background: #0a91f9; color: #FFF}



.ban-in .ban-text .left .back{color: #747c9e}

.ban-in .ban-text .left .back:hover{color: #FFF}



.case-study-detail h4{font-size: 22px; color: #000000; line-height: 36px;}

.case-study-detail h4 span{color: #f36e30}



.case-study-detail h3{color: #0a91f9; font-size: 35px; line-height: 40px; font-weight: bold; margin: 0 0 20px;}

.case-study-detail .h4{font-size: 25px; font-weight: bold; color: #0c093d; margin: 0 0 20px;}

.case-study-detail .img{padding: 15px; border: 1px solid #b5defd; border-radius: 10px; margin: 0 0 20px; max-width: 100%;}

.case-study-detail ul{list-style: none; margin: 0 0 20px; padding: 0}

.case-study-detail ul li{list-style: none; margin: 0}



@-webkit-keyframes rotating /* Safari and Chrome */ {

  from {

    -webkit-transform: rotate(0deg);

    -o-transform: rotate(0deg);

    transform: rotate(0deg);

  }

  to {

    -webkit-transform: rotate(360deg);

    -o-transform: rotate(360deg);

    transform: rotate(360deg);

  }

}

@keyframes rotating {

  from {

    -ms-transform: rotate(0deg);

    -moz-transform: rotate(0deg);

    -webkit-transform: rotate(0deg);

    -o-transform: rotate(0deg);

    transform: rotate(0deg);

  }

  to {

    -ms-transform: rotate(360deg);

    -moz-transform: rotate(360deg);

    -webkit-transform: rotate(360deg);

    -o-transform: rotate(360deg);

    transform: rotate(360deg);

  }

}

.rotating {

  -webkit-animation: rotating 5s linear infinite;

  -moz-animation: rotating 5s linear infinite;

  -ms-animation: rotating 5s linear infinite;

  -o-animation: rotating 5s linear infinite;

  animation: rotating 5s linear infinite;

}



@keyframes lineAnim {

    0% {

        left: -40%;

    }

    50% {

        left: 20%;

        width: 80%;

    }

    100% {

        left: 100%;

        width: 100%;

    }

}



.marquee {margin: 0 -30px;}

.marquee-box-one {overflow: hidden; position: relative; display: flex; align-items: center; margin: 20px 0 0;}

.marquee-content-one {display: flex; gap: 40px; padding: 0 20px; animation: scroll-one 30s linear infinite;}

.marquee-box-two {overflow: hidden; position: relative; display: flex; align-items: center; margin: 20px 0 70px 0;}

.marquee-content-two {display: flex; gap: 40px; padding: 0 20px; animation: scroll-two 30s linear infinite;}

.marquee-text {white-space: nowrap; flex-shrink: 0; margin: 0; display: flex; align-items: center; user-select: none;}

.marquee-text:hover {background-color: #31393F; border: 1px solid #31393F;}



@keyframes scroll-one {

    0% { transform: translateX(0); }

    100% { transform: translateX(-100%); }

}

@keyframes scroll-two {

    0% { transform: translateX(-100%); }

    100% { transform: translateX(0); }

}



/*.c-button--marquee {

  color: transparent !important;

  position: relative;

  overflow: hidden;

}*/

/*.c-button--marquee:hover:before{color: #000 !important}*/

/*.c-button--marquee:before {

  content: attr(data-marquee);

  color: #fff;

  position: absolute;

  animation: scrolling 5s linear infinite; background: url(../images/right-arrow.png) no-repeat center right; padding-right: 30px;

}*/

@keyframes scrolling {

  from {

    transform: translatex(calc(100% + 30px));

  }

  to {

    transform: translatex(calc(-100% - 30px));

  }

}



/* About us*/

.aboutus{border-bottom: 1px solid #CCC}

.aboutus .left, .aboutus .right{width: 48%;}

.aboutus .left .head{position: relative; padding-left: 40px; margin: 0 0 60px;}

.aboutus .left .head span{font-size: 17px; font-weight: 600; color: #0a91f9; transform: rotate(-90deg); display: inline-block; border-bottom: 3px solid #0a91f9; position: absolute; left: -30px; top: 40px; text-transform: uppercase}

.aboutus .left .prifile{display: flex; gap: 20px; flex-wrap: wrap; justify-content: space-between; margin: 0 0 60px;}

.aboutus .left .prifile img{border-radius: 20px;}

.aboutus .left .prifile .text{width: 64%}

.aboutus .left .prifile .text .name{font-size: 18px; font-weight: bold; color: #0c093d;}

.aboutus .left .prifile .text .name span{font-size: 16px; font-weight: 400; color: #0a91f9; display: block}

.aboutus .left ul{list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap;  gap: 4%;}

.aboutus .left ul li{list-style: none; margin: 0; font-size: 18px; font-weight: 600; display: block; color: #000000; border-bottom: 2px solid #b5defd; width: 48%; padding-bottom: 10px; position: relative}

.aboutus .left ul li:before{width: 50px; height: 2px; background: #0a91f9; position: absolute; left: 0; bottom: -2px; content: '';}

.aboutus .left ul li span{font-size: 40px; font-weight: bold; display: block; color: #000000; line-height: 44px;}

.aboutus .right img{width: 100%}



.meet-team{text-align: center; border-bottom: 1px solid #CCC}

.meet-team .lead{font-weight: 600; font-style: italic;}

.meet-team ul{list-style: none; margin: 0; padding: 0;}

.meet-team ul li{list-style: none; margin: 0 30px 0 0; width: 301.5px !important;}

.meet-team ul li img{width: 100%;}

.meet-team ul li .text{background: #e8ecf7; border-radius: 0 0 50px 20px; margin-top: -20px; padding: 30px 20px 20px; text-align: left; width: 90%;}

.meet-team ul li .text h4{font-size: 22px; font-weight: bold; color: #0c093d; margin: 0}

.meet-team ul li .text span{font-size: 15px; color: #0c093d}

.meet-team ul li:hover .text{background: #0c093d}

.meet-team ul li:hover .text h4{color: #FFF}

.meet-team ul li:hover .text span{color: #FFF}

.meet-team .bx-wrapper{margin-bottom: 0}

.meet-team .bx-wrapper .bx-controls-direction a{width: 47px; height: 47px;}

.meet-team .bx-wrapper .bx-prev {left: -55px; background: url('https://www.shoutnhike.com/wp-content/uploads/2025/10/pre2.png') no-repeat;}

.meet-team .bx-wrapper .bx-next {right: -55px; background: url('https://www.shoutnhike.com/wp-content/uploads/2025/10/next2.png') no-repeat;}



.vision-mission{text-align: center; border-bottom: 1px solid #CCC}

.vision-mission ul{list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap;}

.vision-mission ul li{list-style: none; margin: 0 2% 0 0; float: left; width: 32%; background: #f6f8ff; border-bottom: 5px solid #0a91f9; border-radius: 20px; padding: 40px; text-align: center; font-size: 20px; line-height: 30px;}

.vision-mission ul li:first-child{border-radius: 180px 20px 20px 20px}

.vision-mission ul li:last-child{border-radius: 20px 180px 20px 20px}

.vision-mission ul li:last-child{margin-right: 0}

.vision-mission ul li img{margin: 0 auto 20px}

.vision-mission ul li img.normal{display: block}

.vision-mission ul li img.hover{display: none}

.vision-mission ul li h3{font-size: 66px; font-weight: bold; color: #0a91f9; text-transform: uppercase; margin: 0}

.vision-mission ul li:hover{color: #FFF; background: #0a91f9; border-bottom: 5px solid #000}

.vision-mission ul li:hover img.normal{display: none}

.vision-mission ul li:hover img.hover{display: block}

.vision-mission ul li:hover h3{color: #FFF}



.our-skill{}

.our-skill .title{margin: 0 0 20px;}

.our-skill .title span:after{margin: 0}

.our-skill .left, .our-skill .right{width: 48%;}

.our-skill .left ul{list-style: none; margin: 0; padding: 0;}

.our-skill .left ul li{list-style: none; width: 48%; margin: 0 4% 30px 0; position: relative; padding-left: 70px; float: left;}

.our-skill .left ul li:nth-child(2n+2){margin-right: 0}

.our-skill .left ul li .number{background: #0a91f9; border-radius: 10px; text-align: center; color: #FFF; width: 62px; height: 62px; line-height: 62px; position: absolute; left: 0; top: 0}

.our-skill .left ul li h4{font-size: 16px; font-weight: 600; color: #000000; margin: 20px 0 0}

.our-skill .left ul li span{background: #0c093d; height: 8px; width: 100%; border-radius: 20px; display: inline-block; position: relative}

.our-skill .left ul li span span{background: #0a91f9; position: absolute; left: 0; top: 0}

.our-skill .right img{width: 100%;}



.contact-ban .ban-text .left p span{background: #ffffff; border-radius: 10px; color: #000; padding: 0 10px; line-height: 30px; display: inline-block;}

.contact-ban .ban-text .left p span strong{background: #fffc00; display: inline-block; padding: 0 5px;}

.contact-ban .ban-text .right{padding: 40px 0}

.contact-ban .ban-text .right ul{list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4%;}

.contact-ban .ban-text .right ul li{width: 48%; margin: 0; list-style: none; border-bottom: 3px solid #FFF; font-size: 18px; font-weight: 500; color: #FFF; text-align: left; padding-bottom: 12px; margin-bottom: 20px; }

.contact-ban .ban-text .right ul li img{width: auto}

.contact-ban .ban-text .right ul li span{font-size: 40px; font-weight: bold; display: block; line-height: 42px;}

.contact-ban .ban-text .right ul li span.yellow{color: #eecd14}

.contact-ban .ban-text .right ul li span.blue{color: #577dcb}

.contact-ban .ban-text .right ul li span.pink{color: #ff729a}

.contact-ban .ban-text .right ul li span.green{color: #4ae54d}



.contactus{background: #0c093d}

.global-presence{background: #0c093d; text-align: center}

.global-presence h2{color: #FFF}

.global-presence ul{list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 2.66%; }

.global-presence ul li{ width: 23%; list-style: none; margin: 0; position: relative; overflow: hidden}

.global-presence ul li img{width: 100%; border: 1px solid #FFF; border-radius: 20px;}

.global-presence ul li .text{position: absolute; bottom: 0; left: 0; padding: 0 20px; height: 50px;}

.global-presence ul li .text img{display: none; width: auto; margin: 0 auto 10px;}

.global-presence ul li .text h4{background: rgba(0,0,0,0.7); width: 100%; border-radius: 10px; color: #FFF; font-size: 20px; text-transform: uppercase; font-weight: bold; line-height: 40px; margin: 0 0 20px;}

.global-presence ul li .text p{color: #FFF}

.global-presence ul li:hover .text{top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); bottom: auto; width: 90%; height: auto}

.global-presence ul li:hover .text h4{background: transparent; margin: 0 0 10px;}

.global-presence ul li:hover img{opacity: 0.5}

.global-presence ul li:hover .text img{display: block; opacity: 1}

.map{padding: 0 !important}

.map img{width: 100%}

.blog-ban .ban-search{border-bottom: 1px solid rgba(255,255,255,0.4); width: 100%; top: 90px; position: relative; z-index: 1}

.blog-ban .ban-search h2{font-size: 45px; font-weight: bold; line-height: 48px; color: #FFF}

.blog-ban .ban-search h2 span{color: #94d0ff}

.blog-ban .ban-search form{position: relative}

.blog-ban .ban-search form .input{width: 100%; height: 50px; line-height: 50px; padding: 0 10px; background: #FFF; border-radius: 15px; }

.blog-ban .ban-search form .submit{background: url(https://www.shoutnhike.com/wp-content/uploads/2025/10/search-btn-1.png) no-repeat center center; width: 42px; height: 42px; border: none; position: absolute; right: 4px; top: 4px;}

.blog-ban .date{font-size: 16px; font-weight: 400; color: #a19fbd; margin: 0 0 20px;}

.blog-ban .read-more{color: #0a91f9; font-size: 14px; text-transform: uppercase; font-weight: 600}

.ban-in.blog-ban .ban-text .left h1 {font-size: 36px; line-height: 56px;}



.blog-free-quote{background: #f6f8ff; border-bottom: 1px solid #c5d8e7; padding: 40px 0 !important}

.blog-free-quote form{display: flex; justify-content: space-around; flex-wrap: wrap; align-items: center;}

.blog-free-quote form h3{margin: 0; font-size: 25px; line-height: 32px; color: #0c093d; font-weight: bold}

.blog-free-quote form .input{border: 1px solid #d6ddf2; line-height: 60px; height: 60px; padding: 0 15px; border-radius: 15px; width: 290px;}

.blog-free-quote form .input:focus{border: 1px solid #0a91f9; color: #0a91f9}

.blog-free-quote form .submit{border: none; line-height: 60px; height: 60px; padding: 0 20px; border-radius: 15px; background: #0a91f9; font-size: 16px; color: #FFF; text-transform: uppercase; font-weight: 600; text-align: center; width: 140px;}

.blog-free-quote form .submit:hover{background: #000}



.blog-recent-articles h2{border-bottom: 1px solid #181a22}

.blog-recent-articles .tab{margin: 0 0 30px; display: flex; gap: 20px; flex-wrap: wrap;}

.blog-recent-articles .tab a{background: #f6f8ff; border: 1px solid #ced6f3; border-radius: 10px; padding: 0 20px; display: inline-block; line-height: 50px;}

.blog-recent-articles .tab a:hover, .blog-recent-articles .tab a.active{background: #0a91f9; border: 1px solid #0a91f9; color: #FFF}

/*.blog-recent-articles ul{list-style: none; margin: 0; padding: 0}*/
.blog-recent-articles ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 2%;
}
.blog-recent-articles ul li{list-style: none; margin: 0 0 20px; float: left; width: 32%; text-align: left; background: #f6f8ff; border: 1px solid #e2e8fb; padding: 30px; border-radius: 20px;}

.blog-recent-articles ul li:nth-child(3n+3){margin-right: 0}

.blog-recent-articles ul li img{margin-bottom: 20px; width: 100%;}

.blog-recent-articles ul li .tag{font-size: 14px; color: #0a91f9; background: #FFF; display: inline-block; line-height: 26px; padding: 0 8px; margin-right: 5px;}

.blog-recent-articles ul li h4{font-size: 22px; font-weight: 600; color: #0c093d; line-height: 30px; border-bottom: 1px solid #babacb; padding-bottom: 20px; margin: 10px 0 20px;}

.blog-recent-articles ul li .date{float: left; font-size: 14px; color: #7e7d97; line-height: 50px;}

.blog-recent-articles ul li .blue-btn{float: right; border: 1px solid #0a91f9; background: #FFF; color: #0a91f9}

.blog-recent-articles ul li:hover .blue-btn{background: #0a91f9; color: #FFF}

.blog-recent-articles ul li:hover{border: 1px solid #0a91f9; box-shadow: 0 4px 0 #0a91f9}



.blog-recent-articles .pagination{margin: 20px 0 0; justify-content: center; gap: 10px;}

.blog-recent-articles .pagination a{background: #f6f8ff; border: 1px solid #e2e8fb; color: #000; display: inline-block; padding: 0 12px; line-height: 32px; border-radius: 10px;}

.blog-recent-articles .pagination a:hover, .blog-recent-articles .pagination a.active{background: #0a91f9; border: 1px solid #0a91f9; color: #FFF}





.blog-detail-ban .ban-search{border-bottom: 1px solid rgba(255,255,255,0.4); width: 100%; position: relative; z-index: 1; margin: 30px 0}

.blog-detail-ban .ban-search h2{font-size: 45px; font-weight: bold; line-height: 48px; color: #FFF}

.blog-detail-ban .ban-search h2 span{color: #94d0ff}

.blog-detail-ban .ban-search form{position: relative}

.blog-detail-ban .ban-search form .input{width: 100%; height: 50px; line-height: 50px; padding: 0 10px; background: #FFF; border-radius: 15px; }

.blog-detail-ban .ban-search form .submit{background: url(https://www.shoutnhike.com/wp-content/uploads/2025/10/search-btn-1.png) no-repeat center center; width: 42px; height: 42px; border: none; position: absolute; right: 4px; top: 4px;}

.blog-detail-ban .ban-text{text-align: left; padding:40px 0 200px;}

.blog-detail-ban .ban-text h1 {font-size: 44px; line-height: 62px; margin: 0 0 20px; font-weight: bold; color: #FFF;}

.blog-detail-ban .ban-text h1 span {display: block;}

.blog-detail-ban .ban-text .author{display: flex; flex-wrap: wrap; align-items: center; gap: 20px;}

.blog-detail-ban .ban-text .author img{border-radius: 50%;}

.blog-detail-ban .ban-text .author h3{font-size: 22px; font-weight: 600; line-height: 28px; color: #FFF; margin: 0}

.blog-detail-ban .ban-text .author h3 span{font-size: 15px; font-weight: 400; display: block}

.blog-detail-ban .ban-text .date{border-left: 1px solid #FFF; font-size: 16px; line-height: 32px; color: #FFF; padding-left: 20px; margin-left: 20px;}

.blog-detail-ban .ban-text .date span{color: #a19fbd; display: block}



.blog-detail .img{width: 100%; position: relative; margin: -240px 0 40px;}

.blog-detail .img img{width: 100%; border-radius: 28px;}

.blog-detail .left{width: 28%;}

.blog-detail .left .box{background: #f6f8ff; border: 1px solid #0a91f9; border-radius: 20px;}

.blog-detail .left .box h3{font-size: 25px; line-height: 32px; color: #0c093d; font-weight: bold; margin: 0 0 10px; border-bottom: 1px solid #0a91f9; padding: 20px;}

.blog-detail .left .box ul{list-style: none; margin: 0; padding: 20px}

.blog-detail .left .box ul li{list-style: none; margin: 0 0 20px;}

.blog-detail .left .box ul li:last-child{margin-bottom: 0}

.blog-detail .left .box ul li ul{padding-bottom: 0}

.blog-detail .left .box ul li a:hover, .blog-detail .left .box ul li a.active{color: #0a91f9}

.blog-detail .right{width: 70%;}

.blog-detail .right h3{font-size: 30px; font-weight: bold; color: #0c093d}

.blog-detail .right .number{margin: 0 0 20px 0; padding: 0; counter-reset: item; list-style: none;}

.blog-detail .right .number li{}

.blog-detail .right .number li:before {content: counter(item) ". "; counter-increment: item; color: #0a91f9; font-weight: bold}



.blog-detail .right .blog-img{margin: 0 0 20px;}

.blog-detail .right .blog-img img{width: 100%; border-radius: 12px;}

.blog-detail .right .text{padding-left: 30px;}

.blog-detail .right .text h4{font-size: 25px; font-weight: bold; color: #0c093d; line-height: 50px;}

.blog-detail .right .text h4 span{color: #6cbdfb}

.blog-detail .right .text h5{font-size: 20px; font-weight: bold; color: #0c093d; line-height: 36px; margin: 0}

.blog-detail .right .acton{margin: 0 0 20px; background: url(https://www.shoutnhike.com/wp-content/uploads/2025/10/action-bg.png) no-repeat center center; background-size: cover; padding: 20px; border-radius: 12px; display: flex; align-items: center; flex-wrap: wrap;     justify-content: space-between;}

.blog-detail .right .acton h3{color: #FFF; width: 50%; font-size: 24px; line-height: 40px;}

.blog-detail .right .acton .btn-group{display: block;  text-align: center}

.blog-detail .right .acton .btn-group a{display: block; margin: 5px 0;}

.blog-detail .right .share{margin: 0;}

.blog-detail .right .share span{float: left; line-height: 50px; margin-right: 20px; font-size: 17px; color: #000; font-weight: bold}

.blog-detail .right .share ul{margin: 0; padding: 0; list-style: none}

.blog-detail .right .share ul li{list-style: none; margin: 0; float: left; width: 40px; height: 40px; text-align: center; line-height: 40px; border-radius: 50%; font-size: 20px; margin-right: 10px; border: 1px solid #a7a7a7}

.blog-detail .right.share ul li a{color: #FFFFFF}

.blog-detail .right .share ul li:hover{background: #f9f9f9}

.blog-detail .right .authore{background: #e6f4fe; padding: 20px; border-radius: 12px; position: relative; padding-left: 140px; text-align: left; margin: 0 0 20px;}

.blog-detail .right .authore img{position: absolute; left: 20px; top: 20px; border: 2px solid #0a91f9; border-radius: 50%; }

.blog-detail .right .authore h5{font-size: 14px; color: #000; margin: 0 0 20px; font-weight: normal;}

.blog-detail .right .authore h4{font-size: 25px; color: #0a91f9; margin: 0; font-weight: bold; line-height: 30px;}



.common-inner{}

.common-inner .contactus, .common-inner .navbar-inverse, .common-inner .ban-in{background: transparent}

.common-inner .common-ban {background: url(https://www.shoutnhike.com/wp-content/uploads/2025/10/life-at-shoutnhike-ban.png) no-repeat center top; min-height: 714px; position: relative; margin-top: -118px; background-size: cover;}

.common-inner .common-ban .ban-text{display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);}

.common-inner .common-ban .ban-text .orange-btn {position: relative; padding-left: 100px; margin: 8px 0 30px;}

.common-inner .common-ban .ban-text .orange-btn img {position: absolute; left: 20px; top: -10px;}

.common-inner .common-ban .ban-text h1 {font-size: 44px; line-height: 62px; margin: 0 0 20px; font-weight: bold; color: #FFF;}



.current-openings{text-align: center}

.current-openings ul{list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4%;}

.current-openings ul li{list-style: none; margin: 0 0 40px; width: 48%; border: 1px solid #c7e7ff; background: #f4faff; border-radius: 20px; padding: 30px; text-align: left;}

.current-openings ul li h4{font-size: 25px; line-height: 33px; color: #0c093d; font-weight: bold; border-bottom: 2px solid #0a91f9; padding-bottom: 15px;}

.current-openings ul li span{display: block}

.current-openings ul li span i{color: #0a91f9}



.why-choose2{background: #FFF}

.why-choose2 .usp .left{background: url(https://www.shoutnhike.com/wp-content/uploads/2025/11/passionate-team.jpg) no-repeat center center; padding: 0; position: relative}

.why-choose2 .usp .left .text{background: rgba(10,145,249,0.9); position: absolute; left: 0; bottom: 0; width: 100%; border-radius: 0 0 20px 20px; padding: 20px; font-size: 18px; color: #FFF; padding: 30px; text-align: left;}

.why-choose2 .usp .left .text span{color: #FFF}



.work-with{background: #f6f8ff}

.work-with .left{width: 65%;}

.work-with .right{width: 30%;}

.work-with .right img{width: 100%;}



.photo-gallery{text-align: center}

.photo-gallery ul{list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 2%;}

.photo-gallery ul li{list-style: none; margin: 0 0 30px; width: 32%}

.photo-gallery ul li img{width: 100%; border-radius: 20px;}



.perks-benefits{text-align: center}

.perks-benefits ul{list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: space-between;}

.perks-benefits ul li{list-style: none; margin: 0; border-left: 1px solid #d6ddf2; text-align: left; padding-left: 20px;}

.perks-benefits ul li:first-child{padding-left: 0; border: none}

.perks-benefits ul li img{margin: 0 0 20px;}

.perks-benefits ul li h4{font-size: 18px; font-weight: bold; color: #000000; margin: 0}





/*web*/

.web-portfolio{text-align: center}

.web-portfolio .title{margin: 0}

.web-portfolio .pagination{justify-content: center; gap: 10px; margin: 30px 0 0}

.web-portfolio .pagination a{background: #e4eff8;  display: inline-block; padding: 0 14px; line-height: 32px; border-radius: 10px; text-transform: uppercase}

.web-portfolio .pagination a:hover, .web-portfolio .pagination a.active{background: #0a91f9; color: #FFF}



.gallery-wrap,

#gallery {

  overflow: hidden;

}



#filters {

  margin: 1%;

  padding: 0;

  list-style: none;

  overflow: hidden; text-align: center; display: flex; justify-content: center; gap: 20px;

}

#filters li{list-style: none; margin: 0}

.inside h4{margin: 20px 0 0; font-weight: bold;     clear: both;

    display: inline-block;}



#filters li span {

  display: block;

  padding: 5px 20px;

  text-decoration: none;

  color: #000;

  cursor: pointer;

  text-transform: uppercase;

  transition: all ease-in-out 0.25s; background: #daeffe; border-radius: 30px; margin: 0

}

#filters li span:after{display: none}

#filters li:hover span {

  color: #000;

}



#filters li span.active {

  background: #0a91f9;

  color: #fff;

}



.gallery-item {

  float: left;

  width: 50%;

  padding: 10px;

  position: relative;

  z-index: 10;

  display: none;

}



.inside {

  position: relative;

  overflow: hidden;

  width: 100%;

  height: 100%;

}



.details,

.overlay {

  position: absolute;

  top: 0;

  left: 0;

  bottom: 0;

  right: 0;

  opacity: 0;

}



.details {

  display: flex;

  align-items: center;

  justify-content: center;

  z-index: 2;

  transition: all 0.3s ease-in-out;

}

.details h2 {

  color: #fff;

  font-size: 1.5em;

  font-weight: 700;

  letter-spacing: 1px;

  text-align: center;

  margin: 0;

}

.details p {

  color: #fff;

  font-size: 1em;

  letter-spacing: 2px;

  text-align: center;

  margin: 0;

  text-transform: uppercase;

}



.inside img {

  float: left;

  width: 100%;

}

.inside .details img{float: none; width: auto}



.overlay {

  background: rgba(4, 76, 196, 0.6);

  z-index: 1;

  transition: all 0.7s ease-in-out;     border-radius: 20px;

    height: calc(100% - 40px);

}



.gallery-item:hover .details,

.gallery-item:hover .overlay {

  opacity: 1;

}



@media (max-width: 30em) {

  .wrap {

    padding-left: 1em;

    padding-right: 1em;

  }



  .gallery-item {

    float: none;

    width: 100%;

  }

}



.social-portfolio{text-align: center}

.social-portfolio .title{margin: 0 auto; max-width: 900px}

.social-portfolio .title .lead{padding: 0}

.social-portfolio .pagination{justify-content: center; gap: 10px; margin: 30px 0 0}

.social-portfolio .pagination a{background: #e4eff8;  display: inline-block; padding: 0 14px; line-height: 32px; border-radius: 10px; text-transform: uppercase}

.social-portfolio .pagination a:hover, .web-portfolio .pagination a.active{background: #0a91f9; color: #FFF}

.social-portfolio .gallery-item {width: 33.33%;}

.social-portfolio .inside img{filter: grayscale(100%);}

.social-portfolio .inside:hover img{filter: grayscale(0%);}



@media (max-width: 30em) {

.social-portfolio .gallery-item {

    float: none;

    width: 100%;

  }

}

.page-template-template-smm-portfolio .common-ban.social-media-portfolio {

  background: url('https://www.shoutnhike.com/wp-content/uploads/2025/11/social-media-ban.png') no-repeat center top;

  background-size: cover;

  min-height: 714px;

  position: relative;

  /*margin-top: -118px;*/

}

.page-template-template-smm-portfolio .contactus, .common-inner .navbar-inverse, .common-inner .ban-in{background: transparent}

.page-template-template-smm-portfolio .common-ban {background: url(https://www.shoutnhike.com/wp-content/uploads/2025/10/life-at-shoutnhike-ban.png) no-repeat center top; min-height: 714px; position: relative; margin-top: -118px; background-size: cover;}

.page-template-template-smm-portfolio .common-ban .ban-text{display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);}

.page-template-template-smm-portfolio .common-ban .ban-text .orange-btn {position: relative; padding-left: 100px; margin: 8px 0 30px;}

.page-template-template-smm-portfolio .common-ban .ban-text .orange-btn img {position: absolute; left: 20px; top: -10px;}

.page-template-template-smm-portfolio .common-ban .ban-text h1 {font-size: 44px; line-height: 62px; margin: 0 0 20px; font-weight: bold; color: #FFF;}

.navbar {

    z-index: 99999999;

}



.page-template-template-smm-portfolio .common-ban.social-media-portfolio .ban-text{top: 40%;}

/*.free-quote.free-quote2 .box .left .input.name{background: #FFF url(../images/name.png) no-repeat center left 10px; padding-left: 30px}*/

/*.free-quote.free-quote2 .box .left .input.email{background: #FFF url(../images/email.png) no-repeat center left 10px; padding-left: 30px}*/

/*.free-quote.free-quote2 .box .left .input.phone{background: #FFF url(../images/phone.png) no-repeat center left 10px; padding-left: 30px}*/

/*.free-quote.free-quote2 .box .left .input.brand{background: #FFF url(../images/payment.png) no-repeat center left 10px; padding-left: 30px}*/

/*.free-quote.free-quote2 .box .left .input.comment{background: #FFF url(../images/comment.png) no-repeat top 15px left 10px; padding-left: 30px}*/