@import "https://cdn.jsdelivr.net/npm/bulma@0.9.4/css/bulma.min.css";
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&family=Ubuntu:wght@700&display=swap');

/* b43834 */

html{
    background-color: #212121;
    font-family: 'Montserrat', sans-serif;
}

body{
    font-family: 'Montserrat', sans-serif;
    padding-bottom: 50px;
}

.dockistry{
    font-family: 'Ubuntu', sans-serif;
    line-height: 2.5rem;
}

.navbar{
    background: linear-gradient(90deg, rgba(243, 229, 171, 1) 0%, rgba(243, 216, 171, 1) 100%);
    box-shadow: 0 2px 4px 0 rgba(0,0,0,.2);
    font-size: 20px;
}

.navbar-brand a{
    color: #212121;
    font-weight: bold;
    margin-left: 5px;
    display: flex;
    margin: auto;
    margin-left: 10px;
}

.navbar-hover:hover{
    background-color: #212121;
}

.navbar-hover:hover .nav-icon {
    color: rgba(243, 216, 171, 1);
}

.shadow{
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.5); 
	-webkit-box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.5); 
	-moz-box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.5);
}

.container{
    margin-top: 70px;
}

.doc-container{
    width: 90%;
    margin: auto;
    margin-top: 20px;
}

.card{
    color: white;
    background-color: #303030;
    border-radius: 10px;
    overflow: hidden;
    transition: all .2s ease-in-out;
}

.card:hover{
    color: white;
    background-color: #424242;
    border-radius: 10px;
    transform: scale(1.05);
}

.media-content{
    overflow: hidden;
}

.title{
    color: white;
}

.subtitle{
    color: white;
}

.on-click-show{
    display: none;
}

.card .media:not(:last-child){
    margin-bottom: 0;
}

.white-button{
    color: #212121;
    background-color: white;
    border: 0;
}

.white-button:hover{
    color: #212121;
    background: linear-gradient(90deg, rgba(243, 229, 171, 1) 0%, rgba(243, 216, 171, 1) 100%);
}

.blue-button{
    color: #212121;
    background: linear-gradient(90deg, rgba(243, 229, 171, 1) 0%, rgba(243, 216, 171, 1) 100%);
    border: 0;
}

.blue-button:hover{
    background: rgba(243, 216, 171, 1) 100%;
}

.tags .is-white{
    background: white;
    color: #212121;
}

.tags .is-blue{
    color: #212121;
    background: linear-gradient(90deg, rgba(243, 229, 171, 1) 0%, rgba(243, 216, 171, 1) 100%);
}

.tag.is-blue{
    color: #212121;
    background: linear-gradient(90deg, rgba(243, 229, 171, 1) 0%, rgba(243, 216, 171, 1) 100%);
}

.tags:not(:last-child){
    margin-bottom: 0;
}

.link{
    color: rgba(243, 216, 171, 1)
}

.link:hover{
    color: white;
}

.research{
    float: right;
    width: 20px;
}

.blue-input{
    background-color: rgba(243, 216, 171, 1);
    border-radius: 10px;
    border-width: 2px;
    color: #212121;
    border-color: #212121;
}

.blue-input:hover{
    border-color: #212121;
}

.blue-input::placeholder{
    color: #212121;
}

.nav-icon{
    color: #212121;
    font-size: 20px;
}

.project{
    float: right;
    font-size: 20px;
    font-weight: bold;
}

.button{
    font-size: 15px;
    border-radius: 10px;
}

.edit-buttons{
    float: right;
    margin-top: -30px;
}

.full-width{
    width: 100%;
}

.dark-button{
    background-color: #303030;
    color: white;
    border-radius: 10px;
    border-width: 0;
}

.dark-button:hover{
    color: white !important;
}

.filter{
    font-size: 20px;
}

.separateur {
    height: 10px;
    width: 30%;
    background: linear-gradient(90deg, rgba(243, 229, 171, 1) 0%, rgba(243, 216, 171, 1) 100%);
    border-radius: 5px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    transition: width 0.5s;
}

.card:hover .separateur {
    background: linear-gradient(90deg, rgba(243, 229, 171, 1) 0%, rgba(243, 216, 171, 1) 100%);
    width: 100%;
    border-radius: 0;
}

