/**************************************************************** Services - Page *********************************************/

/* Focus on growth 
---------------------------------------------*/

/* Pricing Banner s2 
---------------------------------------------*/

.services-banner-s1-container {
display:grid;
grid-template-columns:1fr 1fr;
grid-auto-rows:auto;
background-color:#eff2f3;
padding:30px;
}

.services-banner-s1-item {
padding:100px 0px;

}

.services-banner-s1-item-title {
font-size:52px;
color:#5a6771;
font-weight:bold;
line-height:64px;
padding-right:30px;
}

.services-banner-s1-item-subtitle {
font-size:32px;
color:#d0d3d4;
font-weight:bold;
line-height:64px;
padding-right:30px;
}

.services-banner-s1-item-description {
font-size:22px;
padding:15px 0;
color:#5a6771;
}

.contact-sales-button {
padding:50px 0;
}

/* Pricing Banner 2 - Media Queries
---------------------------------------------*/

@media (min-width:320px) and (max-width:499px) {
.services-banner-s1-container {padding:50px 20px;}
.services-banner-s1-item-title {font-size:40px;line-height:normal;}
.services-banner-s1-item-description {font-size:18px;padding:25px 0;}
.services-sales-button {text-align:center;}
}

@media (min-width:498px) and (max-width:535px) {
.services-banner-s1-item-title{font-size:42px;}
}

@media (min-width:500px) and (max-width:1069px) {
.services-banner-s1-container{padding:50px 50px;}
}

@media (min-width:320px) and (max-width:1069px) {
.services-banner-s1-container{grid-template-columns:1fr;}
.services-banner-s1-item{padding:0px 0px;margin:0px;}
.services-sales-button{padding:20px 0;}
}

/* Who we work with 
---------------------------------------------*/

.wwww-section-container-header {
padding:50px 30px;
}

.wwww-grid-container-header{
display:grid;
grid-template-columns:minmax(450px, 65%);
/*grid-template-columns:repeat(2, minmax(0, 1fr));*/
grid-auto-rows:minmax(0px, max-content);
/*padding-top:50px;*/
}

.wwww-grid-item-header {
display:flex;
flex-direction:column;
align-items:left;
/*padding:0 30px;*/
}

.wwww-grid-item-heading-header {
font-size:50px;
font-weight:bold;
padding:20px 0;
}

.wwww-grid-item-subheading-header {
font-size:20px;
padding:0 0 20px 0;
}

.wwww-section-container {
padding:0 30px;
}

.wwww-grid-container {
display:grid;
grid-template-columns:repeat(4, minmax(0, 1fr));
grid-auto-rows:minmax(220px, max-content);
grid-gap:10px;
padding:50px 0;
/*background-color:#5a6771;*/
}

.ind-grid-container {
display:grid;
grid-template-columns:repeat(3, minmax(0, 1fr));
grid-auto-rows:minmax(220px, max-content);
grid-gap:2px;
}
.oco-grid-container {
display:grid;
grid-template-columns:repeat(3, minmax(0, 1fr));
grid-auto-rows:minmax(250px, max-content);
grid-gap:20px;
}

.wwww-grid-item {
display:flex;
flex-direction:column;
align-items:center;
padding:30px 30px 100px 30px;
/*background-color:#5a6771;*/
/*background-color: rgba(90, 103, 113, 0.4);*/
border-radius:10px;
position:relative;
}

.ind-grid-item {
display:flex;
flex-direction:column;
align-items:center;
padding:30px 30px 100px 30px;
background-color:#eff2f3;
border-radius:10px;
position:relative;
}

.wwww-promotile-img-60 {
width:100px;
}

.wwww-grid-item-heading {
font-size:30px;
font-weight:bold;
padding:20px 0 10px 0;
color:#d0d3d4;
}

.ind-grid-item-heading {
font-size:30px;
font-weight:bold;
padding:20px 0 10px 0;
color:#5a6771;
}

.wwww-grid-item-subheading {
font-size:15px;
padding:0 0 20px 0;
/*color:#d0d3d4;*/
color:#eff2f3;
text-align:center;
}

.ind-grid-item-subheading {
font-size:15px;
text-align:center;
padding:0 0 20px 0;
/*color:#d0d3d4;*/
color:#5a6771;
font-weight:normal;
}

.center-justify {
    width: 95%;              /* centres the block */
    margin: 0 auto;          /* auto margins = centred block */
    text-align: justify;     /* fully justified text */
    text-justify: inter-word;
	hyphens:auto;
}

.www-services-button-container {
text-align:center;
position:absolute;
bottom:60px;
right:30px;
left:30px;
}

/*** life at spotpush media queries ***/

@media (min-width:320px) and (max-width:599px) {
.wwww-grid-container {grid-template-columns: repeat(1, minmax(0, 1fr));}
}

@media (min-width:600px) and (max-width:920px) {
.wwww-grid-container {grid-template-columns: repeat(2, minmax(0, 1fr));}
}

@media (min-width:320px) and (max-width:499px) {
.wwww-section-header {font-size:28px;padding:20px 0;}
.wwww-grid-item img {width:50px;}	
}


