/*** Main css ***/

/* VARIABLE DEFINITIONS */
:root {
  --primary: #79aec8;
  --secondary: #417690;
  --accent: #f5dd5d;
  --primary-fg: #fff;

  --body-fg: #333;
  --body-bg: #f7f5e1;
  --body-quiet-color: #666;
  --body-loud-color: #000;

  --header-color: #ffc;
  --header-branding-color: var(--accent);
  --header-bg: var(--secondary);
  --header-link-color: var(--primary-fg);

  --breadcrumbs-fg: #c4dce8;
  --breadcrumbs-link-fg: var(--body-bg);
  --breadcrumbs-bg: var(--primary);

  --link-fg: #5b80b2;
  --link-hover-color: #036;
  --link-selected-fg: #5b80b2;

  --hairline-color: #e8e8e8;
  --border-color: #ccc;

  --error-fg: #ba2121;

  --message-success-bg: #dfd;
  --message-warning-bg: #ffc;
  --message-error-bg: #ffefef;

  --darkened-bg: #f8f8f8; /* A bit darker than --body-bg */
  --selected-bg: #e4e4e4; /* E.g. selected table cells */
  --selected-row: #ffc;

  --button-fg: #fff;
  --button-bg: var(--primary);
  --button-hover-bg: #609ab6;
  --default-button-bg: var(--secondary);
  --default-button-hover-bg: #205067;
  --close-button-bg: #888; /* Previously #bbb, contrast 1.92 */
  --close-button-hover-bg: #747474;
  --delete-button-bg: #ba2121;
  --delete-button-hover-bg: #a41515;

  --object-tools-fg: var(--button-fg);
  --object-tools-bg: var(--close-button-bg);
  --object-tools-hover-bg: var(--close-button-hover-bg);
}

/* default main style */
html, body, div, span, object,
p, a, img {
    margin: 0;
    padding: 0;
    border: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
}
a img {
    border: none;
}
html {
    height: 100%;
}
body {
    padding: 0;
    margin: 0;
    font: 16px/22px adelle, Georgia, sans-serif;
    font-size-adjust: none;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    background: #f7f5e1;
}

/* errors in django forms */
ul.errorlist {
    margin: 0;
    padding: 0;
}
.errorlist li {
    background-color: red;
    color: white;
    display: block;
    font-size: 10px;
    margin: 0 0 3px;
    padding: 4px 5px;
}
a.page_selected {
    color: black;
}

  /* small screens */
  /* do some font adjustment here ? */
@media handeld and (max-width: 600px) {
    body {
        font-size: 16px;
    }
}


/*** main page design ***/
  /* default common part + large screens */
#pcontainer {
    width: 47.500em;
    margin: 0 auto;
}
#page {
    width: 43.750em;
    padding: 1.875em 1.875em 1.250em 1.875em;
    min-height: 6.250em;
    background: #fff;
    float: left;
    border: 1px solid rgba(0,0,0,0.20);
    -webkit-border-radius: 3px 3px 0 0;
    -moz-border-radius: 3px 3px 0 0;
    border-radius: 3px 3px 0 0;
    margin-top: 0.938em;
}
  /* small screens */
@media (max-width: 45.0em) {
    #pcontainer {
        width: 100%;
        margin: 0;
    }
    #page {
        width: 100%;
        border: none;
        margin-top: 0px;
        padding: 1px 0px 0px 0px;
    }
}
  /* intermediate screens */
@media (min-width: 45.0em) and (max-width: 48.750em) {
    #pcontainer {
        width: 100%;
    }
    #page {
        width: 99%;
        padding: 1.875em 0px 2px 2px;
    }
}

/*** header design ***/
#header_banner {
    text-align: right;
    padding: 0px 1.250em 0px 1.250em;
    background-image: url(/static/site_media/img/logo2.png);
    background-repeat: no-repeat;
    background-position: left;
}
  /* x-small screens */
@media (max-width: 30.40em) {
    #header_banner {
        background: #f9f9f9;
    }
}

/*** search box ***/
  /* default common part + large screens */
#search_box  {
    padding: 1px 5px 1px 5px;
    min-height: 4.275em;
    background: #f9f9f9;
    border: 1px solid rgba(0,0,0,0.20);
    -webkit-border-radius: 3px 3px 0 0;
    -moz-border-radius: 3px 3px 0 0;
    border-radius: 3px 3px 0 0;
    margin-top: 5px;
    margin-bottom: 5px;
}
#search_box form {
    width: 100%;
}
#search_box table {
    width: 18.750em;
    float: left;
}
#search_box input {
    float: left;
    margin-top: 0.938em;
    margin-right: 0.625em;
}
#search_box table input{
    position: static;
    margin-top: 0px;
    margin-right: 0px;
}
  /* small screens */
@media (max-width: 31.250em) {
    #search_box  {
        min-height: 6.538em;
    }
    #search_box table {
        width: 100%;
        position: static;
    }
    #search_box input {
        position: static;
        margin-top: 1px;
        margin-right: 1px;
    }
}
  /* x-small screens */
