@import url('https://fonts.googleapis.com/css?family=Cormorant:400&display=swap');

.prof{float:left;height:150px;margin-right:10px;border:0px;}
@font-face {
  font-family: 'CormorantU';
  font-style: normal;
  src: url("lotus.woff2") format('woff2'), url("lotus.woff") format('woff');
}
/*
@font-face {
  font-family: 'Lagio';
  font-style: normal;
  src: url("lagiocondaostt-webfont.woff2") format('woff2'), url("lagiocondaostt-webfont.woff") format('woff');
}*/

@font-face {
  font-family: 'PT Serif';
  font-style: normal;
  font-weight: 400;
  src: local('PT Serif'), local('PTSerif-Regular'), url(https://fonts.gstatic.com/s/ptserif/v8/I-OtoJZa3TeyH6D9oli3ifesZW2xOQ-xsNqO47m55DA.woff2) format('woff2'), url("ptserif.woff") format("woff");

}
@font-face {font-family: "Franklin";
    src: url("FranklinGothic-Book-webfont.woff") format("woff");
}

/* */


* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

html {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5;
}
@media (min-width: 38rem) {
  html {
    font-size: 20px;
  }
}

body {
  color: #515151;
  background-color: #fff;
  -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
}

/* No `:visited` state is required by default (browsers will use `a`) */
a {
  color: #268bd2;
  text-decoration: none;
}
/* `:focus` is linked to `:hover` for basic accessibility */
a:hover,
a:focus {
  text-decoration: underline;
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
  
  margin-bottom: .5rem;
  font-weight: bold;
  line-height: 1.25;
  color: #313131;
  text-rendering: optimizeLegibility;
}
h1 {
  font-size: 2rem;
}
h2 {
  margin-top: 1rem;
  font-size: 1.5rem;
}
h3 {
  margin-top: 1.5rem;
  font-size: 1.25rem;
}
h4, h5, h6 {
  margin-top: 1rem;
  font-size: 1rem;
}

/* Body text */
p {
  margin-top: 0;
  margin-bottom: 1rem;
}

strong {
  color: #303030;
}


/* Lists */
ul, ol, dl {
  margin-top: 0;
  margin-bottom: 1rem;
}

dt {
  font-weight: bold;
}
dd {
  margin-bottom: .5rem;
}

/* Misc */
hr {
  /*position: relative;*/
  margin: 1.5rem 0;
  border: 0;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #fff;
}

abbr {
  font-size: 85%;
  font-weight: bold;
  color: #555;
  text-transform: uppercase;
}
abbr[title] {
  cursor: help;
  border-bottom: 1px dotted #e5e5e5;
}

/* Code */
code,
pre {
  font-family: Menlo, Monaco, "Courier New", monospace;
}
code {
  padding: .25em .5em;
  font-size: 85%;
  color: #bf616a;
  background-color: #f9f9f9;
  border-radius: 3px;
}
pre {
  display: block;
  margin-top: 0;
  margin-bottom: 1rem;
  padding: 1rem;
  font-size: .8rem;
  line-height: 1.4;
  white-space: pre;
  white-space: pre-wrap;
  word-break: break-all;
  word-wrap: break-word;
  background-color: #f9f9f9;
}
pre code {
  padding: 0;
  font-size: 100%;
  color: inherit;
  background-color: transparent;
}
.highlight {
  margin-bottom: 1rem;
  border-radius: 4px;
}
.highlight pre {
  margin-bottom: 0;
}

/* Quotes */
blockquote {
  padding: .5rem 1rem;
  margin: .8rem 0;
  color: #7a7a7a;
  border-left: .25rem solid #e5e5e5;
}
blockquote p:last-child {
  margin-bottom: 0;
}
@media (min-width: 30rem) {
  blockquote {
    padding-right: 5rem;
    padding-left: 1.25rem;
  }
}

img {
  display: block;
  margin: 0 0 1rem;
  border-radius: 5px;
  image-rendering: -webkit-optimize-contrast;
}

/* Tables */
table {
  margin-bottom: 1rem;
  width: 100%;
  /*border: 1px solid #e5e5e5;*/
  border-collapse: collapse;
}
td,
th {
  padding: .55rem .5rem;
/*  border: 1px solid #e5e5e5;*/
}
tbody tr:nth-child(odd) td,
tbody tr:nth-child(odd) th {
/*  background-color: #f9f9f9;*/
}


/*
 * Custom type
 *
 * Extend paragraphs with `.lead` for larger introductory text.
 */

.lead {
  font-size: 1.25rem;
  font-weight: 300;
}


/*
 * Messages
 *
 * Show alert messages to users. You may add it to single elements like a `<p>`,
 * or to a parent if there are multiple elements to show.
 */

.message {
  margin-bottom: 1rem;
  padding: 1rem;
  color: #717171;
  background-color: #f9f9f9;
}
/*@import url('https://fonts.googleapis.com/css?family=Cormorant:300&display=swap');*/


/*
 * Container
 *
 * Center the page content.
 */

.container {
  max-width: 38rem;
  padding-left:  1rem;
  padding-right: 1rem;
  margin-left:  auto;
  margin-right: auto;
}


/*
 * Masthead
 *
 * Super small header above the content for site name and short description.
 */

.masthead {
  padding-top:    1rem;
  padding-bottom: 1rem;
  margin-bottom: 3rem;
}
.masthead-title {
  margin-top: 0;
  margin-bottom: 0;
  color: #505050;
}
.masthead-title a {
  text-decoration:none;
}
.masthead-title small {
  font-size: 75%;
  font-weight: 400;
  color: #c0c0c0;
  letter-spacing: 0;
}


/*
 * Posts and pages
 *
 * Each post is wrapped in `.post` and is used on default and post layouts. Each
 * page is wrapped in `.page` and is only used on the page layout.
 */

.page,
.post {
  margin-bottom: 4em;
}

/* Blog post or page title */
.page-title,
.post-title,
.post-title a {
  color: #303030;
}
.page-title,
.post-title {
  margin-top: 0;
}

/* Meta data line below post title */
.post-date {
  display: block;
  margin-top: -.5rem;
  margin-bottom: 1rem;
  color: #9a9a9a;
}

/* Related posts */
.related {
  padding-top: 2rem;
  padding-bottom: 2rem;
  border-top: 1px solid #eee;
}
.related-posts {
  padding-left: 0;
  list-style: none;
}
.related-posts h3 {
  margin-top: 0;
}
.related-posts li small {
  font-size: 75%;
  color: #999;
}
.related-posts li a:hover {
  color: #268bd2;
  text-decoration: none;
}
.related-posts li a:hover small {
  color: inherit;
}


/*
 * Pagination
 *
 * Super lightweight (HTML-wise) blog pagination. `span`s are provide for when
 * there are no more previous or next posts to show.
 */

.pagination {
  overflow: hidden; /* clearfix */
  margin-left: -1rem;
  margin-right: -1rem;
  font-family: "PT Sans", Helvetica, Arial, sans-serif;
  color: #ccc;
  text-align: center;
}

/* Pagination items can be `span`s or `a`s */
.pagination-item {
  display: block;
  padding: 1rem;
  border: 1px solid #eee;
}
.pagination-item:first-child {
  margin-bottom: -1px;
}

/* Only provide a hover state for linked pagination items */
a.pagination-item:hover {
  background-color: #f5f5f5;
}

@media (min-width: 30rem) {
  .pagination {
    margin: 3rem 0;
  }
  .pagination-item {
    float: left;
    width: 50%;
  }
  .pagination-item:first-child {
    margin-bottom: 0;
    border-top-left-radius:    4px;
    border-bottom-left-radius: 4px;
  }
  .pagination-item:last-child {
    margin-left: -1px;
    border-top-right-radius:    4px;
    border-bottom-right-radius: 4px;
  }
}


a {
	text-decoration: none;
}


#tog{display:none}
#nav{float:right; position:fixed; left:70%;
/*top:42px;*/
top:39px;
}

  .nav a{
  text-decoration: none;
  color:#222;  
  /*font-size: 18px;*/
  margin-left: 10px;
  border-radius: 5px 5px 0px 0px; 
background: rgb(252,252,252);
/*background: url("lot.jpg") top left;*/
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
  font-family: "PT Serif";
padding:12px; padding-bottom:0px;
  word-spacing: 5px;
 font-size:22px;
 font-family: "CormorantU";
 
}
.nav a:hover{
	
	
}

