html {background:url(".fancy5k/images/img/bg3.jpg")  no-repeat center fixed;background-size: cover;overflow-x: hidden;}
    
    .top {display: grid; grid-template-columns: 20% 60% 20%;border:0px solid green;margin-top:30px;}
        /* LEFT */
        h1 {font-family: 'Cormorant Garamond', serif;font-weight: 300;font-size:2.8vw;color:rgba(255,255,255,0.8);display:block;width:60%;background:url(.fancy5k/images/icons_hp/5Klogo.svg) no-repeat;background-position:left top;padding-left:5.6vw;margin:0 auto;}
        #date_time {display:block;font-family: 'Exo', sans-serif;font-size:1vw;color:white;text-align:center;line-height:2.5vw;}

        #clockContainer {position:relative;height:9vw;width:9vw;background: url(.fancy5k/images/icons_hp/clock.svg) no-repeat;background-size: 100%;margin: 0 auto;}
        #hour,#minute,#second {position: absolute;background: white;border-radius: 10px;transform-origin: bottom;}

        #hour {width: 1.8%;height: 25%;top: 25%;left: 48.85%;opacity: 0.8;}
        #minute {width: 1.6%;height: 30%;top: 19%;left: 48.9%;opacity: 0.8;}
        #second {width: 1%;height: 40%;top: 9%;left: 49.25%;opacity: 0.8;background:#c195aa;}

        #date_timer {display: inline-block;width:200px;margin-left:calc(50% - 100px);font-size:2vw;font-family: 'Exo', sans-serif;color:white;text-align:center;margin-top:10px;}
        #date_timer b {font-weight: 300;opacity:0.7;display:inline-block;width:6px;text-align:center;margin-right:1px;}
        #date_timer i {opacity:0.8;position: absolute;vertical-align: super;display:inline-block;font-size:1vw;margin-top:0.25vw;color:#c195aa;}

      /* CENTER */
      .apps {display: grid; grid-auto-flow: row; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 1vw 3vw; border-left:1px solid rgba(255,255,255,0.1);border-right:1px solid rgba(255,255,255,0.1);padding:0vw 3vw 0vw 3vw;}
        .app { background: linear-gradient(to bottom left, rgba(240, 247, 248, 0.05), rgba(219, 217, 226, 0.05));;text-align:center;position:relative;padding-top:2vw;border-radius:1vw;}
        .app a.appicon {width:4vw; height:4vw;display:block;position:relative;margin:0 auto;background-position:center;background-repeat:no-repeat;background-size: 50% 50%;transition:0.2s}
        .app span {color:rgba(255,255,255,0.7);display:inline-block;position:relative;margin:0.5vw auto;font-size:1vw;font-family: 'Exo', sans-serif;}

        .app:hover {background:rgba(255,255,255,0.2);box-shadow:0 2px 4px rgb(0 0 0 / 20%);}
        .app:hover.app span {color:white!important;}
        .app:hover.app a.appicon {background-size: 80% 80%;}

        .app.web .appicon {background-image:url(.fancy5k/images/icons_hp/NGINXlogo.svg);}
        .app.sql .appicon {background-image:url(.fancy5k/images/icons_hp/sql.svg);}
        .app.fileb .appicon {background-image:url(.fancy5k/images/icons_hp/fileb.svg);}
        .app.qbit .appicon {background-image:url(.fancy5k/images/icons_hp/bittorrent.svg);}
        .app.tss .appicon {background-image:url(.fancy5k/images/icons_hp/teamspeak.svg);}
        .app.focalboard .appicon {background-image:url(.fancy5k/images/icons_hp/focalboard.svg);}
        .app.excalidraw .appicon {background-image:url(.fancy5k/images/icons_hp/excalidraw.svg);}
        .app.syncvideo .appicon {background-image:url(.fancy5k/images/icons_hp/syncvideo.svg);}
        .app.sinusbot .appicon {background-image:url(.fancy5k/images/icons_hp/sinusbot.svg);}

      /* RIGHT */
      .right ul {padding:0;margin-left:2vw;}
      .right ul li {background:url(.fancy5k/images/icons_hp/folder.svg) left center no-repeat;list-style: none;padding-left:2.2vw;margin:1vw;opacity:0.8;}
      .right ul li:hover {transition:0.3s;transition-timing-function: ease;transform: scale(1.3) translate(8%, 0%);opacity:1;}
      .right ul li a {text-decoration: none;font-family: 'Exo', sans-serif;color:white;font-size:1.2vw;text-transform: uppercase;font-weight: bold;}



/****** GOOGLE BAR *******/

