forked from medaminesfaxi/medaminesfaxi.github.io
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathstyle.css
1 lines (1 loc) · 10.7 KB
/
style.css
1
@font-face{font-family:eurostile;src:url(./Eurostile.TTF)}*{padding:0;margin:0;box-sizing:border-box;font-family:eurostile,sans-serif;cursor:url(cursor1x.png) 6 6,default}body{background-color:#fff;text-align:center;min-height:100vh;color:#adafb6;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}button{outline:0}.column>i{text-align:center;margin:0 auto 2em;font-size:36px}.column>i:hover{opacity:1}#all{display:none;-webkit-transition:all .5s ease-in;transition:all .5s ease-in}.fade-in{animation:fadeIn ease 2s;-webkit-animation:fadeIn ease 2s;-moz-animation:fadeIn ease 2s;-o-animation:fadeIn ease 2s;-ms-animation:fadeIn ease 2s}h1,h2,header,p,section{margin-bottom:1.5rem}::-webkit-scrollbar{width:6px;border-left:1px solid #e6ecf8}::-webkit-scrollbar-thumb{background-color:#293347}header{padding-top:2em}header ul{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}header li{display:inline}li{list-style:none}a{text-decoration:none;color:#5ca4da;-webkit-transition:color .3s ease;transition:color .3s ease;cursor:pointer}.social [class*="fa fa-"]{background-color:transparent;border:1px solid #fff;border-radius:30px;height:50px;line-height:50px;margin:auto 2px;width:50px;font-size:1.18em;text-align:center;cursor:pointer;transition:all .2s ease-in-out;-webkit-transition:all .2s ease-in-out}footer a:hover .fa{background:#fff;color:#5ca4da!important;opacity:1}.fa:hover{opacity:.2}img{height:auto;max-width:100%;cursor:pointer}.avatar{width:180px;margin-bottom:2em;border-radius:100%;cursor:url(cursor1x.png) 6 6,default}.container{margin-right:auto;margin-left:auto;max-width:1200px;padding:10px}.copyright{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-line-pack:center;align-content:center}.content-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;padding:12rem 1.5rem;padding-bottom:8em;-ms-flex-line-pack:center;align-content:center;text-align:center}.content{width:60%}.content *{color:#fff!important}section{padding:1.5rem 1.5rem;text-align:center}.nopadding{text-align:center;background-color:#5ca4da;position:relative;padding:0}svg{position:absolute;top:0;left:0}.fill:hover{color:#f5f5f5}.fill:before{content:"";position:absolute;background:#5ca4da;bottom:0;left:0;right:0;top:100%;z-index:-1;transition:top .16s ease-in;-webkit-transition:top .16s ease-in}.fill:hover:before{top:0}.btn{background-color:transparent;color:#5ca4da;border:2px solid #5ca4da;font-weight:400;font-size:18px;cursor:pointer;text-align:center;white-space:nowrap;text-decoration:none;padding:.5em 1em;border-radius:4px;position:relative;overflow:hidden;background:0 0;z-index:1;cursor:pointer;transition:.14s ease-in;-o-transition:.14s ease-in;-ms-transition:.14s ease-in;-moz-transition:.14s ease-in;-webkit-transition:.14s ease-in}#notification{position:fixed;top:-80px;background:#48b02c;width:100%;text-align:center;color:#fff;-webkit-transition:.5s ease-in;transition:.5s ease-in;padding:21px 12px}.title{font-size:3rem}.subtitle{font-weight:lighter;line-height:1.5;font-size:1.5rem}h1{color:#293347;font-weight:bolder;font-size:2em;line-height:1.125}h2{color:#293347;color:#4a4a4a;font-size:1.25rem}p{word-wrap:wrap;color:#293347;font-size:1.5em;font-weight:lighter;line-height:1.25}.colored{color:#5ca4da}.table{width:65%;margin:0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;top:-130px;background-color:#fff;border-radius:6px;box-shadow:0 5px 5px 0 rgba(233,240,243,.5),0 0 0 1px #e6ecf8;color:#293347;padding:1.25rem}.column{width:33%;padding:70px 45px}.column:nth-child(3){border-right:none}footer>h1,p{opacity:.85}small{width:100%;opacity:100%;background:#fff;padding:25px 0 25px 0}span{font-size:.7em;margin:0 8px;position:relative;-webkit-animation:flickerAnimation 1.5s infinite;animation:flickerAnimation 1.5s infinite;top:-5px;line-height:0}.btn:hover{color:#fff;background:#5ca4da}form{max-width:640px;margin:0 auto}.ligned{display:-webkit-box;display:-ms-flexbox;display:flex}.filed{width:100%;margin-right:10px;display:inline-block}label{display:block;text-align:left;margin-bottom:.5em;font-size:1.2rem;color:rgba(41,51,71,.65)}input[type=email],input[type=text],textarea{-webkit-transition:all .4s;transition:all .4s;width:100%;border:1px solid #e6ecf8;color:#293347;box-shadow:none;padding:.5em;margin-bottom:.5em;font-size:1.5em;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:4px}textarea{resize:none;height:200px}input:focus{outline:0;box-shadow:0 0 8px #5ca4da}textarea:focus{outline:0;box-shadow:0 0 8px #5ca4da}#contact{outline:0}@keyframes flickerAnimation{0%{opacity:1}50%{opacity:0}100%{opacity:1}}@-webkit-keyframes flickerAnimation{0%{opacity:1}50%{opacity:0}100%{opacity:1}}@media (max-width:600px){.title{font-size:1.85em}.subtitle{font-size:1.15em}.content{width:100%}.ligned{display:block}.table{width:98%;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.column{width:100%;border-right:none;border-bottom:1px solid #e6ecf8}}@media (min-width:600px){.title{font-size:1.85em}.subtitle{font-size:1.15em}.content{width:100%}.ligned{display:block}.table{width:98%;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.column{width:100%;border-right:none;border-bottom:1px solid #e6ecf8}}@media (min-width:768px){.title{font-size:2.25em}.subtitle{font-size:1.25em}.content{width:70%;margin:0 auto}.ligned{display:-webkit-box;display:-ms-flexbox;display:flex}.table{width:85%;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.column{width:100%;border-right:none;border-bottom:1px solid #e6ecf8}}@media (min-width:905px){.table{width:80%;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.column{width:100%;border-right:none;border-bottom:1px solid #e6ecf8}}@media (min-width:992px){.container{max-width:1024px}.title{font-size:2.5em}.subtitle{font-size:1.5em}.content{width:60%;margin:0 auto}.ligned{display:-webkit-box;display:-ms-flexbox;display:flex}.table{width:85%;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.column{width:33.33%;border-bottom:0 solid #e6ecf8;border-right:1px solid #e6ecf8}}@media (min-width:1200px){.container{max-width:1200px}.title{font-size:3em}.subtitle{font-size:1.5em}.content{width:40%;margin:0 auto}.ligned{display:-webkit-box;display:-ms-flexbox;display:flex}.table{width:75%;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.column{width:33.33%;border-bottom:0 solid #e6ecf8;border-right:1px solid #e6ecf8}}.boxes{--size:32px;--duration:800ms;height:calc(var(--size) * 2);width:calc(var(--size) * 3);position:relative;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transform-origin:50% 50%;transform-origin:50% 50%;margin-top:calc(var(--size) * 1.5 * -1);-webkit-transform:rotateX(60deg) rotateZ(45deg) rotateY(0) translateZ(0);transform:rotateX(60deg) rotateZ(45deg) rotateY(0) translateZ(0)}.boxes .box{width:var(--size);height:var(--size);top:0;left:0;position:absolute;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.boxes .box:nth-child(1){-webkit-transform:translate(100%,0);transform:translate(100%,0);-webkit-animation:box1 var(--duration) linear infinite;animation:box1 var(--duration) linear infinite}.boxes .box:nth-child(2){-webkit-transform:translate(0,100%);transform:translate(0,100%);-webkit-animation:box2 var(--duration) linear infinite;animation:box2 var(--duration) linear infinite}.boxes .box:nth-child(3){-webkit-transform:translate(100%,100%);transform:translate(100%,100%);-webkit-animation:box3 var(--duration) linear infinite;animation:box3 var(--duration) linear infinite}.boxes .box:nth-child(4){-webkit-transform:translate(200%,0);transform:translate(200%,0);-webkit-animation:box4 var(--duration) linear infinite;animation:box4 var(--duration) linear infinite}.boxes .box>div{--background:#5C8DF6;--top:auto;--right:auto;--bottom:auto;--left:auto;--translateZ:calc(var(--size) / 2);--rotateY:0deg;--rotateX:0deg;position:absolute;width:100%;height:100%;background:var(--background);top:var(--top);right:var(--right);bottom:var(--bottom);left:var(--left);-webkit-transform:rotateY(var(--rotateY)) rotateX(var(--rotateX)) translateZ(var(--translateZ));transform:rotateY(var(--rotateY)) rotateX(var(--rotateX)) translateZ(var(--translateZ))}.boxes .box>div:nth-child(1){--top:0;--left:0}.boxes .box>div:nth-child(2){--background:#145af2;--right:0;--rotateY:90deg}.boxes .box>div:nth-child(3){--background:#447cf5;--rotateX:-90deg}.boxes .box>div:nth-child(4){--background:#DBE3F4;--top:0;--left:0;--translateZ:calc(var(--size) * 3 * -1)}@-webkit-keyframes box1{0%,50%{-webkit-transform:translate(100%,0);transform:translate(100%,0)}100%{-webkit-transform:translate(200%,0);transform:translate(200%,0)}}@keyframes box1{0%,50%{-webkit-transform:translate(100%,0);transform:translate(100%,0)}100%{-webkit-transform:translate(200%,0);transform:translate(200%,0)}}@-webkit-keyframes box2{0%{-webkit-transform:translate(0,100%);transform:translate(0,100%)}50%{-webkit-transform:translate(0,0);transform:translate(0,0)}100%{-webkit-transform:translate(100%,0);transform:translate(100%,0)}}@keyframes box2{0%{-webkit-transform:translate(0,100%);transform:translate(0,100%)}50%{-webkit-transform:translate(0,0);transform:translate(0,0)}100%{-webkit-transform:translate(100%,0);transform:translate(100%,0)}}@-webkit-keyframes box3{0%,50%{-webkit-transform:translate(100%,100%);transform:translate(100%,100%)}100%{-webkit-transform:translate(0,100%);transform:translate(0,100%)}}@keyframes box3{0%,50%{-webkit-transform:translate(100%,100%);transform:translate(100%,100%)}100%{-webkit-transform:translate(0,100%);transform:translate(0,100%)}}@-webkit-keyframes box4{0%{-webkit-transform:translate(200%,0);transform:translate(200%,0)}50%{-webkit-transform:translate(200%,100%);transform:translate(200%,100%)}100%{-webkit-transform:translate(100%,100%);transform:translate(100%,100%)}}@keyframes box4{0%{-webkit-transform:translate(200%,0);transform:translate(200%,0)}50%{-webkit-transform:translate(200%,100%);transform:translate(200%,100%)}100%{-webkit-transform:translate(100%,100%);transform:translate(100%,100%)}}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}