/* FRONTEND CSS
*********************************************/

/* ====== STRICTURE -- MODULE AND CONTENT POSITIONING ============================= */

body {text-align:center; margin-top:0; padding-top:0; background-color:#a3957f; /*
   background: url(/utcmusic/templates/stricture/images/utc-music.jpg) repeat; 
   background-position: center center; margin: 0; padding: 0px;  
   background-color: transparent; background-color:#adafaa; */ }
html {overflow-y: scroll;}
#wrap{
      max-width:960px; 
   /*   max-width: 960px; min-width: 500px; */
      margin:0 auto; text-align:left; background-color:#fff;}
#sqp-header
     {width:100%; background-color:#900; height:83px; 
      background-image: linear-gradient(to bottom, #800, #600);
      color: #fff; 
      border-bottom: 1px solid #999;
      border-bottom-width: 1px;
      border-bottom-style: solid;
      border-bottom-color: #999;
      box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.4) inset;
      font-family: "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif !important;
      font-size: 1em !important; }
#sqp-bottom {width:100%;}
#sqp-footer
     {width:100%; overflow:hidden;  
      border-top: 1px solid #999;
      border-top-width: 1px;
      border-top-style: solid;
      border-top-color: #999;
      box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.4) inset;
      position: relative;
      top: 12px; background-color:#800;
      background-image: linear-gradient(to bottom, #800, #600);
      text-align: center;
      font-family: "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif !important;
      font-size: 1em !important; }
#sqp-menu, #sqp-rmenu, #sqp-smenu, #sqp-tmenu, #sqp-qmenu, #sqp-xmenu, #sqp-sfringe, .quin-alias
     {clear:both; float:left; width:100%; overflow:hidden; 
      background-color:#111; 
      background-image: linear-gradient(to bottom, #444, #000);  
      font-family: "Lora",Georgia,"Times New Roman",Times,serif;
      font-size: 1.1em;   line-height: 0px; 
}
#sqp-rmenu
     {background-image: linear-gradient(to bottom, #990000, #770000);
      /* box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.4) inset; */
      color: #000;  }
#sqp-content {clear: both; background-image:url(../images/crossword.png); }

/* ====== STRICTURE -- CATEGORY MENU ============================= */

#sqp-right {
      background-color: #900; float:right; min-width:20px;
      display: inline-block; padding: 10px; font-size: 1em;
      text-align: left;  color: #F5F5F5; margin: 0 0 10px 10px; 
      background-image: linear-gradient(to bottom, #800, #600);
      box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.4) inset;  
}
#sqp-right ul {
      padding:0 10px;
}
#sqp-right li {
      float: none; vertical-align: top;
      display:block;
	  list-style-type: none;
      margin:0; 
      font-family: "Lora",Georgia,"Times New Roman",Times,serif;
      font-size: 1.1em;   
}
#sqp-right a {
      text-decoration: none; color:#fff; 
}
.decumbent #sqp-right {
      -webkit-column-count: 3;
      -moz-column-count: 3;
      column-count: 3;
      padding: 10px 10px 10px 0;
      margin: 0 0 10px 10px;
      width:99%;
      vertical-align: top;
}
.decumbent #sqp-right li {
      padding-left:10px;
}
/*
.decumbent #sqp-right {
      background-color: transparent;
      background-image: none;
      display: inline-block; font-size: 1em;
      box-shadow: none;  padding:0; margin:0;
}
.decumbent #sqp-right li { display:inline-block; float:left; }
.decumbent #sqp-right a {
    background-image: linear-gradient(to bottom, #800, #600);
    font-family: "Lora",Georgia,"Times New Roman",Times,serif;
    font-size: 1em;   
    border: 1px solid #000;
    border-radius: 20px;
    box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.2) inset;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    padding: 5px 20px 6px;
    text-align: left;
    text-decoration: none;
}
*/

/* ====== STRICTURE -- ELEMENTS ============================= */

