/*
--------------------------------------------
APS COLOURS
--------------------------------------------
*/

/*

APS Blue #003B75
----------------
R: 0
G: 59
B: 117


APS Mustard #D7AF00
-------------------
R: 215
G: 175
B: 0


APS Olive #868A22
-----------------
R: 134
G: 138
B: 34


APS Teal #5CACAA
----------------
R: 92
G: 172
B: 170


Ruby #D04A70
------------
R: 208
G: 74
B: 112
Light: #d96e8d (80%)


APS Chilli #B70E0C
------------------
R: 183
G: 14
B: 12


APS Grey #91989C
----------------
R: 145
G: 152
B: 156


APS Light Grey #E3E9EC
----------------------
R: 227
G: 233
B: 236
Light: #ebf0f2 (70%)


APS Black #09181C
-----------------
R: 9
G: 24
B: 28



*/



/*
--------------------------------------------
PURL Text
--------------------------------------------
*/


#purl-services h2,
#purl-casestudies-header,
#purl-videotiles-header,
#purl-team h2 {
    margin-bottom:24px;
    text-align: center;
}
@media (min-width: 768px) { 
    #purl-services h2,
    #purl-casestudies-header,
    #purl-videotiles-header,
    #purl-team h2 {
        margin-bottom:32px;
    }
}


#purl  #strapline {
    color:#fff;
    margin-bottom:0;
}
#purl #purl-header-text.purl-header-text-dark #strapline {
    color:#09181C;
}



/*
--------------------------------------------
PURL Buttons
--------------------------------------------
*/

/* Grey */
/*.btn.btn-secondary.btn-grey {   
    background-color:#fff;
    border: solid 2px #91989C;
    color:#91989C;
}
.btn.btn-secondary.:focus, .btn.btn-secondary.btn-grey:hover, .btn.btn-secondary.btn-grey:active, .btn-secondary.btn-grey:not(:disabled):not(.disabled):active {
    background-color:#fff; color:#91989C; border-color:#91989C;
}*/


.btn-custom-1 {
    padding:8px 22px;
    font-size:0.75rem;
}


/*
--------------------------------------------
PURL Head
--------------------------------------------
*/

#purl .navbar {
	padding-left: 0.9375rem;
	padding-right: 0.9375rem;
}

#purl .navbar-brand {
    margin-right:0;
}

#purl header .col-5,
#purl header .col-7 {
	padding-left:0;
	padding-right:0;
}


@media (min-width: 576px) and (max-width: 767px) { 
    #purl header .col-5,
    #purl header .col-7 {
	   padding-left:15px;
	   padding-right:15px;
    }
}


/*
--------------------------------------------
PURL Shared
--------------------------------------------
*/

#purl #purl-header,
#purl #purl-intro,
#purl #purl-video-hero,
#purl-services,
#purl-casestudies,
#purl-videotiles,
#purl-team,
#purl #purl-CTA,
#purl #purl-logos,
#purl #purl-documents {
    margin-bottom:32px;
}
@media (min-width: 768px) { 
    #purl #purl-header,
    #purl #purl-intro,
    #purl #purl-video-hero,
    #purl-services,
    #purl-casestudies,
    #purl-videotiles,
    #purl-team,
    #purl #purl-CTA,
    #purl #purl-logos,
    #purl #purl-documents { 
        margin-bottom:48px; 
    }
}
@media (min-width: 992px) { 
    #purl #purl-header,
    #purl #purl-intro,
    #purl #purl-video-hero,
    #purl-services,
    #purl-casestudies,
    #purl-videotiles,
    #purl-team,
    #purl #purl-CTA,
    #purl #purl-logos,
    #purl #purl-documents { 
        margin-bottom:65px; 
    }
}



/*
--------------------------------------------
PURL Homepage
--------------------------------------------
*/

.page-template-template-homepage {
    background-color: #5CACAA;
    color:#fff;
}

.page-template-template-homepage header,
.page-template-template-homepage #footer-wrapper {
    display:none;
}

.page-template-template-homepage #content.site-content {
    margin-top: 0;
}

#purl #home #purl-home-logo {
    width:80px;
    height:auto;
    margin-bottom:100px;
}

#purl #home #purl-home-col {
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;   
}


/*
--------------------------------------------
PURL Header Banner
--------------------------------------------
*/


/*
#purl #purl-header {
    padding:0 4%;
    background-color:#efefef;
    justify-content: center;
    color:#fff;
    line-height: 125%;
    background-image: url(http://www.origindev.co.uk/PURL/wp-content/uploads/2019/04/hello-hero.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

#purl #purl-header .row {
    height:100%;
}
#purl #purl-header .col-6 {
    margin:auto 0;
}

#purl #purl-header h4 {
    line-height: 125%;
}
#purl #purl-header h4,
#purl #purl-header p {
    margin-bottom:0.5em;
}



#purl #purl-header {
        width:510px;
        height:212px;
}

@media (min-width: 576px) { 
    #purl #purl-header,
    #purl #purl-header h4 { 
        font-size: 10px;
    }
}
@media (min-width: 768px) { 
    #purl #purl-header {
        width:690px;
        height:287px;
    }
    #purl #purl-header,
    #purl #purl-header h4 { 
        font-size: 13px;
    }
}
@media (min-width: 992px) { 
    #purl #purl-header {
        width:930px;
        height:387px;
    }
    #purl #purl-header,
    #purl #purl-header h4 { 
        font-size: 17px;
    }
}
@media (min-width: 1200px) {
    #purl #purl-header {
        width:1110px;
        height:462px;
    }
    #purl #purl-header,
    #purl #purl-header h4 { 
        font-size: 21px;
    }
}
@media (min-width: 1600px) {
    #purl #purl-header {
        width:1370px;
        height:570px;
    }
    #purl #purl-header,
    #purl #purl-header h4 { 
        font-size: 26px;
    }
}
*/


