/* LAST UPDATED BY RS 3/5/24 - added top task and interested import */

@import "stayconnected_overlay.css";
@import "top-task.css";
@import "interested.css";


/* LANDING PAGE */

.tick-list {
    list-style-type: none;
    display: table;
}

.tick-list li {
    display: table-row;
}

.tick-list li::before {
    content: "\f058";
    display: table-cell;
    padding: 10px 12px 0 0;
    color: green;
    font-family: "FontAwesome";
}

.tick-list li:first-of-type::before {
    padding: 0 10px 0 0;
}

/* LANDING PAGE */

.flex-container {
    display: flex;
    flex-wrap: wrap;
    display: -webkit-flex;
    -webkit-flex-wrap: wrap; 
    margin-top: 15px;
}

.large {
    min-width: 40%;
    max-width: 40%;
    min-height: 300px;
    overflow: hidden;
}

.medium {
    min-width: 30%;
    max-width: 30%;
}

.small {
    min-width: 20%;
    max-width: 20%;
}

.column {
    margin: 0 25px 25px 0;
    color: #fff;
    box-sizing: border-box;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    background-repeat: no-repeat !important;
    background-position: center !important; 
    background-size: cover !important;
}

.column .box {
    box-sizing: border-box;
    width: 100%;
    font-size: 20px;
}

.column .box:first-child {
    margin-bottom: 25px;
} 

.column:nth-child(3n+3) {  
    margin: 0 0 25px 0;
}

.dark-blue {
    background: #00193c;
}

.light-blue {
    background: #2F73AD;
}

.grey {
    background: #666;
}

.box img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    min-height: 120% !important;
    max-height: 100% !important;
    width: auto !important;
}

.recruit-header {
    display: block;
    font-size: 1.2em;
    font-weight: bold;
    margin: 0.5em 0 0.35em 0;
    padding: 0 20px;
    line-height: 140%;
}

.large .recruit-header {
    margin: 0.3em 0 0 0;
    padding: 10px 20px;
    position: absolute;
    bottom: 0;
    width: 100%;
}

.large:hover .recruit-header {
    text-decoration: underline;
}

.large .recruit-header::after {
    content: "\203A";
    font-size: 2em;
    font-weight: bold;
    line-height: 0;position: relative;
    top: 5px;
    margin-left: 10px;
    display:inline-block;
    text-decoration: none;
}

.dark-blue .recruit-header{
    background: #00193c;
}

.light-blue .recruit-header{
    background: #2F73AD;
}

.grey .recruit-header {
    background: #666;
}

.abstract {
    display: block;
    margin: 0 0 1em 0;
    padding: 0 20px
}

.abstract::after {
    content: "\203A";
    font-size: 2em;
    font-weight: bold;
    line-height: 0;
    position: relative;
    top: 3px;
    margin-left: 10px;
    display:inline-block;
    text-decoration: none;
}

 .box a {
     color: #fff !important;
     text-decoration: none !important;
     transition: 0.4s all;
     width: 100%;
     height: 100%;
}

.box:hover a {
    text-decoration: underline !important;
}

.recruit-header {
    font-size: 24px;
}

.abstract {
    font-size: 20px;
}

@media only screen and (max-width: 1000px) {
    
    .large {
        min-width: 100%;
        max-width: 100%;
    }
    
    .medium {
        min-width: 100%;
        max-width: 100%;
    }
    
    .small {
        min-width: 100%;
        max-width: 100%;
    }
    
    .box img {
        min-height: 100% !important;
        max-height: 1000px !important;
        min-width: 100% !important;
    }

}

@media only screen and (max-width: 450px) {
    
    .large {
        min-width: 100%;
        max-width: 100%;
    }
    
    .medium {
        min-width: 100%;
        max-width: 100%;
    }
    
    .small {
        min-width: 100%;
        max-width: 100%;
    }
    
    .box img {
        position: static;
        transform: translate(0, 0);
        height: 200px !important;
}

}

/* CHILDREN'S SOCIAL WORKERS  AND SOME OF THIS IS USED FOR WORK IN SOCIAL CARE TOO*/

blockquote {
    padding-left: 20px;
    border-left: 8px solid #00193c;
    width: 70%;
    margin: 30px auto;
    position: relative;
    background: #eee;
    padding: 20px 20px 20px 50px;
}
        
 blockquote::before {
     font-family:Arial;
     content: "\201C";
     color:#000;
     font-size:3.8em;
     position: absolute;
     left: 10px;
     top:-10px;
}

blockquote::after{
    content: '';
}  

.larger {
    line-height: 135%;
    margin-bottom: 25px;
    font-size: 1.05em;
    margin: 0.35em 0 1em 0;
    font-family: inherit !important;
    font-weight: 700;
    font-style: normal;
    text-rendering: optimizeLegibility;
}

.director {
    margin: 50px 0 40px;
}

.director .pic {
    width: 150px;
    display: inline-block;
    vertical-align: bottom;
    margin-right: 10px;
}

.director .pic img{
    max-width: 100%;
}

.director .details {
    display: inline-block;
    vertical-align: bottom;
    width: auto;
    margin-top: 10px;
}

.director .details span {
    font-weight: 700;
}

.kids-stuff {
    border-radius: 15px;
    border: 10px solid #209794;
    padding: 15px 30px;
}

.kids-stuff ul {
    list-style-type: none;
}

.kids-stuff ul li {
    margin-bottom: 10px;
}

.kids-stuff ul li:before {
    content: "\f1ae";
    font-family: FontAwesome;
    margin-right: 10px; 
}

.kids-stuff ul li:before {
    color: #00193c;
}

.kids-stuff >ul > li:before {
    color: #209794;
}


/* SOCIAL CARE */

.provider {
    border-left: 8px solid #00193c;
    padding-left: 20px;
}
.provider p {
    font-size: 0.9em;
}

.provider p:first-of-type {
    margin-bottom: 0;
}

.provider img {
    margin: 15px 0;
}

.provider::after {
  content: "";
  clear: both;
  display: table;
}

.quotation {
    padding-bottom: 1em !important;
}

.quote-image {
    padding: 0;
}

.quote-image img {
    width: 100%;
    max-width: 100%;
}

.quote-text {
    display: flex;
    justify-content: center;
    align-items: center;
}

.background-image {
    overflow: hidden;
}

.background-image img {
   max-width: 150%; 
}
}