/*
Theme Name: Dance Me Up
Theme URI: http://sorjaproductions.fi/
Author: Sorja Productions
Author URI: http://sorjaproductions.fi/
Description: Dance Me Upille tehty WordPress-teema
Version: 1.0
Text Domain: dancemeup
*/

:root {
	--musta: #000000;
	--valkoinen: #ffffff;
	--keltainen: #EBFF06;
    --rajoittaja: 1660px;
    --rajoittajakapea: 1184px;
    --fonttikoko: 20px;
}

html, body {
	margin: 0;
	font-size: var(--fonttikoko);
}

body {
	font-family: "Montserrat", sans-serif;
	font-weight: 400;
	font-style: normal;
	background: var(--musta);
	color: var(--valkoinen);
}

img {
    max-width: 100%;
    height: auto;
}

p {
	font-size: 1rem;
	line-height: 1.750em;
	margin: 1.5rem 0;
}

h1, h2, h3, h4, h5 {
	font-weight: 800;
	word-break: break-word;
	overflow-wrap: break-word;
}

h1 {
	font-size: 3.750rem;
	line-height: 1.227em;
}

h2 {
	font-size: 2.500em;
	line-height: 1.200em;
}

h3 {
	font-size: 1.250rem;
	line-height: 1.400em;
}

h4 {
	font-size: 1.100rem;
	line-height: 1.400em;
}

h5 {
	font-size: 1.000rem;
	line-height: 1.400em;
}

a {
	color: var(--keltainen);
	transition: 0.25s color;
	text-decoration: none;
}

blockquote {
	quotes: '"' '"' '"' '"';
	font-style: italic;
}

blockquote:before {
    content: open-quote;
}

blockquote:after {
    content: close-quote;
}

.alignleft {
    float: left;
    margin: 0.3em 2em 2em 0;
}

.aligncenter {
	display: block;
	margin: 2em auto;
}

.alignright {
    float: right;
    margin: 0.3em 0 2em 2em;
}

.wp-caption-text {
    font-size: 0.9em;
    font-style: italic;
    margin-top: 0.25em;
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.embed-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	max-width: 100%;
} 

.embed-container iframe,
.embed-container object,
.embed-container embed { 
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.kehys {
	width: var(--rajoittaja);
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
}

.rivi {
	display: flex;
	flex-wrap: wrap;
	box-sizing: border-box;
	justify-content: center;
}

.solu {
	display: block;
	box-sizing: border-box;
}

.solu12 {
	width: 100%;
}

.solu11 {
	width: calc(100% / 12 * 11);
}

.solu10 {
	width: calc(100% / 1.2);
}

.solu9 {
	width: 75%;
}

.solu8 {
	width: calc(100% / 1.5);
}

.solu7 {
	width: calc(100% / 12 * 7);
}

.solu6 {
	width: 50%;
}

.solu5 {
	width: calc(100% / 2.4);
}

.solu4 {
	width: calc(100% / 3);
}

.solu3 {
	width: 25%;
}

.solu2 {
	width: calc(100% / 6);
}

.solu1 {
	width: calc(100% / 12);
}

header.ylapalkkihero.etusivu {
    display: block;
    aspect-ratio: 1920 / 1050;
    background: url(images/etusivukuva1.png);
    background-size: contain !important;
    background-position: center bottom !important;
    background-repeat: no-repeat !important;
    width: 1920px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.hero {
    display: flex;
    width: 100%;
    /* align-self: stretch; */
    align-items: center;
    justify-content: center;
}

.ylapalkkihero .kehys.fhd.rivi {
    height: 100%;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1.75rem 2rem;
    box-sizing: border-box;
}

.ylapalkkihero.alasivu .kehys.fhd.rivi {
    align-items: center;
}

.valikot.rivi {
    width: 100%;
    justify-content: space-between;
}

.ylapalkkihero ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
}

.ylapalkkihero ul a {
    font-size: 1rem;
    color: var(--valkoinen);
    text-decoration: none;
    margin-right: 2rem;
}

.ylapalkkihero ul a:hover {
	color: var(--keltainen);
}

.ylapalkkihero .paavalikko ul a {
    text-transform: uppercase;
    font-weight: 700;
}

.ylapalkkihero .lisavalikko ul a {
    padding-left: 40px;
	background-position: center left !important;
    background-repeat: no-repeat !important;
}

.ylapalkkihero li,
.ylapalkkihero li > a {
    display: block;
    padding-top: 5px;
    padding-bottom: 5px;
}

li.ohjaajaportaali a {
    background: url(images/ikoni_ohjaajaportaali.svg);
    background-size: 28px auto;
}

li.ostoskori a {
    background: url(images/ikoni_ostoskori.svg);
    background-size: 23px auto;
}

li.kieliversio a {
    background: url(images/ikoni_kieliversio.svg);
    background-size: 28px auto;
}

.ylapalkkihero .lisavalikko ul li:last-child a {
    margin-right: 0;
}

.lisavalikko li > a {
    position: relative;
}

.lisavalikko li > a:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 40px;
    height: 100%;
    background-position: left center !important;
    background-repeat: no-repeat !important;
    opacity: 0;
    transition: 0.25s opacity;
}

.lisavalikko li > a:hover:after {
    opacity: 1.0;
}

.lisavalikko li.ohjaajaportaali > a:after {
    background: url(images/ikoni_ohjaajaportaali_hover.svg);
    background-size: 28px auto;
}

.lisavalikko li.ostoskori > a:after {
    background: url(images/ikoni_ostoskori_hover.svg);
    background-size: 23px auto;
}

.lisavalikko li.kieliversio > a:after {
    background: url(images/ikoni_kieliversio_hover.svg);
    background-size: 28px auto;
}

.hero img {
    display: block;
    width: 760px;
    max-width: 50%;
    margin-bottom: 5vw;
}

.rivi.pystykeskitys {
    align-items: center;
}

.rivi.sivukeskitys {
    justify-content: center;
}

.keltainen {
    color: var(--keltainen);
}

form.wpcf7-form > .kokolevea {
    width: 100%;
}

form.wpcf7-form > * input,
form.wpcf7-form > input,
.single_variation_wrap > * input,
form.wpcf7-form > * textarea,
form.wpcf7-form > textarea,
form.wpcf7-form > * select,
.variations > * select,
form.wpcf7-form > select {
    display: block;
    width: 100%;
    font-size: 1rem;
    font-family: "Montserrat", sans-serif;
    font-weight: 400;
    padding: 0.87rem 1.25rem;
    box-sizing: border-box;
    border: 7px solid var(--musta);
}

form.wpcf7-form > *,
form.wpcf7-form > input {
    display: block;
    width: 50%;
}

