/* Add here all your CSS customizations */
html body .tabs .nav-tabs a.tab-orange, 
html.dark body .tabs .nav-tabs a.tab-orange, 
html body .tabs .nav-tabs a.tab-orange:hover, 
html.dark body .tabs .nav-tabs a.tab-orange:hover {
  color: orangered;
}
html body .tabs .nav-tabs.nav-justified a.tab-orange:hover, 
html.dark body .tabs .nav-tabs.nav-justified a.tab-orange:hover, 
html body .tabs .nav-tabs.nav-justified a.tab-orange:focus, 
html.dark body .tabs .nav-tabs.nav-justified a.tab-orange:focus {
    border-top-color: orangered;
}
html body .tabs .nav-tabs li.active a.tab-orange, 
html.dark body .tabs .nav-tabs li.active a.tab-orange {
    border-top-color: orangered;
    color: orangered;
}
form.form-condensed .form-group,
form.form-condensed .control-group {
    margin-top: 0;
    margin-bottom: 5px;
}

html .bg-none {
    background: none;
    background-color: transparent !important;
}
.br-none {
    border-right: none;
}
.bl-none {
    border-left: none;
}
form.inquiry .shadow_select,
form.inquiry select,
form.inquiry input, 
form.inquiry textarea {
  background-color: #ffffff;
  border: 1px solid #cccccc;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
     -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
      -ms-transition: border linear 0.2s, box-shadow linear 0.2s;
       -o-transition: border linear 0.2s, box-shadow linear 0.2s;
          transition: border linear 0.2s, box-shadow linear 0.2s;
}

form.inquiry .shadow_select,
form.inquiry select:focus,
form.inquiry input:focus,
form.inquiry textarea:focus {
  border-color: rgba(82, 168, 236, 0.8);
  outline: 0;
  outline: thin dotted \9;
  /* IE6-9 */

  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
}
form[name="inquiry"] fieldset:first-child {
    position: absolute;
    /*top: -1000px;*/
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
.cursor-pointer {
    cursor: pointer;
}
label.required:after {
    content: "*";
    padding: 0 5px;
    font-weight: bold;
    color: #f00;
}

.axis path, .axis line {
    fill: none;
    stroke: #000;
    shape-rendering: crispEdges;
}
.grid .tick line {
    stroke: lightgrey;
    stroke-dasharray: 5;
    opacity: 0.7;
}
.area {
    fill: steelblue;
}
.redline {
    stroke: red;
    stroke-width: 1;
    fill: none;
}

#header .header-nav-top .nav > li > span.bold {
    background-color: #eee;
    border-radius: 5px;
}
#header .header-nav-main nav > ul > li.dropdown .dropdown-menu.dropdown-menu-item {
    left: auto;
    right: auto;
}
#banner_lite-didufeelit.home-intro {
    margin-bottom: -3px;
    /*border-bottom: 5px solid #ccc;*/
} 
#banner_lite-didufeelit.home-intro p {
    max-width: 100%;
    width: 100%;
} 
div.id-show {
    position: fixed;
    top: 50px; 
    left: 50px; 
    z-index: 10001;
    background-color: #ccc;
    color: #000;
    padding: 10px;
    border-radius: 5px;
    border: 3px double #000;
}
table.recent-quake-list td {
    white-space: nowrap;
    width: 1rem;
}
table.recent-quake-list td:nth-of-type(3) {
    width: 200px;
}
table.recent-quake-list td:nth-of-type(2) {
    width: auto;
}

img.cover {
  display: block;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
}    
.thumb-info .thumb-info-title {
  max-width: 95%;
}

/* FORM INQUIRY - START */
form.inquiry fieldset#didufeelit-fld div#inquiry_felt div.radio {
    display: inline-block;
    padding-right: 10px;
}
form.inquiry .form-group {
    margin-bottom: 5px;
}
form.inquiry label.control-label {
    font-weight: bold;
}
form.inquiry label.control-label.required:after {
    content: none;
}
form.inquiry label.control-label.required:before {
    content: "*";
    padding: 0 5px;
    font-weight: bold;
    color: #f00;
}
form.inquiry span.help-block {
    font-style: italic;
}
form.inquiry legend {
    color: #0088cc;
    border-color: #0088cc;
    padding-bottom: 5px;
}
/* FORM INQUIRY - STOP */

