/* Layout
 * 
 * Key:
 *   #wrapper: wraps everything
 *     width = arbitrary
 * 
 *   #main: roughly the left three-quarters of the page.
 *     width = #wrapper - #right - padding
 *   
 *   #right: right-hand sidebar, roughly a quarter of page width.
 *     width = arbitrary
 *   
 *   #left: optional left sidebar.
 *     width = arbitrary
 *   
 *   #middle: centre area if using left-hand sidebar.
 *     width = #main - #left - padding
 *   
 *   The value of 'padding' is currently: 30px
 * 
 *****************************************************************/

body {
    text-align: center;
    margin: 15px;
}

#wrapper {
    width: 930px;
    margin: 0 auto;
    text-align: left;
}

#header {
    width: 930px;
    position: relative;
}

#main, #header-main {
    float: left;
    width: 690px;
}

#header-main { width: 920px; }

#right, #header-right {
    width: 210px;
}

#right {
    float: right;
}

#header-right {
    position: absolute;
    right: 0px;
}

#left {
    float: left;
    width: 210px;
}

#middle {
    float: right;
    width: 450px;
}

#footer {
    clear: both;
}

/* Base colouring
 *****************************************************************/

body {
    background: #efefef url(i/background.png);
}

.module {
    background: white;
}

/* Modules and their corners
 *****************************************************************/

.module, .no-middle, #middle {
    position: relative;
}

.hd, .main-hd, .middle-hd, .ft, .main-ft, .middle-ft {
    background-repeat: no-repeat;
    
    position: absolute;
    left: 0;
    right: 0;
    
    padding: 0;
}

.hd, .main-hd, .middle-hd {
    background-position: top left;
    top: 0;
}

.ft, .main-ft, .middle-ft {
    background-position: bottom left;
    bottom: 0;
}

.bd, .main-bd, .middle-bd {
    z-index: 1;
    position: relative;
}

#neon {
    background-image: url(i/planet-neon-video-background-20090311-100302.jpg);
    background-repeat:no-repeat;
}

#youtube {
  position:absolute;
}

/* Images and image-dimension-dependent things */

/* Header */

#header .hd, #header .ft {
    width: 210px;
    height: 16px;
}

#header .hd { background-image: url(i/module-header-top.png);    }
#header .ft { background-image: url(i/module-header-bottom.png); }

/* Main, full-width. Must come before #left, #right and #middle declarations. */

#main .module { background-image: url(i/module-main.png) }

#main .hd, #main .ft {
    width: 650px;
    height: 22px;
}

#main .hd { background-image: url(i/module-main-top.png);    }
#main .ft { background-image: url(i/module-main-bottom.png); }

/* Columns */

#main .column, #main .column .hd, #main .column .ft {
    width: 315px;
}

#main .column {
    background-image: url(i/column.png);
}

#main .column .hd { background-image: url(i/column-top.png);    }
#main .column .ft { background-image: url(i/column-bottom.png); }

.column-left  { float: left;  }
.column-right { float: right; }

/* Sidebars */

#left .module, #right .module { background: white; }

#left .hd, #right .hd, #left .ft, #right .ft {
    width: 210px;
    height: 22px;
}

#left .hd, #right .hd { background-image: url(i/module-sidebar-top.png);    }
#left .ft, #right .ft { background-image: url(i/module-sidebar-bottom.png); }

/* Middle */
#middle ul { list-style:none; }

#middle .module { background-image: url(i/module-middle.png) }

#middle .hd, #middle .ft {
    width: 410px;
    height: 22px;
}

#middle .hd { background-image: url(i/module-middle-top.png);    }
#middle .ft { background-image: url(i/module-middle-bottom.png); }

/* Homepage and filled modules */

#middle .fill, #main .main-bd .fill { background: #ddd; }

#middle .fill .hd { background-image: url(i/module-fill-top.png);    }
#middle .fill .ft { background-image: url(i/module-fill-bottom.png); }

#main .main-bd .fill .hd { background-image: url(i/module-main-fill-top.png);    }
#main .main-bd .fill .ft { background-image: url(i/module-main-fill-bottom.png); }

/* Sidebar sub-modules and inline modules */

#left .bd .hd, #right .bd .hd, #left .bd .ft, #right .bd .ft,
#main .inline-module .hd, #main .inline-module .ft {
    width: 180px;
    height: 12px;
}

