/* Variables */
$blue: #1e75bb;
$orange: #FDC670;
$bright-orange: #E89619;

$header-height: 70px;
$alchemy-btn-height: 95px;

@mixin alchemy-text(){
	text-align: left;
	h1,h2{
		line-height: 1.1em;
	}
	h3{
		line-height: 1.5em;
	}
	h5>a:hover{
		text-decoration: none;
		color: $bright-orange;
	}
}

body{
	font-family: 'Source Sans Pro', 'Lato', 'Helvetica', 'sans-serif';
	color: #333;
	font-weight: 300;
	h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .h5{
		font-weight: 300;
	}
}

/*Override Main Content Styles*/
.header{
	background: $blue;
	border-bottom: thin solid darken($blue, 10%);
	margin-bottom: 0px;
	.h3{
		padding: 0 20px;
		margin: 0;
		line-height: 70px;
		color: $bright-orange;
		text-shadow: 0px 0px 1px $blue, 0px 0px 20px white;
	}
}
.footer{
	background: #eee;
}

/* Panel Wrapper Styles*/
#footer-ga-logo{
	height: 30px;
}

/* Button Styles */
#sm-alchemy-logo{
	padding: 20px 0;
	img{
		height: 90px;
	}
}

/* Override and add to bootstrap styles*/
.navbar-default{
	background-color: transparent;
	border-bottom: 0;
}
.navbar{
	height: 70px;
}
.nav-pills{
	padding-right: 20px;
	padding-top: 15px;
	float: right;
	> li + li {
		margin: 0;
	}
	li > a{
		color: rgba(white, .7);
		border-radius: 0;
	}
	li{
		color: transparent;
		vertical-align: middle;
		a{
			padding-right: 10px;
			padding-left: 10px;
			&:active, &:hover{
				color: $blue;
			}
		}
	}
}

#tweet{
    padding-top: 20px;
    text-align: right;
}

.navbar {
    font-size: 18px;
    .nav-pills {
        li {
            a:hover {
                background-color: #fff;
            }
            &.active a:hover {
                background-color: #428BCA;
            }
        }
    } 
}

.tooltip-inner{
	padding: 5px 10px;
	background: darken($blue, 10%);
}

.tooltip{
	font-size: 14px;
}

.tooltip.bottom .tooltip-arrow {
  top: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: $bright-orange;
}

.btn{
	border: none;
	border-radius: 8px;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

hr{
	border-top: solid 1px $bright-orange;
	margin: 0;
} 

.share-button{
	border-radius: 8px;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	background: rgba($blue, .3);
	padding: 15px;
	display: inline-block;
	border: thin solid rgba($blue, .3);
	box-shadow: 2px 2px 10px rgba(white, .7), 2px 2px 15px $blue;
	a{
		line-height: 32px;
		vertical-align: middle;
		text-decoration: none;
		color: $blue;
	}
}

#alchemy-social{
	position: absolute;
	right: 5%;
	padding: 5px;
	text-align: center;
}
#btn-alchemy-rel{
	background: transparent;
	img{
		height: 45px;
	}
	h3{
		margin-top: 10px;
		margin-bottom: 0;
	}
	&:active{
		background: rgba($blue, .9);
		border: none;
	}
	&:focus, &:active{
		outline: none;
	}
}
#social-hide{
	display: inline-block;
	float: right;
	color: $blue;
}

#social-icons{
	iframe#twitter-widget-0{
		// override twitter's default width
		width: 112px !important;
	}
}


div[role="search"] {display: none;}
nav.stickynav {
	// background-color: black;
	ul.current {overflow: auto;}

	/* Nav Search Styles */
	.wy-side-nav-search{
		background-color: $blue;
	}
	

	/* Nav Menu Styles*/
	.wy-menu.wy-menu-vertical{
		font-size: 1.1em;
		overflow: auto;

		li.toctree-l1{
			list-style: none;
			& a:active{
				background-color: $blue;
			}
		}
		li.toctree-l2{
			border-bottom: solid rgba($blue, .4) thin;
			list-style: none;
			& a{
				color: $blue;
			}
			& a:hover{
				color: #fff;
				background-color: $blue;
			}
			& a:active{
				background-color: white;
			}
		}

		a.toctree-l3{
			padding-left: 3.5em;
			&:hover{
				color: $blue;
				background-color: #fff;
			}
			&:active{
				background-color: white;
			}
		}
	}
}

section.wy-nav-content-wrap {
	overflow: scroll;
	
	ul {
		li {
			list-style: disc;
			margin-left: 24px;
		}
	}
}


// ul.current {
// 	li {
// 		list-style: none;
// 	}
// }

img {
	&[alt="Two Nodes"] {
		align: center;
		max-height: 300px;
	}
}

div[role="main"] {
	ol {
		list-style: decimal !important;
		li {
			list-style: decimal !important;
		}
	}
}