/* ----------------------------------------------------------

Stylesheet Name: University of Divinity Staff Directory CSS
Description: Contains additional stylings for the University of Divinity staff directory. To be used in conjunction with Divinity CSS for base stylings.
Version: 1.0.0
Author: Andrew Hateley-Browne
Author URI: http://www.afterword.com.au/
        			
TABLE OF CONTENTS

0. UNIVERSAL
1. TYPOGRAPHY
2. INPUTS
3. HEADER
4. HOMEPAGE	
5. COLLEGES AND CENTRES CPT
6. POST AND PAGE CONTENT
7. SIDEBARS
8. WIDGETS
9. FAT FOOTER
10. FOOTER
11. LOGIN AND HTTP ERRORS
12. ADMIN

---------------------------------------------------------- */


h1.divinity-site-title {
    display: none !important;
}

.post-type-archive-staff h2 a {
    color: #382E18;
    font-size: 28px;
    font-size: 2.8rem;
    font-family: 'Karla', Sans-Serif;
}

.post-type-archive-staff h2 {
    margin: 0 0 0;
    margin-bottom: 0px !important;
}    

.post-type-archive-staff .entry-content {
    display: none;
}

.acf-field input[type="text"],
.acf-field input[type="email"] {
    border: 1px solid #E1E1E1;
}

a.acf-button.button,
button[type="submit"] {
    background-color: #b10024;
    border: 2px solid transparent;
    border-radius: 4px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-shadow: none;
    color: #fff;
    display: inline-block;
    font-family: "Karla", Helvetica, Arial, sans-serif;
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 2.6rem;
    max-width: 100%;
    margin: 1rem 1rem 1rem 0;
    padding: 1rem 2rem;
    position: relative;
    outline: 0;
    text-align: center;
    text-decoration: none !important;
    -o-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
    text-transform: capitalize;
}
    
a.acf-button.button {  
    background-color: #c8b182;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1rem;
    padding: 6px 6px;
    margin: 8px 4px 4px 10px;
}

	a.acf-button.button:hover,
	button[type="submit"]:hover {
	    background-color: #b89b5f;
	    border: 2px solid transparent;
	    box-shadow: 0 3px 18px 0 rgba(2, 2, 2, 0.2);
	    color: #fff;
	    transform: translateY(-0.25em);
	    transition: all .5s;
	    -o-transition: all .5s;
	    -moz-transition: all .5s;
	    -webkit-transition: all .5s;
	}
	
	button[type="submit"]:hover {
	    background-color: #7e001a;
	} 
	
	a.acf-button.button:focus,
	button[type="submit"]:focus {
	    outline: 1px dotted rgba(255, 255, 255, .6);
	    outline-offset: -6px;
	    box-shadow: none;
	}







/* ----------------------------------------------------------
	STAFF FORM
---------------------------------------------------------- */

.acf-field-image img {
	border-radius: 50%;
}

.af-field-type-text .af-input, 
.af-field-type-email .af-input {
    border: 1px solid rgb(229, 229, 229);
    border-radius: 4px;
}

.acf-field-5d8c242079dc1 .acf-repeater .acf-row:first-of-type .acf-row-handle.order:before,
.acf-field-5cff0aae2b465 .acf-repeater .acf-row:first-of-type .acf-row-handle.order:before {
    content: "Primary ";
    font-size: 1.3rem;
}
	
.acf-field-5d8c242079dc1 .acf-repeater .acf-row:first-of-type .acf-row-handle.order span,
.acf-field-5cff0aae2b465 .acf-repeater .acf-row:first-of-type .acf-row-handle.order span {
	display: none;
}	

.acf-field-5d4d122ac3467 .acf-repeater .acf-row .acf-row-handle.order span {
    font-size: 1.3rem;
}

.acf-field input[type="text"] {
	padding: 20px 10px;
}

.page .acf-field-5d54c1a1bedad {
	display: none;
	
}

/* ----------------------------------------------------------
	SEARCH AND FILTER
---------------------------------------------------------- */
#staff-directory-search {
	background-color: #ece5d5;
	padding: 10px 20px;
}

.searchandfilter h4 {
    grid-column: 1 / span 6;
    width: 100%;
}    

#staff-directory-search.horizontal.simple form.searchandfilter > ul {
	width: 100%;
	list-style-type: none;
	max-width: 1200px;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr min-content;
	margin: auto;
	grid-column-gap: 10px;
}

#staff-directory-search ul li.sf-field-search {
	grid-column: 1 / span 5;
	place-self: center stretch;
	box-sizing: border-box;
	margin-right: -10px;
}

#staff-directory-search ul li.sf-field-search input {
    border-radius: 4px 0 0 4px;
}    

