html {font-size:16px; font-family: 'Open Sans', sans-serif; line-height:1.5;}

* {box-sizing:border-box;}
body {background-color:rgba(0,0,0,0.5); background-position:center center; background-size:cover; background-attachment:fixed;}
/*body:before {content:''; display:block; position:fixed; top:0; right:0; bottom:0; left:0; background-color:rgba(0,0,0,0.5);}*/
body.no-scroll {overflow:hidden;}

img, video {max-width:100%; max-height:100vh;}

a {color:#005495;}

:focus {outline:none;}

#page {position:relative; z-index:10;}

.bg-color-red {background-color:#EE1D23!important;}
.bg-color-blue {background-color:rgb(0,0,100)!important;}

.splash {display:flex!important;}
.splash.panel > div {margin:auto; text-align:center; padding:2rem; max-width: 600px;}
.splash p {text-align:justify; margin-top:0;}

.splash .actions a {display:block; margin-top:10px;} 
@media (min-width:480px){
    .splash .actions {display:table; width:calc(100% + 20px); table-layout:fixed; border-spacing:10px; margin-left:-10px;}
    .splash .actions a {display:table-cell; vertical-align:middle;} 
}
    hr {border:none; display:block; height:1px; background-color:#ccc; margin:2rem 0;}

#splash-logo {background-size:contain; background-position:center center; background-repeat:no-repeat;}

.button {display:inline-block; padding:1rem 2rem; color:#fff; background-color:#222; text-decoration:none; border:0; cursor:pointer;}

.panel {min-height:90vh; margin-top:10vh; display:flex; border:none; padding:1rem; padding-top:10vh; flex-direction:column; position:relative; z-index:10;}
.panel > div {margin-left:auto; margin-right:auto; background-color:rgba(255,255,255,0.95); color:#222; padding:2rem; width:100%; max-width:640px;}
.panel h1,
.panel h2 {margin-top:0;}

.input {margin-bottom:1rem;}
.input label {display:block;}
.input input {display:block; width:100%; padding:0.5rem 1rem;}
.error {padding:10px; background-color:rgba(100,0,0,0.15); color:#a00;}


#choose-type {max-width:360px; margin:auto;}
#choose-type .button {display:block; margin-top:1rem; text-align:center; width:100%;}
#choose-type h2 {font-size:1rem; text-align:center}

/* uploads */
.drop-target {background-color:rgba(255,255,255,0.95); height:12rem; line-height:12rem; border:3px solid transparent;}
.drop-target.dragenter {border-color:rgb(0,100,0);}

#drop-video,
#drop-image {position:relative; overflow: hidden;}
#preview-video,
#preview-image {margin-top:1rem;}
#preview-video video,
#preview-image image {max-width:100%; display:block; margin-left:auto; margin-right:auto;}

.file-upload input[type="file"] {display: none;}
.file-upload {border:1px solid #ccc; display:block; padding:1rem; text-align:center; cursor:pointer; background-color:rgba(255,255,255,0.95);}

textarea {display:block; padding:1rem; margin-bottom:20px; max-width:100%; min-width:100%; border:1px solid #ddd;}

.message-type-input {margin-top:1rem;}
#message-input {width:100%; text-align:center;}


#message-submit {text-align:center; margin-top:2rem;}
#message-submit-button {margin:0.5rem auto; display:block;}
#message-reset-button,
#return-to-create-an-account {margin:0.5rem auto; background-color:transparent; border:0; text-decoration:underline; display:block;}
#return-to-create-an-account {color:rgb(100,0,0);}

label {display:block; font-size:75%;}
input {padding:0.5rem 1rem; width:100%; margin-bottom:1rem; border:1px solid #ddd;}
input[type="radio"] {width:auto;}

#payment {padding:1rem; background-color:#fff; border:1px solid #ddd; margin-bottom:1rem;}

#submit,
#save-message-submit,
[type="submit"] {display:block; padding:1rem 2rem; color:#fff; margin-top:1rem; background-color:rgb(128,0,32); text-decoration:none; border:0; cursor:pointer; width:100%;}

#nav-logo {z-index:1000;}
#nav-logo a {max-width:200px; display:inline-block; vertical-align:middle; position:relative; top:4px; opacity:0; transition:opacity ease 1s;}
#nav-logo a.show {opacity:1;}
#nav-logo a img {display:block;}

/*#navicon {display:inline-block; color:#fff; background-color:transparent; border:0; width:auto; font-size:200%; cursor:pointer; vertical-align:middle; margin-top:0;}*/

#site-nav,
#user-nav,
#modal {position:fixed; top:100%; left:0; width:100%; height:100%; overflow-y:auto; z-index:10000; transition:top ease 0.5s; padding:1rem;}
#site-nav {background-color:rgba(255,255,255,0.95); padding-top:10vh;}
#user-nav {background-color:rgba(255,255,255,0.95); padding-top:10vh;}
#modal {background-image:url('/theme/images/photo-1499188073299-5bd9060e044b.jpg'); background-position:center center; background-size:cover; padding-top:20vh; padding-bottom:20vh;}

#site-nav.open {top:0;}
#user-nav.open {top:0;}
#modal.open {top:0;}

#site-nav nav {margin:auto; max-width:640px; width:100%;}
#site-nav a {display:block; padding:1rem 2rem; color:#fff; background-color:rgb(128,0,32); text-decoration:none; border:0; cursor:pointer; margin:1rem auto;}
#user-nav nav {margin:auto; max-width:640px; width:100%;}
#user-nav a {display:block; padding:1rem 2rem; color:#fff; background-color:rgb(128,0,32); text-decoration:none; border:0; cursor:pointer; margin:1rem auto;}
#modal-content {margin:auto; width:100%; max-width:800px; background-color:rgba(255,255,255,0.95); padding:1rem;}

#close-site-nav,
#close-user-nav,
#close-modal {position:fixed; top:0; right:0; width:auto; font-size:200%; z-index:10000; width:20%; height:10vh;}
#close-site-nav button,
#close-user-nav button,
#close-modal button {background-color:rgba(0,0,0,0.5); color:#fff; cursor:pointer; border:0; font-size:2rem; width:3rem; height:3rem; position:absolute; top:50%; left:50%; margin-top:-1.5rem; margin-left:-1.5rem;}
#close-site-nav button {background-color:rgba(255,255,255,0.5); color:#000;}
#close-user-nav button {background-color:rgba(255,255,255,0.5); color:#000;}
#close-modal button {background-color:rgba(0,0,0,0.5); color:#fff; }


#site-nav-mobile {position:fixed; top:0; left:0; width:100%; height:10vh; /*background-image:url('/theme/images/photo-1499188073299-5bd9060e044b.jpg');*/ background-color:rgba(0,0,0,0.5); background-position:center center; background-size:cover; z-index:10;}
#site-nav-mobile:before {content:''; display:block; position:absolute; top:0; right:0; bottom:0; left:0; background-color:rgba(0,0,0,0.5);}
#site-content {margin-top:10vh; height:90vh;}

#site-nav-mobile-home-link {position:absolute; top:0; left:20%; height:100%; width:60%; padding:0.25rem;}
#site-nav-mobile-home-link a {display:block; height:100%; background-position:center center; background-size:contain; background-repeat:no-repeat;}

#site-nav-mobile-menu-link {position:absolute; top:0; left:0; height:100%; width:20%;}
#site-nav-mobile-menu-link button {display:block; height:100%; background-color:transparent; border:0; width:100%; font-size:200%; cursor:pointer; color:#fff;}

#site-nav-mobile-user-link {position:absolute; top:0; right:0; height:100%; width:20%; text-align:center;}
#site-nav-mobile-user-link button {background-color:transparent; background-size:cover; border:0; cursor:pointer; height:100%; width:10vh; line-height:10vh;}
#site-nav-mobile-user-link .button {background-color:transparent; background-size:cover; border:0; padding:0; cursor:pointer; height:100%; width:10vh; line-height:10vh;}

#login .button {display:block; margin-top:20px; width:100%;}

.user-nav {display:table; width:100%; background-color:rgba(0,0,0,0.75); table-layout:fixed;}
.user-nav a {display:table-cell; padding:0.25rem; font-size:75%; color:#fff; text-decoration:none; text-align:center;}

.embed-responsive {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  overflow: hidden;
}

.embed-responsive::before {
  display: block;
  content: "";
}

.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object,
.embed-responsive video {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.embed-responsive-21by9::before {
  padding-top: 42.857143%;
}

.embed-responsive-16by9::before {
  padding-top: 56.25%;
}

.embed-responsive-4by3::before {
  padding-top: 75%;
}

.embed-responsive-1by1::before {
  padding-top: 100%;
}

/* magahearts.com */
.message {position:relative; text-align:center; background-color:#fff; border-radius:20px;}
/*.message .corner {width:0; height:0; border-width:0; border-style:solid; border-color:transparent; position:absolute;}

.message .corner.top.left {border-width:6rem 6rem 0 0; border-top-color:rgb(245,207,143); top:0; left:0; margin-left:-5px; margin-top:-5px;}
.message .corner.top.right {border-width:0 6rem 6rem 0; border-right-color:rgb(245,207,143); top:0; right:0; margin-right:-5px; margin-top:-5px;}
.message .corner.bottom.left {border-width:6rem 0 0 6rem; border-left-color:rgb(245,207,143); bottom:0; left:0; margin-left:-5px; margin-bottom:-5px;}
.message .corner.bottom.right {border-width:0 0 6rem 6rem; border-bottom-color:rgb(245,207,143); bottom:0; right:0; margin-right:-5px; margin-bottom:-5px;}*/

.message:before {content:''; background-image:url('/theme/images/magahearts/post-background-lines.png'); background-repeat:no-repeat; background-position:center center; position:absolute; bottom:2rem; left:2rem; width:calc(100% - 4rem); height:74px;}
.message .message-meta {background-color:#fff; padding:10px; position:relative; max-width:200px; margin-left:auto; margin-right:auto; background-image:url('/theme/images/magahearts/wings.png'); background-repeat:no-repeat; background-position:center 10px; padding-top:73px; margin-top:2rem;}

.bg-stars {position:relative; display:block; padding-left:2rem; padding-right:2rem;}
.bg-stars:before,
.bg-stars:after {content:''; position:absolute; top:0; width:2rem; height:100%; background-image:url('/theme/images/magahearts/post-background-stars.png'); background-repeat:no-repeat; background-position:center center; background-size:contain;}
.bg-stars:before {left:-1rem;}
.bg-stars:after {right:-1rem;}

body {background-color:#33b1fa; /*background-image:url('/theme/images/magahearts/megahearts-home-page.jpg');*/ background-image:url('https://images.unsplash.com/photo-1547985510-593e2bdb0094?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1500&q=80');}
body:before {content:''; display:block; position:fixed; top:0; right:0; bottom:0; left:0; background-color:rgba(255,255,255,0.75);}

#site-nav-mobile {background-color:rgba(10, 15, 68, 0.75);}
#site-nav-mobile:before {display:none;}

#choose-type [data-message-type] {background-color:transparent; border:0; cursor:pointer; max-width:12rem; display:inline-block;}

#choose-type {max-width:none; text-align:center; display:inline-block; width:auto;}
#submit-message {text-align:center;}

/*#site-nav-mobile-home-link a {background-image:url('/theme/images/thankyoutrump-03-13-2020-1.png');}
#splash-logo {background-image:url('/theme/images/thankyoutrump.png'); height:5rem;}*/
#site-nav-mobile-home-link a {background-image:url('/theme/images/magahearts/logo-white.png');}

#site-nav-mobile-menu-link button i {background-color:#EE1D23; padding: 5px 10px;}
.panel > div {border-radius:20px;}
.button {border-radius:20px;}
#site-nav a {border-radius:20px;}

#submit, #save-message-submit, [type="submit"] {background-color:#EE1D23; border-radius:20px;}

.message-embed iframe {width:100%!important; min-width:0!important;}