/*--- common classes ---*/

html {
  height: auto;               /* reset default 100% for iframe to resize when decreasing document height */
}

label {
  line-height: 25px;
}

.hidden {
  display: none;
}

.disabled {
  pointer-events: none;
  opacity: 0.5;
}

.required {
  color: #ff4b33;
  font-weight: bold;  
}

.centered {
  text-align: center;
}

.inline-block {
  display: inline-block;
}

.float-right {
  float: right;
}

.top {
  vertical-align: top;
}

.margin-top-2 {
  margin-top: 2px;
}

/*---- corrected monplandesceneNew5 theme styles ----*/

/* 'smaster' class is added to html tag */

.smaster #art-main {
  min-width: 0;               /* cancels body's 900px by default */
  min-height: 0;              /* reset default 100% for iframe to resize when decreasing document height */
  background: #031526;        /* overrides 'url(images/pageglare.png)...' */
}

/* used instead of .art-post to avoid .art-post's side effect on li-elemets inside .art-post */
.smaster article {
  /* taken from .art-post */
  background: rgba(3, 56, 89, 0.2);
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  border: 5px solid rgba(255, 255, 255, 0.2);
  padding: 10px;
  position: relative;   /* for absolute flag icon */

  /*---- improved style ----*/
  /*border: 5px solid #1f3349;
  background: #1f3349;*/
}

.smaster article a.flag-icon > img {
  width: 36px;
  height: 24px;
  float: right;
  margin-left: 10px;
}

.smaster article header {
  /* to ensure height is enlarged if right-floating menu jumps down when page width shrinks */  
  overflow: hidden;  
}

.smaster h2.art-postheader {
  display: inline-block;      /* to have title and menu on one line */
  margin-right: 0.5em;
  white-space: nowrap;
  font-size: 22px;            /* to conserve horizontal space (ensure one-line header) */
}

.smaster ul.art-hmenu {
  float: right;
  margin: 0 0 5px 2px; /* to align title and menu vertically */
  padding: 0;            /* to conserve horizontal space (ensure one-line header) */
}

.smaster ul.art-hmenu>li>a {
  display: inline-block;      /* to have menu items aligned vertically */
}

/* to have li-spans aligned vertically to li-links */
.smaster ul.art-hmenu>li>span {
  display: inline-block;
  padding: 0 17px;
  margin: 0 auto;
  position: relative;
  display: block;
  height: 27px;
  color: #F0F0F0;
  line-height: 27px;
  text-align: center;
  /* to have same font as a-elements */
  color: #889daa;
  font-size: 14px;
  font-family: Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
  font-weight: bold;
}

.smaster #respond input,
.smaster #respond select {
  width: 180px;
}

.smaster #respond input[type="checkbox"] {
  width: auto;
  margin: 0 10px 0 0;
}

.smaster #respond select {
  padding: 6px 0;
  background: #C7C7C7;
  background: rgba(199, 199, 199, 0.98);
  border-radius: 17px;
  color: #262626 !important;
  font-weight: normal;
  margin: 0 0 9px;
}

.smaster #respond .form-submit input {
  width: auto; 
}

.smaster form.art-search {
  display: inline-block;
  float: right;
}

.smaster .art-search input[type="text"] {
  width: 180px;
  padding-left: 5px;
  background: hsla(208, 25%, 92%, 1);
  height: 36px;
  border: none;  
}

.smaster .art-search input[type="text"]:focus {
  outline: none;
  background: white;
}

/* improve search button */
.smaster form.art-search input[type="submit"], input.art-search-button, a.art-search-button {
  border-radius: 0 55px 55px 80px;
  width: 32px;
  background: #0889d9 url(../img/find-white.png) 58% 50% no-repeat; /* blue, white icon */
}

/* add input[type="tel"] to theme styles - they forgot it to add */

.smaster input[type="tel"]
{
   background: #C7C7C7;
   background: rgba(199, 199, 199, 0.98);
   -webkit-border-radius:17px;
   -moz-border-radius:17px;
   border-radius:17px;
   border:2px dotted rgba(181, 181, 181, 0.98);
   margin:0 auto;
}

.smaster input[type="tel"]
{
   width: 100px;
   padding: 6px 0;
   color: #262626 !important;
   font-size: 13px;
   font-family: Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
   font-weight: normal;
   font-style: normal;
   text-indent: 0;
   word-spacing: 0;
   text-shadow: none;
}

/* improve their style */

