/**{    border: thin solid red !important;  }*/


.html {
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: #000;
}

.body {
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: #000;
}

.layout {
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: #000;

}


.port-cont{

}

.portfolio-roster-app {
    height: 425px;
    border: thin solid whitesmoke !important;

    margin: 2.7% 0 0 0;
}

.portfolio-app {
    background-color: rgba(0,0,0,0);
    border-radius: 1px;
    /*     border: thin solid whitesmoke !important; */
}

.coin-form{
    padding: 1%;
    /*display: flex;*/
    /*justify-content: flex-start;*/
}

.remove-edit-btns{
    /*justify-self: flex-end;*/
    display: inline-block;
    right: 2%;
}

.coin-list {
    background-color: rgba(0,0,0,0);
    border-radius: 1px;
    /*border: thin solid whitesmoke !important;*/
    /*height: 200px;*/
    overflow-y: scroll;
    overflow-x: hidden;

}


.sum-container {
    height: 425px;
    margin: 5.5% 0 0 0;
    background-color: rgba(0,0,0,0);
    border-radius: 1px;
    border: thin solid whitesmoke !important;
}

.sum {
    padding: 0% 1% 2.5% 1%;
    width: 100%;
    text-align: center;
    font-size: 350%;
    color: whitesmoke;
    display: inline-block;
}

.graph-container {
    background-color: rgba(0,0,0,0);
    border-radius: 1px;
    border: thin solid whitesmoke !important;
}

.fiat-table-container {
    color: whitesmoke;
    background-color: rgba(0,0,0,0);
    border-radius: 1px;
    /*border: thin solid whitesmoke !important;*/

}

.navbar {
    /*display: flex;*/
    /*justify-content: flex-start;*/
    position: fixed;
    left: 0.7%;
    /*top: 2.7%;*/
    color: whitesmoke;
    background-color: rgba(0, 0, 0, 0);
}

.logo {
    width: 20%;
}

.ticker-button {
    /*     display: inline-block !important; */
         top: 1.7%;
         right: 1.7%;
    font-size: 170% !important;
    position: fixed;
    background-color: #000 !important;
    color: #fff !important;


}

.ticker-button:hover {
    background-color: #fff !important;
    color: #000 !important;
}

/*.coinEntryHeader{*/
    /*width: 100% !important;*/
    /*height: 100% !important;*/
    /*margin: auto;*/
    /*display: inline-flex;*/
    /*justify-content: space-between;*/

/*}*/

.tabs-nav {
    border: thin solid whitesmoke !important;
}

.tab {
    color: whitesmoke;
    font-size: 150%;
    -webkit-transition-duration: color 0.1s linear; /* Safari */
    transition: color 0.1s linear;
}

.tab-chosen {
    color: #000;
    font-size: 150%;
}

.tab:hover{
    color: #000 !important;

}

.coin-entry {
    /*display: flex;*/
    /*justify-content: space-between;*/
    /*align-content: center;*/
    border: thin solid whitesmoke !important;
    background-color: rgba(0, 0, 0, 0) !important;
}

.coinEntryHeader{
    color: whitesmoke;
    background-color: rgba(0, 0, 0, 0) !important;
    width: 100% !important;
    display: flex !important;
    justify-content: space-between !important;
    align-content: center !important;
}

.coinNameLong{
    font-size: 150%;
}

.allHeaderData {
    font-size: 150%;
}

.add-coin-btn {
    background-color: #000 !important;
    border: thin solid whitesmoke !important;
    -webkit-transition-duration: background-color 0.1s linear; /* Safari */
    transition: background-color 0.1s linear;
}

.add-port-btn {
    background-color: #000 !important;
    border: none;
    /*-webkit-transition-duration: background-color 0.1s linear; !* Safari *!*/
    /*transition: background-color 0.1s linear;*/
}

/*.add-port-btn:hover {*/
    /*background-color: rgba(0, 255, 0, 0.5) !important;*/
    /*border: thin solid whitesmoke !important;*/
/*}*/


.fiat-btn {
    width: 100%;
    height: 12%;
    text-align: auto;
    background-color: #000 !important;
    color: whitesmoke !important;
    -webkit-transition-duration: background-color 0.1s linear; /* Safari */
    transition: background-color 0.1s linear;
}

.fiat-btn:hover {
    background-color: #fff !important;
    color: #000 !important;
}

.add-port-gl {
    color: whitesmoke;
    -webkit-transition-duration: color 0.1s linear; /* Safari */
    transition: color 0.1s linear;
}

.add-port-gl:hover {
    color: #000 !important;
}

.add-coin-btn {
    background-color: #000 !important;
    border: thin solid whitesmoke !important;
    -webkit-transition-duration: background-color 0.1s linear; /* Safari */
    transition: background-color 0.1s linear;
}

.add-coin-btn:hover {
    background-color: rgba(0, 255, 0, 0.5) !important;
}

.add-coin-gl {
    color: whitesmoke;
    -webkit-transition-duration: color 0.1s linear; /* Safari */
    transition: color 0.1s linear;
}

