/*FractalFramework.com*/
/*fonts*/
@font-face{font-family:'philum'; src:url('/fonts/philum.eot?iefix') format('eot'),url('/fonts/philum.woff?v9') format('woff'),url('/fonts/philum.svg#philum') format('svg'),url('/fonts/philum.ttf') format('truetype');}
@font-face{font-family:'microsys'; src:url('/fonts/microsys4.eot?iefix') format('eot'),url('/fonts/microsys4.woff') format('woff'),url('/fonts/microsys4.svg') format('svg'),url('/fonts/microsys4.ttf') format('truetype');}
@font-face{font-family:'Ubuntu'; src:url('/fonts/Ubuntu.eot?iefix') format('eot'),url('/fonts/Ubuntu.woff') format('woff'),url('/fonts/Ubuntu.svg') format('svg');}
@font-face{font-family:'Lato-Black'; src:url('/fonts/Lato-Black.eot?iefix') format('eot'),url('/fonts/Lato-Black.woff') format('woff'),url('/fonts/Lato-Black.svg') format('svg');}
*,*:before,*:after{box-sizing:border-box;}
/*elements*/
body{font-family:Arial,Verdana,sans-serif; border:0; margin:30px 0 0 0; padding:0; height:100%;}
a{cursor:pointer; text-decoration:none;}
p{margin:12px 0;}
h1,h2,h3,h4{font-family:'Ubuntu'; color:#424242; padding:5px;}
h1{font-weight:normal; text-shadow:3px 1px 2px #AFAFAF;}
h1 a{color:#424242;}
h1 a:hover{color:#000000;}
h2{font-weight:normal;}
h2 a{color:#424242;}
h2 a:hover{color:#000000;}
h3{font-weight:normal;}
h3 a{color:#424242;}
h3 a:hover{color:#000000;}
h4{font-weight:normal; padding:5px;}
h4 a{color:#424242;}
h4 a:hover{color:#000000;}
button,form{margin:0;}
form{display:inline-block;}
code{word-wrap:break-word; font-size:14px;}
label{margin:10px 4px; font-size:small; font-family:Arial; color:#747474;}
pre{font-family:inherit; white-space:pre-wrap; word-wrap:break-word; margin:0;}
table{margin:0px; border:1px solid #ebebeb; border-collapse:collapse; width:100%; overflow-x:auto;}
tr:nth-of-type(2n){background:rgba(0,0,0,0.02);}
tr:hover{background:rgba(0,100,200,0.05);}
td,th{padding:2px 4px; vertical-align:top; border-style:solid; border-width:0 1px 1px 0; border-color:#ddd;}
th{font-weight:bold; font-size:smaller; text-align:left;}
tr{background:none;}
blockquote{margin:0; padding:10px; background:#eee;}
img{border:0; max-width:100%;}
hr{border-width:1px;}
ul,ol{}
input, .inp{border:1px solid #dfdfdf; padding:4px 6px; margin:2px 1px; font-size:small;}
input:hover,input:focus{border-color:#aaaaaa;}
label.uplabel input[type=file]{position:fixed; top:-100px;}/*upload*/
input[type=range]{border:0; vertical-align:middle; background:none;}
input[type=range]:after,input[type=range]:before{position:absolute; top:1em; color:#aaa;}
input[type=range]:before{left:0em; content:attr(min);}
input[type=range]:after{right:0em; content:attr(max);}
input[type=text],textarea{width:100%; max-width:600px;}
input.error{border:1px solid red;}
textarea,select{background-color:#fff; font-family:Arial; font-size:small; border-width:1px; border-style:solid; padding:2px 6px; margin:1px 0; width:100%;}
textarea:hover,select:hover,textarea:focus,select:active{border-color:#aaaaaa;}
button{cursor:pointer; border-width:0px; background:none; padding:0;}
form{padding:0px; margin:0px;}
/*classes*/
#page{padding:0; margin:0 12px;}
#wrapper{padding:0;}
.container{width:100%; margin:0;}
.topbar{position:fixed; z-index:1; width:100%; top:0; border-bottom:1px solid #c1c8cd;box-shadow:0 0 13px rgba(0,0,0,0.1); background:white;}
.navigation{position:relative; width:calc(100% - 32px); margin:0px 16px;}
.navigation .bub span{margin:2px 0;}
/*.hfixer{margin:40px 0 0 0;}*/
/*bootstrap*/
.tlex{font-family:microsys; color:#ff0000; text-shadow:0 0 1px #000000; font-size:18px; line-height:22px;}
.tlex:hover{text-shadow:1px 1px 1px #000000; color:red; text-decoration:blink;}
.active{color:#bd0000;}
.active a:hover{color:#1da1f2;}
.justify{text-align:justify;}
.menus{color:#424242; list-style-type:none;}
.menus a{color:#424242;}
.menus a:hover{color:#000000;}
.menus li a{display:block;}
.alert,.valid{color:#424242; background-image:linear-gradient(#eaeaea,#fafafa); font-size:14px; border-width:1px; border-style:solid; padding:5px 8px; border-radius:4px; margin:7px 0;}
.alert{border-color:#ddaaaa;}
.valid{border-color:#aaddaa;}
.small{font-family:Arial; font-size:smaller;}
.small a{color:#aaaaaa;}
.small a:hover{color:#424242;}
.xsmall{font-family:Arial; font-size:x-small;}
.nfo{font-family:Arial; font-size:small; background-color:white; padding:4px; margin:4px;}
.console{font-family:Lucida Console,Courier New; background-color:#2F2F2F; border-left:4px solid #000; word-wrap:break-word; color:#fff; border:0; padding:10px;}
.editor{font-family:Lucida Console,Courier New; word-wrap:break-word;}
.editon{border:1px dashed grey; padding:10px;}
.editoff{border:1px dashed rgba(0,0,0,0); padding:10px;}
.nbp{color:#000000; font-size:smaller; line-height:140%;}
.nbp a{color:#000000;}
.nbp a:hover{color:#000000;}
.nbp a{background-color:#eaeaea; border-color:#aaaaaa; padding:0 3px; border-style:solid; border-width:1px;}
.nbp a:hover,.nbp .active{background-color:#ffffff; border-color:#aaaaaa;}
.nbp input,.nbp select{color:#000000; background-color:#eaeaea; border-color:#aaaaaa;}
.nbp input:hover,.nbp select:hover{color:#000000; background-color:#eeeeee; border-color:#aaaaaa;}
/*list*/
.list{color:#444; min-width:140px; text-align:left;}
.list a{display:block; padding:4px 6px; border:none; box-shadow:none;}
.list a:hover{background-color:#0088e6; color:white;}
.list a.active{background-color:#ffffff; color:#0079cc;}
.list a:hover.active{background-color:#0088e6; color:white;}
.list a:hover.del{background-color:#c82020; color:white;}
/*btn*/
.btn,.btsav,.btdel,.btok{color:#000000; border-width:0px; border-color:#d3d3d3; font-family:Arial,sans-serif; margin:2px 1px; padding:4px 6px; border-radius:3px; border-style:solid; line-height:26px; font-size:15px;}
/*.btn:active{background-image:linear-gradient(#50b8fa,#aff8fa);}*/
.btn{border-radius:4px; color:#555;}
.btn:hover,.btn.active{background:#ffffff;}
.btsav,.btdel,.btok{border-width:0px; border-style:solid; text-align:center; min-width:100px;}
.btsav{color:#222;}
.btsav:hover{background-color:#0088e6; color:#fff;}
.btdel{color:#222;}
.btdel:hover{background-image:linear-gradient(#c82020,#a80000); color:#fff;}
.btok{background-image:linear-gradient(#50b8fa,#0079cc); color:#fff; border:0; font-size:14px; padding:3px 6px;}
/*.btok:hover{background-image:linear-gradient(#50b8fa,#0079cc); color:#222;}*/
.btsav:hover .pic,.btdel:hover .pic,.btok:hover .pic{color:white;}
/*.btxt{margin:10px 0;}*/
a.btxt{text-decoration:none; color:#424242;}
a.btxt:hover{text-decoration:none; color:#1da1f2;}
.board,.article,.desktop{font-size:1em; color:#292f33; padding:15px; border:1px solid #e1e8ed; border-radius:5px; background-color:#fff; margin:10px 0;}
.board-sans{font-size:small; color:#292f33; margin:15px 0;}
.article{padding:4px; margin:5px;}
.article a.btxt{color:#1da1f2;}
.article a.btxt:hover{text-decoration:underline; color:#1da1f2;}
.board{font-size:14px;}
.btit{font-family:Ubuntu; font-size:1.2em; display:block; font-size:16px; color:#555; padding:7px; text-shadow:3px 1px 2px #AFAFAF;}
a.btit{text-decoration:none;}
a.btit:hover{text-decoration:none; background:background-color:rgba(0,0,0,0.1);}
a.btlk{text-decoration:none; color:#1da1f2;}
a.btlk:hover{text-decoration:underline;}
.imbtn{padding:5px 6px 4px 7px; margin:0px 0px;}
.connbt{background:white; border:1px solid #cfcfcf; border-radius:4px; display:inline-block;}
/*.imbtn:hover{filter:invert(100%); background:gray;}*/
/*bootstraps*/
.menu{padding:0px;}
.menu:hover{background:#ffffff;}
.tit,.txt,.txth{color:#292f33; background-color:white; border:1px solid white; padding:8px 12px; margin:4px 0; width:100%;}
.tit:focus,.txt:focus{border:1px dashed grey;}
.tit{font-size:1.2em; text-shadow:3px 1px 2px #AFAFAF;}
.txt,.txth{background:white; margin-top:5px;}
.txth{height:360px; overflow-y:auto;}
.stit{font-size:14px; font-family:Ubuntu; color:#292f33; border-color:#e1e8ed; padding:10px 0;}
.stit .pic{font-size:18px;}
.stxt{margin:5px 0;}
.search input{border:1px solid white;}
.search input:hover,.search input:focus{color:black;}
.stabilo{background-color:rgba(255,230,0,0.8);}
.bold{font-weight:bold;}
.red{color:#bd0000;}
.hide{display:none;}
.grey{color:#979797;}
.grey a{color:#979797; text-decoration:none;}
.grey a:hover{color:#000;}
a.grey:hover{color:#000;}
.grey .pic{color:#979797;}
.grey:hover .pic{color:#000;}
.date{color:#979797; font-size:small;}
.left{float:left;}
.right{float:right;}
.tright{text-align:right;}
.fix{position:fixed;}
.fixright{position:fixed; right:0;}
.pad{padding:4px;}
.pad2{padding:10px;}
.scroll{overflow-y:auto; overflow-x:hidden; word-wrap:break-word; max-height:401px;}
.cell{display:table-cell; vertical-align:top;}
.cell2{display:table-cell; vertical-align:top; min-width:100px;}
.row{display:table-row;}
.inline{display:inline;}
.clear{clear:both;}
.bkg{background:rgba(0,0,0,0.2);}
.r1{background:rgba(255,255,255,0.1);}
.r2{background:rgba(0,0,0,0.05);}
.opac{opacity:0.5;}
.abs{position:absolute;}
.text{background:white; padding:10px;}
.cols{columns:auto 280px; -moz-columns:auto 280px;}
.cols .profile{display:inline-block;}
.shadow{box-shadow:0 0 4px #aaa;}
.textshadow{text-shadow:2px 2px 3px #222;}
.textshadow_white{text-shadow:2px 2px 3px #fff;}
.imgshadow{filter:drop-shadow(2px 2px 1px rgba(0,0,0,.4));}
.imgshadow_white{filter:drop-shadow(0 0 2px rgba(255,255,255,1));}
.invert{filter:invert(1);}
/*.pane*/
.pane,.paneb,.panec,.paned{font-size:14px; color:#292f33; background-color:white; margin:0; padding:10px; border:0; box-sizing:border-box; box-shadow:0;}
.pane{border-bottom:1px solid #e6ecf0;}
.pane:hover{background-color:#f5f8fa;}
.pane img{border-radius:4px;}
.paneb{box-shadow:none; border:1px solid #e1e8ed; margin:0;}
.panec{box-shadow:none; padding:0; width:auto; border:0px solid #e1e8ed; margin:0;}
.panec img{border-radius:6px 6px 0 0; border-bottom:1px solid #e1e8ed;}
.panec img.artim{border-radius:6px;}
.panec .pncxt{padding:4px 12px 8px; line-height:1.3em; max-width:590px;}
.panec h3{margin:0px 7px;}
.paned{margin:0 0 10px 0;}
/**/
.smtitle{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.help{border:1px solid #dfdfdf; padding:0px 2px; border-radius:12px;
background-image:linear-gradient(#fcfcfc,#eee);}
.helpxt{font-size:13px; line-height:18px; padding:10px; border:1px solid #aaa; background-image:linear-gradient(#fcfcfc,#eee);}
/*icon*/
.icon{border-color:#aaaaaa; float:left; font-size:small; overflow:hidden; text-align:center; width:90px; height:70px; padding:0 4px; margin:2px; word-wrap:break-word;}
.icon:hover{display:block;}
/*bicon*/
.bicon,.cicon{text-align:center; width:120px; height:90px; padding:4px;
margin:0px; display:inline-block; word-wrap:break-word; overflow:hidden;
transition:all 0.2s linear; font-size:14px;}
.bicon span,.cicon span{display:block;}
.bicon .pic,.cicon .pic{font-size:32px;}
.cicon{width:90px; height:90px; margin:0; font-size:12px;}
.cicon:hover{box-shadow:0px 0px 0px #aaa;}/* background:#3b88c3; color:#fff;*/
.cicon .pic{font-size:2em;}
.cicon:hover .pic{text-shadow:0 0 2px #ffffff;}
/*licon*/
.licon{padding:6px 0px; margin:0px; display:block; word-wrap:break-word; transition:all 0.2s linear; font-size:1em; background:#ffffff;}
.licon:hover,.licon.active{background:#e6ecf0; color:black;}
/*.licon span{display:inline-block;}*/
.licon img{margin:0 10px 0 0;}
/*popup*/
#popup{text-decoration:none;}
.popup{box-shadow:0 1px 4px rgba(0,0,0,0.4); border:1px solid silver; border-radius:2px;}
.popa{padding:4px 0px; background:#ddd; border-bottom:1px solid silver; cursor:move;}
.popu{padding:5px 5px; background:white;}
.popub{padding:0px; background:#ddd;}
/*pagup*/
.pagup{position:fixed; width:100vw; height:100vh; background-color:rgba(0,0,0,0.55);}
.pagu{bottom:0; left:0; position:fixed; right:0; text-align:center; top:0;}
.pagu::before{content:""; display:inline-block; height:100%; vertical-align:middle;}
.pgu{position:relative; display:inline-block; vertical-align:middle; margin:auto; text-align:left; word-wrap:break-word; background:white; margin:16px; max-width:600px; max-height:calc(100% - 32px); overflow-x:hidden; overflow-y:auto;}
.imgu{bottom:0; left:0; overflow-x:hidden; overflow-y:auto; position:fixed; right:0; text-align:center; top:0; width:100vw;}
.imgu::before{content:""; display:inline-block; height:100%; vertical-align:middle;}
.imu{position:relative; display:inline-block; vertical-align:middle; margin:auto; background-color:rgba(255,255,255,0.6);}
.imu img{box-shadow:0 0 40px rgba(0,0,0,0.95);}
.abbt{background:white; color:#292f33; border:0; padding:5px 7px; border-radius:0; margin:0; line-height:28px;}
.abbt:hover{background-image:linear-gradient(#e5e5e5,#f4f4f4); color:#1da1f2;}
.abbt:hover .pic{color:#1da1f2;}
/*bubble*/
.bubble{box-shadow:0 1px 4px rgba(0,0,0,0.2); border-radius:2px; border:0px solid silver;
margin:0 10px 0 0; padding:0; display:inline-block; max-width:440px;}
/*#cbklg{min-width:140px;}
#cbklg a{display:block;}
#cbklg a:hover{background:#e1e1e1;}
.pgu #cbklg a{padding:4px 0;}*/
.bub{font-family:Arial,sans-serif; background:#fff; z-index:1; display:inline-block; color:#222;}
.bub a{display:inline-block; padding:3px 6px 3px; color:#222; margin:0px 0; font-size:15px;}
.bub a:hover{color:#555; background:#e5e5e5;}
.bub a:hover img{filter:invert(10%);}
.bub a:hover .pic{color:#555;}
.bub a.active{color:#fff; background:#0088e6;}
.bub a.active .pic{color:#fff;}
.bub a.active img{filter:invert(0%);}
.bub a.btn{color:#000; display:block;}
.bub a.btn:hover{color:#000;}
.bub a.btn img{filter:invert(0%);}
.bub .ico{display:inline-block; min-width:22px;}
/*.bub div{display:inline-block;}*/
.bub.ablock{min-width:140px;}
.bub.ablock a{display:block;}
.bub.ablock .inline a{display:inline-block;}
.bub img{filter:invert(0%);}
.bub .popub{min-width:140px; background:none;}
.bubu{padding:0; background:white;}
.bubu a{}
/*popup bub*/
.popup .bub{background:#ddd; color:#000; box-shadow:none;}
.popup .bub a{color:#444;}
.popup .bub a:hover{background:#ddd; color:#444;}
.popup .bub img{filter:invert(0%);}
.popup .bub a:hover img{filter:invert(0%);}
#closebub{position:fixed; top:0; left:0; z-index:2;}
/*admin*/
.closepage{position:fixed; padding:0px; right:20px;}
/*pictos*/
.philum{color:#424242; font-family:'philum'; font-weight:normal; font-size:16px;}
.microsys{color:#424242; font-family:'microsys'; font-weight:normal; font-size:20px;}
.latobold{font-family:'Lato-Black'; font-weight:normal; font-size:24px;}
a.active .philum{color:#bd0000;}
.philum:hover{color:#000;}
.pic{font-size:1em; padding:2px; margin:0 2px;}
a .pic{color:#292f33; text-decoration:none; font-size:14px;}
a .pic.grey{color:#979797;}
a .pic:hover,a.active .pic{color:#000;}
a .del:hover{color:white; background-color:#e81c4f;}
a .red:hover{color:#e81c4f;}
/*responsive*/
@media screen and (max-device-width: 990px), screen and (max-width: 990px){
h2{font-size:x-large;} .react{display:inline-block;}}
@media screen and (max-device-width: 640px), screen and (max-width: 640px){
#page{padding:0; margin:36px 4px;}
h2{font-size:large;} .react{display:none;}
.pgu{min-width:calc(100% - 120px); width:auto;}}
|
Download
