/*
Theme Name:  SS Settlement  Theme
Author URI: https://www.thegeminigeeks.com/
Version: 1.1
Author: The Gemini Geeks
Description: A theme by The Gemini Geeks
*/
:root {
  /* Color Variables: */
--primarycolor:#000;
--secondarycolor:#de232a;
--tertiarycolor:#273a7c;
}
*{margin: 0;padding: 0;}
body {margin: 0;padding: 0;background: #fff;font-family: 'Source Sans Pro', sans-serif;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;color: #000;font-weight: 400;font-size: 15px;line-height: 1.8;text-rendering: optimizeLegibility;}
a img {border: none;}
a {color:var(--primarycolor);text-decoration: none !important;transition:0.8s;transition: all 0.8s ease;-moz-transition: all 0.8s ease;-ms-transition: all 0.6s ease;-webkit-transition: all 0.8s ease;-o-transition: all 0.8s ease;}
a:hover {transition:0.8s;text-decoration: none;color: var(--secondarycolor);}
:before {font-style: normal;font-family:'icomoon';}
.clear {clear: both;}
.divider {clear: both;border-bottom: 1px solid #ddd;margin: 0 0 20px 0;padding: 20px 0 0 0;}
.alignleft{float:left;margin:0 10px 0 0;}
.alignright{float:right;margin:0 0 0 10px;}
.aligncenter{display:block;margin:0 auto;}

#scroll {position: fixed;right: 10px;bottom: 10px;cursor: pointer;width: 50px;height: 50px;background-color: var(--secondarycolor);text-indent: -9999px;display: none;-webkit-border-radius: 60px;-moz-border-radius: 60px;border-radius: 60px;z-index: 999;}
#scroll span {position: absolute;top: 50%;left: 50%;margin-left: -8px;margin-top: -12px;height: 0;width: 0;border: 8px solid transparent;border-bottom-color: #ffffff;}
#scroll:hover {background-color:var(--tertiarycolor);opacity: 1;filter: "alpha(opacity=100)";-ms-filter: "alpha(opacity=100)";}

.inner {width: 1170px;margin: 0 auto;max-width: 100%;}
.overlay {position: absolute;left: 0;right: 0;top: 0;bottom: 0;background-color: #5C2AB5CF;}

.header_area {position:relative;top: 0;left: 0;width: 100%;z-index: 999;transition: background 0.4s, all 0.3s linear;border-bottom: 1px solid rgba(255,255,255,0.2);float:left;}

.header_area.navbar_fixed .main_menu {display:none;position: fixed;width: 100%;top: -70px;left: 0;right: 0;z-index: 997;background: var(--primarycolor);transform: translateY(70px);
transition: transform 500ms ease, background 500ms ease;
-webkit-transition: transform 500ms ease, background 500ms ease;
box-shadow: 0px 3px 16px 0px rgba(0,0,0,0.1);}

#topbar{width:100%;float:left;padding:20px 0;display: block;}
.social,.pull-right{float:right}
.social li{display:inline-flex;margin:0px 10px;line-height: 20px;}
.social li a span{font-weight:700}
.social .phone:before {content: "\f2a0"; margin-right: 10px;font-size: 35px;color:var(--secondarycolor);margin-top: 8px;}
.social .mail:before {content: "\f0e0"; margin-right: 10px;font-size: 36px;color:var(--secondarycolor);margin-top: 8px;}
#mainnav{background: var(--tertiarycolor);margin-bottom: -29px;padding:0}
.menubtn{float:right;background:var(--secondarycolor);margin:   0 !important;}
.menubtn:hover {background:transparent !important;}

#logo .site-title {float:left;}
#logo .site-title a{color:#fff;font-size: 24px;}
#logo img{width:350px;height:auto}
.site-menu-toggle{display: none;}

h1,h2,h3,h4,h5,h6 {margin: 0 0 10px 0;color: #000;line-height: 1.2;font-family: 'Fira Sans', sans-serif;}

h1 {font-size: 36px;text-transform: uppercase;}
h2 {font-size: 28px;}
h3 {font-size: 24px;}
h4 {font-size: 20px;}
h5 {font-size: 18px;}
h6 {font-size: 16px;}
.centered-image{width: 800px !important; max-width: 100% !important}
.smalltext{text-transform: uppercase;letter-spacing: 5px;display: block;text-align: center}

.more-btn{padding: 10px 60px;border: 1px solid #f6f6f666;margin:15px auto;display:table;color: #fff;}
.more-btn:hover{background:var(--primarycolor);color:#fff !important; }

#slider .item img{height: 600px;object-fit: cover;}
#slider .owl-nav .owl-next, #slider .owl-prev {position: absolute;top:40%;transition: 0.6s;font-size:45px;color:#fff;opacity:0;}
#slider:hover .owl-nav .owl-next{display: block;transition: 0.6s;opacity:1.0;}
#slider:hover .owl-nav .owl-prev{display: block;transition: 0.6s;opacity:1.0;}
#slider .owl-nav .owl-next:hover, #slider .owl-nav .owl-prev:hover {color: #fff; transition: 0.6s;}
#slider .owl-nav .owl-prev {left: 20px;display: block;transition: 0.6s; }
#slider .owl-nav .owl-next {right: 20px;display: block;transition: 0.6s;}
#slider .owl-next span, #slider .owl-prev span{color: var(--primarycolor);}

.carousel-caption {right: 15%;top: 20%;left: 7%;z-index:997;padding-top: 20px;padding-bottom: 20px;position:absolute;}
.carousel-caption .subheading{font-weight: 400;color:#fff;font-size: 30px;letter-spacing: 3px;position:relative;/*! padding: 0 55px; */}
.carousel-caption  .heading{padding:0}
.carousel-caption h1{font-size: 60px;color: #fff;line-height: 1.3;margin: 0;}
.carousel-caption span{font-weight: 900;color:#F68C19;}
.carousel-caption p{color: #fff;font-weight: inherit;}
.btn-primary{border: 1px solid var(--secondarycolor);color:#fff;padding: 10px 60px;display: inline-block;margin: 25px 0;background:var(--secondarycolor)}
.btn-primary:hover{border: 1px solid var(--tertiarycolor);background:var(--tertiarycolor);color:#fff;}

.heading{padding:0 44px;position:relative;}
.heading:before{content:"";position:absolute;height:3px;background:var(--secondarycolor);width:30px;bottom:45%}
.line{margin-left:40px;}

#about{padding:65px 0 0;float: left;width: 100%;}
#about .col-md-6:nth-child(1){padding:30px 0}
#about .btn-primary{color:#fff;}
#about img{margin:0 auto}

#about .heading::before{left:0}

#service{width:100%;float:left;}
#service .col-md-6{padding:65px 30px 45px}
#service h1{color:#fff}
#service img{margin:20px auto;}
.box a{color:#fff;float: right;font-style: italic;border-bottom: 1px solid;}
.box a:hover{border-bottom: 1px solid var(--primarycolor);}
.box{margin: 30px auto;display: table;width: 527px;}
.boxicon{width:10%;margin:0 15px 0 0 !important;float:left}
.boxtxt{float:left;color:#fff;width: 87%;}
.boxtxt h4{color:#fff}
#service .col-md-6:nth-child(1){background:var(--tertiarycolor)}
#service .col-md-6:nth-child(2){background:var(--secondarycolor)}
#service .col-md-6:nth-child(2) .heading:before{background:#fff}


#counter{width: 100%;float: left;color: #fff;text-align: center;background-size: cover;position: relative;padding: 65px 0 45px;}
#testimonials .heading:before,#counter .heading:before{left:36%}
#counter .row{background:url('https://www.sssettlement.com/wp-content/uploads/2020/09/SS-Settlement-map.png');
background-repeat: no-repeat;background-position: center;background-size:contain;
padding: 50px 0;}
#counter h4{font-weight:400;font-size: 16px;color:var(--primarycolor);}
#total-score-circle,
#general-score-circle,
#speed-score-circle,
#privacy-score-circle {margin: 0.1em auto; width: 160px;  height: 160px;position: relative;}

#facts{width:100%;float:left;padding:35px 0;background:url('https://www.sssettlement.com/wp-content/uploads/2020/09/SS-Settlement-bg.jpg');background-attachment:fixed;color:#fff}
#facts .row{margin:45px 0;float:left}
#facts h1{color:#fff}
#facts .heading{padding:0}
#facts .heading:before{background:#fff}
#facts .more-btn{margin:25px 0}

#testimonials{padding: 65px 0px;width: 100%;float: left;text-align: center}
.testimonial .testimonial-item {padding: 28px 65px; }
#testimonials .testimonial h4{margin: 10px 0;color:var(--secondarycolor);}
#testimonials .owl-nav .owl-next, #testimonials .owl-prev {position: absolute;top:15%;transition: 0.6s;font-size:45px;color:var(--tertiarycolor);opacity:1;}
#testimonials .owl-nav .owl-prev {left: 20px;display: block;transition: 0.6s; }
#testimonials .owl-nav .owl-next {right: 20px;display: block;transition: 0.6s;}

.column{column-count: 2;margin:25px 0 !important;}

.gap{height:15px;width:100%;clear:both}
#team{margin-bottom:20px;float:left}
#name{margin: 0 0 15px !important}
#rank{color:var(--secondarycolor)}
#rank:before{display:none}
#servicepage .col-md-4{margin-bottom:20px;transition:0.6s ease}
#servicepage .col-md-4 h3{margin:0 0 15px}
#servicepage .col-md-4:hover{box-shadow: 0px 3px 16px 0px rgba(0,0,0,0.1);transition:0.6s ease}
#servicepage a{float:right;text-decoration:underline !important;}

#blog{width:100%;float:left;margin:45px 0;}
#blog h1{text-align: center;}
#blog .col-md-4{margin:55px 7px 0;width:32%;-webkit-transition-duration: 800ms;transition-duration: 800ms;cursor:pointer;padding:0 0 25px;}
.blog-thumbnail img{width: 100%;height:200px;}
#blog .col-md-4:hover{box-shadow:12px 15px 20px 0px rgba(46,61,73,0.15) ;padding:0 0 25px;-webkit-transition-duration: 800ms;transition-duration: 800ms;cursor:pointer;}
#blog .col-md-4 .post-title{font-size: 26px;font-weight: 600;color:var(--primarycolor);margin:15px 0;display: block;padding:0 15px;}
#blog .col-md-4 .post-title:hover{color:#4c813b;}
#blog .col-md-4 p{text-align: justify;margin:0 0 25px;padding:0 15px;}
#blog .col-md-4 .more-link{background:#4c813b;text-align: center;color:#fff;max-width: 100%;display: inline-block;float: right;padding:10px;margin:0 15px;}
#blog .col-md-4 .more-link:hover{background:#4c813b;color:var(--primarycolor);}


#single-post {padding:45px 0;}
#single-post .post-title{font-size: 26px;font-weight: 600;color:var(--primarycolor);margin:15px 0;display: block;border-bottom: 1px solid #eee;line-height: 50px;}
#single-post .post-title:hover{color:#4c813b;}
#single-post p{margin-bottom: 25px;text-align:justify;}
#single-post img{max-width: 100%;height: auto;margin-bottom:25px;}
#single-post #featured-img img{max-width: 100%;display: block;margin-top:35px;height: auto;}

.info{padding:20px 0;}
.info p{font-size:20px !important;}
.info li{line-height:30px;display:flex;}
.info a{color:var(--primarycolor) !important;font-weight:400 !important;}
.info a:hover{color:var(--secondarycolor) !important;}
.info .address:before {content: "\f041"; margin-right: 10px;font-size: 24px;color:var(--secondarycolor)}
.info .phone:before {content: "\f2a0"; margin-right: 10px;font-size: 24px;color:var(--secondarycolor)}
.info .email:before {content: "\f0e0"; margin-right: 10px;font-size: 24px;color:var(--secondarycolor)}

#formbg{background:#f5f5f5;border:1px solid var(--secondarycolor)}
#formbg #contactform input,#formbg #contactform textarea,#formbg #contactform select{padding:10px 20px;}
#formbg .col-md-12{margin:10px 0 0 }

#contactform {
line-height: 20px;
margin: 15px 0 20px;
float: left;
}
#contactform * {
font-size: 15px;
text-align: left;
font-family: 'Muli', sans-serif;	
}
#contactform h5 {
font-size: 18px;
line-height: 22px;
font-weight: 400;
text-align: center;
text-transform: uppercase;
margin: 25px 0 15px;
padding: 0;
}
#contactform h2 {
font-size: 40px;
font-weight: bolder;
color: #C21605;
text-align: center;
margin: 25px 0 15px;
padding: 0 0 8px;
}
#contactform input[type="checkbox"] {
margin-right: 0!important;
width: auto;
margin-top: 20px;
}
#contactform input[type="date"] {
-webkit-align-items: center;
display: 0;
width: 100%;
overflow: hidden;
-webkit-padding-start: 1px;
}
#contactform input {
width: 100%;
background: #FFF;
box-shadow: 0 1px 1px rgba(0,0,0,0.1);
border: 1px solid #dbdbdb;
margin: 10px 0;
padding: 15px;
}
#contactform select {
width: 100%;
background: #FFF;
border: 1px solid #25252529;
border-radius: 5px;
color: #595966;
margin: 10px 0;
padding: 15px;
}
#contactform textarea {
max-width: 100%;
height: 120px;
background: #fff;
border: 1px solid #25252529;
border-radius: 5px;
margin: 10px 0;
padding: 25px;
width: 100%;
}
#contactform span.wpcf7-list-item{width:30%}

#contactform input:focus,#contactform textarea:focus,#contactform select:focus {
background: #fff;
border: 1px solid var(--secondarycolor);
}
#contactform input.wpcf7-submit {
color: #fff;
width: 225px;
text-align: center;
font-size: 18px;
text-transform: uppercase;
cursor: pointer;
border: none;transition: .3s;
padding: 13px;
background: var(--secondarycolor);
margin: 0 auto;
display: table;
}
#contactform input.wpcf7-submit:hover {
background:#fff;
transition: .3s;
background:var(--tertiarycolor);
}
textarea,iframe {
max-width: 100%;
}
.wpcf7-list-item {
margin-left: 0!important;
}

::-webkit-input-placeholder,:-moz-placeholder,::-moz-placeholder,:-ms-input-placeholder {
color: #595966!important;
opacity: 1;
}
div.wpcf7-response-output{background:transparent !important;border:0px !important}

.post {padding: 10px;margin: 0 0 10px 0;}
.post p {margin: 0 0 10px 0;}
.post p a {font-weight: bold;}
.post a {color: #000;}
.post ul {margin: 10px 0 0px 0px;}
.post ul li {list-style :none;margin: 0 0px 10px 0px;display: flex;list-style-position: inside;}
.post ul li:before{color:var(--tertiarycolor);content: "\f005";margin-right: 8px;font-style:normal;}
.post h4{display:flex}
.post h4:before{color:var(--secondarycolor);content: "\f068";margin-right: 8px;font-style:normal;}

#pagetitle {background-color:#f5f5f5;color:#fff;background-size:cover;position: relative;float: left;width: 100%;}
#pagetitleinner {padding:60px 0 30px;float: left;width: 100%;text-align: center;}
#pagetitle h1 {color:var(--tertiarycolor);text-align: center;font-weight: 400;margin:0}
#pagetitle p {color:#fff;text-align: center;font-size: 20px;}
.breadcrumb {list-style: none;border-radius: 4px;max-width: 100%;float: none;font-size: 14px;text-transform: uppercase;color: #fff;font-weight: 300;}
.breadcrumb a{color:#fff;}
.breadcrumb a:hover{color:#F9C928;}
.breadcrumb>li {display: inline-block;}
.breadcrumb>li+li:before {content: "\f101";padding: 0 5px;color: #fff}
#pagetitle .breadcrumb> a {color: #fff}

#main{padding: 45px 10px 45px 10px;}
#side{padding: 45px 10px 45px 10px;text-align:left;}
#side h3{border-bottom: 1px solid #000;line-height: 40px;}
#side ul{margin-left:20px}
#side a{display:block}
#side li:hover{border-bottom:1px solid var(--secondarycolor)}

#main p{color:var(--primarycolor);font-size: 15px;text-align:justify;}
#main a{color:var(--secondarycolor);font-weight: bolder;}
#main a:hover{color:var(--primarycolor);}
#main h3{line-height: 40px;font-weight: 400;border-bottom:1px solid var(--tertiarycolor);margin: 25px 0 15px;}
#main h3 span{background: var(--tertiarycolor);color: #fff;padding:7px 10px;text-transform: uppercase;}
#main h4 {font-weight:400}
#main li{list-style: none;line-height: 30px;color: var(--primarycolor);}

.inner-link{display: flex; width:fit-content; justify-content:center; align-items:center; margin: 0 auto}


#sidebar {margin:10px 0;}
#sidebar label.screen-reader-text{display:none;}
#sidebar input {box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
#sidebar input#s {border:1px solid #ccc;color:var(--primarycolor);padding:5px;background:#fafafa;width:70%;}
#sidebar input#s:focus {background:#fff;}
#sidebar input#searchsubmit {width:25%;background:#3C5AA8;color:#fff;border:none;padding:5px;}

.widget {margin:10px 0 25px 0;}
.widget h3 {border-bottom:2px solid var(--primarycolor);margin:0 0 15px 0;padding:0 0 2px 0;text-align:left;font-weight:700}
.widget span.post-date {color:var(--primarycolor);font-size:12px;}
.widget ul {margin:10px 0 0 0px;}
.widget ul li {margin:0 0 8px 0;list-style-type:square;border-bottom:1px solid #eee;}

#commentlist{padding:5px;}
#commentlist .comment{padding:5px;margin:0 0 10px 0;border:1px solid #eee;border-radius:5px;}
#commentlist .fn{font-weight:bold;font-style:normal;}
#commentlist .commentmetadata {font-size:11px;margin:0 0 5px 0;}
#commentlist .commentmetadata a{color:#888;font-size:11px;}

#respond {padding:10px;background:#fafafa;border:1px solid #ddd;border-radius:5px;margin:5px;}
#respond h4{margin:0 0 10px 0;}
#respond p{margin:0 0 10px 0;}
#respond input, #respond textarea {padding:3px;background:#fafafa;border:1px solid #ccc;border-radius:3px;}
#respond input:focus, #respond textarea:focus {background:#fff;}
#respond textarea{width:500px;max-width:90%;}
#respond input#author{width:200px;margin:0 5px 0 0;}
#respond input#email{width:200px;margin:0 5px 0 0;}

#cta{text-align: center;width:100%;float:left;padding:0 0 25px}
#cta h2{text-transform:uppercase;font-weight:400}
#cta h4{font-weight:400;}
#cta a{margin:0 10px;border-bottom:1px solid var(--secondarycolor);transition:0.5s ease-in-out}
#cta a:hover{border-bottom:1px solid var(--tertiarycolor);font-style: italic;transition:0.5s ease-in-out}
#cta .icon-whatsapp{color:#00a72c}

#bottom {background: #f5f5f5;color:#fff;font-size: 15px;padding: 40px 0;}
#bottom a {color: var(--primarycolor);}
#bottom a:hover {color:var(--secondarycolor);}
#bottom img{margin:30% 0 0;}
#bottom p{color:var(--primarycolor) !important;}
#bottom .widget h3 {font-size: 22px;border: none;text-align: left;font-weight: 400;color: var(--primarycolor);margin: 0px 0px 30px;}
#bottom .widget h3:before {content: '';height: 1px;background: var(--tertiarycolor);width: 50px;position: absolute;margin: 50px 0px;top: 0}
#bottom .widget li {border: none;text-decoration: none;color:var(--primarycolor);list-style: none;}
#bottom .widget li:before {color:var(--secondarycolor);margin-right: 10px;font-style: normal;}

#bottom .footer-contact li{line-height:20px;display:flex;}
#bottom .footer-contact .address:before {content: "\f041"; margin-right: 10px;}
#bottom .footer-contact .phone:before {content: "\f2a0"; margin-right: 10px;}
#bottom .footer-contact .email:before {content: "\f0e0"; margin-right: 10px;}

#footer {clear: both;background:#f5f5f5;color: var(--primarycolor);padding: 10px 0;text-align: center;font-size:13px;}
#footer a {color: var(--primarycolor);}
#footer a:hover {color:var(--secondarycolor);}
.fleft {float: left;}
.fright {float: right;}

.breadcrumb {list-style: none;border-radius: 4px;max-width: 100%;float: none;font-size: 14px;text-transform: uppercase;color: #fff;font-weight: 300;}
.breadcrumb>li {display: inline-block;}
.breadcrumb>li+li:before {content: "\f101";padding: 0 5px;color: #fff}


@media screen and (max-width: 981px) {
body {min-width: 230px;}
.desktoponly {display: none;}
.inner {width: 100%;padding: 0%;}
img.alignleft,
img.alignright {float: none;display: block;margin: 10px auto;}
.site-menu-toggle{display: block;color:var(--tertiarycolor);}
.site-navbar{display: none;}
  
  .column{column-count: 1}
  
#topbar{padding:10px 0}	
#logo .site-title{margin: 10px 0;}	
#logo img{width: 50%;height: auto;float:left;}
#mainnav{background:transparent;margin-bottom: 0;}  
#pagetitleinner {padding:30px 0;}
.social{float:none;text-align: center;margin-top: 10px;}
#about{padding:0 15px;}
#about img{margin:0 auto}
#bottom {width: 100%;display: block;}
#bottom img{margin:1%}
.bottomcol1{padding:0 50px}	
#footer {font-size: 12px;padding: 10px 0;}
.fleft, .fright {float: none;}
}


@media screen and (min-width: 981px) {
.mobileonly {display: none;}
.lefthalf {float: left;width: 48%;}
.righthalf {float: right;width: 48%;}
.site-menu-toggle{display:none;}
}


@media screen and (min-width: 220px) and (max-width: 420px) {
#logo img{width:70%;}
#slider .item img{height:220px;}
.carousel-caption {right: 5%;top:5%;left: 5%;}
#slider .owl-nav .owl-next, #slider .owl-prev{font-size: 24px;}
.carousel-caption .subheading{font-size:20px}
.carousel-caption h1 {font-size:30px;}
#slider .btn-primary{padding:5px 35px;margin:10px 0;}
#service .heading,#facts .heading,#counter .heading, #testimonials .heading{padding:0;font-size:27px;}
#service .line,#facts .line,#counter .line, #testimonials .line{margin-left:35px;}
#testimonials .heading:before,#counter .heading:before{left:15%}
.box{width:100%}
.boxtxt{width:100%}
#contactform span.wpcf7-list-item { width: 100%;}	
#main h3 span{width: 100%;display: block;}
}

@media screen and (min-width: 421px) and (max-width: 500px) {
#bottom .col-md-3{width: 49%;float: left;word-wrap: anywhere}
#slider .item img{height:220px;}
.carousel-caption {right: 5%;top:0%;left: 5%;padding:0}
#slider .owl-nav .owl-next, #slider .owl-prev{font-size: 30px;}
  .carousel-caption .subheading{font-size:20px}
.carousel-caption h1 {font-size:34px;margin:0}
#slider .btn-primary{padding:10px 35px;margin:10px 0;}
#service .heading,#facts .heading,#counter .heading, #testimonials .heading{padding:0;font-size:32px;}
#service .line,#facts .line,#counter .line, #testimonials .line{margin-left:35px;}
#testimonials .heading:before,#counter .heading:before{left:15%}
 .boxtxt{width:100%}
	.box{width:100%}
}

@media screen and (min-width: 501px) and (max-width: 600px) {
  .box{width:100%}
  .carousel-caption {right: 5%;top:0%;left: 5%;padding: 0;}
}
@media screen and (min-width: 501px) and (max-width: 768px) {
#bottom .col-md-3{width: 47%;float: left;}
#slider .item img{height:auto;}
.carousel-caption {right: 5%;top:10%;left: 5%;}
#slider .owl-nav .owl-next, #slider .owl-prev{font-size: 36px;}
.carousel-caption h1 {font-size: 36px;}
#slider .btn-primary{padding:10px 35px;margin:10px 0;}
}


@media screen and (min-width: 769px) and (max-width: 980px) {
#logo img{width: 50%;}
}

@media screen and (min-width: 769px) and (max-width: 1120px) {
#bottom .col-md-3{width: 47%;float: left;}
#slider .item img{height:auto}
.carousel-caption {right: 5%;top:5%;left: 5%;}
.carousel-caption h1 {font-size: 40px;}
#slider .btn-primary{padding:10px 35px;margin:10px 0;}
}