@font-face {font-family:"Meta Pro";src:url('fonts/metapro.woff2') format('woff2'),url('fonts/metapro.woff') format('woff');font-weight normal;font-style:normal;}
@font-face {font-family:"FontAwesome";src:url('fonts/fontawesome.eot');src:url('fonts/fontawesome.eot?#iefix') format('embedded-opentype'),url('fonts/fontawesome.woff2') format('woff2'),url('fonts/fontawesome.woff') format('woff'),url('fonts/fontawesome.ttf') format('truetype'),url('fonts/fontawesome.svg#fontawesomeregular') format('svg');font-weight normal;font-style:normal;}
html {min-height:100%;overflow:auto;}
body {background-color:#fff;border:0;font-family:'Source Sans Pro',sans-serif;font-weight:400;margin:0;min-height:100%;overflow-y:hidden;padding:0;}
article, div, footer, header, section {background-color:transparent;border:0;display:block;margin:0;padding:0;position:relative;}
img {background-color:transparent;border:0;display:block;margin:0;padding:0;}
a {background-color:transparent;color:#ff9300;background-color:transparent;border:0;font-weight:600;margin:0;outline:0;padding:0;text-decoration:none;transition:all 0.3s ease-in-out;}
a:hover, a:active, a:focus {color:#6b77b3;outline:0;text-decoration:underline;}
::selection {background-color:#2e3caf;color:#fff;}
::-moz-selection {background-color:#2e3caf;color:#fff;}
    div#topper {display:none;height:40px;position:fixed;right:15px;bottom:15px;width:40px;z-index:10;}
      div#toplink {background-color:#2e3caf;background:linear-gradient(#2e3caf,#2e3caf);border-radius:20px;color:#fff;font-size:24px;height:40px;line-height:39px;margin:0 auto;opacity:1;text-align:center;transition:all 0.3s ease-in-out;width:40px;z-index:11;}
      div#toplink:hover {opacity:1;}
      div#toplink a {color:#fff;display:block;font-weight:400;height:40px;width:40px;}
      div#toplink a:hover, div#toplink a:active, div#toplink a:focus {text-decoration:none;}
    header {display:inline-block;width:100%;z-index:1;}
    header:after {content:'';display:block;}
      div#backdrop {background-size:cover;bottom:0;left:0;position:absolute;right:0;top:0;z-index:2;}
        div#logo {box-shadow:0 0 30px 5px #fff;left:50%;position:absolute;top:50%;z-index:3;}
    section {background-color:#fff;z-index:1;}
      article {margin:25px auto 0 auto;width:80%;z-index:2;}
        article h1, article h2, article h3, article h4 {color:#ff9300;display:inline-block;font-family:'Meta Pro';font-weight:400;padding:0 36px 0 36px;text-align:left;text-transform:none;transition:all 0.3s ease-in-out;}
        article p {color:#434653;font-size:18px;font-weight:400;line-height:27px;margin:0 auto 22px auto;text-align:justify;width:100%;}
          article em {color:#b25400;font-style:italic;font-weight:600;}
          article strong {color:#6b77b3;font-weight:600;}
        article ul {background-color:transparent;border:0;display:block;margin:0 auto 33px auto;padding:0;}
          article ul li {background-color:transparent;color:#434653;font-size:18px;line-height:27px;list-style-type:disc;margin:0 0 0 16px;padding:0;}
          article ul li a {font-weight:400;}
        article hr {background-color:#ced1ea;border:0;color:#ced1ea;height:1px;margin:33px 0 29px 0;padding:0;}
        div.heading {margin:0 auto 0 auto;text-align:center;width:100%;z-index:3;}
        div.rule {z-index:3;}
          div.rule hr {background-color:#ccc;border-width:0;height:1px;}
        div.diamond {background-color:#fff;color:#ddd;font-size:36px;line-height:36px;margin:0 auto 0 auto;text-align:center;width:37px;z-index:4;}
        div.quote {background-color:#f7f7f7;border:#ddd solid 1px;border-radius:10px;font-style:italic;font-weight:400;margin:33px auto 29px auto;padding:12px 0 0 0;width:90%;z-index:3;}
          div.quote p {color:#b25400;margin:0 0 0 20px;text-align:left;width:90%;}
          div.quote ul {margin:17px 20px 13px 20px;width:90%;}
        div.audio {text-align:center;width:90%;}
          audio {width:100%;}
        footer {background-color:#eff4f7;border-top:#ced1ea solid 1px;margin-top:30px;padding:34px 0 28px 0;z-index:2;}
          footer p {color:#434653;font-size:14px;line-height:21px;margin:0 auto 10px auto;text-align:justify;width:90%;}
            footer p a {color:#6b77b3;font-weight:600;}


/* MOBILE */


@media all and (min-width:240px) {
    header:after {padding-top:60%;}
      div#backdrop {background:url(back/500.jpg) center no-repeat;background-size:cover;}
        div#logo {margin:-26px 0 0 -90px;}
        div#logo, div#logo img {height:53px;width:180px;transition:all 0.3s ease-in-out;}
        article h1, article h2, article h3, article h4 {background:none;font-size:20px;line-height:16px;margin:11px auto 27px auto;padding:0;}
        div.rule {margin:46px auto -23px auto;}
        div.diamond {top:-24px;}
        div.audio {margin:32px auto 24px auto;}
article ul, div.quote, div.rule, div.audio, footer p {width:90%;}
}

@media all and (min-width:490px) {
      div#backdrop {background:url(back/560.jpg) center no-repeat;}
        div#logo {margin:-29px 0 0 -98px;}
        div#logo, div#logo img {height:58px;width:196px;transition:all 0.3s ease-in-out;}
      article {margin:38px auto 46px auto;}
        article h1, article h2, article h3, article h4 {background:url(66.png) top left no-repeat,url(99.png) top right no-repeat;background-size:21px 16px;font-size:23px;line-height:18px;margin:11px auto 27px auto;padding:0 25px 0 25px;}
        div.audio {margin:33px auto 25px auto;}
}

@media all and (min-width:550px) {
    header:after {padding-top:50%;}
      div#backdrop {background:url(back/640.jpg) center no-repeat;}
        div#logo {margin:-32px 0 0 -110px;}
        div#logo, div#logo img {height:65px;width:220px;}
      article {margin:54px auto 68px auto;}
        article h1, article h2, article h3, article h4 {background:url(66.png) top left no-repeat,url(99.png) top right no-repeat;background-size:24px 18px;font-size:26px;line-height:21px;margin:11px auto 26px auto;padding:0 28px 0 28px;}
        div.rule {margin:68px auto 28px auto;}
        div.diamond {top:-47px;}
        div.audio {margin:34px auto 23px auto;}
article ul, div.quote, div.rule, div.audio, footer p {width:85%;}
}

@media all and (min-width:640px) {
      div#backdrop {background:url(back/800.jpg) center no-repeat;}
        div#logo {margin:-37px 0 0 -128px;}
        div#logo, div#logo img {height:75px;width:256px;}
      article {margin:54px auto 79px auto;width:75%;}
        article h1, article h2, article h3, article h4 {background:url(66.png) top left no-repeat,url(99.png) top right no-repeat;background-size:26px 20px;font-size:29px;line-height:24px;margin:10px auto 24px auto;padding:0 30px 0 30px;}
        div.rule {margin:79px auto 39px auto;}
        div.diamond {top:-58px;}
        div.audio {margin:32px auto 24px auto;}
article ul, div.quote, div.rule, div.audio, footer p {width:80%;}
}

@media all and (min-width:800px) {
      div#backdrop {background:url(back/1024.jpg) center no-repeat;}
        div#logo {margin:-47px 0 0 -160px;}
        div#logo, div#logo img {height:94px;width:320px;}
      article {margin:89px auto 93px auto;width:70%;}
        article h1, article h2, article h3, article h4 {background:url(66.png) top left no-repeat,url(99.png) top right no-repeat;background-size:32px 24px;font-size:35px;line-height:28px;margin:11px auto 25px auto;padding:0 36px 0 36px;}
        div.rule {margin:93px auto 53px auto;}
        div.diamond {top:-72px;}
        div.audio {margin:29px auto 21px auto;}
article ul, div.quote, div.rule, div.audio, footer p {width:75%;}
}


/* DESKTOP */


@media all and (min-width:1000px) {
body {background:url(back/1280.jpg) center fixed no-repeat;background-size:cover;}
    header {float:left;height:100vh;max-height:none;position:fixed;width:50vw;}
      div#backdrop {background:none;}
    section {float:right;overflow:hidden;width:50vw;}
        div#logo {margin:-37px 0 0 -125px;}
        div#logo, div#logo img {height:74px;width:250px;}
      article {margin:42px auto 46px auto;width:75%;}
        article h1, article h2, article h3, article h4 {background:url(66.png) top left no-repeat,url(99.png) top right no-repeat;background-size:21px 16px;font-size:23px;line-height:18px;margin:11px auto 27px auto;padding:0 25px 0 25px;}
        div.rule {margin:46px auto -23px auto;}
        div.diamond {top:-24px;}
article ul, div.quote, div.rule, div.audio, footer p {width:90%;}
}

@media all and (min-width:1200px) {
body {background:url(back/1440.jpg) center fixed no-repeat;background-size:cover;}
        div#logo {margin:-44px 0 0 -150px;}
        div#logo, div#logo img {height:88px;width:300px;}
      article {margin:64px auto 68px auto;width:70%;}
        article h1, article h2, article h3, article h4 {background:url(66.png) top left no-repeat,url(99.png) top right no-repeat;background-size:24px 18px;font-size:26px;line-height:21px;margin:11px auto 26px auto;padding:0 28px 0 28px;}
        div.rule {margin:68px auto 28px auto;}
        div.diamond {top:-47px;}
article ul, div.quote, div.rule, div.audio, footer p {width:85%;}
}

@media all and (min-width:1400px) {
body {background:url(back/1600.jpg) center fixed no-repeat;background-size:cover;}
        div#logo {margin:-51px 0 0 -175px;}
        div#logo, div#logo img {height:103px;width:350px;}
      article {margin:75px auto 79px auto;width:70%;}
        article h1, article h2, article h3, article h4 {background:url(66.png) top left no-repeat,url(99.png) top right no-repeat;background-size:26px 20px;font-size:29px;line-height:24px;margin:11px auto 23px auto;padding:0 30px 0 30px;}
        div.rule {margin:79px auto 39px auto;}
        div.diamond {top:-58px;}
article ul, div.quote, div.rule, div.audio, footer p {width:80%;}
}

@media all and (min-width:1600px) {
body {background:url(back/1920.jpg) center fixed no-repeat;background-size:cover;}
        div#logo {margin:-59px 0 0 -200px;}
        div#logo, div#logo img {height:118px;width:400px;}
      article {margin:89px auto 93px auto;width:70%;}
        article h1, article h2, article h3, article h4 {background:url(66.png) top left no-repeat,url(99.png) top right no-repeat;background-size:32px 24px;font-size:35px;line-height:28px;margin:11px auto 25px auto;padding:0 36px 0 36px;}
        div.rule {margin:93px auto 53px auto;}
        div.diamond {top:-72px;}
article ul, div.quote, div.rule, div.audio, footer p {width:75%;}
}