/*   
Theme Name: LöylyMedia
Theme URI: http://loyly.fi
Description: Custom theme.
Author: Jukka Lariola
Author URI: 
Version: 2.3
*/

/*
Goldilocks Approach to Responsive Web Design Boilerplate

Author: Design by Front - @designbyfront
Version: 0.1
URL: http://www.goldilocksapproach.com
----------------------------------------------------------------------------------------

CONTENTS - GLOBAL.CSS
-----------------------------------------
1. RESET
2. ROOT
3. CORE TYPOGRAPHY
4. LINKS
5. GLOBAL LAYOUT & GLOBAL CUSTOM TYPOGRAPHY
6. CUSTOM LAYOUT & TYPOGRAPHY (Baby bear)
7. BROWSER AND NON-SEMANTIC STYLING

CONTENTS - LAYOUT.CSS
-----------------------------------------
8. CUSTOM LAYOUT & TYPOGRAPHY (Daddy bear)
9. CUSTOM LAYOUT & TYPOGRAPHY (Mummy bear)



*/


/* 1. RESET
----------------------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size:100%;
  font: inherit;
  vertical-align: baseline;
  }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
  }
  
  
/* 2. ROOT
----------------------------------------------------------------------------------------*/
html { 
  overflow-y: scroll;
  }

/* /ht Ethan Marcotte - http://front.ie/l8rJaA */
img, embed, object, video { max-width: 100%; height: auto;}
iframe { max-width: 100%;; }
.ie6 img.full, .ie6 object.full, .ie6 embed, .ie6 video { width: 100%; }


/* 3. CORE TYPOGRAPHY
----------------------------------------------------------------------------------------*/
body {
  font-family: 'Montserrat', sans-serif;
  font-size: 1em;
  font-display: swap;
  line-height: normal;
  color: #292929;
  background: #fff;
  min-width: 18em;
  font-weight: 300;
  }

h1, h2, h3, h4, h5, h6 {
  font-family: 'Montserrat', sans-serif;
  margin-bottom: 0.409em;
  line-height: 1em;
  font-weight: 800;
  font-display: swap;
  text-transform: uppercase;
  

  }

header h1 {
font-size: 350%;
font-weight: 800;
text-transform: uppercase;
letter-spacing: -0.03em;
}

h2 {
font-size: 250%;
}

h3 {
font-size: 145%;
}

h4 {
font-size: 118%;
}



p, ul, ol, dl, blockquote, .ld-video {
    font-size: 1em;
    line-height: 1.618em;
    margin-bottom: 1.618em; 
    /*max-width: 32em;*/ 
      }
    
ul { list-style-type: disc; margin-left: 1.618em; margin-bottom: 1em;}
ol { list-style-type: decimal; margin-left: 1.618em; margin-bottom: 1em; }
nav ul, nav ol, footer .menu, ul.references_list { list-style: none; margin: 0; padding: 0;}

li { margin-bottom: 0.5em; }

b, strong { font-weight: 800; }
i, em { font-style: italic; }
small { font-size: 80%; }


