emels/static/css/main.css

   1 #main-promobox {
   2   float: right;
   3   width: 12.5em;
   4   height: 11.6875em; }
   5   #main-promobox a {
   6     background: #16a487;
   7     padding: 1em 0.625em;
   8     border-radius: 0.9375em;
   9     display: block;
  10     margin-bottom: 1em;
  11     width: 11.25em;
  12     float: left; }
  13     #main-promobox a:last-of-type {
  14       margin-bottom: 0; }
  15   #main-promobox h1 {
  16     background: #16a487;
  17     padding: 1em 0.625em;
  18     border-radius: 0.9375em;
  19     color: white;
  20     margin: 0;
  21     text-transform: uppercase;
  22     font-size: .9em;
  23     width: 12.625em;
  24     float: left;
  25     padding-top: 1.25em;
  26     padding-bottom: 1.25em;
  27     border-bottom-right-radius: 0;
  28     border-bottom-left-radius: 0; }
  29   #main-promobox h1:before {
  30     content: url(/static/img/icons/announce_white.png);
  31     margin-right: 1.2em;
  32     vertical-align: top; }
  33   #main-promobox h2 {
  34     color: white;
  35     font-size: .9em;
  36     /*margin: 1.1em 0 0 0;*/
  37     margin: 0;
  38     font-weight: normal;
  39     text-transform: uppercase; }
  40   #main-promobox p {
  41     color: #363a3e;
  42     font-size: .8em;
  43     line-height: 1.15em;
  44     margin: .3em 0; }
  45
  46 #main-sections {
  47   clear: both;
  48   float: left;
  49   margin-top: 1.2em;
  50   width: 43.75em; }
  51   #main-sections h1 {
  52     font-size: .9em;
  53     margin: 0 0 0 1.25em;
  54     text-transform: uppercase; }
  55   #main-sections ul {
  56     margin: -0.1875em 0 0 -1.25em;
  57     padding: 0;
  58     list-style: none; }
  59     #main-sections ul li {
  60       margin-top: 1.25em;
  61       margin-left: 1.25em;
  62       float: left;
  63       height: 5.625em;
  64       border-radius: 0.9375em; }
  65       #main-sections ul li a {
  66         color: white;
  67         text-transform: uppercase;
  68         height: 5em;
  69         display: table;
  70         padding: 5px; }
  71         #main-sections ul li a .in-box {
  72           font-size: .9em;
  73           height: 100%;
  74           width: 100%;
  75           display: table-cell;
  76           vertical-align: middle;
  77           border: 1px solid transparent;
  78           border-radius: 0.625em;
  79           padding: 0 1em; }
  80           #main-sections ul li a .in-box .name {
  81             display: block;
  82             font-size: 1.5em;
  83             line-height: 1em;
  84             margin-bottom: .2em; }
  85       #main-sections ul li a:hover .in-box {
  86         border: 1px solid white; }
  87     #main-sections ul .box1 {
  88       background-color: #adaeaf; }
  89     #main-sections ul .box2 {
  90       background-color: #f8b323; }
  91     #main-sections ul .box3 {
  92       background-color: #16a487; }
  93     #main-sections ul .box4 {
  94       background-color: #5e6165; }
  95     #main-sections ul .box5 {
  96       background-color: #f8b323; }
  97     #main-sections ul .box6 {
  98       background-color: #363a3e; }
  99     #main-sections ul .box7 {
 100       background-color: #adaeaf; }
 101     #main-sections ul .box8 {
 102       background-color: #ed7831; }
 103
 104 #main-howto {
 105   float: right;
 106   margin-top: 1.2em;
 107   width: 13.75em; }
 108   #main-howto h1 {
 109     font-size: .9em;
 110     margin: 0 0 0 1.4em;
 111     text-transform: uppercase; }
 112   #main-howto ul {
 113     margin: 1.0625em 0 1.0625em 1.4em; }
 114     #main-howto ul li {
 115       font-size: .9em;
 116       text-transform: uppercase;
 117       line-height: 1.25em; }
 118     #main-howto ul a:before {
 119       height: 1.25em; }
 120     #main-howto ul .knowledge:before {
 121       content: url(/static/img/icons/knowledge_dark.png); }
 122     #main-howto ul .activity:before {
 123       content: url(/static/img/icons/activity_dark.png); }
 124     #main-howto ul .lesson-plan:before {
 125       content: url(/static/img/icons/lesson-plan_dark.png); }
 126     #main-howto ul .reference:before {
 127       content: url(/static/img/icons/reference_dark.png); }
 128     #main-howto ul .knowledge:hover:before {
 129       content: url(/static/img/icons/knowledge_orange.png); }
 130     #main-howto ul .activity:hover:before {
 131       content: url(/static/img/icons/activity_orange.png); }
 132     #main-howto ul .lesson-plan:hover:before {
 133       content: url(/static/img/icons/lesson-plan_orange.png); }
 134     #main-howto ul .reference:hover:before {
 135       content: url(/static/img/icons/reference_orange.png); }
 136   #main-howto p {
 137     margin: 0 0 1.875em 1.4em; }
 138   #main-howto .side-banner img {
 139     display: block;
 140     width: 100%;
 141     margin-bottom: 0.2em; }
 142
 143 #main-chosen {
 144   clear: left;
 145   float: left;
 146   margin-top: 2em; }
 147   #main-chosen h1 {
 148     font-size: .9em;
 149     margin: 0 0 1em 1.25em;
 150     text-transform: uppercase; }
 151   #main-chosen .levelth {
 152     margin-left: 1.25em; }
 153
 154 #main-tools {
 155   clear: both; }
 156   #main-tools .main-tools-box {
 157     float: left;
 158     margin-top: 1.5em;
 159     margin-right: 1.25em;
 160     width: 17.5em; }
 161     #main-tools .main-tools-box h1 {
 162       margin: 0;
 163       font-size: .9em;
 164       text-transform: uppercase; }
 165     #main-tools .main-tools-box ul, #main-tools .main-tools-box ol {
 166       margin: 1.1em 0 0 0;
 167       font-size: .9em;
 168       line-height: 1.15em; }