/*
    Launch Styles by Charitable Themes :: style-launch.css
    Designed and Developed by Matthew Corsi
    
    
-------------------------------------------------------------------------------
    
    TABLE OF CONTENTS

    0.  MAIN
    1.  PRIMARY STYLES
        1.0 Default
        1.1 Header
            1.1.1 Logo
        1.2 Content
        1.3 Footer
    2.  PROGRESS BAR
    3.  BUTTONS
    2.  HELPER CLASSES
    3.  MEDIA QUERIES
        3.1 Screen Size < 520px
    4.  PRINT

---------------------------------------------------------------------------------*/

/* ==========================================================================
   0. Main
   ========================================================================== */

html,
input,
select,
textarea {
    color: #FFF;
}

/*html,
body{
    min-height:100%;
    min-width: 100%;
    background: url("../images/bg.jpg") no-repeat center bottom fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}*/

body {
    font-size: 16px;
    line-height: 1.4;
    font-family: 'Lato', sans-serif;
}

@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {
    body {
        font-size: .875em;
    }
}


/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection declarations have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #ff9409;
    color: #FFF;
    text-shadow: none;
}

::selection {
    background: #ff9409;
    color: #FFF;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
 */

img {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* 
   Chrome Frame prompt
   ========================================================================== */

.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}


body > #stickycontainer { height: auto; min-height: 100%; }

#stickyfooter {
	clear: both;
	position: relative;
	height: 3em;
	margin-top: 3em;
	margin-right: auto;
	margin-left: auto;
}

#stickycontent {
	padding-bottom: 3em;
	top: auto;
	position: relative;
	padding-left: 355px;
}

#stickyheader {
	/*height: 400px;*/
	width: 640px; /* original 940px move box left*/
	margin: 0 auto;
	position: relative;
	display: block;
}

/*for stickyfooter navigation*/
#stickyheader .mod_navigation {
	z-index: 9900;
	font-size: 16px;
/*	position: absolute;*/
/*	top: 340px;*/
	width: 620px;
	background-color: white;
	background-color: rgba(255, 255, 255, 0.95);
	opacity:0.85;
	filter:alpha(opacity=85); /* For IE8 and earlier */
}
#stickyheader .mod_navigation nav {
  width: 620px;
  margin: auto;
}
#stickyheader .mod_navigation ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  display: inline-block;
  float: left;
}
#stickyheader .mod_navigation ul li,
#stickyheader .mod_navigation ul a,
#stickyheader .mod_navigation ul span {
	display: inline-block;
	float: left;
	text-decoration: none;
	color:#FFF;
	font-weight:bold;
	border-radius: 9px;
}
#stickyheader .mod_navigation ul li a,
#stickyheader .mod_navigation ul li span {
font-family: 'Syntax Regular', Helvetica, sans-serif;
  padding: 1px 11px 3px 11px;
  -webkit-transition: all 0.2s ease-in-out;
}
#stickyheader .mod_navigation ul li.current a,
#stickyheader .mod_navigation ul li a:hover,
#stickyheader .mod_navigation ul li.trail a,
#stickyheader .mod_navigation ul li span .active{
 /* background-color: #56beed;*/
    background-color: #4e91b3;
  /*background-color: #333;*/
/*  color: white;*/
  text-decoration: none;
  -webkit-transition: all 0;
}
#stickyheader .mod_navigation ul li span .notactive {
  /*background-color: #99cccc;*/
  background-color: #56beed;
  color: white;
  text-decoration: none;
  -webkit-transition: all 0;
  opacity:0.85;
  filter:alpha(opacity=85); /* For IE8 and earlier */
}

#stickyheader .mod_navigation ul li a:hover {
  background-color: #99cccc;
}
#stickyheader .mod_navigation.nav-fixed {
  background-color: white;
  width: 100%;
  left: 0;
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  position: fixed;
  top: 000px;
}
#stickyheader .mod_navigation .mod_changelanguage {
  float: right;
}




