@charset "UTF-8";
/* CSS Document */

/* 1. Global Reset: Removes default browser spaces */
* { margin: 0; padding: 0; box-sizing: border-box; }
	
/* 2. Flexbox Layout: Forces elements to stack and fill the screen */
body { 
	font-family:Arial, Helvetica, sans-serif;
	margin: 0; padding: 0;
	background-color:#5e3478; 
	font-size:20px; 
}
body, h1, h2, h3, h4, h5, h6 { margin:0; padding:0; }

img, audio { width:100%; }

body .wrapperBODY {
  /* display: grid; */ 
  /* grid-template-rows: auto auto; */ 
  height: 100vh; /* Forces the layout to be exactly full-screen */
}


#firstDIV { width: 90%; margin: 0 0 0 4.5%; padding: 20px 0; position: relative; }

/* iPhone Layout: 481px to 768px. With all the styles of the Mobile Layout. */
/* - As Always  - */

/* START HEADER */
header {  }
.blockFloatL { float: left; vertical-align: top; display: flex; padding: 10px 0; flex-direction: column; }
.blockFloatL img { max-width: 100px; }

/* END HEADER */

/* START MAIN */

main { min-height: 900px; position: relative; margin: 0; padding: 0; background-color: #efefef; }

/* END MAIN */

/* START FOOTER */

footer { color: #fefefe;  width:100%; background-color: transparent; margin: 0; }

/* END FOOTER */

/* 1. The Main Big Bubble */
.sThink-bubble {
    position: relative;
    background: #fff; /* Your background color */
    color: #aaa;
    border-radius: 20px;
    padding: 10px 20px;
    width: 350px;
    text-align: center;
    margin: 5px auto 50px auto;
    /* left: 647px; top: 535px; height: 164px; */
    
    
}

/* 2. The 2nd Circle (Medium) */
.sThink-bubble::before {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 50px;
  width: 24px;
  height: 24px;
  background: #fff;
  border-radius: 50%;
}

/* 3. The 3rd Circle (Smallest) */
.sThink-bubble::after {
  content: "";
  position: absolute;
  bottom: -24px; /* Positioned below the 2nd circle */
  left: 35px;    /* Positioned slightly to the left */
  width: 14px;
  height: 14px;
  background: #fff;
  border-radius: 50%;
  
  /* Instantly clones a 4th circle if you ever want one, completely borderless */
  box-shadow: -10px 10px 0 -3px #fff;
}

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
@media only screen and (min-width: 481px) {

/* START HEADER */



/* END HEADER */

/* START MAIN */



/* END MAIN */

/* START FOOTER */



/* END FOOTER */

}


/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */ 
@media only screen and (min-width: 769px) {

/* START HEADER */

		#headerBLOCK { 
			float: left; 
			margin-left: 70px; 
			display: inline-block; 
		}

/* END HEADER */
	

		



}