.nappula,
form.wpcf7-form > input.nappula,
.woocommerce ul.products li.product .button,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt.disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt.disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled[disabled], .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled[disabled]:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt.disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt.disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled[disabled], .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled[disabled]:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled[disabled], .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled[disabled]:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt.disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt.disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled[disabled], .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled[disabled]:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce #respond input#submit.alt.disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce #respond input#submit.alt.disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce #respond input#submit.alt:disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce #respond input#submit.alt:disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce #respond input#submit.alt:disabled[disabled], :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce #respond input#submit.alt:disabled[disabled]:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce a.button.alt.disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce a.button.alt.disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce a.button.alt:disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce a.button.alt:disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce a.button.alt:disabled[disabled], :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce a.button.alt:disabled[disabled]:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce button.button.alt.disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce button.button.alt.disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce button.button.alt:disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce button.button.alt:disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce button.button.alt:disabled[disabled], :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce button.button.alt:disabled[disabled]:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce input.button.alt.disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce input.button.alt.disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce input.button.alt:disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce input.button.alt:disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce input.button.alt:disabled[disabled], :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce input.button.alt:disabled[disabled]:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce #respond input#submit.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce a.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce button.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce input.button.alt,
p.profiilinavigaatio > *,
.markuk_kayttajahallinta input[type="submit"] {
    display: inline-block;
    font-family: "Montserrat", sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--keltainen);
    text-decoration: none;
    border: 3px solid var(--keltainen);
    background: var(--musta);
    border-radius: 29px;
    padding: 0.775em 1.126em;
    line-height: 1em;
    transition: 0.35s background, 0.35s color;
    margin: 0.75em 0.75em 0.75em 0;
    text-align: center;
    cursor: pointer;
    text-decoration: none !important;
}

.nappula:hover,
form.wpcf7-form > input.nappula:hover,
.woocommerce ul.products li.product .button:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce #respond input#submit.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce a.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce button.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce input.button.alt:hover,
.markuk_kayttajahallinta input[type="submit"]:hover {
    background: var(--keltainen);
    color: var(--musta);
}

span.wpcf7-spinner {
	display: none;
    width: auto;
}

.koulutuskalenteri {
    display: block;
    margin-top: 3rem;
}

.koulutuskalenteri_rivi {
    display: flex;
    width: 100%;
    background: var(--keltainen);
    color: var(--musta);
    align-items: center;
    padding: 0 32px;
    box-sizing: border-box;
}

.koulutuskalenteri_solu {
    display: block;
    font-size: 1rem;
    font-weight: 700;
    padding: 1.727rem 32px;
    box-sizing: border-box;
    word-break: break-word;
    overflow-wrap: break-word;
}

.koulutuskalenteri_rivi:nth-of-type(2n) {
    background: var(--valkoinen);
}

.koulutuskalenteri_solu.paivays {
    width: 180px;
}

.koulutuskalenteri_solu.kategoria {
    width: 300px;
}

.koulutuskalenteri_solu.cta {
    width: 280px;
    text-align: right;
    padding-right: 7px;
}

.koulutuskalenteri_solu.sijainti {
    width: calc(100% - 760px);
}

.nappula.transparent {
    color: var(--musta);
    background: none;
    border-color: var(--musta);
}

.nappula.transparent:hover {
    background: var(--musta);
    color: var(--valkoinen);
}

.koulutuskalenteri_kehys {
    width: 1364px;
    margin: 0 auto;
    max-width: 100%;
}

footer.alapalkki {
    display: block;
    background: var(--keltainen);
    padding: 4rem 0 3rem 0;
    clear: both;
}

.footnote {
    display: block;
    background: var(--valkoinen);
    padding: 1rem 2rem;
    text-align: center;
    color: var(--musta);
}

.footnote p {
    margin:  0 1em;
    line-height: 1em;
}

.footnote a {
    color: var(--musta);
}

ul.footer_valikko {
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: center;
}

ul.footer_valikko li {
    display: block;
    font-size: 1rem;
    line-height: 1.750em;
}

ul.footer_valikko a {
    display: block;
    color: var(--musta);
    text-decoration: none;
}

ul.footer_valikko a:hover {
    text-decoration: underline;
}

a.some {
    display: inline-block;
    width: 70px;
    height: 70px;
    position: relative;
    background-size: 100% !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    transition: 0.5s opacity;
    margin: 13px;
}

a.some::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-size: 100% !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    transition: 0.5s opacity;
    opacity: 0;
}

a.some:hover::after {
    opacity: 1.0;
}

a.some.ig {
    background: url(images/instagram.svg);
}

a.some.ig::after {
    background: url(images/instagram_hover.svg);
}

a.some.tiktok {
    background: url(images/tiktok.svg);
}

a.some.tiktok::after {
    background: url(images/tiktok_hover.svg);
}

a.some.fb {
    background: url(images/facebook.svg);
}

a.some.fb::after {
    background: url(images/facebook_hover.svg);
}


.somejaot {
    text-align: center;
    padding-top: 6rem;
    padding-bottom: 3rem;
}

.etusivu_osio_1 {
    margin-top: 12rem;
    margin-bottom: 16.5rem;
}

.etusivu_osio_2 {
    margin-bottom: 11rem;
}

.etusivu_osio_3 {
    margin-bottom: 18rem;
}

.etusivu_osio_4 {
    margin-bottom: 5rem;
}

.etusivu_osio_5 {
    margin-bottom: 15rem;
}

.etusivu_osio_6,
.asiakaspalautteet {
    margin-bottom: 22rem;
}

.rajoitus_perus_vasen {
    padding-left: 7.5rem;
    padding-right: 4.25rem;
}

.rajoitus_pieni_vasen {
    padding-left: 4.5rem;
}

.rajoitus_perus_oikea {
    padding-left: 4.25rem;
    padding-right: 7.5rem;
}

.etusivu+.kehys img {
    display: block;
}

a.footer_logo {
    display: inline-block;
    margin-bottom: 4rem;
    max-width: 70%;
}

.kehys.fhd {
    width: 1920px;
}

.koulutuskalenteri .nappula {
    margin: 0;
}


.alasivu .valikot.rivi {
    width: calc(100% - 250px);
    justify-content: flex-end;
    flex-direction: column-reverse;
    align-items: flex-end;
}

.alasivu nav.lisavalikko {
    display: block;
    margin-bottom: 17px;
}

.ylapalkkihero.alasivu .paavalikko ul li:last-child > a {
    margin-right: 0;
}

.karttaosio {
    text-align: center;
}

.oletusmargin {
    margin-top: 8rem;
    margin-bottom: 8rem;
}

.karttaosio .solu > div {
    display: block;
    width: 100%;
    border: 3px solid var(--keltainen);
    /*padding: 15.7rem 8vw;
    font-size: 2.5rem;
    font-weight: 800;
    font-style: italic;
    background: #08304b;
    */
    box-sizing: border-box;
    word-break: break-word;
    overflow-wrap: break-word;
}

