@import url('https://fonts.googleapis.com/css?family=Encode+Sans+Semi+Condensed|Ubuntu&display=swap');
::selection{background-color: skyblue}
::-webkit-scrollbar{width: 15px}
	::-webkit-scrollbar-track{background: #2e3136;border: green;border-radius: 10px}
	::-webkit-scrollbar-thumb{background: #4a4c51;border-radius: 5px}
	::-webkit-scrollbar-button{background: gray;border-radius: 50%}

body{margin: 0;font-family: 'Encode Sans Semi Condensed', sans-serif;}
h2{font-size: 2em}
h3{font-size: 1.8em}
p,li{font-size: 1.4em}

header{height: 100vh}
.background-header{height: 100vh;width: calc(100vw - 15px);position: absolute}
h1{color: red;text-decoration: underline;font-size: 3em;font-family: 'Ubuntu', cursive;text-shadow: 3px 2px rgba(153, 0, 18, 0.9)}
.mid{position: absolute;top: 50vh;transform: translateY(-100%);text-align: center;width: 100%}

section{margin-left: 10px;margin-right: -10px;width: calc(100vw - 25px)}
article{margin-left: 10px}
article>p{margin-left: 10px}

footer{border: 1px black solid;border-bottom: none;margin-top: 10px}
footer>p{text-align: center;font-size: 1em}

.seemore{color: green;text-decoration: underline;cursor: text}
.seemore:hover{text-decoration: none;color: black}
.seemore:visited{text-decoration: none;color: inherit}

.videos-grid{width: calc(100vw - 40px);overflow: scroll;border: 1px solid gray;box-shadow: black 0px 0px 15px 5px}
.videos-grid caption{visibility: hidden;width: 90%}
.videos-grid th{float: right;background: #6b6e77;position: absolute}
.tovideos{font-size: 35px;height: 35px;animation: tovideos 5s infinite;font-style: italic}
.tovideos a{color: #bb9713}
@keyframes tovideos
{
	0%{font-size: 35px}
	50%{font-size: 20px}
	100%{font-size: 35px}
}
.memo{width: 450px;height: 300px;background: url('coding.jpg');background-size: cover}
.memo-img{width: 450px;height: 300px;display: none}
.memo-link{position: relative;top: 150px;left: 170px;color: white;text-decoration: none;animation: tomemo 5s infinite linear}
@keyframes tomemo
{
	0%{font-size: 50px;left: 45px;top: 125px}
	50%{font-size: 25px;left: 170px;top: 150px}
	100%{font-size: 50px;left: 45px;top: 125px}
}

@media print {
	::selection{background: initial}
	header{height: 5vh}
	header>img{display: none}
	.title{position: initial;margin-left: 0vw;margin-top: 0vh;transform: none;text-align: center}

	#cicc{display: none}
	#cicc-print::before{content: 'Club informatique du collège Canterane'}
}
@media (max-width: 1250px) {
	#video4{display: none}
}