/*
 * Globals
 */

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #909;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #909;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #909;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #909;
}

/* Links */
a,
a:focus,
a:hover {
  color: #fff;
}

.popup
{
	display: none;
	position:fixed;
	margin: auto auto auto auto;
	width:80%;
	height:80%;
}

.imgmessage {color:red;}
.readOnly
{
 color:white;
 background:none;
 width:100%;
 font-size:2rem;		
 border: none;
}

.readWrite
{
 background:white;
 color:black;
 width:100%;
 border: 1px solid black;
}

.existingimagediv
{
	overflow:hidden;
	height:auto;
	padding-bottom:.3em;
	padding-top:.3em;
	border-bottom:4px dotted #ec008c;
}
.existingimagedivnote
{
	height:auto;
	/*border:4px solid red;*/
	float:right;
}
.existingdiv
{
	height:auto;
	min-height:250px;
	padding:25px;
	border-radius:25px;
	border:4px solid #ec008c;
}
.existingimage
{
	border-radius:4px;
	border:1px solid #ddd;
	background-color:white;
	padding:4px;
}

.lead
{
 font-size:2rem;
}
.imageerror
{
	display:none;
	background-color:#ec008c;
	padding: 10px 10px 10px 10px;
	border-radius:10px;
	text-align:left;
	margin-bottom:10px;

}
/* Custom default button */
.table-default
{
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
}
.inputlabel > p
{
	position:relative;
}
.inputlabel
{
	width:100%;
	vertical-align:middle;
	line-height:1rem;
	font-size: 2rem;
}
.inputcontainer
{
	width:100%;
	font-size: 2rem;
	height: auto;
}
.inputlabel,.inputcontainer
{
	/*border:1px solid red;*/
	display:block;
	float:left;
	box-sizing: border-box;
	padding:10px 10px 10px 10px;
	font-weight: bold;
}
.input-default
{
  text-align:center;
  font-weight: bold;
  border:none;
  border-bottom:2px solid #c9c9c9;
  transition: border 0.3s;
  background-color: transparent;
  color: white;
}
.imageupload .btn-file {
    overflow: hidden;
    position: relative;
}
.imageupload .btn-file input[type="file"] {
    cursor: inherit;
    display: block;
    font-size: 100px;
    min-height: 100%;
    min-width: 100%;
    opacity: 0;
    position: absolute;
    right: 0;
    text-align: right;
    top: 0;
    border-bottom: none;
}

.btn {
    color: black;
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}
label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: 700;
}
.btn-default,
.btn-default:hover,
.btn-default:focus {
  color: #333;
  text-shadow: none; /* Prevent inheritance from `body` */
  background-color: #ccc;
  border: 1px solid #fff;
  margin-left:10px;
  margin-right:10px;
}

.noback {
    margin-bottom: 20px;
    background-color: transparent;
    /*border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05);*/
    border:none;
}

/*
 * Base structure
 */

html,
body {
  height: 100%;
  background-color: #333;
  background-color: #ec008c;
}
body {
  color: #fff;
  text-align: center;
  text-shadow: 0 1px 3px rgba(0,0,0,.5);
}

/* Extra markup and styles for table-esque vertical and horizontal centering */
.site-wrapper {
  display: table;
  width: 100%;
  height: 100%; /* For at least Firefox */
  min-height: 100%;
  -webkit-box-shadow: inset 0 0 100px rgba(0,0,0,.5);
          box-shadow: inset 0 0 100px rgba(0,0,0,.5);
}
.site-wrapper-inner {
  display: table-cell;
  vertical-align: top;
}
.cover-container {
  margin-right: auto;
  margin-left: auto;
}

/* Padding for spacing */
.inner.cover
{
  background-color:#00a0e8;
  border-radius:25px;
  padding: 25px 25px 25px 25px;
  min-height:75%;
}

/*
 * Header
 */
.masthead-brand {
  margin-top: 0.3rem;
  margin-bottom: 0.3rem;
}

