edumed/static/css/main.scss

   1 $px: .0625em;
   2
   3 #main-promobox {
   4     float: right;
   5
   6     border-radius: 15*$px;
   7
   8     background: #16a487;
   9     padding: 1.5em 20*$px;
  10     width: 220*$px - 2 * 20*$px;
  11     height: 235*$px - 2 * 1.5em;
  12
  13     h1 {
  14         color: white;
  15         margin: 0;
  16         text-transform: uppercase;
  17         font-size: .9em;
  18     }
  19     h1:before {
  20         content: url(/static/img/icons/announce_white.png);
  21         margin-right: 1.2em;
  22         vertical-align: top;
  23     }
  24     h2 {
  25         color: white;
  26         font-size: .9em;
  27         margin: 1.1em 0 0 0;
  28         font-weight: normal;
  29         text-transform: uppercase;
  30     }
  31     p {
  32         color: #363a3e;
  33         font-size: .8em;
  34         line-height: 1.15em;
  35         margin: .3em 0;
  36     }
  37 }
  38
  39
  40 #main-sections {
  41     clear: both;
  42     float: left;
  43     margin-top: 1.2em;
  44     width: 700*$px;
  45
  46     h1 {
  47         font-size: .9em;
  48         margin: 0 0 0 1.6em;
  49         text-transform: uppercase;
  50     }
  51
  52     ul {
  53         margin: -3*$px 0 0 -20*$px;
  54         padding: 0;
  55         list-style: none;
  56
  57         li {
  58             margin-top: 20*$px;
  59             margin-left: 20*$px;
  60             float: left;
  61             width: 160*$px;
  62             height: 90*$px;
  63             border-radius: 15*$px;
  64
  65             a {
  66                 color: white;
  67                 text-transform: uppercase;
  68                 display: block;
  69                 height: 80*$px;
  70                 width: 150*$px;
  71                 display: table;
  72                 padding: 5*$px;
  73
  74                 span {
  75                     font-size: .9em;
  76                     height: 100%;
  77                     width: 100%;
  78                     display: table-cell;
  79                     vertical-align: middle;
  80                     border: 1px solid transparent;
  81                     border-radius: 10*$px;
  82                     padding-left: 16*$px;
  83                 }
  84             }
  85             a:hover span {
  86                 border: 1px solid white;
  87             }
  88         }
  89         .box1 {background-color: #adaeaf;}
  90         .box2 {background-color: #f8b323;}
  91         .box3 {background-color: #16a487;}
  92         .box4 {background-color: #5e6165;}
  93         .box5 {background-color: #16a487;}
  94         .box6 {background-color: #363a3e;}
  95         .box7 {background-color: #adaeaf;}
  96         .box8 {background-color: #ed7831;}
  97     }
  98 }
  99
 100 #main-chosen {
 101     float: right;
 102     margin-top: 1.2em;
 103     width: 220*$px;
 104
 105     h1 {
 106         font-size: .9em;
 107         margin: 0 0 0 1.4em;
 108         text-transform: uppercase;
 109     }
 110
 111     ul {
 112         margin: 17*$px 0 0 1.4em;;
 113
 114         li {
 115             font-size: .9em;
 116             text-transform: uppercase;
 117             line-height: 1.25em;
 118         }
 119     }
 120 }
 121
 122 #main-tools {
 123     clear: both;
 124     .main-tools-box {
 125         float: left;
 126         margin-top: 1.5em;
 127         margin-right: 20*$px;
 128         width: 280*$px;
 129
 130         h1 {
 131             margin: 0;
 132             font-size: .9em;
 133             text-transform: uppercase;
 134         }
 135
 136         ul, ol {
 137             margin: 1.1em 0 0 0;
 138             font-size: .9em;
 139             line-height: 1.15em;
 140         }
 141     }
 142 }