.switcher {
    border: 1px solid #dddddd;
    border-width: 0 1px;
    border-radius: 5px;
}


body.homepage .axis path, .axis line,
body.g-in-realtime .axis path, .axis line {
    fill: none;
    stroke: #000;
    shape-rendering: crispEdges;
}
body.homepage .grid .tick line,
body.g-in-realtime .grid .tick line {
    stroke: lightgrey;
    stroke-dasharray: 5;
    opacity: 0.7;
}
body.homepage .area,
body.g-in-realtime .area {
    fill: steelblue;
}
body.homepage .redline,
body.g-in-realtime .redline {
    stroke: red;
    stroke-width: 1;
    fill: none;
}
body.homepage .key_line,
body.g-in-realtime .key_line {
    font-size:17px;
    cursor: pointer;
}
body.homepage .key_square,
body.g-in-realtime .key_square {
    height:10px;
    width:10px;
    outline:solid 1px black;
    margin: 6px 10px 0px 10px;
    float: left;
    -moz-outline-radius: 2px;
    box-shadow: 3px 3px #aaa;
}
body.homepage .key_square.steelblue,
body.g-in-realtime .key_square.steelblue {
    background: steelblue;
}
body.homepage .key_square.red,
body.g-in-realtime .key_square.red {
    background: red;
}
body.homepage .disabled,
body.g-in-realtime .disabled {
    opacity: .3;
}
#footer img.footer_icons {
    opacity:.5;
    transition: opacity .5s ease-in-out;
}
#footer img.footer_icons:hover {
    opacity:1;
}

.table-striped > tbody > tr:nth-of-type(2n+1) {
    background-color: rgba(192,192,192,.3);
}
.table-hover > tbody > tr:hover {
    background-color: #f5f5f5;
}

/**
 *     MOURNING RIBBON -- BEGIN
 */