#left .bd .hd, #right .bd .hd, #main .inline-module .hd { background-image: url(i/module-sidebar-sub-top.png)    !important; }
#left .bd .ft, #right .bd .ft, #main .inline-module .ft { background-image: url(i/module-sidebar-sub-bottom.png) !important; }

/* Corners of main div when there is no middle */

.no-middle { background-image: url(i/main.png); background-repeat: repeat-y; }

.main-hd, .main-ft {
    width: 690px;
    height: 28px;
}

.main-hd { background-image: url(i/main-top.png);    }
.main-ft { background-image: url(i/main-bottom.png); }

/* Corners of middle div */

#middle { background-image: url(i/middle.png); background-repeat: repeat-y; }

.middle-hd, .middle-ft {
    width: 450px;
    height: 28px;
}

.middle-hd { background-image: url(i/middle-top.png);    }
.middle-ft { background-image: url(i/middle-bottom.png); }

/* Min-heights */

.module {
    min-height: 44px;
}

#header .module {
    min-height: 32px;
}

/* Padding and margin */

.bd {
    padding: 12px 15px;
}

.main-bd, .middle-bd {
    padding: 20px;
}

#header-right .module {
    margin-bottom: 5px;
}

#main .module {
    margin-top: 20px;
}

#left .module, #right .module {
    margin-top: 0;
    margin-bottom: 15px;
}

#left .module .module, #right .module .module {
    margin-bottom: 0;
    margin-top: 10px;
}

/* Inline modules */

#main .inline-module {
    width: 180px;
    margin-top: 10px;
    margin-bottom: 10px;
}

#main .inline-module-left {
    float: left;
    margin-right: 10px;
}

#main .inline-module-right {
    float: right;
    margin-left: 10px;
}

/* sidebar links */
.sidebar-links { font-size:20px; }
.sidebar-links a { font-size:14px; }

/* Header and footer
 *****************************************************************/

#header {
    background: url(i/uclu-logo2.png) 12px 0 no-repeat;
    padding-top: 78px;
}

h1 {
    display: none;
}

#header-main li {
    float: left;
    width: 210px;
    margin-top: 1px;
    margin-right: 30px;
/*    margin-left: 10px; */
    margin-bottom: 9px;
    background: #888 url(i/nav-button.png) top left no-repeat;
}

#header-main li a {
    display: block;
    min-height: 22px;
    padding: 3px 14px 0 14px;
    
    text-decoration: none;
    color: white;
    font-size: 16px;
}

#header-main {
    margin-bottom: 11px;
}

#global-search, #login, #login-form {
    font-size: 11px;
    padding: 0 12px;
}

#global-search {
    background: #ccc url(i/global-search.png) top left no-repeat;

    padding-top: 8px;    
    height: 42px;
}

#login {
    background: #ccc url(i/login.png) top left no-repeat;
    
    padding-top: 6px;
    min-height: 34px;
}

#login-form {
    background: url(i/login-form.png) top left no-repeat;
    
    padding-top: 6px;
    padding-bottom: 6px;
    
    min-height: 59px;
    
    position: relative;
    z-index: 2;
}

#login-form label, #login-form input {
    display: block;
    float: left;
    position: relative;
    z-index: 3;
}

#login-form label {
    width: 60px;
}

#login-form input {
    width: 100px;
}

#login-form p {
    clear: both;
    padding-top: 4px;
}

#login-submit {
    width: auto !important;
    margin-left: 60px;
}
#login-cancel-link {
    background-color:transparent;
    border-width:0px; margin-left:10px;
    text-decoration:underline;
}

#global-search form, #global-search-q {
    height: 16px;
}

#global-search-q {
    float: left;
    width: 120px;
}

#global-search-submit {
    float: right;
    width: 50px;
    padding: 0;
}

#global-search-restrict {
    clear: left;
    padding-top: 4px;
    width: 170px;
}

#global-search-restrict label {
    margin-left: 4px;
}

#local-nav, #footer {
    background: url(i/full-width-box.png) top left no-repeat;
}

#local-nav {
    clear: both;
    padding: 3px 10px 0 10px;
    min-height: 22px;
    margin-bottom: 11px;
}
#local-nav a { display:block; float:left; text-align:center; color:white; text-decoration:none; }
.three-col a { width:32%; }
.four-col a { width:22%; }

