@font-face {
    font-family: 'futurabold';
    src: url('/assets/fonts/futura-bold-03-webfont.woff2') format('woff2'),
         url('/assets/fonts/futura-bold-03-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'futuramedium';
    src: url('/assets/fonts/futura-medium-01-webfont.woff2') format('woff2'),
         url('/assets/fonts/futura-medium-01-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'national';
    src: url('/assets/fonts/National-Medium.woff2') format('woff2'),
         url('/assets/fonts/National-Medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body
{
    background:#FDFDFD;
}

h1, h2, h3, h4, h5, h6
{
    font-family:'futuramedium';
    color:#656D79;
}
p, li
{
    font-family:"national";
    color:#656D79;
}


header h1
{
    text-transform:uppercase;
    font-size:1.5rem;
    letter-spacing: 3px;
}

header h1 a
{
    color:#656D79;
    text-decoration:none;
}
header h1 a:hover
{
    color:#656D79;
    text-decoration:none;
}

header h3
{
    text-transform:uppercase;
    font-size:1rem;
    letter-spacing: 4px;
}

header p
{
    font-family:'futuramedium';
    font-size:0.9rem;
}
header p a
{
    color:#656D79;
}

header .headerShowLocations
{
    cursor:pointer;
}

header .locationNav
{
    font-family:'futuramedium';
    position:absolute;
    text-transform:uppercase;
    display:none;
    background:#fff;
    padding-right:15px;
    z-index:9999;
}
header .locationNav ul
{
    padding:0;
    margin:0 0 0 16px;
    list-style:none;
}

header .locationNav ul li
{
    padding: 0px 0 5px;
}

header .locationNav li.otu a
{
    color:#A5D0CC;
}

header .locationNav li.kati a
{
    color:#FBAC91;
}

header .locationNav li.mount a
{
    color:#C8C4E3;
}

header .subHead .locationNav
{
    font-family:'futuramedium';
    position:absolute;
    text-transform:uppercase;
    display:none;
    background:#fff;
    padding:10px 20px 10px 5px;
    right:270px;
}

header .subHead .locationNav  li a
{
    color:#656D79;
    font-size:14px;
}



.paper
{
    background:url("/assets/images/paper-texture.png") repeat;
    padding:150px 0;
}


.paper h2
{
    text-transform:uppercase;
    font-size: 3rem;
}

.paper h2 span
{
    color:#F4D88E;
    padding:60px 0;
    background:url("/assets/images/vibrant.png") no-repeat;
}


.paper p
{
    font-family:'futuramedium';
    font-size:1.5rem;
}

.paper.sub p, p.text-small
{
    font-size:1rem;
}

.paper a.btn-primary
{
    background-color:#F3D793;
    border-color:#F3D793;
    color:#656D78;
}

.selectLocation
{
    position:relative;
    background:url("/assets/images/select-location.png") no-repeat center center;
    height:49px;
    z-index:10000;
    margin-bottom:-49px;
}

.selectLocation p
{
    position:relative;
    top:-45px;
    font-size:1.2rem;
}

.centres
{

}

.centres h5
{
    text-transform:uppercase;
    color:#fff;
    font-size:1.8rem;
}

.centres h4
{
    text-transform:uppercase;
    color:#fff;
    font-size:2.8rem;

}

@supports((text-stroke: 1px #fff) or (-webkit-text-stroke: 1px #fff)) {
    .centres .otu h4
    {
        color:#A5D0CC;
        -webkit-text-stroke-width: 1px;
        -webkit-text-stroke-color: #4C7B9A;
    }
    .centres .mount h4
    {
        color:#C8C4E3;
        -webkit-text-stroke-width: 1px;
        -webkit-text-stroke-color: #4C7B9A;
    }
    .centres .kati h4
    {
        color:#FBAC91;
        -webkit-text-stroke-width: 1px;
        -webkit-text-stroke-color: #EB4747;
    }
}

.centres .otu
{
    background:#A5D0CC url("/assets/images/otuhills.png") no-repeat bottom left;
    background-size: contain;
    padding-bottom:250px;
}

.centres .otu h5
{
    color:#4C7B9A;
}

.centres .mount
{
    background:#C8C4E3 url("/assets/images/mount-bg.png") no-repeat bottom left;
    background-size: contain;
    padding-bottom:250px;
}



.centres .mount h5
{
    color:#4C7B9A;
}


.centres .kati
{
    background:#FBAC91 url("/assets/images/katihills.png") no-repeat bottom left;
    background-size: contain;
}



.centres .kati h5
{
    color:#EB4747;
}

.centres .btn
{
    border:1px solid #fff;
    border-radius:0px;
}

.centres .btn a
{
    color:#fff;
}


.subBg
{
    background-repeat:no-repeat;
    background-size:inherit;
    background-position:center center;
}

.subHead
{
}

.subDeck
{
    padding:200px 0;
}

.subDeck h1
{
    color:#fff;
    font-size:5rem;

}

.subDeck h2
{
    text-transform:uppercase;
    font-size:40px;
    color:#fff
}

@supports((text-stroke: 2px #fff) or (-webkit-text-stroke: 2px #fff)) {
    .subDeck h1 {
        color: transparent;
        -webkit-text-stroke: 2px #fff;
        text-stroke: 2px #fff;
        text-shadow: none;
    }
}


.subDeck p
{
    color:#fff;
    font-size:30px;
}


.paint
{
    background:url("/assets/images/paint-texture.png") repeat;
    padding:150px 0;
}


.paint h2
{
    text-transform:uppercase;
    font-size: 3rem;
}

.paint h2 span
{
    color:#F4D88E;
    padding:60px 0;
    background:url("/assets/images/vibrant.png") no-repeat;
}


.paint p
{
    font-family:'futuramedium';
    font-size:1.5rem;
}

.paint a.btn-primary
{
    background-color:#F3D793;
    border-color:#F3D793;
    color:#656D78;
}

.blocks h3
{
    text-transform:uppercase;
}

.blocks p a
{
    border:#656D78 1px solid;
    color:#656D78;
    padding:10px 15px;
    font-size:1.2rem;
}

.blocks .modal .modal-body
{
    text-align:left;
}


.principlesIntro h3
{
    color:#656D79;
    text-align:center;
    font-size:3rem;
}

@supports((text-stroke: 2px #656D79) or (-webkit-text-stroke: 2px #656D79)) {
    .principlesIntro h3  {
        color: transparent;
        -webkit-text-stroke: 2px #656D79;
        text-stroke: 2px #656D79;
        text-shadow: none;
    }
}

.principlesIntro h6
{
    color:#656D79;
    text-align:center;
    font-size:2rem;
}

.principlesBlocks .overlay
{
    text-align:center;
    background-color:rgba(255,255, 255, 0.7);
    display:none;
}

.principlesBlocks .overlay h5
{
    font-size:2rem;
}

.principlesBlocks .overlay p
{
    font-size:1.2rem;
}

.principlesBlocks .overlay a
{
    color:#656D79;
    text-decoration:underline;
    text-transform:uppercase;
    font-size:1.6rem;
}

.square-box{
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #4679BD;
}
.square-box:before{
    content: "";
    display: block;
    padding-top: 100%;
}
.square-content{
    position:  absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    color: white;
}
.square-content div {
   display: table;
   width: 100%;
   height: 100%;
}
.square-content span {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    color: white
}

.modal-content
{
    padding:20px;
}

.modal-header, .modal-footer
{
    border:none
}

.modal h5
{
    text-transform:uppercase;
    font-size:2rem;
}

.addressDeets
{

}

.addressDeets p
{
    font-size:1rem;
}

.addressDeets p.head
{
    font-size:1.2rem;
}

.addressDeets p a
{
    color:#656D79;
    text-decoration:none;
}
.addressDeets p a:hover
{
    text-decoration:none;
}

.allContact p
{
    font-size:1rem;
    text-align:left;
    margin:0;
}

.allContact p a
{
    color:#656D79;
}

.allContact p.head
{
    text-transform:uppercase;
}

.allContact p.head span
{
    font-size:1.2rem;
}

.allContact .social
{
    border-left:1px solid #B8BBC1;
}

.allContact .social p
{
    text-align:center;
    font-size:1.5rem;

}

.allContact .col-xl-4, .allContact .col-xl-8
{
    padding-left:0;
}

.allContact .bb
{
    border-bottom:1px solid #B8BBC1;
    margin-right:20px;
    margin-left:0px;
}

.footerPattern form h6
{
    color:#fff;
    text-align:center;
    font-size:2rem;
    text-transform:uppercase;
}

.footerPattern form .row
{
    margin-top:20px;
}
.footerPattern form .row input
{
    padding:10px;
}

.footerPattern form .row input::placeholder, .footerPattern form .row textarea::placeholder
{
    font-style:italic;
}
.footerPattern form .row textarea
{
    height:100px;
    margin-top:20px;
}

.footerPattern form button
{
    background:none;
    border:1px solid #fff;
    float:right;
    padding:20px 30px;
    border-radius:0px;

}
.footerPattern form button:hover
{
    border:1px solid #656D78;
    background:none;
}

.footerPattern form .alert p
{
    margin:0;
}

footer
{
    background:#656D79;
}

footer p
{
    color:#B4B7BB;
    font-size:0.8rem;
}


@media (max-width:1199px)
{
    .subHead h1, .subHead h3, .subHead .smallCentre p
    {
        text-align:center !important;
    }
    .subHead h3
    {
        padding-bottom:10px;
    }

}

@media (max-width:996px)
{
    .allContact .social
    {
        border:none;
    }

}

@media (max-width:768px)
{
    .centres .otu,.centres .mount, .centres .kati
    {
        padding-bottom:50px;
    }
    .addressDeets p.head
    {
        padding-bottom:0 !important;
        padding-top:15px !important;
    }

}

@media (max-width:576px)
{
    p.centerSmall
    {
        text-align:center !important;
    }
    header .locationNav
    {
        width:100%;
        margin:0;
        left:0px;
    }
    header .locationNav ul
    {
        text-align:center;
    }
    .smallPad
    {
        margin-bottom:15px;
    }
    .subDeck h1
    {
        font-size:50px;
    }
    p.headesrShowLocations
    {
        margin-bottom:0;
    }
    .paper, .subDeck
    {
        padding:50px 0;
    }
    .subHead
    {
        padding-bottom:20px !important
    }
    .principlesBlocks .square-box
    {
        border-bottom:1px solid #656D79;
    }

    .principlesBlocks .overlay
    {
        background-color:rgba(255,255, 255, 0.5);
        display:block;
    }
    .principlesBlocks h5
    {
        padding:20px !important;
    }
    .principlesBlocks p
    {
        padding-bottom:10px !important;
    }
    h5.modal-title
    {
        padding:20px 0 !important;    
    }


}