/* CSS RESET --> in 'all.css' is een kleine CSS reset opgenomen die je naar eigen voorkeur kunt aanvullen of uitkleden */

/* BLOKJES --> Elk blokje (article) heeft een ID, die je kunt gebruiken als "namespace" om CSS alleen voor dat blokje te laten gelden */


/***********/
/* VLAGGEN */
/***********/


/****************/
/* ID = vlaggen */
/****************/
#vlaggen {
   display:flex;
   flex-direction:column;
   justify-content:center;
   align-items:stretch;
}

#vlaggen h2 {
   margin:0;
   font-size:1.25em;
   line-height:1em;
   text-align:center;
}
#vlaggen p {
   margin:0 0 .5em;
   font-size:1em;
   text-align:center;
}
#vlaggen ul {
   padding:0;
   list-style:none;

   display:grid;
   grid-template-columns:repeat(4, 2.5em);
   grid-template-rows:repeat(4, 2.5em);
   justify-content:center;
   grid-gap:.125em;
}

#vlaggen li {
   font-size:2.5em;
   line-height:1em;
}


/****************/
/* ID = nigeria */
/****************/
#nigeria {
   background:ForestGreen;
   padding:0;
}

#nigeria div {
	float:left;
	height:100%;
	width:calc(100% /3);
	margin-left:calc(100% /3);
	background-color:white;
}


/******************/
/* ID = nederland */
/******************/
#nederland div {
	position:absolute;
	left:0; right:0;
}

#nederland div:first-child {
	top:0; bottom:calc(100% /3 * 2);
	background-color:Crimson;
}

#nederland div:last-child {
	top:calc(100% /3 * 2); bottom:0;
	background-color:DodgerBlue;
}


/***************/
/* ID = guinea */
/***************/
#guinea div {
   position:absolute;
   left:calc(100% / 3); right:calc(100% / 3);
   top:0; bottom:0;
   background-color:Gold;
}

#guinea div::before,
#guinea div::after{
   content:"";
   position:absolute;
   width:100%; height:100%;
   top:0;
}
#guinea div::before {
   right:100%;
   background-color:crimson;
}
#guinea div::after{
   left:100%;
   background-color:forestgreen;
}


/**************/
/* ID = congo */
/**************/
#congo {
   overflow:hidden;
}

#congo div {
   position:absolute;
   left:calc(100% / 3); right:calc(100% / 3);
   top:-18.6%; bottom:-18.6%;
   background-color:gold;

   transform: rotate(31.3deg);
}

#congo div::before,
#congo div::after{
   content:"";
   position:absolute;
   width:155.8%; height:100%;
   top:0;
}
#congo div::before {
   right:100%;
   background-color:crimson;
}
#congo div::after{
   left:100%;
   background-color:forestgreen;
}


/***************/
/* ID = zweden */
/***************/
#zweden {
	background-color:DodgerBlue;
}

#zweden div {
	position:absolute;
	background-color:Gold;
}
	
#zweden div:first-child {
   left:0; right:0;
   top:40%; bottom:40%
}

#zweden div:last-child {
   left:30%; right:50%;
   top:0; bottom:0;
}


/******************/
/* ID = noorwegen */
/******************/
#noorwegen {
	background-color:Crimson;
}

#noorwegen div {
	position:absolute;
}
	
#noorwegen div:nth-of-type(1) {
   left:0; right:0;
   top:36%; bottom:36%;
   background-color:white;
}

#noorwegen div:nth-of-type(2) {
   left:26%; right:46%;
   top:0; bottom:0;
   background-color:white;
}

#noorwegen div:nth-of-type(3) {
   left:0; right:0;
   top:40%; bottom:40%;
   background-color:rgb(0,51,102);
}

#noorwegen div:nth-of-type(4) {
   left:30%; right:50%;
   top:0; bottom:0;
   background-color:rgb(0,51,102);
}


/*****************/
/* ID = botswana */
/*****************/
#botswana {
	background-color:DodgerBlue;
}

#botswana div {
   position:absolute;
   left:0; right:0;
   top:36%; bottom:36%;
   background-color:white;
}

#botswana div::after {
   content:"";
   position:absolute;
   left:0; right:0;
   top:14.28571429%; bottom:14.28571429%;
   background-color:black;
}


/****************/
/* ID = ijsland */
/****************/
#ijsland {
	background-color:rgb(0,51,102);
}

#ijsland *, #ijsland *::before, #ijsland *::after {
   position:absolute;
}

#ijsland div:first-child {
   left:26%; right:46%;
   top:0%; bottom:0%;
   background-color:white;
}

#ijsland div:last-child {
   left:0; right:0;
   top:36%; bottom:36%;
   background-color:white;
}

#ijsland div:last-child::before,
#ijsland div:last-child::after {
	content:"";
	left:0; right:0;
	top:14.28571429%; bottom:14.28571429%;
	background-color:Crimson;
}

#ijsland div:last-child::before {
	transform:rotate(90deg) translateY(50%);
}


/********************/
/* ID = zwitserland */
/********************/
#zwitserland {
	background-color:Crimson;
}

#zwitserland div {
	position:absolute;
	background-color:white;
}
	
#zwitserland div:first-child,
#zwitserland div:last-child{
   left:40%; right:40%;
   top:20%; bottom:20%;
}

#zwitserland div:last-child {
	transform:rotate(90deg);
}


/****************/
/* ID = georgie */
/****************/
#georgie {
	background-color:white;
}

#georgie div {
	position:absolute;
}

#georgie div::before,
#georgie div::after{
   content:"";
   position:absolute;
   left:0%; right:0;
   top:40%; bottom:40%;
   background-color:crimson;
}
#georgie div::after {
	transform:rotate(90deg);
}

#georgie div:nth-of-type(1) {
   width:100%; height:100%;
   left:0; top:0;
}
#georgie div:nth-of-type(2) {
   width:15%; height:15%;
   left:12.5%; top:12.5%;
}
#georgie div:nth-of-type(3) {
   width:15%; height:15%;
   right:12.5%; top:12.5%;
}
#georgie div:nth-of-type(4) {
   width:15%; height:15%;
   right:12.5%; bottom:12.5%;
}
#georgie div:nth-of-type(5) {
   width:15%; height:15%;
   left:12.5%; bottom:12.5%;
}


/******************/
/* ID = schotland */
/******************/
#schotland {
   background-color:rgb(0,51,102);
   overflow:hidden;
}

#schotland div {
   position:absolute;
   left:-21%; right:-21%;
   top:40%; bottom:40%;
   background-color:white;
}
	
#schotland div:first-child {
	transform:rotate(45deg);
}

#schotland div:last-child {
	transform:rotate(315deg);
}


