@charset "UTF-8";

@import url('https://fonts.googleapis.com/css?family=Nunito:400,400i,700');




/* RESET! */

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,code,del,dfn,em,img,q,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,*{border:0;font-family:inherit;font-size:100%;font-style:inherit;font-weight:inherit;margin:0;padding:0;vertical-align:baseline;}




/* BOXSIZING! */

article,aside,details,figcaption,figure,footer,header,main,nav,section,summary{display:block;}*,*:after,*:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}




/* HTML! */

html {
  background: #fff ;
  color: #333;
  overflow-y: scroll;
  cursor: default;
  position: relative;
  min-height: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0,0,0,.25);
}




/* RAINBOWS! */

html:before {
  position: absolute;
  content: '';
  height: .375em;
  top: 0;
  left: 0;
  right: 0;
  background: linear-gradient(90deg, #e74c3c, #e67e22, #FFFF00, #2ecc71, #3498db, #9b59b6, #8A4117, #0C090A);
}

html:after{
  position: absolute;
  content: '';
  height: 1em;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(90deg, #0C090A, #8A4117, #9b59b6, #3498db, #2ecc71, #FFFF00, #e67e22, #e74c3c);
}




/* RESIZE! */

@media(min-width:40em){html {font-size:1.125em}}
@media(min-width:85em){html {font-size:1.25em}}




/* BODY! */

body {
  font: normal 400 1em/1.5 Nunito,sans-serif;
  position: relative;
  margin:0 auto;
  min-width:20em;
  max-width:37.5em;
  padding:3em 1.5em;
}




/* HEADER! */

@media(max-width:35em){header{background:#eee;padding:1em .125em;border-radius: .25em;}}




/* LANGCHOOSER! */

.langchooser{
  position:absolute;
  top:.375em;
  right:2em;
  font-size:1em;
  width:5em;}

  .langchooser a{border:none;color: transparent;
    padding:1em .25em 1em;}
    
    .langchooser a:active{color: transparent;}
  
  .langchooser ul{list-style-type: none;display: flex;justify-content: space-between;flex-wrap: nowrap;width:5em;}

  .lang { background:rgba(0,0,0,.125);
    margin-right:.5em;border-bottom-left-radius:.25em;border-bottom-right-radius:.25em; }
  .lang-on{border-bottom:solid .25em #0d0;}
.fr-lang {background-image: url(/images/home/fr.jpg); background-size: cover;}
.en-lang {background-image: url(/images/home/en.jpg);  background-size: cover;}

@media(min-width:64em){
  .langchooser{right:-6em;}
  .langchooser ul{margin-right:0;}
}




/* NAV! */

.gwenn-home{text-align:center;margin:0 0 .75em;}
.gwenn-home a{border:0;font-size:2em;}

@media(min-width:35em){
 nav{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin:1.5em auto ;
  line-height:1em;
  align-items:baseline;
  font-size: .875em;}

 .gwenn-home a{font-size:1.375em;}
}

@media(min-width:64em){
  .gwenn-home a{font-size:1.375em;}
 }

.menu {
  text-align: center;
}

.menu li {
  display: inline-block;
}

.menu li:not(:last-child)::after {
  content: "\00a0-";
  display: inline-block;
  color: rgba(0,0,0,.125);
}

.menu a {
  border-bottom: 0;
}

.menu a.urhere {
  border-bottom: .125em solid #0d0;
}

nav a {color:#333 !important;}

@media(max-width:35em){.menu{font-size:.875em;}}




/* LINKS! */

a {border:none;
  color:#0bb;
  text-decoration: none;
  outline:none;
}
a:active {
  color:#333;
}
a:visited {
  color:#008e8e;
}




/* MAIN! */
main{margin:3em 0;}




/* TYPOGRAPHY! */

p{line-height: 1.5;margin:0 0 1.5em;}

i, em {font-style: italic;}

b, strong {font-weight: 700;}

sup{font-size:.5em;position:relative;top:-.75em;padding-left:.25em;}




/* LISTS! */

main ul,main ol{padding-left: 1em;margin-bottom:1.5em;}
main ul li, main ol li{margin-bottom:1em;}




/* HEADINGS! */

h1,h2,h3,h4,h5,h6 {font-weight: 700;color:#000;}

h1 {
  font-size: 1.75em;
  margin:0 0 .75em;
  line-height: 1.125;
}

h1.hello {
  text-align: center;
  font-size: 1.75em;
  margin:1.5em 0;
  margin-bottom:1.825em;
}
@media(min-width:48em){h1.hello {font-size: 2.25em}}

h2 {
  font-size: 1.75em;
  line-height: 1.25em;
}

h3 {
  font-size: 1.5em;
  line-height: 1.25;
  margin:0 0 .875em;
}

h4 {
  font-size: 1.325em;
  line-height: 1.25em;
  margin:.75em 0;
}

h5 { font-size: 1.25em;
  line-height: 1.25em;
  margin:.75em 0 1em;}

h6 { font-size: 1.125em;
  line-height: 1.25em;
  margin:1.5em 0 .375em;}

h1 small,
h2 small,
h3 small,
h4 small,
h5 small{font-size:medium;color:#aaa;}




/* HEADLINE! under centered text on main page */
.headline{color:#888;font-size: 1em;text-align: center;max-width:23em;margin:-3em auto 4.5em}
.headline span{white-space: nowrap;}




/* BLOCKQUOTE! */
blockquote{margin:3em 1.5em;}
blockquote p{font-weight: bold;font-size:1.25em;}
blockquote .author{text-align: right;font-weight:normal;font-size:1em;}




/* BOX! */
.box{margin:3em 0;background:#eee;border-radius:.25em;padding:1.5em;}
@media(min-width:35em){.box{margin:3em 1.5em;}}
.author{text-align: right;}
.centered{text-align: center;}




/* YELLOW BOX! */
.yellow-box{margin:3em 0;border-radius:.25em;padding:1.5em; border:solid 1em rgb(252, 235, 5);}
@media(min-width:35em){.box{margin:3em 1.5em;}}
.centered{text-align: center;}




/* TRANSCRIPT BOX! */
.transcript-box{margin:3em 0;border-radius:.25em;padding:1.5em; border:solid .5em #eee;}




/* INDENT! */
.indent{margin:3em 1.5em;}




/* HORIZONTAL RULES! */

hr {
  font-size: 1.25em;
  height: 1.5rem;
  text-align: center;
  margin: 3em auto;
  max-width:13em;
}

hr::before {
  content: "";
  position: relative;
  display: block;
  background: currentColor;
  height: .125em;
  top: calc(50% + 1px);
}

hr::after {
  content: " - -- -- - -- ---- -- - --- -- - - ";
  background: #fff;
  position: relative;
  padding: 0 .5rem;
  top: -.25rem;
}




/* IMAGE! + FIGURE! */

img {
border-style: none;
width:auto;
max-width:100% !important;
height:auto;}

img.border{border:solid .063em #333;}

figure{max-width:100%;margin:0 0 3em;}
figure.inny{max-width:21em;margin:0 auto 3em;}
figure.inny figcaption {margin:.75em 0 2em;}

@media(min-width:48em){
figure{max-width:37.5em;margin:0 -1.5em 3em;}
figure.west {width:16.5em;float:left;margin:0 1.5em 1.5em -1.5em;}
figure.east {width:16.5em;float:right;margin:0 -1.5em 1.5em 1.5em;}
}

figcaption {
font-size: .75em;
line-height: 1.25;
color:#888;
margin: .75em 0 3em;}

figcaption i{color:#333;font-size:1.25em;}

@media(min-width:48em){
  figcaption{margin: .75em 2em 1.5em;}
  figure.west>figcaption{margin: .75em 0 0 2em;}
  figure.east figcaption{margin: .75em 2em 0 0;}
}




/* FOOTER! */

footer { margin: 5em 0 1.5em;}

footer p {
  text-align: center;
  font-size: .75em;
  color:rgba(0,0,0,.25);
}




/* ARTICLE! */

article {margin:0;}




/* SECTION! */
section {margin:0 0 4.5em;}
section:after {
  content: "";
  display: table;
  clear: both;
}




/* PRICE-TAG! */
.price-tag{text-align:right;margin:0 0 3em;}
.price-tag a{background:#0bb;color:#fff;padding:.75em 1em;border-radius:.25em;}




/* SHOP-BUTTON! */
.shop-button{text-align:center;margin:0 0 3em;}
.shop-button a{background:#0bb;color:#fff;padding:.75em 1em;border-radius:.25em;}




/* RED-BUTTON! */
.red-button{text-align:center;margin:0 0 3em;}
.red-button a{background:rgb(223, 65, 54);color:#fff;padding:.75em 1em;border-radius:.25em;}




/* RAINBOW-BUTTON! */
.rainbow-button{text-align:center;margin:0 0 3em;}
.rainbow-button a{  background: linear-gradient(90deg, #2ecc71, #3498db, #9b59b6,#f35746, #e6a122);color:#fff;padding:.75em 1em;border-radius:.25em;}




/* PRINTS! */
.prints{text-align:right;margin:0 0 3em;}
.prints a{background:rgb(184, 241, 241);color:rgb(109, 109, 109);padding:.75em 1em;border-radius:.25em;}




/* ARTWORK-SHOWCASE! */
.artwork-showcase{
  display:grid;
  grid-gap:0 .75em;
grid-template-columns: 1fr 1fr; }

.awFR,
.awEF,
.awABC,
.awEM,
.awCAN{grid-column: 1/3}

@media(min-width:48em){
  .artwork-showcase {margin:0 -1.5em 3em;}
}
  .artwork-showcase div{position: relative;margin:0 0 1.5em;}
  .artwork-showcase span{position: absolute;bottom:1em;left:.5em;color:rgb(0, 0, 0);background:rgba(255, 255, 255, 0.65);padding:.5em .75em;border-radius: .25em;}

@media(max-width:40em){
  .artwork-showcase span{padding:.125em .5em}
}




/* ARTWORK-GRID! */

.artwork-grid {
  margin:0 0 3em;
  columns: 2;
  column-gap: .5em;
}

@media(min-width:48em){
.artwork-grid {
  margin:0 -1.5em 3em;
  columns: 3;}
}

  .artwork-grid div {position: relative;margin:0 0 .625em;}
  .artwork-grid span {position: absolute;bottom: 1em;left:.5em;color:#fff;background:rgba(0,0,0,.5);padding:.5em .75em;border-radius: .25em;}


  

/* SHOP-GRID! */

.shop-grid { margin:0 0 3em;}
.shop-grid div {position: relative;}
.shop-grid span {position: absolute;bottom: .9em;left:0;color:#fff;background:rgba(1, 148, 148, 0.65);padding:.5em .75em;text-align: center;width:100%;}

.shop-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: .375em .75em;
}

@media(min-width:48em){.shop-grid {margin:0 -1.5em 3em;}}




/* SHOP-AVAILABLE-ART! */

.shop-available-art {
  margin:0 0 3em;
  columns: 2;
  column-gap: .5em;
}

@media(min-width:48em){
.shop-available-art {
  margin:0 -1.5em 3em;
  columns: 3;}
}

  .shop-available-art div {position: relative;}
  .shop-available-art span {position: absolute;bottom: 1em;right:.5em;color:#250;background:#fff;padding:.25em .5em;border-radius: .25em;font-size:.75em;border:solid .125em #250;font-weight:bold;}

  


/* SHOW-GRID! */

.show-grid {
  margin:1.5em 0;
}

@media(min-width:64em){
.show-grid {
  display: grid;
  grid-template-columns: 10.5em 10.5em 10.5em 10.5em;
  grid-template-rows: auto;
  grid-gap: 1.5em;
  align-items: center;
  margin:0 0 3em -6em;}
}




/* BLOG! */

.blog-list{margin:0;padding:0;list-style:none;}

.blog-list li{
  margin:0;
  padding:.25em 0;
  display:grid;
  grid-gap:0;
  grid-template-columns: 3.625em 1fr;
}

.blog-list li span{grid-column: 1/2;}
.blog-list li a{grid-column: 2/3;}

.blog-list li:hover {background: #eee;}
.blog-list li span{color:#888; }
.blog-list li span:after{content:" -";color:#ddd;}


.blog-date {color:#aaa; margin:1.5em 0 3em;font-size:small;}


.cta{ margin:0 0 3em;}

.cta div{padding:.25em 1em;border-radius: .25em;margin:0 0 1.5em;}

.cta-email{background:rgb(67, 7, 207)}
.cta-inbox{background:rgb(2, 143, 231);}
.cta-support{background:rgb(0, 187, 187);}
.cta-live{background:linear-gradient(90deg, #2ecc71, #3498db, #9b59b6,#f35746, #e6a122);color:#fff}

.cta p{font-size:.875em;}

.cta h5,
.cta p {color:rgb(255, 255, 255);}

.cta-email .button{padding:.5em;border-radius: .25em;background:rgba(255,255,255,.8);color:rgb(67, 7, 207);text-align:center;margin: 0 auto;display:block;width:11em;}

.cta-inbox .button{padding:.5em;border-radius: .25em;background:rgba(255,255,255,.8);color:rgb(2, 143, 231);text-align:center;margin: 0 auto;display:block;width:11em;}

.cta-support .button{padding:.5em;border-radius:.25em;background:rgba(255,255,255,.8);color:rgb(0, 187, 187);text-align:center;margin: 0 auto;display: block;width:11em;}

.cta-live .button{padding:.5em;border-radius:.25em;background:rgba(255,255,255,.8);color:rgb(155, 89, 182);text-align:center;margin: 0 auto;display: block;width:11em;}

@media(min-width:40em){

.cta div{margin:0;}

.cta{
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap:1.5em;
}
.cta-email{
  grid-column: 1/3;
}
.cta-live{
  grid-column: 1/3;
}
}



/* RESUME! */

@media(min-width:40em){.resume ul{font-size:.75em;list-style: none;}}



/* CV! */

dl {
  display:grid;
  grid-gap:0;
  grid-template-columns: 3.5em 1fr ;
}




/* iFRAME! */

iframe{width:100%;margin:0 0 1.5em;}




/* CONTACT-BOXES! */
.contact-boxes{
  margin:0 0 3em;}
.contact-boxes div {background:rgb(2, 143, 231);padding:.25em 1em;border-radius: .25em;margin:0 0 1.5em;}
.contact-boxes div,.contact-boxes h4{color:rgb(255, 255, 255);}
.contact-boxes div:first-child {margin-left:0;background:rgb(67, 7, 207);}
.contact-boxes div:first-child .button {background:rgba(255,255,255,.8);color:rgb(67, 7, 207);}
.contact-boxes div:last-child {margin-right:0;background:rgb(0, 187, 187);}
.contact-boxes div:last-child .button {background:rgba(255,255,255,.8);color:rgb(0, 187, 187);}
.contact-boxes .button{padding:.5em;border-radius: .25em;background:rgba(255,255,255,.8);color:rgb(2, 143, 231);text-align:center;margin: 0 auto;display: block;width:11em;}

@media(min-width:48em){
  .contact-boxes{
    margin:0 -1.5em 3em;
    display: flex;}  
  .contact-boxes div {margin:0 .5em;width:33.333%;}
  .contact-boxes p{font-size: .875em;}
}




/* GUIDE-BOXES! */
.guide-boxes{
  margin:0 0 3em;}
.guide-boxes div {background:rgb(206, 11, 118);padding:.25em 1em;border-radius: .25em;margin:0 0 1.5em;}
.guide-boxes div,.guide-boxes h4{color:rgb(255, 255, 255);}
.guide-boxes div:first-child {margin-left:0;background:rgb(97, 6, 201);}
.guide-boxes div:first-child .button {background:rgba(255,255,255,.8);color:rgb(97, 6, 201);}
.guide-boxes div:last-child {margin-right:0;background:rgb(223, 65, 54);}
.guide-boxes div:last-child .button {background:rgba(255,255,255,.8);color:rgb(223, 65, 54);}
.guide-boxes .button{padding:.5em;border-radius: .25em;background:rgba(255,255,255,.8);color:rgb(206, 11, 118);text-align:center;margin: 0 auto;display: block;width:11em;}

@media(min-width:48em){
  .guide-boxes{
    margin:0 -1.5em 3em;
    display: flex;}  
  .guide-boxes div {margin:0 .5em;width:33.333%;}
  .guide-boxes p{font-size: .875em;}
}




/* DONATE! */

.donate-buttons{margin:0 auto;text-align: center;}

.social-media-icons{text-align: center;}




/* DEV! */

html- {background: url(grid.png) center repeat-y;font-size: 1em;}