/* ------------General ----------------- */
.dropDownContent a {
	background-color: rgba(0, 0, 0, 0.7);
}
h1 {
	color: #7b7b7b;	
}
.aboutTitleGroup {
	width: 100%;
}
.aboutPageTitle {
	padding-top: 150px;
	max-width: 1080px;
	margin: auto;	
}
.aboutText {
	width: 70%;
	max-width: 800px;
	margin: auto;	
}
.aboutText p {
	display: block;
	margin-left: auto;
	margin-right: auto;
	padding: 60px 0 100px 0;
}
.methodologyTitle {
	max-width: 1046px;
	padding: 100px 0 0 0;
	margin: auto;
}
.methodologyText {
	width: 70%;
	max-width: 800px;
	margin: auto;		
}
.methodologyText p {
	display: block;
	margin-left: auto;
	margin-right: auto;
	padding: 60px 0 100px 0;
}
.containerAboutStrip {
	width: 100%;
}
.stripImg {
	width: 100%;
	box-sizing: border-box;
}
.exhibitTitle {
	max-width: 1046px;
	margin: auto;
}
.exhibitList {
	width: 70%;
	max-width: 800px;
	margin: auto;
	padding: 60px 0 30px 0;
}
.exhibitList p {
}
.featureExhibit {
	padding: 50px 20px;
}
.exhibitPhotos {
	margin-left: 1%;
}
.featureImageList {
	padding-bottom: 30px;
}
.containerPhoto {
	box-sizing: content-box;
	display: inline-block;
	position: relative;
	width: 16%;
}
.containerPhoto img {
	width: 100%;
	box-sizing: border-box;
}

.aboutPicsPhotos {
	margin-left: 5%;
	margin-right: 2%;
}
.photoContainer {
	display: inline-block;
	position: relative;
}
.photoContainer img {
	width: 100%;
	box-sizing: border-box;
}
li {
	list-style: none;
}


/* ------------------------ Fun ------------------------ */

#transition1 {
	width: 250px;
	-webkit-transform: rotate3d(1,1,0,28deg);
	transform: rotate3d(1,1,0,28deg);

	-webkit-transition: width 2s, -webkit-transform 2s; 
	transition: width 2s, transform 2s;
}

.transition1:hover #transition1 {
		-webkit-transform: rotate3d(1,1,1,0deg);
		transform: rotate3d(1,1,1,0deg);

		-webkit-transition: width 2s, -webkit-transform 2s;
		transition: width 2s, transform 2s;
/* 	width: 400px; */

}
/* only complete one, check carefully */
#transition2 {
	width: 250px;
	-webkit-transform: rotate3d(1,0,1,69deg);
	transform: rotate3d(1,0,1,69deg);
	-webkit-transition: width 2s, -webkit-transform 2s; 
	transition: width 2s, transform 2s;
}

.transition2:hover #transition2 {
		-webkit-transform: rotate3d(1,1,1,0deg);
	transform: rotate3d(1,1,1,0deg);

		-webkit-transition: width 2s, -webkit-transform 2s;
	transition: width 2s, transform 2s;
/* 	width: 400px; */
}
#transition3 {
	width: 250px;
	-webkit-transform: rotate3d(1,1,0,110deg);
	transform: rotate3d(1,1,0,110deg);
		-webkit-transition: width 2s, -webkit-transform 2s;
	transition: width 2s, transform 2s;
}

.transition3:hover #transition3 {
		-webkit-transform: rotate3d(1,1,1,0deg);
	transform: rotate3d(1,1,1,0deg);

		-webkit-transition: width 2s, -webkit-transform 2s;
	transition: width 2s, transform 2s;
/* 	width: 400px; */

}


#transition4 {
	width: 250px;
	-webkit-transform: rotate3d(1,0,1,80deg);
	transform: rotate3d(1,0,1,80deg);
		-webkit-transition: width 2s, -webkit-transform 2s;
	transition: width 2s, transform 2s;
}

.transition4:hover #transition4 {
		-webkit-transform: rotate3d(1,1,1,0deg);
	transform: rotate3d(1,1,1,0deg);

		-webkit-transition: width 2s, -webkit-transform 2s;
	transition: width 2s, transform 2s;
/* 	width: 400px; */

}
#transition5 {
	width: 250px;
	-webkit-transform: rotate3d(1,0,1,-67deg);
	transform: rotate3d(1,0,1,-67deg);
		-webkit-transition: width 2s, -webkit-transform 2s;
	transition: width 2s, transform 2s;
}

.transition5:hover #transition5 {
		-webkit-transform: rotate3d(1,1,1,0deg);
	transform: rotate3d(1,1,1,0deg);

		-webkit-transition: width 2s, -webkit-transform 2s;
	transition: width 2s, transform 2s;
/* 	width: 400px; */

}
#transition6 {
	width: 250px;
	-webkit-transform: rotate3d(0,1,1,-87deg);
	transform: rotate3d(0,1,1,-87deg);
		-webkit-transition: width 2s, -webkit-transform 2s;
	transition: width 2s, transform 2s;
}

.transition6:hover #transition6 {
		-webkit-transform: rotate3d(1,1,1,0deg);
	transform: rotate3d(1,1,1,0deg);

		-webkit-transition: width 2s, -webkit-transform 2s;
	transition: width 2s, transform 2s;
/* 	width: 400px; */

}
#transition7 {
	width: 250px;
	-webkit-transform: rotate3d(0,1,1,-107deg);
	transform: rotate3d(0,1,1,-107deg);
		-webkit-transition: width 2s, -webkit-transform 2s;
	transition: width 2s, transform 2s;
}

.transition7:hover #transition7 {
		-webkit-transform: rotate3d(1,1,1,0deg);
	transform: rotate3d(1,1,1,0deg);

		-webkit-transition: width 2s, -webkit-transform 2s;
	transition: width 2s, transform 2s;
/* 	width: 400px; */

}
#transition8 {
	width: 250px;
	-webkit-transform: rotate3d(1,1,1,-167deg);
	transform: rotate3d(1,1,1,-167deg);
		-webkit-transition: width 2s, -webkit-transform 2s;
	transition: width 2s, transform 2s;
}

.transition8:hover #transition8 {
		-webkit-transform: rotate3d(1,1,1,0deg);
	transform: rotate3d(1,1,1,0deg);

		-webkit-transition: width 2s, -webkit-transform 2s;
	transition: width 2s, transform 2s;
/* 	width: 400px; */

}
#transition9 {
	width: 250px;
	-webkit-transform: rotate3d(1,0,1,-87deg);
	transform: rotate3d(1,0,1,-87deg);
		-webkit-transition: width 2s, -webkit-transform 2s;
	transition: width 2s, transform 2s;
}

.transition9:hover #transition9 {
		-webkit-transform: rotate3d(1,1,1,0deg);
	transform: rotate3d(1,1,1,0deg);

		-webkit-transition: width 2s, -webkit-transform 2s;
	transition: width 2s, transform 2s;
/* 	width: 400px; */

}
ul:hover #transition1, ul:hover #transition2, ul:hover #transition3, ul:hover #transition4, ul:hover #transition5, ul:hover #transition6, ul:hover #transition7, ul:hover #transition8, ul:hover #transition9, ul:hover #transition10, ul:hover #transition11, ul:hover #transition12, ul:hover #transition13, ul:hover #transition14, ul:hover #transition15, ul:hover #transition16  {
		-webkit-transform: rotate3d(1,1,1,0deg);
	transform: rotate3d(1,1,1,0deg);

		-webkit-transition: -webkit-transform 2s;
	transition: width 2s,transform 2s;
	
}