/* ==========================================================================
   Primary Styles
   ========================================================================== */

/* 11.3.1 DEFAULT
    ----------------------------------------------------- */
.outerContainer{
	width:1090px;
	height:730px;
	margin:50px auto;
	background: url("../images/bg.jpg") no-repeat center center;
	position:relative;
	}
.container {
   width: 830px;
   margin: 10px auto;
   text-align: center;
   overflow: hidden:
}

span.headline,
h1.headline {
    font-size: 2em;
}
span.headline {
	font-size: 2.8em;
	/*font-weight: 400;
	text-shadow: 0 -1px 0 #555;*/
	text-shadow:1px -1px 1px #555555;
	-webkit-margin-before: 0;
}
h1.headline {
    font-weight: 400; text-shadow:1px 1px 1px #000000;
  /* font-weight: bold; text-shadow:1px 1px 1px #000000;*/
}
/*h1.headline,
p {
    text-shadow: 0 1px 0 rgba(0,0,0,.4);
}*/

.subhead { font-weight: 400; font-size: 1.3em; text-shadow:0px 1px 1px #000000;}

p {
    font: 300 16px/24px 'Lato', sans-serif;
   /* margin: 20px 0 40px;*/
}


/* 11.3.1 HEADER
    ----------------------------------------------------- */

header[role="banner"] {}

    /* 11.3.1 LOGO
    ----------------------------------------------------- */
    .logo,
    .logo a,
    .logo img{
	display:block;
	width:100px; /* Width of your logo in pixels  */
	height:30px; /* Height of your logo in pixels */
    }
    .logo{
        background:url("../");
        margin: 20px auto;
    }
        .logo:hover{
            /* Hover states */
            background-position:0 -00px;
        }
    .logo img{
        position:absolute;
        left:-99999px;
    }


/* 11.3.1 CONTENT
    ----------------------------------------------------- */

.theme-preview {
    margin: 30px 0 45px;
    position: relative;
}
.theme-preview img {
    max-width: 100%;
    max-height: 100%;
}
.theme-preview .overlay {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 80%;
    height: 10%;
    padding: 20% 10%;
    text-align: center;
    transition: all 0.4s; 
        -webkit-transition: all 0.4s;  
        -moz-transition: all 0.4s;  
        -o-transition: all 0.4s;
}
.theme-preview .overlay:hover {
    opacity: 1;
}
.theme-preview span {
    background: rgba(0,0,0,.1);
    padding: 5px 10px;
    border: 1px solid rgba(0,0,0,.025);
}



/* 11.3.1 FOOTER
    ----------------------------------------------------- */
.footer{ position:absolute; bottom:0; left:280px; width:512px; height:34px; line-height:34px; margin:40px auto 0 auto;  }
.footer p {
	text-align:center;
	font-size:16px;
	margin:0 auto;
} 

#footer {
    padding: 20px;
    margin-bottom: 20px;
}
ul.social {
    list-style: none;
    padding: 0;
    margin: 0;
}
ul.social li {
    display: block;
    float: left;
    width: 33.33%;
}
.credits {
    padding: 24px 30px 0;
    color: rgba(255,255,255,.4);
    font-size: .875em;
}
    .credits a {
        color: rgba(255,255,255,.6);
        transition: all 0.4s; 
            -webkit-transition: all 0.4s;  
            -moz-transition: all 0.4s;  
            -o-transition: all 0.4s;
    }
        .credits a:hover {
            color: rgba(255,255,255,1);
        }

/* ==========================================================================
   Progress Bar
   ========================================================================== */

div.progress.round {
    -webkit-border-radius: 1000px;
    -moz-border-radius: 1000px;
    -ms-border-radius: 1000px;
    -o-border-radius: 1000px;
    border-radius: 1000px;
}

