html, body {
    height:                         100%;
    margin:                         0;
    padding:                        0;
    background-color:               #fff;
    font-family:                    "Roboto", Arial, sans-serif; /* Fallback */
    font-size:                      16px; 
}

.container {
    max-width:                      992px;
}

.btn-info {
    background-color:               #396a7e;
    border:                         1px solid #274f60;
}

.btn-info:hover {
    background-color:               #10416a;
    border:                         1px solid #10416a;
}

a, i, .pane, button, input {
    -moz-transition:                all 0.3s ease;
    -webkit-transition:             all 0.3s ease;
    -ms-transition:                 all 0.3s ease;
    -o-transition:                  all 0.3s ease;
    transition:                     all 0.3s ease;
}

a {
    color:                          #4895d6;
    outline:                        0;
}

.btn {
    outline:                        0;
    font-family:                    "BenchNine", Arial, sans-serif;
    text-transform:                 uppercase;
    font-size:                      16px;
}


img.padded-r,
img.padded-l {
    padding:                        0 0 20px 0;
}

@media all and (min-width: 768px) {
    img.padded-r {
        float:                      right;
        padding:                    5px 0 25px 25px;
    }
    img.padded-l {
        float:                      left;
        padding:                    5px 10px 10px 0;
    }
}

a:hover {
    text-decoration:                none;
    color:                          #10416a;
}

h1, h2, h3, h4, h5, h6, p {
    margin:                         0;
    padding:                        0 0 15px 0;
}

h1 {
    font-family:                    "BenchNine", Arial, sans-serif;
    font-size:                      34px;
    color:                          #fff;
    text-transform:                 uppercase;
}
    
h2 {
    display:                        inline-block;
    font-family:                    "BenchNine", Arial, sans-serif;
    font-size:                      30px;
    color:                          #fff;
    background-color:               #10416a;
    padding:                        10px 15px 8px 15px;
    text-transform:                 uppercase;
    margin-bottom:                  20px;
}

h3 {
    font-family:                    "BenchNine", Arial, sans-serif;
    font-size:                      32px;
    font-weight:                    700;
    color:                          #10416a;
    text-transform:                 uppercase;
    margin:                         0;
    padding:                        0 0 20px 0;
}

h3.smaller {
    font-size:                      20px;
    padding-bottom:                 10px;
}

h5 {
    font-size:                      18px;
}

h6 {
    font-size:                      16px;
}

p {
    font-size:                      14px;
}

label {
    font-size:                      16px;
    color:                          #10416a;
    font-weight:                    700;
    font-family:                    "BenchNine", Arial, sans-serif;
    text-transform:                 uppercase;
}

input[type="submit"] {
    background-color:               #10416a;
    color:                          #fff;
    font-family:                    "BenchNine", Arial, sans-serif;
    text-transform:                 uppercase;
    font-size:                      16px;
    text-align:                     center;
    border-radius:                  2px;
    border:                         0;
    padding:                        10px 20px;
}

input[type="submit"]:hover {
    background-color:               #4280b4;
}

input[type="text"],
input[type="email"],
textarea {
    border-radius:                  0 !important;
}

input.error,
textarea.error,
select.error {
    border:                         1px solid #a31c1c;
}

input.valid,
textarea.valid,
select.valid {
    border:                         1px solid green;
}

label.error {
    display:                        block;
    width:                          100%;
    padding:                        5px 10px;
    background-color:               #a31c1c;
    color:                          #fff;
}

form h6 {
    font-size:                      16px;
    text-transform:                 uppercase;
    color:                          red;
}

form .row {
    margin-bottom:                  20px;
}

@media all and (min-width: 768px) {
    h1 {
        font-size:                  46px;
    }
    h5 {
        font-size:                  26px;
    }
    h6 {
        font-size:                  20px;
    }
    p {
        font-size:                  16px;
    }
}

@media all and (min-width: 768px) and (max-width: 980px) {
    p {
        font-size:                  14px;
    }
}


.fw {
    min-width:                      100%;
}

.top_nav {
    width:                          100%;
    height:                         55px;
    background-color:               #000;
    line-height:                    55px;
}

.top_nav.absolute {
    position:                       absolute;
    top:                            0;
    left:                           0;
    z-index:                        3;
}

.navlinks {
    line-height:                    55px;
    margin:                         0;
    padding:                        0;
    list-style-type:                none;
}

.navlinks li {
    display:                        inline-block;
    margin-right:                   15px;
}