.lahetavinkki {
    width: 870px;
    max-width: 100%;
    margin: 10rem auto 9.5rem auto;
    text-align: center;
}

form.wpcf7-form {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 8rem;
    margin-left: -7px;
    margin-right: -7px;
    width: calc(100% + 14px);
    box-sizing: border-box;
}

.yhteydenottolomake form.wpcf7-form {
    justify-content: flex-start;
}

.oletusmargin h1 {
    margin-bottom: 2em;
}

p+h3 {
    margin-top: 4rem;
}

.wpcf7-form-control.wpcf7-submit.nappula {
    margin: 3rem 0 0 0;
    width: auto;
}

a.paalogo, a.paalogo img {
    display: block;
}

.solu > h1:first-child,
.solu > h2:first-child,
.solu > h3:first-child,
.solu > h4:first-child,
.solu > h5:first-child {
    margin-top: 0;
}


.kirjautumissivu {
    width: 884px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

form.wpcf7-form > * textarea,
form.wpcf7-form > textarea {
    min-height: 369px;
}

.solu a:hover {
    text-decoration: underline;
}

form.wpcf7-form.flex_left {
    justify-content: flex-start;
}

.flex_left .wpcf7-form-control.wpcf7-submit.nappula {
    margin-top: 2rem;
}

.kehys > .rivi:first-child > .solu:first-child > h1,
.woocommerce div.product h1.product_title.entry-title {
    margin-top: 4rem;
}

h1.product_title.entry-title {
    text-align: center;
    text-transform: uppercase;
}

.tuotteet {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 2.5rem;
    max-width: 100%;
    width: 100%;
}

article.yksi_tuote,
.tuotteet .woocommerce ul.products li.product {
    display: block;
    width: 403px;
    margin: 2rem 2rem 4rem 2rem;
    text-align: center;
}

h2.tuotteet_otsikko {
    display: block;
    width: 100%;
    text-align: center;
}

a.tuote_kuva,
a.tuote_kuva img,
.attachment-woocommerce_thumbnail,
.woocommerce-placeholder,
.woocommerce ul.products li.product .woocommerce-placeholder {
    display: block;
}

a.tuote_kuva,
.attachment-woocommerce_thumbnail,
.woocommerce-placeholder,
.woocommerce ul.products li.product .woocommerce-placeholder {
    border: 3px solid var(--keltainen);
    position: relative;
    box-sizing: border-box;
}

a.tuote_otsikko > h3,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 1.25rem;
    color: var(--valkoinen);
    margin-top: 2em;
    margin-bottom: 0;
    transition: 0.25s color;
}

a.tuote_otsikko:hover > h3 {
    color: var(--keltainen);
}

p.tuote_hinta,
.woocommerce ul.products li.product .price {
    display: block;
    margin-top: 1rem;
    margin-bottom: 2.25rem;
    color: var(--valkoinen);
    font-size: 1rem;
}

p.tuote_hinta+.nappula {
    margin: 0;
}

a.tuote_kuva img,
.attachment-woocommerce_thumbnail {
    opacity: 1.0;
    transition: 0.25s opacity;
    width: 100%;
}

a.tuote_kuva:hover img {
    opacity: 0.8;
}

.solu.solu_tuotekuva,
.woocommerce div.product div.images.woocommerce-product-gallery {
    display: block;
    width: 497px;
}

.solu.solu_tuotekuva img,
.woocommerce div.product div.images.woocommerce-product-gallery img {
    display: block;
    border: 3px solid var(--keltainen);
    box-sizing: border-box;
    width: 100%;
    height: auto;
}

.solu.solu_tuotedata,
.woocommerce div.product div.summary {
    width: calc(100% - 497px);
    padding-left: 5rem;
    box-sizing: border-box;
}

.solu.solu_tuotedata > *:first-child,
.woocommerce div.product div.summary > *:first-child,
.woocommerce-product-details__short-description > *:first-child {
    margin-top: 0;
}

.rivi.tuotesivu {
    width: 1360px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

form.tuote_osta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6rem;
}

form.tuote_osta select {
    display: block;
    flex-grow: 1;
    width: auto;
    border: 0;
}

form.tuote_osta .wpcf7-form-control.wpcf7-submit.nappula {
    margin: 0 0 0 1.5rem;
}

p.tuotesivu_hinta,
.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product p.price {
    font-size: 1.750rem;
    font-weight: 800;
    margin-top: 2.4em;
    margin-bottom: 1em;
    color: var(--valkoinen);
}

span.tuote_alv {
    font-size: 1rem;
    font-weight: 400;
}

.ohjaajaksi_osio_1 {
    margin-bottom: 12.5rem;
}

.ympyra {
    text-align: center;
    border: 3px solid var(--keltainen);
    width: 75px;
    height: 75px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--keltainen);
    line-height: 1em;
    margin-top: 4rem;
}

.ohjaajaksi_osio_2 .solu4 {
    text-align: center;
    padding: 0 3.9rem;
}

.ympyra+h3 {
    color: var(--keltainen);
}

.ohjaajaksi_osio_2 {
    margin-bottom: 14rem;
}

.ohjaajaksi_osio_3 {
    margin-bottom: 18rem;
}

.ensikuva h1, .ensikuva .solu > h1:first-child {
    margin-bottom: 2rem;
    margin-top: 12rem;
}

.rivi.ensikuva {
    margin-bottom: 13rem;
}

.tunnit_osio_3 > .solu.solu6:first-child {
    padding-right: 1.3rem;
}

.lahetavinkki h3 {
    margin-bottom: 2rem;
}

.wpcf7-not-valid-tip {
    background: #a12121;
    color: var(--valkoinen);
    padding: 0.5rem 1.25rem;
    box-sizing: border-box;
    border-left: 7px solid var(--musta);
    border-right: 7px solid var(--musta);
    text-align: left;
    margin-bottom: 1em;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
    display: block;
    width: 100%;
    border: 0;
    background: #a12121;
    padding: 50px 25px;
    box-sizing: border-box;
    border: 7px solid var(--musta);
    margin: 2rem 0;
}

.karttaupotus div#wpsl-search-wrap,
.karttaupotus .wpsl-search,
.karttaupotus #wpsl-result-list {
    display: none !important;
}

.karttaupotus #wpsl-gmap {
    float: none;
    width: 100%;
    height: 693px !important;
}

.karttaupotus #wpsl-wrap {
    margin-bottom: 0;
}

.tuotteet .woocommerce.columns-4 {
    display: block;
    width: 100%;
}

.tuotteet .woocommerce ul.products {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 2.5rem;
    max-width: 100%;
}

.tuotteet .woocommerce ul.products li.product {
    float: none;
}

.woocommerce-page div.product div.images {
    float: none;
}

.woocommerce div.product {
    display: flex;
    flex-wrap: wrap;
}

h1.product_title.entry-title {
    display: block;
    width: 100%;
}

th.label {
    display: none;
}

td.value {
    display: block;
    width: 100%;
}