a{color:#555;}
/*a:hover{text-decoration:none}*/
#topsearch{
  background: #fff; border-radius:5px;padding:5px; width:180px;
  float:right;margin-right:10px;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1);
border: 1px solid rgb(234,229,219);
margin-top:-10px;
}
.s{

  cursor:pointer; border: 0px;
  margin-bottom:-3px;
}
html,
body {
  overflow-x: hidden;
}
i{
font-family: "PT Serif";
}
html {
  font-family: "Franklin", Georgia, "Times New Roman", serif;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Cormorant";
  font-weight: 400;
  font-size: 1.5em;
  color: #313131;
  letter-spacing: -.025rem;
margin-top:50px;
}

.post-title,.al {
/*  border-bottom: 1px solid  rgb(216,201,180);
  border-bottom-color: #eee;*/
  font-size: 1.4em;
  font-weight: 400;
  margin-bottom: 0;
  line-height: 1.12;
  font-family: "Cormorant";
  text-decoration:none;
  border-radius:5px;
  color: #313131;
}
.al a{
	color: #313131;
}
a.al{ color: #313131;}
.bl {
  border-bottom: 1px solid  rgb(216,201,180);
  border-bottom-color: #eee;
  font-size: 22px;
  font-weight: normal;
  font-family: "PT Serif", Georgia, "Times New Roman", serif;text-decoration:none;
}

/*
 * Wrapper
 *
 * The wrapper is used to position site content when the sidebar is toggled. We
 * use an outter wrap to position the sidebar without interferring with the
 * regular page content.
 */

.wrap {
  /*position: relative;*/
  width: 100%;
}


/*
 * Container
 *
 * Center the page content.
 */

.container {
  max-width: 28rem;
}
@media (min-width: 38rem) {
  .container {
    max-width: 32rem;
  }
}
@media (min-width: 56rem) {
  .container {
    max-width: 38rem;
  }
}


/*
 * Masthead
 *
 * Super small header above the content for site name and short description.
 */

.masthead {
  padding-top:    1rem;
  padding-bottom: 1rem;
  margin-bottom: 3rem;
  background:url('band3.png');
background-position: 0px -1px; 
/*    background: rgb(232,224,207);*/
/*  background-image: linear-gradient(to bottom,rgb(232,224,207) 0,rgb(252,244,227) 60%);*/
 width:100%; 

border-top: 1px solid rgb(250,245,237);
border-bottom: 1px solid rgb(240,235,227);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
position:fixed;
}
#masthead{
position:fixed;
height:69px;
}

