@charset "utf-8";
 @import url(bootstrap-dark.css); 
 @import url(tiles.css); 
 @import url(font-awesome.min.css);


.icon-play {
font-size: 14px;	
}

/*---Notepad---*/

.postit {
margin-top: 50px; height:80%; width:100%; text-align:center;  z-index: 1000;  display:none;  position:absolute;  left: 0px; top: 0px; text-align:center; border:0;
}
.postit2 {
 margin:auto; 
}
.note { width:70%;
color: #333; max-width:800px; position: relative; margin: auto;  padding: 20px;  box-shadow: 0 10px 10px 2px rgba(0,0,0,0.3);  background: #eae672;
}

#areatext {
margin-top:10px; min-height:300px; background: #eae672; font-size: 18px; Line-Height: 1.4;  letter-spacing:0.1em; font-family: 'Architects Daughter', cursive;
border: none;
overflow: auto;
outline: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none; 
}
.navnote {
font-size: 40px; padding-right:0px; padding-left:14px; color:black; z-index: 1001;
}
#savenote:hover {
color:green	
}
#stopnote:hover {
color:red	
}

/*---bkg---*/
#page2 {
background: #1f082a; /* Old browsers */

/* IE9 SVG, needs conditional override of 'filter' to 'none' */

background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMTAwJSIgeDI9IjEwMCUiIHkyPSIwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjMWYwODJhIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjMjUwYzQyIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjMjUwYzQyIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjMzMwZjU1IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNTIlIiBzdG9wLWNvbG9yPSIjMjcwYTNjIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNzYlIiBzdG9wLWNvbG9yPSIjMjQwODM2IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iODglIiBzdG9wLWNvbG9yPSIjMjIwZTU0IiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);

