section.home-main { padding-top: 294px;
min-height: 504px;
position: relative;
display: flex;
overflow: hidden;
padding-bottom: 160px;
}
section.home-main:before {
content: "";
position: absolute;
right: 0px;
width: 500px;
height: 570px;
opacity: 1;
top: -66px;
background-image: url(//surveycams.com/wp-content/themes/surveycams/assets/images/mainbanner-right-circle.svg);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
display: none;
}
.home-main-image img {
max-width: 482px;
width: 100%;
margin-top: -90px;
}
section.home-main::after {
content: "";
position: absolute;
left: 0px;
width: 500px;
height: 250px;
opacity: 1;
bottom: 0px;
background-image: url(//surveycams.com/wp-content/themes/surveycams/assets/images/mainbanner-left-bottom-circle.svg);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
display: none;
}
.home-main-inner h1{
margin: 0px;
font-size: 42px;
line-height: 60px;
font-family: 'Gilroy-SemiBold', sans-serif;
color: #000;
}
.home-main-inner h1 b{
color: var(--primary-color);
}
.bg-grey{
background-color: #F9FAFB;
}
.content-group {
min-height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
}
.accordion > div:not(:last-child){
margin-bottom: 16px;
}
.accordion button {
position: relative;
display: block;
text-align: left;
width: 100%;
padding: 0em 0;
color: #7288a2;
font-size: 1.15rem;
font-weight: 400;
border: none;
background: none;
outline: none;
padding-right: 30px;
}
.accordion button:hover,
.accordion button:focus {
cursor: pointer;
}
.accordion button:hover::after,
.accordion button:focus::after {
cursor: pointer;
}
.accordion button .accordion-title {
padding: 1em 1.5em 1em 0;
font-size: 18px;
line-height: 28px;
color: #101828;
font-family: 'Gilroy-Medium';
}
.accordion button .icon {
display: inline-block;
position: absolute;
top: 0px;
right: 0;
width: 22px;
height: 22px;
border: 1px solid;
border-radius: 22px;
}
.accordion button .icon::before {
display: block;
position: absolute;
content: '';
top: 9px;
left: 5px;
width: 10px;
height: 2px;
background: #98A2B3;
}
.accordion button .icon::after {
display: block;
position: absolute;
content: '';
top: 5px;
left: 9px;
width: 2px;
height: 10px;
background: #98A2B3;
}
.accordion button[aria-expanded='true'] {
color: #98A2B3;
}
.accordion button[aria-expanded='true'] .icon::after {
width: 0;
}
.accordion button[aria-expanded='true'] + .accordion-content {
opacity: 1;
max-height: max-content;
transition: all 200ms linear;
will-change: opacity, max-height;
}
.accordion .accordion-content {
opacity: 0;
max-height: 0;
overflow: hidden;
transition: opacity 200ms linear, max-height 200ms linear;
will-change: opacity, max-height;
}
.accordion .accordion-content ol
,   .accordion .accordion-content ul{
padding-left: 30px;
margin-left: 0px;
}
.accordion .accordion-content p
, .accordion .accordion-content li {
font-size: 16px;
font-weight: 300;
margin: 0em 0;
color: #475467;
margin-top: 8px;
line-height: 24px;
font-family: 'Gilroy-Light', sans-serif;
}
.accordion-item{
padding: 24px;
background-color: #fff;
border-radius: 16px;
}
.accordion-item.active{
background-color: #F9FAFB !important;
}
.home-faq .row > .col-5{
position: sticky;
-webkit-position: sticky;
top: 140px;
align-self: flex-start;
}
.content-group ul {
padding-left: 20px;
margin-left: 0px;
}
.content-group ul {
padding-left: 20px;
margin-left: 0px;
margin-bottom: 1.5em;
font-size: var(--body-font-size);
font-family: 'Gilroy-Light', sans-serif;
line-height: var(--body-line-height);
color: var(--text-color);
margin-top: 20px;
}
.home-main > img {
position: absolute;
z-index: -1;
}
img.top-left-pattern {
top: 0;
left: 0;
}
img.top-right-pattern {
top: 0;
right: 0;
}
img.bottom-left-pattern {
bottom: 0;
left: 0;
}
.home-main-inner >p {
padding-right: 170px;
}
.steps-heading-row .section-heading {
max-width: 72%;
margin: auto; }
.steps-inner {
display: flex;
max-width: 80%;
margin: auto;
}
.steps-content-top {
padding-left: 46px;
padding-right: 46px;
padding-top: 40px;
padding-bottom: 40px;
background: #26A269;
box-shadow: 9px 10px 13.45359992980957px -1.5px rgba(0, 0, 0, 0.18);
border-top-left-radius: 35px;
border-top-right-radius: 29px;
border-bottom-right-radius: 35px;
overflow: hidden;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
gap: 10px;
display: inline-flex;
}
.steps-content-top *{
color:#fff;
margin: 0px;
}
.steps-content-top  h2{
font-family: 'Gilroy-Medium', sans-serif;
font-size: 1.5em;
font-weight: 700;
}
.steps-content-top  h3{
font-size: 1.5em;
font-weight: 700;
}
.steps-content-bottom {
padding-left: 44px;
padding-right: 44px;
padding-top: 15px;
padding-bottom: 15px;
background: rgb(245 245 245 / 75%);
box-shadow: 9px 10px 13.45359992980957px -1.5px rgba(0, 0, 0, 0.18);
border-top-left-radius: 35px;
border-top-right-radius: 35px;
border-bottom-right-radius: 35px;
border-top-left-radius: 0px;
overflow: hidden;
backdrop-filter: blur(5px);
justify-content: flex-start;
align-items: center;
gap: 10px;
display: flex;
min-height: 270px;
margin-top: 30px;
}
.steps-content-bottom * {
color: #082E39;
font-size: 24px;
font-family: Gilroy-Regular, sans-serif;
font-weight: 400;
line-height: 32px;
}
.steps-content-bottom ul {
padding-left: 0px;
margin-left: 0;
margin-bottom: 0;
}
.steps-image img {
position: absolute;
right: 10px;
z-index: -1;
width: 100%;
transform: scale(1.3);
top: 46px;
}
.steps-image {
width: 60%;
position: relative;
z-index: 0;
}
.steps-content {
width: 40%;
position: relative;
z-index: 9;
}
.new-steps.reverse-steps .steps-image img {
right: -20px;
}
.new-steps.steps-2.reverse-steps .steps-inner{
max-width: 70%;
}
.new-steps.steps-2.reverse-steps .steps-image img {
transform: unset;
right: -70px;
top: 0;
}
.new-steps.steps-2.reverse-steps .steps-image{
margin-left: -70px;
}
.new-steps.reverse-steps .steps-content .steps-content-top{
background-color: var(--secondary-color);
}
.image-content-group
, .steamless-efficiency
, .action-steps{
background-color: #F9FAFB;
}
section.image-content-group .row > :last-child {
padding-bottom: 0px;
}
.stemless-inner
, .action-steps-inner {
padding-left: 42px;
padding-right: 42px;
padding-top: 64px;
padding-bottom: 64px;
background: #003154;
border-radius: 23px;
overflow: hidden;
min-height: 112px;
}
.stemless-inner *
, .action-steps-inner *{
color:#fff;
}
.stemless-inner h3
, .action-steps-inner h3{
color: white;
font-size: 36px;
font-family: 'Gilroy-SemiBold', sans-serif;
font-weight: 400;
line-height: 44px;
margin: 0px;
}
.stemless-inner p
, .action-steps-inner p{
color: white;
font-size: 24px;
font-family: 'Gilroy-Regular', sans-serif;
font-weight: 400;
line-height: 32px;
margin-bottom: 0px;
margin-top: 10px;
}
section.steamless-efficiency .row {
max-width: 88%;
margin: auto;
}
section.steamless-efficiency .container > .row:not(.heading-row) > :not(:first-child, :nth-child(2)){
margin-top: 30px;
}
section.steamless-efficiency .container > .row:not(.heading-row){
margin-top: 80px;
}
.action-steps-inner {
min-height: 280px;
position: relative;
overflow: visible;
}
.action-steps .stemless-btn.row{
margin-top: 80px;
}
.action-steps .heading-row{
margin-bottom: 80px;
}
span.count {
width: 78px;
height: 78px;
position: absolute;
top: -26px;
left: -26px;
background-color: var(--primary-color);
border-radius: 50px;
text-align: center;
line-height: 78px;
color: white;
font-size: 30px;
font-family: Gilroy-SemiBold, sans-serif;
font-weight: 400;
}@media(max-width:1300px){
.common-main-image img{
transform: scale(1);
}
}
@media(min-width:1600px){
.login-signup li a{
padding-left: 50px !important;
padding-right: 50px !important;
}
.header-inner{
max-width: 1500px;
}
}
@media(max-width:1199px){
.subscriber-form > div{
display: flex;
}
.team-inner{
min-height: 490px;
}
}
@media(max-width:1100px){
.container{
max-width: 940px;
}
}
@media(max-width:1199px){
.common-main-banner::before{
top:60px;
}
.main-navigation ul.menu > li > a{
padding-left: 15px;
padding-right: 15px;
}
.login-signup{
min-width: 26%;
}
ul.blog-categories{
flex-wrap: wrap;
}
ul.blog-categories > li {
margin-bottom: 12px;
}
.new-steps.steps-2.reverse-steps .steps-inner
, .steps-inner{
max-width: 100%;
}
.new-steps.steps-2.reverse-steps .steps-image{
margin-left: 0px;
}
.image-content-group{
overflow: hidden;
}
.stemless-inner, .action-steps-inner{
padding-left: 30px;
padding-right: 30px;
}
}
@media(min-width:1025px){
.join-section .common-btn:hover {
border-color: #fff !important;
}
ul.blog-categories a:hover
, .industries-cta .common-btn:hover
, .request-demo-howitworks .common-btn:hover{
background-color: var(--primary-color) !important;
color:#fff !important;
border-color: var(--primary-color) !important;
}
.common-btn:hover
, .submit-btn input:hover
, .header-login:hover{
background-color: var(--secondary-color) !important;
color: #fff !important;
border-color: var(--secondary-color) !important;
}
.main-navigation ul.menu > li:hover a:hover{
color: var(--primary-color);
}
a.transparent-white:hover{
color:#fff !important;
}
}
@media(max-width:1024px){
.subscriber-form input[type="submit"]{
margin-left: 20px;
}
.plan-items{
padding-left: 10px;
padding-right: 10px;
}
.plan-item a.common-btn{
padding-left: 18px !important;
padding-right: 18px !important;
}
.site-footer .row{
flex-wrap: nowrap !important;
}
.subscriber-form > div {
display: flex !important;
}
.footer-newsletter{
min-width: 36%;
}
}
@media(max-width:991px){
.row.mission-cards > div
, .team-row > div {
max-width: 50% !important;
width: 50%;
}
.row.mission-cards > div:not(:last-child)
, .team-row > div:not(:last-child){
margin-bottom: 30px;
}
.team-inner{
min-height: 460px;
}
.mobile-btn{
display: block !important;
}
.header-inner{
top: 0px;
}
.navicon {
width: 45px;
height: 45px;
background: var(--primary-color);
position: relative;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
-o-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out;
cursor: pointer;
z-index: 9999;
position: absolute;
top: 15px;
right: 15px;
border-width: 0px;
}
span.dropdown{
right: 15px;
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
top: 0;
}
span.dropdown img{
width: 18px;
}
.navicon span {
display: block;
position: absolute;
height: 2px;
width: 100%;
border-radius: 1px;
opacity: 1;
background: #fff;
left: 10px;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: 0.25s ease-in-out;
-moz-transition: 0.25s ease-in-out;
-o-transition: 0.25s ease-in-out;
transition: 0.25s ease-in-out;
}
.navicon span:nth-child(1) {
top: 13px;
width: 22px;
}
.navicon span:nth-child(2) {
top: 22px;
width: 25px;
}
.navicon span:nth-child(3) {
top: 32px;
width: 20px;
}
.navbar-toggler.open span {
background: #fff;
}
.navicon.open span:nth-child(1) {
top: 23px;
-webkit-transform: rotate(135deg);
-moz-transform: rotate(135deg);
-o-transform: rotate(135deg);
transform: rotate(135deg);
}
.navicon.open span:nth-child(2) {
opacity: 0;
left: -60px;
}
.navicon.open span:nth-child(3) {
top: 23px;
width: 23px;
-webkit-transform: rotate(-135deg);
-moz-transform: rotate(-135deg);
-o-transform: rotate(-135deg);
transform: rotate(-135deg);
}
nav#site-navigation {
right: 0;
position: fixed;
height: 100%;
width: 100%;
left: -100%;
top: 0;
background-color: #fff;
z-index: 999;
transition: all 0.3s ease-in-out 0s;
display: flex;
flex-direction: column;
justify-content: flex-start;
padding-top: 110px;
padding-left: 0px;
}
nav#site-navigation.open-menu{
left: 0px;
}
.main-navigation ul{
flex-direction: column;
}
.login-signup ul{
align-items: flex-start;
}
.site-branding {
position: relative;
z-index: 999999;
}
.header-inner{
padding-left: 15px;
padding-right: 15px;
border-radius: 0px;
}
.main-navigation ul.menu > li > a
, .login-signup{
padding-left: 0px !important;
padding-right: 0px !important;
display: block;
width: 100%;
text-transform: uppercase;
}
.main-navigation li{
padding-left: 15px;
padding-right: 15px;
}
header#masthead{
padding-top: 0px;
}
.main-navigation ul.menu ul{
position: relative;
top: auto;
left: auto;
display: none;
box-shadow: none;
padding-top: 0px;
padding-left: 20px;
padding-right: 20px;
}
.main-navigation .menu-main-menu-container > ul{
display: block !important;
}
.main-navigation ul.menu ul li
, .main-navigation ul.menu ul li a{
padding-left: 0px;
padding-right: 0px;
}
li.menu-item-has-children.sub-open >ul{
display: block !important;
}
.main-navigation ul.menu ul li a {
border-bottom-width: 0px !important;
}
.login-signup {
margin-top: 10px;
}
.login-signup ul li:not(:last-child) {
margin-bottom: 20px;
}
.home-main-inner h1
, .common-plan-heading h2{
font-size: 48px;
line-height: 60px;
}
.section-title
, .industries-cta h2{
font-size: 38px;
line-height: 50px;
letter-spacing: -1px;
}
.site-footer .row{
flex-wrap: wrap !important;
}
.site-footer .row > div {
min-width: 33.333%;
}
.footer-social-outer
, .footer-newsletter
{
margin-top: 40px;
}
section.common-plan.section-padding{
overflow: hidden;
}
.footer-newsletter {
min-width: 100% !important;
}
.subscriber-form input[type="submit"]{
width: 100%;
margin-left: 15px;
} .content-page-title h1
, .error-page-text h1
, .main-section-padding h1
, .trial-main-inner h1
, .main-section-padding h1{
font-size: 50px !important;
line-height: 60px !important;
}
.content-page-main{
padding-top: 105px;
}
.main-section-padding{
padding-top: 140px;
padding-bottom: 60px;
}
section.content-template-section{
padding-top: 45px;
}
.content-page-title{
padding-bottom: 15px;
}
.content-inner{
padding-bottom: 60px;
}
.steps-content h3
, .cards-inner h3{
font-size: 34px;
line-height: 44px;
}
.steps-content p.step-content-number{
font-size: 22px;
}
.join-card p:first-child{
font-size: 30px;
}
.join-card p{
font-size: 18px;
}
.join-card{
padding-left: 30px;
padding-right: 30px;
}
.row.case-studies-row > div:not(:last-child){
margin-bottom: 30px;
}
.row.case-studies-row > div{
max-width: 50%;
}
.new-steps.steps-2.reverse-steps .steps-inner, .steps-inner{
max-width: 90%;
}
}
@media(max-width:767px){
.reduction-three-column .row > div:not(:last-child){
margin-bottom: 30px;
}
.calendly-inline-widget{
height: 800px !important;
}
.calander-code{
margin-top: 40px;
}
.steps-row:not(.reverse-row) .steps-content{
padding-right: 0px;
}
.steps-content > ul
, .steps-content-bottom ul *{
font-size: 20px;
line-height: 30px;
}
.steps-content h4{
font-size: 22px;
line-height: 30px;
}
.steps-content{
margin-top: 30px;
padding-top: 0px !important;
}
.row.steps-row.reverse-row .steps-content{
padding-left: 0px;
}
.row.steps-row:not(.reverse-row)
, .home-main .row {
flex-direction: column-reverse;
}
.home-main-image img{
margin: auto;
display:block;
margin-bottom: 40px;
}
.steamless-efficiency .row:not(.heading-row) > div
, .action-steps .row:not(.heading-row) > div{
margin-top: 0px !important;
}
.stemless-inner h3, .action-steps-inner h3{
font-size: 28px;
}
.steamless-efficiency .row:not(.heading-row) > div:not(:last-child)
, .action-steps .row:not(.heading-row) > div:not(:last-child){
margin-bottom: 30px;
}
.action-steps-inner{
min-height: auto;
}
section.steamless-efficiency .row{
max-width: 100%;
}
span.count{
top: -25px;
left: -5px;
}
.join-card p:first-child{
font-size: 40px;
}
.join-card p{
font-size: 22px;
}
.join-row > div:not(:last-child){
margin-bottom: 30px;
}
.row-cards > .col-6:not(:last-child){
margin-bottom: 30px !important;
}
.about-main .common-main-image img{
margin-top: 0px;
width: 100%;
}
.image-content-group .content-group{
padding-left: 0px !important;
padding-right: 0px !important;
}
.common-main-banner::before{
height: 100%;
top: 0px;
}
.home-faq .row > .col-5{
position: relative  !important;
top: auto !important;
}
.image-content-group .content-group{
margin-top: 20px;
}
.section-padding
, footer.site-footer{
padding-top: 60px;
padding-bottom: 60px;
}
.image-content-group.reverse .row
, .common-main-banner .row{
flex-direction: column-reverse;
}
.common-main-banner-left{
padding-right: 0px;
margin-top: 30px;
}
.copyright-row p{
text-align: center;
}
.copyright-links{
justify-content: center;
margin-top: 20px;
}
.subscriber-form input[type="email"]{
min-width: 80%;
}
.row > .col-3
, .row > .col-2
, .row > .col-1
, .row > .col-7
, .row > .col-4
, .row > .col-5
, .row > .col-6
, .row > .col-8
, .row > .col-9
, .row > .col-10
, .row > .col-11
{
max-width: 100%;
}
.copyright-row{
padding-bottom: 0px !important;
}
footer.site-footer{
padding-bottom: 40px !important;
}
.new-steps .steps-inner{
max-width: 100% !important;
display: flex;
flex-wrap: wrap;
}
.new-steps .steps-inner > div{
width: 100%;
}
.new-steps .steps-inner > div img{
position: relative;
transform: unset !important;
top: auto !important;
z-index: auto;
right: 0px !important;
}
.steps-content-top{
width: 100%;
}
.new-steps:not(.reverse-steps) .steps-inner{
flex-direction: column-reverse;
}
.new-steps .steps-inner .steps-image{
margin-bottom: 30px;
}
section.partner-logos{
overflow: hidden;
}
}
@media(max-width:680px){
.our-story-heading .section-title{
margin-bottom: 30px;
}
.home-main-inner >p{
padding-right: 0px;
}
.steps-heading-row .section-heading{
max-width: 100%;
}
.steps-content-bottom{
min-height: auto;
}
.stemless-inner p, .action-steps-inner p{
font-size: 20px;
}
.three-step-section .steps-row{
padding-left: 10px;
padding-right: 10px;
padding-top: 50px;
}
.steps-content h3, .cards-inner h3{
font-size: 26px;
line-height: 36px;
}
.cards-inner{
padding: 30px;
}
.row.steps-row.reverse-row .steps-content{
padding-top: 20px;
}
.site-footer .row > div
, .row.case-studies-row > div{
width: 100%;
min-width: 100% !important;
}
.site-footer > .container > .row:first-child > div:not(:first-child){
margin-top: 30px;
}
.subscriber-form > div{
flex-direction: column;
}
.subscriber-form input[type="submit"]{
margin-left: 0px;
margin-top: 20px;
}
.blog-inner{
flex-wrap: wrap;
}
.blog-inner > div{
width: 100%;
padding-left: 0px;
padding-right: 0px;
}
.blog-content {
margin-top: 25px;
}
.row.blog-listing > .listing-data{
margin-bottom: 40px;
}
.blog-image img{
min-height: auto;
}
.single-image{
padding-top: 50px;
padding-bottom: 50px;
}
.conclusion-plan{
padding: 25px;
}
}
@media(max-width:580px){
.home-main-inner h1, .common-plan-heading h2
, .content-page-title h1
, .error-page-text h1
, .main-section-padding h1
, .trial-main-inner h1
, .main-section-padding h1{
font-size: 40px !important;
line-height: 50px !important;
}
.common-main-banner-left p{
font-size: 20px;
line-height: 30px;
}
.section-title{
font-size: 35px;
line-height: 42px;
letter-spacing: 0;
}
.content-page-title > p{
margin-top: 5px;
}
.common-main-banner
, .get-in-touch-section{
overflow: hidden;
}
input#phone_number, #country-code-text{
width: 100%;
}
#country-code-text{
max-width: 35px;
}
.row.mission-cards > div, .team-row > div{
width: 100% !important;
min-width: 100% !important;
}
}
@media(max-width:471px){
.footer-home{
margin-top: 40px;
}
.subscriber-form > div{
flex-direction: column;
}
.footer-newsletter{
min-width: 100% !important;
}
.subscriber-form input[type="submit"]{
margin-top: 12px;
}
}