Important: The GCConnex decommission will not affect GCCollab or GCWiki. Thank you and happy collaborating!

Difference between revisions of "Loogart"

From wiki
Jump to navigation Jump to search
Line 5: Line 5:
 
     This template was designed by Chris Soueidan of Global Affairs Canada's InnoLab Group in the SIAI Division. Visit innolab.site for more information.
 
     This template was designed by Chris Soueidan of Global Affairs Canada's InnoLab Group in the SIAI Division. Visit innolab.site for more information.
 
-->
 
-->
−
<style>
 
−
body {
 
−
      overflow-y: hidden;
 
−
      background-color: #f8f8f8;
 
−
  }
 
−
 
 
−
  div#mw-head {
 
−
      position: absolute;
 
−
      top: 145px;
 
−
      right: 0;
 
−
      width: 100%;
 
−
      display: none;
 
−
  }
 
−
 
 
−
  div#mw-panel {
 
−
      font-size: inherit;
 
−
      position: absolute;
 
−
      top: 160px;
 
−
      padding-top: 1em;
 
−
      width: 10em;
 
−
      left: 0;
 
−
      display: none;
 
−
  }
 
−
 
 
−
  #footer {
 
−
      display: none;
 
−
  }
 
−
 
 
−
  .mw-content-ltr ul,
 
−
  .mw-content-rtl .mw-content-ltr ul {
 
−
      margin: 0;
 
−
  }
 
−
 
 
−
  .mw-body .mw-body-content h1 {
 
−
      margin-top: 0;
 
−
  }
 
−
 
 
−
  .mw-body h1,
 
−
  .mw-body h2 {
 
−
      font-family: sans-serif;
 
−
      line-height: 1.3;
 
−
      margin-bottom: .25em;
 
−
      padding: 0;
 
−
      border-bottom: 1px solid transparent;
 
−
  }
 
−
 
 
−
  h4 {
 
−
      padding-top: 0;
 
−
  }
 
−
 
 
−
  .mw-body h3,
 
−
  .mw-body h4,
 
−
  .mw-body h5,
 
−
  .mw-body h6 {
 
−
      line-height: 1.2;
 
−
      margin-top: .1em;
 
−
      margin-bottom: .1em;
 
−
      padding-bottom: 0;
 
−
  }
 
  
−
 
