/******************** NOTIFICATIONS *********************/ 
/* overlay */    
#NotifOverlay {  
    display: none; 
	width: 100%;
	height: 100vh; 
	position: fixed;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px; 
    z-index: 9999999999;   
    opacity: 0; 	
	background-color: rgba(0,0,0,0.8);  
}

/* notif */ 
#NotifOverlay #Notif {
	width: 400px;
	height: 70px; 
	position: absolute;
	top: -120px;  
	right: 100px;  
	opacity: 0; 
	background-color: white;   
    border-radius: 35px;     	
}
 
/* image */ 
#NotifOverlay #Notif #Image {
	width: 60px;
	height: 60px; 
	position: absolute;
	top: 5px; 
	left: 5px;   
	background-color: rgb(128,0,0);   
	border-radius: 100%;
}

#NotifOverlay #Notif #Image img { 
    width: auto; 
	height: 20px;  
    position: absolute; 
	top: 20px; 	
	left: calc(50% - 8px);   
}

/* information */ 
#NotifOverlay #Notif #Information {
	width: 280px;    
	height: auto;  
	position: absolute;     
	left: 75px; 
	line-height: 1;     
}

#NotifOverlay #Notif #Information h1 {
	font-size: 12px; 
	font-weight: bold; 
	color: black; 
}

#NotifOverlay #Notif #Information p {
	margin-top: 5px; 
	font-size: 10px; 
	font-weight: 300;  
	color: black;    
}

/* close */ 
#NotifOverlay #Notif #Close {
	width: 30px; 
	height: 30px;
	position: absolute;
	top: calc(50% - 15px);  
	right: -12px; 
	cursor: pointer; 
	background-color: rgb(200,200,200);  
	border-radius: 100%; 
	transition: 500ms;    
} 
 
#NotifOverlay #Notif #Close img {
	display: block;
	height: 20px;    
	position: relative;
	top: 5px;  
} 

#NotifOverlay #Notif #Close:hover {   
	background-color: rgb(128,0,0);   
	transform: rotate(360deg); 
}


 

 


             
/******************** WELCOME SECTION *********************/ 
#WelcomeSection {       
    width: 100%;
	height: 100vh; 
} 
  
/* content */
#WelcomeContent {
   width: 100%;
   height: auto;
   position: absolute;
   top: calc(50% - 50px);  
   text-align: center; 
   color: black;
}

#WelcomeContent h1 {
   font-size: 60px; 
   font-weight: 900; 
   color: rgb(128,0,0);
}

#WelcomeContent p {
   font-size: 18px; 
   font-weight: 300;    
} 

/* images */ 
#WelcomeCarSec1 .carimg { 
   background-image: url("../../Assets/Images/Welcome/1.jpg");  
}







          
/******************** MISSION SECTION *********************/
#MissionSection {                             
    width: 800px;   
	height: auto;  
	padding-bottom: 50px;  
	text-align: center; 
}  

/* header */
#MissionSection .missionheader {
    margin-top: 50px;
    font-size: 30px; 
    font-weight: 100;
    font-style: italic;
    color: black;
}

#MissionSection .missionheader.two {
    margin-top: 100px; 
}

#MissionSection .missionheader span {
    cursor: pointer;
    font-weight: 500;
    color: rgb(128,0,0);
}
 
/* bar */
#MissionBar {
    width: 40px; 
    height: 12px;  
    margin: 60px auto 70px;    
    background-color: rgb(128,0,0);
}  

/* col */ 
#MissionSection .col { 
    display: inline-block; 
	width: 35%;  
	height: auto;     
	vertical-align: top;  
	text-align: left;    
}
 
#MissionSection .col.one { 
    margin-right: 100px;
} 
  
#MissionSection .col.two {   
    margin-left: 100px; 
}

/* h1 */
#MissionSection .col h1 {  
    font-size: 50px;
    font-weight: 900; 
    font-variant: small-caps;
    line-height: 0.7;
    color: rgb(128,0,0);
}

#MissionSection .col h1 span { 
    font-weight: 100;
    color: black;
}

/* p */
#MissionSection .col p {
    margin-top: 5px;  
    font-size: 16px; 
    font-weight: 300;
    color: black;
}    

#MissionSection .col p {
    margin-top: 30px;  
}

/* bullet */ 
#MissionSection .col p span { 
   position: relative;
   bottom: 3px;
   font-size: 20px;
   font-weight: bold;
   color: rgb(128,0,0);
}


 



 
          
/******************** SERVICES SECTION ********************/
#ServicesSection {                                                                                      
	width: 100%;
    height: 100vh;  	 
}   

/* p */
#ServicesSection .carouseloverlay p { 
   width: 500px; 
   height: auto;
   padding: 15px 0px; 
   position: absolute;
   top: calc(50% - 40px); 
   left: calc(50% - 250px); 
   z-index: 9;
   cursor: pointer;
   text-align: center;
   font-size: 25px;
   font-weight: 900; 
   line-height: 1; 
   color: black; 
   transition: 400ms;   
}  
 
/* controls */
#ServicesSection .carouselcontrols { 
   top: calc(50% + 200px);     
   z-index: 99;   
   transform: rotate(90deg);  
}

#ServicesSection .carouselcontrols .inner {
   width: 50px;  
}

/* a */
#ServicesSection .carouseloverlay #LearnMore {
   display: block;
   width: 100px;
   height: 40px;
   padding-top: 12px;
   position: absolute;
   z-index: 999; 
   top: calc(50% + 50px);
   left: calc(50% - 50px); 
   background-color: white;
   text-align: center;
   font-size: 13px;
   font-weight: 300;
   color: black;
   transition: 1s;
}

#ServicesSection .carouseloverlay a:hover { 
   background-color: black;
   color: white;
} 
 
/* images */  
#ServicesCarSec1 .carimg {
   background-image: url("../../Assets/Images/Services/1.jpg");
}

#ServicesCarSec2 .carimg {
   background-image: url("../../Assets/Images/Services/2.jpg");
}

#ServicesCarSec3 .carimg {
   background-image: url("../../Assets/Images/Services/3.jpg");
}

#ServicesCarSec4 .carimg {
   background-image: url("../../Assets/Images/Services/4.jpg");
}

#ServicesCarSec5 .carimg {
   background-image: url("../../Assets/Images/Services/5.jpg");
}
 
/* cont */
#ServicesCarouselContent { 
   width: 600px;
   height: 60px;
   position: absolute;
   top: 350px;
   right: 0px;
   z-index: 99;  
   transform: rotate(90deg);   
}
 
#ServicesContSec {
   width: 100%;
   height: 100%; 
   position: absolute;
   top: 0px;
   left: 0px;  
}

#ServicesContCirc {
   display: inline-block;
   width: 60px;
   height: 60px; 
   background-color: white;
   border-radius: 100%;  
   transform: rotate(-90deg); 
}
 
#ServicesContSec #TypewriterTextTwo { 
   display: inline-block;
   height: 60px; 
   margin-left: 20px;
   padding-top: 15px; 
   vertical-align: top;     
   font-size: 35px;
   font-weight: 100; 
   word-spacing: 10px;
   letter-spacing: 2px;
   line-height: 1;  
   color: black;   
}