/*---------------------------------
###################################
-----------------------------------
    Name: Tranquilidade Public Site
    Author: Unipartner.com
-----------------------------------
###################################
---------------------------------*/

/*-------------------------------------------------
	Message Box Pop-up
---------------------------------------------------*/
	
	.#messageBox.message-box {
		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: rgb(0,0,0); /* Fallback color */
		background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
	}
	
	.message-box {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 100000;
		width: 100vw;
		height: 100vh;
		background: rgba(200,200,200,0.8);
		display: none;
	}
	
	.message-box .message-box__flex-wrapper {
	    justify-content: center;
		align-items: center;
		display: flex;
		width: 100%;
		height: 100%;
	}
	
	.message-box .message-box__container {
		position: relative;
		width: 85%;
		height: 85%;
		max-width: 630px;
		max-height: 400px;
		background: var(--white);
		padding: 20px 10px;
		border: 2px solid var(--white);
		-webkit-box-shadow: 0 0 30px 2px;
		-moz-box-shadow: 0 0 30px 2px;
		box-shadow: 0 0 10px 0 rgb(0 0 0 / 75%);
		display: flex;
	}
	
	@media screen and (min-width: 768px){
		.message-box .message-box__container {
			padding: 20px 90px;
		}
	}
	
	.icon-close-x:before {
		content: "\00d7"; /* This will render the 'X' */
	}
	
	[class^="icon-"], [class*=" icon-"] {
		speak: none;
		font-style: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		cursor: pointer;
		line-height: 1;
		/* Better Font Rendering =========== */
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale; 
	}
	
	span.__icon.icon-close-x:hover {
		color: var(--black);
		text-decoration: none;
		cursor: pointer;
	}
	
	.message-box .message-box__container .close {
		background: 0;
		border: 0;
		font-size: 24px;
		color: #939494;
		position: absolute;
		right: 6px;
		top: 6px;
		outline: 0;
		padding: 0;
	}
	
	.message-box .message-box__container .message-box__wrapper {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      width: 100%;
      height: 100%; }
	  
		.message-box .message-box__container .message-box__wrapper .title {
			font: 700 26px/1.2 var(--font-Roboto), sans-serif;
			color: var(--Primary-G4);
			text-align: center;
		}
		
        @media screen and (min-width: 768px) {
			.message-box .message-box__container .message-box__wrapper .title {
				font: 700 30px/1.2 var(--font-Roboto), sans-serif;
				color: var(--Primary-G4); 
			} 
		}
		
		.message-box .message-box__container .message-box__wrapper .message {
			margin: 20px 0; 
		}
        
		.message-box .message-box__container .message-box__wrapper .message p {
			font: 500 16px/1.2 var(--font-Roboto), sans-serif;
			margin-bottom: 0;
			text-align: center; 
		}
          
			@media screen and (min-width: 768px) {
				.message-box .message-box__container .message-box__wrapper .message p {
					font: 500 16px/1.2 var(--font-Roboto), sans-serif; 
				}
			}
        
			.message-box .message-box__container .message-box__wrapper .message li {
				font: normal 16px/1.2 var(--font-Roboto), sans-serif;
				text-align: left; 
			}
		
		.message-box .message-box__container .message-box__wrapper .cpt004 a {
			line-height: 1.2; 
		}
		
		.cpt004 a.cpt004--normal {
			background-color: var(--button-color);
			border: 0;
			color: var(--white);
		}
		
		.cpt004 a {
		   display: inline-block;
			border-radius: 5px;
			background-color: var(--white);
			border: solid 1px #2da944;
			padding: 20px 30px 16px;
			font-family: var(--font-Roboto);
			font-weight: bold;
			font-size: 14px;
			line-height: 0.9;
			letter-spacing: 1.4px;
			text-align: center;
			text-transform: uppercase;
			color: #2da944;
		}
	
	.message-box.warning .message-box__container {
		border-color: var(----TRQ-Icons-Amarelo); 
	}
	
	.message-box.error .message-box__container {
		border-color: #f00; 
	}
    
	.message-box.error .message-box__container .title {
		color: #f00; 
	}
	
	.message-box.success .message-box__container {
		border-color: var(--Primary-G4); 
	}
    
	.message-box.success .message-box__container .message {
		color: #000; 
	}
/*-------------------------------------------------
	End Message Box Pop-up
---------------------------------------------------*/
	