@charset "utf-8";
/* CSS Document */
/* 4S International Solutions Styles */

/* Adjust for Extra Small devices (Phones) when the screen is less than 767 pixels wide */
@media only screen and (max-width:767px){
  #CarouselImageXS  {display: block;}
  #CarouselImageLG  {display: none;}
  .UniNavbarXS		{display: block;}
  .UniNavbarLG		{display: none;}
  }
  
/* Adjust for other devices when the screen is more than 768 pixels wide */
@media only screen and (min-width:768px){
  #CarouselImageXS  {display: none;}
  #CarouselImageLG  {display: block;}
  .UniNavbarXS		{display: none;}
  .UniNavbarLG		{display: block;}
  }

/* Control Carousel Image size and behavior */
.carousel-inner img {margin: auto; min-height: 200px;}
  /*width: 100%;*/ /* Set width to 100% */

/* Hide Carousel Caption */		
.carousel-caption {display: none;}

/* Remove the navbar's default margin-bottom and rounded borders and menu button*/ 
.navbar 		{margin-bottom: 0; border-radius: 0; min-height: 80px;}
.UniNavbarXS	{position: relative; float: right; margin-top: 10px; margin-right: 15px;}
.UniNavbarLG	{margin-top:10px;}

/* Define Fixed Position for Header Image, Carousel and NavBar */
.header	 	 {position: fixed; top: 0; left: 0; width: 100%; background: #f5f5f5; z-index: 1;}
.carousel	 {position: fixed; top: 0; left: 0; width: 100%; background: #f5f5f5; z-index: 1;}
.navbar		 {position: fixed; top: 200px; left: 0; width: 100%; z-index: 2;}
.S-Container {margin-top: 280px;}
.S-Spacer	 {padding-bottom: 264px;}

/* Add a gray background color and some padding to the footer */
footer {background-color: #f2f2f2; padding: 25px;}

/* Hide conditional fields */
.UniHidden	{display: none;}

/* Make required field indicator color red */
.UniRequired	{color: #F00;}

/* Hide multi step form sections */
.UniSection		{display: none;}

/* Make circles that indicate the steps of the form: */
.step {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbbbbb;
  border: none; 
  border-radius: 50%;
  display: inline-block;
  opacity: 0.5;
}

/* Mark the active step: */
.step.active {
  opacity: 1;
}

/* Mark the steps that are finished and valid: */
.step.finish {
  background-color: #4CAF50;
}