.export-btn {
    background-color: #000 !important;
    border: thin solid whitesmoke !important;
    -webkit-transition-duration: background-color 0.1s linear; /* Safari */
    transition: background-color 0.1s linear;
}

.export-btn:hover{
    background-color: rgba(43, 144, 143, 0.86) !important;

}

.edit-name-btn{
    background-color: #000 !important;
    border: thin solid whitesmoke !important;
    -webkit-transition-duration: background-color 0.1s linear; /* Safari */
    transition: background-color 0.1s linear;
}

.edit-name-btn:hover{
    background-color: rgba(43, 144, 143, 0.86) !important;
}

.edit-name-gl {
    color: whitesmoke;

}

.remove-port-btn {
    background-color: #000 !important;
    border: thin solid whitesmoke !important;
    -webkit-transition-duration: background-color 0.1s linear; /* Safari */
    transition: background-color 0.1s linear;
}

.remove-port-btn:hover {
    background-color: rgba(255, 0, 0, 0.63) !important;
}

.remove-port-gl{
    color: whitesmoke;
}

.export-gl {
    color: whitesmoke;
}

.coin-header-menu-down {
    margin: 1.5% 0.5% 1% 0.4%;
    color: whitesmoke;
}

.tracking-label{
    color: whitesmoke;
}

.remove-button {
    margin: 0.3% 0.5% 0.5% 0.5%;
    background-color: #000 !important;
    border: thin solid whitesmoke !important;
    border-radius: 0;
    -webkit-transition-duration: background-color 0.1s linear; /* Safari */
    transition: background-color 0.1s linear;
}

.remove-button:hover{
    background-color: rgba(255, 0, 0, 0.63) !important;
}

.show-coin-chart-portfolio-button {
    margin: 0.3% 0.5% 0.5% 0.5%;
    border: thin solid whitesmoke !important;
    background-color: rgba(0, 0, 0, 0) !important;
    -webkit-transition-duration: background-color 0.1s linear; /* Safari */
    transition: background-color 0.1s linear;
}

.show-coin-chart-portfolio-button:hover{
    background-color: rgba(43, 144, 143, 0.86) !important;

}

.show-chart-gl{
    color: whitesmoke !important;
}

.coin-content{
    color: whitesmoke;
    width: 100% !important;
    border-radius: 1px !important;
    border: thin solid whitesmoke !important;
    background-color: rgba(0, 0, 0, 0) !important;
    display: flex !important;
    justify-content: flex-end !important;
    font-size: 120%;
    padding: 0.5%
}

.coinName {
    display: inline-block;
    font-weight: bolder !important;
}

.coinNameLong {
    display: inline-block;
    font-weight: bolder !important;
}

.toBTCRatioName {
    display: inline-block;
    font-weight: bolder !important;
}
.toBTCRatioValue {
    display: inline-block;
}
.toUSDRatioName {
    display: inline-block;
    font-weight: bolder !important;
}
.toUSDRatioValue {
    display: inline-block;
}
.remove-button {
   justify-self: right !important;
    align-self: right !important;
}

.coinQ {
    display: inline-block;
}

.usdName {
    display: inline-block;
    font-weight: bolder !important;
}

.btcValue {
    display: inline-block;
}

.btcName {
    display: inline-block;
    font-weight: bolder !important;
}

.usdValue {
    display: inline-block;
}

.coinEntryChangeDown {
    display: inline-block;
    color: #ff0000 !important;
}

.coinEntryChangeUp {
    display: inline-block;
    color: #00ff00 !important;
}

.ticker-container {
    border-radius: 1px !important;
    border: thin solid whitesmoke !important;
    background-color: rgba(0, 0, 0, 0) !important;
    color: whitesmoke;
    height: 850px;
    overflow-y: scroll;
    overflow-x: hidden;
}

.ticker-row{
    color: whitesmoke;
}

.ticker-row:hover{
    color: #000 !important;
}

.ticker-change-up {
    color: #00ff00;
}

.ticker-change-down {
    color: #ff0000;
}

.chosen-fiat{
    text-align: center;

    background-color: #ffffff;
    color: #000000;
}

.available-fiats{
    background-color: #000;
    text-align: center;

}

.available-fiats:hover{
    background-color: #fff !important;
    color: #000 !important;
}

/*.ticker-head {*/
    /*!*position: fixed;*!*/
    /*background-color: whitesmoke;*/
/*}*/

/* DayPicker styles */
/*i know this is a hack please dont hate me*/
.DayPicker {
    z-index:4;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    padding: 1rem 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}

.DayPicker-Month {
    display: table;
    border-collapse: collapse;
    border-spacing: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin: 0 1rem;
}

.DayPicker-NavBar {
    position: absolute;
    left: 0;
    right: 0;
    padding: 0 .5rem;
    top: 1rem;
}

.DayPicker-NavButton {
    position: absolute;
    width: 1.5rem;
    height: 1.5rem;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    cursor: pointer;
}