−
@import url(https://fonts.googleapis.com/css?family=Roboto:100);
 
−
html,
 
−
super-body {
 
−
  width: 100%;
 
−
  height: 100%;
 
−
  margin: 0;
 
−
  padding: 0;
 
−
  overflow: hidden;
 
−
}
 
−
 
−
.super-body {
 
−
  /*  overflow: auto;*/
 
−
  overflow-x: hidden;
 
−
  overflow-y: scroll;
 
−
  -webkit-perspective: 1px;
 
−
  perspective: 1px;
 
−
  -webkit-transform-style: preserve-3d;
 
−
  transform-style: preserve-3d;
 
−
}
 
−
 
−
.super-body,
 
−
.super-body * {
 
−
  -webkit-transform-style: preserve-3d;
 
−
  transform-style: preserve-3d;
 
−
}
 
−
 
−
.container {
 
−
  padding: 10%;
 
−
  max-width: 100%;
 
−
  margin: auto;
 
−
}
 
−
 
−
.container :nth-child(1) {
 
−
  -webkit-transform: translateZ(-0.4px) scale(1.4);
 
−
  transform: translateZ(-0.4px) scale(1.4);
 
−
  z-index: -400;
 
−
  top: 200px;
 
−
  left: 10%;
 
−
}
 
−
 
−
.container :nth-child(2) {
 
−
  -webkit-transform: translateZ(0.2px) scale(0.8);
 
−
  transform: translateZ(0.2px) scale(0.8);
 
−
  z-index: 200;
 
−
  top: 200px;
 
−
  left: 30%;
 
−
}
 
−
 
−
.container :nth-child(3) {
 
−
  -webkit-transform: translateZ(0.3px) scale(0.7);
 
−
  transform: translateZ(0.3px) scale(0.7);
 
−
  z-index: 300;
 
−
  top: 400px;
 
−
  left: 40%;
 
−
}
 
−
 
−
.container :nth-child(4) {
 
−
  -webkit-transform: translateZ(0.1px) scale(0.9);
 
−
  transform: translateZ(0.1px) scale(0.9);
 
−
  z-index: 100;
 
−
  top: 500px;
 
−
  left: 30%;
 
−
  background-color: aquamarine;
 
−
}
 
−
 
−
.container :nth-child(5) {
 
−
  -webkit-transform: translateZ(-2px) scale(3);
 
−
  transform: translateZ(-2px) scale(3);
 
−
  z-index: -2000;
 
−
  top: 50%;
 
−
  left: 50%;
 
−
}
 
−
 
−
.container :nth-child(6) {
 
−
  -webkit-transform: translateZ(0.4px) scale(0.6);
 
−
  transform: translateZ(0.4px) scale(0.6);
 
−
  z-index: 400;
 
−
  top: 600px;
 
−
  left: 300px;
 
−
}
 
−
 
−
.container :nth-child(7) {
 
−
  -webkit-transform: translateZ(-1px) scale(2);
 
−
  transform: translateZ(-1px) scale(2);
 
−
  z-index: -1000;
 
−
  top: 400px;
 
−
  left: 1000px;
 
−
}
 
−
 
−
.container :nth-child(8) {
 
−
  -webkit-transform: translateZ(-0.4px) scale(1.4);
 
−
  transform: translateZ(-0.4px) scale(1.4);
 
−
  z-index: -400;
 
−
  top: 100px;
 
−
  left: 1400px;
 
−
}
 
−
 
−
.container :nth-child(9) {
 
−
  -webkit-transform: translateZ(0.4px) scale(0.6);
 
−
  transform: translateZ(0.4px) scale(0.6);
 
−
  z-index: 400;
 
−
  top: 900px;
 
−
  left: 500px;
 
−
}
 
−
 
−
.container :nth-child(10) {
 
−
  -webkit-transform: translateZ(-1px) scale(2);
 
−
  transform: translateZ(-1px) scale(2);
 
−
  z-index: -1000;
 
−
  top: 1600px;
 
−
  left: 100px;
 
−
}
 
−
 
−
.container > * {
 
−
  position: absolute;
 
−
}
 
−
 
−
.super-body {
 
−
  font-family: Roboto, sans-serif;
 
−
  font-weight: 100;
 
−
  background: #EEF1F3;
 
−
  line-height: 1;
 
−
  background-image: url("http://v4.loogart.com/img/portfolio/upa/upa-cityline-2015-zoomer.jpg");
 
−
  background-size: cover;
 
−
      position: fixed;
 
−
      overflow-y: scroll;
 
−
      overflow-x: hidden;
 
−
      -ms-overflow-x: hidden;
 
−
      top: 0;
 
−
      left: 0;
 
−
      right: 0;
 
−
      bottom: 0;
 
−
      z-index: 10000;
 
−
      background-color: #fff;
 
−
      -webkit-transition: all .2s ease-in;
 
−
      transition: all .5s ease-in;
 
−
      font-family: 'Roboto', sans-serif;
 
−
      font-size: 14px;
 
−
      -webkit-overflow-scrolling: touch;
 
−
      -ms-overflow-style: -ms-autohiding-scrollbar;
 
−
}
 
−
 
−
h1,
 
−
h2 {
 
−
  font-weight: 700;
 
−
  margin: 0;
 
−
}
 
−
 
−
h1 {
 
−
  font-size: 5em;
 
−
  color: #fff;
 
−
}
 
−
 
−
h2 {
 
−
  font-size: 3em;
 
−
  -webkit-transform: translateZ(0.2px) scale(0.8);
 
−
  transform: translateZ(0.2px) scale(0.8);
 
−
  z-index: 200;
 
−
  color: #fff;
 
−
}
 
−
 
−
 
−
 
−
</style>
 
 
<body>
 
<body>
  

Revision as of 10:54, 26 March 2018

<html>


<body> 

   <section class="super-body">
   
  

      <iframe width="560" height="315" src="https://www.youtube.com/embed/YnWxfYWaLpw" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

Loogart

Loogmoji

Illustration

Motion graphics

        <img src="http://loogart.com/img/loogmoji/animated/loogmoji-animated-nacho-libre-by-loogart.gif" style="width:200px" alt=" " />
       <img src="http://loogart.com/img/loogmoji/animated/loogmoji-animated-spiderman-by-loogart.gif" style="width:200px" alt=" " />
       <img src="http://loogart.com/img/loogmoji/animated/loogmoji-animated-ironman-by-loogart.gif" style="width:200px" alt=" " />
       <img src="http://loogart.com/img/loogmoji/animated/loogmoji-animated-elvis-presley-by-loogart.gif" style="width:200px" alt=" " />
       <img src="http://loogart.com/img/loogmoji/animated/loogmoji-animated-ronald-mcdonald-by-loogart.gif" style="width:200px" alt=" " />
       <img src="http://loogart.com/img/loogmoji/animated/loogmoji-animated-bruno-mars-by-loogart.gif" style="width:200px" alt=" " />

   </section>

</body>

</html>

<html> <style> .mw-body{ position:fixed!important; top:0!important; left:0!important; bottom:0!important; right:0!important; z-index:1000000!important; overflow-y:auto!important; }

pre{ 

 background-color:#111!important;
  color:#fff!important;
  border:none!important;

} </style>

helloooooo


</html>

Retrieved from "https://wiki.gccollab.ca/index.php?title=Loogart&oldid=842"