/* Whats Included 
---------------------------------------------*/
/*
.services-outergrid-container {
margin:30px;
padding:30px 0 30px 30px;
background-color:#5a6771;
border-radius:10px;
}

.services-grid-container {
display:grid;
grid-template-columns:repeat(2, minmax(0, 1fr));
grid-auto-rows:auto;
grid-gap:1px;
margin:30px 0 30px 30px;
}

.services-grid-item {
display:flex;
flex-direction:column;
position:relative;
}

.services-grid-item-background {
background-size:cover;
background-position:left;
background-repeat:no-repeat;
}

.services-grid-item-background-pm {
background-image:url('../pages/casestudies/socialmobility/service-pm.png');
}
/*
.services-grid-item-background-po {
background-image:url('../pages/casestudies/socialmobility/service-po.png');
}

.services-grid-item-background-ddt {
background-image:url('../pages/casestudies/socialmobility/service-ddt.png');
}

.services-grid-item-background-sa {
background-image:url('../pages/casestudies/socialmobility/service-sa.png');
}
*/

/*
.services-grid-item-title {
font-size:18px;
font-weight:bold;
color:#fcb900;
padding-bottom:15px;
}
*/
/*
.services-grid-item-heading {
font-size:42px;
font-weight:bold;
line-height:52px;
padding-right:50px;
color:#eff2f3;
}

.services-grid-item-subheading {
font-size:18px;
font-weight:bold;
padding-right:50px;
padding-top:20px;
color:#eff2f3;
}

.services-grid-item-subheading:after {
display:block;
margin:40px 0 40px 0;
width:100%;
height:1px; 
background:#d0d3d4; 
content:""
}

.services-inner-grid-container {
display:grid;
grid-template-columns:repeat(2, minmax(0, 1fr));
grid-auto-rows:auto;
grid-gap:1px;
}
*/
.services-inner-grid-ol {
padding:0;
margin:0;
}

.services-inner-grid-ol img {
width:18px;
padding-bottom:5px;
color:#d0d3d4;
}

.services-inner-grid-ol ul {
font-size:14px;
line-height:28px;	
padding:0;
color:#eff2f3;
/*color:#5a6771;*/
}

/* Services Grid Media Queries
---------------------------------------------*/

@media (min-width:320px) and (max-width:499px) {

}

@media (min-width:500px) and (max-width:750px) {
.services-outergrid-container {margin:30px;}
.services-grid-container {grid-template-columns:repeat(1, minmax(0, 1fr));grid-auto-rows:auto 450px;margin:20px 0 0px 0px;}
.services-grid-item-title {font-size:16px;}
.services-grid-item-text1 {font-size:32px;}
.services-grid-item-text2 {font-size:16px;}
.services-inner-grid-container {grid-template-columns:repeat(1, minmax(0, 1fr));grid-auto-rows:auto;}
}


/* 5 phase approach 
---------------------------------------------*/

.pa-grid-container-header{
display:grid;
grid-template-columns:minmax(450px, 65%);
grid-auto-rows:minmax(0px, max-content);
padding:50px 30px;
}

.pa-grid-item-heading {
font-size:50px;
font-weight:bold;
}

.pa-grid-item-subheading {
font-size:20px;
/*padding-bottom:30px;*/
}

.pa-grid-container {
display:grid;
grid-template-columns:repeat(3, minmax(0, 1fr));
grid-auto-rows:auto auto;
grid-gap:15px;
margin:50px 30px 100px 30px;
}

.pa-grid-item {
display:grid;
}

.pa-button {
background-color:#ffffff;
border:1px solid #eff2f3;
color:#5a6771;
padding:30px;
text-align:left;
text-decoration:none;
display:inline-block;
cursor:pointer;
border-radius:5px;
}

.pa-button:hover {
color:inherit;
border:1px solid #5a6771;
}

.au-pa-button {
background-color:#5a6771;
border:1px solid #5a6771;
color:#5a6771;
padding:30px;
text-align:left;
text-decoration:none;
display:inline-flex;
align-items:center;
cursor:pointer;
border-radius:5px;
}

.au-pa-button:hover {
background-color:#5a6771;
border:1px solid #5a6771;
}

.pa-grid-item-title {
padding:15px 0;
font-size:24px;
font-weight:bold;
color:#fcb900;
}

.pa-grid-item-description {
font-size:14px;

}

/* Case Study Grid Media Queries
---------------------------------------------*/

@media (min-width:320px) and (max-width:649px) {
.pa-grid-container {grid-template-columns:repeat(1, minmax(0, 1fr));margin:0 20px;}
.pa-icon-config {float:left;padding:18px 20px 20px 0;}
}

@media (min-width:320px) and (max-width:499px) {
.pa-grid-item-description {font-size:20px;}
}

/* lb client logo banner
---------------------------------------------*/

.lb-client-logos-container {
display:grid;
grid-template-columns:repeat(6, 1fr);
grid-auto-rows:auto;
grid-gap:1px;
margin:50px 0;
padding:75px 0 75px 0;
background-color:#eff2f3;
}