/* test */

.masthead-title {
  margin-top: 0;
  margin-bottom: 0;
  color: #505050;
  margin-left:40px;text-shadow: 0px 1px 0px #fff;font-family:'Cormorant'; 
font-size:30px;
}

svg{position:fixed;margin-top:1px;margin-left:-60px;}

.masthead-title a {
font-size:25px;
color: #707070;
letter-spacing:0px;
/*text-transform:uppercase;*/

}
b{font-weight:normal}

#logotext{
word-spacing:0.1em;
margin-right:-200px;

}
#logotext, svg{display:none}
.lg{height:34px;top:50px;margin-left:-55px;margin-top:-30px;position:fixed;}
/*.lg{display:none;}*/

.masthead-title small {
  font-family:'Cormorant';
  font-size: 85%;
  font-weight: 400;
  color: #909090;
  letter-spacing: 2px;
margin-left:260px;
position:absolute;
width:250px;
line-height:0.8em;
/*top:8px;*/
}
.masthead-title{margin-left:-200px;}

@media screen and (max-device-width: 1024px){
.masthead-title{margin-left:-80px;}
.masthead-title small {display:none;}
}

@media screen and (max-device-width: 800px){
.masthead-title{margin-left:-30px;}
.masthead-title small {display:none;}
}

@media screen and (max-device-width: 640px){
.masthead-title{margin-left:20px;}
#nav{display:none;}
#tog{display:block;}
#topsearch{display:none;}


}

#headimage{width:100%;height:800px; margin-bottom:20px; background: url('bird.jpg') no-repeat left #fff;background-size:cover;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
}
#qq{font-family:'Cormorant'; padding-top:100px;margin-left:auto;margin-right:auto;width:600px;font-size:1.3em;text-shadow: 0px 1px 5px #000;
}

#qq{color: rgb(240, 240, 240);opacity:0;}

#search{float:right;}
#topri{background:#fff; margin-top:4px;padding-top:5px; border-radius:5px; float:right;margin-right:200px;  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1); }
#topri{height:30px; width:180px;display:inline;border:1px solid rgb(234,229,219);}

input{outline:none;}
input[type="text"]{color:#555;padding-left:10px;width:140px; height:20px;background-color:transparent; font-family: Times New Roman, Times, serif; font-size: 18px}
.s{height:15px}
#logosvg{width:60px;}
#path3765{
  fill:  rgb(80,80,80);}

.dtab{display:block;width:100%;height:190px}
.dtr{clear:both;height:190px}
.dtd{float:left;width:134px;padding:10px;text-align:center;overflow:hidden;}



