/*****
   Styles to Reset Defaults
   Dawn Manske Web Dev II first project
   Author:	 Dawn Manske
   Date:  	 01-12-2016

   Filename: mgdp2050.css
   Supporting Files: none
*****/

/***  body styles  ***/

a {
	color: grey;
	text-decoration: none;
	}

/* move down content because the fixed navbar that is 50px tall */
body {
	padding-top: 50px;
	padding-bottom: 20px;
}

h1 {
	margin-top: 100px;
}

h2 {
	margin-top: 30px;
	margin-bottom: 50px;
}

h3 {
	margin-top: 50px;
	padding-top: 20px;
	color: grey;
}

h3 a {
	color: grey;
	text-decoration: none;
}

h3 a:hover {
	color: red;
	text-decoration: none;
}

h3 a:visited {
	color: black;
	text-decoration: none;
}

h4 {
	margin-top: 0px;
	padding-top: 5px;
	color: grey;
}



.iphone img {
	max-width: 300px;
}

.ipad img {
	max-width: 992px;
}


/***  header navigation  ***/
header .navbar {
	border-radius: 0;
	border: 0;
	padding: 0;
	height: 60px;
}

header .navbar-default {
	background: white;
	border: none;
}


header .navbar-default .navbar-nav a {
	background-color: ghostwhite;
}

header .navbar-default .navbar-nav a:hover {
	color: red;
	text-decoration: none;
	text-shadow: none;
}

header .navbar-default .navbar-nav a:focus {
	color: red;
	text-decoration: none;
	text-shadow: none;
}

header .navbar-default .navbar-nav .active a {
	/**  background-color: grey;  **/
	font-weight: 600;
	color: red;
	text-shadow: none;
}

header .navbar-default .navbar-nav a:visited {
	color: black;
	text-shadow: none;
}

/***  navbar brand   ***/
header .navbar-brand {
	/* background: url(../images/logo_dm.png) alt="Dawn Manske's logo";*/
	background-repeat: no-repeat;
	background-position: 15px 0;
	height: 51px;
}

/***   navbar toggle   ***/
header .navbar-toggle {
	background-color: red;
}

header .navbar-default .navbar-toggle .icon-bar {
	background-color: white;
}

@media only screen
and (max-width: 768px) {
	header .navbar-collapse.in {
		background-color: rgba(0,0,0,.01);
	}
}


button, btn-group {
	border-radius: 0;
	border: 0;
	padding: 0;
	height: 50px;
}

.btn-primary.btn-lg {
	background-color: red;
	outline-color: red;
	color: white;
}

button.toc.btn.btn-primary {
	background-color: white;
	border-radius: 0;
	border: none;
	color: grey;
	text-decoration: none;
	text-shadow: none;
}

.btn-primary:focus,
.btn-primary.focus {
  color: grey;
  background-color: white;
  border-color: ghostwhite;
}
.btn-primary:hover {
  color: red;
  background-color: ghostwhite;
  border-color: white;
}
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  color: black;
  background-color: red;
  border-color: grey;
}  /** lines 158 - 164 caret dropdown open **/
.btn-primary:active:hover,
.btn-primary.active:hover,
.open > .dropdown-toggle.btn-primary:hover,
.btn-primary:active:focus,
.btn-primary.active:focus,
.open > .dropdown-toggle.btn-primary:focus,
.btn-primary:active.focus,
.btn-primary.active.focus,
.open > .dropdown-toggle.btn-primary.focus {
	font-weight: 500;
	color: black;
	text-shadow: none;
  background-color: red;  /*** red caret bckgrnd button ***/
  border-color: red;
}
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  background-image: none;
}
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus {
  background-color: red;
  border-color: grey;
}
.btn-primary .badge {
  color: black;
  background-color: red;
}

.btn.btn-primary.dropdown-toggle {
	background-color: red;
	border: none;
	text-shadow: none;
}

.dropdown-menu.active a {
	background-color: grey;
}
.dropdown-menu.active a:visited {
	background-color: grey;
}
.dropdown-menu.active a:hover {
	background-color: grey;
}
.dropdown-menu.active a:focus {
	background-color: grey;
}
.dropdown-menu.active #featured a {
	background-color: grey;
}
.dropdown-menu.active #featured a:visited {
	background-color: grey;
}
.dropdown-menu.active #featured a:hover {
	background-color: grey;
}
.dropdown-menu.active #featured a:focus {
	background-color: grey;
}


/*** carousel fade attributes  ***/
.carousel.fade {
	opacity: 1;
}

.carousel.fade .item {
	transition: opacity ease-out .7s;
	left: 0;
	opacity: 0;
	top: 0;
	position: absolute;
	width: 100%;
	display: block;
}

.carousel.fade .item:first-child {
	top: auto;
	opacity: 0;
	position: relative;
}

.carousel.fade .item.active {
	opacity: 1;
}


/*** .jumbotron customization ***/
.jumbotron {
  padding-top: 30px;
  padding-bottom: 30px;
  margin-bottom: 30px;
  background-image: url('images/clouds01.jpg');
  background-position: center;
}

/*** page -- weeks ***/
.weeks {
	margin: 20px 0;
	text-align: center;
	text-decoration: none;
}

#weeks img.icon {
	display: block;
	width: 110px;
	margin: 0 auto;
	margin-bottom: 5px;
}

#weeks h3 {
	margin-bottom: 10px;
}

@media only screen
and (min-width: 450px)
and (max-width: 768px) {
	  .weeks p {
	  padding: 0 20%;
	}
}

.weeks a {
	color: black;
	text-decoration: none;
}

.weeks a:hover {
	font-weight: 500;
	color: red;
	text-shadow: none;
}

.weeks a:visited {
	color: grey;
	text-shadow: none;
}


/*** article styles ***/
.week6 {
	 margin-top: 20px;
	 margin-bottom: 40px;
	 padding-top: 30px;
	 color: red;
}

.bluebkgnd {
	background-color: #0000c1;
}

.student {
	margin-left: 30px;
	color: white;
}

article .sidebar h3 {
	margin-left: 15px;
	color: #ffffff;
}

.nested1 {
	background-color: #4eff00;
	margin: 30px;
	padding: 20px;
}

.nested1 h4 {
	color: black;
}

.nested1 p {
	margin-top: 20px;
	color: black;
}

.nested2 {
		background-color: #b100ff;
		margin: 30px;
		padding: 20px;
	}

.nested2 h4 {
	color: white;
}

.nested2 p {
		margin-top: 20px;
		color: white;
	}

article .level1 p {
		margin-top: 20px;
	}


	/*** footer navigation  ***/
	footer .navbar-default {
		background: transparent;
	}