Page Information

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
HTML
<style>
    .row {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        margin-top: 0;
        margin-bottom: 0;
        max-width: 62.5rem;
    }
    .row:before, .row:after {
        content: " ";
        display: table;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    .row:after {
        clear: both;
    }
    .column, .columns {
        position: relative;
        padding-left: 0.9375rem;
        width: 100%;
        float: left;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    @media only screen and (min-width: 64.063em) {
        .large-3 {
            width: 33%;
        }
        .large-6 {
            width: 50%;
        }
        .large-12 {
            width: 90%;
        }
        .column, .columns {
            position: relative;
            padding-left: 0.9375rem;
            float: left;
        }
    }
    @media only screen and (min-width: 40.063em) {
        .column, .columns {
            position: relative;
            padding-left: 0.9375rem;
            float: left;
            margin-bottom: 15px;
        }
    }
    [class*="column"] + [class*="column"]:last-child {
        float: right;
    }
    .why-change {
        background: #ca4766; 
        height: 175px;
    }
    .consultation {
        background: #96281B; 
        height:	175px;
    }
    .news {
        background: #c4c4c4; 
        height:	175px;
    }
    .say {
        background: #95bf59; 
        height:	175px;
    }
    .faqs {
        background: #c84545; 
        height:	175px;
    }
    .contact {
        background: #5fa8d7; 
        height:	175px;
    }
    .box-text {
        position: absolute;
        bottom: 20px;
        color: #ffffff;
        font-size: 24px;
        font-weight: 100;
        left: 30px;
        width: 70%;
        line-height: 30px;
        font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
    }
</style>
<div class="row">
    <div class="large-6 columns">
        <a href="https://my.sunderland.ac.uk/display/ES/Accommodation" target="_top">
            <div class="why-change">
                <div class="box-text">Accommodation</div>
            </div>
        </a>
    </div>
    <div class="large-6 columns">
        <a href="https://my.sunderland.ac.uk/display/ES/Eating+on+Campus" target="_top">
            <div class="consultation">
                <div class="box-text">Eating on campus</div>
            </div>
        </a>
    </div>
    <div class="large-6 columns">
        <a href="https://my.sunderland.ac.uk/display/ES/PrintPrinting+Services" target="_top">
            <div class="faqs">
                <div class="box-text">Print services</div>
            </div>
        </a>
    </div>
    <div class="large-6 columns">
        <a href="https://my.sunderland.ac.uk/pages/viewpage.action?pageId=106737365" target="_top">
            <div class="faqs">
                <div class="box-text">Transport and Travel</div>
            </div>
        </a>
    </div>
    <div class="large-6 columns">
        <a href="https://www.sunderland.ac.uk/help/contact-us/parking/" target="_top">
            <div class="faqs">
                <div class="box-text">Car Parking</div>
            </div>
        </a>
    </div>
    <div class="large-6 columns">
        <a href="https://my.sunderland.ac.uk/display/ES/Reserved+Car+Parking" target="_top">
            <div class="faqs">
                <div class="box-text">Reserved Car Parking</div>
            </div>
        </a>
    </div>
</div>

 

 

 

Recent space activity

Recently Updated
typespage, comment, blogpost
max10
hideHeadingtrue
themeconcise