#footer {
    background-color: white;
    min-height: 25px;
}

#footer ul {
    padding: 5px 7px;
    
    font-size: 11px;
}

#footer li {
    display: inline;
    padding: 0 0.5em;
    border-left: 1px solid black;
}

#footer li.first-child {
    border-left: none;
}

#footer li a {
    text-decoration: none;
}

/* Body area
 *****************************************************************/

#main, #right {
    margin: 0.5em 0;
}

#page-controls {
    text-align: right;
}
#page-controls button {
   width:200px; height:35px; text-align:left; font-size:14px; color:#666;
   background-image:url(i/homepage-button.gif); background-repeat:no-repeat; background-color:transparent;
   text-align:left; text-indent:10px;
   border-width:0px; padding:0px;
}

/* Sidebar buttons
 *****************************************************************/
 
.sidebar-button {
    min-height: 25px;
    margin-bottom: 15px;

    background: #888 url(i/sidebar-button.png) top left no-repeat;
}

.sidebar-button a {
    display: block;
    padding: 3px 14px 0 14px;
    
    text-decoration: none;
    text-align: left;
    color: white;
    font-size: 16px;
}

/* Tour buttons */

.tour-button .bd {
    min-height: 72px;
}

.tour-button h3 {
    margin-bottom: 5px;
}

.tour-button a {
    text-decoration: none !important;
}

.tour-button-go {
    display: block;
    float: right;
    width: 47px;
    height: 47px;
    margin-left: 20px;
    background-position: top-left;
    background-repeat: no-repeat;
}

.promo { margin-bottom:15px; }
.promo img { display: block; } /* so don't get padding underneath */

/* Contact icons
 *****************************************************************/

.contact-telephone,
.contact-email,
.contact-address,
.opening-hours  {
    margin-top: 8px;
}

.contact-telephone, .contact-email {
    width: 124px;
    height: 32px;
    padding: 14px 0 0 54px;
    
    background-position: top left;
    background-repeat: no-repeat;
}

.contact-telephone {
    background-image: url(i/contact-telephone.png);
}

.contact-email {
    background-image: url(i/contact-email.png);
    font-size: 0.75em;
}

/* Tours
 *****************************************************************/

.tour .intro {
    margin-top: 10px;
    margin-bottom: 20px;
}
 
.tour-image {
    float: left;
    padding: 11px;
    background: url(i/tour-image.png) top left no-repeat;
}

.tour-box h2, .tour-para {
    float: right;
    width: 450px;
}

.tour-box h2 {
    /*margin-top: 10px;*/
    margin-bottom: 15px;
}

.tour-box2 h2, .tour-para {
    float: left;
    width: 450px;
}

.tour-box2 h2 {
    /*margin-top: 10px;*/
    margin-bottom: 15px;
}
    
/* Form styling
 *****************************************************************/

form.pretty p {
    clear: both;
    margin-top: 5px;
}

form.pretty p label {
    float: left;
    width: 150px;
    margin-right: 10px;
}

form.pretty p input,
form.pretty p select,
form.pretty p textarea {
    border: 1px solid #888;
    width: 250px;
    padding: 1px;
}

form p .required {
    background-color: #cdf;
}

form.submit-failed p .required {
    background-color: #fdc;
}

/* Blogs
 *****************************************************************/

/* "Post to this blog" form */

#blog-form {
    text-align: left;
    margin-bottom: 20px;
}

#blog-form h3 {
    margin-bottom: 5px;
}

#blog-form input, #blog-form textarea {
    display: block;
    width: 373px;
    margin-bottom: 5px;
}

#blog-form button {
    margin-right: 5px;
}

#blog-save {
    font-weight: bold;
}

#blog-post-title {
    font-size: 20px;
}

#blog-post-summary {
    height: 40px;
}

#blog-post-body {
    height: 200px;
}

.blog-title {
    font-size: 24px;
    padding-bottom: 6px;
}

.blog-post-date, .blog-post-categories {
    background-image: url(i/module-rule.png);
    background-repeat: repeat-x;
    margin: 0 -15px;
    padding: 0 15px;
}

.blog-post-date {
    background-position: bottom left;
    font-size: 24px;
    padding-bottom: 6px;
}