@media (max-width: 48rem) {
  .masthead-title {
    text-align: center;
  }
  .masthead-title small {
    display: none;
  }
}



/*
 * Sidebar
 *
 * The sidebar is the drawer, the item we are toggling with our handy hamburger
 * button in the corner of the page.
 *
 * This particular sidebar implementation was inspired by Chris Coyier's
 * "Offcanvas Menu with CSS Target" article, and the checkbox variation from the
 * comments by a reader. It modifies both implementations to continue using the
 * checkbox (no change in URL means no polluted browser history), but this uses
 * `position` for the menu to avoid some potential content reflow issues.
 *
 * Source: http://css-tricks.com/off-canvas-menu-with-css-target/#comment-207504
 */

/* Style and "hide" the sidebar */
.sidebar {
  position: fixed;
  top: 0;
  bottom: 0;
  left: -14rem;
  width: 14rem;
  visibility: hidden;
  overflow-y: auto;
  font-family: "PT Serif", Georgia, "Times New Roman", serif;
  font-size: .875rem; /* 15px */
  color: rgba(255,255,255,.6);
  background-color: #202020;
}
@media (min-width: 30rem) {
  .sidebar {
    font-size: .75rem; /* 14px */
  }
}

/* Sidebar content */
.sidebar a {
  font-weight: normal;
  color: #fff;
}
.sidebar-item {
  padding: 1rem;
}
.sidebar-item p:last-child {
  margin-bottom: 0;
}

/* Sidebar nav */
.sidebar-nav {
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.sidebar-nav-item {
  display: block;
  padding: .5rem 1rem;
  border-top: 1px solid rgba(255,255,255,.1);
}
.sidebar-nav-item.active,
a.sidebar-nav-item:hover,
a.sidebar-nav-item:focus {
  text-decoration: none;
  background-color: rgba(255,255,255,.1);
  border-color: transparent;
}

@media (min-width: 48rem) {
  .sidebar-item {
    padding: 1.5rem;
  }
  .sidebar-nav-item {
    padding-left:  1.5rem;
    padding-right: 1.5rem;
  }
}

/* Hide the sidebar checkbox that we toggle with `.sidebar-toggle` */
.sidebar-checkbox {
  display: none;
}

/* Style the `label` that we use to target the `.sidebar-checkbox` */
.sidebar-toggle {
  position: absolute;
  top:  1rem;
  left: 1rem;
  display: block;
  width: 2.2rem;
  padding: .5rem .65rem;
  color: #505050;
  /*background-color: #fff;*/
  border-radius: 4px;
  cursor: pointer;
}
.sidebar-toggle:before {
  display: block;
  content: "";
  width: 100%;
  padding-bottom: .125rem;
  border-top: .375rem double;
  border-bottom: .125rem solid;

  /* Make the border inside the box */
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

.sidebar-toggle:active,
#sidebar-checkbox:checked ~ .wrap .sidebar-toggle {
  color: #fff;
  background-color: #505050;
}

@media (min-width: 30.1rem) {
  .sidebar-toggle {
    position: fixed;
    width: 2.25rem;
  }
  .sidebar-toggle:before {
    padding-bottom: .15rem;
    border-top-width: .45rem;
    border-bottom-width: .15rem;
  }
}

/* -- */

/* Slide effect
 *
 * Handle the sliding effects of the sidebar and content in one spot, seperate
 * from the default styles.
 *
 * As an a heads up, we don't use `transform: translate3d()` here because when
 * mixed with `position: fixed;` for the sidebar toggle, it creates a new
 * containing block. Put simply, the fixed sidebar toggle behaves like
 * `position: absolute;` when transformed.
 *
 * Read more about it at http://meyerweb.com/eric/thoughts/2011/09/12/.
 */


.sidebar,
.sidebar-toggle {
    -webkit-backface-visibility: hidden;
       -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
            backface-visibility: hidden;
  -webkit-perspective: 1000;
     -moz-perspective: 1000;
      -ms-perspective: 1000;
          perspective: 1000;
}
.sidebar {
  -webkit-transition: all .3s ease-in-out;
     -moz-transition: all .3s ease-in-out;
      -ms-transition: all .3s ease-in-out;
          transition: all .3s ease-in-out;
}

.sidebar-toggle {
  -webkit-transition: left .3s ease-in-out;
     -moz-transition: left .3s ease-in-out;
      -ms-transition: left .3s ease-in-out;
          transition: left .3s ease-in-out;
}








#sidebar-checkbox:checked + .sidebar {
  left: 0;
  visibility: visible;
}
#sidebar-checkbox:checked ~ .wrap {
  left: 14rem;
}