/****************/
/* ID = bahamas */
/****************/
#bahamas {
	background-color:DodgerBlue;
}

#bahamas :first-child {
   position:absolute;
   left:0; right:0;
   top:calc(100% / 3); bottom:calc(100% / 3);
   background-color:Gold;
}

#bahamas :last-child {
   position:absolute;
   width:70.71067811865476%; height:70.71067811865476%;
   top:50%; left:0;
   background-color:black;

   transform:translate(-50%, -50%) rotate(45deg);	
}


/****************/
/* ID = koeweit */
/****************/
#koeweit {
   background-color:Crimson;
   overflow:hidden;
}

#koeweit div:nth-of-type(1) {
   position:absolute;
   left:0; right:0;
   top:0; bottom:calc(100% / 3 * 2);
   background-color:ForestGreen;
}

#koeweit div:nth-of-type(2) {
   position:absolute;
   width:70.71067811865476%; height:70.71067811865476%;
   top:50%; left:0;
   background-color:black;

   transform:translate(-50%, -50%) rotate(45deg);	
}

#koeweit div:nth-of-type(3) {
	position:absolute;
	left:calc(100% / 3); right:0;
	top:calc(100% / 3); bottom:calc(100% / 3);
	background-color:white;
}


/****************/
/* ID = jamaica */
/****************/
#jamaica {
	background-color:ForestGreen;
	overflow:hidden;
}

#jamaica div {
	position:absolute;
	width:100%; height:100%;
	background-color:Gold;
	transform:rotate(45deg);
}

#jamaica div:first-child {
	top:0;
	left:calc(-70.71067811865476% + 28.2842712474619%/2);
}

#jamaica div:last-child {
	top:0;
	right:calc(-70.71067811865476% + 28.2842712474619%/2);
}

#jamaica div::after {
   content:"";
   position:absolute;
   left:20%; right:20%;
   top:20%; bottom:20%;
   background-color:black;
}


/***********/
/* ID = uk */
/***********/
#uk {
   background-color:rgb(0,51,102);
   overflow:hidden;
}

#uk div {
	position:absolute;
}

/* het rechte kruis */	
#uk div:nth-of-type(5),
#uk div:nth-of-type(6){
   left:36%; right:36%;
   top:0; bottom:0;	
   background-color:white;
}

#uk div:nth-of-type(7),
#uk div:nth-of-type(8){
   left:40%; right:40%;
   top:0; bottom:0;
   background-color:Crimson;
}

#uk div:nth-of-type(6),
#uk div:nth-of-type(8) {
	transform:rotate(90deg);
}

/* de schuine strepen */	
#uk div:nth-of-type(-n+4) {
   left:40%; right:40%;
   top:-20.7%; bottom:50%;
   background-color:white;

   transform-origin:center bottom;
}

#uk div:nth-of-type(-n+4)::after {
   content:"";
   position:absolute;
   left:calc(100% /6); right:50%;
   top:0; bottom:0;
   background-color:crimson;   
}

#uk div:nth-of-type(1) {
	transform:rotate(45deg);
}

#uk div:nth-of-type(2) {
	transform:rotate(135deg);
}

#uk div:nth-of-type(3) {
	transform:rotate(225deg);
}

#uk div:nth-of-type(4) {
	transform:rotate(315deg);
}


/*******************/
/* ID = seychellen */
/*******************/
#seychellen {
	background-color:rgb(0,51,102);
	overflow:hidden;
}

#seychellen div {
	position:absolute;
	width:141.4213562373095%; height:141.4213562373095%;
	left:0; bottom:0;
	transform-origin:left bottom;
}

#seychellen div:nth-of-type(1) {
	background-color:Gold;
	transform:rotate(22deg);
}

#seychellen div:nth-of-type(2) {
	background-color:Crimson;
	transform:rotate(44deg);
}

#seychellen div:nth-of-type(3) {
	background-color:white;
	transform:rotate(66deg);
}

#seychellen div:nth-of-type(4) {
	background-color:ForestGreen;
	transform:rotate(78deg);
}


/***************/
/* ID = guyana */
/***************/
/* nb. cas/sos/toa en pythagoras als je het netjes wilt doen */
#guyana {
	background-color:ForestGreen;
	overflow:hidden;
}

#guyana div {
    position:absolute;
	top:50%; left:0;
}

#guyana :first-child {
	width:106.0660171779830%; height:106.0660171779830%;
	background-color:white;
	transform:translate(-50%, -50%) rotate(-45deg) skew(18.43494882292201deg, 18.43494882292201deg);
}

#guyana :last-child {
	width:70.710678118655%; height:70.710678118655%;
	background-color:black;
	transform:translate(-50%, -50%) rotate(-45deg);
}

#guyana div::before {
   content:"";
   position:absolute;
   left:9.4%; right:9.4%;
   top:9.4%; bottom:9.4%;
   background-color:crimson;
}

#guyana :first-child::before {
   left:6.65%; right:6.65%;
   top:6.65%; bottom:6.65%;
   background-color:gold;
}


/********************/
/* ID = zuid-afrika */
/********************/
#zuid-afrika {
	background-image:linear-gradient(crimson 50%, rgb(0,51,102) 50%);
	overflow:hidden;
}

#zuid-afrika :first-child,
#zuid-afrika :last-child {
   position:absolute;
   left:0; top:50%;
   transform:translate(-50%, -50%) rotate(45deg);
}
#zuid-afrika :first-child {
	width:104.04401145198800%; height:104.04401145198800%;
	background-color:white;
}
#zuid-afrika :last-child {
	width:50.7106781186547%; height:50.7106781186547%;
	background-color:gold;
}

#zuid-afrika :first-child::before,
#zuid-afrika :last-child::before{
   content:"";
   position:absolute;
}
#zuid-afrika :first-child::before {
   left:6.40754482034081%; right:6.40754482034081%;
   top:6.40754482034081%; bottom:6.40754482034081%;
   background-color:forestgreen;
}
#zuid-afrika :last-child::before {
   left:13.1464750896601%; right:13.1464750896601%;
   top:13.1464750896601%; bottom:13.1464750896601%;
   background-color:black;
}

#zuid-afrika :nth-child(2) {
   position:absolute;
   left:54.142135623731%; right:0;
   top:33.33333333333330%; bottom:33.33333333333330%;
   background-color:white;
}

#zuid-afrika :nth-child(2)::before {
   content:"";
   position:absolute;
   left:-5%; right:0;
   top:20%; bottom:20%;
   background-color:forestgreen;
}


/******************/
/* ID = maladiven */
/******************/
#maladiven {
	background:Crimson;
}

#maladiven div{
   position:absolute;
   left:20%; right:20%;
   top:20%; bottom:20%;
   background-color:ForestGreen;
   overflow:hidden;
}