.blog-post-title {
    padding-top: 8px;
    padding-bottom: 6px;
    font-weight: bold;
}

.blog-post-body {
    padding-top: 10px;
    padding-bottom: 6px;
}

.blog-post-categories {
    background-position: top left;
    padding-top: 7px;
    clear:left;
}

.blog-post-categories, .blog-post-comments {
    font-size: 0.8em;
}

.blog-post-category-link {
    font-weight: bold;
}

.blog-contributors > .bd {
    padding-bottom: 15px;
}

.blog-photo {
   text-align:center;
}
.blog-photo img { border:1px solid white; margin-top:4px; margin-bottom:4px; }

.contributor-photo {
    text-align: center;
    margin-bottom: 4px;
}

.contributor-photo img {
    border: 6px solid white;
}

.contributor-name {
    font-weight: bold;
}

.contributor-statement {
    margin-top: 10px;
}

#user-profile label {
   display:block; float:left; width:90px; color:#999;
}


/* Volunteering
 *****************************************************************/


.volunteering-title {
    font-size: 24px;
    padding-bottom: 6px;
}

.volunteering-division {
    background-image: url(i/module-rule.png);
    background-repeat: repeat-x;
    margin: 0 -15px;
    padding: 0 15px;
}



.volunteering-title {
    padding-top: 8px;
    padding-bottom: 6px;
    font-weight: bold;

}

.volunteering-body {
    padding-top: 10px;
    padding-bottom: 6px;
        border-top: 2px, solid, #cccccc;
        border-bottom: 2px, solid, #cccccc;
}

.volunteering-categories {
    background-position: top left;
    padding-top: 7px;
    clear:left;

}

.volunteering-categories, {
    font-size: 0.8em;
}





/* Search
 *****************************************************************/

#search-results {
    padding: 7px 22px;
}

.search-result {
    margin: 15px 0;
}

.search-result h3 {
    font-size: 24px;
    font-weight: bold;
}

.search-result a, #search-pagination a {
    color: #999;
}

.search-result-tags {
    margin-top: 10px;
}

.search-result-category {
    font-weight: bold;
}

#search-pagination {
    font-size: 20px;
    color: #ccc;
    text-align: center;
    padding: 15px;
}

.search-prev, .search-next {
    font-weight: bold;
}

.search-author {
    font-weight: bold;
    margin: 0.5em 0;
}

/* Login page
 *****************************************************************/

.login-page #main label {
    display: block;
    float: left;
    width: 100px;
}

.login-page #main p {
    clear: both;
    padding-top: 5px;
}

/* Homepage
 *****************************************************************/

.homepage #middle div.module {
    margin: 8px 0;
}

/* Drag-and-drop interface */

.kit-drag-drop-list .drop-target {
    height: 2px;
    overflow: hidden;
}

.kit-drag-drop-list .highlight {
    background: #333;
}

.kit-drag-drop-list .draggable {
    cursor: move;
}

.kit-drag-drop-list .drag {
    z-index: 100;
    
    opacity: 0.5;
    -moz-opacity: 0.5;
    filter: alpha(opacity=50);
}

.module-add-button, .module-delete-button {
    float: right;
    
    width: 16px;
    height: 16px;
    
    background: none;
    background-position: 0 0;
    background-repeat: no-repeat;
    border: none;
    
    cursor: pointer;
}

.module-add-button:hover, .module-delete-button:hover {
    background-position: -16px 0;
}

.module-add-button    { background-image: url(i/module-add.gif);    }
.module-delete-button { background-image: url(i/module-delete.gif); }

.fill .module-add-button    { background-image: url(i/module-add-white.gif);    }
.fill .module-delete-button { background-image: url(i/module-delete-white.gif); }

.module-picture { margin-right:15px; }
.rss-feed-links { float:left; }

#module-editors-picks img { border:2px solid #e3e3e3; }
/*#module-student-union--forum--index .bd { background-image:url(i/bubble.gif); background-position:top right; background-repeat:no-repeat; }*/

.module .collapsed img { display:none; }

.downloads img { margin-right:6px; }