#staff-directory-search ul li.sf-field-submit {
	grid-column: 6;
	place-self: end;
}

#staff-directory-search ul li.sf-field-submit input[type="submit"] {
    border-radius: 0 4px 4px 0;
    grid-row: 2 / 2;
	margin: 45px 0 0 0;
}

#staff-directory-search ul li.sf-field-submit input[type="submit"]:hover {
    transform: none;
}

#staff-directory-search ul li.sf-field-post-meta-accreditation_media,
#staff-directory-search ul li.sf-field-post-meta-accreditation_course_advisor,
#staff-directory-search ul li.sf-field-post-meta-accreditation_supervisor {
	grid-column-end: span 2;
	place-self: center stretch;
	box-sizing: border-box;
	padding-top: 0;
}

#staff-directory-search ul li input[type="checkbox"] {
    display: table-cell;
    height: 2rem;
    vertical-align: middle;
    width: 2rem;
}

#staff-directory-search ul li.sf-field-post-meta-positions_0_entity,
#staff-directory-search ul li.sf-field-post-meta-teaching_disciplines {
	grid-column-end: span 3;
}

#staff-directory-search ul li.sf-field-post-meta-teaching_disciplines .chosen-container.chosen-container-multi {
	max-width: 100%;
	min-width: 100%;
}

#staff-directory-search ul li label input,
#staff-directory-search ul li label select {
	min-width: 100%;
	padding: 15px 10px;
	box-sizing: border-box;
}	

#staff-directory-search ul li label {
	min-width: 100%;
	box-sizing: border-box;
	display: inline;
}	

label.sf-label-checkbox {
    display: inline;
}


#staff-directory-search option {
    padding: 4px 8px;
}

#staff-directory-search h4 {
    margin-bottom: 5px;
}

@media only screen and (max-width: 480px) {
	
    #staff-directory-search ul li.sf-field-post-meta-accreditation_media,
    #staff-directory-search ul li.sf-field-post-meta-accreditation_course_advisor,
    #staff-directory-search ul li.sf-field-post-meta-accreditation_supervisor {
    	grid-column-end: span 6;
    }
}

@media only screen and (max-width: 680px) {
	
    #staff-directory-search ul li.sf-field-post-meta-positions_0_entity,
    #staff-directory-search ul li.sf-field-post-meta-teaching_disciplines {
    	grid-column-end: span 6;
    }
}

/* ----------------------------------------------------------
	ACCREDITATIONS
---------------------------------------------------------- *

.container {
    margin: 0 auto;
    height: auto;
    width: 100%;
}

.light {
    background-color: #f7f3ec;
}

#sub-bar {
    margin: 0 auto;
    max-width: 1140px;
    padding: 0 0 0 20px;
    position: relative;
    display: grid;
    grid-template-columns: 30% 1fr 65%;
}

#accreditations {
    grid-column: 3;
    margin: 0 0 0 -20px;
    padding: 10px 20px;
    width: 100%;
    background-color: #898379;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax( 150px, 1fr));
	grid-column-gap: 20px;
	justify-items: start;
}

#accreditations::after {
    content: '';
    position: absolute;
    display: block;
    background-color: #898379;
    width: 100%;
    height: 100%;
    top: 0;
    left: 100%;
    margin: 0 0 0 -20px;    
}

.return-link {
    margin: auto 0;
    padding: 10px 0;
}

    .return-link .sml-media-alt i {
        font-size: 4rem;
        padding: 20px;
    }

.accreditation i {
	color: #fff;
}

.accreditation p {
	color: #fff;
	display: inline-block;
	font-size: 18px; font-size: 1.8rem;
	margin: 0 0 0 .5rem;
}

/* MEDIA QUERIES *

@media only screen and (max-width: 1139px) {
	
	#accreditations {
	    justify-items: start;
	}
}

@media only screen and (max-width: 959px) {

    #sub-bar {
        grid-template-columns: auto 1fr;
        grid-column-gap: 20px;
    }
    
    #accreditations {
        grid-column: 2;
        margin: 0;
    }
    
}

/* ----------------------------------------------------------
	BUTTON SETS
---------------------------------------------------------- */

#keysteps {
	position: sticky;
	position: -webkit-sticky;
	bottom: 0;
	background-color: transparent;
}

#keysteps .btn-set {
	margin: 0 auto;
	max-width: 1080px;
}

#keysteps .btn-set .btn {
	background-color: #b10024;
}

#keysteps .btn-set .btn:hover {
	background-color: #8f001d;
}

.btn-set {
	display: grid;
	justify-items: stretch;
}

