/* UTF-8! ÄÖÜäöüß
######################################################################
CSS Stylesheet for StickyNotes gpEasy Plugin
Author: J. Krausz
Date: 2015-03-29
Version 1.0
######################################################################
*/


@font-face {
font-family:'permanent-marker';
src:url('webfonts/PermanentMarker-webfont.eot');
src:url('webfonts/PermanentMarker-webfont.eot?#iefix') format('embedded-opentype'),
    url('webfonts/PermanentMarker-webfont.woff') format('woff'),
    url('webfonts/PermanentMarker-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}

#gpx_content {
position:relative;
}

.filetype-sticky_note_section {
position:absolute;
display:inline-block;
font-size:1em;
-moz-transform:rotate(4deg); 
-webkit-transform:rotate(4deg);
-o-transform:rotate(4deg);
-ms-transform:rotate(4deg);
transform:rotate(4deg);
min-width:124px;
min-height:124px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding:24px 24px 24px 32px;
z-index:24;
white-space:nowrap;
color:#383629;
}

.filetype-sticky_note_section > :first-child,
.filetype-sticky_note_section > * {
margin-top:0;
}

.filetype-sticky_note_section > :last-child {
margin-bottom:0;
}

.filetype-sticky_note_section:before {
content:"";
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
background:url(StickyNoteBackground.png) bottom left no-repeat;
background-size:cover;
padding:50%;
z-index:-1;
}

.filetype-sticky_note_section,
.filetype-sticky_note_section p,
.filetype-sticky_note_section h1,
.filetype-sticky_note_section h2,
.filetype-sticky_note_section h3,
.filetype-sticky_note_section h4,
.filetype-sticky_note_section h5,
.filetype-sticky_note_section h6 {
font-family:permanent-marker;
font-weight:normal;
color:#383629;
}

.filetype-sticky_note_section p { font-size:1em; }
.filetype-sticky_note_section h1 { font-size:2.2em; }
.filetype-sticky_note_section h2 { font-size:1.9em; }
.filetype-sticky_note_section h3 { font-size:1.7em; }
.filetype-sticky_note_section h4 { font-size:1.5em; }
.filetype-sticky_note_section h5, h6 { font-size:1.2em; }

.filetype-sticky_note_section .sticky_note_dismiss,
.filetype-sticky_note_section .sticky_note_draghandle {
position:absolute;
width:16px;
height:16px;
font-family:sans-serif!important;
text-align:center;
color:#B29F53;
color:rgba(0,0,0,0.3);
-webkit-transition:color 0.3s;
-moz-transition:color 0.3s;
-ms-transition:color 0.3s;
-o-transition:color 0.3s;
transition:color 0.3s;
-webkit-touch-callout:none;
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
}

.filetype-sticky_note_section .sticky_note_dismiss {
top:8px;
font-size:16px;
line-height:16px;
right:8px;
cursor:pointer;
}

.filetype-sticky_note_section .sticky_note_draghandle {
top:6px;
font-size:14px;
line-height:4px;
right:28px;
cursor:move;
}

.filetype-sticky_note_section:hover .sticky_note_dismiss,
.filetype-sticky_note_section:hover .sticky_note_draghandle {
color:rgba(0,0,0,0.7);
}


/* admin mode */
.gpAdmin .filetype-sticky_note_section.gp_editing {
position:absolute!important;
}

@media screen and (max-width:480px) and (orientation:portrait) {

  .filetype-sticky_note_section {
  max-width:80%;
  max-height:80%;
  font-size:0.75em;
  }

  .filetype-sticky_note_section .sticky_note_dismiss,
  .filetype-sticky_note_section .sticky_note_draghandle {
  width:26px;
  height:26px;
  }

  .filetype-sticky_note_section .sticky_note_dismiss {
  top:8px;
  font-size:26px;
  line-height:26px;
  }

  .filetype-sticky_note_section .sticky_note_draghandle {
  top:6px;
  font-size:20px;
  line-height:6px;
  right:36px;
  }

}