.woocommerce div.product form.cart .variations,
.woocommerce div.product form.cart .variations tbody,
.woocommerce div.product form.cart .variations tr {
    display: block;
    width: 100%;
    box-sizing: border-box;
}

.woocommerce div.product form.cart .variations select {
    background: var(--valkoinen);
    appearance: auto;
    -webkit-appearance: auto;
    -moz-appearance: auto;
    border: 0;
    margin: 0;
}

.woocommerce .quantity .qty {
    border: 0;
}

.woocommerce-variation-add-to-cart.variations_button {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

a.reset_variations {
    display: none !important;
}

.single_variation_wrap {
    width: 100%;
}

.woocommerce div.product form.cart div.quantity {
    float: none;
    margin-right: 1.5rem;
}

.woocommerce .quantity .qty {
    width: 120px;
}

.woocommerce-error, .woocommerce-info, .woocommerce-message {
    background-color: var(--keltainen);
    color: var(--musta);
    border: 0 !important;
    background-image: url(/wp-content/themes/dancemeup/images/exclamation.svg);
    background-size: 32px;
    background-position: left 20px center;
    background-repeat: no-repeat;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2rem 2rem 2rem 5rem;
    font-weight: 800;
    line-height: 1em;
}

.woocommerce-message::before {
    display: none;
}

.woocommerce-error::after, .woocommerce-info::after, .woocommerce-message::after {
    display: none;
}

.woocommerce-page .woocommerce-message .button {
    float: none;
    background: var(--musta);
    color: var(--keltainen);
    font-family: "Montserrat", sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--keltainen);
    text-decoration: none;
    border: 3px solid var(--keltainen);
    background: var(--musta);
    border-radius: 29px;
    padding: 0.775em 1.126em;
    line-height: 1em;
    transition: 0.35s background, 0.35s color, 0.35s border;
}

.woocommerce-page .woocommerce-message .button:hover {
    background-color: var(--keltainen);
    color: var(--musta);
    border: 3px solid var(--musta);
}

.woocommerce-message:focus-visible {
    outline: none;
}

a.nappula:first-child:last-child {
    margin: 0;
}

.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
    pointer-events: none;
}

.rivi th.wc-block-cart-items__header-image {
    text-align: left;
}

.rivi .is-large.wc-block-cart .wc-block-cart-items th:last-child {
    padding-right: 0;
}

.rivi .is-large.wc-block-cart .wc-block-cart-items td {
    padding-left: 0;
}

.rivi .is-large.wc-block-cart .wc-block-cart-items td.wc-block-cart-item__product {
    padding-left: 2rem;
}

.rivi .is-large.wc-block-cart .wc-block-cart-items td:last-child {
    padding-right: 0;
}

.rivi tr.wc-block-cart-items__header > * {
    border-bottom: 2px solid var(--keltainen) !important;
}

.rivi table.wc-block-cart-items .wc-block-cart-items__header .wc-block-cart-items__header-product {
    visibility: visible;
}

.rivi table.wc-block-cart-items .wc-block-cart-items__header .wc-block-cart-items__header-product span {
    display: none;
}

.rivi .wc-block-components-quantity-selector input, .wc-block-components-quantity-selector button {
    border: 2px solid var(--keltainen) !important;
}

.rivi .wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input {
    margin: 0 0.5rem;
}

.rivi .wc-block-components-quantity-selector .wc-block-components-quantity-selector__button {
    background: var(--keltainen);
    color: var(--musta);
	opacity: 1.0;
}

.rivi .wc-block-components-quantity-selector:after {
    display: none;
}

.rivi table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-cart-item__remove-link {
    color: var(--keltainen);
    transition: 0.25s color;
    text-decoration: none;
}

.rivi table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-cart-item__remove-link:hover {
    color: var(--keltainen);
    text-decoration: underline;
}

.rivi .is-large.wc-block-cart .wc-block-cart__totals-title {
    padding: 0 2rem 2rem 2rem;
    text-align: center;
    font-size: 1.25em;
}

.rivi .wc-block-components-totals-footer-item .wc-block-components-totals-footer-item-tax {
    text-align: center;
}

.rivi a.wc-block-components-button.wp-element-button.wc-block-cart__submit-button.contained,
.rivi button.wc-block-components-button.wp-element-button.wc-block-components-checkout-place-order-button {
    display: block;
    width: 100%;
    background: var(--keltainen);
    color: var(--musta);
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 800;
    margin-top: 2em;
    border: 3px solid var(--keltainen);
    box-sizing: border-box;
    transition: 0.25s background, 0.25s color;
    font-family: "Montserrat", sans-serif;
    font-size: 1rem;
    font-weight: 700;
}

.rivi a.wc-block-components-button.wp-element-button.wc-block-cart__submit-button.contained:hover,
.rivi button.wc-block-components-button.wp-element-button.wc-block-components-checkout-place-order-button:hover {
    background: var(--musta);
    color: var(--keltainen);
    text-decoration: none;
}

.woocommerce-checkout .solu.solu9 {
    width: 100%;
}

.rivi .wp-block-woocommerce-checkout {
    padding: 0;
}

.rivi .is-large .wc-block-checkout__sidebar.is-sticky {
    background: var(--keltainen);
    color: var(--musta);
    padding: 1rem;
    margin-top: 0;
}

.rivi .is-large .wc-block-checkout__sidebar.is-sticky * {
    border: 0;
}

.rivi .wc-block-components-radio-control--highlight-checked div.wc-block-components-radio-control-accordion-option {
    padding-bottom: 1rem;
}

.rivi .wc-block-components-radio-control__label {
    font-weight: 800;
}

#coming-soon-footer-banner {
    background: var(--musta);
    border-color: var(--keltainen) !important;
    padding: 2px;
    min-height: unset;
}

#coming-soon-footer-banner a {
    color: var(--keltainen);
}

#coming-soon-footer-banner a:hover {
    text-decoration: underline;
}

.rivi button.wc-block-components-quantity-selector__button.wc-block-components-quantity-selector__button--minus[disabled] {
    opacity: 1.0;
    background: #515151;
    border-color: #515151 !important;
}

.woocommerce div.product form.cart .button.disabled {
    border-color: #515151 !important;
    color: #515151 !important;;
    opacity: 1.0 !important;
    pointer-events: none;
}

.solu p:last-child a.nappula {
    margin-top: 0.75em;
}

nav.ohjaajaportaalivalikko {
    display: block;
    padding-right: 7em;
}

nav.ohjaajaportaalivalikko ul {
    list-style: none;
    background: var(--keltainen);
    display: block;
    padding: 1em 3em 1em 1.5em;
    margin: 0;
    width: 300px;
    max-width: 100%;
}

nav.ohjaajaportaalivalikko ul a {
    display: block;
    color: var(--musta);
    text-transform: uppercase;
    font-weight: 700;
    padding: 0.5em 0;
}

.woocommerce-account .woocommerce {
    display: flex;
    align-items: flex-start;
}

