/* Reset */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td { margin: 0; padding: 0; }
table { border-collapse: collapse; border-spacing: 0; }
fieldset, img { border: 0; }
address, caption, dfn, th, var { font-style: normal; font-weight: normal; }
li { list-style: none; }
caption, th { text-align: left; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
html,
body { margin: 0; padding: 0; width: 100%; height: 100%; display: table; }
html { background-color: #fcf9f7; }
.dim { opacity: 0.3; }
body { margin: 0; padding: 0; color: #4d4d4d; position: relative; font-family: 'Roboto', sans-serif; text-align: left; background: url(../images/bg.png) left top repeat; }
.wrapper { display: table-cell; vertical-align: middle; padding: 40px 0; }
.left-section { width: 50%; float: left; }
    .left-section img { float: right; margin-right: 50px; }
.right-section { width: 50%; float: left; }
h1 { -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; /*background: #e8ebec; padding: 5px 15px;*/ font-family: 'Roboto Slab', serif; font-weight: 700; color: #4d4d4d; font-size: 60px; text-transform: uppercase; letter-spacing: -1px; float: left; margin-bottom: 20px; }
.seprator { float: none; clear: both; }
.main-content { margin-bottom: 20px; }
    .main-content h2 { font-family: 'Roboto Condensed', sans-serif; font-size: 37px; color: #396f90; font-weight: 700; text-transform: uppercase; letter-spacing: -1px; }
    .main-content p { font-size: 16px; letter-spacing: -0.5px; }
ul.social { width: 100%; float: left; margin-bottom: 30px; }
    ul.social li { display: inline; text-align: center; }
        ul.social li i { font-size: 20px; line-height: 44px; }
        ul.social li a { -webkit-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.15); box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.15); width: 42px; border: 4px solid #fff; height: 42px; float: left; margin-right: 10px; color: #fff; }
        ul.social li#facebook a { background: #3b5998; }
        ul.social li#twitter a { background: #55acee; }
        ul.social li#linkedin a { background: #0077b5; }
        ul.social li a:hover { opacity: 0.9; }
ul.info { width: 100%; float: left; }
    ul.info i { width: 30px; font-size: 20px; color: #000; }
    ul.info li { margin-bottom: 15px; }
        ul.info li a { color: #4a4a4a; text-decoration: none; }
            ul.info li a:hover { text-decoration: underline; }
.watch-section { display: none; }
ul.social2 { display: none; }

@media only screen and (max-width: 1024px) {
    .left-section { width: 30%; float: left; }
        .left-section img { float: right; width: 70%; margin-right: 50px; }
    .right-section { width: 70%; }
}


@media only screen and (max-width: 768px) {
    .left-section { display: none; }
    .watch-section { width: 100%; float: left; text-align: center; display: block; }
        .watch-section img { width: 20%; }
    .right-section { width: 90%; padding: 0 5%; float: left; }
    h1 { -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; /*background: #e8ebec; padding: 5px 0;*/ width: 100%; text-align: center; font-family: 'Roboto Slab', serif; font-weight: 700; color: #4d4d4d; font-size: 35px; text-transform: uppercase; letter-spacing: -1px; float: left; margin-bottom: 15px; }
    .seprator { float: none; clear: both; }
    .main-content { margin-bottom: 20px; text-align: center; }
        .main-content h2 { font-family: 'Roboto Condensed', sans-serif; font-size: 22px; color: #396f90; font-weight: 700; text-transform: uppercase; letter-spacing: -0.5px; }
        .main-content p { font-size: 15px; letter-spacing: -0.5px; }
    ul.info { width: 100%; float: left; margin-bottom: 15px; }
        ul.info i { width: 100%; color: #000; display: block; font-size: 20px; text-align: center; }
        ul.info li { margin-bottom: 15px; text-align: center; font-size: 15px; }
            ul.info li a { color: #4a4a4a; text-decoration: none; }
                ul.info li a:hover { text-decoration: underline; }
    ul.social { display: none; }
    .social-links { display: table; margin: 0 auto; }
    ul.social2 { display: inherit; }
    ul.social2 { width: 100%; list-style: none; float: left; margin-bottom: 30px; }
        ul.social2 li { display: inline; text-align: center; }
            ul.social2 li i { font-size: 20px; line-height: 44px; }
            ul.social2 li a { -webkit-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.15); box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.15); width: 42px; border: 4px solid #fff; height: 42px; float: left; margin: 0 5px; color: #fff; }
            ul.social2 li#facebook a { background: #3b5998; }
            ul.social2 li#twitter a { background: #55acee; }
            ul.social2 li#linkedin a { background: #0077b5; }
            ul.social2 li a:hover { opacity: 0.9; }
}