.btn-set.horizontal {
	grid-template-columns: repeat(auto-fit, minmax( 270px, 1fr));
}

.btn-set.horizontal a.btn {
	border-radius: 0;
	font-weight: 400;
	margin: 0;
	box-shadow: 0 0 0 1px;

}

	.btn-set.horizontal a.btn:hover {
		transform: none;
	}
	
	.btn-set.horizontal > a.btn:first-of-type {
		border-top-left-radius: 4px;
	}
	
	.btn-set.horizontal > a.btn:last-of-type {
		border-top-right-radius: 4px;
	}

.btn-set.vertical a.btn {
	border-radius: 0;
	grid-row-gap: 1px;
	grid-template-rows: repeat(auto-fill, auto);
	margin: 0 0 1px 0 !important;
	text-transform: none;
}

	.btn-set.vertical a.btn:hover {
		transform: none;
	}

	.btn-set.vertical a.btn:first-child {
		border-radius: 4px 4px 0 0;
	}
	
	.btn-set.vertical a.btn:last-child {
		border-radius: 0 0 4px 4px;
	}
	
#keysteps .link {
	margin: 20px auto;
}	
	#keysteps .link a {
		text-align: center;
	}

.sidebar .portrait {
    width: 270px;
    height: 270px;
    margin: 0 auto 20px auto;
}

/* ----------------------------------------------------------
	STAFF TITLE
---------------------------------------------------------- */



h1 sub {
	bottom: 0;
	letter-spacing: 0.1rem;
}

span.post-nominal {
    font-size: 2rem;
}

.entry-content p:last-of-type {
    margin-bottom: 30px;
}

.content ul {
    margin-bottom: 30px;
    padding: 0;
}

/* ----------------------------------------------------------
	TEACHING AREAS
---------------------------------------------------------- */

div#teaching-research-area {
	display: grid;
	box-sizing: border-box;
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-column-gap: 20px;
}

#teaching-areas, #research-areas {
	margin-bottom: 30px;
}

/* ----------------------------------------------------------
	STAFF POSITIONS
---------------------------------------------------------- */

ul#positions,
ul#memberships {
	box-sizing: border-box;
	display: grid;
    grid-template-columns: repeat(auto-fill, minmax(40%, 1fr));
    grid-gap: 3px;
    grid-auto-flow: row;
}

ul#positions li,
ul#memberships li {
	align-items: center;
	background-color: #f7f3ec;
	box-sizing: border-box;
	display: grid;
	grid-template-columns: 100px 1fr;
	grid-column-gap: 20px;
	list-style-type: none;
	margin: 0;
	padding: 10px;
}

ul#positions li p {
	list-style-type: none;
	margin: 0;
	font-size: 1.8rem;
}

ul#positions li a,
ul#memberships li a {
	color: #413e39;
}

.college-information-web,
.centre-information-web {
    margin-top: 0px;
}


ul#positions li img,
ul#memberships li img {
    filter: grayscale(100%);
    margin: auto;
    padding: 10px;
    box-sizing: border-box;
    min-width: 100px;
}

ul#positions li:hover a img,
ul#memberships li:hover a img {
	filter: grayscale(0%);
}

.entry-footer .entry-meta {
    border-top: none;
}

h1.divinity-site-title {
    display: none !important;
    color: #c8b182;
    font-family: 'Karla', 'Helvetica', 'Arial', sans-serif;
    font-size: 5rem !important;
    font-weight: 500 !important;
    margin-bottom: 20px !important;
    line-height: 5.2rem !important;
}

/* Responsive Positions
------------------------------------------------------------ */

@media only screen and (max-width: 539px) {
    	
    ul#positions,
    ul#memberships {
        grid-template-columns: 1fr;
    }

}    





.search .type-staff h2 a,
.post-type-archive-staff h2 a {
    color: #382E18;
    font-size: 28px;
    font-size: 2.8rem;
    font-family: 'Karla', Sans-Serif;
}

.search .type-staff h2,
.post-type-archive-staff h2 {
    margin: 0 0 0;
    margin-bottom: 0px !important;
}    

.search .type-staff .entry-content,
.post-type-archive-staff .entry-content {
    display: none;
}

.acf-field input[type="text"],
.acf-field input[type="email"]
 {
    border: 1px solid #E1E1E1;
}

a.acf-button.button,
button[type="submit"] {
    background-color: #b10024;
    border: 2px solid transparent;
    border-radius: 4px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-shadow: none;
    color: #fff;
    display: inline-block;
    font-family: "Karla", Helvetica, Arial, sans-serif;
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 2.6rem;
    max-width: 100%;
    margin: 1rem 1rem 1rem 0;
    padding: 1rem 2rem;
    position: relative;
    outline: 0;
    text-align: center;
    text-decoration: none !important;
    -o-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
    text-transform: capitalize;
}
    
