/*layout
================================*/
section {
	margin: 30px 0;
}
p {
	margin: 15px 0;
}






/* Typography
================================================================*/

/*font size*/
body,
input,
button,
select,
textarea,
td, th {
	font-size: 16px;
}



/* Font Family */
body,
input,
button,
select,
textarea,
td, th
h3,
h4,
h5,
.roboto {
    font-family: 'Roboto', sans-serif;
}

h1,
h2,
.box-head,
.patua {
	font-family: 'Patua One', sans-serif;	
}
 
.logo,
.navbar-brand,
.fjalla {
	font-family: 'Fjalla One', sans-serif;  
}




/* Headings  */
h1 { 
	font-size: 30px;
	border-width: 0 0 0 0;
	margin: 30px 0; 
	padding: 0; 
	line-height: 30px;

}

h1 a {
	color: white;
}


h2 {
	font-size: 22px;
	/*font-weight: normal;*/
    margin: 15px 0;
    padding: 0;
 	/*height: 30px;*/
 	line-height: 30px;
}

h2.line {
	border-width: 0 0 1px 0;
	border-style: solid;
}

h2 a,
h2 span,
h2 label
{
	font-family: 'roboto';
	font-size: 16px;
	font-weight: normal;
	position: relative;
	top: -5px;	
}

h2 a {
	float: right;
	text-decoration: underline;
    padding-right: 10px;
    margin: 0 10px 0 0;
    border-right: 1px solid #000;  
    top: 0;	
}
h2 a:first-of-type {
    border-right: 0 none;
    padding-right: 0;
    margin-right: 0;
}
h2 form {
	display: inline-block;	
}

h3, h4 {
	font-size: 18px;
    font-weight: bold;
    margin: 30px 0 0 0;
    padding: 0;
    min-height: 30px;
    line-height: 30px;
}

h4 {
	font-size: 16px;
    margin: 15px 0 15px 0;

}



div > h1:first-child, 
div > h2:first-child, 
div > h3:first-child, 
div > h4:first-child, 
div > p:first-child
{
	margin-top: 0;
}

.first {
	margin-top: 0;
}
.only {
	margin-top: 0;
	margin-bottom: 0;
}
.last {
	margin-bottom: 0;
}




/* INPUTS
================================================================ */
/*all other inputs are in ecerts.css*/
input[type="number"] {
	border-radius: 3px;
    padding: 3px;
    border: 1px solid #ccc;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    color: #555;
}


.table-edit input[type="text"],
.table-edit input[type="number"] {
	width: 100%;
}

select, 
textarea, 
input[type="search"], 
input[type="password"],
input[type="text"],
input[type="number"] {
	background: #000;
	color: #bcbcbc;
	border: 1px solid #bcbcbc;
	
}
select:focus, 
textarea:focus, 
input[type="text"]:focus, 
input[type="search"]:focus, 
input[type="number"]:focus, 
input[type="password"]:focus {
    border-color: #508aff;
    box-shadow: 0px 0px 10px #508aff;
    outline: 0 none;
}

textarea { 
	width: 100%;
}



/* dynamic colors that arent really dynamic
================================================================ */

/*standard blue #3E61A3*/

