html, body {
	width: 100%;
	height: 100%; 
	margin: 0px; 
	padding: 0px;
	overflow-x: hidden;
}


.scl li{
    list-style: none;
    display: inline;
}
.stmp {
    
    padding:0px;
    margin:0px;
}

.stmp li{
    list-style:none;
    color:#fff;
    text-align:left;
}
.faq {
  list-style: none;
  width: 94%;
  padding: 3%;
  max-width: 800px;
  margin: 0 auto;
  li {
    margin-bottom: 1em;
    position: relative;
  }
}

.faq-q {
  cursor: pointer;
  font-size: 22px;
  font-weight: 600;
  background: darken($color, 25%);
  padding: .5em;
  border-radius: 5px;
  &:hover {
    background: darken($color, 20%);
  }
}

.faq-a {
  display: none;
  font-size: 16px;
  font-weight: 400;
  position: relative;
  margin-left: 5px;
}


#introduction {
  background:  url("https://intercom123.com/999.jpg") 0% 0%/cover;

}

.bg-image {
  /* The image used */
  background-image: url("https://intercom123.com/f.png");
  margin-left: 567px;


padding: 20px;
}

.bg-image2 {
  /* The image used */
  background-image: url("https://intercom123.com/f.png");

  margin-left: 567px;

padding: 51px;
}

.bg-image3 {
  /* The image used */
  background-image: url("https://intercom123.com/f2.png");


padding: 51px;
}



.bg-image4 {
  /* The image used */
  background-image: url("https://intercom123.com/222.jpg");

padding: 51px;
}


.bg-image6 {
  /* The image used */
  background-image: url("https://intercom123.com/24.jpg");

padding: 51px;
}

.bg-image5 {
  /* The image used */
  background-image: url("https://intercom123.com/f3.png");

margin: auto;

  padding: 20px;
}

#info-3 {
  background:   url("https://intercom123.com/100.jpg") 0% 0%/cover;


}


#info-300 {
  background:   url("https://intercom123.com/1/f.jpg") 0% 0%/cover;


}



#rating {
    box-sizing: border-box;
  padding-top: 1px;
	margin: auto;
  width: 50%;
  padding: 10px;


}

body1 {
    font-family: Arial;
    margin: 0 auto; /* Center website */
    max-width: 800px; /* Max width */
    padding: 20px;
}

.heading1 {
    font-size: 25px;
    margin-right: 25px;


}

.fa {
    font-size: 25px;
}

.checked {
    color: orange;
}

/* Three column layout */
.side {
    float: left;
    width: 14%;
    margin-top:6px;
}

.middle {
    margin-top:10px;
    float: left;
    width: 59%;
}

/* Place text to the right */
.right {
    text-align: right;
}

/* Clear floats after the columns */
.row:after {
    content: "";
    display: table;
    clear: both;
}

/* The bar container */
.bar-container {
    width: 100%;
    background-color: #ffffff;
    text-align: center;
    color: white;
}

/* Individual bars */
.bar-5 {width: 60%; height: 18px; background-color: #2B2B2B;}
.bar-4 {width: 30%; height: 18px; background-color: #606060;}
.bar-3 {width: 10%; height: 18px; background-color: #808080;}
.bar-2 {width: 4%; height: 18px; background-color: #404040;}
.bar-1 {width: 15%; height: 18px; background-color: #808080;}

/* Responsive layout - make the columns stack on top of each other instead of next to each other */
@media (max-width: 400px) {
    .side, .middle {
        width: 100%;
    }
    .right {
        display: none;
    }
}






#info-34 {
  background: url("https://intercom123.com/111.jpeg") 0% 0%/cover;
}


#introduction5 {
  padding-top: 1px;
    background-color: #404040;


}


#bg-image43 {

	 padding-top: 1px;
    background-color: #ffffff;

}

#contact {
  background: , 0% 0%/cover;
  padding-top: 100px;
  background-color: white;


}


#feature-rundown img {
  width: 120px;

}


/* pop UP The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: #ffffff; /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
  background-color: #ffffff;
  margin: 15% auto; /* 15% from the top and centered */
  padding: 20px;
  border: 1px solid #888;
  width: 50%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}





/* contact us--------------------------------------------------- */
/* Style inputs with type="text", select elements and textareas */
input[type=text], select, textarea {
  width: 100%; /* Full width */
  padding: 12px; /* Some padding */
  box-sizing: border-box; /* Make sure that padding and width stays in place */
  margin-top: 6px; /* Add a top margin */
  margin-bottom: 16px; /* Bottom margin */
  resize: vertical /* Allow the user to vertically resize the textarea (not horizontally) */
}

/* Style the submit button with a specific background color etc */
input[type=submit] {
  background-color: #4CAF50;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

/* When moving the mouse over the submit button, add a darker green color */
input[type=submit]:hover {
  background-color: #45a049;
}

/* Add a background color and some padding around the form */
.container {
  border-radius: 5px;
  padding: 20px;
}

.container1 {
  border-radius: 5px;
  padding: 78px;
    background-color: white;


}



/* contact us--------------------------------------------------- */


/* Style the navigation menu */
.navbar {
  width: 100%;
  background-color: #555;
  overflow: auto;
  padding: 0px;
  margin: 0px;
}

/* Navigation links */
.navbar a {
  float: left;
  padding: 12px;
  color: white;
  text-decoration: none;
  font-size: 17px;
  width: 20% !important; /* Four equal-width links. If you have two links, use 50%, and 33.33% for three links, etc.. */
  text-align: center; /* If you want the text to be centered */
}



/* Add a background color on mouse-over */
.navbar a:hover {
  background-color: #000;
}

/* Style the current/active link */
.navbar a.active {
  background-color: #4CAF50;
}

/* Add responsiveness - on screens less than 500px, make the navigation links appear on top of each other, instead of next to each other */
@media screen and (max-width: 500px) {
  .navbar a {
    float: none;
    display: block;
    width: 100%;
    text-align: left; /* If you want the text to be left-aligned on small screens */
    font-size: 10px;
  }
  
  

}




/*-===== dev ===== */
.debug {
  border: 2px solid red;
}
/*============ Utility classes.
 Use swush for faster ease of development ============*/

.fill-viewport {
  min-height: 100vh
}
.fill-40-viewport {
  min-height: 40vh
}
.fill-80-viewport {
  min-height: 80vh
}
.fill-90-viewport {
  min-height: 90vh
}
.jumbotron-transparent {
  background-color: transparent
}
.text-white-70 {
  color: rgba(255,255,255,0.7);
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
}
.text-black-70 {
  color: rgba(0,0,0,0.7)
}
.text-black-40 {
  color: rgba(0,0,0,0.4)
}
.text-white-40 {
  color: rgba(255,255,255,0.4)
}

/*== 1.
  1. Borders along x an y
  2. Borders with colors i.e the shades of white and gray above
  3. Unordered list with borders all round
  4. Unordered list with borders along y, as in pricing table here
  5. Border size class*/

.list-border-y li {
  border-top: 1px solid
}
.list-border-y li:last-child {
  border-bottom: 1px solid
}
.list-border-black-20 li,
.list-border-black-20 li:last-child{
  border-color: rgba(0,0,0,0.2)
}




@media screen and (min-width: 768px ){
  /*need to set flex-basis and have it dependent on size too
  usage tip: if you want the element to NOT be positioned in the
  center, add this class to a non `.container` div. Container divs in
  bootstrap are styled to seat in the center of the page.
  */
  .basis-md-50 {
    flex-basis: 50%
  }
}