<div id="bg"></div>
<svg id="logo" version="1.1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
width="1000.056px" height="883.866px" viewBox="0 0 1000.056 883.866" enable-background="new 0 0 1000.056 883.866"
xml:space="preserve" class="line-animated">
<g class="ring">
<path stroke="0" stroke="#fff" stroke-width="10"d="M851.291,409.146c-0.735-0.164-1.45-0.244-2.13-0.244c-6.046,0-8.888,6.455-9.532,12.498
c-0.969,9.075,2.565,19.704,11.02,21.528c7.274,1.56,10.937-5.521,11.665-12.19C863.306,421.669,859.777,411.02,851.291,409.146z"
/>
<path d="M992.218,517.938l-56.064-77.353l55.85-53.342c0.491-0.467,0.682-1.173,0.483-1.826
c-0.194-0.653-0.731-1.14-1.396-1.272l-70.493-13.579C887.582,165.377,709.286,8.132,494.927,8.132
c-203.42,0-374.364,141.608-419.494,331.417L7.319,324.889c-0.542-0.115-1.095,0.013-1.521,0.355
c-0.427,0.351-0.675,0.868-0.675,1.413v2.421c0,0.38,0.12,0.756,0.347,1.062l56.058,77.351L5.686,460.834
c-0.492,0.471-0.68,1.173-0.488,1.825c0.192,0.653,0.729,1.141,1.398,1.265l58.677,11.311
C83.6,696.228,269.284,870.459,494.927,870.459c214.302,0,392.569-157.163,425.641-362.285l69.795,15.027
c0.133,0.017,0.257,0.033,0.385,0.033c0.408,0,0.817-0.132,1.144-0.396c0.422-0.347,0.67-0.867,0.67-1.421v-2.412
C992.561,518.616,992.444,518.253,992.218,517.938z M494.927,11.761c212.1,0,388.591,155.255,421.869,358.076l-124.831-24.042
c-39.801-126.161-157.898-217.901-297.042-217.901c-138.69,0-256.376,91.187-296.549,216.716c-0.203,0.21-0.374,0.457-0.457,0.748
l-1.615,5.822c-0.529,1.795-1.004,3.613-1.504,5.42l-2.261,8.161L78.983,340.31C123.76,152.136,293.25,11.761,494.927,11.761z
M873.023,426.188c-0.383,0.422-0.919,0.67-1.487,0.69c-0.56,0.05-1.119-0.19-1.534-0.58l-0.604-0.574
c-0.828-0.789-0.88-2.095-0.116-2.948l10.138-11.276c0.512-0.566,1.297-0.818,2.03-0.651l0.896,0.198
c0.999,0.221,1.697,1.128,1.656,2.15l-1.59,39.18c-0.025,0.628-0.327,1.21-0.824,1.593c-0.374,0.286-0.828,0.438-1.289,0.438
c-0.155,0-0.31-0.017-0.463-0.052l-0.847-0.19c-0.998-0.223-1.691-1.127-1.65-2.149L878.644,420L873.023,426.188z M867.355,431.442
c-1.119,10.251-6.789,16.875-14.449,16.875c-1.029,0-2.101-0.12-3.184-0.354c-11.459-2.477-16.35-15.897-15.135-27.268
c1.249-11.701,8.464-18.604,17.653-16.582C863.719,406.649,868.595,420.087,867.355,431.442z M829.507,438.246
c0.999,0.217,1.701,1.117,1.667,2.14l-0.029,0.847c-0.021,0.626-0.318,1.211-0.812,1.597c-0.376,0.291-0.835,0.446-1.302,0.446
c-0.148,0-0.297-0.017-0.446-0.048l-25.867-5.58c-1.008-0.217-1.712-1.13-1.667-2.161l0.037-0.851
c0.031-0.7,0.407-1.341,1.004-1.708l20.774-12.789c1.964-1.229,4.372-3.439,4.612-6.957c0.315-4.492-3.063-9.852-10.131-11.414
c-0.971-0.215-1.902-0.322-2.768-0.322c-5.251,0-7.277,3.873-7.424,7.496c-0.024,0.624-0.324,1.204-0.817,1.586
c-0.494,0.386-1.134,0.525-1.739,0.397l-0.789-0.169c-1.006-0.215-1.71-1.124-1.669-2.152c0.343-8.611,7.165-13.789,16.151-11.812
c9.984,2.202,14.76,10.073,14.315,16.709c-0.252,4.507-2.763,8.53-6.89,11.016l-15.656,9.529L829.507,438.246z M222.25,372.505
c0-0.079-0.029-0.145-0.04-0.219c-0.037-0.203-0.105-0.384-0.2-0.545c-0.054-0.107-0.047-0.24-0.122-0.326l-20.047-25.737
c39.718-124.048,156.022-214.155,293.081-214.155c136.826,0,253.023,89.77,292.948,213.479l-10.302-1.979
c-0.541-0.099-1.087,0.037-1.495,0.384c-0.418,0.338-0.661,0.859-0.661,1.396v130.646c0,0.008,0,0.008,0,0.008
c0,0.008,0,0.008,0,0.008c0.008,0.488,0.215,0.926,0.541,1.248l19.902,26.454c0.004,0.006,0.013,0.008,0.017,0.013
C766.366,642.313,642.717,747.07,494.923,747.07c-148.972,0-273.534-106.403-301.752-247.2l26.941,5.188
c0.114,0.025,0.231,0.033,0.345,0.033c0.417,0,0.826-0.148,1.157-0.413c0.417-0.347,0.657-0.859,0.657-1.404V372.625
C222.271,372.584,222.254,372.547,222.25,372.505z M167.386,409.065l-0.384,40.491l-5.112-1.045l0.382-40.446l-14.223-2.796
c0.967,1.528,1.712,3.201,2.035,5.075l0.357,2.931l-5.153,0.048l-0.281-2.369c-0.267-1.382-0.845-2.668-1.799-3.91
c-1.948-2.48-5.352-4.378-9.088-5.058c-0.882-0.157-1.801-0.246-2.714-0.246c-1.601,0-4.546,0.287-6.297,2.21
c-1.043,1.072-1.483,2.546-1.357,4.437c0.368,5.816,4.752,7.392,11.878,9.482c6.393,1.874,13.638,3.999,15.218,11.992
c0.946,4.738-0.576,7.83-2.018,9.588c-2.35,2.867-6.378,4.511-11.05,4.511c-1.289,0-2.599-0.126-3.894-0.374
c-7.107-1.367-15.061-7.008-15.798-14.77l-0.382-2.901l5.273,0.34l0.268,2.171c0.478,5.066,6.221,9.108,11.502,10.125
c4.092,0.785,8.186-0.178,10.016-2.396c1.125-1.365,1.477-3.21,1.039-5.482c-0.89-4.442-4.953-5.941-11.54-7.881
c-6.706-1.975-15.055-4.431-15.633-14.26c-0.258-3.115,0.657-6.019,2.582-8.124c2.284-2.468,5.841-3.821,10.028-3.821
c6.208,0,13.072,3.046,16.618,8.344l0.031-4.953l33.97,6.676l-0.058,5.248L167.386,409.065z M179.9,448.284
c-0.021,1.652-1.369,2.947-3.073,2.947l-0.632-0.058c-1.599-0.312-2.817-1.797-2.792-3.386c0.014-1.745,1.297-3.071,2.98-3.071
l0.648,0.066C178.723,445.098,179.921,446.539,179.9,448.284z M114.144,413.725l-0.035,5.257l-21.582-4.189l-0.143,15.208
l22.165,4.255l-0.035,5.198l-27.233-5.233l-0.099-1.784l0.417-44.261l27.222,5.354l-0.049,5.197l-22.049-4.333l-0.143,15.144
L114.144,413.725z M494.927,866.832c-223.395,0-407.289-172.24-425.946-390.888l120.372,23.19
c27.987,143.168,154.332,251.562,305.571,251.562c156.907,0,287.013-116.664,308.291-267.797l113.801,24.505
C884.299,710.884,707.493,866.832,494.927,866.832z M911.141,443.146l-15.594,9.371l19.398,4.185
c0.998,0.215,1.697,1.111,1.669,2.129l-0.024,0.835c-0.02,0.628-0.316,1.216-0.812,1.603c-0.376,0.295-0.834,0.45-1.303,0.45
c-0.148,0-0.298-0.017-0.446-0.048l-25.867-5.585c-1.004-0.217-1.708-1.123-1.667-2.151l0.033-0.835
c0.026-0.708,0.408-1.354,1.014-1.723l20.771-12.613c1.958-1.204,4.354-3.373,4.6-6.843c0.31-4.435-3.071-9.74-10.136-11.298
c-0.987-0.217-1.929-0.329-2.807-0.329c-5.224,0-7.239,3.813-7.386,7.379c-0.025,0.626-0.328,1.211-0.826,1.593
c-0.5,0.378-1.145,0.519-1.754,0.384l-0.784-0.177c-0.996-0.226-1.688-1.13-1.646-2.15c0.349-8.526,7.158-13.648,16.147-11.666
c9.999,2.198,14.766,10.01,14.308,16.588C917.791,436.705,915.282,440.691,911.141,443.146z"/>
</g>
<g class="effortless">
<path d="M109.316,303.962l4.323-11.178l61.472,23.393l7.109-18.403l10.242,3.896L181.03,331.25L109.316,303.962z"
/>
<path d="M185.258,225.521l9.505-13.455l8.982,6.246l-9.507,13.46l18.417,12.802l11.965-16.935l8.984,6.246
l-18.886,26.746l-62.895-43.729l18.891-26.737l8.982,6.246l-11.963,16.933L185.258,225.521z"/>
<path d="M228.318,128.914c8.904-7.59,18.064-6.208,26.081,3.034l1.574,1.816l-8.656,7.384l-2.076-2.396
c-3.58-4.123-6.599-4.271-9.516-1.793c-2.91,2.489-3.214,5.474,0.361,9.606c10.303,11.893,30.137-1.142,44.444,15.367
c8.02,9.249,7.938,18.515-1.054,26.184c-8.989,7.663-18.231,6.357-26.248-2.892l-3.077-3.55l8.662-7.388l3.573,4.135
c3.58,4.123,6.698,4.052,9.613,1.565c2.912-2.489,3.458-5.538-0.126-9.662c-10.303-11.895-30.133,1.14-44.446-15.373
C219.415,145.708,219.41,136.513,228.318,128.914z"/>
<path d="M312.947,73.236c10.514-5.194,19.05-1.621,24.525,9.294l1.076,2.148l-10.22,5.046l-1.419-2.828
c-2.439-4.87-5.337-5.756-8.776-4.054c-3.437,1.694-4.478,4.515-2.028,9.392c7.041,14.035,29.49,6.235,39.267,25.729
c5.478,10.924,3.102,19.875-7.509,25.114c-10.609,5.238-19.243,1.723-24.723-9.193l-2.099-4.195l10.218-5.048l2.443,4.876
c2.447,4.876,5.492,5.566,8.927,3.864c3.441-1.694,4.722-4.523,2.274-9.394c-7.041-14.041-29.486-6.238-39.269-25.737
C300.16,87.337,302.437,78.425,312.947,73.236z"/>
<path d="M479.056,64.227l16.563-0.502l0.332,10.878l-16.561,0.506l0.684,22.305l20.84-0.632l0.333,10.883
l-32.902,0.992l-2.33-76.171l32.9-0.983l0.333,10.88l-20.839,0.624L479.056,64.227z"/>
<path d="M571.323,73.656l15.206,3.387l-2.409,10.619l-15.201-3.381l-6.939,30.707l-11.781-2.617l16.812-74.376
l31.163,6.934l-2.404,10.625l-19.382-4.311L571.323,73.656z"/>
<path d="M655.787,102.043l14.012,6.771l-4.804,9.788l-14.008-6.762l-13.889,28.296l-10.859-5.244l33.629-68.537
l28.722,13.863l-4.804,9.79l-17.866-8.619L655.787,102.043z"/>
<path d="M731.589,129.617c7.943-9.307,17.424-10.476,26.475-2.871c9.042,7.599,9.438,17.069,1.499,26.375
l-25.822,30.244c-7.943,9.301-17.42,10.472-26.471,2.873c-9.046-7.607-9.442-17.075-1.495-26.384L731.589,129.617z
M714.482,168.178c-3.544,4.16-3.049,7.285-0.115,9.751c2.933,2.462,6.113,2.425,9.666-1.727l26.813-31.403
c3.544-4.154,3.049-7.279,0.12-9.745c-2.938-2.462-6.114-2.433-9.667,1.714L714.482,168.178z"/>
<path d="M769.402,254.038c1.243-1.658,1.979-2.701,7.109-6.264l9.897-6.87c5.841-4.057,6.618-7.522,3.47-11.981
l-2.392-3.396l-25.632,17.8l-6.928-9.811l62.963-43.713l10.442,14.813c7.184,10.172,5.494,17.85-4.217,24.597l-4.953,3.429
c-6.474,4.504-12.146,5.382-17.3,2.45c1.396,6.345-2.239,11.256-8.808,15.819l-9.707,6.742c-3.062,2.127-5.251,3.771-6.899,6.38
L769.402,254.038z M815.816,205.864l-19.336,13.419l2.701,3.842c2.586,3.658,5.779,4.763,10.819,1.268l6.2-4.309
c4.494-3.119,5.407-6.01,2.953-9.493L815.816,205.864z"/>
<path d="M869.035,276.393l13.152,34.642l-10.27,3.841l-4.449-11.715l-61.62,23.029l-4.25-11.207l61.616-23.029
l-4.449-11.724L869.035,276.393z"/>
<path d="M828.763,535.999c20.638,6.915,15.991,30.04,30.854,35.03c5.159,1.727,7.774,0.074,8.989-3.536
c1.21-3.61,0.115-6.511-5.048-8.237l-5.164-1.727l3.603-10.732l4.44,1.479c11.559,3.883,16.222,11.872,12.487,23.025
c-3.738,11.145-12.276,14.706-23.839,10.831c-20.646-6.915-15.99-30.04-30.854-35.021c-5.164-1.735-7.812-0.331-9.026,3.288
c-1.21,3.61,0.059,6.337,5.218,8.063l2.995,1l-3.594,10.731l-2.276-0.752c-11.562-3.883-16.259-11.772-12.558-22.811
C808.691,535.586,817.201,532.124,828.763,535.999z"/>
<path d="M793.478,618.814c18.18,11.988,7.753,33.146,20.836,41.78c4.552,2.99,7.51,2.065,9.6-1.116
c2.099-3.181,1.78-6.262-2.768-9.244l-4.544-3.008l6.233-9.451l3.904,2.578c10.187,6.717,12.648,15.639,6.175,25.454
c-6.473,9.814-15.644,11.07-25.821,4.354c-18.181-11.979-7.754-33.138-20.841-41.763c-4.552-2.999-7.469-2.321-9.571,0.859
c-2.094,3.188-1.569,6.139,2.979,9.137l2.636,1.744l-6.233,9.442l-1.999-1.305c-10.179-6.717-12.703-15.558-6.288-25.281
C774.182,613.271,783.299,612.106,793.478,618.814z"/>
<path d="M723.074,693.319l-15.437,13.772l-7.245-8.122l24.367-21.753l50.74,56.865l-24.373,21.745l-7.249-8.121
l15.437-13.772l-14.854-16.647l-12.269,10.938l-7.254-8.121l12.273-10.938L723.074,693.319z"/>
<path d="M692.019,795.863l-28.197,14.434l-4.957-9.691l17.54-8.98l-29.755-58.146l10.653-5.453L692.019,795.863z"
/>
<path d="M529.808,780.258L517.3,780.86l3.172,65.276l-11.967,0.578l-3.173-65.26l-12.506,0.604l-0.533-10.881
l36.986-1.793L529.808,780.258z"/>
<path d="M389.529,833.331c1.774-2.512,2.465-5.147,3.258-8.766l2.516-11.476
c1.704-7.767,4.852-12.979,11.238-14.145c-4.672-3.586-6.025-9.121-4.346-16.779l1.284-5.85
c2.516-11.483,8.962-15.97,21.084-13.31l17.649,3.866l-16.317,74.431l-11.7-2.562l6.646-30.312l-4.044-0.884
c-5.312-1.165-8.212,0.876-9.727,7.791l-2.565,11.698c-1.328,6.056-2.012,7.13-3.068,8.906L389.529,833.331z M422.554,773.697
c-4.151-0.9-6.473,1.033-7.638,6.361l-1.609,7.337c-1.305,5.957,0.937,8.443,5.294,9.401l4.571,1l5.017-22.86L422.554,773.697z"/>
<path d="M331.2,792.46c-5.688,10.79-14.624,13.954-25.021,8.468c-10.403-5.485-12.83-14.64-7.142-25.43
l18.489-35.054c5.692-10.782,14.624-13.946,25.023-8.46c10.397,5.485,12.83,14.64,7.14,25.43L331.2,792.46z M339.451,751.151
c2.545-4.816,1.388-7.758-1.982-9.542c-3.369-1.776-6.453-1.058-8.991,3.75l-19.204,36.401c-2.539,4.809-1.382,7.758,1.988,9.534
c3.367,1.784,6.449,1.074,8.991-3.751L339.451,751.151z"/>
<path d="M267.271,693.534l-14.497-13.343l7.371-8.006l23.305,21.447l-51.597,56.072l-8.815-8.112l21.307-23.142
l-11.376-10.468l7.375-8.014l11.368,10.476L267.271,693.534z"/>
<path d="M212.452,629.571l-10.738-16.531l9.135-5.933l17.259,26.578l-63.932,41.516l-6.524-10.047l26.392-17.143
l-8.421-12.963l9.135-5.932l8.423,12.971L212.452,629.571z"/>
<path d="M174.933,553.184l-6.771-19.539l10.29-3.569l10.693,30.866l-72.021,24.95l-10.693-30.866l10.29-3.568
l6.772,19.556l21.088-7.312l-5.378-15.54l10.286-3.561l5.384,15.54L174.933,553.184z"/>
</g>
<g class="leletters">
<polygon points="328.368,482.653 328.368,513.222 428.771,513.222 428.771,601.713 404.665,601.713
404.665,632.29 641.061,632.29 641.061,613.263 641.061,601.713 641.061,573.862 610.488,573.862 610.488,601.713
459.355,601.713 459.355,395.898 610.488,395.898 610.488,424.695 641.061,424.695 641.061,395.898 641.061,385.299
641.061,365.326 404.665,365.326 404.665,395.898 428.771,395.898 428.771,482.653 381.719,482.653 381.719,276.826
405.828,276.826 405.828,246.248 327.027,246.248 327.027,276.826 351.134,276.826 351.134,482.653 "/>
<polygon points="553.651,482.124 475.506,482.124 475.506,512.701 568.939,512.701 568.939,512.701
584.228,512.701 584.228,456.248 553.651,456.248 "/>
</g>
</svg>
body {
width: 100%;
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
margin:0;
position: relative;
}
#bg{
position:absolute;
z-index:1;
width: 100%;
height: 100%;
margin:0;
top:0;
left:0;
bottom:0;
background: url('https://c3.staticflickr.com/1/293/18910888954_5b8dc7ebf7_k.jpg') center center no-repeat;
background-size: cover;
&:before {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-image: linear-gradient(to bottom right,#000,#666);
animation-name: AnimateBG;
animation-timing-function: linear;
animation-iteration-count: infinite;
animation-duration: 7s;
background-size: 100% 100%;
opacity: .5;
}
}
svg{
width: 70vh;
display: block;
margin: 0 auto;
z-index:2;
}
.leletters, .effortless, .ring{
fill: #fff;
}
.effortless{
-webkit-animation: spin1 2s infinite linear;
-moz-animation: spin1 2s infinite linear;
-o-animation: spin1 2s infinite linear;
-ms-animation: spin1 2s infinite linear;
animation: spin1 25s infinite linear;
transform-origin: center center;
}
@-webkit-keyframes spin1 {
0% { -webkit-transform: rotate(0deg);}
100% { -webkit-transform: rotate(360deg);}
}
@-moz-keyframes spin1 {
0% { -moz-transform: rotate(0deg);}
100% { -moz-transform: rotate(360deg);}
}
@-o-keyframes spin1 {
0% { -o-transform: rotate(0deg);}
100% { -o-transform: rotate(360deg);}
}
.leletters{
-webkit-animation-name: spinner;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
-webkit-animation-duration: 7s;
animation-name: spinner;
animation-timing-function: linear;
animation-iteration-count: infinite;
animation-duration: 7s;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
transform-origin: center center;
}
@-webkit-keyframes spinner {
from
{
-webkit-transform: rotateY(0deg);
}
to {
-webkit-transform: rotateY(-360deg);
}
}
@keyframes spinner {
from {
-moz-transform: rotateY(0deg);
-ms-transform: rotateY(0deg);
transform: rotateY(0deg);
}
to
{
-moz-transform: rotateY(-360deg);
-ms-transform: rotateY(-360deg);
transform: rotateY(-360deg);
}
}
@keyframes AnimateBG {
0%{background-size:100% 100%}
50%{background-size:120% 100%}
100%{background-size:110% 100%}
}
/// SVG GOODNESS ///
Also see: Tab Triggers