Data hosted with ♥ by Pastebin.com - Download Raw - See Original
  1. h1, h2, h3 {
  2.     font-weight: normal;
  3. }
  4.  
  5. h2 {
  6.     margin: 10px 0px 5px 0px;
  7.     padding: 0px;
  8. }
  9.  
  10. h3 {
  11.     margin: 0px 0px 10px 0px;
  12.     color: #de6581;
  13. }
  14.  
  15. body {
  16.     color: #666666;
  17.     background-color: #f9f8f6;
  18.     background-image: url("../image/artistic-wood.jpg");
  19.     background-position: center;
  20.     font-family: Georgia, Times, serif;
  21.     line-height: 1.4em;
  22.     margin: 0px;
  23. }
  24.  
  25. .wrapper {
  26.     width: 940px;
  27.     margin: 20px auto;
  28.     background-color: #ffffff;
  29.     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  30. }
  31.  
  32. .sticky {
  33.     position: -webkit-sticky;
  34.     position: sticky;
  35.     top: 0;
  36.     height: max-content;
  37. }
  38.  
  39. .pink {
  40.     color: #de6581;
  41. }
  42.  
  43. /* HEADER */
  44. header {
  45.     display: inline;
  46.     height: 175px;
  47. }
  48.  
  49. header .jumbotron {
  50.     background-image: url("../image/header.png");              
  51. }
  52.  
  53. h1 {
  54.     text-indent: -9999px;
  55.     width: 940px;
  56.     height: 130px;
  57.     margin: 0px;
  58. }
  59.  
  60. nav {
  61.     clear: both;
  62.     display: block;
  63.     color: #ffffff;
  64.     background-color: #de6581;
  65.     padding: 5px 0px;
  66. }
  67.  
  68. nav ul {
  69.     margin: 0px;
  70.     padding: 5px 0px 5px 30px;
  71. }
  72.  
  73. nav li {
  74.     display: inline;
  75.     margin-right: 40px;
  76. }
  77.  
  78. nav li a {
  79.     color: #ffffff;
  80.     text-decoration: none;
  81. }
  82.  
  83. nav li a:hover,
  84. nav li a.current {
  85.     color: #444444;
  86. }
  87.  
  88. /* MAIN */
  89. main {
  90.     display: flex;
  91.     justify-content: space-between;
  92.     margin: 20px 0px;
  93.     min-height: 800px;
  94. }
  95.  
  96. section {
  97.     display: block;
  98. }
  99.  
  100. section.content {
  101.     float: left;
  102.     width: 70%;
  103. }
  104.  
  105. article {
  106.     clear: both;
  107.     display: block;
  108.     overflow: auto;
  109.     width: 100%;
  110. }
  111.  
  112. /* ALL CONTENT */
  113. article h2 {
  114.     margin-left: 20px;
  115. }
  116.  
  117. .content p {
  118.     margin-left: 20px;
  119.     margin-right: 20px;
  120.     text-align: justify;
  121. }
  122.  
  123. /* CONTENT: COURSES AND MENU */
  124. figure {
  125.     display: block;
  126.     float: left;
  127.     width: 290px;
  128.     height: 220px;
  129.     padding: 5px;
  130.     margin: 20px 20px 10px 20px;
  131.     border: 1px solid #eeeeee;
  132. }
  133.  
  134. figure img {
  135.     width: 288px;
  136.     height: 189px;
  137. }
  138.  
  139. figcaption {
  140.     display: block;
  141.     font-size: 90%;
  142.     text-align: center;
  143. }
  144.  
  145. hgroup {
  146.     margin-top: 40px;
  147.     margin-right: 20px;
  148. }
  149.  
  150. .more {
  151.     float: right;
  152.     margin: 10px 20px 0px 0px;
  153. }
  154.  
  155. .more a {
  156.     text-decoration: none;
  157.     color: #de6581;
  158.    
  159. }
  160.  
  161. /* CONTENT: ABOUT AND CONTACT*/
  162. h2.top {
  163.     margin-top: 20px;
  164. }
  165.  
  166. .container {
  167.     margin: 20px 20px 10px 20px;
  168. }
  169.  
  170. .container iframe {
  171.     width: 605px;
  172.     height: 335px;
  173.     border: 0px;
  174. }
  175.  
  176. /* CONTENT: CONTACT */
  177. #contact ul {
  178.     margin: 20px 0px;
  179.     padding-left: 40px;
  180. }
  181.  
  182. li.contact-list {
  183.     list-style-type: none;
  184.     margin-top: 10px;
  185. }
  186.  
  187. img.contact-image {
  188.     vertical-align: middle;
  189.     height: 24px;
  190. }
  191.  
  192. a.contact-text {
  193.     color: #666666;
  194.     text-decoration: none;
  195.     margin-left: 10px;
  196. }
  197.  
  198. a.contact-text:hover {
  199.     font-weight: bolder;
  200. }
  201.  
  202. a.contact-text:visited {
  203.     color: #666666;
  204. }
  205.  
  206. #location a {
  207.     color: #de6581;
  208.     font-weight: bolder;
  209. }
  210.  
  211. /* #location a.contact-text:hover {
  212.     font-weight: initial;
  213. } */
  214. /* ASIDE */
  215. aside {
  216.     width: 30%;
  217.     float: right;      
  218.     display: block;
  219.     padding: 0px 0px 0px 20px;
  220.     border-left: 1px solid #eeeeee;
  221. }
  222.  
  223. aside h2 {
  224.     padding: 20px 0px 10px 0px;
  225. }
  226.  
  227. aside section a {
  228.     display: block;
  229.     color: #666666;
  230.     text-decoration: none;
  231.     padding: 10px;
  232.     margin-right: 30px;
  233.     border-bottom: 1px solid #eeeeee;
  234. }
  235.  
  236. aside section a:hover {
  237.     color: #de6581;
  238.     font-weight: bolder;
  239. }
  240.  
  241. /* FOOTER */
  242. footer {
  243.     font-size: 80%;
  244.     text-align: center;
  245.     clear: both;
  246.     display: block;
  247.     color: #ffffff;
  248.     background-color: #de6581;
  249.     padding: 5px 0px;
  250. }