body {
    background: #000;
}

/* Container */
.container {
    text-align: center;
    font-family: sans-serif;
    padding: 50px;
    width: 800px;
    background: grey;
    border-radius: 20px;
    margin: 24px auto;
}

h1 {
    color: white;
    font-size: 3rem;
}

/* Mastercard Logo */
.mc-logo {
    display: inline-block;
    position: relative;
    width: 400px;
}


.circle-one {
    display: inline-block;
    background: red;
    border-radius: 50%;
    width: 200px;
    height: 200px;
    margin-right: -30px;
}

.center {
    display: inline-block;
    height: 99px;
    width: 99px;
    top: 25%;
    left: 150px;
    border-radius: 0 100%;
    background: orange;
    position: absolute;
    transform: rotate(45deg);
}

.circle-two {
    display: inline-block;
    background: yellow;
    border-radius: 50%;
    width: 200px;
    height: 200px;
    margin-left: -30px;
}


/* BMW Logo */

.bmw-logo {
    width: 300px;
    display: inline-block;
}

.outer-circle {
    height: 300px;
    width: 300px;
    border-radius: 50%;
    background: black;
    position: relative;
}

.inner-circle-bmw {
    height: 200px;
    width: 200px;
    border-radius: 50%;
    background: white;
    position: absolute;
    display: block;
    top: 50px;
    left: 50px;
}

.blue-one {
    height: 100px;
    width: 100px;
    border-radius: 100% 0 0;
    position: absolute;
    top: 0;
    left: 0;
    background: lightskyblue;
}

.blue-two {
    height: 100px;
    width: 100px;
    border-radius: 0 0 100% 0;
    position: absolute;
    bottom: 0;
    right: 0;
    background: lightskyblue;
}

.b {
    display: inline-block;
    font-size: 3rem;
    color: white;
    transform: rotate(-45deg);
    position: absolute;
    left: 40px;
    top: 40px;
}

.m {
    display: inline-block;
    font-size: 3rem;
    color: white;
    position: absolute;
    left: 130px;
    top: 0;
}

.w {
    top: 40px;
    right: 40px;
    display: inline-block;
    font-size: 3rem;
    color: white;
    transform: rotate(45deg);
    position: absolute;
}


/* Instagram logo*/


.instagram {
    background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), -webkit-gradient(linear, left top, left bottom, from(#6559ca), color-stop(30%, #bc318f), color-stop(50%, #e33f5f), color-stop(70%, #f77638), to(#fec66d));
    background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
    border-radius: .2em;
    font-size: 50vmin;
    height: 1em;
    position: relative;
    width: 1em;
    display: inline-block;
}
.instagram:before, .instagram:after {
    color: #fff;
    content: '';
    display: block;
    position: absolute;
    border: .075em solid;
}
.instagram:before {
    border-radius: inherit;
    height: .75em;
    -webkit-transform: translate(0.125em, 0.125em);
    transform: translate(0.05em, 0.05em);
    width: .75em;
}
.instagram:after {
    border-radius: 1em;
    box-shadow: .2em -.2em 0 -.16em;
    height: .4em;
    -webkit-transform: translate(0.3em, 0.3em);
    transform: translate(0.21em, 0.25em);
    width: .4em;
}
