@charset "UTF-8";
/* CSS Document */

/*------------------------------------*\
    TABLE OF CONTENTS
\*------------------------------------*/
/**
Search by section below by using $[SECTION]

 * INTRODUCTORY-NOTES...............Comments on using bootstrap.css
 * GENERIC-BOOTSTRAP-OVERRIDES......Generic overrides for boostrap.css
 * COLORS...........................Basic presets for the colors used
 * HEADER...........................Header classes and header-specific bootstrap overrides
 * WINDOWS-SCRIPT-CLASSES...........Related classes for windows.js plugin to control full-page divs
 * CONTENT..........................Window and content classes, content-specific bootstrap overrides
 
 
/*------------------------------------*\
    INTRODUCTORY-NOTES
\*------------------------------------*/ 

/*
bootstrap.css is used to provide basic css and visual components
for the website. Any class in this stylesheet beginning with .fbc-* 
is not part of the Bootstrap framework but has been added by the author.
All other classes found are overrides from bootstrap.css.

This file always needs to be placed after bootstrap.css in all
documents.


*/


/*------------------------------------*\
    $GENERIC-BOOTSTRAP-OVERRIDES
\*------------------------------------*/


body {
	background-image: url(../images/bg.png);
	background-repeat:repeat-x repeat-y;
	background-attachment:fixed;
	font-family: 'HalisR-Book';
	color: #FFFFFF;
	}
	
a {
  color: #C4E8C9;
  text-decoration: none;
  -moz-transition: 0.2s color linear; 
	-webkit-transition: 0.2s color linear; 
	transition: 0.2s color linear;
}

a:hover,
a:focus {
  color: #FFFFFF;
  text-decoration: none;
}
a:focus {
  outline: none;
}
	
	
h1,h2,h3,h4,h5,h6 {
	font-family: 'HalisR-Bold';
	margin-top: 0;
	
	}

h2 {font-size: 20px;}

p {font-size: 16px;}

@media (min-width: 1900px) {
	h2 {font-size: 26px;}
	p {font-size: 18px;}
	} 

/* GarageGothic Bold */ 
.garagegothicbold { font-family: "GarageGothic Bold"; font-style: normal; font-weight: bold; }


/*------------------------------------*\
    $COLORS
\*------------------------------------*/

.fbc-text-earth {
	color:#7A6855;
	}
.fbc-text-leaf {
	color: #48A23F;
	}
.fbc-text-bloom {
	color: #EF6079;
	}
	
	
/*------------------------------------*\
    $HEADER
\*------------------------------------*/ 

	
	@media (max-width: 767px) {
	.fbc-logo {position: static;}
	.fbc-logo img {margin: 20px auto;}
	
	}
	
@media (min-width: 768px ) {
	.fbc-logo {
	position: fixed;
	bottom: 10%;
	z-index:10;
	right: 6.5%;
	
	}
	
	}
.navbar {background-color: transparent; filter: none;}

	
@media (min-width: 992px) {
	.fbc-logo {
	right: auto;	
		}
	}
	
	
.navbar {background-image: none; background-repeat: none; background-color: #000; border-radius: none; box-shadow: none;}
.navbar-default {background-color: transparent; border: none;}
.navbar-collapse {
    padding-left: 0;
	padding-right: 0;
}
.nav > li {
	float: none;
	display: block;
}
.navbar .navbar-nav > .active > a {
    background-color: transparent;
}

.navbar-default .navbar-nav > li > a {
    color: #C4E8C9;
	padding-left: 0;
	padding-right: 0;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    color: #FFFFFF;
	background-color: transparent;
	
}

.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
    background-color: transparent;
    color: #FFFFFF;
}

.navbar-brand, .navbar-nav > li > a {
    text-shadow: none;
}

@media (min-width: 768px) { 
.navbar-nav > li > a {
	font-size: 24px;
	line-height: 24px;	
	
}
}

@media (min-width: 992px) {
	.navbar-nav > li > a {
	font-size: 36px;
	line-height: 36px;	
	
}
	}


/*------------------------------------*\
    $WINDOWS-SCRIPT-CLASSES
\*------------------------------------*/ 

/*.window class triggers "windows" script which causes each <div class="window"> to dynamically adjust to fit 100% of height/width of screen */
@media (min-width: 768px) {
 .window {
  width: 100%;
  height: 100%;
  position: absolute;

}

.window:nth-child(1) {
  top: 0%;
}

.window:nth-child(2) {
  top: 100%;
  background-image: url(../images/bg-pink.png);
  background-position:center;
  background-repeat:repeat-x;
}

.window:nth-child(3) {
  top: 200%;
}

.window:nth-child(4) {
  top: 300%;
  background-color: #FFFFFF;
  z-index: 11;
}

.window:nth-child(5) {
  top: 400%;
}

.window:nth-child(6) {
  top: 500%;
}
}
@media (max-width: 767px) {

	
	.window:nth-child(2) {
  background-image: url(../images/bg-pink.png);
  background-position:center;
  background-repeat:repeat-x;
}

	.window:nth-child(4) {
  top: 300%;
  background-color: #FFFFFF;
  z-index: 11;
}
	
}





/*------------------------------------*\
    $CONTENT
\*------------------------------------*/ 

.row {margin-left: 30px; margin-right: 50px;}

/*fixed white pointer on top-left of page => <img class="fbc-pointer img-responsive hidden-xs" src="images/pointer.png" alt="pointer"> */
.fbc-pointer {
	position: fixed;
	left: -1px; 
	top: 60px;
		}
		
	@media (min-width: 1200px){
		.fbc-pointer {top: 75px;}
		}

.fbc-title {
	text-transform:uppercase;
	font-size: 100px;
	line-height:100px;
	font-family:'GarageGothic Bold';
	padding-top: 50px;

	}
	
	@media (max-width: 767px) {
		
	.fbc-title {font-size: 44px; line-height: 44px; padding-top: 20px; margin-bottom: 20px;}	
	.row {margin-left: 10px; margin-right: 10px;}
		}
		
		@media (min-width: 768px) {
			.fbc-title {font-size: 86px; line-height: 80px;}
			}
		
		@media (min-width: 992px) {
			.fbc-title {font-size: 96px; line-height: 90px;}
			
			}
			
		@media (min-width: 1200px) {
			.fbc-title {font-size: 120px; line-height: 110px;}
			}
		
		@media (min-width: 1900px) {
			.fbc-title {font-size: 140px; line-height: 120px;}
			}
			
			
	
.fbc-nav {
	text-transform: uppercase;
	z-index:0;
	margin-top: 40px;
	font-family: 'GarageGothic Bold';
	
	}
	

	
@media (max-width: 767px) {
.fbc-section-content {
	margin-top: 30px;
	margin-bottom: 50px;
	
	}
	
	
}

/*horizontal logo for 4th .window section => funding credit page.*/
.fbc-h-logo {
	margin: 150px auto 45px auto;
	padding-bottom: 45px;
	border-bottom: solid 1px #7A6855;
	}
	
	/*fix for IE 8,7 which does not show fixed logo properly - only contained in IE conditional comments*/
.fbc-ie-logo {display: block; position: absolute; top: 50px; right: 50px;}
	@media (min-width: 768px) {
	.fbc-ufg-logo-right {
		float: right;
		}
	}
	
	@media (max-width: 767px) {
		.fbc-funding-logos {margin: auto;}
		
		}

/*use following with .row class => <div class="row fbc-top"> */
@media (min-width: 768px) {
	
	.fbc-top {
	height: 60%;
	
	}	
	
.fbc-bottom {
	height: 40%;
	}