.masthead-nav > li {
  display: inline-block;
}
.masthead-nav > li + li {
  margin-left: 20px;
}
.masthead-nav > li > a {
  padding-right: 0;
  padding-left: 0;
  font-size: 2rem;
  font-weight: bold;
  color: #fff; /* IE8 proofing */
  color: rgba(255,255,255,.75);
  border-bottom: 2px solid transparent;
}
.masthead-nav > li > a:hover,
.masthead-nav > li > a:focus {
  background-color: transparent;
  border-bottom-color: #a9a9a9;
  border-bottom-color: rgba(255,255,255,.25);
}
.masthead-nav > .active > a,
.masthead-nav > .active > a:hover,
.masthead-nav > .active > a:focus {
  color: #fff;
  border-bottom-color: #fff;
}

/* mobile */
@media screen and (min-width: 200px) and (max-width: 1024px)
{
 .imgmessage { font-size:4rem; }
 #nopic > h3 { font-size:4rem; }
 .readOnly,.readWrite {font-size:3.5rem;}
 .existingimage {max-width:30%;}
 .existingimagedivnote { width:60%; }
 .existingimagedivnotetitle { font-size:3.5rem; }
 .whirl .blade,.whirl { font-size:4rem; }
 .completeupload { font-size:4rem; }
 .btn-edit { font-size:3rem;}
 .btn-default { font-size:4rem; white-space: normal; font-weight: bold;}
 .cover .btn-lg { font-size:4rem; margin-top:3rem; margin-bottom:10rem; margin-left:4rem; margin-right:4rem; white-space:normal;}
 .thumbnail { min-width:30rem; }
 .imageerror { font-size:3rem; }
 .cover-heading {font-size:6rem;}
 .inner h3 { font-size:5rem;}
 .inner > p { font-size:4rem;}
 .masthead-brand { font-size:4rem; }
 .nav {display:none;}
 .input-default { font-size: 4rem; width:95%; margin-bottom:2em;}
 .inputlabel { font-size: 4rem; margin-top:1em; line-height:4rem;}
 .inputcontainer { font-size: 4rem;}
 .lead { font-size:4rem; }
}


/*desktop*/
@media screen and (min-width: 1024px)
{
 .imgmessage { font-size:2rem; }
 #nopic > h3 { font-size:4rem; }
 .existingimage {max-width:30%;}
 .readOnly,.readWrite {font-size:2rem;}
 .existingimagedivnote { width:60%; }
 .existingimagedivnotetitle { font-size:3rem; }
 .whirl .blade,.whirl { font-size:3em; }
 .completeupload { font-size:2em; }
 .input-default { width:80%; }
 .cover .btn-lg { font-size:2rem;}
 .inner { padding: .3rem; }
 .inner h3,.inner > p { font-size:3rem; }
 .btn-default { font-size:2rem; white-space: normal; font-weight: bold;}
}

/*
@media (max-width: 768px) {
 .table-default > tbody > tr > td
 {
  style:block;
 }
 .thumbnail
 {
  max-width: 30rem;
 }
 .imageerror
 {
   font-size:2rem;
 }
 .btn
 {
   font-size:2.2rem;
 }
 .table-default > tbody > tr > td
 {
   font-size:2rem;
 }
 .inputlabel > p
 {
  top:0em
  font-size:1.5em
 }
 .inputlabel,.inputcontainer
 {
  font-size:1.5rem;
 }
 .input-default
 {
   font-size:1.5rem;
   width:100%;
 }
 .lead
 {
   clear:both;
   font-size:3rem;
 }
 .lead >a
 {
   font-size:0.8rem;
 }
 .cover-heading
 {
   font-size:4rem;
 }
 .masthead-brand
 {
    float: left;
 }
 .masthead-nav
 {
    float: right;
 }
}
*/


/*
 * Cover
 */

.cover {
  padding: 0 20px;
}
.cover .btn-lg {
  padding: 10px 20px;
  font-weight: bold;
  min-width:20%;
  min-height:20%;
}


/*
 * Footer
 */

.mastfoot {
  color: #999; /* IE8 proofing */
  color: rgba(255,255,255,.5);
}


/*
 * Affix and center
 */

/*
@media (min-width: 768px) {
  .masthead {
    position: fixed;
    top: 0;
  }
  .mastfoot {
    position: fixed;
    bottom: 0;
  }
  .site-wrapper-inner {
    vertical-align: middle;
  }
  .masthead,
  .mastfoot,
  .cover-container {
    width: 100%; 
  }
}

@media (min-width: 992px) {
  .masthead,
  .mastfoot,
  .cover-container {
    width: 700px;
    width: 90%;
  }
}
*/