#purl-header-text {
    text-align:center;
}

#purl-header-image {
    width:100%;
    padding-bottom:calc(100% - 30px);
    margin-bottom:30px;
    /* background-image: url(http://www.origindev.co.uk/PURL/wp-content/uploads/2019/04/hello-hero.jpg); */
    background-repeat: no-repeat;
    background-size: cover;
    background-position: right 8% center;
}

#purl-header-text h4,
#purl-header-text p { 
    margin-bottom:1em;
}

#purl-header-text.purl-header-text-dark h4 {
    color: #003B75;
}
#purl-header-text.purl-header-text-dark p {
    color: #09181C;
}


@media (min-width: 768px) { 
   #purl-header {
        position:relative; 
    }
    
    #purl #purl-header,
    #purl #purl-header h4 { 
        font-size: 12px;
    }
    
    #purl-header #purl-header-text-row {
        position:absolute; 
        left:0; 
        top:0;
        margin-left:30px;
        margin-right:30px;
        width:660px;
        height:261.438px;
        overflow:hidden;
    }
    
    #purl-header-image {
        padding-bottom:calc(42.238859% - 30px);
        margin-bottom: 0;
    }
    
    #purl-header-text {
        color:#fff;
        text-align: left;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    
    #purl-header-text h4,
    #purl-header-text p { 
        margin-bottom:0.5em;
    }

}

@media (min-width: 992px) { 
    #purl-header #purl-header-text-row {
        width:900px;
        height:362.813px;
    }  
    
    #purl #purl-header,
    #purl #purl-header h4 { 
        font-size: 16px;
    }
    
    #purl-header-text h4,
    #purl-header-text p { 
        margin-bottom:1em;
    }
}

@media (min-width: 1200px) { 
    #purl-header #purl-header-text-row {
        width:1080px;
        height:438.844px;
    }
    
    #purl #purl-header,
    #purl #purl-header h4 { 
        font-size: 20px;
    }
}

@media (min-width: 1600px) { 
    #purl-header #purl-header-text-row {
        width:1340px;
        height:548.672px;
    }  
    
    #purl #purl-header,
    #purl #purl-header h4 { 
        font-size: 24px;
    }
}


/*
--------------------------------------------
PURL Intro
--------------------------------------------
*/

#purl #purl-intro {
    /* padding:75px;*/
    text-align: center;
    margin-bottom: 41px;
}

#purl #purl-intro h2 p {
    margin-bottom:0;
}


/*
--------------------------------------------
PURL Video Hero
--------------------------------------------
*/

#purl #purl-video-hero {

}



/*
--------------------------------------------
PURL Services
--------------------------------------------
*/

#purl #purl-services .tiles.row .col-md-6 {
    margin-bottom:24px;
}
@media (min-width: 768px) { 
    #purl #purl-services .tiles.row .col-md-6 {
        margin-bottom:48px;
    }
    #purl #purl-services .tiles.row .col-md-6:nth-last-child(-n+2) {
        margin-bottom:0;
    }    
}



/*
--------------------------------------------
PURL Case Studies
--------------------------------------------
*/

#purl #purl-casestudies .row {
    justify-content: center;
}

#purl #purl-casestudies-header:empty {
    display:none;
}



/*
--------------------------------------------
PURL Video tiles
--------------------------------------------
*/

#purl #purl-videotiles .row {
    justify-content: center;
}

#purl #purl-videotiles-header:empty {
    display:none;
}



/*
--------------------------------------------
PURL Team
--------------------------------------------
*/

#purl #purl-team {
    text-align:center;
}

#purl #purl-team .row {
    justify-content:center;
}

#purl #purl-team a .img-circle {
    margin:0 auto 8px auto;
}

#purl #purl-team .img-circle {
    width:155px;
    height:155px;
    border-radius: 50%;
    border:solid 1px #E3E9EC;
    overflow:hidden;
}

#purl #purl-team .img {
    width:155px;
    height:155px;
    border-radius: 50%;
    background-size:cover;
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 1s;
}

#purl #purl-team .img:hover {
    transform:scale(1.1)
}

#purl #purl-team h5,
#purl #purl-team h6 {
    margin-bottom:0.1em;
}

#purl #purl-team .btn-wrapper {
    margin:24px 0;
}
@media (min-width: 768px) { 
    #purl #purl-team .btn-wrapper {
        margin:32px 0;
    }
}

#purl #purl-team .col-sm-6 {
    margin-bottom:20px;
}



/*
--------------------------------------------
PURL CTA
--------------------------------------------
*/

#purl #purl-CTA .btn-wrapper {
    text-align:center;
}

#purl #purl-CTA .btn-wrapper {
    margin:24px 0;
}
@media (min-width: 768px) { 
    #purl #purl-CTA .btn-wrapper {
        margin:32px 0;
    }
}



/*
--------------------------------------------
PURL logos
--------------------------------------------
*/

#purl #purl-logos {
    
}


/*
--------------------------------------------
PURL Tiles
--------------------------------------------
*/


#purl .tiles .tile .tile-video {
    margin-bottom: 0.75rem;
}

#purl .tiles .tile h3 {
    font-size:18px;
}

@media (min-width: 992px) { 
    #purl .tiles .tile h3 { font-size:21px; }
}
@media (min-width: 1200px) { 
    #purl .tiles .tile h3 { font-size:24px; }
}



/*
--------------------------------------------
PURL Password protected content
--------------------------------------------
*/


#purl-password-protected {
    margin:250px 0;
    text-align: center;
}

#purl-password-protected input[type="password"] {
    display:inline-block;
    max-width:500px;
    text-align:center;
    margin-bottom:1.5em;
}