/*****************************************************************************/
/*
/* Common
/*
/*****************************************************************************/



* {
  margin: 0;
  padding: 0;
}

html, body {

} 


.header {
    margin-bottom: 25px;
}



#clouds {
    z-index: -1;
    background: url('../images/bg/clouds.png');
}

/* 

@keyframes float-clouds {
    0% {
        background-position: 2400px 0;
    }
    100% {
        background-position: 0 0;
    }
}

@-moz-keyframes float-clouds {
    0% {
        background-position: 2400px 0;
    }
    100% {
        background-position: 0 0;
    }
}
@-webkit-keyframes float-clouds {
    0% {
        background-position: 2400px 0;
    }
    100% {
        background-position: 0 0;
    }
}

#clouds {
      -webkit-animation-name: float-clouds;
      -webkit-animation-duration: 95s;
      -webkit-animation-iteration-count: infinite;
      -webkit-animation-timing-function: linear;
        -moz-animation-name: float-clouds;
        -moz-animation-duration: 95s;
        -moz-animation-iteration-count: infinite;
        -moz-animation-timing-function: linear;
        animation-name: float-clouds;
        animation-duration: 95s;
        animation-iteration-count: infinite;
        animation-timing-function: linear;
    }

*/ 


body {
  background-color: #eeffec; 
  background:url('../images/bg/bg.jpeg'); 
  background-repeat: repeat; 
  font: 13.34px helvetica, arial, clean, sans-serif;
  font-size: small; 
	
} 



	#wshop{
		background-image: url('../images/menu/wshop.png') ;
	}
	#wshop:hover{
		background-image: url('../images/menu/wshop2.png') ;
	}
	
	#people{
		background-image: url('../images/menu/people.png') ;
	}
	#people:hover{
		background-image: url('../images/menu/people2.png') ;
	}
	
	#project{
		background-image: url('../images/menu/project.png') ;
	}
	#project:hover{
		background-image: url('../images/menu/project2.png') ;
	}
	
	#tech{
		background-image: url('../images/menu/tech.png') ;
	}
	#tech:hover{
		background-image: url('../images/menu/tech2.png') ;
	}
	
	.myButtonLink {
		display: inline-block;
		width: 98px;
/* 		height: 105px; */
		background-position: 0 0;
		background-repeat: no-repeat;
		margin:0px;
		padding-top:95px;
		text-align: center;
		overflow: hidden;
		color:black;
		font-weight: bold;
	}
	.myButtonLink:hover{
		color:#34494C ;
	} 

	.content{
		background-color: rgba(255,255,255,0.9);
		box-shadow: 10px 0px 10px rgba(0,0,0,0.1) , -10px 0px 10px rgba(0,0,0,0.1);
		min-height: 500px;
		padding: 15px;
		padding-bottom: 50px;
		margin-bottom: 30px;
		margin-top: 30px !important;
	} 

	.content2 {
		background-color: rgba(255,255,255,0.9);
		box-shadow: 10px 0px 10px rgba(0,0,0,0.1) , -10px 0px 10px rgba(0,0,0,0.1);
		padding: 15px;
		padding-bottom: 50px;
		margin-bottom: 30px;
		margin-top: 30px !important;
	} 


	.gamelistitem {
		background-color: rgba(255,255,255,0.9);
		box-shadow: 10px 0px 10px rgba(0,0,0,0.1) , -10px 0px 10px rgba(0,0,0,0.1);
		margin-bottom: 0px;
		margin-top: 30px !important;
	} 

	.peoplelistitem {
		background-color: rgba(255,255,255,0.9);
		box-shadow: 10px 0px 10px rgba(0,0,0,0.1) , -10px 0px 10px rgba(0,0,0,0.1);
		margin-bottom: 0px;
		margin-top: 30px !important; 
		height: 175px; 
	} 


	.itemlist p {
	
		font-size: 11px;
		line-height: 1.25;
		margin: 0 0 18px; 
		text-transform: capitalize; 
		text-align: center;
		margin: 5px;
		color: #BA2E3A;
		font-weight: bold;
	} 



	.notification { 
		background-color: rgba(255, 0, 0, 0.7);
		font-size: 15px;
		line-height: 1.25;
		text-transform: capitalize; 
		color: #fff;
		font-weight: bold;
	}



	
	
	.menu { 
	    text-align: center;
	    padding-left: 0px; 
    } 
	
	footer{
		background-color: rgba(0,0,0,0.68);
		margin-top: 100px;
		padding-top:30px;
		color:white; 
		padding: 12px; 
	}
	#man{
		background-image: url('../images/menu/man.png') ;
		position: absolute;
		top:200px;
		left:-120px;
		width: 104px;
		height: 159px;
		background-repeat: no-repeat;
	}

	#woman{
		background-image: url('../images/menu/woman.png') ;
		position: absolute;
		top:50px;
		left:700px;
		width: 75px;
		height: 157px;
		background-repeat: no-repeat;
	}
	body:after
	{
		content:url('../images/menu/tech2.png') url('../images/menu/project2.png')   url('../images/menu/wshop2.png') url('images/menu/people2.png')
		display: none;
	}
	
	h1{
		color:#BA2E3A;
		font-size: 1.5em;	
	}
	
	h2{
		color:#33484C;
		font-size: 1.2em;	
	}

	div.module{
		padding-left: 10px;
		/* background-color: #F2FEFF; */
		border-width: 1px;
		border-color:#9EDDE6;
		border-style: dashed; 
		margin-top:20px;
		margin-bottom: 20px;
		padding: 10px;
	}
/*
	.myButtonLink:hover {
		background-position: 106 0;
	}
*/
	


.listaitem {
    padding: 12px;
    margin-bottom: 25px;

}


.listaitem .six {
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 5px;
    padding: 12px;


}


.listaitem img {
   /* border: 2px solid black; */ 
}

.menuitem { 

    float: left;
    /* text-align: center; */
}

.people { 

    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 2px;
    border: 0px solid rgba(0, 0, 0, 0.2);
    text-align: center;    
    
} 

.people p { 
    font-family: sans-serif;
    color: grey;
    
}

.underlined { 
    border-bottom: 1px solid;
    
}

.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0; 
	margin-bottom: 20px;
} 

.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