.smaster p.error-message {
  /* .sidebar-login-error in sidebar-login.css */
  color: #ae121e;
  background-color: #fbb1b7;
  border: 1px solid;
  margin: 1em 0;
  padding: 0 1em;
  font-size: 13px;
  /* our improvements */
  margin: 1em 0 !important;  
  padding: 1.1em 1em 1.1em 3.3em;
  background: url(../img/error.png) no-repeat #fbb1b7;
  background-size: 24px 24px;
  background-position: 10px 10px;
  line-height: 1.55;
  min-height: 1.6em;
}

.smaster p.info-message {
  color: #76D1FE;
  border: 1px solid #285a79;
  font-size: 13px;
  margin: 1em 0 !important;
  padding: 1.1em 1em 1.1em 3.3em;
  background: url(../img/info.png) no-repeat rgba(147, 171, 215, 0.2);
  background-size: 24px 24px;
  background-position: 10px 10px;
  line-height: 1.55;
  min-height: 1.6em;
}

.smaster.standalone article {
  margin: 10px auto 10px;
  width: calc(100% - 20px);
  max-width: 900px;
}

.smaster.standalone #art-main {
  overflow: auto;
}

.smaster.standalone .art-headline {
  position: static;
  display: block;
  max-width: 900px;
  margin: 0.42em auto 0.55em !important;
  font-size: 36px;
  text-transform: uppercase;
}

@media screen and (max-width: 599px) {   /* phone */
  .smaster.standalone .art-headline {
    font-size: 24px;
  }
}

.smaster .art-headline {
  display: none;
}

/*---- search result ----*/ 

.smaster .search-result h3 {
  font-weight: normal;
}

.smaster .search-result .query-word {
  color: #c1db4d;
}

.smaster .search-result .art-block {
  margin: 0;
  border: none;
  border-radius: 3px;
  min-height: 3.6em;
  
  background: #032f4a;
  
  /*---- improved style ----*/
  /*background: #031526;
  margin: 0 -10px -10px;
  border-radius: 3px 3px 6px 6px;
  padding: 7px 10px;*/
}

.smaster .search-result ul {
  margin: 1.5em 0 1.5em 0;  
}

.smaster .search-result ul>li:before {
  content: '';
  margin-right: 0;
}

.smaster .search-result a {
  font-weight: normal;
  letter-spacing: 0.3px;
  text-decoration: none;
  color: #1DA3F7;
}

.smaster .search-result a:visited {
  text-decoration: none;
  color: #4988CA;
}

.smaster .search-result a:hover {
  text-decoration: none;
  color: #ACC8E7;
}

.light-icon-small {
  font-size: 13px;
  vertical-align: top;
  color: #abc146;
}

.sound-icon-small {
  font-size: 14px;
  vertical-align: top;
  color: #fc6002;
}

.drawing-icon-small {
  font-size: 13px;
  vertical-align: top;
  color: #46c167;
}

.visit-icon-small {
  font-size: 14px;
  vertical-align: top;
  color: orange;
  margin-right: 3px;
}

.light-icon {
  color: #abc146;
}

.sound-icon {
  color: #fc6002;  
}

.drawing-icon {
  color: #46c167;
}

.visit-icon {
  color: orange;
  /*margin-left: 5px;*/
}

.vti-icon {
  /*margin-left: 5px;*/
  margin-top: -2px;
  color: #e00007;
}

.vti-subicon {
  font-size: 12px;
  position: relative;
  top: 14px;
  /*left: -10px;*/
  left: -20px;
  color: #e00007;
  pointer-events: none;
}

/*---- page clases ----*/

.logo-3d {
  background: -moz-linear-gradient(top, #1e1ed2 0%, #0a0280 50%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e1ed2), color-stop(50%,#0a0280));
  background: -webkit-linear-gradient(top, #1e1ed2 0%,#0a0280 50%);
  background: -o-linear-gradient(top, #1e1ed2 0%,#0a0280 50%);
  background: -ms-linear-gradient(top, #1e1ed2 0%,#0a0280 50%);
  background: linear-gradient(to bottom, #1e1ed2 0%,#0a0280 50%);
  padding: 5px;
  border-radius: 5px;
}

.logo {
  margin-right: -0.3rem;
  margin-right: -0.5rem;
}

.logo .icon-button {
  padding: 4px 6px 1px;  
  border-radius: 25px;
  background: rgba(60, 90, 139, 0.4);
  margin-right: 5px;
}

.logo .icon-button.visits {
  padding: 5px 7px 2px;
}

.logo .icon-button:hover {
  background: rgba(147, 171, 215, 0.3);
}

.logo i.material-icons {
  vertical-align: text-top;
}

.round-icon {
  display: inline-block;
  width: 34px;
  height: 32px;
  border-radius: 34px;
  overflow: hidden;
  position: relative;
}

.round-icon > img {
  position: relative;
  left: -1px;
  top: -1px;
  width: 36px;
  height: 34px;
}