/*
Theme Name:     Animaatiokilta Child
Theme URI:      https://www.animaatiokilta.fi
Description:    Child theme of Oceanwp with custom styling
Author:         Your Name
Author URI:     https://www.animaatiokilta.fi
Template:       oceanwp
Version:        1.0.0
Text Domain:    animaatiokilta-child
*/

/* = Custom styles start here
-------------------------------------------------------------- */


/**
 * Reset CSS
 */

/* 1. Use a more-intuitive box-sizing model */
*, *::before, *::after {
  box-sizing: border-box;
}

/* 2. Remove default margin */
*:not(dialog) {
  margin: 0;
}

/* 3. Enable keyword animations */
@media (prefers-reduced-motion: no-preference) {
  html {
    interpolate-size: allow-keywords;
  }
}

body {
  /* 4. Add accessible line-height */
  line-height: 1.5;
  /* 5. Improve text rendering */
  -webkit-font-smoothing: antialiased;
}

/* 6. Improve media defaults */
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}

/* 7. Inherit fonts for form controls 
input, button, textarea, select {
  font: inherit;
}
*/

/* 8. Avoid text overflows */
p, h1, h2, h3, h4, h5, h6, li {
  overflow-wrap: break-word;
  max-width: 70em;
}

/* 9. Improve line wrapping */
p {
  text-wrap: pretty;
}
h1, h2, h3, h4, h5, h6 {
  text-wrap: balance;
}

/*
  10. Create a root stacking context
*/
#root, #__next {
  isolation: isolate;
}


th, td {
    text-align: left;
}

/* Global text */
body {
    font-family: "Inter", sans-serif;
    line-height: 1.65;
    color: #202020;
}

/* Links */
a, .wp-block-navigation a:hover {
        text-decoration: none;
}

a:hover,
a:focus {
        text-decoration: underline;
}

body.home .page-header-inner {

    text-align: left !important;
}


/* realted thumbnails */
.related-thumb {
     background-color: transparent !important;   
}


.related-post-media .related-thumb img 
{
   border-radius: 6px;
    overflow: hidden;
    object-fit: cover;
    width: 100%;
    height: 300px;
    border: solid 1px #efefef;
    background: none;
}

@media only screen and (min-width: 1024px) {



.text-line th{
    min-width: 120px;
    margin-right: 20px;
}
.reqd {
    color: #aaa;
}
.wpcf7-form p {
    margin: 0px !important;
}

.wp-list-table th {
    text-transform: uppercase;
    font-weight: 700;
    font-size: 80%;
}

}


/* participants database custom styles */

.pdb-list .wp-list-table th {
    display: none;
}
.pdb-list .wp-list-table {
    margin: 0 -1.16%;
}

.pdb-list .wp-list-table tr {
    display: inline-block;
    width: 31%;
    margin: 15px 1.16%;
    overflow: hidden;
    vertical-align: top;
}
.pdb-list .wp-list-table td {
    display: block;
    margin-bottom: 0;
    padding: 1px 0 !important;

}

.pdb-list .wp-list-table .first_name-field, .pdb-list .wp-list-table .last_name-field {
    display: inline-block;
}

.pdb-list .wp-list-table .last_name-field {
    margin-left: 0em;
}
.pdb-list .wp-list-table .approved-field {
    display: none;
}

.wp-list-table th, .wp-list-table td, .form-table th, .form-table td  {
    vertical-align: top !important;
}

.pdb-list.participants-database {
    margin: 0;
}

.pdb-list div, .pdb-list span {
vertical-align: top !important; 
}

.pdb-signup .helptext {
    display: inline !important;
    margin-bottom: 1em;
}

.pdb-list .record img {
    border-radius: 6px;
    overflow: hidden;
    object-fit: cover;
    width: 100%;
    border: solid 1px #efefef;

}

.pdb-list .pdb-image {
    margin-bottom: 1em;
    width: 100%;
}


.pdb-list{
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;              /* space between items */
}
.pdb-list .record  {
    flex: 0 0 calc(33.333% - 2rem);
    overflow-x: hidden;
}


.pdb-list .pdb-field-data {
font-size: 85%;
}



.pdb-list .first_name-field, .pdb-list .last_name-field {
    display: inline;
    margin-bottom: 10px;
}


.pdb-list .first_name-field span, .pdb-list .last_name-field span  {
    font-weight: 700;

}
.pdb-pagination ul {

    margin-left: 0 !important;
}

.wp-block-image  {
    clear: both;
}

.helptext {
    color: #BBB;
}

select {
        background: url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0Ljk1IDEwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9LmNscy0ye2ZpbGw6IzQ0NDt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPmFycm93czwvdGl0bGU+PHJlY3QgY2xhc3M9ImNscy0xIiB3aWR0aD0iNC45NSIgaGVpZ2h0PSIxMCIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMiIgcG9pbnRzPSIxLjQxIDQuNjcgMi40OCAzLjE4IDMuNTQgNC42NyAxLjQxIDQuNjciLz48cG9seWdvbiBjbGFzcz0iY2xzLTIiIHBvaW50cz0iMy41NCA1LjMzIDIuNDggNi44MiAxLjQxIDUuMzMgMy41NCA1LjMzIi8+PC9zdmc+) no-repeat 95% 50%;
    -moz-appearance: none; 
    -webkit-appearance: none; 
    appearance: none;
}
select, input[type="text"], textarea{
    border-radius: 2px;
    border: solid 1px #ccc;
    padding: 0.25em;
    margin-bottom: 0.25em;
    min-height: 30px;
}



input[type="file"]{

    color: #222;
    border: solid 1px #ccc;
    font-weight: 400;
font-family: inherit;   font-size: 80%;
border-radius: 2px;
    padding: .75em 1em;
}

.pdb-signup td .helptext {
color: #777;
}



@media only screen and (min-width: 768px) and (max-width: 1024px) {
.pdb-list .wp-list-table tr {
    width: 47%;
    margin: 1.16%;

}
.pdb-list .record  {
    flex: 0 0 calc(50% - 2rem);
}

}

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


/* participants database list styles */


.pdb-list .record img {
    overflow: hidden;
    object-fit: cover;
    width: 100%;
    height: auto !important;

}

.pdb-list .pdb-image {
    width: 100%;
    height: 100%;
}



.pdb-list.participants-database {
    margin: 0;
}
.pdb-list .wp-list-table tr {

    width: 100%;
    margin: 1.16%;

}

.pdb-list .record  {
    flex: 0 0 calc(100% - 1.5rem);
}


   
}