#maladiven div::before,
#maladiven div::after {
   content:"";
   position:absolute;
   width:83.33333333333335%;height:83.33333333333335%;
   top:50%;
   border-radius:50%;
   transform:translate(-50%,-50%);
}

#maladiven div::before {
	left:58.33333333333334%;
	background-color:white;
}

#maladiven div::after {
	left:75%;
	background-color:ForestGreen;
}


/*****************/
/* ID = brazilie */
/*****************/
#brazilie {
	background-color:ForestGreen;
}

#brazilie div:nth-of-type(1) {
   position:absolute;
   width:61%; height:61%;
   left:19.5%; top:19.5%;
   background-color:Gold;
   transform:rotate(45deg) skew(-6deg,-6deg);
}

#brazilie div:nth-of-type(2) {
   position:absolute;
   width:50%; height:50%;
   left:25%; top:25%;
   background:
      rgb(26,0,102) 
      radial-gradient(ellipse at center,
      rgb(0,51,102) 48%,
      white 48%,
      white 52%,
      rgb(0,51,102) 52%)
      -100% 4% / 260% 260%;
    border-radius:50%;
}


/**************/
/* ID = japan */
/**************/
#japan::before {
   content:"";
   position:absolute;
   left:25%; right:25%; 
   top:25%; bottom:25%;
   background-color:Crimson;
   border-radius:50%;
}


/******************/
/* ID = groenland */
/******************/
#groenland,
#groenland::before {
	background-image: linear-gradient(to bottom, white 50%, Crimson 50%);
}

#groenland::before {
   content:"";
   position:absolute;
   width:50%; height:50%;
   left:20%; top:25%;
   border-radius:50%;
   transform:rotate(180deg);
}


/*****************/
/* ID = suriname */
/*****************/
#suriname {
   padding:0;
   background:
		linear-gradient(
         to bottom,
         ForestGreen 20%,
         White 20%, White 30%,
         Crimson 30%, Crimson 70%,
         White 70%, White 80%,
         ForestGreen 80%
		);
}

#suriname div {
   position:absolute;
   width:25%; height:25%;
   left:37.5%; top:37.5%;
   background-color:gold;
   -webkit-clip-path:polygon(50% 0, 61.2% 34.5%, 97.6% 34.5%, 68.2% 55.9%, 79.4% 90.4%, 50% 69%, 20.6% 90.4%, 31.8% 55.9%, 2.4% 34.5%, 38.8% 34.5%, 50% 0);
   clip-path:polygon(50% 0, 61.2% 34.5%, 97.6% 34.5%, 68.2% 55.9%, 79.4% 90.4%, 50% 69%, 20.6% 90.4%, 31.8% 55.9%, 2.4% 34.5%, 38.8% 34.5%, 50% 0);
}


/***************/
/* ID = finish */
/***************/
#finish {
   background-image:
      linear-gradient(45deg, black 25.2%, transparent 25.2%, transparent 74.8%, black 74.8%),
      linear-gradient(45deg, black 25.2%, transparent 25.2%, transparent 74.8%, black 74.8%);
   background-size:25% 25%;
   background-position:0 0, calc(100% / 6) calc(100% / 6);
}


/********************/
/* ID = griekenland */
/********************/
#griekenland {
	background:
		linear-gradient(
         to bottom, 
         transparent 40%, 
         white 40%, 
         white 60%, 
         transparent 60%)
         left top / calc(100% / 9 * 5) calc(100% / 9 * 5)
         no-repeat,
		
		linear-gradient(
         to right, 
         rgb(0,51,102) 40%, 
         white 40%, 
         white 60%, 
         rgb(0,51,102) 60%)
         left top / calc(100% / 9 * 5) calc(100% / 9 * 5)
         no-repeat,
		
		repeating-linear-gradient(
			180deg,
			rgb(0,51,102),
			rgb(0,51,102) calc(100% / 9),
			white calc(100% / 9),
			white calc(100% / 9*2)
		);
}


/****************/
/* ID = liberia */
/****************/
#liberia {
	background:
      linear-gradient( rgb(0,51,102), rgb(0,51,102) )
         left top / calc(100% / 11 * 5) calc(100% / 11 * 5)
         no-repeat,
		
		repeating-linear-gradient(
			180deg,
			crimson,
			crimson calc(100% / 11),
			white calc(100% / 11),
			white calc(100% /11*2)
		);
}

#liberia div {
   position:absolute;
   width:25%; height:25%;
   left:calc(100% / 11 * 5 / 2 - 12.5%); top:calc(100% / 11 * 5 / 2 - 12.5%);
   background-color:white;
   -webkit-clip-path:polygon(50% 0, 61.2% 34.5%, 97.6% 34.5%, 68.2% 55.9%, 79.4% 90.4%, 50% 69%, 20.6% 90.4%, 31.8% 55.9%, 2.4% 34.5%, 38.8% 34.5%, 50% 0);
   clip-path:polygon(50% 0, 61.2% 34.5%, 97.6% 34.5%, 68.2% 55.9%, 79.4% 90.4%, 50% 69%, 20.6% 90.4%, 31.8% 55.9%, 2.4% 34.5%, 38.8% 34.5%, 50% 0);
}


/************/
/* ID = usa */
/************/
#usa {
	background:
		repeating-linear-gradient(
			180deg,
			Crimson,
			Crimson calc(100% / 13),
			white calc(100% / 13),
			white calc(100% / 13*2)
		) center / cover;
}

#usa > div {
	position:absolute;
	top:0;
	left:0;
	width:calc(100% / 13*7);
	height:calc(100% / 13*7);
	background-color:rgb(0,51,102);
}

#usa > div div {
	position:absolute;
	width:10%; height:10%;
	background-color:white;
	-webkit-clip-path:polygon(50% 0, 61.2% 34.5%, 97.6% 34.5%, 68.2% 55.9%, 79.4% 90.4%, 50% 69%, 20.6% 90.4%, 31.8% 55.9%, 2.4% 34.5%, 38.8% 34.5%, 50% 0);
	clip-path:polygon(50% 0, 61.2% 34.5%, 97.6% 34.5%, 68.2% 55.9%, 79.4% 90.4%, 50% 69%, 20.6% 90.4%, 31.8% 55.9%, 2.4% 34.5%, 38.8% 34.5%, 50% 0);
}

#usa > div div:nth-of-type(1) {top:5%; left:3.2%;}
#usa > div div:nth-of-type(2) {top:25%; left:3.2%;}
#usa > div div:nth-of-type(3) {top:45%; left:3.2%;}
#usa > div div:nth-of-type(4) {top:65%; left:3.2%;}
#usa > div div:nth-of-type(5) {top:85%; left:3.2%;}

