/*
 Theme Name:   Tempera-child
 Theme URI:    /public_html/wp/wp-content/themes/tempera-child/style.css
 Description:  Tempera Child Theme for ICAN Switzerland
 Author:       Maya Brehm
 Author URI:   
 Template:     tempera
 Version:      1.0.0
 Tags:         light, dark, one-column, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  tempera-child
*/

@import url("../tempera/style.css");

/* Theme customization
-------------------------------------------------------------- */
/*cookie consent notice*/

.cookie-notice-container {text-align:center;}

/*header color to fill entire window*/
#header-full {background-color:#fff;}

/*logo behaviour on hover*/
#header-container a:hover {background: url("http://www.icanswitzerland.ch/wp/wp-content/uploads/2018/09/icanswitzerland-header_1150x90_new_light.jpg") no-repeat;}

/*cryout-columns styling*/
#front-columns {margin-top:-20px; padding-top: 20px; padding-left: 50px; padding-right:50px;}
#front-columns h3 {margin-bottom:20px; text-align: center;}
.column-image img {border-radius: 50%; width:180px; box-shadow:3px 3px 2px 1px #ccc;}
.column-image a {display:block; -webkit-transform: scale(.9); -ms-transform: scale(.9); transform: scale(.9); transition: .5s transform;}
.column-image a:hover {-webkit-transform: scale(1) rotate(10deg); -ms-transform: scale(1) rotate(10deg); transform: scale(1) rotate(10deg);}

/*Post entry header on the front page, and search results header*/
#content .entry-header {background-color: #333; padding:10px;}
#content .entry-header h2, #content .entry-header h1 {color: #fff;}
#content .entry-header a:hover {color: #333;background-color:#fff;}

/*Read more button*/
a.continue-reading-link {color:#f2385a!important; border:none; font-weight:bold;}
a.continue-reading-link:hover {color:#3aa2bf!important;}

/*Capitalization of main navigation menu and widget titles*/
.widget-title, .menu li, #secondary h3, #first h3, #third h3, h3 {text-transform: uppercase; font-weight: bold;}

/*Main navigation*/
.menu {border:none;}
#access {border:none;}
#access li li.menu-item.current-menu-item > a{background-color:#333333;}
#access .menu li li a:hover {background-color:#333333;}

/*Action menu item styling*/
#menu-item-3224 a, #menu-item-3225 a {color: #fff!important; background-color:#f2385a!important;}
#menu-item-3224 a:hover, #menu-item-3225 a:hover {background-color:#fde1e6!important; color: #f2385a!important;}

/*Search forms not to have rounded corners*/
input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="week"], #searchform input[type="text"] 
{border-radius: 0px !important;
-moz-border-radius: 0px !important;
-webkit-border-radius: 0px !important;}

/*Child-pages presentation containers not to have rounded corners*/
.child_pages .child_page-container
{background-color: #e9f2df; border: 1px solid #e9f2df; border-radius: 0px;}
.post_excerpt {display:none;}

/*Pages sections with different background-colors*/
.a, .b, .c {padding:30px;}
.a p, .b p, .c p {padding-top: 10px;}
.a {background-color:#e9f2df;}
.b {background-color:#d2e9ef;}
.c {background-color:#fde1e6;}

/*Image captions*/
.wp-caption-text {font-size:x-small !important; text-align:left !important;}

/*Widgets and widget titles not to have rounded corners, nor borders, nor padding*/
.widget-container {padding-top:0; padding-left:0;}

.widget-title {
padding-left:10px;
margin-top:0;
margin-left:0;
margin-bottom:10px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
border:none;
border-radius:0px;
}

/*White widget background*/
#custom_html-6, #custom_html-7, #custom_html-8, #custom_html-9, #custom_html-11, #custom_html-12, #custom_html-13, #media_video-3 {background-color:#fff;}

/*Right side-bar widgets to align vertically with page content on the left*/
#secondary {margin-top: 50px;}

/*Signatures jellyfish counter widget styling - deactivated
#counter_widget-2, #counter_widget-3 {background-image: url("http://www.icanswitzerland.ch/wp/wp-content/uploads/2018/02/snail-1.png"); background-repeat:no-repeat; background-position: 90% 100%; 
	-webkit-animation: snail 10s infinite;
	animation: snail 10s infinite;}
@-webkit-keyframes snail {
	0% {background-position: 90% 100%;}
	100% {background-position: 98% 100%;}}
@keyframes snail {
	0% {background-position: 90% 100%;}
	100% {background-position: 98% 100%;}}

.odometer-description {margin-top:10px; margin-bottom:10px; text-align:center; font-weight:bold;}
#counter_widget-2 h3 {width: 330px; box-shadow:3px 3px 2px 1px #ccc;}
#counter_widget-3 h3 {width: 250px; box-shadow:3px 3px 2px 1px #ccc;}*/

/*blockquotes filling half of the screen*/
.halfquote {width:50%;float:right!important;margin-left:30px;}

/*divs filling half of the screen*/
.halfdivleft {width:49%; float:left!important;}
.halfdivright {width:49%; float:right!important;}

/*ul li quote to sit left of image*/
#umbrellaquote {width:50%;}

/*Accordions*/
.accordions-head {font-family: Francois One; border:0;}
.accordions-head-title {font-size: medium;}
.accordion-content {font-family: Didact Gothic; border:0;}
.accordion-content p, ul {font-size:medium;}
.accordion-content a {color:#f2385a;}
.accordion-icons {color:#fff!important;}
#accordions-2418, #accordions-2420, #accordions-2442, #accordions-2444, #accordions-3005, #accordions-3011, #accordions-3090, #accordions-3091 {margin-top: 20px;}

/*Footer widget title to be centred*/
#footer-widget-area h3 {text-align:center;}

/*End we choose image*/
#custom_html-5 img {box-shadow: 3px 3px 2px 1px #ccc;}

/*Join the movement link*/
#movement {background-color:#f2385a; color:#fff!important; padding:10px;}
#movement:hover {background-color:#3aa2bf!important; text-decoration:none!important;}
#movement {border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;}

/*Twitter widget*/
#ctf {font-size:x-small; line-height: 1em;}

/*Copyright section*/
#footer2 {background-color:#fff!important;}
#site-copyright {font-size:small;font-style:normal;}

/*List of partner organisations in Switzerland*/
#swiss-partners {margin-top:20px; margin-left:100px; margin-bottom:20px;}
#swiss-partners li {list-style-type: none;}

/*List of publications*/
.publication {width:33%; height: 350px; position:relative; text-align:center; float:left;}
.publication img {border-radius:100px; box-shadow:3px 3px 2px 1px #ccc;}

/*Analyse*/
#analyse {clear:both; position:relative; top:40px; margin-bottom: 50px;}
#analyse p {text-align: center!important;}
#analyse img {border-radius:100px; box-shadow:3px 3px 2px 1px #ccc;}

/*Key argument lists highlighted in red*/
.red li {color:#f2385a; border-left: 25px solid #f2385a; background-color: #fde1e6; list-style-type:none !important; padding:15px !important;}

/*Key argument lists highlighted in blue*/
.blue li {color:#3aa2bf; border-left: 25px solid #3aa2bf; background-color: #d2e9ef; list-style-type:none !important; padding:15px !important;}

/*Timeline customization, especially to avoid text overlap*/
.flag h3 {font-size:60% !important;}
.date {font-size:150% !important; line-height:100% !important;}

/*Team contact images styling*/
.team {width:33%; height: 270px; position:relative; text-align:center; float:left;padding:10px;}
.team img {border-radius:100px;box-shadow:3px 3px 2px 1px #ccc;}
.team a {display:block; -webkit-transform: scale(.9); -ms-transform: scale(.9); transform: scale(.9); transition: .5s transform;}
.team a:hover {-webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1);}

/*Click-to-tweet link customization*/
.tweetinvite {background-image: url("http://icons.iconarchive.com/icons/icons8/android/16/Social-Networks-Twitter-icon.png"); background-repeat:no-repeat; background-position: 10%;}
.tweet a {color:#ffffff; background-color:#f2385a; border-radius: 25px; padding: 5px; white-space:nowrap;}
.tweet a:hover {color:#f2385a; background-color:#ff939f;}
.tweet a:active {color:#f2385a; background-color:#ff939f;}

/*Embedded tweet customization*/
blockquote.twitter-tweet {display: inline-block; text-align:right; width:250px;}

/*Legal text extracts styling since the Tempera "preformatted" style linebreaks don't work anymore*/
p.law {font-family: "Courier 10 Pitch", Courier, monospace; padding:15px; margin-left:50px; margin-right:50px; background-color: #eeeeee; text-align: justify;}

/*Parliamenary Pledge Page styling*/
#pledgeheader h1 {color:#f2385a;font-size:500%;font-weight:bold;}
#pledgetext {float:right; width: 40%; margin-right:30px; background-color:#d2e9ef; padding:30px; font-family: "Courier 10 Pitch", Courier, monospace;box-shadow:5px 5px 3px 1px #ccc;}
#pledgeinfo {width:45%;}
#pledgeinfo h2 {color:#f2385a;font-size:300%;font-weight:bold;}
#pledgeinfo h3 {color:#f2385a;}
#pledgesignatories {clear:both; padding-top:20px;}

/*ICAN Cities Appeal styling*/
#icancitiesappeal {clear:both; background-color: #262626; text-align: center; padding:30px;}
#icancitiesappeal img {padding: 30px;}
#icancitiesappeal h4 {color:#ffda03;}
#icancitiesappeal a {background-color: #ffda03; color:#ffffff; padding:15px; font-size:150%;}

/*Hiroshima 2018 post and Bern-Hiroshima animation*/
#tpnwtitle h1 {color:#f2385a;font-size:300%;font-weight:bold;}
#tpnwpreamble {float:left; width: 37%; margin-top:30px; margin-right:30px; font-family: "Courier 10 Pitch", Courier, monospace;}
#tpnwarticle {float:left; width: 99%; margin-top:30px; margin-right:30px; background-color:#d2e9ef; padding:30px; font-family: "Courier 10 Pitch", Courier, monospace;box-shadow:5px 5px 3px 1px #ccc;}
#tpnwarticle h2 {color:#f2385a;font-size:200%;font-weight:bold;}

.transition {position:relative; width:60%; float:right; padding-top:30px;}
#hiroshima {display:block; opacity: 1;
-webkit-animation: fadeOut 5s ease infinite alternate;
animation: fadeOut 5s ease infinite alternate;
}

@-webkit-keyframes fadeOut {
from {opacity:1;}
to {opacity:0;}
}

@keyframes fadeOut {
from {opacity:1;}
to {opacity:0;}
}

#bern {position: absolute; top: 30px; bottom: 0; left: 0; right: 0; opacity: 0;
-webkit-animation: fadeIn 5s ease infinite alternate;
animation: fadeIn 5s ease infinite alternate;
}

@-webkit-keyframes fadeIn {
from {opacity:0;}
to {opacity:1;}
}

@keyframes fadeIn {
from {opacity:0;}
to {opacity:1;}
}

/*Mobile style customization
-------------------------------------------------------------- */

/*Hides the text of the cryout columns on the front page, adds space between the slider and the cry-out columns when they are displayed on 2 rows, adds padding between publication images*/
@media only screen and (max-width: 1200px){
#front-columns {margin-top: 30px !important;}
.column-text {display:none !important;}
.publication {padding-right:10px;}
#second.widget-area {min-width:300px;}
.halfquote {width:100%;}
}

/*Makes tables responsive by adding breakpoints*/
@media only screen and (max-width: 1200px) {
table.responsive {
margin-bottom: 0;
overflow: hidden;
overflow-x: scroll;
display: block;
white-space: nowrap;}
}

@media only screen and (max-width: 1200px) {
#tpnwpreamble {width:100%;}
.transition {width:100%;}
}

/*Simplified pledge page presentation*/
@media only screen and (max-width: 1200px) {
#pledgeheader h1 {color:#f2385a;font-size:250%;font-weight:bold;}
#pledgetext {float:right; width: 100%; margin-right:10px; background-color:#d2e9ef; padding:20px; font-family: "Courier 10 Pitch", Courier, monospace;box-shadow:5px 5px 3px 1px #ccc;}
#pledgeinfo {width:100%;}
#pledgeinfo h2 {color:#f2385a;font-size:200%; font-weight:bold;}
#pledgeinfo h3 {color:#f2385a;}
#pledgesignatories {clear:both; padding-top:20px;}}