/* @import url("fontawesome-all.min.css");
@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,600,600italic"); */

/*
	IdyllAc workspace of the mean page
*/

/* GLOBAL */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

body {
	margin: 0;
	padding: 0; 
	box-sizing: border-box;
	font: inherit;
	background-color: gray;
	line-height: 1px;
} 


  html {
	  box-sizing: border-box;
	  scroll-behavior:smooth;
	}  


 /* Container */

	/* .content {
		box-sizing: border-box;
		display: block;
		margin-top:0;
		background-color: rgba(27, 27, 27, 0.75);
		color: whitesmoke;
		padding: 1px 8rem;
		text-align: center;
		line-height: 0.5rem;
		font-size: small;
		position: sticky;
	    } */


    .responsive {
		   display: block;
	       margin: auto;
	       width: 60%;
	       height: auto;
        } 


  /* Image */
		
    img {
		display: block;
	    margin: auto;
		width: 60%;
		height: auto;
		padding-top: 20px;
    }

  

  
	/* Nav */
	
 	#nav {
		background-color: #333;
		margin: 0;
		padding: 0; 
		text-align: center;
		cursor: default;
	}

	 	/* #nav:after {
			content: '';
			display: block;
			width: 100%;
			height: 0.75em; 
			background-color: #37c0fb;
			background-image: url("images/bg01.png");
		} */


		#nav > ul {
			margin: 0;
		} 

			#nav > ul > li {
				position: relative;
				display: inline-block;
				margin-left: 1em;
			} 

				#nav > ul > li a {
					color: whitesmoke;
					text-decoration: none;
					border: none;
					display: block;
					padding: 1.7em 2.5em 1em 0.5em;
					font-size:clamp(1.7rem,3vw,1.5rem); 
				}

				#nav > ul > li:first-child {
					margin-left: 0;
				}


				/* #nav > ul > li.current {
					font-weight: 300;
				}  */


          				
			 /* #nav > ul > li.current:before {
						-moz-transform: rotateZ(45deg);
						-webkit-transform: rotateZ(45deg);
						-ms-transform: rotateZ(45deg);
						transform: rotateZ(45deg);
						width: 0.75em;
						height: 0.75em;
						content: '';
						display: block;
						position: absolute;
						bottom: -0.5em;
						left: 50%; 
						margin-left: -0.375em;
						background-color: #37c0fb;
				}  */

				#nav a:hover {
					color: orange;
					border-bottom-color: transparent;
				} 

				#nav a:active{
					color: limegreen;
					border-bottom-color: transparent;
				} 

			    /* #nav > ul > li.current a {
						color: #fff;
				} 

				#nav > ul > li.active a {
					color: limegreen;
				}

				#nav > ul > li.active.current:before {
					opacity: 0;
				}

				#nav > ul > li > ul {
					display: none;
				} 

				header a:hover {
					 color: orange;
					 border-bottom-color: transparent;
				}  */
				   

  /* BANNER */

  #banner {
	background-image: url("../img/banner.jpg");
        /* background-position: center; */
		background-size:cover;
		height: 5.8em;
		text-align: center;
		position: relative;
	}

		  #banner header {
			/* background-image: url("../img/banner.jpg"); */
			position:absolute;
            background-size:cover; 
			bottom: 0;
			left: 0;
            width: 100%;
		    background: rgba(27, 27, 27, 0.75); 
			height: 6em;
			align-content:center;
		} 
		
		 #banner header h1 {
			display:block;
			margin: auto;
			color:whitesmoke;
			padding: 1.5em 0 2em 0;
			font-family: Georgia, 'Times New Roman', Times, serif;
			letter-spacing: 1px;
			font-size:clamp(2.75rem,5vw,1.5rem);
		}


   /* Wrapper */

		 .wrapper {
			background-image: url("../img/banner.jpg");
			background-size:cover; 
			margin: 30px;
			padding: 0.5em 0 2rem 0; 
			height: auto;
			font-size:clamp(1rem,3vw,3rem);
		} 

		.major h2 {
			display: block;
		    margin: auto;
			text-align: center; 
			color: bisque;
			line-height: 130%;
			letter-spacing: 1px;
			font-size:clamp(1.5rem,1.5vw,1.5rem);
		}


        .major h3 {
		display: block;
		margin: auto;
		color:lime;
		text-align: center;
		padding: 1rem;
		/* padding-right: 5px; */
		line-height: 130%;
		letter-spacing: 1px;
		font-size:clamp(1rem,1.5vw,1.5rem);
        }

		.major h4 {
			display: block;
		margin: auto;
		color:blanchedalmond;
		text-align: center;
		padding: 1rem;
		padding-right: 5px;
		line-height: 130%;
		letter-spacing: 1px;
		font-size:clamp(1rem,1.5vw,1.5rem);
		}

		
	
		.btn-link {
			display: block;
			margin: auto;
			width:40%;
			height: 3rem;
			text-align: center;
			background-color: green;
			color: whitesmoke;
			border-radius: 5px;
			border: none;
			padding: 6px;
			line-height: 2rem;
			text-decoration: none; /* remove underline */
			cursor: pointer;
			font-size:clamp(1rem,3vw,2rem);
		  }
		  
		  .btn-link:hover {
			background-color: darkgreen;
			color: #fff;
		  }

		  .btn-link:active {
			background-color: limegreen;
		  }