/*
Theme Name: Square theme for the UoR Research groups
Theme URI: https://hashthemes.com/wordpress-theme/square/
Author: University of Reading (IT-ACT E. Mathieu). Child theme of Square, created by https://hashthemes.com
Author URI: https://www.research.reading.ac.uk/act
Version: 1.0
Text Domain: square
Tags: research, Reading, groups, University
Template: square

This theme, like WordPress, is licensed under the GPL.
*/
/* Import the base styles */
@import url('../square/style.css');

/**************************************************************
A few improvements of the square theme to reflect the UoR look and feel
**************************************************************/
table {
    border-collapse: collapse;
}
table, td {
    border: 1px solid grey;
	padding: 8px;
}
a , .single-entry-content a{
    color: #2796a2;
}
a:hover {
    text-decoration: underline;
}
.sq-featured-post-wrap a{
	color: #222;
}
.sq-featured-post-wrap a:hover {
    text-decoration: none;
}
#univ_logo{
	height: 40px;
	width: 116px;
	background-image: url("University-of-Reading-Logo_white.png");
	background-size:     cover;
    background-repeat:   no-repeat;
    background-position: center center; 
	margin-top:7px;
	margin-left:30px;
}
#univ_links {
	margin-left:30px;
}
#univ_links, #univ_links a{
	font-size: 0.9em;
	color: white;
}
header.sq-main-header{
	cursor: pointer;
	margin-bottom: 20px;
}
.sq-main-title{
	display: inline-block; 
}   
.sq-white  #univ_logo{
	background-image: url("logo-Reading.png");
}
.sq-white  #univ_links, .sq-white  #univ_links a{
	color: #444;
}
#sq-home-slider-section .bx-wrapper .bx-controls-direction a{
	visibility:hidden;
}
#sq-home-slider-section .bx-wrapper .bx-controls-direction a .fa{
	visibility:hidden;
}
.sq_left_sidebar #secondary {
    float: left;
}
.sq-slide-caption {
    /*margin-left: -560px;*/
    background: rgba(0,0,0,0.8);
    padding-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    border-left: 0px solid #2796a2;
    border-right: 0px solid #2796a2;
	position: absolute;
	margin-left: 20%;
	top: 60%;
}
.sq-slide-cap-title {
    text-align: -webkit-left;
	text-align: left;
}
.sq-slide-cap-desc {
    text-align: -webkit-left;
	text-align: left;
    font-size: 20px;
    font-weight: 300;
    padding: 0%;
}
/*---content view button colour-----*/
.pt-cv-wrapper .btn-success {
    color: #fff;
    background-color: rgba(43, 41, 43, 0.8);
    border-color: #eaeaea;
}

/**************************************************************
Limit picture size of imported RSS feeds (with YARSS plugin)
**************************************************************/
.yarss-summary img{
	max-height: 80px;
	max-width: 80px;
	height: auto;
	width: auto;
}


/***************************
COOKIE NOTICE
***************************/
#cookie-notice
{ 
	position: fixed;
	display: none;
	bottom: 0px;
	font-size: 0.8em;
	z-index: 1000;
	background:#2e3336;
	padding:5px;
	text-align:left;
	width:100%;
	padding: 10px 10px 30px 10px;
	color:#ffffff;
}
.cookie-notice-container{
	max-width:700px;
	margin: auto;
}
#cookie-notice-button{
    background-color: transparent;
	font-size: 1.2em;
	padding: 10px;
    border: 2px solid #fff;
    color: #fff;
}
#cookie-notice-button:hover{
	background-color: #666666;
	color:#fff;
	text-decoration: none;
}

/**************************************************************
Following lines added to fix display issue of crayon plugin within wp-knowledgebase
**************************************************************/
#kbe_content .kbe_leftcol .crayon-line span {
	margin-bottom: 0px;
}
.crayon-row span{
	display:inline;
}

.kbe_breadcrum, .kbe_search_field{
	margin-bottom:10px;
}


/**************************************************************
Nice display of KB search field on landing page:
**************************************************************/
.kbe_widget input[type=text] {
    height: 50px;
    font-size: 20px;
	  width:100%;
}

/**************************************************************
Classe created for boxes copying the KB style. Those boxes can be added on any page, such as the site landing page.
**************************************************************/
.kbe_home {
    background-color: #00968d !important;
    display: flex;
    flex-direction: column;
    padding: 1em;
    width: 100%;
}
.kbe_home h2 {
    font-size: 22px;
    font-weight: normal;
    border-bottom: 1px solid #fff;
    padding-bottom: 12px;
    margin-bottom: 0px;
    margin-top: 0px;
    width: 100%;
	  color: #fff;
}
.kbe_home p {
    padding: 0;
    margin: 0;
    color: #ddd;
}
.kbe_home img {    
	  max-width: 64px;
    max-height: 64px;
    margin-right: 10px;
}
.kbe_home {
	  text-decoration: none;
}
span.kbe_category.kbe_howto_cat {
    width: 100%;
}
#cat_articles{
	padding: 0;
    display: none;
	background-color: white;
	margin-left: calc(-1em + 2px);
    margin-right: calc(-1em + 2px);
}
.kbe_howto_article {
    background-color: white;
    padding: 5px 5px 5px 15px;
}
.kbe_howto_article:hover {
    background-color: #eee;
}
span.kbe_category.kbe_howto_cat div a h2:after {
    content: '\271A';
    font-size: 24px;
    color: #ffffff;
    float: right;
    margin-left: 5px;
	margin-top: -3px;
}
span.kbe_category.kbe_howto_cat:hover div a h2:after {
    display:none;
}


/**************************************************************
Format the KB widget title to be identic to other widgets
**************************************************************/
.kbe_widget h2{
	  font-weight: 400;
    position: relative;
    margin-bottom: 10px;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-size: 20px;    
	  line-height: 1.2;
    font-family: 'Roboto Condensed', sans-serif;
    margin: 0;    
}
.kbe_widget h2:before {
    content: "";
	  position: absolute;
    left: 0;
    top: 100%;
    margin-top: -4px;
    height: 1px;
    width: 40px;
    background: #2796a2;
}
.kbe_widget h2:after {
    content: "";
    position: absolute;
    left: 0;
    top: 100%;
    margin-top: 0px;
    height: 1px;
    width: 20px;
    background: #2796a2;
}



/**************************************************************
Change mouse style to pointer when above an accordion. So user is invited to click
**************************************************************/
.accordion{
    background-color: rgb(238, 238, 238);
}
.accordion-content{
    background-color: #FFF;
	border:solid;
	border-width:2px;
	border-color:rgb(238, 238, 238);
	padding-left: 20px;
}
.accordion-title{
    cursor: pointer;
    background-color: rgb(238, 238, 238);
	padding: 5px;
	margin-bottom: 0px;
	font-weight:600;
}
.accordion-title:after {
    content: '\02795'; /* Unicode character for "plus" sign (+) */
    font-size: 13px;
    color: #777;
    float: right;
    margin-left: 5px;
}
.accordion-title.open:after {
    content: "\2796"; /* Unicode character for "minus" sign (-) */
}
.accordion-title:focus {
	outline-color: rgb(238, 238, 238);
}


/**************************************************************
FIX for campus directory display 
**************************************************************/
#emd-primary {
	margin-top:80px;
}


/**************************************************************/
/* MEDIA */
/**************************************************************/
@media screen and (max-width: 900px){
	.sq-slide-caption {
		top: 40%;
		margin-left: 20px;
	}
}