#usa > div div:nth-of-type(6) {top:15%; left:11.5%;}
#usa > div div:nth-of-type(7) {top:35%; left:11.5%;}
#usa > div div:nth-of-type(8) {top:55%; left:11.5%;}
#usa > div div:nth-of-type(9) {top:75%; left:11.5%;}

#usa > div div:nth-of-type(10) {top:5%; left:19.8%;}
#usa > div div:nth-of-type(11) {top:25%; left:19.8%;}
#usa > div div:nth-of-type(12) {top:45%; left:19.8%;}
#usa > div div:nth-of-type(13) {top:65%; left:19.8%;}
#usa > div div:nth-of-type(14) {top:85%; left:19.8%;}

#usa > div div:nth-of-type(15) {top:15%; left:28.2%;}
#usa > div div:nth-of-type(16) {top:35%; left:28.2%;}
#usa > div div:nth-of-type(17) {top:55%; left:28.2%;}
#usa > div div:nth-of-type(18) {top:75%; left:28.2%;}

#usa > div div:nth-of-type(19) {top:5%; left:36.5%;}
#usa > div div:nth-of-type(20) {top:25%; left:36.5%;}
#usa > div div:nth-of-type(21) {top:45%; left:36.5%;}
#usa > div div:nth-of-type(22) {top:65%; left:36.5%;}
#usa > div div:nth-of-type(23) {top:85%; left:36.5%;}

#usa > div div:nth-of-type(24) {top:15%; left:44.8%;}
#usa > div div:nth-of-type(25) {top:35%; left:44.8%;}
#usa > div div:nth-of-type(26) {top:55%; left:44.8%;}
#usa > div div:nth-of-type(27) {top:75%; left:44.8%;}

#usa > div div:nth-of-type(28) {top:5%; left:53.2%;}
#usa > div div:nth-of-type(29) {top:25%; left:53.2%;}
#usa > div div:nth-of-type(30) {top:45%; left:53.2%;}
#usa > div div:nth-of-type(31) {top:65%; left:53.2%;}
#usa > div div:nth-of-type(32) {top:85%; left:53.2%;}

#usa > div div:nth-of-type(33) {top:15%; left:61.5%;}
#usa > div div:nth-of-type(34) {top:35%; left:61.5%;}
#usa > div div:nth-of-type(35) {top:55%; left:61.5%;}
#usa > div div:nth-of-type(36) {top:75%; left:61.5%;}

#usa > div div:nth-of-type(37) {top:5%; left:69.8%;}
#usa > div div:nth-of-type(38) {top:25%; left:69.8%;}
#usa > div div:nth-of-type(39) {top:45%; left:69.8%;}
#usa > div div:nth-of-type(40) {top:65%; left:69.8%;}
#usa > div div:nth-of-type(41) {top:85%; left:69.8%;}

#usa > div div:nth-of-type(42) {top:15%; left:78.2%;}
#usa > div div:nth-of-type(43) {top:35%; left:78.2%;}
#usa > div div:nth-of-type(44) {top:55%; left:78.2%;}
#usa > div div:nth-of-type(45) {top:75%; left:78.2%;}

#usa > div div:nth-of-type(46) {top:5%; left:86.5%;}
#usa > div div:nth-of-type(47) {top:25%; left:86.5%;}
#usa > div div:nth-of-type(48) {top:45%; left:86.5%;}
#usa > div div:nth-of-type(49) {top:65%; left:86.5%;}
#usa > div div:nth-of-type(50) {top:85%; left:87.5%;}


/***************/
/* ID = europa */
/***************/
#europa {
    background-color:rgb(0,51,102);
}

#europa div {
   position:absolute;
   width:12.5%; height:12.5%;
   left:43.75%; top:43.75%;
   background-color:gold;
   -webkit-clip-path:polygon(50% 0, 61.2% 34.5%, 97.6% 34.5%, 68.2% 55.9%, 79.4% 90.4%, 50% 69%, 20.6% 90.4%, 31.8% 55.9%, 2.4% 34.5%, 38.8% 34.5%, 50% 0);
   clip-path:polygon(50% 0, 61.2% 34.5%, 97.6% 34.5%, 68.2% 55.9%, 79.4% 90.4%, 50% 69%, 20.6% 90.4%, 31.8% 55.9%, 2.4% 34.5%, 38.8% 34.5%, 50% 0);
}

#europa div:nth-of-type(1) { transform:rotate(0deg) translateY(-250%) rotate(0deg); }
#europa div:nth-of-type(2) { transform:rotate(30deg) translateY(-250%) rotate(-30deg); }
#europa div:nth-of-type(3) { transform:rotate(60deg) translateY(-250%) rotate(-60deg); }
#europa div:nth-of-type(4) { transform:rotate(90deg) translateY(-250%) rotate(-90deg); }
#europa div:nth-of-type(5) { transform:rotate(120deg) translateY(-250%) rotate(-120deg); }
#europa div:nth-of-type(6) { transform:rotate(150deg) translateY(-250%) rotate(-150deg); }
#europa div:nth-of-type(7) { transform:rotate(180deg) translateY(-250%) rotate(-180deg); }
#europa div:nth-of-type(8) { transform:rotate(210deg) translateY(-250%) rotate(-210deg); }
#europa div:nth-of-type(9) { transform:rotate(240deg) translateY(-250%) rotate(-240deg); }
#europa div:nth-of-type(10) { transform:rotate(270deg) translateY(-250%) rotate(-270deg); }
#europa div:nth-of-type(11) { transform:rotate(300deg) translateY(-250%) rotate(-300deg); }
#europa div:nth-of-type(12) { transform:rotate(330deg) translateY(-250%) rotate(-330deg); }


/********************/
/* ID = noord-korea */
/********************/
#noord-korea {
   background:
		linear-gradient(
			to bottom,
			rgb(0,51,102) 16.7%,
			White 16.7%, White 20%,
         Crimson 20%, Crimson 80%,
         White 80%, White 83.3%,
         rgb(0,51,102) 83.3%
		);
}

#noord-korea div {
   position:absolute;
   width:50%; height:50%;
   left:12.5%; top:25%;
   background-color:white;
   border-radius:50%;
}

#noord-korea div::after {
   content:"";
   position:absolute;
   left:0; right:0; top:0; bottom:0;
   background-color:crimson;
   -webkit-clip-path:polygon(50% 0, 61.2% 34.5%, 97.6% 34.5%, 68.2% 55.9%, 79.4% 90.4%, 50% 69%, 20.6% 90.4%, 31.8% 55.9%, 2.4% 34.5%, 38.8% 34.5%, 50% 0);
   clip-path:polygon(50% 0, 61.2% 34.5%, 97.6% 34.5%, 68.2% 55.9%, 79.4% 90.4%, 50% 69%, 20.6% 90.4%, 31.8% 55.9%, 2.4% 34.5%, 38.8% 34.5%, 50% 0);
}


