/* === theme #0  ==  monotonous  === */

html{
    background: url('/images/background/300.jpeg');
    background-position:center bottom;
    background-repeat:no-repeat;
    background-size:cover;
    background-attachment:fixed;
}

body,h1{margin:0}

h1{ padding:1ex;
    color: #464646;
font-size: 250%; text-align:center; font-family:Arial, sans-serif;
background-color:rgba(244,244,244,.8);}

/* =========== top menu → */
div.menu{font-weight:bold; margin:0; padding:0; position:fixed;top:0;background-color:#8a7c6b}
div.menu,div.menu a{color:white}
div.menu i.symbol{font-size:200%}

div.menu.NT{box-shadow: 0 0 1em rgba(255,255,255,.5);}
div.menu.NT{font-size:90%}
div.menu.NT i.symbol{font-size:140%}

/* === */
div.menu>ul{padding:0;margin:0;}
div.menu>a,div.menu>p{display:inline-block;}
div.menu>ul>li{transition: all .3s;}
div.menu>ul>li,div.menu>a,div.menu>p{padding:1ex;margin: 0;}
div.menu>ul>li:hover,div.menu>a:hover{ background-color:rgb(42,111, 92)}

div.menu.left{left:0;border-radius:0 0 10px 0;}
div.menu.right{right:0;border-radius:0 0 0 10px;}

div.menu.left>ul>li:last-child,div.menu.left>a,div.menu.left>p{ border-radius:0 0 10px 0; }
div.menu.right>ul>li:first-child,div.menu.right>a,div.menu.right>p{ border-radius:0 0 0 10px; }
/* =========== ← top menu */


/* =========== edist+panel (partially configured in common.css) → */
div.edist>ul>li{line-height:5ex; margin:1ex 3ex}
div.edist>ul,div.panel>ul{padding:0}
div.panel>ul>li{margin:1ex 3ex;color:#38492B}
div.panel>ul>li>a{color:#38492B}
div.panel{margin:1ex 0;background-color:rgba(244,244,244,.8)}
/* =========== ← edist+panel */

@media(max-width:340px){
    div.header.top img.logo{height:25px}
    div.header.scrolled img.logo{height:18px}}

@media(min-width:341px) and (max-width:400px){
    div.header.top img.logo{height:35px}
    div.header.scrolled img.logo{height:25px}}

@media(min-width:401px){
    div.header.top img.logo{height:45px}
    div.header.scrolled img.logo{height:30px}}

img{transition:all .5s}

h2{
    margin-bottom:0;
    color: #464646;
    text-align: center;
    line-height: 140%;
    }

h3{color:#464646}


div.fon{
    margin:0 auto;
    text-align:center;
    padding-bottom:1em;}

article{
    min-width:25ex; max-width:85ex;
    text-align: left;
    background:rgba(224,224,224,.9);
    margin: .5em;
    padding: 0 1em 1em 1em;
    border-radius: 10px;
    display: inline-block;
    vertical-align: middle;
}

/* === for slogans → === */
article.single{display:block;margin-left:auto;margin-right:auto}

article.image {
  display: grid; place-content: center; position: relative;
  border: solid 1.5em rgba(0, 0, 0, 0.03);
  padding: 0 1em;
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2), 2px 2px 17px rgba(0, 0, 0, 0.35), 2px 2px 25px rgba(0, 0, 0, 0.5);
  background: url('/images/section/600.jpeg') 50%/cover border-box padding-box;
  text-align: center; text-shadow: 1px 1px #000;}

article.image:before {
  position: absolute; z-index: -1;
  top: -1.5em; right: -1.5em; bottom: -1.5em; left: -1.5em;
  border: inherit;
  border-color: transparent; background: inherit; background-clip: border-box;
  filter: blur(9px); clip-path: inset(0);
  content: "";
}

article.image>h2{
    font-family:Arial, sans-serif;
    font-size:320%;
    margin:0;
}
/* == */

p{margin:0;line-height: 140%}

p.items>span,p.items>a{
    text-decoration: none;
    display: inline-block;
    border:solid 1px #C7C7C7;
    border-radius:5px;
    padding:1ex;margin:1ex;}

p.items>span:hover,p.items>a:hover{
    cursor:pointer;
    border-color:#5C261B;
    background:#8AB933;}

p.items>span,a{
    transition: all .3s;
    text-decoration: none;
    text-align: left;}

a.symbol{
    color:white;
    border-radius:10px;
    padding:10px;
    box-shadow: 0 0 1em rgba(255,255,255,.5);
    background-image: radial-gradient(circle at center, #7B7B7B,rgba(138,124,107,.5));
}

div.header>a.symbol{margin:0}


p:not(:first-of-type){margin-top:1ex}

ul{margin-top:0}
li{margin-top:1ex}

/* =========== images */
img.left{float:left;margin-right:1em}
img.single{display:block;margin-left:auto;margin-right:auto}
img.right{float:right;margin-left:1em}

img.b1{border-radius:10px 0 0 0}
img.b2{border-radius:0 10px 0 0}
img.b3{border-radius:0 0 10px 0}
img.b4{border-radius:0 0 0 10px}

img.b12{border-radius:10px 10px 0 0}
img.b13{border-radius:10px 0 10px 0}
img.b14{border-radius:10px 0 0 10px}
img.b23{border-radius:0 10px 10px 0}
img.b24{border-radius:0 10px 0 10px}
img.b34{border-radius:0 0 10px 10px}

img.b1234{border-radius:10px}

/* =========== */

/* tables th,td{border:1px solid white}  */
table{margin:0 auto}
td{text-align:center}
table th,table tr>td{border:1px solid white}
table{border-collapse:collapse}
table th,table td{padding:1ex}

/* footer */
footer{padding-top:3px}
footer>div>span{
    z-index:4;
    border: dotted 1px #06474e}

/* =========== (business) header */
#topInfo{background:rgba(255,255,255,.8);}

#goup{color:white;transition: all 1s;}
#goup.NT{opacity:1}

#callMe,#mailMe,#goHome{background-color:rgba(255,255,255,.7);}