.lb-client-logos-item {
display:flex;
align-items:center;
justify-content:center;
}

/* lb Client Logo Media Queries
---------------------------------------------*/

@media (min-width:320px) and (max-width:499px) {
.lb-client-logos-container {grid-template-columns:repeat(1, 1fr);margin:0 0;}
.lb-client-logos-item {padding:20px 80px;}
}

@media (min-width:500px) and (max-width:910px) {
.lb-client-logos-container {grid-template-columns:repeat(3, 1fr);grid-auto-rows:120px;}
}


/* Client feedback carousel 
---------------------------------------------*/
.slide { 
border:none !important;
background-color:#fff;
margin:30px 0;
}

.slide-grid-container {
display:grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
grid-template-rows:auto;
grid-gap:0px;
}

.slide-grid-container-left-item {
margin:0 30px 30px 30px;
border-radius:10px;
background-repeat:no-repeat;
background-position:center;
min-height:575px;
}

.slide1-img-background {
background-image: url("../images/carousel/img-slide1.jpg");
}

.slide2-img-background {
background-image: url("../images/carousel/img-slide2.jpg");
}

.slide3-img-background {
background-image: url("../images/carousel/img-slide3.jpg");
}

.slide4-img-background {
background-image: url("../images/carousel/img-slide4.jpg");
}

.slide5-img-background {
background-image: url("../images/carousel/corporate-headshot-grey-background.jpg");
}

.slide-grid-container-right-item {
padding:50px;
}

.carousel .carousel-indicators li {
width:0.6em;
height:0.6em;
border-radius:100%;
border:1px solid #323e48;
background-color:transparent;
}

.carousel .carousel-indicators li.active {
background-color:#fcb900;
}


/* Why Spotpsh? 
---------------------------------------------*/

.collapsible-faq-container {
padding:50px 30px;
/*background-color:#eff2f3;*/
}

.collapsible-grid-container-header{
display:grid;
grid-template-columns:minmax(450px, 65%);
grid-auto-rows:minmax(0px, max-content);
padding:50px 0;
}

.collapsible-grid-item-heading-header {
font-size:50px;
font-weight:bold;
padding:20px 0;
color:#5a6771;

}

.collapsible-grid-item-subheading-header {
font-size:20px;
}

.collapsible-services {
/*background-color:#eff2f3;*/
background-color:#fff;
/*color:#333f48;*/
cursor:pointer;
margin:30px 0 0 0;
width:100%;
text-align:left;
font-size:24px;
font-weight:bold;
outline:none;
border:none;
padding:30px 0 0 0;
color:#5a6771;
}

.collapsible-services:after {
content:url(../images/pricing/plus-solid.svg);
display:block;
width:28px;
float:right;
margin-left:20px;
}


.collapsible-services.active {
}

.collapsible-services.active:after {
content:url(../images/pricing/minus-solid.svg);
width:28px;
}

.content {
display:none;
overflow:hidden;
padding:20px 0 0 0 ;
margin-right:150px;
transition:max-height 5s ease-in-out;
}

.divider {
width:100%;
padding:20px 0;
border-bottom:1px solid #d0d3d4;
}

/* Pricing FAQ - Media Queries
---------------------------------------------*/

@media (min-width:320px) and (max-width:499px) {
.services-faq-header {font-size:38px;}
.content {margin-right:10px;font-size:12px;}
.collapsible-services {font-size:16px;padding:10px 0 0 0;}
.collapsible-services:after {width:14px;}
.active:after {width:14px;}
.divider{padding:10px 0;}
}


/* Pricing Banner 2 
---------------------------------------------*/

.services-banner-s2-container {
display:grid;
grid-template-columns:1fr 1fr;
grid-auto-rows:auto;
background-color:#5a6771;
padding:0 50px;
}

.services-banner-s2-item {
padding:100px 0px;
}

.services-banner-s2-item-title {
font-size:52px;
color:#fff;
font-weight:bold;
line-height:64px;
padding-right:30px;
}

.services-banner-s2-item-description {
font-size:22px;
padding:15px 0;
color:#d0d3d4;
font-weight:bold;
}

.contact-sales-button {
padding:50px 0;
}

.services-banner-s2-item-list {
font-size:16px;
color:#fff;
}

/* Pricing Banner 2 - Media Queries
---------------------------------------------*/

@media (min-width:320px) and (max-width:499px) {
.services-banner-s2-container {padding:50px 20px;}
.services-banner-s2-item-title {font-size:40px;line-height:normal;}
.services-banner-s2-item-description {font-size:18px;padding:25px 0;}
.services-sales-button {text-align:center;}
}

@media (min-width:498px) and (max-width:535px) {
.services-banner-s2-item-title{font-size:42px;}
}

@media (min-width:500px) and (max-width:1069px) {
.services-banner-s2-container{padding:50px 50px;}
}

@media (min-width:320px) and (max-width:1069px) {
.services-banner-s2-container{grid-template-columns:1fr;}
.services-banner-s2-item{padding:0px 0px;margin:0px;}
.services-sales-button{padding:20px 0;}
}