.navlinks li a {
    font-family:                    "BenchNine", "Roboto", Arial;
    font-size:                      16px;
    text-transform:                 uppercase;
    color:                          #fff;
    font-weight:                    700;
}

.navlinks li:last-child {
    margin-right:                   0;
}

.navlinks li a:hover,
.navlinks li.active a {
    color:                          #4895d6;
}

.logo_area {
    width:                          100%;
    padding:                        15px 0;
}

@media all and (max-width: 768px) {
    .logo {
        margin:                     15px auto 0 auto;
        max-width:                  200px;
    }
    .img_dev {
        margin:                     0 auto 15px auto;
        max-width:                  250px;
    }
}

@media all and (min-width: 768px) {
    .logo {
        max-width:                  280px;
    }
    .img_dev {
        float:                      right;
        max-width:                  300px;
        padding-top:                5px;
    }
    .logo_area {
        padding:                    30px 0;
    }
}

.news_block {
    width:                          100%;
    background-image:               url("../img/bluesky.jpg");
    background-repeat:              no-repeat;
    background-attachment:          fixed;
    background-size:                cover;
    padding:                        30px 0 35px 0;
}

.news_container {
    width:                          100%;
    background-color:               #fff;
    padding:                        25px;
}

.news_container .story {
    border-bottom:                  1px solid #ccc;
    padding:                        15px 0 25px 0;
}

.news_container .story:first-child {
    padding-top:                    0;
}

.news_container .story:last-child {
    border-bottom:                  0;
    padding-bottom:                 0;
}

.programme_preview {
    width:                          100%;
    position:                       relative;
    margin-top:                     15px;
}

.programme_preview .pane {
    display:                        table;
    width:                          100%;
    height:                         100px;
    background-color:               #000;
    margin:                         0 0 15px 0;
    vertical-align:                 middle;
    position:                       relative;
}

.pane a.view {
    position:                       absolute;
    display:                        inline-block;
    top:                            -20px;
    right:                          0;
    background-color:               #d0221b;
    color:                          #fff;
    padding:                        8px 15px 5px 15px;
    font-size:                      20px;
    text-transform:                 uppercase;
    font-family:                    "BenchNine", "Roboto", Arial;
}

.pane a.view:hover,
.pane a.view.hover {
    text-decoration:                none;
    background-color:               #10416a;
    padding:                        8px 35px 5px 15px;
}

@media all and (min-width: 768px) {
    .programme_preview .pane {
        height:                     150px;
    }
}

.programme_preview .pane .tcell {
    display:                        table-cell;
    width:                          100%;
    height:                         100%;
    vertical-align:                 middle;
    padding-left:                   3%;
}

.pane h5,
.pane h6 {
    font-family:                    "BenchNine", "Roboto", Arial;
    text-transform:                 uppercase;
    padding-bottom:                 0;
}

.pane h5 {
    font-weight:                    700;
    color:                          #fff;
}

.pane h6 {
    font-weight:                    500;
    color:                          #a6a6a6;
}

footer {
    background-color:               #f5f5f5;
    padding:                        35px 0 25px 0;
    margin-top:                     50px;
}

.footer_info {
    padding-left:                   45px;
    background-position:            left 5px;
    background-repeat:              no-repeat;
    margin-bottom:                  15px;
}

.footer_info p {
    font-size:                      14px;
}

.footer_info.write {
    background-image:               url("../img/ico_write.png");
}
.footer_info.call {
    background-image:               url("../img/ico_call.png");
    background-position:            left top;
}
.footer_info.email {
    background-image:               url("../img/ico_email.png");
    background-position:            left top;
}

.lower_bar {
    width:                          100%;
    background:                     #000;
    color:                          #fff;
    padding:                        25px 0 10px 0;
}

.lower_bar p {
    font-size:                      11px;
}

.hero,
.sub_hero {
    position:                       relative;
    width:                          100%;
    min-height:                     100%;
    min-height:                     100vh;
    background-repeat:              no-repeat;
    background-position:            center top;
    -moz-background-size:           cover;
    -webkit-background-size:        cover;
    -o-background-size:             cover;
    -ms-background-size:            cover;
    background-size:                cover;
    margin-bottom:                  40px;
    background-attachment:          fixed; /* optional mobile parallax enable */ 
}

@media all and (min-width: 768px) {
    .hero {
        min-height:                 70%;
        min-height:                 70vh;
    }
}

.sub_hero {
    height:                         200px;
    min-height:                     200px;
    background-image:               url("../img/grass.jpg");
}

