/*** FONTS ***/ /*@import url(http://fonts.googleapis.com/css?family=Julius+Sans+One|Libre+Baskerville:400,400italic); */ @font-face { font-family: 'Julius Sans One'; font-style: normal; font-weight: 400; src: local('Julius Sans One'), local('JuliusSansOne-Regular'), url("julius.ttf") format('truetype'); } @font-face { font-family: 'Libre Baskerville'; font-style: normal; font-weight: 400; src: local('Libre Baskerville'), local('LibreBaskerville-Regular'), url("baskerville.ttf") format('truetype'); } @font-face { font-family: 'Libre Baskerville'; font-style: italic; font-weight: 400; src: local('Libre Baskerville Italic'), local('LibreBaskerville-Italic'), url("baskerville-italic.ttf") format('truetype'); } /* SECTION #1 */ main > section.yfold:not(.card):nth-of-type(1) { /* background: #C0FDF7 ;*/ border-top: 2px solid #40E0D0 ; } section.yfold:not(.card):nth-of-type(1) > .yfold-title:hover, section.yfold:not(.card):nth-of-type(1) > .yfold-content section.card { background: #C0FDF7 ; } section.yfold:not(.card):nth-of-type(1) section.card > h3, section.yfold:not(.card):nth-of-type(1) > .yfold-title > span.arrow { background: #40E0D0 ; } section.yfold:not(.card):nth-of-type(1) h4 { color: #40E0D0 ; } section.yfold:not(.card):nth-of-type(1) > .yfold-content.anim-show, section.yfold:not(.card):nth-of-type(1) > .yfold-content.shown { /* border-bottom: 2px solid #40E0D0 ; */ } section.yfold:not(.card):nth-of-type(1) .lbutton { background: linear-gradient(#40E0D0,#C0FDF7) ; } /* SECTION #2 */ main > section.yfold:not(.card):nth-of-type(2) { /* background: #FFF36D ;*/ border-top: 2px solid #FFA500 ; } section.yfold:not(.card):nth-of-type(2) > .yfold-title:hover, section.yfold:not(.card):nth-of-type(2) > .yfold-content section.card { background: #FFF36D ; } section.yfold:not(.card):nth-of-type(2) section.card > h3, section.yfold:not(.card):nth-of-type(2) > .yfold-title > span.arrow { background: #FFA500 ; } section.yfold:not(.card):nth-of-type(2) h4 { color: #FFA500 ; } section.yfold:not(.card):nth-of-type(2) .lbutton { background: linear-gradient(#FFA500,#FFF36D) ; } section.yfold:not(.card):nth-of-type(2) > .yfold-content.anim-show, section.yfold:not(.card):nth-of-type(2) > .yfold-content.shown { /* border-bottom: 2px solid #FFA500 ; */ } /* SECTION #9 */ main > section.yfold:not(.card):nth-of-type(9) { /* background: #FFF36D ;*/ border-top: 2px solid #FFA500 ; } section.yfold:not(.card):nth-of-type(9) > .yfold-title:hover, section.yfold:not(.card):nth-of-type(9) > .yfold-content section.card { background: #FFF36D ; } section.yfold:not(.card):nth-of-type(9) section.card > h3, section.yfold:not(.card):nth-of-type(9) > .yfold-title > span.arrow { background: #FFA500 ; } section.yfold:not(.card):nth-of-type(9) h4 { color: #FFA500 ; } section.yfold:not(.card):nth-of-type(9) .lbutton { background: linear-gradient(#FFA500,#FFF36D) ; } section.yfold:not(.card):nth-of-type(9) > .yfold-content.anim-show, section.yfold:not(.card):nth-of-type(9) > .yfold-content.shown { /* border-bottom: 2px solid #FFA500 ; */ } /* SECTION #3 */ main > section.yfold:not(.card):nth-of-type(3) { /* background: #D6BDD5 ; */ border-top: 2px solid #982395 ; } section.yfold:not(.card):nth-of-type(3) > .yfold-title:hover, section.yfold:not(.card):nth-of-type(3) > .yfold-content section.card { background: #D6BDD5 ; } section.yfold:not(.card):nth-of-type(3) section.card > h3, section.yfold:not(.card):nth-of-type(3) > .yfold-title > span.arrow { background: #982395 ; color: white ; } section.yfold:not(.card):nth-of-type(3) h4 { color: #982395 ; } section.yfold:not(.card):nth-of-type(3) > .yfold-content.anim-show, section.yfold:not(.card):nth-of-type(3) > .yfold-content.shown { /* border-bottom: 2px solid #982395 ; */ } section.yfold:not(.card):nth-of-type(3) .lbutton { background: linear-gradient(#982395,#D6BDD5) ; } /* SECTION #10 */ main > section.yfold:not(.card):nth-of-type(10) { /* background: #D6BDD5 ; */ border-top: 2px solid #982395 ; } section.yfold:not(.card):nth-of-type(10) > .yfold-title:hover, section.yfold:not(.card):nth-of-type(10) > .yfold-content section.card { background: #D6BDD5 ; } section.yfold:not(.card):nth-of-type(10) section.card > h3, section.yfold:not(.card):nth-of-type(10) > .yfold-title > span.arrow { background: #982395 ; color: white ; } section.yfold:not(.card):nth-of-type(10) h4 { color: #982395 ; } section.yfold:not(.card):nth-of-type(10) > .yfold-content.anim-show, section.yfold:not(.card):nth-of-type(10) > .yfold-content.shown { /* border-bottom: 2px solid #982395 ; */ } section.yfold:not(.card):nth-of-type(10) .lbutton { background: linear-gradient(#982395,#D6BDD5) ; } /* SECTION #4 */ main > section.yfold:not(.card):nth-of-type(4) { /* background: #80FF80 ; */ border-top: 2px solid #32CD32 ; } section.yfold:not(.card):nth-of-type(4) > .yfold-title:hover, section.yfold:not(.card):nth-of-type(4) > .yfold-content section.card { background: #E1FFC1 ; } section.yfold:not(.card):nth-of-type(4) section.card > h3, section.yfold:not(.card):nth-of-type(4) > .yfold-title > span.arrow { background: #32CD32 ; } section.yfold:not(.card):nth-of-type(4) h4 { color: #32CD32 ; } section.yfold:not(.card):nth-of-type(4) > .yfold-content.anim-show, section.yfold:not(.card):nth-of-type(4) > .yfold-content.shown { /* border-bottom: 2px solid #32CD32 ; */ } section.yfold:not(.card):nth-of-type(4) .lbutton { background: linear-gradient(#32CD32,#E1FFC1) ; } /* SECTION #5 */ main > section.yfold:not(.card):nth-of-type(5) { /* background: #80FF80 ; */ border-top: 2px solid #596FE7 ; } section.yfold:not(.card):nth-of-type(5) > .yfold-title:hover, section.yfold:not(.card):nth-of-type(5) > .yfold-content section.card { background: #C8CFF6; } section.yfold:not(.card):nth-of-type(5) section.card > h3, section.yfold:not(.card):nth-of-type(5) > .yfold-title > span.arrow { background: #596FE7 ; } section.yfold:not(.card):nth-of-type(5) h4 { color: #596FE7 ; } section.yfold:not(.card):nth-of-type(5) > .yfold-content.anim-show, section.yfold:not(.card):nth-of-type(5) > .yfold-content.shown { /* border-bottom: 2px solid #596FE7 ; */ } section.yfold:not(.card):nth-of-type(5) .lbutton { background: linear-gradient(#596FE7,#C8CFF6) ; } /* SECTION #6 */ main > section.yfold:not(.card):nth-of-type(6) { /* background: #80FF80 ; */ border-top: 2px solid #B71F70 ; } section.yfold:not(.card):nth-of-type(6) > .yfold-title:hover, section.yfold:not(.card):nth-of-type(6) > .yfold-content section.card { background: #FF84C5; } section.yfold:not(.card):nth-of-type(6) section.card > h3, section.yfold:not(.card):nth-of-type(6) > .yfold-title > span.arrow { background: #B71F70 ; } section.yfold:not(.card):nth-of-type(6) h4 { color: #B71F70 ; } section.yfold:not(.card):nth-of-type(6) > .yfold-content.anim-show, section.yfold:not(.card):nth-of-type(6) > .yfold-content.shown { /* border-bottom: 2px solid #B71F70 ; */ } section.yfold:not(.card):nth-of-type(6) .lbutton { background: linear-gradient(#B71F70,#FF84C5) ; } /* SECTION #7 */ main > section.yfold:not(.card):nth-of-type(7) { border-top: 2px solid #703507 ; } section.yfold:not(.card):nth-of-type(7) > .yfold-title:hover, section.yfold:not(.card):nth-of-type(7) > .yfold-content section.card { background: #9E775A; } section.yfold:not(.card):nth-of-type(7) section.card > h3, section.yfold:not(.card):nth-of-type(7) > .yfold-title > span.arrow { background: #703507 ; } section.yfold:not(.card):nth-of-type(7) h4 { color: #703507 ; } section.yfold:not(.card):nth-of-type(7) > .yfold-content.anim-show, section.yfold:not(.card):nth-of-type(7) > .yfold-content.shown { /* border-bottom: 2px solid #B71F70 ; */ } section.yfold:not(.card):nth-of-type(7) .lbutton { background: linear-gradient(#703507,#9E775A) ; } /* SECTION #8 */ main > section.yfold:not(.card):nth-of-type(8) { border-top: 2px solid #64A810 ; } section.yfold:not(.card):nth-of-type(8) > .yfold-title:hover, section.yfold:not(.card):nth-of-type(8) > .yfold-content section.card { background: #C4DB97; } section.yfold:not(.card):nth-of-type(8) section.card > h3, section.yfold:not(.card):nth-of-type(8) > .yfold-title > span.arrow { background: #64A810 ; } section.yfold:not(.card):nth-of-type(8) h4 { color: #64A810 ; } section.yfold:not(.card):nth-of-type(8) > .yfold-content.anim-show, section.yfold:not(.card):nth-of-type(8) > .yfold-content.shown { /* border-bottom: 2px solid #B71F70 ; */ } section.yfold:not(.card):nth-of-type(8) .lbutton { background: linear-gradient(#64A810,#C4DB97) ; } /* DEFAULT SECTION */ /* section.yfold { border-top: 2px solid #FFA500 ; } section.yfold > .yfold-title:hover, section.yfold > .yfold-content > section.card { background: #FFF36D ; } section.yfold > section.card > h3, section.yfold > .yfold-title > span.arrow { background: #FFA500 ; } section.yfold .lbutton { background: linear-gradient(#FFA500,#FFF36D) ; } section.yfold > .yfold-content.anim-show, section.yfold > .yfold-content.shown { border-bottom: 2px solid #FFA500 ; } */ * { box-sizing: border-box; } h1, h2, h3, h4, h5, h6 { font-family: "Julius Sans One", serif; margin: 0; } html, body { font-family: "Libre Baskerville", serif; padding: 0; margin: 0; color: #222240; background: #fff; height: 100%; } h1 { text-align: center; font-weight: bold; background: #40E0D0; color: black; padding: 1ex 2ex 1ex 2ex; } section:not(.yfold) > h2 { padding: 0.5ex 2ex 0.5ex 4ex; background: #40D0E0; } p { margin: 1ex 1ex 1ex 1ex; } a { text-decoration: none; color: inherit; border-bottom: thin dotted blue; } a.emph { font-weight: bold; color: blue; padding: 0 0.6ex 0 0.6ex; border-bottom: none; } a.url { font-family: "sans"; font-style: italic; color: #4b097a; } a:hover { color: red; border-bottom: thin solid blue; } *:not(.exercise) > *:not(.example) > h5 { margin: 1ex 0ex 1ex 1ex; font-size: 100%; } h1 + nav > a:before { content: url("Images/home.png"); } h1 + nav > a, h1 + nav > a:link, h1 + nav > a:visited, h1 + nav > a:active { text-decoration: none; border: none; padding: 0; margin: 0; } h1 + nav > a:hover { text-decoration: none; border: none; } h1 + nav { position: absolute; top: 30px; left: 4px; padding: 0; } footer { margin: 6em 0 0 0; display: flex; justify-content: flex-end; align-items: center; flex-wrap: wrap; padding: 1ex 1ex 1ex 1ex; } footer > a { margin: 0.25ex 2ex 0.25ex 0; text-decoration: none; border: none; } footer > small { flex-basis: 100%; text-align: right; margin: 0.25ex 2ex 0.25ex 0; } footer.colophon { font-size: 80%; margin: 1em 0 0 0; } section.card { border-radius: 6px; padding: 0 1ex 0 1ex; margin: 0 3ex 2ex 3ex; box-shadow: 4px 3px 2px #CCC; } main > section.card { margin: 4ex 2ex 4ex 2ex; padding: 0 0 1ex 0; background: rgba(245, 245, 255, 0.7); border: thin solid #DDE; } main > section.card > h2 { border-radius: 6px; margin: 0 0 0 0; } div.flex { display: flex; justify-content: center; flex-wrap: wrap; align-items: flex-start; } section.smooth { box-shadow: none !important; } section.notice { border: thin dotted #44D; padding: 1ex 2ex 1ex 2ex; margin: 2ex 1ex 6ex 1ex; box-shadow: 1px 1px #CCC; } h3 { border-radius: 6px; margin: 0 0px 8px -10px; padding: 0 10px 0 10px; } h4 { text-shadow: 1px 1px 0 #AAA; } h4.yfold-title { text-shadow: 1px 1px 0 #000; } div.theory { margin: 1ex 0.2ex 1ex 0.2ex; padding: 0.5ex 1ex 0.5ex 1ex; border: thin dotted #44D; background: #ffffb3; } div.mission, section.mission { margin: 1ex 0.2ex 2ex 0.2ex; padding: 0.5ex 1ex 0.5ex 1ex; border: thin dotted #44D; background: #ffb3ff; } section.yfold { margin: 0; } .yfold-title { text-align: left; padding: 0.2ex 2ex 0.2ex 2ex; } li > section > .yfold-title { padding-left: 1ex; } section.yfold.card { border-radius: 6px; padding: 0 1ex 0 1ex; margin: 0 3ex 2ex 3ex; box-shadow: 4px 3px 2px #CCC; border: none; } section.yfold.card > .yfold-title { padding-left: 0; } section.yfold.sober { border: none !important; margin-left: 1.5ex; } li > section.yfold.sober { margin-left: 0; } section.yfold.sober > h3 { font-size: 100%; } section.yfold.sober > div.yfold-content { border: none !important; } .yfold-title:hover { cursor: pointer; text-shadow: 2px 1px 2px white, 4px 1px 6px white; } .yfold-content { padding: 0 1ex 0 6ex; overflow: hidden; } section.yfold.card > .yfold-content { padding: 0; } section.yfold.card > .yfold-content > h6 { border: none; background: rgba(255, 255, 255, 0.5); font-size: 82%; margin: 0.5ex 0ex 0.8ex 0ex; padding: 0.5ex 1ex 0.5ex 2ex; border-radius: 6px; } code div { display: none; } @keyframes appear { 0% { max-height: 0; margin-bottom: 0; } 100% { max-height: 500px; margin-bottom: 3ex; } } @keyframes disappear { 0% { max-height: 500px; margin-bottom: 3ex; } 100% { max-height: 0; margin-bottom: 0; } } .anim-show { animation-name: appear; animation-duration: 0.75s; max-height: initial; margin: 0 0 3ex 0; } .anim-hide { animation-name: disappear; animation-duration: 0.75s; max-height: 0; margin: 0; } .shown { max-height: initial; margin: 0 0 3ex 0; } .hidden { max-height: 0; margin: 0; } span.hole { border: thin dotted blue; padding: 0.2ex 1.4ex 0.2ex 1.4ex; margin: 0 0.5ex 0 0; display: inline; } span.fak { font-size: 82%; font-style: normal; margin: 0 1ex 0 1ex; } span.arrow { vertical-align: middle; color: white; padding: 0px 4px 0px 4px; margin: 0px 0.5ex 0px 0px; border-radius: 5px; box-shadow: 1px 1px #CCC; text-shadow: none !important; } span.big { font-size: 220%; vertical-align: middle; } ul.lessons > li { margin: 0.5ex 0 0.6ex 0; list-style-type: none; list-style-image: none; } ul.exo-list { list-style-type: "· "; } ul.exo-list > li { margin: 1ex 0 1.5ex 3ex; color: #3c75d1; font-weight: bold; } .lbutton { vertical-align: top; color: black; border-radius: 6px; box-shadow: 3px 2px 2px gray; padding: 0.1ex 0.5ex 0.1ex 0.5ex; margin-right: 1.5ex; font-size: 85%; } ol.highl { list-style: none; counter-reset: item; } ol.highl > li { counter-increment: item; margin-bottom: 5px; } ol.highl > li:before { vertical-align: top; color: black; border-radius: 6px; box-shadow: 3px 2px 2px gray; padding: 0.1ex 0.5ex 0.1ex 0.5ex; margin-right: 1.5ex; font-size: 85%; margin-right: 10px; content: counter(item); background: purple; color: white; border-radius: 100%; width: 1.4em; text-align: center; display: inline-block; } .mml { align-self: center; page-break-before: always; page-break-after: always; margin: 1ex 1ex 2ex 1ex; } a:hover > .lbutton { box-shadow: none; } ul.lessons > li > a > span.lbutton { font-variant: small-caps; } .menu { margin: 0.25ex 1ex 0.25ex 1ex; padding: 0.1ex 0.75ex 0.1ex 0.75ex; background: rgba(130, 170, 250, 0.5); border: thin solid #37F; border-radius: 4px; box-shadow: 3px 3px 2px #844; font-family: sans; font-variant: small-caps; font-size: 88%; display: inline-block; } ul { margin: 0.4ex 0 1ex 1ex; padding-left: 2ex; list-style-type: "✧ "; } li { margin-bottom: 0.2ex; } ul ul { list-style-type: "⋆ "; font-size: 96%; } ul ul ul { list-style-type: "∘ "; font-size: 94%; } ul.space > li { margin-top: 0.75ex; margin-bottom: 1.5ex; } ul.smallspace > li { margin-top: 0.25ex; margin-bottom: 0.5ex; } ul.steps > li { margin: 0 0 2ex 0; } ul.steps { margin: 0; padding: 0 0 0 3ex; list-style-type: "☞ "; } ul.requires { list-style-type: "➪ "; } ul.success { list-style-type: "✔ "; } ul.goals { list-style-type: "✧ "; } ul.none { list-style-type: none; } ul.resources { list-style-type: "➤ "; } ul.resources > li { margin-bottom: 0.5ex; } div.warning { background: #FFFF00; padding: 0.4ex 1ex 0.4ex 1ex; margin: 2ex 1ex 2.6ex 1ex; border: thin solid red; box-shadow: 3px 3px 2px #844; } div.warning:before { content: url("Images/important.png"); float: left; margin: -10px 1.5ex 0 -2ex; } h3.warning { padding: 0.4ex 1ex 0.4ex 1ex; color: red; font-weight: bold; } code { background: rgba(255, 255, 255, 0.2); padding: 0.4ex 0.5ex 0.4ex 0.5ex; } code.highlight { font-weight: bold; color: #0000BB; } code.block { display: inline-block; border: thin dotted #44F; padding: 0.4ex 1.5ex 0.5ex 1.5ex; margin: 0.2ex 1ex 0.2ex 1ex; box-shadow: 1px 1px 1px #CCC; background: rgba(255, 255, 255, 0.5); white-space: pre; vertical-align: middle; } code.page { margin-left: 8%; box-shadow: 3px 3px 3px #DBD; font-size: 11pt; background: #F0FFFF; } span.comment { color: rgba(0, 110, 0, 0.7); font-style: italic; font-family: sans; font-size: 105%; white-space: pre; } span.semi { font-weight: bold; color: rgba(196, 0, 128, 0.6); } span.operator { color: #840; font-weight: bold; } span.highcomment { font-style: italic; font-family: sans; font-size: 105%; white-space: pre; font-size: 110%; font-weight: bold; color: rgba(0, 110, 0, 0.9); margin: 0.25ex 0ex 0.25ex 0ex; } span.highercomment { font-style: italic; font-family: sans; font-size: 105%; white-space: pre; font-size: 105%; font-weight: bold; color: #000; background: #DDD; padding: 0ex 4.5ex 0ex 4.5ex; margin: 0.25ex 0ex 2.5ex -4ex; border: thin solid black; } span.label { font-style: italic; color: #44F; } span.letvar { color: #0000A0; font-style: italic; } span.uident { font-weight: bold; font-size: 110%; color: #080; } span.string, span.char { color: #E22; white-space: pre; font-family: serif; font-size: 92%; } span.kw, code.kw { display: inline; font-weight: bold; color: #600080; } span.type { font-weight: bold; color: #069; } span.fname { font-variant: small-caps; font-weight: bold; font-size: 110%; color: #050; } span.directive { font-weight: bold; color: #e67300; } samp { display: inline-block; white-space: pre; margin: 0 2ex 0.2ex 2ex; padding: 0.2ex 1.5ex 0.2ex 1.5ex; background: rgba(180, 255, 180, 0.6); color: #336600; } code.command { border: thin dotted #999; margin: 0.2ex 2ex 0.2ex 1ex; font-weight: bold; box-shadow: 1px 1px 0px #666; } var { display: inline-block; padding: 0.1ex 0.7ex 0.1ex 0.7ex; background: rgba(0, 0, 0, 0.1); border-radius: 4px; font-size: 90%; font-family: mono; font-style: normal; } var.type { font-style: italic; } ul.file-list { list-style-type: none; } span.file, ul.file-list li a.file { font-family: sans; font-size: 96%; color: #660033; } ul.file-list li a.file:before { content: "👁"; padding: 0 0.5ex 0 0; border-bottom: thin solid white; } ul.file-list li a.dir:before { content: "📂"; padding: 0 0.5ex 0 0; border-bottom: thin solid white; } span.hfile { font-family: sans; color: #660033; font-weight: bold; } div.examples { display: flex; flex-direction: row; justify-content: space-around; flex-wrap: wrap; } div.example { border: thin outset #97E; margin: 1ex 0 1ex 0; padding: 0; background: rgba(255, 255, 255, 0.35); border-radius: 8px; } div.example.lone { display: table; } div.example:not(.lone) { display: flex; flex-direction: column; align-items: flex-start; } div.download-link { margin: 1ex; font-size: 82%; font-variant: small-caps; font-weight: bold; background: #229922; color: #FFF; padding: 0.8ex 1.5ex 0.8ex 1.5ex; border-radius: 8px; display: inline-block; float: right; } div.download-link a { border: none; } a.downl { margin: 1ex; font-size: 82%; font-variant: small-caps; font-weight: bold; background: #229922; color: #FFF; padding: 0.8ex 1.5ex 0.8ex 1.5ex; border-radius: 8px; display: inline-block; } a.downl:hover { color: red; box-shadow: 2px 2px 2px #6D6; } .flex1 { flex: 1; margin-right: 2ex !important; } .flex2 { flex: 2; margin-right: 2ex !important; } .flex3 { flex: 3; margin-right: 2ex !important; } div.example > h5 { background: rgba(0, 0, 0, 0.2); width: 100%; text-align: center; padding: 0.1ex 1ex 0.1ex 1ex; border-radius: 8px; } div.example > pre { margin: 0; padding: 0; } div.example > code.block, div.example > pre > code.block { margin-bottom: 0; box-shadow: none; border: none; background: transparent; } div.example > samp { align-self: stretch; border-top: thin dashed #999; padding: 0.8ex 0.8ex 0.8ex 0.4ex; } div.comm { font-size: 85%; color: #333; padding: 0 1.5ex 0 1.5ex; margin: 0 2ex 0 2ex; text-align: center; align-self: stretch; font-style: italic; } div.comm:before { content: "✍ "; font-size: 130%; } pre.output, div.samp { display: table; background: rgba(120, 255, 120, 0.7); padding: 1ex 2ex 1ex 2ex; border: thin dotted #777; } pre.ascii, pre.inv-ascii { font-size: 65%; float: right; box-sizing: content-box; display: inline-block; } pre.inv-ascii { background: rgb(45, 45, 45); color: white; } .pcom { color: #555; font-size: 80%; } mark { color: red; font-weight: bold; background: transparent; } q { font-style: italic; } blockquote { font-style: italic; color: #444; } .errmsg { color: red; } .green { color: green; } br.bbr { margin-bottom: 0.5ex; } br.vskip { margin-bottom: 2ex; } ul.bib { background: rgba(255, 255, 255, 0.3); list-style-type: none; padding: 1ex 0.5ex 0.5ex 1.5ex; margin: 0; } span.bib { background: rgba(255, 255, 255, 0.3); padding: 0.2ex 2ex 0.2ex 2ex; font-size: 90%; } span.bib:before, ul.bib > li:before { content: url("Images/article.png"); margin: 0 8px 0 0; padding: 0; vertical-align: top; } span.author { font-family: sans; font-size: 90%; } span.email { color: #4b097a; padding: 0.2ex 1ex 0.2ex 1ex; font-family: "sans"; } span.email:before { content: "🖂"; padding: 0; margin: 0 4px 0 0; } span.email:after { content: "🖂"; padding: 0; margin: 0 0 0 4px; } section.advice, section.help, section.demotiv, section.forbid { display: flex; margin-top: 1ex; } section.advice:before { content: url("Images/wazow1.png"); margin: -18px -18px 0 0; padding: 0; } section.forbid:before { content: url("Images/att.png"); margin: -10px -10px 0 0; padding: 0; z-index: 10; } section.demotiv:before { content: url("Images/wazow0.png"); margin: -18px -18px 0 0; padding: 0; } section.help:before { content: url("Images/wazow2.png"); margin: 0px -10px 0 0; padding: 0; } section.advice > div.content { background: rgba(100, 255, 100, 0.6); border-radius: 6px; margin: 1ex 0 2ex 0; padding: 0 1ex 1ex 1ex; box-shadow: 2px 2px 2px #6D6; } section.forbid > div.content { border: 2.5pt dotted red; padding: 0.5ex 1ex 1ex 1ex; background: rgba(255, 235, 60, 0.8); font-weight: bold; } section.help > div.content, section.demotiv > div.content { background: rgba(255, 207, 116, 0.8); border-radius: 6px; margin: 1ex 0 2ex 0; padding: 0 1ex 1ex 1ex; box-shadow: 2px 2px 2px #666; } section.help > div.content > h6, section.demotiv > div.content > h6 { border-bottom: thin solid white; background: #cd4d00; font-size: 82%; color: white; margin: 0 -1ex 0.8ex -1ex; padding: 0.5ex 1ex 0.5ex 1ex; border-radius: 6px; } section.exercise { display: flex; margin-top: 1.5ex; } section.exercise:not(.athome):before { content: url("Images/shifu.png"); margin: 0 -16px 0 0; padding: 0; } section.exercise.athome:before { content: url("Images/monkey.png"); margin: -14px -18px 0 0; padding: 0; } section.exercise > div.content { background: rgba(200, 255, 200, 0.6); border-radius: 6px; margin: 1ex 0 2ex 0; padding: 0 1ex 1ex 1ex; box-shadow: 2px 2px 2px #999; } section.exercise > div.content > h6 { border-bottom: thin solid white; background: #64FF64; font-size: 82%; margin: 0 -1ex 0.8ex -1ex; padding: 0.5ex 1ex 0.5ex 1ex; border-radius: 6px; } section.exercise > div.content > h5 { background: #316c1e; color: white; margin: 0 -1ex 0.8ex -1ex; padding: 0.5ex 1ex 0.5ex 1ex; border-radius: 6px; } section.exercise > div.content > ul { list-style-type: "❯ "; } section.exercise > div.content > ul > li { margin-bottom: 0.8ex; } span.difficulty { padding: 0 1ex 0 0.5ex; vertical-align: sub; } span.math { font-style: italic; font-family: sans; display: inline-block; } section.aside, aside { float: right; max-width: 55%; margin: 4ex 0ex 4ex 6ex; } section.aside { font-size: 95%; } aside.answers { font-size: 80%; max-width: 18%; } aside.fold { display: flex; } aside:before { content: url("Images/panda.png"); margin: -12px -12px 0 0; padding: 0; } aside > div.content > .yfold-content { background: rgba(160, 160, 220, 0.8); border: none !important; padding: 0 1ex 0 1ex; border-radius: 12px; box-shadow: 2px 2px 2px #CCC; } aside > div.content > .yfold-title { padding: 0.2ex 0.5ex 0.2ex 0ex; } aside > div.content > .yfold-title:hover { background: rgba(255, 255, 255, 0) !important; } aside .yfold-content > h5 { margin: 0 -1ex 0 -1ex; padding: 0.4ex 1ex 0.4ex 1ex; background: rgb(120, 120, 180); } caption { border: thin solid #99F; padding: 0.5ex 1ex 1ex 1ex; margin: 0 0 1ex 0; text-align: center; font-family: "Julius Sans One", serif; font-size: 110%; } table { border-collapse: collapse; margin: 2ex 2ex 2ex 2ex; padding: 0; border: thin solid #99F; } table th { margin: 0; padding: 0.2ex 3ex 0.2ex 3ex; font-variant: small-caps; font-weight: bold; font-size: larger; background: #DDF; border: thin solid #99F; text-align: center; } table tr td { margin: 0; padding: 0.2ex 1.4ex 0.2ex 1.4ex; text-align: center; } table tr { border: thin dashed #99F; } table.code_test { border-collapse: collapse; } table.code_test > tbody > tr > td, table.code_test > tr > td { margin: 0; padding: 0; } table.code_test > tbody > tr > td.col2, table.code_test > tr > td.col2 { display: inline-block; white-space: pre; margin: 0 2ex 0.2ex 2ex; padding: 0.2ex 1.5ex 0.2ex 1.5ex; background: rgba(180, 255, 180, 0.6); color: #336600; vertical-align: middle; display: table-cell; } table.code_test > tbody > tr > td.col3, table.code_test > tr > td.col3 { color: #555; font-size: 80%; vertical-align: middle; display: table-cell; padding: 0.2ex 1ex 0.2ex 1ex; } table.code_test > tbody > tr > td.col2:before, table.code_test > tr > td.col2:before { content: " → "; margin-left: -2.1ex; } table#aeroports td.col1, table.contact td.col1, table#cours td.col1 { font-weight: bold; font-variant: small-caps; font-family: sans-serif; } table#aeroports td.col4 { font-variant: small-caps; font-family: sans-serif; } table.contact td.col2 { border-left: thin dotted blue; border-right: thin dotted blue; } table.contact tr { border: none; } table.contact { display: inline-block; vertical-align: top; } table#cours td { padding: 0 2ex 1.4ex 2ex; text-align: left; } img { box-sizing: content-box; } img.hspace { margin: 1ex 4ex 1ex 4ex; } img.space { margin-left: auto; margin-right: auto; display: block; margin-top: 1.5ex; margin-bottom: 1.5ex; } img.inline { vertical-align: bottom; margin: 0; } img.nice-inline { vertical-align: top; margin: 0 1ex 0 1ex; } .inline-block { display: inline-block; } img.float { float: right; } div.schema { margin: 1.5ex 2ex 1.5ex 2ex; padding: 1em 1em 1em 1em; background: white; border: thin dotted #888; text-align: center; display: block; } section.stupid-flex-separator > h5 { display: none !important; } main.barebone { padding: 1ex 2ex 0ex 4ex; } main.barebone h2 { margin: 1ex -2ex 0.75ex -4ex; padding: 1ex 0ex 1ex 3ex; background: #C0FDF7; } main.barebone > ul > li { margin: 0.5ex 1ex 1ex 1ex; } main.barebone section.yfold { border: none !important; } html.ada1 > body { background-image: url("Images/ada1back.jpg"); background-position: center top; background-repeat: no-repeat; background-color: white; } section.capsule { overflow: hidden; border: 2px solid #BBF; border-radius: 30px; box-shadow: 10px 10px 5px #999; background: #DDF; color: #282828; margin: 2ex 2ex 4ex 4ex; padding: 1ex 4ex 1ex 4ex; } section.capsule > h3 { text-align: center; font-variant: small-caps; margin: -2ex -4ex 0ex -4ex; padding: 2ex 3ex 1ex 3ex; border-radius: 0px; font-size: 115%; background: #99F; color: black; text-shadow: 0 0 3px #fff, 0 0 5px #fff, 0 0 7px #fff, 0 0 9px #CCF, 0 0 11px #CCF, 0 0 13px #CCF; } div.capsule_titre span.pcom { font-variant: normal; font-size: small; color: #383838; } div.aflex { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: stretch; } div.graphe { background: white url("Images/Carte1b.png") right no-repeat; }