.ribbon {
  position: absolute;
  left: -5px; 
  top: -5px;
  z-index: 1;
  overflow: hidden;
  width: 75px; 
  height: 75px;
  text-align: right;
}
.ribbon span {
  font-size: 10px;
  font-weight: bold;
  color: #FFF;
  text-transform: uppercase;
  text-align: center;
  line-height: 20px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  width: 100px;
  display: block;
  background: #79A70A;
  background: linear-gradient(#000000 0%, #6B6B6B 100%);
  box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
  position: absolute;
  top: 19px; left: -21px;
}
.ribbon span.flag {
  color: rgba(0,0,0,0);
  height: 2px;
  background: linear-gradient(to right, rgba(0,0,0,1) 40%,rgba(238,255,0,1) 40%,rgba(238,255,0,1) 60%,rgba(239,65,53,1) 60%);
  top: 20px;
  left: -28px;
}
.ribbon span::before {
  content: "";
  position: absolute; left: 0px; top: 100%;
  z-index: -1;
  border-left: 3px solid #6B6B6B;
  border-right: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-top: 3px solid #6B6B6B;
}
.ribbon span::after {
  content: "";
  position: absolute; right: 0px; top: 100%;
  z-index: -1;
  border-left: 3px solid transparent;
  border-right: 3px solid #6B6B6B;
  border-bottom: 3px solid transparent;
  border-top: 3px solid #6B6B6B;
}
/**
 *     MOURNING RIBBON -- END
 */
.multi-column {
    -moz-column-width: 9em; /* Firefox */
    -webkit-column-width: 9em; /* webkit, Safari, Chrome */
    column-width: 9em;
    -moz-column-gap:5px;
    -webkit-column-gap:5px;
    column-gap:5px;
    -moz-column-rule: 1px solid #ddd;
    -webkit-column-rule: 1px solid #ddd;
    column-rule: 1px solid #ddd;
    text-align: center;
}
.badge-perso {
    border: 1px solid #ddd; 
    border-radius: 50%; 
    padding: 0 4px;
    font-size: smaller;
    line-height: 8px;

    background: rgba(242,246,248,1);
    background: -moz-linear-gradient(-45deg, rgba(242,246,248,1) 0%, rgba(216,225,231,1) 50%, rgba(181,198,208,1) 51%, rgba(224,239,249,1) 100%);
    background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(242,246,248,1)), color-stop(50%, rgba(216,225,231,1)), color-stop(51%, rgba(181,198,208,1)), color-stop(100%, rgba(224,239,249,1)));
    background: -webkit-linear-gradient(-45deg, rgba(242,246,248,1) 0%, rgba(216,225,231,1) 50%, rgba(181,198,208,1) 51%, rgba(224,239,249,1) 100%);
    background: -o-linear-gradient(-45deg, rgba(242,246,248,1) 0%, rgba(216,225,231,1) 50%, rgba(181,198,208,1) 51%, rgba(224,239,249,1) 100%);
    background: -ms-linear-gradient(-45deg, rgba(242,246,248,1) 0%, rgba(216,225,231,1) 50%, rgba(181,198,208,1) 51%, rgba(224,239,249,1) 100%);
    background: linear-gradient(135deg, rgba(242,246,248,1) 0%, rgba(216,225,231,1) 50%, rgba(181,198,208,1) 51%, rgba(224,239,249,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f6f8', endColorstr='#e0eff9', GradientType=1 );
}
.invisible {
    visibility: hidden;
}
small.cr {
    display: block;
}
table.measurements thead th {
    vertical-align: top;
    text-align: center;
}

/**
 *     
 */
/*
FILE FORMAT ICONS
by Greg Schoppe (http://gschoppe.com)
USAGE: include FontAwesome on page, as shown on http://fontawesome.io
       then include this css file, and target links by adding the link-icon
       class.  Note: try to avoid or manually label links to websites, as that
       detection code is necessarily janky. when in doubt, just end all external
       links with a trailing slash (/), a query string (?), or a link target (#)
*/
a.link-icon:after,
a.link-icon.link-file[href]:after {
    content: "\f016"; /* generic file icon */
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transform: translate(0, 0);
    width: 16px;
    text-align: right;
    margin-right: 0;
}
a[href$=".txt"].link-icon:after,
a.link-icon.link-text[href]:after {
    content: "\f0f6"; /*Text*/
}
a[href$=".pdf"].link-icon:after,
a.link-icon.link-pdf[href]:after {
    content: "\f1c1"; /*PDF*/
}
a[href$=".doc"].link-icon:after,
a[href$=".docx"].link-icon:after,
a.link-icon.link-word[href]:after {
    content: "\f1c2"; /*Word*/
}
a[href$=".xls"].link-icon:after,
a[href$=".xlsx"].link-icon:after,
a.link-icon.link-excel[href]:after {
    content: "\f1c3"; /*Excel*/
}
a[href$=".ppt"].link-icon:after,
a[href$=".pptx"].link-icon:after,
a.link-icon.link-powerpoint[href]:after {
    content: "\f1c4"; /*Powerpoint*/
}
a[href$=".gif"].link-icon:after,
a[href$=".jpg"].link-icon:after,
a[href$=".jpeg"].link-icon:after,
a[href$=".png"].link-icon:after,
a[href$=".bmp"].link-icon:after,
a[href$=".tif"].link-icon:after,
a.link-icon.link-image[href]:after {
    content: "\f1c5"; /*Image*/
}
a[href$=".zip"].link-icon:after,
a[href$=".zipx"].link-icon:after,
a[href$=".rar"].link-icon:after,
a[href$=".tar"].link-icon:after,
a[href$=".gz"].link-icon:after,
a[href$=".dmg"].link-icon:after,
a[href$=".iso"].link-icon:after,
a.link-icon.link-archive[href]:after {
    content: "\f1c6"; /*Archive*/
}
a[href$=".wav"].link-icon:after,
a[href$=".mp3"].link-icon:after,
a[href$=".fla"].link-icon:after,
a[href$=".flac"].link-icon:after,
a[href$=".ra"].link-icon:after,
a[href$=".rma"].link-icon:after,
a[href$=".aif"].link-icon:after,
a[href$=".aiff"].link-icon:after,
a[href$=".aa"].link-icon:after,
a[href$=".aac"].link-icon:after,
a[href$=".aax"].link-icon:after,
a[href$=".ac3"].link-icon:after,
a[href$=".au"].link-icon:after,
a[href$=".ogg"].link-icon:after,
a[href$=".avr"].link-icon:after,
a[href$=".3ga"].link-icon:after,
a[href$=".flac"].link-icon:after,
a[href$=".mid"].link-icon:after,
a[href$=".midi"].link-icon:after,
a[href$=".m4a"].link-icon:after,
a[href$=".mp4a"].link-icon:after,
a[href$=".amz"].link-icon:after,
a[href$=".mka"].link-icon:after,
a[href$=".asx"].link-icon:after,
a[href$=".pcm"].link-icon:after,
a[href$=".m3u"].link-icon:after,
a[href$=".wma"].link-icon:after,
a[href$=".xwma"].link-icon:after,
a.link-icon.link-audio[href]:after {
    content: "\f1c7"; /*Audio*/
}
a[href$=".avi"].link-icon:after,
a[href$=".mpg"].link-icon:after,
a[href$=".mp4"].link-icon:after,
a[href$=".mkv"].link-icon:after,
a[href$=".mov"].link-icon:after,
a[href$=".wmv"].link-icon:after,
a[href$=".vp6"].link-icon:after,
a[href$=".264"].link-icon:after,
a[href$=".vid"].link-icon:after,
a[href$=".rv"].link-icon:after,
a[href$=".webm"].link-icon:after,
a[href$=".swf"].link-icon:after,
a[href$=".h264"].link-icon:after,
a[href$=".flv"].link-icon:after,
a[href$=".mk3d"].link-icon:after,
a[href$=".gifv"].link-icon:after,
a[href$=".oggv"].link-icon:after,
a[href$=".3gp"].link-icon:after,
a[href$=".m4v"].link-icon:after,
a[href$=".movie"].link-icon:after,
a[href$=".divx"].link-icon:after,
a.link-icon.link-video[href]:after {
    content: "\f1c8"; /*Video*/
}
a[href$=".css"].link-icon:after,
a[href$=".js"].link-icon:after,
a[href$=".py"].link-icon:after,
a[href$=".git"].link-icon:after,
a[href$=".py"].link-icon:after,
a[href$=".cpp"].link-icon:after,
a[href$=".h"].link-icon:after,
a[href$=".ini"].link-icon:after,
a[href$=".config"].link-icon:after,
a.link-icon.link-code[href]:after {
    content: "\f1c9"; /*code*/
}
a[href$=".exe"].link-icon:after,
a[href$=".jar"].link-icon:after,
a[href$=".dll"].link-icon:after,
a[href$=".bat"].link-icon:after,
a[href$=".pl"].link-icon:after,
a[href$=".scr"].link-icon:after,
a[href$=".msi"].link-icon:after,
a[href$=".app"].link-icon:after,
a[href$=".deb"].link-icon:after,
a[href$=".apk"].link-icon:after,
a[href$=".jar"].link-icon:after,
a[href$=".vb"].link-icon:after,
a[href$=".prg"].link-icon:after,
a[href$=".sh"].link-icon:after,
a.link-icon.link-exe[href]:after {
    content: "\f085"; /*Executable*/
}

a[href$=".com"].link-icon:after,
a[href$=".net"].link-icon:after,
a[href$=".org"].link-icon:after,
a[href$=".edu"].link-icon:after,
a[href$=".gov"].link-icon:after,
a[href$=".mil"].link-icon:after,
a[href$="/"].link-icon:after,
a[href$=".html"].link-icon:after,
a[href$=".htm"].link-icon:after,
a[href$=".xhtml"].link-icon:after,
a[href$=".jhtml"].link-icon:after,
a[href$=".php"].link-icon:after,
a[href$=".php3"].link-icon:after,
a[href$=".php4"].link-icon:after,
a[href$=".php5"].link-icon:after,
a[href$=".phtml"].link-icon:after,
a[href$=".asp"].link-icon:after,
a[href$=".aspx"].link-icon:after,
a[href$=".cfm"].link-icon:after,
a[href*="?"].link-icon:after,
a[href*="#"].link-icon:after,
a.link-icon:not([href*='.']):after,
a.link-icon.link[href]:after {
    content: "\f08e"; /*link*/
}

a.link-icon.link-youtube[href]:after {
    content: "\f167"; /*link*/
}


table.dataTable.table-condensed .sorting::after, table.dataTable.table-condensed .sorting_asc::after, table.dataTable.table-condensed .sorting_desc::after {
    top: inherit;
    right: 6px;
}
.input-group-addon.errors {
    border-left: 0;
    border-right: 0;
}
.stylish-input-group .input-group-addon{
    background: white !important; 
}
.stylish-input-group .form-control{
    border-right:0; 
    box-shadow:0 0 0; 
    border-color:#ccc;
}
div.dataTables_wrapper div.dataTables_paginate {
    text-align: center;
}
table.recent-quake-list tr.tecto a {
    color: #0088cc;
}
table.recent-quake-list tr.induced a {
    color: #FF4500 /*orangered*/
}
table.recent-quake-list tr.notecto a {
    color: #bb00bb;
}
.img-thumbnail.img-thumbnail-hover-icon:after {
    content:"\f0b2";
}

.featured-boxes-flat .featured-box .icon-featured {
    top: -10px;
}


#basemaps-wrapper {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 400;
    background: rgba(255,255,255,.75);
    padding: 10px 5px 5px;
}
#basemaps {
    margin-bottom: 5px;
}
cite {
    font-style: normal;
    display: block;
    padding: 0 10px;
    margin: 0 -10px;
    border-radius: 5px;
}