.separateur.sc {
    height: 10px;
    width: 30%;
    background-image: linear-gradient(90deg, #FF512F 0%, #F09819 100%);
    border-radius: 5px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    transition: width 0.5s;
}

.card:hover .separateur.sc {
    background-image: linear-gradient(90deg, #FF512F 0%, #F09819 100%);
    width: 100%;
    border-radius: 0;
}

.separateur.us {
    height: 10px;
    width: 30%;
    background-image: linear-gradient(90deg, #11998e 0%, #38ef7d 100%);
    border-radius: 5px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    transition: width 0.5s;
}

.card:hover .separateur.us {
    background-image: linear-gradient(90deg, #11998e 0%, #38ef7d 100%);
    width: 100%;
    border-radius: 0;
}

.separateur.wiki {
    height: 10px;
    width: 30%;
    background-image: linear-gradient(90deg, #021B79 0%, #0575E6 100%);
    border-radius: 5px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    transition: width 0.5s;
}

.card:hover .separateur.wiki {
    background-image: linear-gradient(90deg, #021B79 0%, #0575E6 100%);
    width: 100%;
    border-radius: 0;
}

.separateur.doc {
    height: 10px;
    width: 30%;
    background-image: linear-gradient(90deg, #93291E 0%, #ED213A 100%);
    border-radius: 5px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    transition: width 0.5s;
}

.card:hover .separateur.doc {
    background-image: linear-gradient(90deg, #93291E 0%, #ED213A 100%);
    width: 100%;
    border-radius: 0;
}

.separateur.rep {
    height: 10px;
    width: 30%;
    background-image: linear-gradient(90deg, #2a0845 0%, #6441A5 100%);
    border-radius: 5px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    transition: width 0.5s;
}

.card:hover .separateur.rep {
    background-image: linear-gradient(90deg, #2a0845 0%, #6441A5 100%);
    width: 100%;
    border-radius: 0;
}

.separateur.default {
    height: 10px;
    width: 30%;
    background-image: linear-gradient(90deg, white 0%, white 100%);
    border-radius: 5px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    transition: width 0.5s;
}

.card:hover .separateur.default {
    background-image: linear-gradient(90deg, white 0%, white 100%);
    width: 100%;
    border-radius: 0;
}

.separateur.tp {
    height: 10px;
    width: 30%;
    background-image: linear-gradient(90deg, #B24592 0%, #F15F79 100%);
    border-radius: 5px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    transition: width 0.5s;
}

.card:hover .separateur.tp {
    background-image: linear-gradient(90deg, #B24592 0%, #F15F79 100%);
    width: 100%;
    border-radius: 0;
}

.separateur.pt {
    height: 10px;
    width: 30%;
    background-image: linear-gradient(90deg, #000428 0%, #004e92 100%);
    border-radius: 5px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    transition: width 0.5s;
}

.card:hover .separateur.pt {
    width: 30%;
    background-image: linear-gradient(90deg, #000428 0%, #004e92 100%);
    width: 100%;
    border-radius: 0;
}

.separateur.app {
    height: 10px;
    width: 30%;
    background-image: linear-gradient(to right, #4facfe 0%, #00f2fe 100%);
    border-radius: 5px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    transition: width 0.5s;
}

.card:hover .separateur.app {
    width: 30%;
    background-image: linear-gradient(to right, #4facfe 0%, #00f2fe 100%);
    width: 100%;
    border-radius: 0;
}

.separateur.web {
    height: 10px;
    width: 30%;
    background-image: linear-gradient(to right, #f78ca0 0%, #f9748f 19%, #fd868c 60%, #fe9a8b 100%);
    border-radius: 5px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    transition: width 0.5s;
}

.card:hover .separateur.web {
    width: 30%;
    background-image: linear-gradient(to right, #f78ca0 0%, #f9748f 19%, #fd868c 60%, #fe9a8b 100%);
    width: 100%;
    border-radius: 0;
}

.logo{
    height: 2.5rem;
}

.navbar-item a:hover{
    color: black !important;
}

.error404{
    color: white;
    font-weight: bolder;
    font-size:8vw;
    text-align: center;
}

.desc404{
    color: white;
    font-weight: bolder;
    font-size:4vw;
    text-align: center;
}

button{
    font-family: 'Montserrat', sans-serif;
}

.modal-card-body{
    background-color: #212121;
    padding-bottom: 0;
}

.modal-card-head{
    background: linear-gradient(90deg, rgba(243, 229, 171, 1) 0%, rgba(243, 216, 171, 1) 100%);
    font-weight: bolder;
    border: 0;
}

.modal-card-title{
    color: #212121;
}

.modal-card-foot{
    background-color: #212121;
    border: 0;
    justify-content: center;
}

.label{
    color: white;
}

.form-input{
    background-color: #424242 !important;
    border: 0;
    border-radius: 10px;
    color: white;
}

.form-input::placeholder{
    color: lightgray;
}

textarea {
    resize: none !important;
    height: 100px !important;
}

option{
    color: white;
    background-color: #424242;
}

.select{
    width: 100% !important;
}

select{
    width: 100%;
    background-color: #424242 !important;
    color: white !important;
    border: 0 !important;
    border-radius: 10px !important;
}

.select::after{
    border-color: white !important;
}

.modal-content{
    background-color: #212121;
    padding: 20px;
    overflow: hidden;
}

.confirm-button{
    width: 100%;
}

.margin-right{
    margin-right: 10px;
}

.login-container{
    margin: auto;
    margin-top: 100px;
    display: block;
    width:500px;
    max-width: 100%;
    text-align:center;
    padding: 20px;
    background-color: #303030;
    border-radius: 10px;
}

.login-logo{
    height: 150px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.no-bottom{
    margin-bottom: 0 !important;
}

.modal-card{
    border-radius: 10px;
}

#filter{
    background-color: #303030 !important;
}

#particles-js{
    position: fixed;
    z-index: -1;
    width: 100%;
    height: 100%;
}

.type-tag{
    margin-top: -3px;
}

.default-tag{
    background-color: white;
    color: black !important;
}

.sc-tag{
    background-image: linear-gradient(90deg, #FF512F 0%, #F09819 100%);
    color: white !important;
}

.us-tag{
    background-image: linear-gradient(90deg, #11998e 0%, #38ef7d 100%);
    color: white !important;
}

.rep-tag{
    background-image: linear-gradient(90deg, #2a0845 0%, #6441A5 100%);
    color: white !important;
}

.doc-tag{
    background-image: linear-gradient(90deg, #93291E 0%, #ED213A 100%);
    color: white !important;
}

.wiki-tag{
    background-image: linear-gradient(90deg, #021B79 0%, #0575E6 100%);
    color: white !important;
}

.tp-tag{
    background-image: linear-gradient(90deg, #B24592 0%, #F15F79 100%);
    color: white !important;
}

.pt-tag{
    background-image: linear-gradient(90deg, #000428 0%, #004e92 100%);
    color: white !important;
}

.app-tag {
    background-image: linear-gradient(to right, #4facfe 0%, #00f2fe 100%);
    color: black !important;
}

.web-tag {
    background-image: linear-gradient(to right, #f78ca0 0%, #f9748f 19%, #fd868c 60%, #fe9a8b 100%);
    color: black !important;
}

.no-margin-bottom{
    margin-bottom: 0 !important;
}

.control.has-icons-left .input:focus ~ .icon, .control.has-icons-left .select:focus ~ .icon, .control.has-icons-right .input:focus ~ .icon, .control.has-icons-right .select:focus ~ .icon{
    color: #212121;
}

.control.has-icons-left .icon,
.control.has-icons-right .icon{
    color: #212121;
}

.table{
    background: none;
    color: white;
}

.table th{
    color: white;
}

.share-button{
    display: block;
    margin: auto;
}

#share-link{
    color: white;
    background-color: #303030;
    border: 0;
    border-radius: 10px;
    font-weight: bold;
    padding: 10px;
    width: 100%;
}

.splash-screen{
    width: 100%;
    height: 100%;
    position: fixed;
    background: linear-gradient(90deg, rgba(243, 229, 171, 1) 0%, rgba(243, 216, 171, 1) 100%);
    z-index: 200;
    margin-top: -70px;
}

.splash-elements{
    width: 200px;
    height: 600px;

    position:absolute;
    top:50%;
    left:50%;
    margin-left:-100px;
    margin-top:-200px;
}

.splash-icon{
    width: 100%;
}

.splash-loader{
    margin-top: 30px !important;
    width: 90%;
    display: block;
    margin: auto;
}

.progress:indeterminate{
    background-image: linear-gradient(to right,#212121 30%,white 30%);
    background-color: white;
}

.splash-text{
    color: white;
    font-weight: bold;
    font-size: 23px;
    text-align: center;
    margin-top: -18px;
}

.install-button{
    margin-top: 20px;
    background: linear-gradient(90deg, rgba(243, 229, 171, 1) 0%, rgba(243, 216, 171, 1) 100%);
    font-weight: bold;
    color: white;
    border-radius: 10px;
    border: 0;
    font-size: 15px;
}

.install-button:hover{
    background: linear-gradient(90deg, rgba(243, 229, 171, 1) 0%, rgba(243, 216, 171, 1) 100%);
    color: white;
}
*
.downloads{
    text-align: center;
}

.delete{
    background-color: #212121 !important;
    border-radius: 10px;
    height: 30px;
    width: 30px;
    min-height: 30px;
    min-width: 30px;
    max-height: 30px;
    max-width: 30px;
}

.delete:hover{
    background-color: #c90202 !important;
}

.notification.is-danger{
    background-color: #c90202 !important;
    border-radius: 10px;
    margin-top: 30px;
}

.button.is-danger{
    background-color: #c90202 !important;
}

#copy-button{
    margin-top: 5px;
}

.page-title{
    text-align: center;
    margin-top: 20px;
}