/*
 * Posts and pages
 *
 * Each post is wrapped in `.post` and is used on default and post layouts. Each
 * page is wrapped in `.page` and is only used on the page layout.
 */

.page,
.post {
  margin-bottom: 4em;
  margin-left: 3em;
}

/* Blog post or page title */
.page-title,
.post-title,
.post-title a {
  color: #303030;
}
.page-title,
.post-title {
  margin-top: 0;
}

/* Meta data line below post title */
.post-date {
  display: block;
  margin-top: -.5rem;
  margin-bottom: 1rem;
  color: #9a9a9a;
}

/* Related posts */
.related {
  padding-top: 2rem;
  padding-bottom: 2rem;
  border-top: 1px solid #eee;
}
.related-posts {
  padding-left: 0;
  list-style: none;
}
.related-posts h3 {
  margin-top: 0;
}
.related-posts li small {
  font-size: 75%;
  color: #999;
}
.related-posts li a:hover {
  color: #268bd2;
  text-decoration: none;
}
.related-posts li a:hover small {
  color: inherit;
}


/*
 * Pagination
 *
 * Super lightweight (HTML-wise) blog pagination. `span`s are provide for when
 * there are no more previous or next posts to show.
 */

.pagination {
  overflow: hidden; /* clearfix */
  margin-left: -1rem;
  margin-right: -1rem;
  font-family: "PT Sans", Helvetica, Arial, sans-serif;
  color: #ccc;
  text-align: center;
}

/* Pagination items can be `span`s or `a`s */
.pagination-item {
  display: block;
  padding: 1rem;
  border: 1px solid #eee;
}
.pagination-item:first-child {
  margin-bottom: -1px;
}

/* Only provide a hover state for linked pagination items */
a.pagination-item:hover {
  background-color: #f5f5f5;
}

@media (min-width: 30rem) {
  .pagination {
    margin: 3rem 0;
  }
  .pagination-item {
    float: left;
    width: 50%;
  }
  .pagination-item:first-child {
    margin-bottom: 0;
    border-top-left-radius:    4px;
    border-bottom-left-radius: 4px;
  }
  .pagination-item:last-child {
    margin-left: -1px;
    border-top-right-radius:    4px;
    border-bottom-right-radius: 4px;
  }
}


/*
 * Reverse layout
 *
 * Flip the orientation of the page by placing the `.sidebar` and sidebar toggle
 * on the right side.
 */

.layout-reverse .wrap,
.layout-reverse .sidebar-toggle {
  -webkit-transition-property: right;
     -moz-transition-property: right;
      -ms-transition-property: right;
          transition-property: right;
}


.layout-reverse .sidebar {
  left: auto;
  right: -14rem;
}
.layout-reverse .sidebar-toggle {
  left: auto;
  right: 1rem;
}

.layout-reverse #sidebar-checkbox:checked + .sidebar {
  left: auto;
  right: 0;
}
.layout-reverse #sidebar-checkbox:checked ~ .wrap {
  left: auto;
  right: 14rem;
}
@media screen and (max-device-width: 1280px){
	.lg{margin-left:-30px;}
	#nav{/*margin-left:-45px;*/
	}
}

@media screen and (max-device-width: 640px){
#qq{width:350px; font-size:1.3em;}

.prof{float:left;height:130px;margin-right:10px;}
.page,
.post {
 
  margin-left: initial;
}

.masthead-title {margin-left: 200px;}
.lg{
width:0px; height:0px; padding-left:130px;padding-right:80px;padding-top:12px; padding-bottom:12px; background:url("logomob.png");
background-size:cover;display:initial;
/*margin-left: -150px;*/
position:fixed;
left: 96px;

}
@-moz-document url-prefix() {
	.lg{/*
position:fixed;
left: 220px;*/

}
}
/*svg{margin-left:-160px;}
#logotext{margin-left:-100px;}
#logotext{font-family:'Lagio';}*/
#logotext, svg{display:none}
/*
.lg{display:none;}*/


#masthead{height:60px;
 background-image: linear-gradient(to bottom,rgb(232,224,207) 0,rgb(252,244,227) 62%);
 background-position:initial;
}
#headimage{
}
}
#qq{}
#topb{width:30px;cursor:pointer;clear:both;}
ul{
clear:both;
list-style:none;
margin-top:130px;
}