/* 4. LINKS
----------------------------------------------------------------------------------------*/
a, a:visited { outline: none; text-decoration: underline;  color: #292929;}  
a:hover { outline: none; text-decoration:none;  }  
a:active, a:focus { outline: none; }


/* 5. GLOBAL LAYOUT & GLOBAL CUSTOM TYPOGRAPHY
----------------------------------------------------------------------------------------*/

header#header {  height: 130px; background: #EAECEF; margin-bottom: 40px; }
	header#header p { font-size: 1.3em; text-align: center; margin: 4em auto 1.618em auto;}
	header#header p.scrolldown { opacity: 0.8; font-size: 0.8em; margin-top: 2em; }
	header#header h1 { margin-top: 5em; }
	header#header .container { padding-top: 0.5em; }


footer {  margin-top: 4em; padding: 4em 0 8em 0; background: #4b5057; }
	footer p { font-size: 0.8em; color: #EAECEF; width: 100% !important; max-width: 100%;}
	footer h4 { color: #fff; padding-bottom: 0.2em; border-bottom: 1px solid #aaa; }
	footer .column h4 { text-align: left; }
	footer a { color: #fff !important; }
	footer .companyinfo { margin: 0 auto; text-align: center; }	
	footer .companyinfo img { width: 70px; }


.logo { display: block; padding: 0; width: 350px; height: 70px;;  z-index: 999; }
header .logo	{position: absolute; top:3.5em; left: 1.618em; max-width: 80%;}
	.logo a { font: 0/0 a; display: block; padding: 0; width: 350px; height: 70px; background: no-repeat url('images/akatemia_logo.svg'); background-size: contain; }


.alignleft { float: left; margin: 0 1em 1em 0; }
.alignright { float: right; margin: 0 0 1em 1em; }

	
.mobilemenulink	{ float: right; margin:0 1em 1em 1em; }
	a.mobilemenulink  { color: #333; }
	
.top_link	{ text-align: center; margin: 4em 0; }
	.top_link a { text-decoration: none; color: #4b5057; }


	
a.button { padding: 0.7em 1em 0.5em 1em; text-decoration: none; font-size: 1em; background: #EAECEF; color: #3E4147; text-transform: uppercase; font-weight: 300; text-align: center; }	

.strikethrough { text-decoration: line-through; color: #999; }



ol.top3 { text-transform: uppercase; font-size: 0.8em;}
	ol.top3 li { margin-bottom: 1.2em; } 	



ul.references_list { width: auto; max-width: 100%; }
	.references_list li { margin: 4em 0 6em 0; }
	.references_list h4 { text-align: left;  }
	ul.references_list .videometa span{ text-transform: uppercase; font-size: 0.8em; font-weight: 800; color: #555; }

	
ul.wc-tabs { display: none; }

.single_add_to_cart_button, .checkout-button { background: #CC4425 !important; }	

.learndash-wrapper { padding-bottom: 2em; }
.ld-lesson-topic-list { margin: 3.5em 0; }
.learndash-wrapper .ld-content-actions { padding: 2em 0 !important; }
.learndash-wrapper .ld-content-actions .ld-content-action .ld-course-step-back { line-height: 3em;}
.ld-tabs-content { margin: 3em 0; }
.ld-lesson-status { margin: 3em 0;}

figure.wp-block-image.size-large {
  margin: 1em 0 3em 0;
}
figure.wp-block-image.size-large img {
  margin-bottom: 1.618em;
}

/* 6. CUSTOM LAYOUT & TYPOGRAPHY (Baby bear)
----------------------------------------------------------------------------------------*/
.container {
    padding: 2em 0.4em 1em 0.4em;
    width: auto;
    margin: auto;
    position: relative;
  }



.column {
	float: none;
	margin: 0 auto;
	padding: 0 1.618em 5.2em 1.618em;
}


.navigation h3 { padding: 1em 0; text-align: center;   margin: 3em 0 1em 0; font-weight: 400; color: #4E4E50; font-size: 1.6em; }


.navigation #menu ul  { display: block; margin: 0 -0.4em; border-top: 1px solid #4E4E50; max-width: none; width: auto; padding: 0;}

	.navigation #menu ul li { margin: 0;  }
	.navigation #menu ul li a { display: block; border-bottom: 1px solid #4E4E50; color: #4b5057; padding: 1.6em 0 1.3em 0; text-align: center;  text-transform: uppercase; text-decoration: none;  }
	
nav#nav.navigation .container { padding-top:6em; }
	



/* 7. BROWSER AND NON-SEMANTIC STYLING
----------------------------------------------------------------------------------------*/
.cf:before, .cf:after { content: ""; display: block; }
.cf:after { clear: both; }
.ie6 .cf { zoom: 1 }



/* Print styles!
-------------------------------------------------------------------------------*/
@media print {

}