@media (max-width: 18.750em) {
    #search_box  {
        min-height: 9.063em;
    }
    #search_box td {
        float: left;
        clear: left;
    }
    #search_box th {
        float: left;
    }
}

/*** content ***/
#content {
    font-size: 90%;
    margin-top: 1em;
}

/*** content home ***/
div#home_image {
    width: 100%;
    height: 300px;
    background-image: url(/static/site_media/img/IMG_2117_600.jpg);
    background-repeat: no-repeat;
    background-position: center;
}
  /* small screens */
@media (max-width: 45.0em) {
    div#home_image {
        width: 100%;
        height: 180px;
        background-image: url(/static/site_media/img/IMG_2117_small.jpg);
        background-position: center;
    }
}

/*** content list ***/
#item_content {
    padding: 1px 5px 1px 5px;
    min-height: 3.438em;
    background: #f9f9f9;
    border: 1px solid rgba(0,0,0,0.20);
    -webkit-border-radius: 3px 3px 0 0;
    -moz-border-radius: 3px 3px 0 0;
    border-radius: 3px 3px 0 0;
    margin-top: 5px;
    margin-bottom: 5px;
}
#item_content textarea {
    overflow: auto;
    width: 36.250em;
}
  /* small screens */
@media (max-width: 45.0em) {
    #item_content textarea {
        width: 100%;
    }
}
@media (max-width: 25.625em) {
    #item_content td {
        float: left;
        clear: left;
    }
    #item_content th {
        float: left;
    }
}

/*** footer ***/
#footer {
    padding: 0px 0px 0px 1.250em;
    margin-top: 1.250em;
    margin-left: 3.0em;
    margin-right: 3.0em;
    font-size: 75%;
    color: black;
    border-top: 1px solid rgba(0,0,0,0.20);
    text-align: center;
}
#footer a:link, #footer a:visited {
    color: black;
    text-decoration: none;
}


/*** journal ***/
div#onglet_top {
	float: left;
	clear: left;
}
div#onglet_top, h2 {
	margin: 0px 0px 0.2em 0px;
}

div#list_content {
	float: left;
	clear: left;
	width: 100%;
	margin-bottom: 1em;
}

div.title_1_h {
	width: 4.5em;
	height: 1.7em;
    border: 0px solid rgba(91, 128, 178, 0.40);
    -webkit-border-radius: 0.5em 0.5em 0.5em 0.5em;
    -moz-border-radius: 0.5em 0.5em 0.5em 0.5em;
    border-radius: 0.5em 0.5em 0.5em 0.5em;
	background: rgba(91, 128, 178, 0.40);
	text-align: center;
	vertical-align: center;
	margin: 0.1em;
    padding-left: 0.2em;
    padding-top: 0.1em;
	float: left;
	cursor: pointer;
}

div.title_1_hs {
	width: 4.5em;
	height: 1.7em;
    border: 0px solid rgba(91, 128, 178, 0.40);
    -webkit-border-radius: 0.5em 0.5em 0.5em 0.5em;
    -moz-border-radius: 0.5em 0.5em 0.5em 0.5em;
    border-radius: 0.5em 0.5em 0.5em 0.5em;
	background: rgba(91, 0, 178, 0.40);
	text-align: center;
	vertical-align: center;
	margin: 0.1em;
    padding-left: 0.2em;
    padding-top: 0.1em;
	float: left;
	cursor: pointer;
}

div.sub_title_1_h  {
	float: left;
	clear: left;
}


div.content_2 {
	float: left;
	clear: left;
	width: 100%;
}

div.title_2_h {
	width: 3.6em;
	height: 1.7em;
    border: 0px solid rgba(91, 128, 178, 0.20);
    -webkit-border-radius: 0.5em 0.5em 0.5em 0.5em;
    -moz-border-radius: 0.5em 0.5em 0.5em 0.5em;
    border-radius: 0.5em 0.5em 0.5em 0.5em;
	background: rgba(91, 128, 178, 0.20);
	text-align: center;
	margin: 0.1em;
	float: left;
	cursor: pointer;
}

div.title_2_hs {
	width: 3.6em;
	height: 1.7em;
    border: 0px solid rgba(91, 128, 178, 0.20);
    -webkit-border-radius: 0.5em 0.5em 0.5em 0.5em;
    -moz-border-radius: 0.5em 0.5em 0.5em 0.5em;
    border-radius: 0.5em 0.5em 0.5em 0.5em;
	background: rgba(91, 0, 178, 0.20);
	text-align: center;
	margin: 0.1em;
	float: left;
	cursor: pointer;
}

div.title_3_h {
	background-image: url(/static/site_media/img/day_sumup_flag.jpg);
    background-repeat: no-repeat;
    background-position: left bottom;
    padding-left: 2em;
    /*padding: 0.20em 0.50em 0.20em 2em;*/
}

div.sumup_1 {
	border: 1px dashed rgba(0,0,0,0.20);
    padding: 0.20em 0.50em 0.20em 2em;
	margin-top: 0.250em;
	background-image: url(/static/site_media/img/year_sumup_flag.jpg);
    background-repeat: no-repeat;
    background-position: left top;
	float: left;
	clear: left;
	width: 95%;
}

