/* Important! 
* Please don't change anything on this css sheet, but
* incase you change anything to refresh you have to go
* to youdoamin.com/?debug will refresh all
*/
.darker {color:$color;}
.brighter {color:$brighter;}
.darker-bg {background-color:$color;}
.brighter-bg {background-color:$textcolor}

.theme-slider .navbar {margin-bottom:0px;}
.navbar img {max-height:46px;margin-top:-12px;}
.navbar {box-shadow:inset -1px 1px 1px $brighter;background-color:$color;color:$textcolor;border-top-color:$darker; border-bottom-color:$darker;}
.navbar .navbar-nav > li {border-right-color:$brighter;border-left-color:$darker;}
.navbar-nav li.active,
.navbar-nav li a:focus,
.navbar-nav li a:hover,
.navbar-nav li a:active,
.navbar-nav li a:visited{color:$textcolor;background-color:$brighter;}
/* when the dropdown is open */
.navbar-nav li.open a:focus {background-color:$color}
.navbar-nav a,.navbar-nav li.open a {color:$textcolor;}
/* dropdown menu style */
.dropdown-menu {background-color:$color;padding:0;margin:0;box-shadow:none;border:none;}
.dropdown-menu li {border-color:$brighter; }
.dropdown-menu li a:hover,
.dropdown-menu li a:focus {background:$brighter;color:inherit;}
/* parallax font-color */
.postcover {background-color:$darker;}
.postcover .celda .caption h2,.carousel-caption h2 {color:$textcolor}

.navbar-toggle {background-color: $brighter;}
.icon-bar {background:$textcolor;}
.theme-frontpage-grid h2 {color:$darker;}
/* btns for posts and slider */
.btn-dark {border-color:$darker;color:$darker;}
.btn-dark:hover,.btn-dark:active {text-decoration:none;background:$color;color:$textcolor;}
.btn-bright {border-color:$textcolor;color:$textcolor;}
.btn-bright:hover, .btn-bright:active {text-decoration:none;background:$color;color:$textcolor;}
/* 
* remove the home page from display 
*/
li.menu-item-home.menu-item-home {display: none;}
/* 
* fix color for social media
*/
.footer .btn-circle i {background:$darker;color:$textcolor;opacity:.8}
.footer .btn-circle i:hover {background:$textcolor;color:$darker;}
/* 
* template sections modify to compile
*/
.header {background-image:url('$header');color:$textcolor;padding:10px 0px;background-repeat:repeat-x;background-color:$color;}
.footer {background:$color;color:$textcolor;}
.footer-col {border-left:1px solid $darker;border-right:1px solid $brighter;min-height:140px}
.footer-col:first-child {border-left:none;}
.footer-col:last-child {border-right:none}
.footer:before {display: block;content: '';border-bottom:1px solid $brighter;background: $darker;height:2px;margin-bottom:30px;margin-left:0px;}
.footer:after {display: block;content: '';border-top:1px solid $darker;background: $brighter;height: 50px;margin-top:50px;margin-left:0px;}
.footer strong, .footer a, .footer a:hover {color:$textcolor;}
/* 
* The following code we can use to set special css to use on 
* bootstrap 3.0 custume you css
*/

/* Large desktops and laptops */
@media (min-width: 1200px) {
	.caption > * {padding-right:20%;}
}

/* Landscape tablets and medium desktops */
@media (min-width: 992px) and (max-width: 1199px) {
	.caption > * {padding-right:20%;}
}

/* Portrait tablets and small desktops */
@media (min-width: 768px) and (max-width: 991px) {
	.caption > * {padding-right:20%;}
  	.footer-col {border:none;min-height:0px}
   	.footer-col:first-child {border-bottom:1px solid $brighter;}
   	.footer-col:last-child {border-left:1px solid $brighter}
   	/* fix slideshow */
   	.caption-inset h2 {font-size:24px}
   	.caption-inset h1 {font-size:34px}
}

/* Landscape phones and portrait tablets */
@media (max-width: 767px) {
	.caption > * {padding-right:20%;font-size:36px;line-height:1em;margin:0px 0px .3em 0px;}
	.footer-col {border:none;min-height:0px}
	.footer-col {border-bottom:1px solid $darker;border-top:1px solid $brighter;margin:0;padding:20px 0px;}
	.footer-col:first-child {border-top:none;}
	.footer-col:last-child {border-bottom:none}

}
/* Portrait phones and smaller */
@media (max-width: 480px) {
	.caption > * {padding-right:20%;font-size:26px;line-height:1em;margin:0px 0px .3em 0px;}
}