/*///////////////////////////////////////////////////////////////////////////////////////////////////*/

.checker, .checker-inner
{
/*margin-right:auto;
margin-left:auto;
text-align: center;
justify-content: center;
width: fit-content; */ 
}

.checker-inner
{
position: relative;
}

.caveman-a 
{
margin-right:auto;
text-align: center;
position: fixed;
}

.caveman-a-joy, .caveman-a-angry 
{
display:none;
}

.caveman-a-joy:hover, .caveman-a-angry:hover, .caveman-a-joy.hover-trigger, .caveman-a-angry.hover-trigger 
{
  /* Запустите анимацию встряхивания и сделайте так, чтобы анимация длилась 0,5 секунды */
  animation: shake 0.5s;

  /* Когда анимация будет закончена, начните снова */
  animation-iteration-count: infinite;
}

@keyframes shake 
{
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}

/*margin-left:calc(50vw - 100px);
margin-top: calc(100vh - 165px);*/


.clo-first
{
margin-right:auto;
text-align: center;
position: absolute;
cursor:pointer;
}

.clo-second
{
margin-right:auto;
text-align: center;
position: absolute;
cursor:pointer;
}

.clo-third
{
margin-right:auto;
text-align: center;
position: absolute;
cursor:pointer;
}

.clo-first h1
{
position: absolute;
left:-20%;
}

.clo-second h1
{
position: absolute;
left:-20%;
}

.clo-third h1
{
position: absolute;
left:-20%;
}

.clo-think
{
margin-right:auto;
text-align: center;
position: fixed;
}



.clo-first
{
margin-top: 50px;
margin-left: 800px;
}

.clo-second
{
margin-top: 150px;
margin-left: 1100px;
}

.clo-third
{
margin-top: 300px;
margin-left: 900px;
}

.clo-think
{
margin-top: 00px;
margin-left: -00px;
}

.caveman-a 
{
margin-top: 670px;
margin-left: 700px;
}

.clo-first h1, .clo-second h1, .clo-third h1
{
font-family: "EB Garamond", serif;
font-size: 2.5em;
line-height: 2.5em;
}

.clo-think h1
{
font-family: "EB Garamond", serif;
font-size: 2.5em;
line-height: 1.8em;
}


.d33 
{
background: #B5DDD4;
position: relative;
border-style: solid;
border-color: #6E839E;
position: fixed;
}

.d33:before 
{
content: "";
width: 0; 
height: 0;
position: absolute; 
}


.d33 
{
width: 50em; 
height: 150px; 
margin-top: 500px;
margin-left: 30vw;
border-radius: 10px;
border-width: 0.25em;
}

.d33:before 
{
right: 50%; 
top: calc(50% + 75px);
border-left: 12px solid transparent;
border-top: 24px solid #B5DDD4;
border-right: 12px solid transparent;
}



.d39 
{
position: relative;
width: 10em; 
height: 6em; 
margin: 2em;
background: #D5DEE9;
border-width: 0.25em;
border-style: solid;
border-color: #6E839E;
border-radius: 50% 50% 0 0;
}

.d39:before, 
.d39:after 
{
content: "";
position: absolute; 
bottom: -0.25em;
background: inherit;
border-width: 0.25em;
border-style: solid;
border-color: #6E839E;
}

.d39:after 
{
left: 80%; 
width: 60%; 
height: 60%;
border-left: none;
border-radius: 50% 50% 50% 0;
}

.d39:before 
{
right: 80%;
width: 80%; 
height: 80%;
border-right: none;
border-radius: 50% 50% 0;
}


.red
{
color: #F00;
}


/*----------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------*/


/* Responsive*/

/*/////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-width: 0px) /*c 0 do 240*/
{

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 0px) /*С 0 do 320*/
{



}

}
/*/////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////*/











/*/////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-width: 950px) /*c 950*/
{

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 320px) /*С 320*/
{

}

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 360px) /*С 360*/
{

}

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 1850px) /*С 1850*/ /*Samsung Galaxy S5*/
{

.checker-grid .ratmanmenu img
{
width: 12rem;
}

.checker
{
margin-top:-17rem;
margin-left:-60rem;
}

.caveman-a-think img  
{
width: 400px;
}

.caveman-a-joy img  
{
width: 250px;
}

.caveman-a-angry img  
{
width: 220px;
margin-top:-50px;
}

}

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 2250px) /*С 2250*/ /*Samsung Galaxy A16 1080*2340*/
{




}

}
/*/////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////*/













/*/////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-width: 1200px) /*C 1200*/
{

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 320px) /*С 320*/
{

}

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 480px) /*С 480*/
{

}

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 600px) /*С 600*/
{

}

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 650px)
{

}

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 768px)
{

}

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 800px)
{

}

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 900px)
{

}

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 1000px)
{

}

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 900px)		/*для моего монитора*/
{

.checker-grid .ratmanmenu img
{
width: 12rem;
}

.checker
{
margin-top:-17rem;
margin-left:-60rem;
}

.caveman-a-think img  
{
width: 400px;
}

.caveman-a-joy img  
{
width: 250px;
}

.caveman-a-angry img  
{
width: 220px;
margin-top:-50px;
}


}

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 1300px)
{


}

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 1400px)
{

}

/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 1500px)
{

}


/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 1600px)
{

}


/*/////////////////////////////////////////////////////////////////////////*/
@media screen and (min-height: 1920px)
{

}

}

/*/////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////*/








