/*to change any style of any element , open the developers tool on your browser, select the element and
edit the styles on the right side.*/


 /*background-image is of darker shade, either choose a different background-image with lighter background 
 or choose colors as suggested*/

/*choose either of them*/
body {
.scan-tool-business-logo {
    max-height: 200px;
    max-width: 500px;
}
.steps-control span{
  float: left;
  font-size: 11px;
  letter-spacing: 1.5px;
  padding-left: 10px;
  width: 85px;

  background: linear-gradient(135deg, #7F00FF 0%, #E100FF 50%, #FF4FD8 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;

}

.steps-wrapper h1 {
    color: #fff;
    font-size: 2.2rem;
    font-weight: 400;
    margin-bottom: 5px;
    margin-top: 45px;
    letter-spacing: -.5px;
}

.steps-wrapper label {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    margin-bottom: 10px;
}	

/*if you want to keep the background-image, apply these styles*/
	
/*these lines will affect the color and font-size of the form input fields*/
	.form-control{
		font-size: 16px;
		color: #00000;
	}

/*this line will affect the color of the elements mentioned below respectively:
	"location:hover span", "small-control", "on-select span" will affect the color of text below 3 business types,
	".steps-control span" will affect color of the 4 steps on top of the page
*/

	.location:hover span, .on-select span, .small-control, .steps-control span {
	    color: #000;
	}

/*these lines will position the background image so that the text of the page is properly visible	*/
	body {
	    background-position: 175px 0;
        background-image: url(http://interactivesynergy.com/wp-content/uploads/2017/02/website-design-fp-bg.png);
	}

/*this line will affect the color of "what kind of business do you run" text*/
.steps-wrapper h1{
  background: linear-gradient(180deg, #e101e9 0%, #810ee5 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}


/*this line will affect the color of the heading text of the form */
.steps-wrapper label{
  background: linear-gradient(180deg, #e101e9 0%, #810ee5 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

/*this line will affect the color of "check status now" button at the bottom of the page*/
.btn-status{
  background: linear-gradient(180deg, #e101e9 0%, #810ee5 100%);
  color: #fff;
}

}

/*this line will affect the color of "check status now" button when it's hovered over*/
.btn-status:hover{
  background: linear-gradient(0deg, #e101e9 0%, #810ee5 100%);
}
}

/*style for the scan-result page*/

/*this line will affect the top left most box with scan-meter in it*/
.chart-analyse{
  background: linear-gradient(180deg, rgba(225,1,233,.85) 0%, rgba(129,14,229,.85) 100%);
  border: 1px solid rgba(129, 14, 229, 0.45);

}

/*this line will affect the style of the fix now button*/
.btn-fix{
  background: linear-gradient;
  color: #fff;
  border: none;
}

}

/*this line will affect the styles of the color of text in the top left box */
.chart-details{
	color: #d90000;
}

/*this will affect the color of the number of inaccurate sites*/
.inaccurate span{
	color: #df0000;
}

/*this will affect the color of the number of accurate sites*/
.accurate span {
    color: #4ec353;
}

/*this will affect the color of the number of not found sites*/
.found span {
    color: #a5a5a5;
}

/*this will affect the color of the number of total found sites*/
.total-site span {
    color: #444;
}

/*this will affect the styles of text of the listing company's name in the scan detail tiles*/

.each-listner-profile>span{
    color: #333;
}

/*this will affect the color of the customer name heading in the scan detail tiles*/
.each-listner-profile>a{
  background: linear-gradient(135deg, #7F00FF 0%, #E100FF 50%, #FF4FD8 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;

}

/*this will affect the color of the 'user-address' and 'user-phone number' in the scan detail tiles*/
.user-address, .user-phone{
	font-size: 14px;
	color: #333;
}

/*this will affect the styles of the "view listing" link in the scan detail tiles */
.each-listner-profile>a{
    color: #3596da;
}
/*this will affect the footer background color*/
.bg-green {
  background: linear-gradient(180deg, #e101e9 0%, #810ee5 100%);
  transition: background 0.3s ease, box-shadow 0.3s ease, transform 0.2s ease;
}

.bg-green:hover {
  background: linear-gradient(180deg, #ff2fe6 0%, #6f0bd1 100%);
  box-shadow: 0 12px 36px rgba(129, 14, 229, 0.45);
}