/*******************/
/* ID = zuid-korea */
/*******************/
#zuid-korea div:nth-of-type(1) {
   position:absolute;
   width:50%; height:50%;
   left:25%; top:25%;
   border-radius:50%;
   background-image: linear-gradient(to bottom, Crimson 50%, rgb(0,51,102) 50%);
   transform:rotate(30deg);
}

#zuid-korea div:nth-of-type(1)::before,
#zuid-korea div:nth-of-type(1)::after {
   content:"";
   position:absolute;
   width:50%; height:50%;
   top:25%;
   border-radius:50%;
}

#zuid-korea div:nth-of-type(1)::before {
	left:0;
	background-color:Crimson;
}

#zuid-korea div:nth-of-type(1)::after {
	right:0;
	background-color:rgb(0,51,102);
}

#zuid-korea div:not(:nth-of-type(1)) {
	position:absolute;
	width:20%; height:15%;
	background-image:linear-gradient(to bottom, black 60%, white 60%);
	background-size:100% calc(100%/13*5);
}

#zuid-korea div:nth-of-type(2) {
	left:6%; top:20%;
	transform:rotate(300deg);
}

#zuid-korea div:nth-of-type(3) {
	right:6%; top:20%;
	transform:rotate(60deg);
}

#zuid-korea div:nth-of-type(4) {
	left:6%; bottom:20%;
	transform:rotate(60deg);
}

#zuid-korea div:nth-of-type(5) {
	right:6%; bottom:20%;
	transform:rotate(300deg);
}

#zuid-korea div:nth-of-type(3)::before,
#zuid-korea div:nth-of-type(3)::after,
#zuid-korea div:nth-of-type(4)::before,
#zuid-korea div:nth-of-type(5)::before {
	content:"";
	position:absolute;
	width:10%; left:45%;
	
	background-color:white;
}
#zuid-korea div:nth-of-type(3)::before {
   height:30%;
   top:0;
}
#zuid-korea div:nth-of-type(3)::after {
   height:30%;
   bottom:0;
}
#zuid-korea div:nth-of-type(4)::before {
   height:30%;
   top:35%;
}
#zuid-korea div:nth-of-type(5)::before {
   height:100%;
   top:0;
}


/**************/
/* ID = china */
/**************/
#china {
    background-color:crimson;    
}

#china div {
   position:absolute;
   width:12.5%; height:12.5%;
   left:33.75%; top:21.25%;
   background-color:gold;
   -webkit-clip-path:polygon(50% 0, 61.2% 34.5%, 97.6% 34.5%, 68.2% 55.9%, 79.4% 90.4%, 50% 69%, 20.6% 90.4%, 31.8% 55.9%, 2.4% 34.5%, 38.8% 34.5%, 50% 0);
   clip-path:polygon(50% 0, 61.2% 34.5%, 97.6% 34.5%, 68.2% 55.9%, 79.4% 90.4%, 50% 69%, 20.6% 90.4%, 31.8% 55.9%, 2.4% 34.5%, 38.8% 34.5%, 50% 0);
}

#china div:nth-of-type(1) {
   width:25%; height:25%;
   left:15%; top:15%;

   display:flex;
   justify-content:center;
   align-items:center;
}

#china div:nth-of-type(1)::before {
   content:"\262D";
   font-size:2em;
   color:crimson;
}

#china div:nth-of-type(2) {
   transform:rotate(-60deg) translateX(175%) rotate(-70deg);
}
#china div:nth-of-type(3) {
   transform:rotate(-20deg) translateX(175%) rotate(-80deg);
}
#china div:nth-of-type(4) {
   transform:rotate(20deg) translateX(175%) rotate(-100deg);
}
#china div:nth-of-type(5) {
   transform:rotate(60deg) translateX(175%) rotate(-110deg);
}

/********************/
/* ID = saint-lucia */
/********************/
#saint-lucia {
	background:rgb(0,51,102);
}

#saint-lucia div,
#saint-lucia div::before,
#saint-lucia div::after {
   position:absolute;
   background-position:top left, top right;
   background-size:50.1% 100%;
   background-repeat:no-repeat;
}

#saint-lucia div {
   left:30%; right:30%;
   top:20%; bottom:20%;
   background-image:
      linear-gradient(
         108.434948822922011deg,
         transparent 50%,
         white 50%
      ),
      linear-gradient(
         251.565051177077989deg,
         transparent 50%,
         white 50%
      );
}

#saint-lucia div::before {
   content:"";
   left:10%; right:10%;
   top:20%; bottom:0;
   background-image:
      linear-gradient(
         108.434948822922011deg,
         transparent 50%,
         black 50%
      ),
      linear-gradient(
         251.565051177077989deg,
         transparent 50%,
         black 50%
      );
}

#saint-lucia div::after {
   content:"";
   left:0; right:0;
   top:50%; bottom:0;
   background-image:
      linear-gradient(
         123.690067525979787deg,
         transparent 50%,
         gold 50%
      ),
      linear-gradient(
         236.309932474020213deg,
         transparent 50%,
         gold 50%
      );
}


/****************/
/* ID = bahrein */
/****************/
#bahrein {
	padding:0;
	
	background-image:
		linear-gradient(
         -26.56505117707799deg,
         crimson calc(100% /3),
         transparent calc(100% /3) ),
		linear-gradient(
         206.56505117707799deg,
         crimson calc(100% /3),
         transparent calc(100% /3) ),
		linear-gradient(
         to right,
         transparent 50%,
         Crimson 50%
      );
	
	background-position:37.7% top, 37.7% bottom, center center;
	background-size:20.05% 20.05%, 20.05% 20.05%, 100% 100%;
	background-repeat:repeat-y, repeat-y, no-repeat;
}


/******************/
/* ID = slowakije */
/******************/
#slowakije {
	background-image:linear-gradient(
      to bottom,
      white calc(100% /3),
      rgb(0,51,102) calc(100% /3), rgb(0,51,102) calc(100% /3 *2),
      Crimson calc(100% /3 *2)
    );
}

/* buitenschild */
#slowakije > div {
   position:absolute;
   left:18%; right:32%;
   top:18%; bottom:18%;

   background:white;
   border-radius:0 0 50% 50% / 0 0 33.3% 33.3%;

   transform:perspective(30em) rotateX(45deg) scaleY(1.25) translateY(-5%);
}

/* binnenschild */
#slowakije > div > div {
   position:absolute;
   left:4.5%; right:4.5%;
   top:3%; bottom:3%;

   background-image:radial-gradient(
      ellipse at center bottom,
      rgb(0,51,102) 18%,
      Crimson 18%
   );
   background-size:800% 100%;
   background-position:center bottom;
   border-radius:inherit;

   overflow:hidden;
}