div.sumup_2 {
	border: 1px dashed rgba(0,0,0,0.20);
    padding: 0.20em 0.50em 0.20em 2em;
    margin-bottom: 0.450em;
    margin-top: 0.250em;
	background-image: url(/static/site_media/img/month_sumup_flag.jpg);
    background-repeat: no-repeat;
    background-position: left top;
	float: left;
	clear: left;
	width: 95%;
}


div.editor_menu {
	float: right;
	clear: right;
	width: 1em;
	height: 1em;
	border: 1px solid rgba(0,0,0,0.30);
	background-image: url(/static/site_media/img/editor.jpg);
    background-repeat: no-repeat;
    background-position: left top;
}

div.monthControl {
	float: right;
	clear: right;
	border: 1px solid rgba(0,0,0,0.30);
}

div.adder_menu {
	float: left;
	width: 1em;
	height: 1em;
	border: 1px solid rgba(0,0,0,0.30);
	background-image: url(/static/site_media/img/adder.jpg);
    background-repeat: no-repeat;
    background-position: left top;
}

div.flipSort_menu {
	float: left;
	width: 1em;
	height: 1em;
	border: 1px solid rgba(0,0,0,0.30);
	background-image: url(/static/site_media/img/incord.jpg);
    background-repeat: no-repeat;
    background-position: left top;
}

div.flipSort_menu_r {
	float: left;
	width: 1em;
	height: 1em;
	border: 1px solid rgba(0,0,0,0.30);
	background-image: url(/static/site_media/img/decord.jpg);
    background-repeat: no-repeat;
    background-position: left top;
}


div.note_box_back {
	display: none;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,0.70);
    padding-top: 1em;
}

div.note_box_container {
    width: 43.750em;
    margin: 0 auto;
}

div.note_box_bartop {
	width: 41em;
	height: 1.5em;
	background-color: rgba(91, 128, 178, 0.90);
    padding: 0em 1.875em 0em 1.875em;
    border: 1px solid rgba(0,0,0,0.20);
    -webkit-border-radius: 3px 3px 0 0;
    -moz-border-radius: 3px 3px 0 0;
    border-radius: 3px 3px 0 0;
}

div.note_box {
	background: #f7f5e1;
	width: 41em;
    padding: 1.875em 1.875em 1.250em 1.875em;
    min-height: 6.250em;
    float: left;
    border: 1px solid rgba(0,0,0,0.20);
    -webkit-border-radius: 0 0 3px 3px;
    -moz-border-radius: 0 0 3px 3px;
    border-radius: 0 0 3px 3px;
}

/* small screens */
@media (max-width: 40.0em) {
    div.note_box_container {
        width: 100%;
    }
    div.note_box_bartop {
        width: 100%;
    }
    div.note_box {
        width: 100%;
        padding: 0.5em 0.1em 0.5em 0.5em;
    }
    div.note_box  th{
        display: none;
    }
    div.note_box  table,tbody,tr,td,textarea{
        width: 99%;
    }
}

/** from admin base.css */
input[type="text"], input[type="password"], textarea, select, .vTextField {
    border: 1px solid #ccc;
}
input, textarea, select, .form-row p {
    margin: 2px 0;
        margin-top: 2px;
        margin-right: 0px;
    padding: 2px 3px;
    vertical-align: middle;
    font-family: "Lucida Grande", Verdana, Arial, sans-serif;
    font-weight: normal;
    font-size: 11px;
}
td, th {
    font-size: 11px;
    line-height: 13px;
    font-family: "Lucida Grande", Verdana, Arial, sans-serif;
}
th {
    text-align: left;
    font-size: 12px;
    font-weight: bold;
}
table {
    border-collapse: collapse;
}
html, body, div, span, object, p, a, img {
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
}

a:link, a:visited {
    color: var(--link-fg);
    text-decoration: none;
}
a:hover {
    color: var(--link-hover-color);
}
h1 {
    font-size: 18px;
    color: #666;
    padding: 0 6px 0 0;
    margin: 0 0 .2em 0;
}
h2 {
    font-size: 16px;
}
h1, h2, h3, h4, h5 {
    font-weight: bold;
}
#footer {
    clear: both;
    padding: 10px;
}

/**** sign in page **/
div#signup h2 {
    font-size: 18px;
    margin-top: 2em;
}

div#signup p {
    margin-top: 1em;
    color: var(--body-quiet-color)
}


div#signup label {
    margin-top: 1em;
    color: var(--body-fg);
    font-weight: bold;
}


div#signup span.helptext {
    font-size: 12px;
    color: var(--body-quiet-color)
}

div#signup span.helptext {
    display: block;
}

div#signup li {
    color: var(--body-quiet-color)
}

div#signup button {
    padding: 0.5em 2em 0.5em 2em;
    margin-left: 60%;
}

div#signup ul.errorlist li {
    color: var(--body-fg);
    font-weight: bold;
    font-size: 16px;
}

/******/