/* Vacancies
*****************************************************************/
.vacancy-details p { padding-top:2px; }
.vacancy-details .label { font-weight:bold; color:#999; }
.vacancy-details .subheading { font-size:18px; }

/* Calendar
*****************************************************************/
.vevent .dtstart {
    font-size: 24px;
    padding-bottom: 10px; 
    color:#f66; border-bottom-width:0px;
}
.vevent .event-time-cat {
    font-size: 16px;
    font-weight:bold;
    color:#f66;
        margin-top:14px;
}
.vevent .summary {
    font-size: 24px; font-weight:bold;
    padding-bottom: 6px;
    color:#f00;
}
.vevent label { font-weight:bold; }
.vevent description { padding-bottom:10px; }
.month-calendar a:hover { background-color:red; color:white ! important; text-decoration:none; }
.event-photo { margin-left:20px; margin-top:15px; }
.event-titles td { padding-top:10px; }

/* Election banner
 *****************************************************************/

#election-banner {
    background: url('i/spring-elections-vote-banner.png') top left no-repeat;
    
    display: block;
    
    position: absolute;
    top: 0;
    right: 0;
    
    width: 432px;
    height: 45px;
    
    padding: 13px 0 0 18px;
    
    font-size: 0.9em;
    text-decoration: none;
}

#election-text1 {
    position: absolute;
    right: 10px;
}

.election-title {
    font-weight: bold;
    color: #609;
}

/* Subscribe options 
 *****************************************************************/
#subscribe-options { float:right; }
#subscribe-options button { 
    border-width:0px; background-color:white;
    margin:0px; margin-left:8px; padding:0px; 
}
#subscribe-options a img { 
     margin:0px; margin-left:8px; 
}
#subscribe-module { background-color: #fb9225 ! important; }
#subscribe-module p { padding-top:3px; padding-bottom:3px; }
#subscribe-module label { min-width:110px; }
.subscribe-checkbox { margin-left:110px; }
#subscribe-module button { 
    border-width:0px; background-color:transparent;
    margin:0px; padding:0px; 
    float:right;
}

/* Find a job 
 *****************************************************************/
#jobs-saved-searches a {
   display:block; margin-top:2px; margin-bottom:2px;
   background-image:url(i/saved-search.gif);
   background-repeat:no-repeat;
   text-indent:20px;
}

/* Your subscriptions
 *****************************************************************/

#subs-form table {
    margin: 10px 0;
}
 
#subs-form th, #subs-form td {
    padding: 2px;
    padding-right: 10px;
}
 
#subs-form .sub-inactive {
    color: #aaa;
}
 
#subs-form .sub-delete {
    background-color: #faa;
}

/* Comments
 *****************************************************************/

.comment-byline {
    text-align: right;
    font-size: 0.9em;
}

.comment-username {
    font-weight: bold;
}
#comment-body { width:100%; }

/* Forums
 *****************************************************************/

.thread-list {
    width: 100%;
}

.thread-list th {
    font-weight: bold;
}

.thread-title {
    font-size: 1.2em;
    font-weight: bold;
    padding-top: 8px;
}

.thread-username {
    width: 150px;
}

.thread-updated {
    width: 150px;
}

.thread-count {
    width: 20px;
}

/* Errors and messages
 *****************************************************************/

.progress {
    background-image: url(i/progress.gif);
    background-position: center right;
    background-repeat: no-repeat;
    
    padding-right: 28px;
    min-height: 24px;
}
 
#kit-message {
    display: none;
    clear: both;

    font: 11px verdana, sans-serif;
    background: #a00;
    color: white;
    padding: 3px;
}

.kit-message-header {
    font-weight: bold;
}

.kit-message-body {
    white-space: pre;
}

/* Category colouring
 *****************************************************************/

