<style type="text/css">




*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.clearfix:before, .clearfix:after { content: ''; display: table; }
.clearfix:after { clear: both; }

body {
    background: #fff;
    color: #8a8c7e;
    font-size: 100%;
    line-height: 1.25;
    font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
}

a {
    color: #99cc33;
    text-decoration: none;
    outline: none;
}

a:hover, a:focus {
    color: #373e18;
}

.codrops-header {
    margin: 0 auto;
    padding: 2em 0 0;
    text-align: center;
}

.codrops-header h1 {
    margin: 0;
    font-weight: 300;
    font-size: 2.5em;
}

.codrops-header h1 span {
    display: block;
    padding: 0 0 0.6em 0.1em;
    font-size: 0.6em;
    opacity: 0.7;
}

/* To Navigation Style */
.codrops-top {
    width: 100%;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 0.69em;
    line-height: 2.2;
    background: #fff;
}

.codrops-top a {
    display: inline-block;
    padding: 0 1em;
    text-decoration: none;
}

.codrops-top span.right {
    float: right;
}

.codrops-top span.right a {
    display: block;
    float: left;
}

.codrops-icon:before {
    margin: 0 4px;
    text-transform: none;
    font-weight: normal;
    font-style: normal;
    font-variant: normal;
    font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
    line-height: 1;
    speak: none;
    -webkit-font-smoothing: antialiased;
}

.codrops-icon-drop:before {
    content: "\e001";
}

.codrops-icon-prev:before {
    content: "\e004";
}

.codrops-demos {
    margin: 30px auto 0;
    padding: 30px 0;
}

.codrops-demos a,
section button {
    display: inline-block;
    background: #a9a9a9;
    color: #fff;
    font-weight: 400;
    padding: 10px 20px;
    margin: 5px;
    text-transform: uppercase;
    border-radius: 2px;
    letter-spacing: 1px;
}

.codrops-demos a:hover,
.codrops-demos a:active,
.codrops-demos a.current-demo {
    background: #777;
}

section {
    padding: 1em 2em 5em;
    text-align: center;
    font-size: 1.5em;
}

section p {
    max-width: 600px;
    margin: 0 auto;
    padding: 20px 0;
}

section button {
    border: none;
    padding: 15px 30px;
    outline: none;
    background: #85b91e;
}

.related > a {
    border: 1px solid #99cc33;
    display: inline-block;
    text-align: center;
    margin: 20px 10px;
    padding: 25px;
    color: #99cc33;
    opacity: 0.8;
    -webkit-transition: color 0.3s, border-color 0.3s;
    transition: color 0.3s, border-color 0.3s;
    -webkit-backface-visibility: hidden;
}

.related a:hover {
    border-color: #82b222;
    color: #82b222;
}

.related a img {
    max-width: 100%;
}

.related a h3 {
    margin: 0;
    padding: 0.5em 0 0.3em;
    max-width: 300px;
    text-align: left;
    font-size: 65%;
    font-weight: 400;
}

@media screen and (max-width: 25em) {
    .codrops-icon span {
        display: none;
    }
}
@charset "UTF-8";
@import "reset.css";


/* CSS Document */


/*
    ----------------------------
    HTML SELECTORS
    ____________________________
*/

html
{
    background: #ddd;
}
body { background: #ddd; font:14px/21px Helvetica, Arial, sans-serif; color: #333; margin: 0; padding: 0; }
a { color: #82c38d; text-decoration: none; opacity: 0.5;  }
.contact:hover { color: #fb2b2b; opacity: 0.8; }
.contact{ color: #fb2b2b; text-decoration: none; opacity: 0.7;  }
.title { color: #82c38d; text-decoration: none; opacity: 0.3;  font-size: 40px !important; padding-top: 20px;  padding-bottom: 10px; padding-left: 10px; }
.header { color: #82c38d; text-decoration: none; opacity: 0.4;   font-size: 24px !important; padding-top: 20px;  padding-bottom: 10px; padding-left: 10px; }
a:hover { color: #fb2b2b; opacity: 0.8; }
.header:hover { color: #fb2b2b; opacity: 0.8; }
h1, h2 { font-size: 26px; line-height: 28px; font-weight: normal; letter-spacing: -1px; color: #fff; }
h3 { font-size: 18px; font-weight: normal; margin: 8px 0; }
h4 { font-size: 14px; font-weight: normal; margin: 0; }
h5 { font-size: 12px; font-weight: normal; margin: 0; }
ul {  list-style-type: none; margin-top: 0; padding-left: 30px;  }
ol { }
li { text-decoration: :none;}
body {
    margin: 0 0 40px; /* bottom = footer height */
}
footer {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 40px;
    width: 100%;
}
.page-wrap {
  min-height: 100%;
  /* equal to footer height */
  margin-bottom: -142px; 
}
.page-wrap:after {
  content: "";
  display: block;
}
.site-footer, .page-wrap:after {
  height: 40px; 
}
.site-footer {
  background: white;
  opacity: :0.5;
}

/*
    ----------------------------
    LAYOUT
    ____________________________
*/
#divMute{  position: fixed;
    bottom: 0px;
    left: 0px;}
#divContact{  position: fixed;
    bottom: 5px;
    right: 10px;}

#wrapper { width: 100%;height:100%; margin: 0 0; }
#main { width: 640px; float: left; }
#main > p, #main > div {  }
#sidebar { width: 280px; float: right; }
#sidebar ol { margin: 0 0  }
/*
    ----------------------------
    PAGE/SECTION SPECIFIC
    ____________________________
*/


#video-controls { width: 666x; }
#video-controls a { color: #ddd; text-decoration: underline; }


/*
    ----------------------------
    UTILITY CLASSES
    ____________________________
*/


.floatright
{
    width: 100%;
    margin-left: auto ;
    margin-right: auto ;
}
.black-15 { background: url(../media/black-15-trans.png); color: #fff;  }
.black-35 { background: url(../media/black-35-trans.png); color: #fff;  }
.black-50 { background: url(../media/black-50-trans.png); color: #fff;  }
.black-65 { background: url(../media/black-65-trans.png); color: #fff;  }
.black-85 { background: url(../media/black-85-trans.png); color: #fff;  }


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

.clearfix:after {
    clear: both;
}
.floatleft
{
    display: block;
    float: left;

}
}
</style>