h3 {
    margin: 33px 0;
}
:target {
    animation: highlight 3s ease;
}

@keyframes highlight {
    from { background:#ffffff; }
    50% { background:#ffffd3; }
    to { background:#ffffff; }
}
dt time {
    display: block;
    font-weight: normal;
    font-size: small;
}

/**
 *     CSS For lateral debug box
 */
#slideout {
    position: fixed;
    top: 40px;
    left: 0;
    width: 35px;
    padding: 12px 0;
    text-align: center;
    background: rgba(0,136,204,.75);
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-border-radius: 0 5px 5px 0;
    -moz-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
    z-index: 2000;
}
#slideout_inner {
    position: fixed;
    top: 40px;
    left: -300px;
    background: #fff;
    border-style: solid;
    border-color: rgba(0,136,204,.75);
    width: 300px;
    height: auto;
    min-height: 130px;
    padding: 5px;
    box-sizing: border-box;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
    text-align: left;
    -webkit-border-radius: 0 5px 5px 0;
    -moz-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
}
#slideout_pin:checked + #slideout, 
#slideout:hover {
    left: 250px;
}
#slideout_pin:checked + #slideout #slideout_inner, 
#slideout:hover #slideout_inner {
    left: 0;
}
#slideout_inner :first-of-type dd,
dl#visitor-details dd {
    margin-bottom: 2px;
}
#slideout_pin + #slideout #slideout_inner label[for="slideout_pin"] .pin {
    display: block;
} 
#slideout_pin + #slideout #slideout_inner label[for="slideout_pin"] .unpin {
    display: none;
} 
#slideout_pin:checked + #slideout #slideout_inner label[for="slideout_pin"] .pin {
    display: none;
} 
#slideout_pin:checked + #slideout #slideout_inner label[for="slideout_pin"] .unpin {
    display: block;
} 
.thumb-info-social-icons {
    padding: 7px 0px;
}
.italic {
    font-style: italic;
}
.underline {
    text-decoration: underline;
}
#historical-catalog table {
    table-layout: fixed;
}
#historical-catalog th:nth-of-type(1),
#historical-catalog td:nth-of-type(1),
#historical-catalog th:nth-of-type(2),
#historical-catalog td:nth-of-type(2) {
    width: 100px;
}

