* {
          padding : 0px ;
          margin : 0px ;
}

body {
	text-align: center;
	background-color: #F7F2E0;
}

#site-box {
                width : 1200px;
	  height: 840px;
	  margin : 0px auto;
}

#site-l {
	  width : 380px;
          float : left;
 	display: flex;          
        justify-content: center;
        align-items: center; 
}

#site-r {
	  float : right;
}

#right {
	  width : 820px;
	  height: 820px;
 	display: flex;          
        justify-content: center;
        align-items: center; 
	filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.5));
}

#u {
	  height: 110;
          color: #772200;
	  font-size : 150%;
	  font-weight:bold;
	  margin : 5px auto 0px;
}

#left {
	  mini-height: 725px;
          color: #772200;
	  font-size : 85%;
	  font-weight:bold;
	  margin : 0px auto;
}

#copy {
	  height : 20px;
          width : 800px;
	  text-align: center;
          font-size : 90%;
	  margin : 0px auto;
}

#l {
	height: 725px;
	  font-weight:bold;
    overflow-y: auto;
    border: 0px solid #CCC;
    -webkit-overflow-scrolling: touch;
          color: #772200;
	  font-size : 85%;
}

iframe {
	display: block;
	margin: 0px auto;
}

img {
	  margin : 3px;
}

div::-webkit-scrollbar{
  width: 10px;
}

div::-webkit-scrollbar-track{
  background: #eed;
  border: none;
  border-radius: 5px;
  box-shadow: inset 0 0 2px #777; 
}

div::-webkit-scrollbar-thumb{
  background: #ccb;
  border-radius: 5px;
  box-shadow: none;
}

.MyTable {
  display:table;
  width:330px;
table-layout: fixed;
padding: 10px 15px;
}

.MyTable div.row{
  display:table-row;
}

.MyTable div.cell{
  display:table-cell;
padding: 2px:
}

a { text-decoration: none; }

a:link {
color:#772200;
}