@font-face {
   font-family: merriweatherReg;
   src: url(../fonts/merriweather.regular.ttf);
}

.widget {
    position: absolute;
    z-index: 10;
    background: #dce3e8;
    background: radial-gradient(circle,rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.89) 100%);
    border: 2px solid #2f2f2f;
    border-radius: 5px;
}

.widget p, .widget label{
    padding: 5px;
    text-shadow: 1px 1px 3px #0000003f;
}

.widget h1 {
    font-size: 1rem;
    font-family: merriweatherReg;
    color: black;
}

.widget h2 {
    font-size: .9rem;
    font-family: merriweatherReg;
    color: black;
}

.widgetheader {
    margin: 0px;
    padding: 3px;
    cursor: move;
    z-index: 10;
    background: #6b92b5;
    background: linear-gradient(180deg,rgba(107, 146, 181, 1) 6%, rgba(128, 165, 196, 1) 39%, rgba(192, 209, 209, 1) 90%);
    /* border: 1px solid #2f2f2f; */
    border-radius: 3px 3px 0px 0px;
}

.widgetheader p{
    margin: 0px;
    padding: 0px;
    left: 0%;
    text-align: left;
}

.minBut {
    float: right;
    border: none;
    border-radius: 4px;
    box-sizing: border-box;
    color: transparent;
    min-height: 13px;
    min-width: 17px;
    background: rgb(148, 165, 173);
    background-repeat: repeat;
    background-image: none;
    box-shadow: inset -1px -1px rgb(12, 21, 28), inset 1px 1px rgb(240, 248, 255), inset -2px -2px rgb(53, 77, 97);
}

.maxBut {
    float: right;
    margin-left: 4px;
    border: none;
    border-radius: 4px;
    box-sizing: border-box;
    color: transparent;
    min-height: 13px;
    min-width: 17px;
    background: rgb(148, 165, 173);
    background-repeat: repeat;
    background-image: none;
    box-shadow: inset -1px -1px rgb(12, 21, 28), inset 1px 1px rgb(240, 248, 255), inset -2px -2px rgb(53, 77, 97);
}

.closeBut {
    float: right;
    margin-left: 4px;
    border: none;
    border-radius: 4px;
    box-sizing: border-box;
    color: transparent;
    min-height: 13px;
    min-width: 17px;
    background: rgb(231, 145, 145);
    background-repeat: repeat;
    background-image: none;
    box-shadow: inset -1px -1px rgb(28, 12, 12), inset 1px 1px rgb(247, 226, 226), inset -2px -2px rgb(82, 42, 42);
}

/* widget specific style */

/* fortuneCookie */
#FCmessage{
    font-size: 1rem;
}

/* bingo  */
.bingo{
    margin: auto;
    padding: 0px;
    margin-left: 50px;
    width: 300px; /* I'm tired of mkaing this adaptable */
    height: 300px;
    display: grid;
    grid-template-columns: repeat(5, 20%);
    grid-template-rows: repeat(5, 20%);;
}

/* juniper.exe */
.scratchArea {cursor: -webkit-grab; cursor: grab;}


/* imagewidget */

.imageWidget {
    width: auto; 
    /* height: auto; */
    padding: 0px;
    margin: 0px !important;
    background-color: rgb(0, 0, 0);
}

.imageWidget div{
    width: auto; 
    /* height: auto; */
    /* padding: 0px; */
    margin: 0px;
}

.imageWidget img{
    display: block;
    height: auto;
    margin: 0px;
    border-radius: 0px 0px 3px 3px;
}

/* commwidget */

.imageStack {
    position: absolute;
    top: 0;
    left: 0;
}