.inside {padding:20px; }
.darkanchor { color:#000; text-decoration: none; }
.theworld { text-indent:-999em; margin-right:20px; 
     height:83px; width: 176px;
     float:right; background-image:url(../images/world.png) }
.emblem 
     {color: #fff; 
      text-shadow:3px 3px 3px #000;
      font-family: "Lora",Georgia,"Times New Roman",Times,serif;
      font-size: 2em; margin:10px; 
      display: inline-block; padding: 15px 0 15px 15px; }
.slogan
     {color: #fff; font-style:italic; 
      font-family: "Lora",Georgia,"Times New Roman",Times,serif;
      font-size: .8em; margin:10px 10px 10px 0;
      display: inline-block; padding: 0px; }
.page-header h2 {margin:0;}
.blog h2 {margin:0;}
.subheading-category { color:#800; }
.subheading-category:after { content:":"; }
.greennotice {
      border-top: 2px solid #DDEDBC; border-bottom: 2px solid #DDEDBC;
      padding: 1em; background: #F2F9E5; }

/* ====== STRICTURE -- MENU ============================= */

#sqp-menu li, #sqp-rmenu li, #sqp-smenu li, #sqp-tmenu li, #sqp-qmenu li
     {float: none; display: inline-block; vertical-align: top; align:right; }
#sqp-menu a, #sqp-rmenu a, #sqp-smenu a, #sqp-tmenu a, #sqp-qmenu a  { color: #fff;
      padding: 5px 12px 5px 12px; text-shadow: none; text-decoration: none; }
#sqp-rmenu a {color: #fff; }
#sqp-smenu a { /* color: #474747; */ }
#sqp-menu a:hover, 
#sqp-rmenu a:hover, #sqp-tmenu a:hover, 
#sqp-smenu a:hover, #sqp-qmenu a:hover,
#sqp-right a:hover
     {background-color: transparent; color: #cfcfcf; text-decoration: none; }
.menu, .rmenu, .smenu {padding-left: 10px; }
#sqp-menu .active:after, #sqp-smenu .active:after, #sqp-tmenu .active:after,  #sqp-qmenu .active:after,
#sqp-rmenu .active:after { }
/*
#sqp-menu .current:after { z-index: 200;
   border-bottom-color: transparent;   
   border-color: -moz-use-text-color transparent transparent; }
#sqp-menu .item-474:after { z-index: 200;
   border-bottom-color: #990000; 
   border-color: -moz-use-text-color transparent #990000; }
#sqp-smenu .current:after, #sqp-rmenu .current:after { z-index: 200;
   border-bottom-color: #fff;  height:30px; overflow:visible; 
   border-color: -moz-use-text-color transparent #fff; }
*/
#sqp-menu li.current a, #sqp-tmenu li.current a, #sqp-qmenu li.current a,
#sqp-smenu li.current a { 
   background-color:#a3957f;
   background-image: linear-gradient(to bottom, #a3957f, #83755f);
}
#sqp-menu li.item-101 a{ 
   background-color: transparent;
   background-image: none;
}

/* ====== STRICTURE -- NAVIGATION ============================= */

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

.page-item a {
  color: black;
  border: 1px solid #ddd; /* Gray */
  float: left;
  padding: 8px 16px;
  text-decoration: none;
}

.page-item a.active {
  background-color: #4CAF50;
  color: white;
}

.page-item a:hover:not(.active) {background-color: #ddd;}

.page-item li:first-child {
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

.page-item li:last-child {
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}

.com-content-category-blog__pagination {
  text-align: center;
}

.com-content-category-blog__pagination li.active a {
  background-color: #800;
  color: white;
  border-radius: 5px;
}

.icon-angle-left {
  border: solid black;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}

.icon-angle-right {
  border: solid black;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}

.icon-angle-double-left {
  border: solid black;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}

.icon-angle-double-right {
    border: solid black;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}

li.disabled {
  display: none;
}

/* changed pagenav to pagination 

.pagination { text-align: center;
    overflow: hidden;
    width: 100%;
    margin: 20px 0px 0px;
    padding: 20px 0px 0px;
    list-style: outside none none;
    clear: both;
}
.pagination li { display: inline-block; }
.pagination a {
    background-image: linear-gradient(to bottom, #444, #000);  
    font-family: "Lora",Georgia,"Times New Roman",Times,serif;
    font-size: 1.1em;   
    border: 1px solid #000;
    border-radius: 20px;
    box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.2) inset;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font: 17px/25px "ProximaNovaSoft",sans-serif; 
    padding: 5px 20px 6px;
    text-align: left;
    text-decoration: none;
}
.pagination a:hover {
    background-color: transparent; color: #cfcfcf; text-decoration: none; 
}
.pagination a:active {
    background-image: linear-gradient(to bottom, #000, #444);
    color: #cfcfcf; text-decoration: none; 
}
.hoverboard:hover {background-color:Yellow ;} 
.hidden-phone a { visibility:hidden; }
.pagination p.pull-right {
    float: none;
    text-align: center;
}
.pagination ul {
    display: inherit;
    text-align: center;
}
.pagination a,
.pagination span {
    float: none;
    display: inline-block;
}

*/

/* ====== STRICTURE -- Content ============================= */

#sqp-content h2 { font-family: "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif !important; }
table.sch { width:100%; }
.sch-l, .atomic-l { width:200px; margin-top: 3px; padding:3px; text-align:right; }
.sch-r, .atomic-r { margin-top: 3px; padding:3px; padding-left:15px; text-align:left; }
.atomic-l { font-weight:bold; display: inline-block; }

.clearly { clear:both; }

.homepage img { -moz-border-radius: 10px;  -webkit-border-radius: 10px;
    border-radius: 10px;  -khtml-border-radius: 10px; 
    -moz-box-shadow:    3px 3px 5px 6px #ccc;
    -webkit-box-shadow: 3px 3px 5px 6px #ccc;
    box-shadow:         3px 3px 5px 6px #ccc; }
.antarctica img, 
.africa img, 
.whales img, 
.alaska img,
.china img {
    -moz-border-radius: 10px;  -webkit-border-radius: 10px;
    border-radius: 10px;  -khtml-border-radius: 10px; 
    -moz-box-shadow:    3px 3px 5px 6px #ccc;
    -webkit-box-shadow: 3px 3px 5px 6px #ccc;
    box-shadow:         3px 3px 5px 6px #ccc; 
    float:right; margin:10px; 
}

/* ====== STRICTURE QUOTES ============================= */

p.quote, p.confucius {
font-family: Georgia, serif;
font-size: 18px;
font-style: italic;
margin: 0.25em 0;
padding: 0.25em 40px;
line-height: 1.45;
position: relative;
color: #383838;
clear:both;
}

p.confucius {text-align:right; }

p.quote:before, p.confucius:before {
display: block;
content: "\201C";
font-size: 80px;
position: absolute;
left: 0;
top: -20px;
color: #7a7a7a;
}

p.confucius:before {position:relative; }

p.quote:after{
display: block;
content: "\201D";
font-size: 80px;
position: absolute;
right: 10px;
top: -20px;
color: #7a7a7a;
}

p.quote cite {
color: #999999;
font-size: 14px;
display: block;
margin-top: 5px;
text-align:right;
}
 
p.quote cite:before {
content: "\2014 \2009";
}

/* ====== QUINCUNX -- MENU STYLES ============================= */


#quin-header, #quin-footer, #quin-body, #quin-menu, #quin-submenu
     {float:left; padding: 0; min-width:100%; }

#quin-menu, #quin-submenu, .mnav, .quin-alias
     {background-image:linear-gradient(to bottom,#363942,#363942);
      border-bottom: 0px solid #999; border-bottom-width: 0px;
      border-bottom-style: solid; border-bottom-color: #999;
/*    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.4) inset; */
      clear:both; float:left; overflow:hidden;
      background-color:#00386b;  min-width:100%;
      font-family: "Lora",Georgia,"Times New Roman",Times,serif;
      font-size: 1.1em;  line-height: 6px; }

#quin-menu li, #quin-submenu li, .mnav li, .dmenu li
     {float: none; display: inline-block; vertical-align: top; padding-left:10px; }
.mnav li, .dmenu li {width:100%; float:left; line-height: 2.5em; text-align:left; padding-left:10px;}
.dmenu li {padding-left:0; line-height:2em;  }
.quin-alias li {width:80%;}
.dmenu {font-family: "Lora",Georgia,"Times New Roman",Times,serif;
      font-size: 1em;  line-height: 6px;}
#quin-menu ul, #quin-submenu ul, .mnav ul, .dmenu ul
     {padding-left: 0px; }
#quin-menu a, #quin-submenu a, .mnav a, .dmenu a
     {color: #F5F5F5; padding: 10px 12px 10px 0px; text-shadow: none; text-decoration: none; }
.dmenu a {color: #00386b; padding: 10px 0;}
#quin-submenu a { color:#382513; }
#quin-menu a:hover, #quin-submenu a:hover, .mnav a:hover, .dmenu a:hover
     {background-color: transparent; color: #cfcfcf; text-decoration: none; }
#quin-submenu a:hover { color: #887563; }
#quin-menu .active:before, #quin-submenu .active:before
 {content:'';
  border-bottom-color: #fff;
  position:relative;
  top:45px;
  border-width:0px 14px 14px 14px;
  border-style:none solid solid;
  border-color:-moz-use-text-color transparent #fff;
  bottom:-8px;
  line-height:0;
  margin-left:-14px;
  margin-right:-14px; 
  top:auto;
  color:transparent;
  width:0;
  font-size:0px;
  z-index:100;
  left:47%; }
#quin-menu .parent:before {
  border-color:-moz-use-text-color transparent #d8caa8;
  border-bottom-color: #d8caa8;
}


/* MEDIA QUERIES
*********************************************/

@media (min-width: 768px) { }
@media (min-width: 992px) { }
@media (min-width: 1200px) { }
@media screen and (-webkit-min-device-pixel-ratio: 1.5), screen and (max--moz-device-pixel-ratio: 1.5) { }