.gsc-control-cse.gsc-control-cse-fr {background:transparent!important;border:0px;padding:0vw 2vw;margin-top:2vw;} /* content bar */
    .gsc-search-box.gsc-search-box-tools {width:50%!important;margin-left:auto!important;margin-right:auto!important;margin-bottom:0;} /* BAR GOOGLE */
        #___gcse_0 form > table {margin-bottom:0!important;}

            td.gsc-input {padding:0!important;margin:0!important;line-height:40px;} /* PARTIE GAUCHE DE LA BAR (CONTENT) */

                #gsc-iw-id1 {border:0;background:rgba(255,255,255,0.2);border-radius:1vw 1vw 1vw 1vw;} /* BAR DESIGN */
                    #gs_tti50 {padding:0vw 1vw 0vw 1vw;} /* Content de l'input */
                        #gsc-i-id1 {background:transparent!important;font-family: 'Exo', sans-serif;font-weight:600;color:white;} /* INPUT */
                    #gs_st50 {padding:0vw 1vw 0vw 0vw!important;} /* Content du boutton annulation (crois) */
                        #gs_st50 a {padding:0;display:block;height:40px;} /* Content du boutton annulation (crois) */
                            #gs_st50 a span {line-height:40px;} /* Content du boutton annulation (crois) */

            .gsc-search-button button {width:2.7vw;height:2.7vw;padding:0;background-image:url(.fancy5k/images/icons_hp/search.svg);background-position:center;background-repeat:no-repeat;background-size:60% 60%;background-color:transparent;border-radius:5vw;border:0;transition:200ms;} /* BUTTON */
                .gsc-search-button button svg {display:none;}
.gsc-search-button button:hover {background-image:url(.fancy5k/images/icons_hp/search.svg);background-position:center;background-repeat:no-repeat;background-size:70% 70%;background-color:rgba(255,255,255,0.1);}

/* Propal */
.gstl_50.gssb_c {background:rgba(255,255,255,0.2);width:30%;box-shadow:0 2px 4px rgb(0 0 0 / 20%);border-radius:1vw;backdrop-filter: blur(10px);}
    .gsc-completion-container {background:transparent!important;border:0!important;box-shadow:none!important;padding:0.46vw;color:rgba(255,255,255,0.7);}
        .gsc-completion-container b {color:white;background:transparent;}
    .gsc-completion-container > tbody > tr:last-of-type {display:none}

    .gsc-completion-container > tbody > tr.gsc-completion-selected {background:rgba(0,0,0,0.4 );border-radius:0.3vw;}
    .gsc-completion-container > tbody > tr.gsc-completion-selected td {border-radius:0.3vw;}

    body > table > tbody > tr > td.gssb_e {box-shadow:none!important;}


/******** RESULTATS ***********/
.gsc-tabsArea {border-bottom:1px solid rgba(255,255,255,0.1)!important;}
.gsc-tabsArea div.gsc-tabHeader.gsc-inline-block.gsc-tabhActive {background:rgba(255,255,255,0.2)!important;border-radius:4px 4px 0px 0px;}
.gsc-tabsArea div.gsc-tabHeader.gsc-tabhInactive.gsc-inline-block {background:rgba(255,255,255,0.1)!important;border-radius:4px 4px 0px 0px;}

#___gcse_0 > div > div > div > div.gsc-above-wrapper-area > table > tbody > tr > td.gsc-orderby-container > div > div.gsc-option-menu-container.gsc-inline-block > div.gsc-selected-option-container.gsc-inline-block {background:rgba(255,255,255,0.3);color:white;}
.gsc-above-wrapper-area {border:0!important;}
.gsc-results.gsc-webResult {width:100%;}
    

.gsc-expansionArea > .gsc-webResult.gsc-result {background:rgba(255,255,255,0.04);padding:0.7vw 8vw 0.7vw calc(70px + 4vw);position:relative;width:60%;margin:0.2vw auto;border:0;border-radius:1vw;}
.gsc-expansionArea > .gsc-webResult.gsc-result:hover {background:rgba(255,255,255,0.08)!important;}

.gsc-expansionArea > .gsc-webResult.gsc-result .gsc-url-top {position:absolute;top:0.7vw;} /* URL */
.gsc-expansionArea > .gsc-webResult.gsc-result .gsc-url-top span {color:#68b000;font-family: 'Exo', sans-serif;}

.gsc-expansionArea > .gsc-webResult.gsc-result .gsc-thumbnail-inside {padding-top:20px;} /* TITLE */
.gsc-expansionArea > .gsc-webResult.gsc-result .gsc-thumbnail-inside .gs-title * {color:#45a2e9;font-family: 'Exo', sans-serif;font-weight:600;}
.gsc-expansionArea > .gsc-webResult.gsc-result .gsc-table-result div {color:rgba(255,255,255,0.7);font-family: 'Exo', sans-serif;}

.gsc-expansionArea > .gsc-webResult.gsc-result .gs-image-box.gs-web-image-box {position:relative;margin-left:-80px;margin-top:-40px;}
.gsc-expansionArea > .gsc-webResult.gsc-result .gs-image-box.gs-web-image-box a {border:0px;opacity:50%;}

/* Pagination */
.gsc-cursor-page {background:rgba(255,255,255,0.1)!important;border-radius:10vw;width:22px;height:22px;line-height:22px;display:inline-block!important;padding:0px;font-size:16px;margin:0px 2px!important;text-align:center}
.gsc-cursor-page.gsc-cursor-current-page {background:rgba(255,255,255,0.3)!important;width:28px;height:28px;line-height:28px;}