.DayPicker-NavButton--prev {
    left: 1rem;
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjI2cHgiIGhlaWdodD0iNTBweCIgdmlld0JveD0iMCAwIDI2IDUwIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIj4KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggMy4zLjIgKDEyMDQzKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDx0aXRsZT5wcmV2PC90aXRsZT4KICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPgogICAgPGRlZnM+PC9kZWZzPgogICAgPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc2tldGNoOnR5cGU9Ik1TUGFnZSI+CiAgICAgICAgPGcgaWQ9InByZXYiIHNrZXRjaDp0eXBlPSJNU0xheWVyR3JvdXAiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEzLjM5MzE5MywgMjUuMDAwMDAwKSBzY2FsZSgtMSwgMSkgdHJhbnNsYXRlKC0xMy4zOTMxOTMsIC0yNS4wMDAwMDApIHRyYW5zbGF0ZSgwLjg5MzE5MywgMC4wMDAwMDApIiBmaWxsPSIjNTY1QTVDIj4KICAgICAgICAgICAgPHBhdGggZD0iTTAsNDkuMTIzNzMzMSBMMCw0NS4zNjc0MzQ1IEwyMC4xMzE4NDU5LDI0LjcyMzA2MTIgTDAsNC4yMzEzODMxNCBMMCwwLjQ3NTA4NDQ1OSBMMjUsMjQuNzIzMDYxMiBMMCw0OS4xMjM3MzMxIEwwLDQ5LjEyMzczMzEgWiIgaWQ9InJpZ2h0IiBza2V0Y2g6dHlwZT0iTVNTaGFwZUdyb3VwIj48L3BhdGg+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4K");
}

.DayPicker-NavButton--next {
    right: 1rem;
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjI2cHgiIGhlaWdodD0iNTBweCIgdmlld0JveD0iMCAwIDI2IDUwIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIj4KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggMy4zLjIgKDEyMDQzKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDx0aXRsZT5uZXh0PC90aXRsZT4KICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPgogICAgPGRlZnM+PC9kZWZzPgogICAgPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc2tldGNoOnR5cGU9Ik1TUGFnZSI+CiAgICAgICAgPGcgaWQ9Im5leHQiIHNrZXRjaDp0eXBlPSJNU0xheWVyR3JvdXAiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAuOTUxNDUxLCAwLjAwMDAwMCkiIGZpbGw9IiM1NjVBNUMiPgogICAgICAgICAgICA8cGF0aCBkPSJNMCw0OS4xMjM3MzMxIEwwLDQ1LjM2NzQzNDUgTDIwLjEzMTg0NTksMjQuNzIzMDYxMiBMMCw0LjIzMTM4MzE0IEwwLDAuNDc1MDg0NDU5IEwyNSwyNC43MjMwNjEyIEwwLDQ5LjEyMzczMzEgTDAsNDkuMTIzNzMzMSBaIiBpZD0icmlnaHQiIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiPjwvcGF0aD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPgo=");
}


.DayPicker-Caption {
    display: table-caption;
    height: 1.5rem;
    text-align: center;
}

.DayPicker-Weekdays {
    display: table-header-group;
}

.DayPicker-WeekdaysRow {
    display: table-row;
}

.DayPicker-Weekday {
    display: table-cell;
    padding: .5rem;
    font-size: .875em;
    text-align: center;
    color: #8b9898;
}

.DayPicker-Body {
    display: table-row-group;
}

.DayPicker-Week {
    display: table-row;
}

.DayPicker-Day {
    display: table-cell;
    padding: .5rem;
    border: 1px solid #eaecec;
    text-align: center;
    cursor: pointer;
    vertical-align: middle;
}

.DayPicker-WeekNumber {
    display: table-cell;
    padding: .5rem;
    text-align: right;
    vertical-align: middle;
    min-width: 1rem;
    font-size: 0.75em;
    cursor: pointer;
    color: #8b9898;
}

.DayPicker--interactionDisabled .DayPicker-Day {
    cursor: default;
}

.DayPicker-Footer {
    display: table-caption;
    caption-side: bottom;
    padding-top: .5rem;
}

.DayPicker-TodayButton {
    border:none;
    background-image:none;
    background-color:transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: pointer;
    color: #4A90E2;
    font-size: 0.875em;
}

/* Default modifiers */

.DayPicker-Day--today {
    color: #d0021b;
    font-weight: 500;
}

.DayPicker-Day--disabled {
    color: #dce0e0;
    cursor: default;
    background-color: #eff1f1;
}

.DayPicker-Day--outside {
    cursor: default;
    color: #dce0e0;
}

/* Example modifiers */

.DayPicker-Day--sunday {
    background-color: #f7f8f8;
}

.DayPicker-Day--sunday:not(.DayPicker-Day--today) {
    color: #dce0e0;
}

.DayPicker-Day--selected:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside) {
    color: #FFF;
    background-color: #4A90E2;
}

/* DayPickerInput */

.DayPickerInput {
    display: inline-block;
}

.DayPickerInput-OverlayWrapper {
    position: relative;
}

.DayPickerInput-Overlay {
    left: 0;
    position: absolute;
    background: white;
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, .15);
    box-shadow: 0 2px 5px rgba(0, 0, 0, .15);
}