html, body {
	height:100%;
	color: #4D3319;
	font-size:14px;
}


p, h1, h2, h3, a, td {
	color: #372412;
}


a {
	color: #4D3319;
	text-decoration: none
}
a:hover {  color: #ED1B33; text-decoration: none;}

#viewer {
    height: 200px;
    width: 800px;
}

td {
	font-family:
	font-size:13px;
}

img.centerScreen {
  
  margin:0 auto;
}

.big     {
            position: absolute;
			left: 0px;
			top: 0px;
			width: 400px;
			height: 400px;
			z-index: 1;

		}
.small  {
            position: relative;
            z-index: 0;
        }
		
.flex { 
    display: flex; 
    justify-content: center; 
    align-items: center;
	margin:0 auto;
}

.project_item {
  position: relative;
}

.project_item:hover > .thumb_title {
  opacity: 1;
  transition: .3s;
}

.project_item:hover > img {
  opacity: .3;
  transition: .3s;
}


.project_item img {
  display: block;
  margin: 0 auto;
  opacity: 1;
  transition: .3s;
}

.thumb_title {
  width: 100%;
  text-align: center;
  opacity: 0;
  transition: .3s;
}

.thumb_title h1 {
  position: absolute;
  top: calc(50% - 18.5px); /* Halfway from the top - half of the height of the text   */
  left: calc(50% - 61px); /* Halfway from the left - half of the width of the text   */
}