.container {
align-items:flex-start;
display:flex;
justify-content:space-between;
padding:20px;
position:relative;
z-index:1;
}

.left-block {
background:linear-gradient(135deg,#3330%,#555100%);
border:1px solid #ccc;
border-radius:12px;
box-shadow:0 4px 8px rgba(0,0,0,0.1);
color:#add8e6;
flex:1;
margin-bottom:20px;
margin-right:20px;
margin-top:100px;
opacity:0.6;
padding:20px;
transition:opacity .3s ease;
width:calc(50%-20px);
z-index:1;
}

.left-block li {
color:#ccc;
font-size:1.2rem;
line-height:1.6;
margin-bottom:2px;
}

.right-block {
background:linear-gradient(135deg,#3330%,#555100%);
border:1px solid #ccc;
border-radius:12px;
box-shadow:0 4px 8px rgba(0,0,0,0.1);
color:#add8e6;
flex:1;
margin-bottom:20px;
margin-left:20px;
margin-top:100px;
opacity:0.6;
padding:20px;
transition:opacity .3s ease;
width:calc(50%-20px);
z-index:1;
}

.right-block li {
color:#ccc;
font-size:1.2rem;
line-height:1.6;
margin-bottom:1px;
}

.right-block button {
background-color:#1b2838;
border:none;
border-radius:5px;
color:#FFF;
cursor:pointer;
display:block;
font-size:1rem;
margin-top:10px;
padding:8px 16px;
transition:background-color .3s ease, transform .2s ease;
}

.right-block button:hover {
background-color:#2a475e;
transform:translateY(-3px);
}

.copy-button {
background-color:#1b2838;
border:none;
color:#FFF;
cursor:pointer;
padding:10px 20px;
transition:background-color .3s transform .2s;
}

.copy-button:hover {
background-color:#2a475e;
}

.copy-button.copied {
background-color:#4CAF50;
color:#FFF;
}

.left-block h2,.right-block h2 {
color:#fff;
font-size:2rem;
margin-bottom:5px;
}

.left-block ul,.right-block ul {
list-style-type:none;
margin:0;
padding:0;
}

.right-block:hover,.left-block:hover {
opacity:1;
transform:scale(1.02);
}