/* golfjes */
#slowakije > div > div > div:last-child {
	position:absolute;
	width:40%; height:40%;
	left:30%; bottom:-6%;
	background-color:rgb(0,51,102);
	border-radius:50%;
}

#slowakije > div > div > div:last-child::after,
#slowakije > div > div > div:last-child::before {
	content:"";
	position:absolute;
	width:100%; height:100%;
	right:0; bottom:0;
	background-color:inherit;
	border-radius:50%;
}
#slowakije > div > div > div:last-child::after {
	transform:translate(80%,12%);
}
#slowakije > div > div > div:last-child::before {
	transform:translate(-80%,12%);
}

/* paal */
#slowakije > div > div > div:first-child {
   position:absolute;
   width:10%;
   height:60%;
   left:45%;
   bottom:10%;
   background-color:white;
}

/* takjes */
#slowakije > div > div > div:first-child div {
   position:absolute;
   width:200%; height:40%;
   bottom:90%; left:-50%;

   background-image:
      linear-gradient(
         80deg,
         transparent 36%,
         white 36%
      ),
      linear-gradient(
         280deg,
         transparent 36%,
         white 36%
      );
   background-position:top left, top right;
   background-size:52% 100%, 52% 100%;
   background-repeat:no-repeat;
   transform-origin:center bottom;   
}

#slowakije > div > div > div:first-child div::after {
   content:"";
   position:absolute;
   width:200%; height:100%;
   left:-50%; bottom:90%;
   background-color:crimson;
   border-radius:50%;
}

#slowakije > div > div > div:first-child div:nth-of-type(1) {

}
#slowakije > div > div > div:first-child div:nth-of-type(2) {
    transform:rotate(-90deg) skewY(10deg) scale(.9);
}
#slowakije > div > div > div:first-child div:nth-of-type(3) {
    transform:rotate(90deg) skewY(-10deg) scale(.9);
}
#slowakije > div > div > div:first-child div:nth-of-type(4) {
    transform:translateY(70%) rotate(-90deg) skewY(10deg) scale(.8);
}
#slowakije > div > div > div:first-child div:nth-of-type(5) {
    transform:translateY(70%) rotate(90deg) skewY(-10deg) scale(.8);
}


/******************/
/* ID = friesland */
/******************/
#friesland {
	background-image: repeating-linear-gradient(
		45deg,
		rgb(0,51,102),
		rgb(0,51,102) calc(100% / 7),
		white calc(100% / 7),
		white calc(100% / 7*2)
   );
	overflow:hidden;
}

/* de pompeblêden */
#friesland div {
	position:absolute;
	width:21%;
	height:14%;
	transform:translate(-50%,-50%) rotate(45deg);
}

#friesland div::after,
#friesland div::before {
	content:"";
	position:absolute;
	width:50%;
	height:100%;
	top:0;
	background-color:Crimson;
}
#friesland div::after {
	left:0;
	border-radius:60% 40% 0 100% / 40% 60% 0 60%;
	transform:translateX(1px);
}
#friesland div::before {
	right:0;
	border-radius:40% 60% 100% 0 / 60% 40% 60% 0;
	transform:translateX(-1px);
}

#friesland div:nth-of-type(1) {
	top:12%;
	left:69%;
}
#friesland div:nth-of-type(2) {
	top:31%;
	left:88%;
}
#friesland div:nth-of-type(3) {
	top:25%;
	left:25%;
}
#friesland div:nth-of-type(4) {
	top:50%;
	left:50%;
}
#friesland div:nth-of-type(5) {
	top:75%;
	left:75%;
}
#friesland div:nth-of-type(6) {
	top:69%;
	left:12%;
}
#friesland div:nth-of-type(7) {
	top:88%;
	left:31%;
}


/*****************/
/* ID = nautisch */
/*****************/
#nautisch {
	background:none;
	padding:0;
}

#nautisch div {
	width:100%;
	height:100%;
	background-image:
		linear-gradient(-161.56505117707816deg, rgba(0,0,0,0) 25%, white 25%),
		linear-gradient(-18.43494882292184deg, rgba(0,0,0,0) 25%, black 25%),
		linear-gradient(-161.56505117707816deg, rgba(0,0,0,0) 40%, Crimson 40%),
		linear-gradient(-18.43494882292184deg, rgba(0,0,0,0) 40%, Gold 40%);
	background-size:50% 50%, 50% 50%, 100% 50%, 100% 50%;
	background-position:top left, bottom left, top left, bottom left;
	background-repeat:no-repeat;
}


/*******************/
/* ID = olympic-bw */
/*******************/
#olympic-bw div {
	position:absolute;
	width:4em; height:4em;
	left:calc(50% - 2em); top:calc(50% - 2em);
	border:solid 5px black;
	border-radius:50%;
}

#olympic-bw div:nth-of-type(1) {
	transform:translate(4.3em, -1.075em);
}
#olympic-bw div:nth-of-type(2) {
	transform:translate(2.15em, 1.075em);
}
#olympic-bw div:nth-of-type(3) {
	transform:translate(0, -1.075em);
}
#olympic-bw div:nth-of-type(4) {
	transform:translate(-2.15em, 1.075em);
}
#olympic-bw div:nth-of-type(5) {
	transform:translate(-4.3em, -1.075em);
}


/****************/
/* ID = olympic */
/****************/
#olympic div {
	position:absolute;
	left:calc(50% - 2em);
	width:4em; height:4em;
	top:calc(50% - 2em);
	border:solid 5px black;
	border-radius:50%;
}

#olympic div:nth-of-type(1) {
	transform:translate(4.3em, -1.075em);
	border-color:Crimson;
}
#olympic div:nth-of-type(2) {
	transform:translate(2.15em, 1.075em);
	border-color:YellowGreen;
}
#olympic div:nth-of-type(3) {
	transform:translate(0, -1.075em);
}
#olympic div:nth-of-type(4) {
	transform:translate(-2.15em, 1.075em);
	border-color:Gold;
}
#olympic div:nth-of-type(5) {
	transform:translate(-4.3em, -1.075em);
	border-color:DodgerBlue;
}

#olympic div::before,
#olympic div::after {
	content:"";
	position:absolute;
	width:calc(100% + 10px); height:calc(100% + 10px);
	left:-5px; top:-5px;
	border:solid 5px transparent;
	border-radius:50%;
}

