/*===== GLOBAL / GENERAL =====*/

* {box-sizing:border-box; grid-column-gap:0;}

body { margin:0; background-color:#DDD;
  font-family: "Trebuchet MS", Helvetica, sans-serif;
  font-size:16px; font-weight:normal;}

/*===== TAGS =====*/

h1 { font-size:2em; margin:20px 0;
     color:#075; font-variant:small-caps;}
h2 { font-size:1.75em; margin:15px 0;
     color: #075; font-variant:small-caps;}
h3 { font-size:1.625em; margin:12px 0; }
h4 { font-size:1.5em; margin:10px 0; }
h5 { font-size:1.25em; margin:10px 0; }
h6 { font-size:1em; margin:10px 0; }

h1,h2,h3,h4,h5,h6 { padding:0; }

hr { height:2px; border-width:0; background-color:#AAA; margin:0 2em;}

code { font-size: 1.2em; }

p { text-align:justify; }

/*===== CLASSES =====*/

.g-header {display:grid; grid-column-gap:0; 
    grid-template-columns:200px auto; }
.g-belly {display:grid; grid-column-gap:0;
    grid-template-columns:auto 200px; }
.g-footer {display:grid; grid-column-gap:0;
    grid-template-columns:25% 25% 25% 25%; padding-left:2em; }

.g-header>div, .g-belly>div, g-footer>div {
  display:inline-block; padding:0 0.5em; }
.logo-text {font-family: "Trebuchet MS", Helvetica, sans-serif;
  color:#075; display:block; margin:0; padding:0;}
.maxw80 { max-width:80%; }

.txc { text-align:center; }
.txtiny { font-size:0.875em; }
.xc {margin-left:auto;margin-right:auto;}
.xr0 {margin-left:auto;margin-right:0;}
.xr1 {margin-left:auto;margin-right:1em;}

/*===== PSEUDO ELEMENTS =====*/

[href] {cursor: url(cursor_dotred.png), pointer;}

/*===== SPECIFIC ELEMENTS =====*/

header, #belly, footer {background-color:#FFF;
    border:2px solid #CCC; border-radius:1em; 
    margin:1em auto; padding:1.5em 2em;}
footer>div {margin:0 auto;}

#cbody {display:block; max-width:1000px; margin:0 auto;}
#header-logo { font-size:45px; margin:0; padding:0; }

/*===== RESPONSIVE =====*/

/* Viewport width "mobile" (mob)*/
@media only screen and (max-width: 550px) {
  .mob-hide { display:none; }
  .g-header { grid-template-columns:110px auto; }
  .g-belly { grid-template-columns:100%; }
  .g-footer { grid-template-columns:100%; }
  .txtiny { font-size:1em; }
  body {font-size:14px;}
  header, #belly, footer { padding:0.5em 0.5em;
    border:none; border-radius:0; }
  header, footer { margin:0; }
  #header-logo { font-size:40px; }
  #belly { margin:0.25em 0; }
  h1 { font-size:1.625em; margin:10px 0; }
  h2 { font-size:1.5em; margin:8px 0; }
  h3 { font-size:1.325em; margin:6px 0; }
  h4 { font-size:1.25em; margin:5px 0; }
  h5 { font-size:1.125em; margin:5px 0; }
  h6 { font-size:1em; margin:10px 0; }
  #cbody { margin:0;}
  #img-logo { max-width:100px; height:auto; }
}

/* Viewport width "pad" (pad)*/
@media only screen and (min-width: 550px)  and (max-width:900px)  {
  .pad-hide { display:none; }
  #cbody { margin:0; }
  header, #belly, footer { border-radius:0.5em;
      margin:0.5em auto; padding:1em 1.5em; }
  .g-footer { grid-template-columns:50% 50%; }
}

/* Viewport width "big screen" (big) */
@media only screen and (min-width:900px) {
  .big-hide { display:none; }
}