/* CSS Document */
/*
	COLORS:
	Dark Teal  #01545b
	Light Teal #116d76

	Yellow     #ffdc72
	Mint       #b7e1d8
	Light Mint #e7f3ef
*/

body { font-family: 'Lato', sans-serif; }

/**** FLASH MESSAGES ****/
.frontend #flash { position: fixed; top: 120px; z-index: 1000; width: 100%; }
#flash div.message { height: 44px; }
div.message.success { background: #e4efec; }
div.message.error { background: #ffdc72; color: #333; }

div.message.success:before { color: #666; font-family: Georgia, serif; padding: 12px 15px 12px 9px; }
.modal-body div.message { margin: -15px -15px 15px; height: 44px; }
#flash div.message.error:before,
.modal-body div.message.error:before { padding: 9px 16px 14px 6px; font-weight: bold; }
form .input.error { position: relative; }
form .input.error .error-message { position: absolute; top: 0; right: 5px; font-size: 0.875rem; color: #C3232D; }
form .input.error input { margin-bottom: 1rem; }


/**** MODALS ****/
.modal h4.modal-title { padding-bottom: 0; margin-bottom: 0; border-bottom: 0; color: #222; font-weight: 600; }
.modal .modal-header .close { margin-bottom: 0; }
.modal .modal-header { padding: 15px 15px 10px calc(15px + 0.9375rem); background: #ffdc72; border-radius: 6px 6px 0 0; }
.modal .modal-body div.message.error { margin: -15px -15px 20px; }
.modal .modal-footer { background: #f9f9f9; border-radius: 0 0 6px 6px; padding: 15px calc(15px + 0.9375rem); }
.modal .modal-body .tab-content { margin-top: 10px; }
.modal .modal-body ul.nav-tabs { margin-right: 1.1rem; }
.modal .modal-footer .btn { font-size: 16px; padding: 10px 20px; text-transform: uppercase; font-weight: bold; letter-spacing: 0.04em; }
.modal .modal-footer .btn-primary { background: #77c2b2; border-color: #77c2b2; }
.modal .modal-footer .btn-primary:hover { background: #69ab9d; border-color: #69ab9d; }


/**** FORM FIELDS ****/
input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], 
input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea { box-shadow: none; border-radius: 3px; }

.checkbox { margin-bottom: 20px; }
.checkbox input[type="checkbox"] { width: 30px; height: 30px; margin-left: 0; opacity: 0.01; border-radius: 5px; margin-bottom: 10px; }
.checkbox label { line-height: 1.2em; margin-left: 0 !important; padding-left: 40px; position: relative; font-size: 0.95rem; padding-top: 6px; }
.checkbox label:before { content: ''; display: block; position: absolute; top: 0; left: 0; width: 30px; height: 30px; background: #fff; border: 1px solid #aaa; border-radius: 4px; }
.checkbox input[type="checkbox"]:checked + label:before { content: "✕"; font-size: 26px; color: #57a292; font-weight: bold; text-align: center; line-height: 1; padding-left: 0; }


.container .columns:first-child { padding-left: 0; }
.container .columns:last-child { padding-right: 0; }
body > .container > .columns:first-child { padding-left: 2rem; }
body > .container > .columns:last-child  { padding-right: 2rem; }

.gb_section, .gb_row { clear: both; }
.gb_section:after, .gb_row:after { display: block; content: ' '; clear: both; }

/* NAVBAR */
nav.navbar { background: #ffdc72; opacity: 0.95; margin-bottom: 0; border: 0; height: 100px; max-width: 1400px; border-radius: 0 0 30px 0; }
nav.navbar .navbar-brand { padding: 0 15px; }
@media (min-width:768px) { nav.navbar ul.navbar-nav { float: right; height: 100px; margin-right: 20px; } }
nav.navbar .navbar-nav > li { height: 100%; }
nav.navbar .navbar-nav > li > a { color: #000; font-size: 22px; font-weight: bold; text-transform: uppercase; height: 100%; line-height: 70px; padding-left: 20px; padding-right: 20px; }
nav.navbar .navbar-nav > li > a:hover,
nav.navbar .navbar-nav > li > a:active { background: rgba(0,0,0,0.1); }
.navbar-inverse .navbar-toggle { border-color: #01545b; }
.navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover { background-color: #e5c667; }
@media (max-width:767px) {
	#mobile-nav { background-color: rgba(255,220,115,0.95); width: 66.6%; margin-left: calc(33.4% + 15px); border-radius: 0 0 0 15px; }
	#mobile-nav ul > li > a { line-height: 3em; text-align: center; letter-spacing: 0.08em; }
}
#givingbox-logo { height: 220px; }
button:hover, button:focus, .button:hover, .button:focus { background-color: #e5c667; }

#content { margin-top: 100px; }
#content:after { display: block; content: ' '; clear: both; }

#footer { background: #ffdc72; padding: 60px 0 20px; text-align: center; }
#footer img.social-media { width: 40px; height: 40px; }
#footer:after { display: block; content: ' '; clear: both; }
#footer ul.nav { margin-left: 0; margin-top: 0px; }
#footer ul.nav > li > a { text-transform: uppercase; font-weight: bold; color: #000; padding-top: 5px; padding-bottom: 5px; letter-spacing: 0.05em; }
#footer ul.nav > li > a:hover { background: none; }
#footer h3 { font-size: 16px; font-weight: bold; color: #000; text-transform: uppercase; letter-spacing: 0.05em; }
#footer a { color: #000; font-weight: bold; }
#footer input { border: 0; box-shadow: none; width: 80%; margin: 0 auto; border-radius: 15px 15px 0 0; font-size: 18px; padding: 5% 3%; text-align: center; }
#footer input[type="submit"] { border-radius: 0 0 15px 15px; background: #eee; padding: 3% 3%; font-weight: bold; text-transform: uppercase; font-size: 16px; }
#footer input[type="submit"]:hover { background: #e6e6e6; }

/* CELLS */
.cells { margin: -0.75%; }
.cells:after { clear: both; content: ' '; display: block; }
.cells .cell { float: left; width: 8.5%; min-width: 59.5px; margin: 0.75%; padding-left: 12px; padding-right: 12px; text-align: center; border-radius: 0; line-height: 2.2em; font-weight: bold; font-size: 32px;}

.cells .cell.btn-default { background: #fbe39c; border-color: #ffdc72; }
.cells .cell.btn-success { background: #77c2b2; border-color: #77c2b2; }
.cells .cell.btn-danger  { background: #000000; border-color: #000000; }
.cells .cell:hover {  }
.cells .cell.sold {  }
.cells .cell.sold:hover {  }



/* FUNDRAISER CREATE */
.Fundraisers.add form fieldset { padding-left: 0; padding-right: 0; }


/* EMBEDDED GIVING BOX */
.Fundraisers.embed #donate-modal .modal-dialog { top: 1800px; }


/* ERROR PAGES */
.error-section { padding-top: 100px; padding-bottom: 100px; }



/* LOGIN FORM / FORGOT FORM / RESET FORM */
#LoginForm, #ResetForm { width: 500px; max-width: 100%; margin: 0 auto; padding-top: 150px; padding-bottom: 50px; }
#LoginForm #ForgotPassword { display: inline-block; float: left; margin: 1rem 0.5rem 1.0625rem 0.5rem; text-transform: uppercase; text-decoration: none; color: #333; }
#LoginForm #ForgotPassword:hover { color: #999; }
form legend { color: #222; border-bottom-color: #c4cfcc; }
#LoginForm button[type="submit"],
#ResetForm button[type="submit"] { background: #ffdc72; color: #000; font-weight: 700; border-radius: 8px; }
#LoginForm button[type="submit"]:hover,
#ResetForm button[type="submit"]:hover { background: #fbe39c; }

@media screen and (min-height:700px) {
	.Users.forgot #footer,
	.Users.login  #footer,
	.Users.reset  #footer { position: fixed; bottom: 0; width: 100%; }
}



@media screen and ( min-width: 1400px ) {
	.hidden-desktop { display: none !important; }
}
@media screen and ( max-width: 1399px ) and ( min-width: 1025px ) {
	nav.navbar { border-radius: 0; }
	#footer input { width: 100%; }
	.hidden-desktop { display: none !important; }
}
@media screen and ( max-width: 1024px ) and ( min-width: 768px ) {
	nav.navbar { border-radius: 0; }
	#footer input { width: 100%; }
	.hidden-tablet { display: none !important; }
}
@media screen and ( max-width: 767px ) {
	nav.navbar { border-radius: 0; height: 50px; }
	#content { margin-top: 50px; }
	#givingbox-logo { height: 125px; }
	#footer input { width: 100%; }
}
@media screen and ( max-width: 767px ) and ( min-width: 641px ) {
	#footer .columns:nth-child(1),
	#footer .columns:nth-child(3) { width: 30%; }
	#footer .columns:nth-child(2) { width: 40%; }
	.hidden-tablet { display: none !important; }
}
@media screen and ( max-width: 640px ) {
	#footer { padding-top: 30px; }
	#footer .columns:nth-child(2),
	#footer .columns:nth-child(3) { margin-top: 50px; }
	
	#footer input { padding: 20px 10px; width: 80%; }
	#footer input[type="submit"] { padding: 12px; }
	
	.hidden-mobile { display: none !important; }
	
}
@media screen and ( max-width: 400px ) {
	#footer input { width: 95%; }
}