p.profiilinavigaatio {
    display: flex;
}

p.profiilinavigaatio > * {
    color: var(--valkoinen);
    border: 3px solid var(--valkoinen);
    background: var(--musta);
    cursor: initial;
}

p.profiilinavigaatio > a {
    color: var(--keltainen);
    border-color: var(--keltainen);
}

p.profiilinavigaatio > a:hover {
    background: var(--keltainen);
    color: var(--musta);
    cursor: pointer;
}

.wp-video {
	position: relative;
	/*padding-bottom: 56.25%;*/
	height: 0;
	overflow: hidden;
	max-width: 100%;
    width: 100% !important;
}

.ohjaajaportaalivalikko_wrapper+.solu8 > .tuotteet:first-child h2.tuotteet_otsikko {
    margin-top: 0;
}

.yksi_tuote a.nappula {
    margin-right: 0;
}

.kehys .markuk_kayttajahallinta .kirjaudu_tai_rekisteroidy {
    display: block;
}

.kehys .markuk_kayttajahallinta .kirjaudu_tai_rekisteroidy > * {
    background: none;
    width: 100%;
    margin: 0;
    text-align: center;
}

form.kayttajahallinta_kirjaudusisaan {
    margin-bottom: 5.5em !important;
}

.kaksirivissa {
    display: flex;
}

.kaksirivissa > * {
    display: block;
    width: calc(50% - 10px);
}

.kaksirivissa > *:first-child {
    margin-right: 10px;
}

.kaksirivissa > *:last-child {
    margin-left: 10px;
}

form.kayttajahallinta_luotili {
    padding-top: 25px;
}

.woocommerce-orders .woocommerce-info::before {
    display: none;
}

.woocommerce-orders a.woocommerce-Button.wc-forward.button {
    display: none;
}

.kehys .markuk_kayttajahallinta .virheruutu,
.kehys .markuk_kayttajahallinta .tililuotu {
    background: var(--musta);
    border: 5px solid #910000;
}

.kehys .markuk_kayttajahallinta .tililuotu {
    border-color: #7CFC00;
}

.page-id-295 .markuk_kayttajahallinta label input {
    margin-top: 5px;
}

.page-id-298 .tuotteet,
.page-id-300 .tuotteet {
    justify-content: flex-start;
}

.page-id-298 .tuotteet > h2.tuotteet_otsikko,
.page-id-298 .tuotteet > p,
.page-id-300 .tuotteet > h2.tuotteet_otsikko,
.page-id-300 .tuotteet > p {
    width: calc(100% - 4rem);
    margin-left: 2rem;
    margin-right: 2rem;
    text-align: left;
}

.page-id-298 .yksi_tuote,
.page-id-300 .yksi_tuote {
    text-align: left;
}

span.kuuluuohjelmaan {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    text-align: center;
    padding: 1rem;
    box-sizing: border-box;
    background: var(--keltainen);
    color: var(--musta);
    font-size: 0.75rem;
}

p.woocommerce-result-count {
    display: none;
}

form.woocommerce-ordering {
    display: none;
}

.koulutuskalenteri_solu a {
    color: var(--musta);
}

.woocommerce-error::before {
    content: '' !important;
}

.woocommerce-error li {
    display: block;
    width: 100%;
}

.woocommerce .woocommerce-error .button, .woocommerce .woocommerce-error .button:hover {
    background: var(--musta);
    color: var(--valkoinen);
}

a.tuote_otsikko+p {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    display: block !important;
}

.maksubanneri img {
    margin: 0 auto;
}

.maksubanneri {
    padding-bottom: 0.75rem;
}

span.koulutuskalenteri_lisateksti {
    font-weight: initial;
}

.rivi.ohjaajaksi_osio_2 .solu6 {
    padding: 2rem 3rem 7rem 3rem;
    text-align: center;
}

.loop_tuote_kuvaus {
    display: block;
    color: var(--valkoinen);
}

span.alehinta {
    font-weight: initial;
}

.yksi_tuote p+h3 {
    margin-top: 0;
}

.wpsl-search {
    background: none;
}

.gm-style-iw.gm-style-iw-c {
    color: var(--musta);
}

#wpsl-gmap a.wpsl-directions {
    color: var(--musta);
    text-decoration: underline;
}

header.ylapalkkihero.etusivu.video {
    background-image: none;
}

.videohero {
    display: block;
    width: 100%;
    margin-top: 2rem;
}

.asiakaspalaute {
    display: block;
    padding: 2rem;
    text-align: center;
}

.slick-slider {
    padding-left: 100px;
    padding-right: 100px;
}

.slick-prev, .slick-next {
    width: 38px;
    height: 59px;
    z-index: 10;
    transition: 0.25s background;
    background-size: contain !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    opacity: 1.0 !important;
}

.slick-prev,
.slick-prev:focus {
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="38.085" height="61.676" viewBox="0 0 38.085 61.676"><path id="Path_40" data-name="Path 40" d="M46.085,13.247,38.838,6,8,36.838,38.838,67.676l7.247-7.247L22.545,36.838Z" transform="translate(-8 -6)" fill="%23000000"/></svg>');
}

.slick-next,
.slick-next:focus {
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="38.085" height="61.676" viewBox="0 0 38.085 61.676"><path id="Path_42" data-name="Path 42" d="M15.837,6,8.59,13.247,32.129,36.838,8.59,60.429l7.247,7.247L46.675,36.838Z" transform="translate(-8.59 -6)" fill="%23000000"/></svg>');
}

.slick-prev:hover {
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="38.085" height="61.676" viewBox="0 0 38.085 61.676"><path id="Path_40" data-name="Path 40" d="M46.085,13.247,38.838,6,8,36.838,38.838,67.676l7.247-7.247L22.545,36.838Z" transform="translate(-8 -6)" fill="%23000000"/></svg>');
}

.slick-next:hover {
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="38.085" height="61.676" viewBox="0 0 38.085 61.676"><path id="Path_42" data-name="Path 42" d="M15.837,6,8.59,13.247,32.129,36.838,8.59,60.429l7.247,7.247L46.675,36.838Z" transform="translate(-8.59 -6)" fill="%23000000"/></svg>');
}

.slick-next:before,
.slick-prev:before {
    display: none !important;
}

.slick-next {
    right: 0px;
}

.slick-prev {
    left: 0px;
}

ul.slick-dots {
    box-sizing: border-box;
    left: 0;
}

.home .videohero > div::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url(https://dancemeup.fi/wp-content/uploads/2024/11/logo_alasivut.svg);
    background-size: 50% auto;
    background-position: center;
    background-repeat: no-repeat;
}

