body { padding-top: 65px; }

.nav { font-family: 'Open Sans', sans-serif; }

.navbar-colors { background-color: rgba(44,193,192,1.0);	color: rgba(0,0,0,0.4) !important; }
.navbar-colors a:link { color: rgba(255,255,255,1.0); transition: 1.2s; }
.navbar-colors a:visited {	color: rgba(255,255,255,1.0);	transition: 1.2s; }
.navbar-colors a:hover { color: rgba(230,255,255,0.5); transition: 1.2s; text-decoration: none; }
.navbar-colors a:active { color: rgba(0,0,0,0.2); transition: 1.2s; }
.navbar-colors .disabled { color: rgba(0,0,0,0.4) !important; }

.custom-toggler .navbar-toggler-icon {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 0.8)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
	}
.custom-toggler.navbar-toggler {
	border-color: rgba(255,255,255,0.8);
	}

.input-group input[type=text]{
	background-color: rgba(255,255,255,0.7);
	border: 1px solid rgba(0,0,0,0.4);
	color: rgba(0,0,0,0.7) !important;
	}
.input-group input[type=text]:focus { box-shadow: 0 0 5px rgba(255,255,255,1.7) !important; }

.btn-nav {
	background-color: rgba(255,255,255,0.2);
	color: rgba(0,0,0,0.6) !important ;
	border: 1px solid rgba(0,0,0,0.4);
	transition: 1.2s;
	border-top-right-radius: 4px !important;
	border-bottom-right-radius: 4px !important;
	}
.btn-nav:hover { 
	background-color: rgba(255,255,255,0.4);
	color: rgba(0,0,0,0.8) !important;
	border-color: rgba(0,0,0,0.6);
	transition: 1.2s;
	}
.btn-nav:focus
	{ box-shadow: none !important; }
.btn-nav:active { 
	box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.3) inset !important;
	}

.content-header { font-family: 'Cabin', sans-serif; }
.content-header blockquote {
	font-family: 'Open Sans', sans-serif;
	border-left: .1em solid rgba(44,193,192,1.0);
	margin-left: 10px;
	padding-left: 1em;
	transition: 1.2s;
	}
.content-header blockquote:hover {
	background-color: rgba(50,50,50,0.1);
	transition: 1.2s;
	}

.content-body { 
	padding-bottom:2em;
	font-family: 'Cabin', sans-serif;
	}
.content-body h1 h2 h3 { font-family: 'Open Sans', sans-serif; }

.ingredient-box li {
	border-left: 0px;
	border-right: 0px;
	border-color: rgba(0,0,0,0.2);
	background-color: rgba(0,0,0,0.0);
	transition: 1.2s;
	}
.ingredient-box li:first-child {
	border-top:0px;
	border-radius: 4px 4px 0px 0px;
	background-color: rgba(44,193,192,0.6);
	}
.ingredient-box li:hover { background-color: rgba(0,0,0,0.1); transition: 1.2s; }
.ingredient-box li:first-child:hover { background-color: rgba(44,193,192,0.6); }
.ingredient-box li:first-child div { font-weight: bold; }
	
.container-directions {
	padding-top: 2em;
	margin-bottom: 2em;
	background-color: #F9F9F9;
	border: 1px solid rgba(44,193,192,1.0);
	}
.container-directions hr{ background-color: rgba(44,193,192,1.0); width: 75%;}
.directions-number {
	font-family: 'Krona One', sans-serif;
	text-align: right;
	font-size: 2em;
	text-shadow: 1px 1px rgba(44,193,192,1.0);
	}
.directions-text {
	padding-right: 2em;
	font-family: 'Source Sans Pro', sans-serif;
	font-weight: normal;
	font-size: 1.2em;
	text-align: justify;
	}
.container-notes {
	border: 1px dashed rgba(44,193,192,1.0);
	width: 95%;
	padding:1em;
	margin-top: 2em;
	margin-bottom: 2em;
	}

.content-form {
	padding-top: 1em;
	padding-bottom: 1em;
	background-color: rgba(200,200,200,0.1);
	border: 1px solid rgba(150,150,150,0.1);
	}
.form-group input[type=text]{
	background-color: rgba(255,255,255,1.0);
	border: 1px solid rgba(0,0,0,0.5);
	color: rgba(0,0,0,0.5) !important;
	}
.form-group input[type=password]{
	background-color: rgba(255,255,255,1.0);
	border: 1px solid rgba(0,0,0,0.5);
	color: rgba(0,0,0,0.5) !important;
	}
textarea .form-control{
	background-color: rgba(255,255,255,1.0);
	border: 1px solid rgba(0,0,0,0.5);
	color: rgba(0,0,0,0.5) !important;
	resize: none;
	}	
	
.form-group input[type=text]:focus { box-shadow: 0 0 5px rgba(44,193,192,0.6) !important; }
.form-group input[type=password]:focus { box-shadow: 0 0 5px rgba(44,193,192,0.6) !important; }
textarea:focus { box-shadow: 0 0 5px rgba(44,193,192,0.6) !important; }

.btn-form {
	background-color: rgba(44,193,192,0.3);
	color: rgba(0,0,0,0.6);
	border: 1px solid rgba(0,0,0,0.6);
	transition: 1.2s;
	}
.btn-form:hover {
	background-color: rgba(44,193,192,0.6);
	color: rgba(0,0,0,0.8);
	border-color: rgba(0,0,0,0.8);
	}
.btn-form:focus
	{ box-shadow: none !important; }
.btn-form:active { 
	box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.3) inset !important;
	}
	
	
.side-bar {
	border-left:1px solid rgba(44,193,192,1.0);
	}