/*Menu*/
.menubar-color 	{background-color:#3E61A3; color: #FFFFFF;}
.menubar-color li 	{border-color: #FFFFFF; }
.menubar-color a {color: #FFFFFF;}
/*Header*/
#pageHeading { border-color: #3E61A3; }
/*box*/
h2.line, 
.border-clrTblHeading	{border-color: 		#3E61A3;}
.box-head, 
table.box th	{background-color:	#3E61A3; border-color: #3E61A3; color: #ffffff; }
/*table*/
.table-head td, 
.table-head th, 
.clrTblHeading td, 
.clrTblHeading th,
#mobileSearchButtonWrap input { background-color: #3E61A3; color:#ffffff;}
.table-head a { color:#ffffff; }
/* Individual DB Colors*/
.colorMenuText			{color: 			#FFFFFF;}
.colorMenuBackGround	{background-color:	#3E61A3;}
.colorMenuBorder		{border-color:		#3E61A3;}
.colorTableText			{color: 			#ffffff;}
.colorTableHeading		{background-color:	#3E61A3;}
.colorTableBorder		{border-color:		#3E61A3;}




.gold {
	color: #e5be48;
}
.silver {
	color: #D3D3D3;
}




/* override ecertsResponsiveDesign
================================================================ */


.build-table > tbody tr, .table-buildlist > tbody tr {
    background-color: transparent;
}
.build-table tbody tr:nth-child(even), .table-buildlist tbody tr:nth-child(even) {
    background-color: rgba(0,0,0,.3);
}

.build-table th, .build-table td, .table-buildlist th, .table-buildlist td {
    border-right: 1px solid #222;
}
.table-buildlist > tbody tr:hover td {
	background-color:#000;	
	color: #fff;
}





.box,
.robsContainer {
	background-color: rgba(0, 0, 0, .8);
	color: white;
	padding: 30px;
	border-radius: 5px;
	width: auto;
	/*min-height: 90px;*/
	margin-bottom: 30px;
}

@media (max-width: 768px) {
	.box,
	.robsContainer {
		padding: 10px;
	}

}

.box-foot {
	padding: 0;
	color: #666;
	border-top: 1px solid #666;
}



a.button-defaultr {
	color: white;
	text-decoration: none;
}

a.button-defaultr:hover {
	text-decoration: underline;
	color: white;
}



select {
    -webkit-appearance: menulist !important; /*makes the dropdown have the little arrow*/
}

.mfp-bg {
    opacity: 0.95;
    background-color: #fff;
}


.popup-close-icon {
    position: absolute;
    top: 5px;
    right: 10px;
}


input[type="submit"], 
input[type="button"], 
button, 
a.button-default,
a.button-edit {
    background: #3e61a3;
    color: #fff;
    border-color: #4e76c0;
}
input[type="submit"]:hover, 
input[type="button"]:hover, 
button:hover, 
a.button-default:hover, 
a.button-edit:hover {
    background: #2f4a7d;
}

@media (max-width: 768px) {
	input[type="submit"],
	input[type="button"] {
		height: 30px;
		font-size: 14px
	}
	input[type="number"] {width: 66%;}
}


/* override bootstrap
================================================================ */

legend {
	display: inline;
	width: auto;
	padding: 0 5px;
	margin-bottom: 0;
	font-size: 16px;
	line-height: 1;
	color: #fff;
	border-bottom: 0;
}


fieldset {
	padding: 15px;
    margin-bottom: 15px;
    box-shadow: 0 0 0 #ccc;
    border: 1px solid #444;
    background-color: transparent;
}


























/* Layout 
================================================================*/

main.container {
	margin-top: 50px;
	z-index: 20;
	position: relative;

}

 
 
 
/* Headers
================================================================*/



header {
	z-index: 9;
	position: relative;
	margin: 0 20px;
}
header a {
	padding-left: 30px;
	position: relative;
	top: 30px;
}

header a:first-of-type {
	/*padding-left: 100px;*/
}

header .logo a {
	top: 0;
	padding-left: 0 !important;
}

.logo {
	font-family: 'Fjalla One', sans-serif;  
	float: left;
	font-size: 30px;
	vertical-align: bottom; 
	color: #016398;
	margin-top: 16px;
}


 
/* nav
================================================================ */
.rp-subnav {
	float: right;
}
.rp-subnav a {
	padding-left: 15px;
}




/* login
================================================================ */

/*.form-login{
    margin: auto;
    width: 300px;
    padding: 20px;
    background: rgba(255, 255, 255, 0.3) none repeat scroll 0 0;
	border-radius: 4px;
	 box-sizing: border-box;	 
	 color: white;   
}
.form-login h3 {
	margin: 0 0 15px 0;   
}
*/


/* Mobile
================================================================ */
@media (max-width: 768px) {


}




/* container
================================================================ */

.cards a {
	background-color: rgba(255, 255, 255, 0.8);
	text-align: center;
	padding: 50px 20px;
	border-radius: 5px;
}



/*.robsContainer2 {

	padding: 0 15px;
	width: auto;
	min-height: 90px;
	/*margin-bottom: 30px;
}
.robsContainer2 a {
	color: white;
}
*/



/* Achievments
================================================================ */
/*.activeGoal,
.nexteGoal {
	padding: 30px;
	font-weight: bold;
	color: white;
	border: 2px solid #005600;
	border-radius: 4px;
	text-align: center;
}
 */

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fceabb+0,fccd4d+50,f8b500+51,fbdf93+100;Orange+3D+%235 */
/*.gold {
	border: 2px solid #f8b500;
	background: rgb(252,234,187); 
	background: -moz-linear-gradient(-45deg, rgba(252,234,187,1) 0%, rgba(252,205,77,1) 50%, rgba(248,181,0,1) 51%, rgba(251,223,147,1) 100%); 
	background: -webkit-linear-gradient(-45deg, rgba(252,234,187,1) 0%,rgba(252,205,77,1) 50%,rgba(248,181,0,1) 51%,rgba(251,223,147,1) 100%); 
	background: linear-gradient(135deg, rgba(252,234,187,1) 0%,rgba(252,205,77,1) 50%,rgba(248,181,0,1) 51%,rgba(251,223,147,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=1 ); 
	font-weight: bold;
	padding: 40px 20px;
}
.gold h2 {
	font-size: 50px;
	color: white;
	-webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: #fff;	
    font-weight: bold;
}
*/

.achievments {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

.achievments > li {
	position: relative;
	display: block;
	margin: 15px 0;
	padding: 15px;
	padding-left: 100px;
	min-height: 66px;
	line-height: 1.2;
	background-color: #080c11;
	color: white;
	clear: both;
}

.achievments .unlockedText,
.achievments .desc {
	font-size: 14px;
	color: #777;
}

.achievments .unlockedText {
	float: right;
	text-align: right;
}


.achievments li.isAchievedxxxxx {
	color: #080c11;
	background: rgb(252,234,187); /* Old browsers */
	background: -moz-linear-gradient(-45deg, rgba(252,234,187,1) 0%, rgba(252,205,77,1) 50%, rgba(248,181,0,1) 51%, rgba(251,223,147,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(-45deg, rgba(252,234,187,1) 0%,rgba(252,205,77,1) 50%,rgba(248,181,0,1) 51%,rgba(251,223,147,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(135deg, rgba(252,234,187,1) 0%,rgba(252,205,77,1) 50%,rgba(248,181,0,1) 51%,rgba(251,223,147,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}

.achievments > li .badgeIcon {
	position: absolute;
	top: 1px;
	left: 1px;
}
.achievments > li .badgeIcon.screen {
	height: 64px;
	width: 64px;
	background-color: rgba(0,0,0,0.7);
}
.achievments > li.editBoxStyle .badgeIcon.screen {
	display: none;
}
.achievments > li.editBoxStyle .badgeIcon.lock {
    display: none;
}

.achievments > li .editImageLink {
	position: absolute;
	top: 70px;
	left: 15px;
}


/*.achievments li.isAchieved .badgeIcon {
	left: 1px;
}*/

/*.achievedOn {
	float: right;
}*/

.currentIcon {
   -webkit-text-stroke: 1px black;
	color: #F8B706;
}




/*h1 a,
h1 span,
h1 label
{
	font-family: 'roboto';
	font-size: 14px;
	font-weight: normal;
	position: relative;
	font-weight: bold;
}

h1 a {
	font-weight: normal;
	color: #999;
	text-decoration: underline;
    top: 0;	
}
h1 a:first-of-type {
    border-right: 0 none;
    padding-right: 0;
    margin-right: 0;
}
h1 i {
    font-size: 10px !important;
    padding: 0 5px;
    font-weight: normal;
	color: #999;

}*/

/*.completedButton {
	border: 1px solid #777;
	border-radius: 5px;
	padding: 10px;
	float: right;
	display: inline-block;
	position: absolute;
	right: 15px;
	top: 15px;
	color: #777;
	cursor: pointer;
}

.completedButton:hover {
	background-color: #080C11;
	color: #fff;
}
*/
a.unlock {
	text-decoration: none;
	font-size: 12px;
}


#fanfare {
	z-index: 99;
	position: fixed;
	top: 30%;
	left: 0px;
	height: 400px;
	line-height: 400px;
	width: 100%;
	background-color: yellow;
	border: 20px solid red;
	border-width: 20px 0;
	font-size: 120px;
	text-align: center;
	color: #000;
	font-family: 'Fjalla One', sans-serif;
}



.editWarn {
	color: #fff;
	border: 1px solid white;
	border-radius: 3px;
	padding: 0px 7px;
	text-decoration: none;
	margin-left: 5px;
}



/* HOME PAGE
================================================================ */

#quotes {
	position: absolute;
	top: 100px;
	left: 15px;
	width: 600px;
	font-style: italic;
	color: white;
	z-index: 9;
}

.bread {
	float: right;
	text-align: right;
}


h2.mod {
	margin-bottom: 15px;
}
a.mod-link {
	font-size: 35px;
	padding-right: 10px;
	color:#777; 
	text-decoration: none;
}

.focusIcon {
	float: right;
	color: white;
	text-decoration: none;
	font-size: 20px;
	border: 0;
}


h1 {
	height: auto;
}
.tagline {
	font-family: roboto;
	padding-left: 10px;
	font-size: 15px;
}

dt {
	margin-top: 15px;
}

a.strokeStar,
i.strokeStar {
	-webkit-text-stroke: 1px black; 
	color: #F8B706;
}


legend a {
	text-decoration: none;
}





/* BOOTSTRAP EXTEND
================================================================ */

.col-xlg-1, .col-xlg-2, .col-xlg-3, .col-xlg-4, .col-xlg-5, .col-xlg-6, .col-xlg-7, .col-xlg-8, .col-xlg-9, .col-xlg-10, .col-xlg-11, .col-xlg-12 {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}
@media (min-width: 1500px) {
  .col-xlg-1, .col-xlg-2, .col-xlg-3, .col-xlg-4, .col-xlg-5, .col-xlg-6, .col-xlg-7, .col-xlg-8, .col-xlg-9, .col-xlg-10, .col-xlg-11, .col-xlg-12 {
    float: left;
  }
  .col-xlg-12 {
    width: 100%;
  }
  .col-xlg-11 {
    width: 91.66666667%;
  }
  .col-xlg-10 {
    width: 83.33333333%;
  }
  .col-xlg-9 {
    width: 75%;
  }
  .col-xlg-8 {
    width: 66.66666667%;
  }
  .col-xlg-7 {
    width: 58.33333333%;
  }
  .col-xlg-6 {
    width: 50%;
  }
  .col-xlg-5 {
    width: 41.66666667%;
  }
  .col-xlg-4 {
    width: 33.33333333%;
  }
  .col-xlg-3 {
    width: 25%;
  }
  .col-xlg-2 {
    width: 16.66666667%;
  }
  .col-xlg-1 {
    width: 8.33333333%;
  }
}



a {
	color: #74A2F8;
	text-decoration: underline;
}
a:hover {
	color: #777;
}

h2.line, .border-clrTblHeading {
    border-color: #74A2F8;
}


.adminIcon {
	float:right; 
	font-size: 30px; 
	text-decoration: none;
}


fieldset {
	border: 1px solid white;
	border-radius: 5px;
}
legend {
	/*font-size: 14px;*/
}





/* DAILY FOOD
======================================================== */

.mainTable {
	width: 80%;
	margin: 0 auto;
}
.mainTable th {
	font-size: 20px;
	padding: 10px 0;
	border-bottom: 1px solid white;
}
.mainTable tfoot th {
	border-bottom: 0;
	border-top: 1px solid white;
}

select#foodID {
	width: 87%;
}

#addItemRow td {
	padding: 15px 0;
}


@media (max-width: 768px) {
	.mainTable {
		width: 100%;
	}
	#addItemButton {
		height: 30px;
		width: 30px;
		padding: 0;
	}
	#addItemRow td {
		padding-bottom: 0;
	}
	select#foodID {
		width: 95%;
	}
}

.nextprev {
	font-size: 83px;
	line-height: 42px;
	cursor: pointer;
	padding: 0 15px;
	text-decoration: none;
}
.nextprev:hover {
	text-decoration: none;
}
#datepicker {
	/*position: relative;*/
	/*top: -23px;*/
	width: 120px;
	text-align: center;
	padding: 0 5px;
}
.deleteItemIcon {
	color: #777;
	text-decoration: none;
	padding-left: 10px;
}

.todayExcitment {
	color: gold;
	font-size: 22px;
	line-height: 20px;
}


#quantityInput {
	width: 60px;
}




/* MISC
======================================================== */










/* PROFILE
======================================================== */
#profile {
	float: right;
	text-decoration: none;
}

.profileMainBox {
	width: 80% !important;
	float: right;
	height: 400px;
	background-color: #fff;
	border-radius: 20px;
	border: 5px solid black;
	text-align: center;
}


.profileMainBox img {
	padding-top: 20px;
}







/* MODULE
======================================================== */

.module textarea {
	width: 100%;
	height: 150px;
}



/* notice
======================================================== */
/*ecertsResponsiveDesing.css takes care of the rest of tis*/
.notification {
	z-index: 1;
}