CSS
#logo {
display: block;
height: 33.3%;
width: 100%;
}
/**
* Below styles for demo only
*/
#logo {
outline: 1px solid #DBE5EA;
}
html {
background: #444;
height: 100%;
}
body {
max-height: 100%;
overflow: hidden;
}
#demo {
background: #fff;
border: solid #111;
border-radius: 1em;
border-width: 2em 1em;
display: block;
height: 26em;
margin: 1em auto;
padding: 2em;
width: 16em;
animation: 2s ease resizeDemo alternate infinite;
}
@keyframes resizeDemo {
0% {
border-width: 2em 1em;
height: 26em;
width: 16em;
}
25% {
border-width: 2em 1em;
height: 26em;
width: 16em;
}
75% {
border-width: 1em 2em;
height: 16em;
width: 26em;
}
100% {
border-width: 1em 2em;
height: 16em;
width: 26em;
}
}
1 Response