div.progress {
    padding: 4px;
    margin-bottom: 50px;
    border: 3px solid #FFF;
    height: 25px;
    position: relative;
}

div.progress.round .meter {
    -webkit-border-radius: 1000px;
    -moz-border-radius: 1000px;
    -ms-border-radius: 1000px;
    -o-border-radius: 1000px;
    border-radius: 1000px;
}

div.progress .meter {
    background: #FF9409;
    height: 100%;
    display: block;
    width: 40%;
}
div.progress .percent {
    position: absolute;
    right: 16px;
    top: 5px;
}


/* ==========================================================================
   Buttons & Inputs
   ========================================================================== */
form {
    display: block;
    font-size: .9em;
    width: 580px;
    color: #FFF;
    margin: 0 auto;
    position: relative;
}
input[type="email"] {
    width: 540px;
    background: rgba(0, 0, 0, .55);
    padding: 15px 20px;
    font-weight: 700;
	font-size:16px;
    border: none;
    outline: none;
    border-radius: 3px;
      -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
      -o-border-radius: 6px;
}
::-webkit-input-placeholder {
   color: #FFF;
   font-weight: 700;
}
:-moz-placeholder {  
   color: #FFF; 
   font-weight: 700; 
}
input[type="submit"], 
input[type="button"] {
    display: inline-block;
    white-space: nowrap;
    letter-spacing: 1px;
    color: white!important;
    padding: 2px 22px 0;
	font-size:16px;
    margin: 0;
    zoom: 1;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
      -webkit-border-top-right-radius: 6px;
      -webkit-border-bottom-right-radius: 6px;
      -moz-border-top-right-radius: 6px;
      -moz-border-bottom-right-radius: 6px;
      -o-border-top-right-radius: 6px;
      -o-border-bottom-right-radius: 6px;
    transition: background-color 0.5s;
      -webkit-transition: background-color 0.5s;
      -moz-transition: background-color 0.5s;
    -webkit-appearance: none;
    text-shadow: 0 -1px 0 #222;
    font-weight: 700;
    border: none;
    min-height: 100%;
    background: rgba(0, 0, 0, .45);
    position: absolute;
    top: 0;
    right: 0;
}

input[type="submit"]:hover, 
input[type="button"]:hover {
    background: rgba(0, 0, 0, .60); 
    text-decoration: none;
}





/* ==========================================================================
   Helper classes
   ========================================================================== */

.strong {
    font-weight: 700!important;
}
.wrap {
    width: 70%;
    margin: 0 auto;
}
.hidden-links a {
    color: #848484;
}
    .hidden-links a:hover {
        text-decoration: underline;
    }

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 100%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   Theses examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */


@media (max-width: 520px) {
    body {
        background: url("../images/bg.JPG") no-repeat center center fixed; 
        -webkit-background-size: none;
        -moz-background-size: none;
        -o-background-size: none;
        background-size: none;
    }
    .container {
       width: 90%;
       margin: 0 auto;
       text-align: center;
       overflow: hidden;
    }
    .logo{
        margin: 40px auto;
    }
    .headline {
        font-size: 1.4em;
    }
    h1.headline {
        font-size: 1.4em;
        text-shadow: 0 -1px 0 #555;
    }
    p {
        font: 300 16px/24px 'Lato', sans-serif;
        margin: 20px 0 40px;
    }

    /* ==========================================================================
       Buttons & Inputs
       ========================================================================== */

    form {
        width: 100%;
    }
    input[type="email"] {
        width: 100%;
        padding: 16px 20px;
        font-size: .85em;
    }
    input[type="submit"], 
    input[type="button"] {
        display: block;
        letter-spacing: 0;
        padding: 4px 20px 0;
        font-size: .85em;
    }
}


@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
       only screen and (min-resolution: 144dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow:none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}
.txt_bg{ background:url(../images/txt_bg.png) repeat; color:#000000; padding:5px 0; margin:5px 0}

.txt_bg p{ margin:0;}