@import url('https//fonts.googleapis.com/css?family=Poppins:200,200,400,500,600,700.800,900&display=swap');

*
{
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Poppins', sans-sherif;
text-decoration:none;
}
section
{
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
background: #edf1f4;
}

.box
{
position: relative;

}

.container
{
position:relative;
min-width:400px;
border-radius: 10px;
box-shadow: 10px 10px 30px rgba(0,0,0,0.1), -15px -15px 30px #fff;
}
#dycalendar
{
width: 100%;
padding: 30px 30px 0;
}
#dycalendar table
{
width: 100%;
border-spacing: 15px;
margin-top:40px;
}
#dycalendar table tr:nth-child(1) td
{
background:#09F;
color:#FFF;
border-radius: 10px;
font-weight: 600;
box-shadow: 5px 5px 10px rgba(0,0,0,0.1), -5px -5px 10px #FFF;
border: 2px solid #edf1f4;
}
/*
#dycalendar table td:nth-child(1) 
{
background:#DDFFE6;
color:#FFF;
border-radius: 10px;
font-weight: 600;
box-shadow: 5px 5px 10px rgba(0,0,0,0.1), -5px -5px 10px #FFF;
border: 2px solid #edf1f4;
}*/
#dycalendar table td:nth-child(7) 
{
color:#090;
}
#dycalendar table tr:nth-child(1) td:nth-child(7)
{
background:#0C9;
}

#dycalendar table tr:nth-child(1) td:nth-child(1)
{
background:#f44336;
}
#dycalendar table td
{
color: #777;
padding: 10px 15px;
cursor:pointer;
font-weight:500;
border-radius: 10px;
font-size:1.25em;
box-shadow: 5px 5px 10px rgba(0,0,0,0.1), -5px -5px 10px rgba(255,255,255,1);
/*box-shadow: inset 5px 5px 10px rgba(0,0,0,0.1), inset -5px -5px 10px rgba(255,255,255,1);*/
}
#dycalendar table td:hover
{
box-shadow: inset 5px 5px 10px rgba(0,0,0,0.1), inset -5px -5px 10px rgba(255,255,255,1);
/*box-shadow: 5px 5px 10px rgba(0,0,0,0.1), -5px -5px 10px rgba(255,255,255,1);*/
}
#dycalendar table td:first-child
{
color: #f44336;
}
.dycalendar-month-container .dycalendar-target-date
{
background: #2196f3;
color:#FFF !important;
box-shadow: 5px 5px 10px rgba(0,0,0,0.1), -5px -5px 10px rgba(255,255,255,1) !important ;
border: 2px solid #edf1f4;
}
.dycalendar-month-container .dycalendar-header .dycalendar-prev-next-btn.prev-btn
{
width:45px;
height:45px;
font-size:2em;
left:15px;
color:#777;
background:#edf1f4;
border-radius: 10px;
box-shadow: 5px 5px 10px rgba(0,0,0,0.1), -5px -5px 10px rgba(255,255,255,1) ;
}
.dycalendar-month-container .dycalendar-header .dycalendar-prev-next-btn.next-btn
{
width:45px;
height:45px;
font-size:2em;
right:15px;
color:#777;
background:#edf1f4;
border-radius: 10px;
box-shadow: 5px 5px 10px rgba(0,0,0,0.1), -5px -5px 10px rgba(255,255,255,1);
}
.dycalendar-month-container .dycalendar-header .dycalendar-prev-next-btn.prev-btn:active ,
.dycalendar-month-container .dycalendar-header .dycalendar-prev-next-btn.next-btn:active
{
box-shadow: inset 5px 5px 10px rgba(0,0,0,0.1), inset -5px -5px 10px rgba(255,255,255,1) ;
}
.dycalendar-span-month-year
{
color:#2196f3;
font-size:2em;
font-weight:400;
}