.yhteistyokumppanit {
    display: flex;
    width: 1000px;
    max-width: calc(100% - 200px);
    margin: 100px auto;
    flex-wrap: wrap;
    background: var(--keltainen);
    padding: 50px 100px;
    color: var(--musta);
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

.yhteistyokumppanit > h2,
.yhteistyokumppanit > h3 {
    display: block;
    width: 100%;
    text-align: center;
    margin: 0 0 50px 0;
}

.yhteistyokumppanit a {
    opacity: 1.0;
    transition: 0.25s opacity;
}

.yhteistyokumppanit a:hover {
    opacity: 0.5;
}

.yhteistyokumppanit > * {
    display: block;
    width: calc(25% - 30px);
    margin: 15px;
}

.yhteistyokumppanit img {
    display: block;
    height: auto;
}

@media screen and (max-width: 1000px) {
    .slick-slider {
        padding-left: 50px;
        padding-right: 50px;
    }

    .slick-prev, .slick-next {
        width: 19px;
        height: 30px;
    }

    .yhteistyokumppanit {
        padding: 50px;
    }

    .yhteistyokumppanit > * {
        width: calc(50% - 20px);
        margin: 10px;
    }
}

/* V1 */
.slick-prev, .slick-next {
    width: 50px;
    height: 50px;
    z-index: 10;
}

.slick-prev:before, .slick-next:before {
    font-size: 50px;
    color: var(--keltainen);
    transition: 0.25s opacity;
    opacity: 1.0;
}

.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before {
    opacity: 0.5;
}

.slick-next {
    right: -10px;
}

.slick-prev {
    left: -10px;
}

.asiakaspalautteet {
    background: var(--keltainen);
    color: var(--musta);
    padding: 10px 25px 30px 25px;
}

.markuk_evastevaroitus_evasteasetukset {
    color: #000;
}

.markuk_evastevaroitus_evasteasetukset a {
    color: #000;
    font-weight: bold;
    text-decoration: underline;
}

.soittopyyntolomake {
    display: block;
    padding: 2em;
    background: var(--keltainen);
    color: var(--musta);
    margin: 3rem 0;
    position: relative;
}

.soittopyyntolomake form.wpcf7-form {
    display: block;
    margin: 0;
    width: 100%;
}

.soittopyyntolomake form.wpcf7-form > *, .soittopyyntolomake form.wpcf7-form > input {
    width: 100%;
}

.soittopyyntolomake h2, .soittopyyntolomake h3 {
    margin-top: 0;
}

.soittopyyntolomake form.wpcf7-form > * input,
.soittopyyntolomake form.wpcf7-form > input,
.soittopyyntolomake .single_variation_wrap > * input,
.soittopyyntolomake form.wpcf7-form > * textarea,
.soittopyyntolomake form.wpcf7-form > textarea,
.soittopyyntolomake form.wpcf7-form > * select,
.soittopyyntolomake .variations > * select,
.soittopyyntolomake form.wpcf7-form > select {
    border: 1px solid var(--musta);
}

.soittopyyntolomake .nappula {
    margin-top: 2em !important;
}

.soittopyyntolomake .wpcf7-not-valid-tip {
    border-left: 0;
    border-right: 0;
}

.soittopyyntolomake .wpcf7 form.invalid .wpcf7-response-output,
.soittopyyntolomake .wpcf7 form.unaccepted .wpcf7-response-output,
.soittopyyntolomake .wpcf7 form.payment-required .wpcf7-response-output {
    border: 0;
    color: var(--valkoinen);
}

.soittopyyntolomake .wpcf7 form.sent .wpcf7-response-output {
    box-sizing: border-box;
    background: #3b8c3b;
    color: var(--valkoinen);
    margin-left: 0;
    margin-right: 0;
}


.soittopyyntolomake .wpcf7-form.submitting::after {
    content: 'Odota hetki...';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 2em;
    box-sizing: border-box;
    background: rgba(0,0,0,0.9);
    font-weight: 700;
    color: var(--valkoinen);
}


.wpcf7-form.sent .wpcf7-form-control-wrap {
    display: none;
}

/*
.wp-video iframe,
.wp-video object,
.wp-video embed { 
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
*/

@media screen and (min-width: 1930px)  {
    .hero img {
        margin-bottom: 100px;
    }
}

@media screen and (max-width: 1700px) {
    html {
        font-size: 18px;
    }
    
    .kehys {
        width: 100%;
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .hero img {
        margin-bottom: 0;
    }

    .rajoitus_perus_vasen {
        padding-left: 4rem;
        padding-right: 2rem;
    }

    .rajoitus_perus_oikea {
        padding-left: 2rem;
        padding-right: 4rem;
    }

    .rajoitus_pieni_vasen {
        padding-left: 2rem;
    }

    .rajoitus_pieni_oikea {
        padding-right: 2rem;
    }

    .etusivu_osio_1 {
        margin-top: 10rem;
        margin-bottom: 14rem;
    }
    
    .etusivu_osio_2 {
        margin-bottom: 9rem;
    }
    
    .etusivu_osio_3 {
        margin-bottom: 16rem;
    }
    
    .etusivu_osio_4 {
        margin-bottom: 4rem;
    }
    
    .etusivu_osio_5 {
        margin-bottom: 13rem;
    }
    
    .etusivu_osio_6,
    .asiakaspalautteet {
        margin-bottom: 18rem;
    }
}

@media screen and (max-width: 1600px) {
    nav.paavalikko {
        display: block;
        width: 100%;
        margin-bottom: 0.5rem;
    }

    .alasivu nav.lisavalikko {
        margin-bottom: 10px;
    }

    .alasivu nav.paavalikko {
        margin-bottom: 0;
    }
    
    nav.lisavalikko {
        display: block;
        width: 100%;
    }
    
    .ylapalkkihero .kehys.fhd.rivi {
        display: block;
    }

    .ylapalkkihero.alasivu .kehys.fhd.rivi {
        display: flex;
    }

    .ylapalkkihero.alasivu ul {
        justify-content: flex-end;
    }
    
    header.ylapalkkihero.etusivu {
        aspect-ratio: 1920 / 1150;
    }
    
    .ylapalkkihero ul {
        justify-content: center;
    }
    
    .hero {
        height: 100%;
    }
}

@media screen and (max-width: 1500px) {
    article.yksi_tuote,
    .tuotteet .woocommerce ul.products li.product {
        width: calc((100% / 3) - 4rem);
    }
}

@media screen and (max-width: 1400px) {
    html {
        font-size: 16px;
    }
    
    .koulutuskalenteri_kehys {
        width: 100%;
    }

    .rajoitus_perus_vasen {
        padding-left: 1rem;
        padding-right: 2rem;
    }

    .rajoitus_perus_oikea {
        padding-left: 2rem;
        padding-right: 1rem;
    }

    .rajoitus_pieni_vasen {
        padding-left: 1rem;
    }

    .rajoitus_pieni_oikea {
        padding-right: 1rem;
    }

    .etusivu_osio_1 {
        margin-top: 8rem;
        margin-bottom: 12rem;
    }
    
    .etusivu_osio_2 {
        margin-bottom: 7rem;
    }
    
    .etusivu_osio_3 {
        margin-bottom: 14rem;
    }
    
    .etusivu_osio_4 {
        margin-bottom: 3rem;
    }
    
    .etusivu_osio_5 {
        margin-bottom: 11rem;
    }
    
    .etusivu_osio_6,
    .asiakaspalautteet {
        margin-bottom: 16rem;
    }

    .koulutuskalenteri_solu.paivays {
        width: 20%;
    }

    .koulutuskalenteri_solu.kategoria {
        width: 25%;
    }

    .koulutuskalenteri_solu.cta {
        width: 20%;
    }

    .koulutuskalenteri_solu.sijainti {
        width: 35%;
    }

    .rivi.ensikuva {
        margin-bottom: 9rem;
    }

    .ympyra {
        margin-top: 2rem;
    }

    nav.ohjaajaportaalivalikko {
        padding-right: 4em;
    }

    nav.ohjaajaportaalivalikko ul {
        padding: 1em 1.5em;
    }
}

@media screen and (max-width: 1300px) {
    .ohjaajaksi_osio_2 .solu4 {
        padding: 0 2rem;
    }

    .woocommerce-cart .solu.solu9 {
        width: 100%;
    }
}

@media screen and (max-width: 1200px) {
    article.yksi_tuote,
    .tuotteet .woocommerce ul.products li.product {
        width: calc(50% - 4rem);
    }

    .solu.solu_tuotekuva,
    .woocommerce div.product div.images.woocommerce-product-gallery {
        width: 30%;
    }
    
    .solu.solu_tuotedata,
    .woocommerce div.product div.summary {
        width: 70%;
    }

    .ensikuva h1, .ensikuva .solu > h1:first-child {
        margin-top: 6rem;
    }

    .wc-block-components-sidebar {
        font-size: 0.8em;
    }
}

@media screen and (min-width: 1001px) and (max-width: 1100px) {
    .ylapalkkihero.alasivu .paavalikko ul a {
        font-size: 0.9rem;
    }
}

@media screen and (min-width: 1001px) {
    .valikot.rivi {
        display: flex !important;
    }

    .page-id-298 .solu.solu8,
    .page-id-300 .solu.solu8 {
        margin-left: -2rem;
        margin-right: 2rem;
    }
}

@media screen and (max-width: 1000px) {
    h1 {
        font-size: 1.9rem;
    }

    h2 {
        font-size: 1.40rem;
    }

    .solu,
    .tuotteet {
        order: 1;
    }

    .solu6 {
        width: 100%;
        padding: 2rem 0;
    }

    .etusivu+.kehys img {
        margin: 0 auto;
        width: 400px;
        max-width: 80%;
    }

    .mobile_first {
        order: 0;
    }

    .etusivu+.kehys .solu6 {
        text-align: center;
    }
        
    .koulutuskalenteri_solu {
        width: 100% !important;
        padding: 0.5rem;
        text-align: center;
    }

    .koulutuskalenteri_rivi {
        display: block;
        padding: 2rem;
    }

    .koulutuskalenteri_solu.cta {
        text-align: center;
    }

    .alapalkki .solu4 {
        width: 100%;
        padding: 1rem 0;
    }

    .etusivu_osio_1 {
        margin-top: 5rem;
        margin-bottom: 4rem;
    }

    .etusivu_osio_2 {
        margin-bottom: 4rem;
    }

    .etusivu_osio_3 {
        margin-bottom: 6rem;
    }

    .etusivu_osio_4 {
        margin-bottom: 4rem;
    }

    .etusivu_osio_5 {
        margin-bottom: 6rem;
    }

    .etusivu_osio_6,
    .asiakaspalautteet {
        margin-bottom: 8rem;
    }
        
    nav.paavalikko {
        margin-bottom: 0;
    }

    .ylapalkkihero ul {
        display: flex;
        flex-direction: column;
        width: 100%;
        background: var(--keltainen);
        padding: 0 2rem;
        text-align: center;
        align-items: center;
        box-sizing: border-box;
    }

    .ylapalkkihero .kehys.fhd.rivi {
        padding: 0;
    }

    .ylapalkkihero ul a {
        color: var(--musta);
    }

    .ylapalkkihero .lisavalikko ul a {
        padding: 0.5rem 0;
        margin: 0;
        background: none !important;
    }

    .ylapalkkihero ul a {
        margin-right: 0;
        padding: 0.5rem 0;
        line-height: 1em;
    }

    .paavalikko ul {
        padding-top: 5rem;
    }

    .alasivu .paavalikko ul {
        padding-top: 8rem;
    }

    .lisavalikko ul {
        padding-bottom: 1rem;
    }

    .valikot.rivi {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        box-sizing: border-box;
        display: none;
        z-index: 10;
    }
    
    header.ylapalkkihero.etusivu {
        aspect-ratio: 1920 / 1800;
        background-size: 130% auto !important;
        background-position: center bottom !important;
    }
    
    .hero img {
        margin: 0;
    }
    
    .mobiilivalikko {
        display: block;
        width: 36px;
        height: 83px;
        padding: 22px 0;
        box-sizing: border-box;
        background: var(--punainen);
        z-index: 11;
        cursor: pointer;
        margin: 0 auto;
        position: relative;
    }
    
    .alasivu .mobiilivalikko {
        margin: 0;
    }

    .mobiilivalikko_viiva {
        display: block;
        width: 36px;
        height: 5px;
        margin: 6px 0;
        background: var(--keltainen);
        transition: 0.4s;
    }
    
    .avattu .mobiilivalikko_viiva.viiva1 {
        -webkit-transform: rotate(-45deg) translate(-7px, 7px);
        transform: rotate(-45deg) translate(-7px, 7px);
    }
    
    .avattu .mobiilivalikko_viiva.viiva2 {
        opacity: 0;
    }
    
    .avattu .mobiilivalikko_viiva.viiva3 {
        -webkit-transform: rotate(45deg) translate(-9px, -8px);
        transform: rotate(45deg) translate(-9px, -8px);
    }

    .avattu .mobiilivalikko_viiva {
        background: var(--musta);
    }
    
    .hero {
        height: calc(100% - 83px);
    }

    a.some {
        width: 50px;
        height: 50px;
        margin: 5px;
    }

    .ylapalkkihero.alasivu .kehys.fhd.rivi {
        padding: 20px;
        flex-direction: row;
        justify-content: center;
    }

    a.paalogo {
        margin-right: 5rem;
    }
    
    .alasivu .valikot.rivi {
        display: none;
        width: 100%;
        background: var(--keltainen);
    }

    .oletusmargin {
        margin-top: 4rem;
        margin-bottom: 4rem;
    }

    .lahetavinkki {
        margin: 5rem auto 1rem auto;
    }

    .karttaosio .solu > div {
        padding: 10rem 2rem;
        font-size: 1.5rem;
    }

    .solu12,
    .solu11,
    .solu10,
    .solu9 {
        width: 100%;
    }
    
    .solu8,
    .solu7,
    .solu6,
    .solu5 {
        width: 100%;
    }

    .solu4,
    .solu3 {
        width: calc(100% / 3);
    }

    .solu2,
    .solu1 {
        width: 25%;
    }

    .woocommerce-account .woocommerce {
        display: block;
    }

    .solu.solu4.ohjaajaportaalivalikko_wrapper {
        width: 100%;
        margin-bottom: 2em;
    }

    p.profiilinavigaatio {
        display: block;
    }

    nav.ohjaajaportaalivalikko {
        padding-right: 0;
    }

    nav.ohjaajaportaalivalikko ul {
        margin: 0 auto;
    }

    .solu6 img {
        width: 500px;
        max-width: 100%;
        margin: 0 auto;
        display: block;
    }

    .ohjaajaksi_osio_1 {
        margin-bottom: 8rem;
    }

    .ohjaajaksi_osio_2,
    .ohjaajaksi_osio_3 {
        margin-bottom: 9rem;
    }

    .ohjaajaksi_osio_2 .solu4 {
        width: 100%;
    }

    .ensikuva h1, .ensikuva .solu > h1:first-child {
        margin-top: 0rem;
    }

    .rivi.ensikuva {
        margin-bottom: 6rem;
    }

    .rajoitus_perus_vasen, .rajoitus_perus_oikea, .tunnit_osio_3 > .solu.solu6:first-child {
        padding-left: 0;
        padding-right: 0;
    }
        
    .ohjaajaksi_osio_1,
    .tunnit_osio_1,
    .tunnit_osio_3 {
        text-align: center;
    }

    form.tuote_osta {
        display: block;
    }

    form.tuote_osta select {
        width: 100%;
    }

    form.tuote_osta .wpcf7-form-control.wpcf7-submit.nappula {
        margin: 1rem 0 0 0;
    }

    .kehys {
        padding-left: 1.4rem;
        padding-right: 1.4rem;
    }

    .rivi .is-large.wc-block-cart .wc-block-components-sidebar {
        padding-left: 0;
    }
    
    .rivi .is-large.wc-block-cart .wc-block-cart__totals-title {
        padding-left: 0.5em;
        padding-right: 0.5em;
        padding-bottom: 1em;
    }
    
    .rivi .is-large .wc-block-components-sidebar .wc-block-components-panel,
    .rivi .is-large .wc-block-components-sidebar .wc-block-components-totals-coupon,
    .rivi .is-large .wc-block-components-sidebar .wc-block-components-totals-item {
        padding-left: 0;
        padding-right: 0;
    }

    .rivi table.wc-block-cart-items .wc-block-cart-items__header .wc-block-cart-items__header-image {
        width: 50px;
    }

    .woocommerce-cart .solu,
    .woocommerce-checkout .solu {
        text-align: left;
    }

    form.kayttajahallinta_kirjaudusisaan {
        margin-bottom: 2.5em !important;
    }
    
}

@media screen and (min-width: 801px) {
    img.maksubanneri_desktop {
        display: block;
    }
    
    img.maksubanneri_mobile {
        display: none;
    }
}

@media screen and (max-width: 800px) {
    img.maksubanneri_desktop {
        display: none;
    }
    
    img.maksubanneri_mobile {
        display: block;
    }

    .soittopyyntolomake {
        padding: 1em;
    }
}

@media screen and (max-width: 900px) and (min-width: 763px) {
    .rivi .wc-block-components-order-summary .wc-block-components-order-summary-item {
        display: flex;
        flex-direction: column;
        padding-bottom: 0.5em;
        border-bottom: 1px solid var(--musta) !important;
        margin-bottom: 0.5em;
    }
    
    .rivi .wc-block-components-order-summary .wc-block-components-order-summary-item__description {
        padding: 0;
    }
    
    .rivi .wc-block-components-order-summary .wc-block-components-order-summary-item__total-price {
        text-align: left !important;
    }
}

@media screen and (max-width: 900px) {
    .solu.solu_tuotekuva,
    .solu.solu_tuotedata,
    .woocommerce div.product div.images.woocommerce-product-gallery,
    .woocommerce div.product div.summary {
        width: 100%;
    }
    
    .solu.solu_tuotedata,
    .woocommerce div.product div.summary {
        padding-left: 0;
        padding-top: 3rem;
        text-align: center;
    }
    
    .solu.solu_tuotekuva img,
    .woocommerce div.product div.images.woocommerce-product-gallery img {
        width: 497px;
        max-width: 100%;
        margin: 0 auto;
    }
}

@media screen and (max-width: 763px) {
    .wp-block-woocommerce-checkout-order-summary-block {
        background: var(--keltainen);
        color: var(--musta);
    }
    
    .wp-block-woocommerce-checkout-order-summary-totals-block, .wc-block-components-totals-wrapper {
        border-color: var(--musta);
    }
    
    .rivi .wc-block-components-order-summary .wc-block-components-order-summary-item {
        border: 0 !important;
    }
}

@media screen and (max-width: 700px) {
    .rajoitus_perus_vasen,
    .rajoitus_perus_oikea {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .solu {
        text-align: center;
    }

    form.wpcf7-form.flex_left {
        justify-content: center;
    }

    .solu12,
    .solu11,
    .solu10,
    .solu9,
    .solu8,
    .solu7,
    .solu6,
    .solu5 {
        width: 100%;
    }
    
    
    .solu4,
    .solu3,
    .solu2,
    .solu1 {
        width: 50%;
    }
        
    article.yksi_tuote,
    .tuotteet .woocommerce ul.products li.product {
        width: 100%;
        margin: 2rem 0;
    }

    a.tuote_kuva {
        display: block;
        width: 403px;
        max-width: 80%;
        margin: 0 auto;
    }

    .woocommerce-error, .woocommerce-info, .woocommerce-message {
        flex-direction: column;
    }
    
    .woocommerce-page .woocommerce-message .button {
        margin-top: 1rem;
    }
}

@media screen and (max-width: 600px) {
    form.wpcf7-form > *,
    form.wpcf7-form > input {
        width: 100%;
    }

    .kaksirivissa {
        display: block;
    }
    
    .kaksirivissa > * {
        width: 100%;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .yhteistyokumppanit {
        max-width: calc(100% - 50px);
        margin-bottom: 25px;
        padding: 50px 25px;
    }

    .yhteistyokumppanit > * {
        width: calc(100% - 20px);
        margin: 10px;
    }
}

@media screen and (max-width: 400px) {
    a.paalogo {
        width: 50%;
    }

    .woocommerce-variation-add-to-cart.variations_button {
        display: block;
    }
    
    .woocommerce .quantity .qty {
        width: 100%;
    }
    
    .woocommerce div.product form.cart div.quantity {
        margin-right: 0;
    }
    
    .woocommerce div.product form.cart .button {
        float: none;
        margin-top: 1.25rem;
        width: 100%;
        box-sizing: border-box;
    }
}