/* CSS Document */



* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.clearfix:after {
    content: "";
    display:block;
    clear: both;
}

html, body {
    margin: 0;
    padding: 0;
    font-family: 'Roboto', sans-serif;
font-size: 15px;
  font-style: normal;
  font-weight: normal;
  color:rgb(119,136,153);
}




a {
   position: relative;
   display: inline-block;

 }
 

 
a { 
color:rgb(119,136,153);
    text-decoration: none; /* Отменяем подчеркивание у ссылки */
} 


.card-content 
{
 display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;

}



.card-vop a
{ 
overflow: hidden;
background: url("img/card-fon.png") no-repeat;
background-size:contain;
background-position:50% 100%;
position:relative;
display:block;
border-radius:12px;
  background-color:rgb(135,206,235);
  width: 220px;
  height:150px;
  margin: 15px;
  text-align: center;
  font-size: 13px;
  word-wrap: break-word;
  padding:20px;
  

}

.card-vop a:active
{
color:#fff; 
background-color:#54DED2;
}
 .card-vop a:hover
 {
 background: url("img/card-fon.png") no-repeat;
background-size:contain;
background-position:50% 100%;
opacity: 0.7;
 background-color: rgba(0, 0, 0, 0.9);
 }
 
 .card-vop a:hover::after
 {
  position: absolute; 
    top: 0;
    left: 0;
 content: url("img/zv.png");
 background-size: cover; 
 width:220px;
  height:150px;
display:block;
z-index:-100;
    opacity: 0.5;
 }
 
 
.moon-vop a:hover::before
{

content: url("/style/themes/web/images/moon.png");
 position:absolute;
 top:10px;
 left:10px;
 width:20px;
 z-index:100;
}
.sun-vop a::before { 
content: url("/style/themes/web/images/sun.png");
position:absolute;
 top:10px;
 left:10px;
 width:20px;
 z-index:100;
 }
 
.like_card::before 
{
  content: '♥';
  font-size:25px;
position:absolute;
right:0;
top:0;
padding:5px;
 color:red;

}


.images{ width:35px; height:35px; border-radius: 50%;}