body {
    color: #222;
    margin: 0px;
    padding: 0px;
    font-family: Source Sans Pro, Helvetica, Ariel, sans-serif;
    font-size: 17px;
    background-color: #006dad;
    /*background: '/static/img/myplot_large_dark.png';*/
}

.site-info {
    margin-left: auto;
    margin-right: auto;
    max-width: 700px;
    padding-bottom: 50px;
}

.download-issue, .delete-article {
    margin-left: auto;
    margin-right: auto;
    max-width: 550px;
}

.main_content {
    background: #fff;
    /*padding: 0px 0px 50px;*/
    margin: 0px;
}

.hero {
    background-color: #0073b7;
    color: white;
    font-size: 14px;
    padding: 20px 0px;
    text-align: center;
}

.hero h1 {
    font-size: 30px;
    margin-bottom: 10px;
}

.hero a {
    /*color: white;*/
    font-size: 18px;

}

.hero-inner {
    max-width: 550px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 15px;
}

/*.download-form {*/
/*    margin-left: auto;*/
/*    margin-right: auto;*/
/*    width: 500px;*/
/*}*/

/*.update {*/
/*    margin-left: auto;*/
/*    margin-right: auto;*/
/*    width: 500px;*/
/*}*/

.form-control {
    max-width: 450px;
    text-align: center;
    display: inline-block;
    border-radius: 2px;
    font-size: 20px;
    padding: 20px;
}

.form-control-index {
    max-width: 85px;
    text-align: center;
    display: inline-block;
    border-radius: 2px;
    font-size: 18px;
    margin-left: 10px;
    margin-right: 10px;
    background-color: rgba(206, 226, 242, 0.98);
    padding: 1px
}

.issue-num {
    font-size: 18px;
}

.index-btn {
    text-decoration: none;
    display: block;
    width: 100%;
}

.index-btn1 {
    color: #fff;
    background-color: #364d9b;
    border-color: #060861;
}

.index-btn1:hover {
    color: #a954af;
    background-color: #fff;
}

.index-btn2 {
    color: #364d9b;
    background-color: #fff;
    border-color: #000;
}

.index-btn2:hover {
    color: #a954af;
    background-color: #364d9b;
    border-color: #000;
}


 @media only screen and (max-device-width: 976px) {
     .index-btn2 {
         margin-top: 10px;
     }
}

.form-control-admin {
    max-width: 350px;
    min-width: 200px;
    max-height: 50px;
    text-align: center;
    display: inline-block;
    border-radius: 2px;
    font-size: 20px;
    padding: 10px;
    margin-bottom: 10px;
}

.salt-stats {
    padding: 10px 0px;
    background-color: #ececec;
    text-align: center;
    border-bottom: 1px solid #d3d3d3;
    border-top: 1px solid #d3d3d3;
    /*margin-bottom: 15px;*/
}

.salt-stats .stat {
    display: inline-block;
    min-width: 120px;
    padding: 5px;
    font-size: 16px;
    color: #003d61;
}

.issue-list {
    max-width: 750px;
}

/*entered to allow commit!*/
.issue-list .sub-title {
    font-style: italic;
    text-align: center;
}

.issue-list h2 {
    font-size: 24px;
    font-weight: bold;
    alignment: center;
}

.issue-list .issue {
    border: 1px solid #d3d3d3;
    padding: 10px;
    background-color: #ecececb5;
    min-height: 45px;
    margin-top: 15px;
    color: black;
    margin-bottom: 15px;
}

.issue-list .issue .index {
    font-size: 20px;
}

.issue-list .issue a {
    color: #006dad;
}

.issue-list .issue .desc {
    font-size: 16px;
    font-weight: normal;
    font-style: italic;
}

.issue-list .issue .index .thumb img{
    display: block;
}

.all-issues {
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    color: #003d61;
    padding: 20px;
}

.all-issues.thumb img {
    alignment: center;
    padding: 20px;
}

img {
    width: 220px;
}

footer {
    margin-top: 10px;
    padding: 15px;
    text-align: center;
    color: white;
}

footer a {
    color: #0de3f2;
}

.error-msg {
    color: #b30000;
}

