/*
 * util.css file
 * Handles the general styles for the entire site
 *
 * Creator: HOST_Hawk
 * License: Public Domain
 */
 
body
{
   background-color:#000000;
   background-image:url('../img/background.jpg');
   background-position:center top;
   background-repeat:repeat-x;
   background-attachment:fixed;
}

/* Any default (non-responsive) styles for the menu bar */
.custom-menu-bar
{
   margin-left:auto;
   margin-right:auto;
   margin-bottom:0px;
}

/* Any default (non-responsive) styles for the top container */
.top-container
{
   margin-left:auto;
   margin-right:auto;
   background-color:white;
}

/* Any default (non-responsive) styles for the left column */
.left-column
{
   padding-top:10px;
   padding-bottom:10px;
   background-color:white;
}

/* The element that displays the content title in the middle column */
.content-title
{
   text-align:center;
}

/* Any default (non-responsive) styles for the middle column */
.main-content
{
   /*padding-top:10px;*/
   padding-bottom:10px;
}

.main-content-area
{
   width:95%;
   margin-left:auto;
   margin-right:auto;
}

/* Any default (non-responsive) styles for the right column */
.right-column
{
   padding-top:10px;
   padding-bottom:10px;
   background-color:white;
}

/* Any default (non-responsive) styles for the Twitter widget */
.twitter-widget
{
   min-width:220px;
}

/* Textarea for the Contact page */
.contact-textarea
{
   width:90%;
   height:200px;
}