/**
 *     News Ticker
 */
.newsticker li {
    line-height: 28px;
}
.news .title {
    border-radius: 3px 0 0 3px;
    height: 28px;
    display:block;
    line-height: 28px;
    padding: 0 20px 0 10px;
    position: relative;
    text-decoration: none;
    -webkit-transition: color 0.2s;
}
.news .title::after {
  background: #fff;
  border-bottom: 14px solid transparent;
  border-left: 10px solid #337ab7;
  border-top: 14px solid transparent;
  content: '';
  position: absolute;
  right: 0;
  top: 0;
}
/**
 *     New Ticker -- End
 */
.tooltip.red > .tooltip-inner {background-color: #c9302c;}
.tooltip.red > .tooltip-arrow { border-bottom-color:#c9302c; }
.tooltip.red.list-unstyled {
	padding: 0;
}
.tooltip.red.list-unstyled .tooltip-inner {
	max-width: 350px!important;
}
.tooltip.red.list-unstyled ul {
	padding: 0;
	list-style: none;
	margin: 0;
	white-space: nowrap;
}

table#mecha th,
table#mecha td {
    vertical-align: middle;
    text-align: center;
}
.fa-rob {
    background-image: url('/favicon-16x16.png');
    background-position: 2px 2px;
    background-size: 16px 16px;
    width: 20px;
    height: 16px;
    background-repeat: no-repeat;
}

.rob-logo {
    background-size: 75px 75px;
    width: 75px;
    height: 75px;
    background-repeat: no-repeat;
    -webkit-filter: grayscale(100%);
    -webkit-transition: .5s ease-in-out;
    -moz-filter: grayscale(100%);
    -moz-transition: .5s ease-in-out;
    -o-filter: grayscale(100%);
    -o-transition: .5s ease-in-out;
    filter: grayscale(100%);
    filter: gray;
    /*filter: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' height='0'><filter id='greyscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0' /></filter></svg>#greyscale");*/
    transition: .5s ease-in-out;
}
.feature-box.feature-box-style-5:hover .rob-logo {
    -webkit-filter: grayscale(0%);
    -webkit-transition: .5s ease-in-out;
    -moz-filter: grayscale(0%);
    -moz-transition: .5s ease-in-out;
    -o-filter: grayscale(0%);
    -o-transition: .5s ease-in-out;
    filter: grayscale(0%);
    transition: .5s ease-in-out;
}

.thumb-info-wrapper img:hover {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
    filter: none;
}
.rob-logo-crust-def {
    background-image: url('/img/art/gravi-crustal-def.png');
    background-position: 0px 0px;
}
.rob-logo-hydro-effect {
    background-image: url('/img/art/gravi-hydro-effect.png');
    background-position: 0px 0px;
}
.rob-logo-metrology {
    background-image: url('/img/art/gravi-metrology.png');
    background-position: 0px 0px;
}
.rob-logo-historical {
    background-image: url('/img/art/logo-historical-seismic-activity.png');
    background-position: 0px -17px;
}
.rob-logo-alert {
    background-image: url('/img/art/logo-seismic-alert.png');
    background-position: 0px 0px;
}
.rob-logo-eurocode {
    background-image: url('/img/art/logo-eurocode8.png');
    background-position: 0px 0px;
}
.rob-logo-macrosismo {
    background-image: url('/img/art/logo-macroseismology.png');
    background-position: 0px -7px;
}
.rob-logo-volcano {
    background-image: url('/img/art/logo-volcano-sismology.png');
    background-position: 0px -8px;
}

.thumb-info-wrapper img {
}
.pl-huge {
    padding-left: 100px !important;
}

/*==================================================
=            Animated Hamurger button              =
==================================================*/
.nav-icon {
  width: 30px;
  height: 20px;
  position: relative;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
  border: none;
  background: transparent;
  z-index: 1001;
}

.nav-icon span:not(:nth-child(4)) {
  display: block;
  position: absolute;
  height: 4px;
  width: 30px;
  background: #d3531a;
  border-radius: 4px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

.nav-icon span:nth-child(4) {
  position: absolute;
  right: 40px;
  top: 0px;
  white-space: nowrap;
  color: #d3531a;
  font-weight: bold;
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

.nav-icon.collapsed span:nth-child(1) {
  top: 0px;
}

.nav-icon.collapsed span:nth-child(2) {
  top: 8px;
}

.nav-icon.collapsed span:nth-child(3) {
  top: 16px;
}

.nav-icon:not(.collapsed) span:nth-child(4) {
  opacity: 0;
  right: -100px;
}

.nav-icon:not(.collapsed) span:nth-child(1) {
  top: 8px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}

.nav-icon:not(.collapsed) span:nth-child(2) {
  opacity: 0;
  left: -60px;
}

.nav-icon:not(.collapsed) span:nth-child(3) {
  top: 8px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}


/*==================================================
=            Bootstrap 3 Media Queries             =
==================================================*/


ul.columns-3 {
    -webkit-column-count: 3; /* Chrome, Safari, Opera */
    -moz-column-count: 3; /* Firefox */
    column-count: 3;
    -webkit-column-width: 250px; /* Chrome, Safari, Opera */
    -moz-column-width: 250px; /* Firefox */
    column-width: 250px;
}
ul.columns-3 li {
    display: inline-block;
    min-width: 250px;
}


/*==========  Mobile First Method  ==========*/

/* Custom, iPhone Retina */ 
@media only screen and (min-width : 320px) {
    ul.columns-3 {
      columns: 1;
      -webkit-columns: 1;
      -moz-columns: 1;
    }
}

/* Extra Small Devices, Phones */ 
@media only screen and (min-width : 480px) {
    ul.columns-3 {
      columns: 1;
      -webkit-columns: 1;
      -moz-columns: 1;
    }
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
    ul.columns-3 {
      columns: 2;
      -webkit-columns: 2;
      -moz-columns: 2;
    }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
    ul.columns-3 {
      columns: 3;
      -webkit-columns: 3;
      -moz-columns: 3;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
    ul.columns-3 {
      columns: 3;
      -webkit-columns: 3;
      -moz-columns: 3;
    }
}



/*==========  Non-Mobile First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
    ul.columns-3 {
      columns: 3;
      -webkit-columns: 3;
      -moz-columns: 3;
    }
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
    ul.columns-3 {
      columns: 3;
      -webkit-columns: 3;
      -moz-columns: 3;
    }
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
    ul.columns-3 {
      columns: 2;
      -webkit-columns: 2;
      -moz-columns: 2;
    }
}

/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) {
    ul.columns-3 {
      columns: 1;
      -webkit-columns: 1;
      -moz-columns: 1;
    }
}

/* Custom, iPhone Retina */ 
@media only screen and (max-width : 320px) {
    ul.columns-3 {
      columns: 1;
      -webkit-columns: 1;
      -moz-columns: 1;
    }
}

/*==================================================
=                  Responsive Slides               =
==================================================*/
ul.rslides .caption {
  position: absolute;
  display: block;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 15px;
  text-align: center;
  background: #000;
  background: rgba(0,0,0, .8);
  color: #fff;
}

.with-language a:before {
    text-transform: uppercase;
    content: "[" attr(lang) "]";
    padding: 0;
    color: #c7254e;
    background-color: #f9f2f4;
    border-radius: 4px;
    font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
    font-size: 70%;
    float: left;
    text-decoration: none;
    margin-right: 3px;
}
.with-language a:before:hover {
    text-decoration: none;
}


ul.team-list .thumb-info-title {
    bottom: 10px;
}


#quakes-tabs > li:nth-child(2) > a {
    color: #bb00bb;
}
#quakes-tabs > li.active:nth-child(2) > a,
#quakes-tabs > li:nth-child(2) > a:hover,
#quakes-tabs > li:nth-child(2) > a:focus {
    border-top-color: #bb00bb;
}


/**
 * Seismograms -- BEGIN
 */
i[class="devicon-*"] {
    width: 2rem;
}
.d-flex.flex-row > :first-child {
    min-width:50px;
    max-width:50px;
}
.d-flex.flex-row > div {
    flex: 1 1 auto;
    margin: 2px;
    background: transparent;
}
.d-flex.flex-row > :nth-child(1) {
    border-radius: 50% 0 0 50%;
}
.d-flex.flex-row > :nth-child(2),
.d-flex.flex-row > :nth-child(3) {
    flex: 1 0 0;
    padding: 5px;
}
.flex-row:nth-of-type(2) > div {
    background: rgba(255,165,0,1);
}
.flex-row:nth-of-type(3) > div {
    background: rgba(238,130,238,1);
}
.flex-row:nth-of-type(4) > div {
    background: rgba(0,128,0,1);
}
.side-banner {
    position: relative;
    writing-mode: vertical-rl;
    text-orientation: upright;
    display: block;
    color: white;
    display: block;
    min-height: 280px;
    overflow: hidden;
    text-overflow: hidden;
}

/**
 * Style for graph D3
 **/
figure.graph .axis,
figure.graph .axis path,
figure.graph .axis line {
    stroke: #000;
    fill: none;
    shape-rendering: crispEdges;
}

figure.graph .y.axis text {
    stroke: none;
    fill: #000;
    font-family: courier;
    font-size: 11px;
    shape-rendering: crispEdges;
}

figure.graph .y.left.axis .tick {
    cursor: pointer;
}

figure.graph .x.axis path {
    stroke: none;
    fill: none;
}

figure.graph .x.axis text {
    stroke: none;
    fill: none;
}

figure.graph .area {
    fill: #ff0000;
    stroke: #ff0000;
}

/**
 * End of style for graph D3
 **/

/**
 * Style for seismograms
 **/
figure.graph {
    margin: 0 auto 0 auto;
    font-size: 14px;
    font-weight: bold;
    font-family: Arial, Helvetica;
    width: 1060px;
    display: flex;
    flex-direction: column;
    align-content: stretch;
}

figure.graph figcaption {
    height: 40px;
    width: 103%;
    margin-left: -1.5%;
    display: flex;
    flex-direction: row;
    align-items: center;
    border-radius: 5px;
    background: rgba( 190, 190, 190, .2);
}
figure.graph figcaption div {
    flex: 1;
    text-align: center;
}
figure.graph figcaption div:nth-child(1),
figure.graph figcaption div:nth-child(5) {
    display: block;
    max-width: 63px;
    font-size: 11px;
    padding-left: 5px;
    text-align: left;
}
figure.graph figcaption div:nth-child(1) {
	padding-right: 10px;
	text-align: right;
}
figure.graph figcaption div:nth-child(2) {
    text-align: left;
    padding-left: 5px;
}
figure.graph figcaption div:nth-child(3) {
    text-align: center;
}
figure.graph figcaption div:nth-child(4) {
    text-align: right;
    padding-right: 5px;
}
figure.graph .frame {
    flex: 1 100% 0;
    display: flex;
}
figure.graph .frame svg {
    height: 730px;
    width: 1075px;
/*    float: left; */
}

figure.graph .frame svg g.seismogram:nth-of-type(2n) path.area {
  fill: #0000ff;
  stroke: #0000ff;
}
.hidden {
    display: none;
}
/**
 * End of style for seismograms
 **/
.loader,
.loader-default::after,
.loader[data-text]::before {
    position: absolute;
}
.loader.is-active:before,
.loader.is-active:after {
    color: #000;
    border-color: #000;
    border-left-color: transparent;
}
.loader.is-active {
    background-color: rgba(225,225,225,.3);
}

a.events path.events {
    animation: fluctuat 1s infinite;
    cursor: pointer;
}

@keyframes fluctuat {
    0% {
        fill: darkgreen;
    }
    50% {
        opacity: 0.2;
    }
}

@-moz-document url-prefix() {
 #flexible-content{
      flex: 1;
    }
}
/**
 * Seismograms -- END
 */
.popover.popover-lg {
    max-width: 500px;
}

#googlemaps-orb {
	margin-top: 0!important;
}

/* RIBBON IN DOWNLOAD SECTION */
.corner-ribbon {
    position: absolute;
    z-index: 2;
    width: 200px;
    top: 20px;
    right: -70px;
    font-weight: bold;
    color: #FFF;
    text-transform: uppercase;
    text-align: center;
    line-height: 20px;
    letter-spacing: 1px;
    color: #f0f0f0;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    font-size: 10px;
    display: block;
    background: #79A70A;
    background: linear-gradient(#2989d8 0%, #1e5799 100%);
    box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
}