.hero.scotland {
    background-image:               url("../img/scot2.jpg");
}
.hero.engwales {
    background-image:               url("../img/yp_engwales_hero_small.jpg");
}
.hero.ireland {
    background-image:               url("../img/ireland2.jpg");
}
.hero.ylay {
    background-image:				url("../img/ylay3.jpg");
}	
	

@media all and (min-width: 768px) {
    .hero,
    .sub_hero {
        background-attachment:      fixed;
    }
    .hero.scotland {
        background-image:           url("../img/scot1.jpg");
    }
    .hero.engwales {
        background-image:           url("../img/yp_engwales_hero.jpg");
    }
    .hero.ireland {
        background-image:           url("../img/ireland1b.jpg");
    }
    .hero.ylay {
        background-image:			url("../img/ylay1.jpg");
	}	
}

.subpage_logo_area {
    margin-top:                     55px;
}

.subpage_logo_area a img {
    max-width:                      180px;
}

@media all and (min-width: 768px) {
    .subpage_logo_area a img {
        max-width:                  250px;
    }
}

.hero_decor {
    position:                       absolute;
    bottom:                         0;
    left:                           0;
    width:                          100%;
    background:                     rgba(0, 0, 0, 0.5);
    text-align:                     right;
    padding:                        40px 0;
}

.hero_decor h1 {
    margin:                         0;
    padding:                        0;
    font-weight:                    700;
    font-size:                      30px;
}

.hero_decor span {
    display:                        block;
    margin:                         0;
    padding:                        0;
    color:                          #858585;
    font-size:                      20px;
    font-family:                    "BenchNine", Arial, sans-serif;
    text-transform:                 uppercase;
}

.showmore {
    margin-top:                     10px;
}

.subnav a {
    display:                        block;
    width:                          100%;
    height:                         50px;
    line-height:                    65px;
    text-align:                     right;
    background-color:               #eaeaea;
    padding-right:                  15px;
    font-family:                    "BenchNine", Arial, sans-serif;
    color:                          #474747;
    text-transform:                 uppercase;
    font-size:                      20px;
    font-weight:                    500;
    margin-bottom:                  5px;
}

.subnav a span {
    display:                        block;
    float:                          left;
    width:                          50px;
    height:                         50px;
    text-align:                     center;
    background-color:               #10416a;
    color:                          #fff;
    line-height:                    63px;
    font-size:                      14px;
}

@media all and (min-width: 768px) {
    .hero_decor h1 {
        font-size:                  48px;
    }
    .hero_decor span {
        font-size:                  26px;
    }
    .subnav a {
        font-size:                  24px;
        height:                     70px;
        line-height:                95px;
    }
    .subnav a span {
        width:                      70px;
        height:                     70px;
        line-height:                85px;
        font-size:                  20px;
    }
}


.subnav a:hover {
    background-color:               #c2c2c2;
    padding-right:                  30px;
}

.subnav a.active {
    background-color:               #10416a;
    color:                          #fff;
}

.subnav a.active:hover {
    padding-right:                  15px;
}

@media all and (max-width: 768px) {
    .content {
        padding-top:                60px;
    }
}

@media all and (min-width: 768px) {
    .content {
        padding:                    30px 0 40px 40px;
    }
}

.event_box {
    margin:                         25px 0;
}

.event_details {
    width:                          100%;
    padding:                        25px 15px 20px 15px;
    background-color:               #396a7e;
    background-image:               url("../img/ico_calendar.png");
    background-repeat:              no-repeat;
    background-position:            95% bottom;
}

.event_options {
    background-color:               #10416a;
    text-align:                     right;
    width:                          100%;   
    color:                          #fff;
    padding:                        10px 15px 12px 15px;
}

.event_options a {
    color:                          #fff;
    margin-left:                    20px;
    font-family:                    "BenchNine", Arial, sans-serif;
    text-transform:                 uppercase;
    font-weight:                    500;                    
}

.event_options a:first-child {
    margin-left:                    0;
}

.event_options a i {
    margin-right:                   5px;
}

.event_options a:hover {
    text-decoration:                underline;
}

.event_details h5, 
.event_details p {
    color:                          #fff;
    margin:                         0;
    padding:                        0;
}

.event_details h5 {
    text-transform:                 uppercase;
    font-family:                    "BenchNine", Arial, sans-serif;
    font-weight:                    500;
    font-size:                      28px;
    color:                          #bddce9;
}

@media all and (min-width: 980px) {
    .event_details p {
        font-size:                  18px;
        margin-right:               15px;
    }
    .event_details h5 {
        font-size:                  34px;

    }
}