/* Any default (non-responsive) styles for the footer */
.footer
{
   text-align:center;
   background-color: #1B1B1B;
   background-image: -moz-linear-gradient(center top , #333333, #111111);
   background-repeat: repeat-x;
   color:#999999;
   padding-top:8px;
   height:32px;
}

@media (min-width: 1100px)
{
   /* Centers the menu bar and removes any bottom margin */
   .custom-menu-bar
   {
      max-width:1100px;
   }

   /* The top-level container for everything */
   .top-container
   {
 	  max-width:1100px;
   }
 
   /* The container in which the site banner resides */
   .top-container-banner
   {
   }
 
   /* The left column for the site */
   .left-column
   {
   	  width:20%;
   	  float:left;
   }
 
   /* The main content area for the site */
   .main-content
   {
 	  width:60%;
 	  float:left;
   }
 
   /* The right column for the site */
   .right-column
   {
   	  width:20%;
   	  float:left;
   }
   
   .twitter-widget
   {
      width:220px;
   }
   
   .twitter-widget iframe
   {
      width:220px;
   }
 
   /* Container for the footer section */
   .footer
   {
 	  max-width:1100px;
   }
}

@media (min-width: 1000px) and (max-width: 1099px)
{
   /* Centers the menu bar and removes any bottom margin */
   .custom-menu-bar
   {
      max-width:1000px;
   }

   /* The top-level container for everything */
   .top-container
   {
 	  max-width:1000px;
   }
 
   /* The container in which the site banner resides */
   .top-container-banner
   {
   }
 
   /* The left column for the site */
   .left-column
   {
   	  width:20%;
   	  float:left;
   }
 
   /* The main content area for the site */
   .main-content
   {
 	  width:57%;
 	  float:left;
   }
 
   /* The right column for the site */
   .right-column
   {
   	  width:23%;
   	  float:left;
   }
   
   .twitter-widget
   {
      width:220px;
   }
   
   .twitter-widget iframe
   {
      width:220px;
   }
 
   /* Container for the footer section */
   .footer
   {
 	  max-width:1000px;
   }
}

@media (min-width: 979px) and (max-width: 999px)
{
   /* Centers the menu bar and removes any bottom margin */
   .custom-menu-bar
   {
      max-width:979px;
   }
   
   /* The top-level container for everything */
   .top-container
   {
 	  max-width:979px;
 	  width:920px;
   }
 
   /* The container in which the site banner resides */
   .top-container-banner
   {
   }
 
   /* The left column for the site */
   .left-column
   {
   	  width:25%;
   	  float:left;
   }
 
   /* The main content area for the site */
   .main-content
   {
 	  width:50%;
 	  float:left;
   }
 
   /* The right column for the site */
   .right-column
   {
   	  width:25%;
   	  float:left;
   }
   
   .twitter-widget
   {
      width:220px;
   }
   
   .twitter-widget iframe
   {
      width:220px;
   }
 
   /* Container for the footer section */
   .footer
   {
 	  max-width:979px;
   }
}

@media (min-width: 768px) and (max-width: 978px)
{
   /* Centers the menu bar and removes any bottom margin */
   .custom-menu-bar
   {
      max-width:768px;
   }
   
   /* The top-level container for everything */
   .top-container
   {
 	  max-width:768px;
   }
 
   /* The container in which the site banner resides */
   .top-container-banner
   {
   }
 
   /* The left column for the site */
   .left-column
   {
   	  float:left;
   	  width:30%;
   	  margin-bottom:10px;
   }
   
   .content-title
   {
      text-align:left;
   }
 
   /* The main content area for the site */
   .main-content
   {
 	  float:left;
 	  width:70%;
 	  margin-bottom:10px;
   }
 
   /* The right column for the site */
   .right-column
   {
   	  display:block;
   	  width:100%;
   	  padding-bottom:0px;
   	  margin-bottom:0px;
   	  clear:both;
   }
   
   /* The widget used to display Tweets */
   .twitter-widget
   {
      width:90%;
      margin-left:auto;
      margin-right:auto;
   }
   
   .twitter-widget iframe
   {
      width:100%;
   }
 
   /* Container for the footer section */
   .footer
   {
 	  max-width:768px;
   }
}

@media (max-width: 768px)
{
   /* Centers the menu bar and removes any bottom margin */
   .custom-menu-bar
   {
      max-width:768px;
   }
   
   /* The top-level container for everything */
   .top-container
   {
 	  max-width:768px;
   }
 
   /* The container in which the site banner resides */
   .top-container-banner
   {
   }
 
   /* The left column for the site */
   .left-column
   {
   	  display:none;
   }
 
   /* The main content area for the site */
   .main-content
   {
 	  display:block;
 	  margin-bottom:10px;
   }
 
   /* The right column for the site */
   .right-column
   {
   	  display:block;
   	  margin-bottom:10px;
   }
   
   /* The widget used to display Tweets */
   .twitter-widget
   {
      width:90%;
      min-width:220px;
      margin-left:auto;
      margin-right:auto;
   }
   
   .twitter-widget iframe
   {
      width:100%;
      margin-left:0px;
   }
 
   /* Container for the footer section */
   .footer
   {
 	  max-width:768px;
   }
}

/*
=====================================

STYLES FOR BIG BUTTONS

=====================================
*/

.big-button-container
{
   max-width:450px;
}

.big-button
{
   width:100px;
   height:100px;
   text-align:center;
   line-height:20px;
   margin-left:10px;
   margin-right:10px;
   margin-bottom:20px;
   float:left;
}

.big-button span
{
   /*margin-top:30px;8*/
}

.big-button span i
{
   display:block;
   margin-top:25px;
   font-size:60px;
}

/*
=====================================

GENERAL UTILITY STYLES

=====================================
*/

.alert-custom
{
   width:85%;
}
 
/* Floats an element to the left of its content */
.float-left
{
   float:left;
}
 
/* Floats an element to the right of its content */
.float-right
{
   float:right;
}
 
/* Clears the float attribute on both sides for an element */
.clear-float
{
   clear:both;
}
 
/* Centers the text in a given element */
.text-center
{
   text-align:center;
}

.bold
{
   font-weight:bold;
}

.italic
{
   font-style:italic;
}

.required
{
   color:red;
}

.help-inline img
{
   display:inline;
   padding-top:3px;
}

.vertical-align-top
{
   vertical-align:top;
}

.vertical-align-middle
{
   vertical-align:middle;
}

.min-right-margin
{
   margin-right:10px;
}

.min-left-padding
{
   padding-left:10px;
}

.min-left-margin
{
   margin-left:10px;
}

.min-bottom-padding
{
   padding-bottom:10px;
}

.margin-center
{
   margin-left:auto;
   margin-right:auto;
}