background: -moz-linear-gradient(45deg, #1f082a 0%, #250c42 25%, #250c42 25%, #330f55 25%, #270a3c 52%, #240836 76%, #220e54 88%); /* FF3.6+ */

background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#1f082a), color-stop(25%,#250c42), color-stop(25%,#250c42), color-stop(25%,#330f55), color-stop(52%,#270a3c), color-stop(76%,#240836), color-stop(88%,#220e54)); /* Chrome,Safari4+ */

background: -webkit-linear-gradient(45deg, #1f082a 0%,#250c42 25%,#250c42 25%,#330f55 25%,#270a3c 52%,#240836 76%,#220e54 88%); /* Chrome10+,Safari5.1+ */

background: -o-linear-gradient(45deg, #1f082a 0%,#250c42 25%,#250c42 25%,#330f55 25%,#270a3c 52%,#240836 76%,#220e54 88%); /* Opera 11.10+ */

background: -ms-linear-gradient(45deg, #1f082a 0%,#250c42 25%,#250c42 25%,#330f55 25%,#270a3c 52%,#240836 76%,#220e54 88%); /* IE10+ */

background: linear-gradient(45deg, #1f082a 0%,#250c42 25%,#250c42 25%,#330f55 25%,#270a3c 52%,#240836 76%,#220e54 88%); /* W3C */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1f082a', endColorstr='#220e54',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */	
}
#page3, #page5 {
background: #0b1b39; /* Old browsers */

/* IE9 SVG, needs conditional override of 'filter' to 'none' */

background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMTAwJSIgeDI9IjEwMCUiIHkyPSIwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjMGIxYjM5IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjMTAzYTVjIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjMTAzYTVjIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjMTU0NTc1IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNTIlIiBzdG9wLWNvbG9yPSIjMGUyYjUyIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNzYlIiBzdG9wLWNvbG9yPSIjMGIyNjRiIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iODglIiBzdG9wLWNvbG9yPSIjMTM1OTcyIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);

background: -moz-linear-gradient(45deg, #0b1b39 0%, #103a5c 25%, #103a5c 25%, #154575 25%, #0e2b52 52%, #0b264b 76%, #135972 88%); /* FF3.6+ */

background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#0b1b39), color-stop(25%,#103a5c), color-stop(25%,#103a5c), color-stop(25%,#154575), color-stop(52%,#0e2b52), color-stop(76%,#0b264b), color-stop(88%,#135972)); /* Chrome,Safari4+ */

background: -webkit-linear-gradient(45deg, #0b1b39 0%,#103a5c 25%,#103a5c 25%,#154575 25%,#0e2b52 52%,#0b264b 76%,#135972 88%); /* Chrome10+,Safari5.1+ */

background: -o-linear-gradient(45deg, #0b1b39 0%,#103a5c 25%,#103a5c 25%,#154575 25%,#0e2b52 52%,#0b264b 76%,#135972 88%); /* Opera 11.10+ */

background: -ms-linear-gradient(45deg, #0b1b39 0%,#103a5c 25%,#103a5c 25%,#154575 25%,#0e2b52 52%,#0b264b 76%,#135972 88%); /* IE10+ */

background: linear-gradient(45deg, #0b1b39 0%,#103a5c 25%,#103a5c 25%,#154575 25%,#0e2b52 52%,#0b264b 76%,#135972 88%); /* W3C */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0b1b39', endColorstr='#135972',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */

}

#page4 {
background: #1c1c1c; /* Old browsers */

/* IE9 SVG, needs conditional override of 'filter' to 'none' */

background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMTAwJSIgeDI9IjEwMCUiIHkyPSIwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjMWMxYzFjIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjMmQyZDJkIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjMmQyZDJkIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjMzkzOTM5IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNTIlIiBzdG9wLWNvbG9yPSIjMjgyODI4IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNzYlIiBzdG9wLWNvbG9yPSIjMjQyNDI0IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iODglIiBzdG9wLWNvbG9yPSIjMzgzODM4IiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);

background: -moz-linear-gradient(45deg, #1c1c1c 0%, #2d2d2d 25%, #2d2d2d 25%, #393939 25%, #282828 52%, #242424 76%, #383838 88%); /* FF3.6+ */

background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#1c1c1c), color-stop(25%,#2d2d2d), color-stop(25%,#2d2d2d), color-stop(25%,#393939), color-stop(52%,#282828), color-stop(76%,#242424), color-stop(88%,#383838)); /* Chrome,Safari4+ */

background: -webkit-linear-gradient(45deg, #1c1c1c 0%,#2d2d2d 25%,#2d2d2d 25%,#393939 25%,#282828 52%,#242424 76%,#383838 88%); /* Chrome10+,Safari5.1+ */

background: -o-linear-gradient(45deg, #1c1c1c 0%,#2d2d2d 25%,#2d2d2d 25%,#393939 25%,#282828 52%,#242424 76%,#383838 88%); /* Opera 11.10+ */

background: -ms-linear-gradient(45deg, #1c1c1c 0%,#2d2d2d 25%,#2d2d2d 25%,#393939 25%,#282828 52%,#242424 76%,#383838 88%); /* IE10+ */

background: linear-gradient(45deg, #1c1c1c 0%,#2d2d2d 25%,#2d2d2d 25%,#393939 25%,#282828 52%,#242424 76%,#383838 88%); /* W3C */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c1c1c', endColorstr='#383838',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */	
}
#page7 {
background: #0a2a34; /* Old browsers */

/* IE9 SVG, needs conditional override of 'filter' to 'none' */

background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMTAwJSIgeDI9IjEwMCUiIHkyPSIwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjMGEyYTM0IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjMGY1MDUzIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjMGY1MDUzIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjMTM2MjZiIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNTIlIiBzdG9wLWNvbG9yPSIjMGQ0MTRiIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNzYlIiBzdG9wLWNvbG9yPSIjMGEzOTQ0IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iODglIiBzdG9wLWNvbG9yPSIjMTE2OTVkIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);

background: -moz-linear-gradient(45deg, #0a2a34 0%, #0f5053 25%, #0f5053 25%, #13626b 25%, #0d414b 52%, #0a3944 76%, #11695d 88%); /* FF3.6+ */

background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#0a2a34), color-stop(25%,#0f5053), color-stop(25%,#0f5053), color-stop(25%,#13626b), color-stop(52%,#0d414b), color-stop(76%,#0a3944), color-stop(88%,#11695d)); /* Chrome,Safari4+ */

background: -webkit-linear-gradient(45deg, #0a2a34 0%,#0f5053 25%,#0f5053 25%,#13626b 25%,#0d414b 52%,#0a3944 76%,#11695d 88%); /* Chrome10+,Safari5.1+ */

background: -o-linear-gradient(45deg, #0a2a34 0%,#0f5053 25%,#0f5053 25%,#13626b 25%,#0d414b 52%,#0a3944 76%,#11695d 88%); /* Opera 11.10+ */

background: -ms-linear-gradient(45deg, #0a2a34 0%,#0f5053 25%,#0f5053 25%,#13626b 25%,#0d414b 52%,#0a3944 76%,#11695d 88%); /* IE10+ */

background: linear-gradient(45deg, #0a2a34 0%,#0f5053 25%,#0f5053 25%,#13626b 25%,#0d414b 52%,#0a3944 76%,#11695d 88%); /* W3C */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0a2a34', endColorstr='#11695d',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */	
}
#page9 {
background: #132a08; /* Old browsers */

/* IE9 SVG, needs conditional override of 'filter' to 'none' */

background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMTAwJSIgeDI9IjEwMCUiIHkyPSIwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjMTMyYTA4IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjMjg0MjBjIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjMjg0MjBjIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjMzA1NTBmIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNTIlIiBzdG9wLWNvbG9yPSIjMWUzYzBhIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNzYlIiBzdG9wLWNvbG9yPSIjMWEzNjA4IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iODglIiBzdG9wLWNvbG9yPSIjM2Y1NDBlIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);

background: -moz-linear-gradient(45deg, #132a08 0%, #28420c 25%, #28420c 25%, #30550f 25%, #1e3c0a 52%, #1a3608 76%, #3f540e 88%); /* FF3.6+ */

background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#132a08), color-stop(25%,#28420c), color-stop(25%,#28420c), color-stop(25%,#30550f), color-stop(52%,#1e3c0a), color-stop(76%,#1a3608), color-stop(88%,#3f540e)); /* Chrome,Safari4+ */

background: -webkit-linear-gradient(45deg, #132a08 0%,#28420c 25%,#28420c 25%,#30550f 25%,#1e3c0a 52%,#1a3608 76%,#3f540e 88%); /* Chrome10+,Safari5.1+ */

background: -o-linear-gradient(45deg, #132a08 0%,#28420c 25%,#28420c 25%,#30550f 25%,#1e3c0a 52%,#1a3608 76%,#3f540e 88%); /* Opera 11.10+ */

background: -ms-linear-gradient(45deg, #132a08 0%,#28420c 25%,#28420c 25%,#30550f 25%,#1e3c0a 52%,#1a3608 76%,#3f540e 88%); /* IE10+ */

background: linear-gradient(45deg, #132a08 0%,#28420c 25%,#28420c 25%,#30550f 25%,#1e3c0a 52%,#1a3608 76%,#3f540e 88%); /* W3C */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#132a08', endColorstr='#3f540e',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */	
}
#page8, #page6 {
background: #2a1308; /* Old browsers */

/* IE9 SVG, needs conditional override of 'filter' to 'none' */

background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMTAwJSIgeDI9IjEwMCUiIHkyPSIwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjMmExMzA4IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjNDIxMjBjIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjNDIxMjBjIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjNTUxYjBmIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNTIlIiBzdG9wLWNvbG9yPSIjM2MxNjBhIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNzYlIiBzdG9wLWNvbG9yPSIjMzYxMzA4IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iODglIiBzdG9wLWNvbG9yPSIjNTQwZTEzIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);

background: -moz-linear-gradient(45deg, #2a1308 0%, #42120c 25%, #42120c 25%, #551b0f 25%, #3c160a 52%, #361308 76%, #540e13 88%); /* FF3.6+ */

background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#2a1308), color-stop(25%,#42120c), color-stop(25%,#42120c), color-stop(25%,#551b0f), color-stop(52%,#3c160a), color-stop(76%,#361308), color-stop(88%,#540e13)); /* Chrome,Safari4+ */

background: -webkit-linear-gradient(45deg, #2a1308 0%,#42120c 25%,#42120c 25%,#551b0f 25%,#3c160a 52%,#361308 76%,#540e13 88%); /* Chrome10+,Safari5.1+ */

background: -o-linear-gradient(45deg, #2a1308 0%,#42120c 25%,#42120c 25%,#551b0f 25%,#3c160a 52%,#361308 76%,#540e13 88%); /* Opera 11.10+ */

background: -ms-linear-gradient(45deg, #2a1308 0%,#42120c 25%,#42120c 25%,#551b0f 25%,#3c160a 52%,#361308 76%,#540e13 88%); /* IE10+ */

background: linear-gradient(45deg, #2a1308 0%,#42120c 25%,#42120c 25%,#551b0f 25%,#3c160a 52%,#361308 76%,#540e13 88%); /* W3C */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2a1308', endColorstr='#540e13',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */	
}


.fake {
background: url(../images/bkg.jpg) repeat;
text-align:center;
font-size:13px;
}


/*------------ Swipe to refresh-----*/
.ptr {
z-index:10001; text-align:center; overflow:hidden; display:none; height:48px;
background: url(../images/hook-bgs.png) repeat;
}
.spinner2 {
	display: block; margin:auto; margin-top:8px;
	background: url(../images/hook-spinner.png) no-repeat center;
 	width: 32px;
 	height: 32px;
 	-webkit-animation: spin 1s linear infinite both;
 	-moz-animation: spin 1s linear infinite both;
 	-o-animation: spin 1s linear infinite both;
 	animation: spin 1s linear infinite both;
}
@-webkit-keyframes spin {
	0% { -webkit-transform: rotate(0deg);}
	100% {
		-webkit-transform: rotate(360deg);}
}

@-moz-keyframes spin {
	0% {  -moz-transform: rotate(0deg);	}
	100% { -moz-transform: rotate(360deg);}
}

@-o-keyframes spin {
	0% {  -o-transform: rotate(0deg);}
	100% {	-o-transform: rotate(360deg);}
}

@keyframes spin {
	0% { transform: rotate(0deg);}
	100% {	transform: rotate(360deg);}
}

/*-------------*/

@font-face {
    font-family: "RobotoRegular";
    src: url('../font/Roboto-Regular-webfont.eot');
    src: url('../font/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/Roboto-Regular-webfont.woff') format('woff'),
         url('../font/Roboto-Regular-webfont.ttf') format('truetype'),
         url('../font/Roboto-Regular-webfont.svg#RobotoRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "RobotoLight";
    src: url('../font/Roboto-Light-webfont.eot');
    src: url('../font/Roboto-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/Roboto-Light-webfont.woff') format('woff'),
         url('../font/Roboto-Light-webfont.ttf') format('truetype'),
         url('../font/Roboto-Light-webfont.svg#RobotoLight') format('svg');
    font-weight: normal;
    font-style: normal;
}


html, body{
}


.scrollable
{	
	margin-top: 10px; /* patch js > appliqué si pas ios - ios = webkitTransform 20px (bug status bar) */
	margin-left: 0px;
	margin-right: 0px;
	overflow-y: auto !important; 
	overflow-x: hidden !important;

}
body{
	overflow-y: auto !important;
	overflow-x: hidden !important;
	width: 100%;
	max-height: 100%;
	-webkit-touch-callout: none;  
}


body{margin:0px; font-size:14px; font-family: "Segoe UI", "Segoe WP", "RobotoRegular", sans-serif; line-height:20px; font-smooth:always}

a{font-family:"Segoe UI", "Segoe WP",  'RobotoRegular', sans-serif; font-size:14px; font-smooth:always}

p{font-size:14px; font-family:"Segoe UI", "Segoe WP",  'RobotoRegular', sans-serif; font-smooth:always}

h1, h2, h3, h4, h5, h6{font-family:"Segoe UI", "Segoe WP",  'RobotoRegular', sans-serif; margin-bottom:5px; font-smooth:always}

li{font-family:"Segoe UI", "Segoe WP",  'RobotoRegular', sans-serif; line-height:18px; font-smooth:always}



h1{font-size:22px; line-height:32px; font-smooth:always}
h2{font-size:20px; line-height:26px; font-smooth:always}
h3{font-size:18px; font-smooth:always}
h4{font-size:14px; line-height:16px; font-smooth:always}
h5{font-size:12px; margin-bottom:5px; font-smooth:always}
h6{font-size:10px; padding:0px; font-smooth:always}

.center{margin-left:auto; margin-right:auto;}
.left{float:left}
.right{float:right}

.resimgleft{margin-bottom:0px; margin-right:10px;}
.resimgright{margin-bottom:5px; margin-left:10px;}
.resimgcenter{margin-bottom:10px; margin-left:auto; margin-right:auto; display:block;}
#wrapper{
	width: auto !important;
	min-height: 100%;
	}

.webbutiles{ 
	overflow:hidden;
	margin-right: -10px;
	padding-left: 10px !important;
	}
header h1{margin-left:50px}
header{
	position: relative;
}
header .line{
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #999;
	padding-bottom: 8px;
	margin-left: 12px;
	margin-right: 12px;
	opacity:.6;
	
	}
header .line2{
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #999;
	padding-bottom: 8px;
	margin-left: 12px;
	margin-right: 12px;
	opacity:.6;
	padding-top:35px;
	}
.MiddleContent{
	margin-top: 15px;
	margin-left: 12px;
	margin-right: 12px;
	}

.linkbut{ position:absolute;left:10px;top:0px;z-index: 100;	cursor:pointer;}
.linkbuthome{ position:absolute;left:50px;top:0px;z-index: 100;	cursor:pointer;}
/* Main Container & Content & Logo */
.contents {
	height: 100%;
	min-height: 100%;
	width: 100%;
	overflow-y: auto;

	-webkit-overflow-scrolling: touch;

	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.logo{
	margin-left: auto;
	height: 40px;
	width: 140px;
	background-size: contain;
	margin-top: -37px;
	margin-right: auto;
	margin-bottom: 0px;
	display:block;
}

	

	/*--------------------------------------------------
	MAIN LINK PROPERTIES
	---------------------------------------------------*/
	a, a:link, a:visited{ text-decoration:none}
	a:hover{ text-decoration:none}
	a img, img{ border:none}



/*--------------------------------------------------
DIVIDER  & TITLES
Divider: http://www.okilla.com/289/resource-pixel-dividers/
---------------------------------------------------*/
/* For Page */
.line-title-left {
  margin-top: 10px;
  margin-bottom: 20px;
  font-size: 14px;
  text-align: left;
  letter-spacing: 1px;
  text-transform: uppercase;
  background-attachment: scroll;
  background-repeat: repeat-x;
  background-position: left center;
}
.line-title-left span {
  padding-right: 10px;
}
.line-title-middle {
  margin-top: 10px;
  margin-bottom: 20px;
  font-size: 14px;
  text-align: center;
  letter-spacing: 1px;
  text-transform: uppercase;
  background-attachment: scroll;
  background-repeat: repeat-x;
  background-position: left center;
}
.line-title-middle span {
  padding-right: 10px;
  padding-left: 10px;
  background-color: #ffffff;
}
.line-title-right {
  margin-top: 10px;
  margin-bottom: 20px;
  font-size: 14px;
  text-align: right;
  letter-spacing: 1px;
  text-transform: uppercase;
  background-attachment: scroll;
  background-repeat: repeat-x;
  background-position: left center;
}
.line-title-right span {
  padding-left: 10px;
  background-color: #ffffff;
}

.dividert{
	background-repeat: repeat-x;
	width: 100%;
	height: 2px;
	margin-top:-5px;
	margin-bottom:15px;
}

/* Dividers */
.divider1 {
  background-image: url('../images/dividers/divider1.png');
}
.divider2 {
  background-image: url('../images/dividers/divider2.png');
}
.divider3 {
  background-image: url('../images/dividers/divider3.png');
}
.divider4 {
  background-image: url('../images/dividers/divider4.png');
}
.divider5 {
  background-image: url('../images/dividers/divider5.png');
}
.divider6 {
  background-image: url('../images/dividers/divider6.png');
}
.divider7 {
  background-image: url('../images/dividers/divider7.png');
}
.divider8 {
  background-image: url('../images/dividers/divider8.png');
}
.divider9 {
  background-image: url('../images/dividers/divider9.png');
}
.divider10 {
  background-image: url('../images/dividers/divider10.png');
}
.divider11 {
  background-image: url('../images/dividers/divider11.png');
}
.divider12 {
  background-image: url('../images/dividers/divider12.png');
}
.divider13 {
  background-image: url('../images/dividers/divider13.png');
}
.divider14 {
  background-image: url('../images/dividers/divider14.png');
}
.divider15 {
  background-image: url('../images/dividers/divider15.png');
}
.divider16 {
  background-image: url('../images/dividers/divider16.png');
}
.divider17 {
  background-image: url('../images/dividers/divider17.png');
}
.divider18 {
  background-image: url('../images/dividers/divider18.png');
}
.divider19 {
  background-image: url('../images/dividers/divider19.png');
}
.divider20 {
  background-image: url('../images/dividers/divider20.png');
}


/*--------------------------------------------------
Loading Spinner
---------------------------------------------------*/
.spinnerbg{width:100%; height:100%; background-color:#000; opacity:.8; position:absolute; z-index:5; top:-7px; left:-10px;}
#spinner.active {
    display: block;
}
#spinner {
    position: absolute;
    height: 60px;
    width: 60px;
    top: 50%;
    left: 38%;
    z-index: 7;
}
.ball { 
    position: absolute;
    display: block;
    background-color: #ffffff;
    left: 24px;
    width: 12px;
    height: 12px;
    border-radius: 6px;
}
#first {
    -webkit-animation-timing-function: cubic-bezier(0.5, 0.3, 0.9, 0.9);
    -webkit-animation-name: rotate; 
    -webkit-animation-duration: 2s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-transform-origin: 6px 30px;
    -moz-animation-timing-function: cubic-bezier(0.5, 0.3, 0.9, 0.9);
    -moz-animation-name: rotate; 
    -moz-animation-duration: 2s; 
    -moz-animation-iteration-count: infinite;
    -moz-transform-origin: 6px 30px;

}
#second {
    -webkit-animation-timing-function: cubic-bezier(0.5, 0.5, 0.9, 0.9);
    -webkit-animation-name: rotate; 
    -webkit-animation-duration: 2s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-transform-origin: 6px 30px;
	  -moz-animation-timing-function: cubic-bezier(0.5, 0.5, 0.9, 0.9);
    -moz-animation-name: rotate; 
    -moz-animation-duration: 2s; 
    -moz-animation-iteration-count: infinite;
    -moz-transform-origin: 6px 30px;
}
#third {
    -webkit-animation-timing-function: cubic-bezier(0.5, 0.7, 0.9, 0.9);
    -webkit-animation-name: rotate; 
    -webkit-animation-duration: 2s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-transform-origin: 6px 30px;
	  -moz-animation-timing-function: cubic-bezier(0.5, 0.7, 0.9, 0.9);
    -moz-animation-name: rotate; 
    -moz-animation-duration: 2s; 
    -moz-animation-iteration-count: infinite;
    -moz-transform-origin: 6px 30px;
}
@-webkit-keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg) scale(1);
  }
  100% { 
    -webkit-transform: rotate(1440deg) scale(1); 
  }
}​

@-moz-keyframes rotate {
  0% {
    -moz-transform: rotate(0deg) scale(1);
  }
  100% { 
    -moz-transform: rotate(1440deg) scale(1); 
  }
}