@media print {    
	body { font-size: 0.7rem; }
	.onlyPrint { display: block; }

    /* Hide all the elements that are not needed for printing */
	details, details > * { display:none !important; }
	details { display:none; margin: 0 !important; }
	nav, body>p:last-of-type, body>hr:last-of-type 
		{ display:none; margin: 0; }

    img[src*="logos"] {
        width: 2cm;
        max-width: 2cm;
        height: auto;
    }

    @page {
      size: A4; /* DIN A4 standard, Europe */
    }

    html, body {
        width: 210mm;
        /* height: 297mm; */
        height: 282mm;
        font-size: 11pt;
        background: #FFF;
        overflow: visible;
    }

}

@media screen {    
	.onlyPrint { display: none !important; }
}

h1, h3, h4 {color:#0062c9;}

/* GitHub Adds the repository name as an H1. Remove. */
.markdown-body>*:first-child {
    display: none !important;
    margin: 0 !important;
}

/* Markdown automatically creates ID based on text.
   If you're putting your name remember to updates this  */

h1#diego-moore,
h1#name-surname {  
    font-size:1.4rem; 
    padding: 0 0 20px 0;
    /* Reduce letter spacing to avoid wrapping in print PDF. */
    letter-spacing: -1px;
    margin: 0 0 24px 0;}

h2 		{ font-size:1.3rem; color:#013f76; }
img 	{ margin-left:1rem; vertical-align:middle;}
ul  	{ list-style-type: circle;}

blockquote { font-style: italic}

/* strong is the author. Ident. */
blockquote strong { padding-left:2rem;}

/* Apply the CSS to JUST the first blockquote (the strapline) */
blockquote:not(blockquote ~ blockquote):not(:has(blockquote) ~ blockquote):not(blockquote blockquote):not(blockquote ~ * blockquote):not(:has(blockquote) ~ * blockquote) {
	float:right; 
    margin-top: 42px !important;
    color: #013f76 !important; 
    letter-spacing: -1px;
}
blockquote:not(blockquote ~ blockquote):not(:has(blockquote) ~ blockquote):not(blockquote blockquote):not(blockquote ~ * blockquote):not(:has(blockquote) ~ * blockquote) strong {padding-left: 0px;}

/* Add icon to all links */
p a:after {
	margin:0 2px 0 4px;
	background-image: url('../assets/icons/arrow-up-right-from-square-solid.svg');
    background-size: 8px 8px;
    display: inline-block;
    width: 8px; 
    height: 8px;
    content:"";
}
nav { text-align:right; float:right; margin-top:6px; }

/* removed link icons in NAV */ 
nav a:after { background-image:none; margin:0; width:0;}

details {
    border: 1px dashed silver;
    border-radius: 0.5rem;
    padding: 0 1rem;
    background-color:#f8f8f8;
}

details > summary {
    list-style-type: '▼ ';
    color:#0062c9;
}

details[open] > summary {
    list-style-type: '▲ ';
    color:#0062c9;
}

details[open] > summary { margin-bottom: 0.5rem;}

details blockquote { letter-spacing: normal; }

/* Default width for logos */ 
img[src*="logos"],
img[alt="ACME"] {
    width: 100%;
    max-width: 110px;
    height: auto;
    float: right;
}


/* Overrride specific image dimensions*/
img[alt=Profile-Picture] { max-width: 120px;  margin: 0px 20px 0 0; vertical-align:middle; }
img[alt=monks] 			{ max-width: 200px; float:right;}
img[alt=precedent], 
img[alt=parliament]		{ max-width:150px; }
img[alt=zemoga] 		{ max-width:125px; }
img[alt=compassion] 	{ max-width:120px; margin: -1rem 1rem -0.5rem 0; vertical-align:bottom; float: left;}

img[src*="key-clients/"]                { width:500px; }

img[src*="icons/svg"], img[src*="icons/32"]   { width:24px; margin:0 0.5rem 0.25rem 0.25rem;}

img[src*="icons/svg/roku.svg"] 		{ width:36px; }

img[src*="key-clients/the-unit.svg"],
img[src*="key-clients/precedent.svg"],
img[src*="key-clients/zemoga.svg"]      { width: 400px; }
img[src*="key-clients/eurekastep.svg"]  { width: 300px; }
img[src*="key-clients/eurekastep2.svg"] { width: 340px; }

h4 { margin:0.5rem 0 ; padding: 0.5rem 0; color: #666}

@media (min-width: 402px) {

    /* UL after the H4 will end up with two columns */
    h4 ~ ul {
        columns: 2;
        -webkit-columns: 2;
        -moz-columns: 2;
        margin-top: 0;
        padding-top: 0;
        column-gap: 30px;;
    }
}

@media print {
    h4 ~ ul {
      column-count: 2 !important;
      column-gap: 1rem;
      -webkit-column-count: 2 !important;
      -webkit-column-gap: 2rem;
      margin-top: 0;
      padding-top: 0;
    }
}

/* reset subsequent ULs to one column */
h2 + ul {
    columns: 1;
    -webkit-columns: 1;
    -moz-columns: 1;
    margin-top: 0;
    padding-top: 0;
}