a.acf-button.button {  
    background-color: #c8b182;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1rem;
    padding: 6px 6px;
    margin: 8px 4px 4px 10px;
}

	a.acf-button.button:hover,
	button[type="submit"]:hover {
	    background-color: #b89b5f;
	    border: 2px solid transparent;
	    box-shadow: 0 3px 18px 0 rgba(2, 2, 2, 0.2);
	    color: #fff;
	    transform: translateY(-0.25em);
	    transition: all .5;
	    -o-transition: all .5s;
	    -moz-transition: all .5s;
	    -webkit-transition: all .5s;
	}
	
	button[type="submit"]:hover {
	    background-color: #7e001a;
	} 
	
	a.acf-button.button:focus,
	button[type="submit"]:focus {
	    outline: 1px dotted rgba(255, 255, 255, .6);
	    outline-offset: -6px;
	    box-shadow: none;
	}


 /* Block cell (2 columns)
    ------------------------------------------------------------ */
    
    #upper-block-wrapper {
        margin: 0 0 0 0;
        padding: 60px 30px;
        background-color: #f7f3ec;
    }

    #middle-block-wrapper {
        margin: 0 0 0 0;
        padding: 60px 30px;
        background-color: #fff;
    }
    
    #upper-block-wrapper #upper-block,
    #middle-block-wrapper #middle-block {
        box-sizing: border-box;
        display: grid;
        grid-auto-flow: column;
        grid-template-columns: repeat(2, 1fr);
        grid-column-gap: 40px;
        grid-row-gap: 60px;
        max-width: 1200px;
        margin: 0 auto;
        padding: 0px;
        place-content: stretch / stretch;
        place-items: stretch / stretch;
    }
    
    
    #upper-block-wrapper #upper-block .upper-block-content div {
        display:grid;
        grid-auto-flow: column;
        grid-template-columns: repeat(2, 1fr);
        grid-column-gap: 40px;
        grid-row-gap: 20px;
        place-content: stretch / stretch;
        place-items: stretch / stretch;
    }
    
    
    /* Responsive block cells
    ------------------------------------------------------------ */
    
    @media only screen and (max-width: 839px) {
    	
    	#upper-block-wrapper #upper-block,
    	#middle-block-wrapper #middle-block {
    	    grid-template-columns: 1fr;
    	    grid-auto-flow: row;
    	}
    }    

.gform_wrapper .gf_mood ul.gfield_radio li {
    display: inline;
    margin-right: .5rem;
}

.gform_wrapper .gf_mood ul.gfield_radio input[type="radio"] {
    display: none;
}

.gform_wrapper .gf_mood ul.gfield_radio li label .fas {
    font-size: 5rem;
}

.gform_wrapper .gf_mood ul.gfield_radio label i.fas.fa-angry {
    color: #c5bfb5;
}

.gform_wrapper .gf_mood ul.gfield_radio input[type="radio"]:checked + label i.fas.fa-angry,
.gform_wrapper .gf_mood ul.gfield_radio i.fas.fa-angry:hover {
    color: #740005;
}

.gform_wrapper .gf_mood ul.gfield_radio i.fas.fa-frown {
    color: #c5bfb5;
}

.gform_wrapper .gf_mood ul.gfield_radio input[type="radio"]:checked + label i.fas.fa-frown,
.gform_wrapper .gf_mood ul.gfield_radio i.fas.fa-frown:hover {
    color: #b10024;
}

.gform_wrapper .gf_mood ul.gfield_radio i.fas.fa-meh {
    color: #c5bfb5;
}

.gform_wrapper .gf_mood ul.gfield_radio input[type="radio"]:checked + label i.fas.fa-meh,
.gform_wrapper .gf_mood ul.gfield_radio i.fas.fa-meh:hover {
    color: #756b5b;
}

.gform_wrapper .gf_mood ul.gfield_radio i.fas.fa-smile {
    color: #c5bfb5;
}

.gform_wrapper .gf_mood ul.gfield_radio input[type="radio"]:checked + label i.fas.fa-smile,
.gform_wrapper .gf_mood ul.gfield_radio i.fas.fa-smile:hover {
    color: #d8c7a5;
}

.gform_wrapper .gf_mood ul.gfield_radio i.fas.fa-grin {
    color: #c5bfb5;
}

.gform_wrapper .gf_mood ul.gfield_radio input[type="radio"]:checked + label i.fas.fa-grin,
.gform_wrapper .gf_mood ul.gfield_radio i.fas.fa-grin:hover {
    color: #c8b182;
}