.upload-form {
    margin-top: 20px;
    margin-bottom: 20px;
    border-radius: 5px;
}

h2 {
    padding: 10px;
    text-align: center;
}

.upload-form button {
    text-align: center;
}

.upload-form {
    margin-left: auto;
    margin-right: auto;
    width: 600px;
    background-color: #c9c9c9;
    border: 1px solid grey;
    border-radius: 5px;
    padding: 10px 10px 20px;
    align-content: center;
}

.admin-form {
    margin-left: auto;
    margin-right: auto;
    width: 600px;
    background-color: #c9c9c9;
    border: 1px solid grey;
    border-radius: 5px;
    padding: 10px 10px 10px;
    align-content: center;
}
/*attempts below to centre the buttons do not work*/
.btn-admin {
    /*width: 400px;*/
    margin-bottom: 10px;
    /*display: inline-flex;*/
    justify-content: center;
    align-items: center;
    display: block;
    width: 100%;
}

.admin-title {
    width: 250px;
    display: inline-block;
    text-align: left;
    margin-right: 10px;
}

.admin-title-wide {
    width: 350px;
}

.form-control-msg {
    max-width: 450px;
    max-height: 70px;
    text-align: left;
}

 #article {
     width: 150px;
 }

 .user-update-form {
     margin-left: auto;
     margin-right: auto;
     width: 550px;
     background-color: #c9c3a5;
     border: 1px solid grey;
     border-radius: 5px;
     padding: 10px 10px 60px;
     align-content: center;
      }

 #original-user {
    color: blueviolet;
}

 .admin-title-user {
     width: 200px;
     font-size: 18px;
     display: inline-block;
     text-align: left;
     margin-right: 10px;
}

 .form-control-user-admin {
    max-width: 350px;
    min-width: 250px;
    max-height: 50px;
    text-align: center;
    display: inline-block;
    border-radius: 2px;
    font-size: 20px;
    padding: 10px;
    margin-bottom: 10px;
}

 #last-admin-form {
     margin-bottom: 20px;
 }

 .recent {
     padding-bottom: 80px;
 }

 .top-recent {
     /*padding-top: 80px;*/
     margin-top: 20px;
     padding-top: 20px;
 }

 .recent-box {
     margin-top: 40px;
     background-color: #ffffff9e;
     padding-bottom: 50px;
     padding-left: 20px;
     padding-right: 20px;
     border-radius: 5px;
     border: 3px solid #0073b7;;
 }
 /*.account {*/
 /*    max-width: 700px;*/
 /*    text-align: center;*/
 /*}*/

  /*CAN'T GET FOLLOWING TOOLTIP STUFF TO WORK*/
  /* Tooltip container */
/*.tooltip {*/
/*  position: relative;*/
/*  display: inline-block;*/
/*  border-bottom: 1px dotted black; !* If you want dots under the hoverable text *!*/
/*}*/

/*!* Tooltip text *!*/
/*.tooltip .tooltiptext {*/
/*  visibility: hidden;*/
/*  width: 120px;*/
/*  background-color: #555;*/
/*  color: #fff;*/
/*  text-align: center;*/
/*  padding: 5px 0;*/
/*  border-radius: 6px;*/

/*  !* Position the tooltip text *!*/
/*  position: absolute;*/
/*  z-index: 1;*/
/*  bottom: 125%;*/
/*  left: 50%;*/
/*  margin-left: -60px;*/

/*  !* Fade in tooltip *!*/
/*  opacity: 0;*/
/*  transition: opacity 0.3s;*/
/*}*/

/*!* Tooltip arrow *!*/
/*.tooltip .tooltiptext::after {*/
/*  content: "";*/
/*  position: absolute;*/
/*  top: 100%;*/
/*  left: 50%;*/
/*  margin-left: -5px;*/
/*  border-width: 5px;*/
/*  border-style: solid;*/
/*  border-color: #555 transparent transparent transparent;*/
/*}*/

/*!* Show the tooltip text when you mouse over the tooltip container *!*/
/*.tooltip:hover .tooltiptext {*/
/*  visibility: visible;*/
/*  opacity: 1;*/
/*}*/