|
|
|
@ -16,31 +16,58 @@ body {
|
|
|
|
|
min-height: 100vh;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
#magi {
|
|
|
|
|
width: 100%;
|
|
|
|
|
z-index: -1;
|
|
|
|
|
padding: 20px;
|
|
|
|
|
--color-stop: #fff5f5;
|
|
|
|
|
--color-bot: #333042;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.img-fluid {
|
|
|
|
|
fill: url(#magi) #ffcccc;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#mag_title {
|
|
|
|
|
font-size: 120px;
|
|
|
|
|
font-size: 600%;
|
|
|
|
|
/*color: #ffcccc;*/
|
|
|
|
|
color: #333042;
|
|
|
|
|
font-family: 'Work Sans', sans-serif;
|
|
|
|
|
text-align: center;
|
|
|
|
|
padding-top: 30%;
|
|
|
|
|
z-index: 1;
|
|
|
|
|
border-top: 3px #ffcccc;
|
|
|
|
|
border-left: 3px #ffcccc;
|
|
|
|
|
border-style: solid dotted;
|
|
|
|
|
/*border-radius: 0px 72px;*/
|
|
|
|
|
padding: 6px;
|
|
|
|
|
/*height: auto;*/
|
|
|
|
|
/*-webkit-text-stroke: 1px #333042;*/
|
|
|
|
|
/*transition: all .1s ease;*/
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#mag_title:hover {
|
|
|
|
|
/*border-radius: 0px 72px;*/
|
|
|
|
|
box-shadow: 6px 6px #ffcccc;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#mag_subtitle {
|
|
|
|
|
font-size: 40px;
|
|
|
|
|
font-size: 300%;
|
|
|
|
|
font-family: 'Work Sans', sans-serif;
|
|
|
|
|
color: #333042;
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
|
|
|
|
border-right: 3px #ffcccc;
|
|
|
|
|
border-bottom: 3px #ffcccc;
|
|
|
|
|
/*border-radius: 120px 0px;*/
|
|
|
|
|
border-style: solid dotted;
|
|
|
|
|
height: auto;
|
|
|
|
|
padding: 6px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.summary {
|
|
|
|
|
border-left: 3px solid #ffcccc;
|
|
|
|
|
border-top: 3px dotted #ffcccc;
|
|
|
|
|
padding: 20px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.icons img {
|
|
|
|
|
width: 60%;
|
|
|
|
@ -51,7 +78,7 @@ body {
|
|
|
|
|
font-size: 20px;
|
|
|
|
|
font-family: 'Poppins', sans-serif;
|
|
|
|
|
color: #333042;
|
|
|
|
|
padding-top: 25%;
|
|
|
|
|
padding-top: 10%;
|
|
|
|
|
text-decoration: 2px underline #ffcccc;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
@ -59,6 +86,11 @@ body {
|
|
|
|
|
padding-bottom: 40px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.col-md-2 {
|
|
|
|
|
border-right: 3px dotted #ffcccc;
|
|
|
|
|
display: table;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.container_width {
|
|
|
|
|
max-width: 100%;
|
|
|
|
|
}
|
|
|
|
@ -67,47 +99,61 @@ body {
|
|
|
|
|
color: #333042;
|
|
|
|
|
font-family: 'Work Sans', sans-serif;
|
|
|
|
|
text-align: center;
|
|
|
|
|
font-size: 50px;
|
|
|
|
|
padding-top: 40px;
|
|
|
|
|
font-size: 300%;
|
|
|
|
|
padding-top: 20px;
|
|
|
|
|
padding-bottom: 20px;
|
|
|
|
|
border-top: 3px solid #ffcccc;
|
|
|
|
|
border-left: 3px dotted #ffcccc;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.item {
|
|
|
|
|
height: auto;
|
|
|
|
|
width: auto;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@media (max-width: 1217px) {
|
|
|
|
|
#mag_title {
|
|
|
|
|
font-size: 30px;
|
|
|
|
|
font-size: 300%;
|
|
|
|
|
padding-top: 10px;
|
|
|
|
|
padding-left: 20px;
|
|
|
|
|
padding-left: 12px;
|
|
|
|
|
padding-right: 12px;
|
|
|
|
|
}
|
|
|
|
|
#mag_subtitle {
|
|
|
|
|
font-size: 15px;
|
|
|
|
|
padding-left: 20px;
|
|
|
|
|
padding-top: 10px;
|
|
|
|
|
padding-bottom: 10px;
|
|
|
|
|
font-size: 150%;
|
|
|
|
|
padding-top: inherit;
|
|
|
|
|
/*padding-left: 20px;*/
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@media (max-width: 575px) {
|
|
|
|
|
#mag_title {
|
|
|
|
|
font-size: 60px;
|
|
|
|
|
padding-top: 10px;
|
|
|
|
|
padding-left: 20px;
|
|
|
|
|
padding-top: inherit;
|
|
|
|
|
padding-left: 12px;
|
|
|
|
|
padding-right: 12px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#mag_subtitle {
|
|
|
|
|
font-size: 18px;
|
|
|
|
|
padding-left: 20px;
|
|
|
|
|
padding-top: 10px;
|
|
|
|
|
padding-bottom: 10px;
|
|
|
|
|
font-size: 24px;
|
|
|
|
|
padding-top: inherit;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.icons img {
|
|
|
|
|
width: 50%;
|
|
|
|
|
width: 80%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.icons p {
|
|
|
|
|
padding-top: 0px;
|
|
|
|
|
padding-top: 10%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#magi {
|
|
|
|
|
padding-left: 20px;
|
|
|
|
|
padding-right: 20px;
|
|
|
|
|
padding: 20px;
|
|
|
|
|
border: 3px double ##ffcccc;
|
|
|
|
|
border-radius: 24px 48px 72px 96px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.col-md-2 {
|
|
|
|
|
border: none;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
@ -124,7 +170,7 @@ a {
|
|
|
|
|
#main_container {
|
|
|
|
|
padding-top: 100px;
|
|
|
|
|
padding-bottom: 120px;
|
|
|
|
|
border-bottom: 2px #ffcccc solid;
|
|
|
|
|
/*border-bottom: 2px #ffcccc solid;*/
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
@ -132,7 +178,8 @@ a {
|
|
|
|
|
text-align: center;
|
|
|
|
|
font-family: 'Poppins', sans-serif;
|
|
|
|
|
color: #333042;
|
|
|
|
|
padding-top: 10px;
|
|
|
|
|
padding: 6px;
|
|
|
|
|
font-size: small;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.glow {
|
|
|
|
@ -153,7 +200,8 @@ a {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#knife, #porcini, #cauliflower, #phone, #clothes, #lychee, #anise {
|
|
|
|
|
margin-top: 20px;
|
|
|
|
|
/*margin-top: 20px;*/
|
|
|
|
|
margin: auto;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@-webkit-keyframes glow {
|
|
|
|
@ -183,23 +231,22 @@ a {
|
|
|
|
|
</b-row>
|
|
|
|
|
<b-row>
|
|
|
|
|
<b-col md="8" offset-md="3">
|
|
|
|
|
|
|
|
|
|
<p id="mag_subtitle">#2 On adapting</p>
|
|
|
|
|
<p id="print">For the print version, send an <a href="mailto:hello@magiun.online">email</a>!</p>
|
|
|
|
|
<p class="summary">This second issue of Magiun focuses on...</p>
|
|
|
|
|
<p class=""
|
|
|
|
|
</b-col>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</b-row>
|
|
|
|
|
</b-col>
|
|
|
|
|
|
|
|
|
|
<b-col md="6">
|
|
|
|
|
<b-row>
|
|
|
|
|
<b-col md="2"></b-col>
|
|
|
|
|
<b-col md="2">
|
|
|
|
|
</b-col>
|
|
|
|
|
<b-col md="8">
|
|
|
|
|
<a href="/about"><b-img class="img-fluid" id="magi" src="media/invert.gif"></b-img></a>
|
|
|
|
|
|
|
|
|
|
<a href="/about">
|
|
|
|
|
<b-img class="img-fluid" id="magi" src="media/magiun_outline.svg"></b-img></a>
|
|
|
|
|
</b-col>
|
|
|
|
|
<b-col md="2"></b-col>
|
|
|
|
|
|
|
|
|
|
</b-row>
|
|
|
|
|
</b-col>
|
|
|
|
|
</b-row>
|
|
|
|
@ -215,7 +262,7 @@ a {
|
|
|
|
|
</b-col>
|
|
|
|
|
|
|
|
|
|
<b-col md="2">
|
|
|
|
|
<p><a href="/knife">Knife</a></p>
|
|
|
|
|
<p class="item"><a href="/knife">Knife</a></p>
|
|
|
|
|
|
|
|
|
|
</b-col>
|
|
|
|
|
<b-col md="2" order="0" order-sm="1">
|
|
|
|
@ -231,7 +278,7 @@ a {
|
|
|
|
|
<a href="/simmered"><b-img class="img-fluid" id="porcini" center alt="Responsive image" src="media/magiun2/porcini_small.png"></b-img></a>
|
|
|
|
|
</b-col>
|
|
|
|
|
<b-col md="2" order="1" order-sm="0">
|
|
|
|
|
<p><a href="/simmered">Simmered Egg</a></p>
|
|
|
|
|
<p class="item"><a href="/simmered">Simmered Egg</a></p>
|
|
|
|
|
|
|
|
|
|
</b-col>
|
|
|
|
|
|
|
|
|
@ -242,7 +289,7 @@ a {
|
|
|
|
|
</b-col>
|
|
|
|
|
|
|
|
|
|
<b-col md="2">
|
|
|
|
|
<p><a href="/soulsoup">Chicken soup for soul</a></p>
|
|
|
|
|
<p class="item"><a href="/soulsoup">Chicken soup for soul</a></p>
|
|
|
|
|
|
|
|
|
|
</b-col>
|
|
|
|
|
<b-col md="2" order="2" order-sm="1">
|
|
|
|
@ -256,7 +303,7 @@ a {
|
|
|
|
|
</b-col>
|
|
|
|
|
|
|
|
|
|
<b-col md="2">
|
|
|
|
|
<p><a href="/phone">Christmas dinner</a></p>
|
|
|
|
|
<p class="item"><a href="/phone">Christmas dinner</a></p>
|
|
|
|
|
|
|
|
|
|
</b-col>
|
|
|
|
|
|
|
|
|
@ -264,7 +311,7 @@ a {
|
|
|
|
|
<b-row class="icons">
|
|
|
|
|
|
|
|
|
|
<b-col md="2" offset-md="5">
|
|
|
|
|
<p><a href="/whatwecan">We do what we can with what we have</a></p>
|
|
|
|
|
<p class="item"><a href="/whatwecan">We do what we can with what we have</a></p>
|
|
|
|
|
|
|
|
|
|
</b-col>
|
|
|
|
|
<b-col md="2" order="2" order-sm="1">
|
|
|
|
@ -278,7 +325,7 @@ a {
|
|
|
|
|
</b-col>
|
|
|
|
|
|
|
|
|
|
<b-col md="2">
|
|
|
|
|
<p><a href="/lychee">Have you eaten yet?</a></p>
|
|
|
|
|
<p class="item"><a href="/lychee">Have you eaten yet?</a></p>
|
|
|
|
|
|
|
|
|
|
</b-col>
|
|
|
|
|
|
|
|
|
@ -288,7 +335,7 @@ a {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<b-col md="2" offset-md="5">
|
|
|
|
|
<p><a href="/anise">Adapting to adaptations</a></p>
|
|
|
|
|
<p class="item"><a href="/anise">Adapting to adaptations</a></p>
|
|
|
|
|
|
|
|
|
|
</b-col>
|
|
|
|
|
<b-col md="2" order="2" order-sm="1">
|
|
|
|
|