/* For edit mode and stuff */
.fill { background: #888 !important; }

.category-calendar #body a         { color: #f00; }
.category-calendar .fill,
.category-calendar .sidebar-button,
.category-calendar #local-nav,
.fill-calendar,
.hover-calendar:hover              { background-color: #f00 !important; }

.category-clubs-societies #body a         { color: #f60; }
.category-clubs-societies .fill,
.category-clubs-societies .sidebar-button,
.category-clubs-societies #local-nav,
.fill-clubs-societies,
.hover-clubs-societies:hover              { background-color: #f60 !important; }
.category-clubs-societies .fill-mid       { background-color: #ff802b !important; }

.category-student-union .blog-post-date { color: #96c; }
.category-student-union .blog-post-title,
.category-student-union #body a         { color: #609; }
.category-student-union .fill,
.category-student-union .sidebar-button,
.category-student-union #local-nav,
.fill-student-union,
.hover-student-union:hover              { background-color: #609 !important; }
.category-student-union .fill-mid       { background-color: #96c !important; }

.category-leisure-fitness .blog-post-date { color: #f6c; }
.category-leisure-fitness .blog-post-title,
.category-leisure-fitness #body a         { color: #f09; }
.category-leisure-fitness .fill,
.category-leisure-fitness .sidebar-button,
.category-leisure-fitness #local-nav,
.fill-leisure-fitness,
.hover-leisure-fitness:hover              { background-color: #f09 !important; }

.category-get-involved .blog-post-date { color: #f6f; }
.category-get-involved .blog-post-title,
.category-get-involved #body a         { color: #c0c; }
.category-get-involved .fill,
.category-get-involved .sidebar-button,
.category-get-involved #local-nav,
.fill-get-involved,
.hover-get-involved:hover              { background-color: #c0c !important; }

.category-get-advice .blog-post-date { color: #68f; }
.category-get-advice .blog-post-title,
.category-get-advice #body a         { color: #03c; }
.category-get-advice .fill,
.category-get-advice .sidebar-button,
.category-get-advice #local-nav,
.fill-get-advice,
.hover-get-advice:hover              { background-color: #03c !important; }
.category-get-advice .fill-mid  { background-color: #567beb !important; }
.category-get-advice .fill-light  { background-color: #d1dbfb !important; }

.category-find-a-job #body a         { color: #06f; }
.category-find-a-job .fill,
.category-find-a-job .sidebar-button,
.category-find-a-job #local-nav,
.fill-find-a-job,
.hover-find-a-job:hover              { background-color: #06f !important; }
.category-find-a-job .fill-mid       { background-color: #69f !important; }

.category-volunteers #body a         { color: #00ceff; }
.category-volunteers .fill,
.category-volunteers .sidebar-button,
.category-volunteers #local-nav,
.fill-volunteers,
.hover-volunteers:hover              { background-color: #00ceff !important; }

.category-calendar .tour-button-go,
    .fill-calendar .tour-button-go      { background-image: url(i/tour-button-calendar.png); }
.category-clubs-societies .tour-button-go,
    .fill-clubs-societies .tour-button-go      { background-image: url(i/tour-button-clubs-societies.png); }
.category-student-union .tour-button-go,
    .fill-student-union .tour-button-go   { background-image: url(i/tour-button-student-union.png); }
.category-leisure-fitness .tour-button-go,
    .fill-leisure-fitness .tour-button-go    { background-image: url(i/tour-button-leisure-fitness.png); }
.category-get-involved .tour-button-go,
    .fill-get-involved .tour-button-go      { background-image: url(i/tour-button-get-involved.png); }
.category-get-advice .tour-button-go,
    .fill-get-advice .tour-button-go        { background-image: url(i/tour-button-get-advice.png); }
.category-find-a-job .tour-button-go,
    .fill-find-a-job .tour-button-go { background-image: url(i/tour-button-find-a-job.png); }
.category-volunteers .tour-button-go,
    .fill-volunteers .tour-button-go { background-image: url(i/tour-button-volunteers.png); }

.fill, .fill a, .blog-contributor a, .sidebar-button a, #local-nav {
    color: white !important;
}

.category-none #local-nav, .category-general #local-nav {
    background-color: #ccc;
    color: black !important;
}

/* Float clearing
 *****************************************************************/

.tour-box .bd:after,
.tour-box2 .bd:after,
.tour-button .bd:after,
.main-bd:after,
.middle-bd:after {
    display: block;
    clear: both;
    content: " ";
    height: 1px;
    visibility: hidden;
}



/* Election specific
 *****************************************************************/

#electionbar li {
    float: left;
    width: 182px;
    margin-right: 22px;
    margin-bottom: 9px;    
    display: block;
    min-height: 22px;
    padding: 3px 14px 0 14px;
    
    text-decoration: none;
    color: white;
    font-size: 12px;
    
    background: #888 url(i/nav-button.png) top left no-repeat;
}




#electionbar  {
    padding-top: 30px;
    margin-bottom: 11px;
}

#electionlogin {
    padding-left: 710px;
    width: 210px;
    margin-top: -80px;
    }
.spaceme {
    margin-left: 20px;
    }