#olympic div:nth-of-type(5)::after {
	border-left-color:Gold;
	transform:translate(2.15em, 2.15em);
}
#olympic div:nth-of-type(4)::before {
	border-bottom-color:black;
	transform:translate(2.15em, -2.15em) rotate(45deg);
}
#olympic div:nth-of-type(4)::after {
	border-top-color:Gold;
}
#olympic div:nth-of-type(3)::after {
	border-left-color:YellowGreen;
	transform:translate(2.15em, 2.15em);
}
#olympic div:nth-of-type(2)::after {
	border-bottom-color:Crimson;
	transform:translate(2.15em, -2.15em);
}


/****************************/
/* ID = olympic-white-lines */
/****************************/
#olympic-white-lines::before,
#olympic-white-lines div  {
	content:"";
	position:absolute;
	width:4em; height:4em;
	left:calc(50% - 2em); top:calc(50% - 2em);
	border-style:solid;
	border-width:5px;
	border-radius:50%;
	box-shadow:0 0 0 3px white, inset 0 0 0 3px white;
}

#olympic-white-lines::before {
	border-color:Crimson transparent transparent Crimson;	
	transform:translate(4.3em, -1.075em);
}
#olympic-white-lines div:nth-of-type(1) {
	transform:translate(4.3em, -1.075em);
	border-color:transparent Crimson Crimson transparent;
	box-shadow:none;
	z-index:3;
	transform-style:preserve-3d;
}
#olympic-white-lines div:nth-of-type(2) {
	transform:translate(2.15em, 1.075em);
	border-color:YellowGreen;
	z-index:2;
}
#olympic-white-lines div:nth-of-type(3) {
	transform:translate(0, -1.075em);
	border-color:black;
}
#olympic-white-lines div:nth-of-type(4) {
	transform:translate(-2.15em, 1.075em);
	border-color:Gold;
}
#olympic-white-lines div:nth-of-type(5) {
	transform:translate(-4.3em, -1.075em);
	border-color:DodgerBlue;
}

#olympic-white-lines div::after {
	content:"";
	position:absolute;
	width:calc(100% + 10px); height:calc(100% + 10px);
	left:-5px; top:-5px;
	border:solid 5px transparent;
	border-radius:50%;
}

#olympic-white-lines div:nth-of-type(5)::after {
	border-left-color:Gold;
	transform:translate(2.15em, 2.15em);
}
#olympic-white-lines div:nth-of-type(4)::after {
	border-bottom-color:black;
	transform:translate(2.15em, -2.15em);
}
#olympic-white-lines div:nth-of-type(3)::after {
	border-left-color:YellowGreen;
	transform:translate(2.15em, 2.15em);
}
#olympic-white-lines div:nth-of-type(2)::after {
	border-right-color:black;
	transform:translate(-2.15em, -2.15em);
}

#olympic-white-lines div::before {
	content:"";
	position:absolute;
	width:calc(100% + 16px); height:calc(100% + 16px);
	left:-8px; top:-8px;
	border:solid 11px transparent;
	border-radius:50%;
}

#olympic-white-lines div:nth-of-type(5)::before {
	border-left-color:white;
	transform:translate(2.15em, 2.15em);
}
#olympic-white-lines div:nth-of-type(4)::before {
	border-bottom-color:white;
	transform:translate(2.15em, -2.15em);
}
#olympic-white-lines div:nth-of-type(3)::before {
	border-left-color:white;
	transform:translate(2.15em, 2.15em);
}
#olympic-white-lines div:nth-of-type(2)::before {
	border-right-color:white;
	transform:translate(-2.15em, -2.15em);
}
#olympic-white-lines div:nth-of-type(1)::before {
	border-color:transparent white white transparent;
	transform:translateZ(-1em);
}


/***************/
/* ID = batman */
/***************/
#batman {
	background-color:black;
}

#batman > div {
	position:absolute;
	left:10%; right:10%;
	top:30%; bottom:30%;
	background-color:Gold;
	border-radius:50%;
	overflow:hidden;
}

#batman > div div:first-child {
	position:absolute;
	width:calc(100% - 1em); height:calc(100% - 1em);
	left:.5em; top:.5em;
	background-color:black;
	border-radius:50%;
}

#batman > div div:first-child::before {
	content:"";
	position:absolute;
	width:20%; height:60%;
	left:50%; top:0; 
	background-color:Gold;
	border-radius:50% / 70% 70% 30% 30%;
	transform:translate(-120%,-40%) rotate(22.5deg);
}
#batman > div div:first-child::after {
	content:"";
	position:absolute;
	width:20%; height:60%;
	left:50%; top:0;
	background-color:Gold;
	border-radius:50% / 70% 70% 30% 30%;
	transform:translate(20%,-40%) rotate(-22.5deg);
}

#batman > div div:nth-of-type(2),
#batman > div div:nth-of-type(3)  {
	position:absolute;
	width:40%; height:40%;
	bottom:.5em;
}
#batman > div div:nth-of-type(2) {
	left:calc(50%);
}
#batman > div div:nth-of-type(3) {
	right:calc(50%);
}

#batman > div div:nth-of-type(2)::before,
#batman > div div:nth-of-type(3)::before,
#batman > div div:nth-of-type(2)::after,
#batman > div div:nth-of-type(3)::after {
	content:"";
	position:absolute;
	top:0;
	background-color:Gold;
	border-radius:50% / 60% 60% 40% 40%;
}

#batman > div div:nth-of-type(2)::before,
#batman > div div:nth-of-type(3)::before {
	width:50%; height:150%;
}
#batman > div div:nth-of-type(2)::before {
	transform:translate(0,20%) rotate(10deg);
	left:0;
}
#batman > div div:nth-of-type(3)::before {
	transform:translate(0,20%) rotate(-10deg);
	right:0;
}

#batman > div div:nth-of-type(2)::after,
#batman > div div:nth-of-type(3)::after {
	width:35%; height:85%;
}
#batman > div div:nth-of-type(2)::after {
	transform:translate(130%,25%) rotate(50deg);
	left:0;
}
#batman > div div:nth-of-type(3)::after {
	transform:translate(-130%,25%) rotate(-50deg);
	right:0;
}

#batman > div div:nth-of-type(4)  {
	position:absolute;
	width:8%; height:60%;
	left:46%; top:.4em;
	background-color:Gold;
	transform-origin:center top;
	transform:perspective(2em) rotateX(-60deg);
}


/********************/
/* ID = dark-knight */
/********************/
#dark-knight {
	background-color:black;
}

#dark-knight > div {
	position:absolute;
	left:10%; right:10%;
	top:32%; bottom:32%;
	overflow:hidden;
	background-image:linear-gradient(to bottom, SlateGrey 30%, rgb(55, 64, 72) 70%);
	box-shadow:inset 0 2px 2px rgba(255,255,255,.5);
}

#dark-knight::before {
	content:"";
	position:absolute;
	top:32%; bottom:32%;
	left:10%; right:10%;
	border-style:solid;
	border-width:0 1px 1px;
	border-color:black;
	z-index:5;
}

