Shadow Mastery

Shadow Mastery: The Art of Being a Shadow

Welcome to Shadow Mastery, the premier online destination for all things shadow. Here, you can learn the art of being a shadow, from the basics of shadowing to the advanced techniques of shadow-fu.

/* CSS */ body { background-image: linear-gradient(to bottom, hsla(200, 100%, 90%), hsla(200, 100%, 10%)); } header { background-color: hsla(100, 90%, 50%); padding: 20px; border: 4px solid #000; border-radius: 10px 10px 0 0; position: sticky; top: 0; left: 0; width: 100%; text-align: center; font-size: 2em; font-weight: bold; } header ul { list-style: none; padding: 0; margin: 0; text-align: center; } header li { display: inline-block; margin: 5px; border: 4px solid #000; padding: 5px 20px; background-color: hsla(200, 100%, 20%); text-decoration: none; text-transform: uppercase; } header a { color: #000; text-decoration: none; text-align: center; text-transform: none; font-size: 1.5em; font-weight: bold; } main { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 20px; border: 4px solid #000; border-radius: 10px 10px 0 0; position: relative; top: 50px; left: 50%; transform: translateX(-50%); text-align: center; font-size: 1.2em; font-weight: bold; } section { background-color: hsla(200, 90%, 60%); padding: 20px; border: 4px solid #000; border-radius: 10px 10px 0 0; position: relative; text-align: center; font-size: 1.5em; font-weight: bold; box-shadow: 0px 0px 10px 0px #000; } footer { background-color: hsla(200, 90%, 20%); padding: 20px; border: 4px solid #000; border-radius: 10px 10px 0 0; position: relative; text-align: center; font-size: 1em; font-weight: bold; bottom: 0; left: 0; width: 100%; text-align: center; } /* Shadow Dance */ .shadow-dance { background-image: linear-gradient(to bottom, hsla(200, 100%, 20%), hsla(200, 100%, 50%)); padding: 20px; border: 4px solid #000; border-radius: 10px 10px 0 0; position: relative; top: 20%; left: 30%; width: 40%; text-align: center; font-size: 1.5em; font-weight: bold; box-shadow: 0px 0px 10px 0px #000; } /* Shadow Selfies */ .shadow-selfies { background-image: linear-gradient(to bottom, hsla(200, 100%, 20%), hsla(200, 100%, 50%)); padding: 20px; border: 4px solid #000; border-radius: 10px 10px 0 0; position: relative; top: 40%; left: 60%; width: 20%; text-align: center; font-size: 1.2em; font-weight: bold; box-shadow: 0px 0px 10px 0px #000; } /* Shadow Sports */ .shadow-sports { background-image: linear-gradient(to bottom, hsla(200, 100%, 20%), hsla(200, 100%, 50%)); padding: 20px; border: 4px solid #000; border-radius: 10px 10px 0 0; position: relative; top: 20%; left: 10%; width: 50%; text-align: center; font-size: 1.5em; font-weight: bold; box-shadow: 0px 0px 10px 0px #000; } /* Shadow Dance */ a.shadow-dance { color: #000; text-decoration: none; text-align: center; text-transform: none; font-size: 1.5em; font-weight: bold; } /* Shadow Selfies */ a.shadow-selfies { color: #000; text-decoration: none; text-align: center; text-transform: none; font-size: 1.2em; font-weight: bold; } /* Shadow Sports */ a.shadow-sports { color: #000; text-decoration: none; text-align: center; text-transform: none; font-size: 1.5em; font-weight: bold; }