#dark-knight > div div:nth-of-type(1),
#dark-knight > div div:nth-of-type(2) {
	position:absolute;
	width:100%; height:100%;
	top:0;
	z-index:2;
}
#dark-knight > div div:nth-of-type(1) {
	left:-50%;
}
#dark-knight > div div:nth-of-type(2) {
	left:50%;
}

#dark-knight > div div:nth-of-type(1)::before,
#dark-knight > div div:nth-of-type(2)::before,
#dark-knight > div div:nth-of-type(1)::after,
#dark-knight > div div:nth-of-type(2)::after {
	content:"";
	position:absolute;
	background-color:black;
	height:100%;
}

#dark-knight > div div:nth-of-type(1)::before,
#dark-knight > div div:nth-of-type(2)::before {
	width:100%;
	bottom:0;
	border-radius:30% / 45%;
	transform:translate(0,50%);
}
#dark-knight > div div:nth-of-type(1)::before {
	left:0;
	box-shadow:2px -2px 2px rgba(0,0,0,.5);
}
#dark-knight > div div:nth-of-type(2)::before {
	right:0;
	box-shadow:-2px -2px 2px rgba(0,0,0,.5);
}

#dark-knight > div div:nth-of-type(1)::after,
#dark-knight > div div:nth-of-type(2)::after {
	width:75%;
	top:0;
	border-radius:50%;
}
#dark-knight > div div:nth-of-type(1)::after {
	left:0;
	transform:translate(-14%,-10%);
	box-shadow:0 -6px 2px rgba(255,255,255,.5);
}
#dark-knight > div div:nth-of-type(2)::after {
	right:0;
	transform:translate(14%,-10%);
	box-shadow:0 -6px 2px rgba(0,0,0,.5);
}

#dark-knight > div div:nth-of-type(3) {
	position:absolute;
	width:34%; height:25%;
	left:33%; top:0;
	background-color:black;
	border-radius:0 0 30% 30% / 0 0 100% 100%;
	box-shadow:-3px 0 2px rgba(0,0,0,.5), 3px 0 2px rgba(255,255,255,.5);
}

#dark-knight > div div:nth-of-type(3)::before {
	content:"";
	position:absolute;
	width:40%; height:220%;
	left:30%; bottom:-1px;
	background-color:SlateGrey ;
	box-shadow:inset -2px 2px 2px rgba(0,0,0,.5), inset 2px 2px 2px rgba(255,255,255,.5);
	transform-origin:bottom center;
	transform:perspective(5em) rotateX(45deg);
}

#dark-knight > div div:nth-of-type(3)::after {
	content:"";
	position:absolute;
	width:18%; height:100%;
	left:50%; top:0;
	background-color:black;
	border-radius:0 0 50% 50% / 0 0 40% 40%;
	box-shadow:-1px -2px 1px rgba(0,0,0,.5), 1px 2px 1px rgba(255,255,255,.5);
	transform-origin:top center;
	transform:translate(-50%,-50%);
}


/***************/
/* ID = mickey */
/***************/
#mickey {
	background-image:radial-gradient(ellipse at center, Crimson 20%, rgb(102,0,0) 80%);
}

#mickey .hoofd {
	position:absolute;
	width:50%; height:50%;
	left:25%; top:25%;
	background-color:black;
	border-radius:50%;
}

#mickey .oor {
	position:absolute;
	width:52%; height:60%;
	left:-25%; top:-28%;
	border-radius:50%;
	background-color:black;	
	transform:rotate(40deg);
}
#mickey .oor + .oor {
	left:auto; right:-25%;
	transform:rotate(-40deg);
}

#mickey .oog {
	position:absolute;
	width:35%; height:70%;
	left:50%; top:7%;
	background-color:white;
	border-radius:30% 70% 100% 0 / 15% 50% 50% 0;
}
#mickey .oog + .oog {
	left:auto; right:50%;
	border-radius:70% 30% 0 100% / 50% 15% 0 50%;
}

#mickey .oog::before {
	content:"";
	position:absolute;
	width:30%; height:50%;
	left:10%; top:30%;
	border-radius:50%;
	background-color:black;	
}
#mickey .oog + .oog::before {
	left:auto; right:10%;
}

#mickey .oog::after {
	content:"";
	position:absolute;
	width:26%; height:13%;
	left:-7%; top:50%;
	background-color:white;
	transform:rotate(-45deg) skew(15deg,15deg);
}
#mickey .oog + .oog::after {
	left:auto; right:31%;
}

#mickey .wang {
	position:absolute;
	width:32%; height:60%;
	left:10%; bottom:-13%;
	background-color:white;
	border:solid 6px black;
	border-radius:50% 50% 0 100% / 35% 35% 65% 65%;
	transform:rotate(-40deg);
}
#mickey .wang + .wang {
	left:auto; right:10%;
	border-radius:50% 50% 100% 0 / 35% 35% 65% 65%;
	transform:rotate(40deg);
}

#mickey .kin {
	position:absolute;
	width:40%; height:30%;
	left:30%; bottom:-10%;
	background-color:white;
	border:solid 6px black;
	border-radius:50%;
}
#mickey .kin::before {
	content:"";
	position:absolute;
	width:170%; height:100%;
	left:-35%; bottom:25%;
	background-color:white;
	border-radius:50%;
}

#mickey .mond {
	position:absolute;
	width:64%; height:45%;
	left:18%; bottom:6%;
	background-image:linear-gradient(to bottom, white 50%, black 50%);
	border-radius:50%;
}

#mickey .kuiltje {
	position:absolute;
	width:16%; height:12%;
	left:12%; bottom:18%;
	border-top:solid 5px black;
	border-radius:50%;
	transform:rotate(-15deg);
}

#mickey .kuiltje + .kuiltje {
	left:auto; right:12%;
	transform:rotate(15deg);
}

#mickey .mond::before {
	content:"";
	position:absolute;
	width:50%; height:70%;
	left:25%; bottom:-10px;
	background-color:black;
	border-radius:50%;
}

#mickey .mond::after {
	content:"";
	position:absolute;
	width:calc(100% - 10px); height:calc(100% - 10px);
	left:5px; bottom:5px;
	background-color:white;
	border-radius:50%;
}

#mickey .neus {
	position:absolute;
	width:36%; height:20%;
	left:32%; top:58%;
	background:black;
	border-radius:50%;
}
#mickey .neus::before {
	content:"";
	position:absolute;
	width:120%; height:145%;
	left:-10%; top:4px;
	background-color:white;
	border-radius:50%;
}
#mickey .neus::after {
	content:"";
	position:absolute;
	width:75%; height:90%;
	left:12.5%; top:30%;
	background-color:black;
	border-radius:50%;
}