Difference between revisions of "Team:Bielefeld-CeBiTec/CSS"

 
(242 intermediate revisions by the same user not shown)
Line 1: Line 1:
<html>
 
 
<style>
 
  
 
/* HQ CSS*/
 
/* HQ CSS*/
 
.firstHeading {
 
.firstHeading {
display: none;
+
display: none;
}
+
}
+
.mw-content-text {
+
display: none;
+
}
+
  
.logo_2018 {
+
.mw-content-text {
display: none;
+
display: none;
}
+
}
+
.globalWrapper {
+
padding: 0px;
+
        margin: 0px;
+
}
+
+
        #content {
+
margin-left:0px;
+
padding:0px;
+
width:100%;
+
}
+
+
  
 +
.logo_2018 {
 +
display: none;
 +
}
  
 +
#globalWrapper {
 +
padding: 0px;
 +
margin: 0px;
 +
padding-bottom: 0px;
 +
}
  
/* important Bootstrap CSS*/
+
#content {
 +
margin-left:0px;
 +
padding:0px;
 +
width:100%;
 +
margin-top: -7px;
 +
}
  
html {
+
 
  font-family: sans-serif;
+
 
  -ms-text-size-adjust: 100%;
+
.mw-content-ltr ul, .mw-content-rtl .mw-content-ltr ul{
  -webkit-text-size-adjust: 100%;
+
margin:0px;
 
}
 
}
body {
+
 
  margin: 0;
+
#top_title {
 +
margin-bottom: 0px;
 
}
 
}
article,
+
 
aside,
+
#top_menu_14{
details,
+
 
figcaption,
+
border-bottom: 0px solid black;
figure,
+
footer,
+
header,
+
hgroup,
+
main,
+
menu,
+
nav,
+
section,
+
summary {
+
  display: block;
+
 
}
 
}
  
abbr[title] {
+
#HQ_page p {
  border-bottom: 1px dotted;
+
margin: 0;
 
}
 
}
b,
+
 
strong {
+
/*NAVBAR*/
  font-weight: bold;
+
 
 +
@charset "UTF-8";
 +
 
 +
body{
 +
margin-top:0px;
 
}
 
}
dfn {
+
 
  font-style: italic;
+
.navigation {
 +
height: 70px;
 +
background: #002a5c;
 +
position: fixed;
 +
width:100%;
 +
text-decoration: none;
 
}
 
}
h1 {
+
 
  font-size: 2em;
+
.brand {
  margin: 0.67em 0;
+
position: absolute;
 +
padding-left: 20px;
 +
float: left;
 +
line-height: 70px;
 +
text-transform: uppercase;
 +
font-size: 1.4em;
 +
width: 300px;
 
}
 
}
mark {
+
 
  background: #ff0;
+
.logo-img{
  color: #000;
+
width: 70%;
 +
margin-top: 1%;
 
}
 
}
small {
+
 
  font-size: 80%;
+
@media only screen and (max-width: 1350px) {
 +
.logo-img{
 +
width: 70%;
 +
margin-top: 2%;
 
}
 
}
sub,
+
 
sup {
+
.navigation{
  font-size: 75%;
+
position: absolute;
  line-height: 0;
+
  position: relative;
+
  vertical-align: baseline;
+
 
}
 
}
sup {
+
 
  top: -0.5em;
+
 
}
 
}
sub {
+
 
  bottom: -0.25em;
+
@media only screen and (max-width: 790px) {
 +
.logo-img{
 +
width: 70%;
 +
margin-top: 3%;
 
}
 
}
img {
+
 
  border: 0;
+
.navigation{
 +
position: absolute;
 
}
 
}
svg:not(:root) {
+
 
  overflow: hidden;
+
 
}
 
}
figure {
+
 
  margin: 1em 40px;
+
 
 +
.brand a,
 +
.brand a:visited {
 +
color: #ffffff;
 +
text-decoration: none;
 
}
 
}
hr {
+
 
  -webkit-box-sizing: content-box;
+
.nav-container {
    -moz-box-sizing: content-box;
+
max-width: auto;
          box-sizing: content-box;
+
margin: 0 auto;
  height: 0;
+
text-decoration: none;
 
}
 
}
pre {
+
 
  overflow: auto;
+
nav {
 +
float: right;
 +
text-decoration: none;
 
}
 
}
code,
+
nav ul {
kbd,
+
list-style: none;
pre,
+
margin: 0;
samp {
+
padding: 0;
  font-family: monospace, monospace;
+
text-decoration: none;
  font-size: 1em;
+
 
}
 
}
button,
+
nav ul li {
input,
+
float: left;
optgroup,
+
position: relative;
select,
+
text-decoration: none;
textarea {
+
  color: inherit;
+
  font: inherit;
+
  margin: 0;
+
 
}
 
}
button {
+
nav ul li a,
  overflow: visible;
+
nav ul li a:visited,
 +
nav ul li a:focus{
 +
display: block;
 +
padding: 0 20px;
 +
line-height: 70px;
 +
background: #002a5c;
 +
color: #ffffff;
 +
text-decoration: none;
 +
margin-bottom:-4px;
 +
border-color:#002a5c;
 
}
 
}
button,
+
nav ul li a:hover,
select {
+
nav ul li a:visited:hover {
  text-transform: none;
+
background: #4d9dff;
 +
color: #ffffff;
 +
text-decoration: none;
 
}
 
}
button,
+
nav ul li a:not(:only-child):after,
html input[type="button"],
+
nav ul li a:visited:not(:only-child):after {
input[type="reset"],
+
padding-left: 4px;
input[type="submit"] {
+
content: " ▾";
  -webkit-appearance: button;
+
text-decoration: none;
  cursor: pointer;
+
 
}
 
}
button[disabled],
+
nav ul li ul li {
html input[disabled] {
+
min-width: 190px;
  cursor: default;
+
text-decoration: none;
 
}
 
}
button::-moz-focus-inner,
+
nav ul li ul li a {
input::-moz-focus-inner {
+
padding: 15px;
  border: 0;
+
line-height: 20px;
  padding: 0;
+
text-decoration: none;
 +
text-decoration: none;
 
}
 
}
input {
+
 
  line-height: normal;
+
.nav-dropdown {
 +
position: absolute;
 +
display: none;
 +
z-index: 1;
 +
box-shadow: 0 3px 12px rgba(0, 0, 0, 0.15);
 +
text-decoration: none;
 
}
 
}
input[type="checkbox"],
+
 
input[type="radio"] {
+
/* Mobile navigation */
  -webkit-box-sizing: border-box;
+
.nav-mobile {
    -moz-box-sizing: border-box;
+
display: none;
          box-sizing: border-box;
+
position: absolute;
  padding: 0;
+
top: 0;
 +
right: 0;
 +
background: #002a5c;
 +
height: 70px;
 +
width: 70px;
 
}
 
}
input[type="number"]::-webkit-inner-spin-button,
+
 
input[type="number"]::-webkit-outer-spin-button {
+
@media only screen and (max-width: 1350px) {
  height: auto;
+
 
 +
 
 +
.nav-mobile {
 +
display: block;
 
}
 
}
input[type="search"] {
+
 
  -webkit-appearance: textfield;
+
nav {
  -webkit-box-sizing: content-box;
+
width: 100%;
    -moz-box-sizing: content-box;
+
padding: 70px 0 15px;
          box-sizing: content-box;
+
 
}
 
}
input[type="search"]::-webkit-search-cancel-button,
+
nav ul {
input[type="search"]::-webkit-search-decoration {
+
display: none;
  -webkit-appearance: none;
+
max-height: 280px;
 +
overflow-y: auto;
 
}
 
}
fieldset {
+
nav ul li {
  border: 1px solid #c0c0c0;
+
float: none;
  margin: 0 2px;
+
  padding: 0.35em 0.625em 0.75em;
+
 
}
 
}
legend {
+
nav ul li a {
  border: 0;
+
padding: 15px;
  padding: 0;
+
line-height: 20px;
 +
text-decoration: none;
 
}
 
}
textarea {
+
nav ul li ul li a {
  overflow: auto;
+
padding-left: 30px;
 +
text-decoration: none;
 
}
 
}
optgroup {
+
 
  font-weight: bold;
+
.nav-dropdown {
 +
position: static;
 
}
 
}
table {
 
  border-collapse: collapse;
 
  border-spacing: 0;
 
 
}
 
}
td,
+
@media screen and (min-width: 1351px) {
th {
+
.nav-list {
  padding: 0;
+
display: block !important;
 
}
 
}
* {
 
  -webkit-box-sizing: border-box;
 
  -moz-box-sizing: border-box;
 
  box-sizing: border-box;
 
 
}
 
}
*:before,
+
#nav-toggle {
*:after {
+
position: absolute;
  -webkit-box-sizing: border-box;
+
left: 18px;
  -moz-box-sizing: border-box;
+
top: 22px;
  box-sizing: border-box;
+
cursor: pointer;
 +
padding: 10px 35px 16px 0px;
 +
max-height: 280px;
 +
overflow-y: auto;
 
}
 
}
html {
+
#nav-toggle span,
  font-size: 10px;
+
#nav-toggle span:before,
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+
#nav-toggle span:after {
 +
cursor: pointer;
 +
border-radius: 1px;
 +
height: 5px;
 +
width: 35px;
 +
background: #ffffff;
 +
position: absolute;
 +
display: block;
 +
content: "";
 +
transition: all 300ms ease-in-out;
 
}
 
}
body {
+
#nav-toggle span:before {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+
top: -10px;
  font-size: 14px;
+
  line-height: 1.42857143;
+
  color: #333333;
+
  background-color: #ffffff;
+
 
}
 
}
input,
+
#nav-toggle span:after {
button,
+
bottom: -10px;
select,
+
textarea {
+
  font-family: inherit;
+
  font-size: inherit;
+
  line-height: inherit;
+
 
}
 
}
a {
+
#nav-toggle.active span {
  color: #000000;
+
background-color: transparent;
  text-decoration: none;
+
 
}
 
}
a:hover,
+
#nav-toggle.active span:before, #nav-toggle.active span:after {
a:focus {
+
top: 0;
  color: #002a5c;
+
  text-decoration: underline;
+
 
}
 
}
a:focus {
+
#nav-toggle.active span:before {
  outline: 5px auto -webkit-focus-ring-color;
+
transform: rotate(45deg);
  outline-offset: -2px;
+
 
}
 
}
figure {
+
#nav-toggle.active span:after {
  margin: 0;
+
transform: rotate(-45deg);
 
}
 
}
img {
+
 
  vertical-align: middle;
+
article {
 +
max-width: 1000px;
 +
margin: 0 auto;
 +
padding: 10px;
 +
line-height: 1.5;
 
}
 
}
.img-responsive {
+
 
  display: block;
+
.article {
  max-width: 100%;
+
max-width: 1000px;
  height: auto;
+
margin: 0 auto;
 +
padding: 10px;
 +
line-height: 1.5;
 +
padding-right: 5%;
 +
padding-left : 5%;
 +
 
 
}
 
}
.img-rounded {
+
 
  border-radius: 6px;
+
/* W3 Schools templates*/
 +
 
 +
.w3-top,.w3-bottom{position:fixed;width:100%;z-index:1;}
 +
.w3-top{top:0;}
 +
.w3-bottom{bottom:0;}
 +
 
 +
#footer{display:block;width:98%}
 +
 
 +
.w3-container:after,.w3-container:before{content:"";display:table;clear:both;width:98%;}
 +
 
 +
.w3-container{}
 +
 
 +
.w3-padding-32{padding-top:32px!important;padding-bottom:32px!important;}
 +
 
 +
.w3-center .w3-bar{display:inline-block;width:auto;}
 +
 
 +
.w3-center{text-align:center!important;}
 +
 
 +
.w3-black,.w3-hover-black:hover{color:#fff!important;background-color:#000!important;}
 +
 
 +
.w3-xlarge{font-size:24px!important;}
 +
 
 +
 
 +
 
 +
/*OWN STYLES*/
 +
 
 +
body {
 +
font-family: "Lato", sans-serif;
 
}
 
}
.img-thumbnail {
+
 
  padding: 4px;
+
@media only screen and (min-width: 1010px){
  line-height: 1.42857143;
+
.main_content {
  background-color: #ffffff;
+
 
  border: 1px solid #dddddd;
+
background-color: white;
  border-radius: 4px;
+
border: 1px solid #000000;
  -webkit-transition: all 0.2s ease-in-out;
+
border-radius: 0px;
  -o-transition: all 0.2s ease-in-out;
+
box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.35);
  transition: all 0.2s ease-in-out;
+
min-height: 100px;
  display: inline-block;
+
border-top: none;
  max-width: 100%;
+
border-bottom: none;
  height: auto;
+
margin-left:25%;
 +
margin-right:25%;
 +
padding-bottom: 4%;
 +
min-height: 420px;
 +
position: sticky;
 +
margin-top: -100px;
 
}
 
}
.img-circle {
 
  border-radius: 50%;
 
 
}
 
}
hr {
+
 
  margin-top: 20px;
+
@media only screen and (max-width: 1009px){
  margin-bottom: 20px;
+
.main_content {
  border: 0;
+
 
  border-top: 1px solid #eeeeee;
+
background-color: white;
 +
border: 1px solid #000000;
 +
border-radius: 0px;
 +
box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.35);
 +
min-height: 100px;
 +
border-top: none;
 +
border-bottom: none;
 +
margin-left:0;
 +
margin-right:0;
 +
padding-bottom: 4%;
 +
position: sticky;
 +
margin-top: -100px;
 
}
 
}
.sr-only {
 
  position: absolute;
 
  width: 1px;
 
  height: 1px;
 
  margin: -1px;
 
  padding: 0;
 
  overflow: hidden;
 
  clip: rect(0, 0, 0, 0);
 
  border: 0;
 
 
}
 
}
.sr-only-focusable:active,
+
 
.sr-only-focusable:focus {
+
 
  position: static;
+
#container{
  width: auto;
+
position: relative;
  height: auto;
+
min-height: 100%;
  margin: 0;
+
height: 100%;
  overflow: visible;
+
  clip: auto;
+
 
}
 
}
[role="button"] {
+
 
  cursor: pointer;
+
.container{
 +
padding-top:0px;
 +
background-color: #001633;
 
}
 
}
.container {
+
 
  margin-right: auto;
+
.section{
  margin-left: auto;
+
margin: 1%;
  padding-left: 15px;
+
  padding-right: 15px;
+
 
}
 
}
@media (min-width: 768px) {
+
 
  .container {
+
.half{
    width: 750px;
+
max-width: 48%;
  }
+
 
}
 
}
@media (min-width: 992px) {
+
 
  .container {
+
.half.left {
    width: 970px;
+
float: left;
  }
+
margin-right: 1%;
 
}
 
}
@media (min-width: 1200px) {
+
 
  .container {
+
.half.right {
    width: 1170px;
+
float: right;
  }
+
margin-left: 1%;
 +
 
 
}
 
}
.container-fluid {
+
 
  margin-right: auto;
+
article, .article {
  margin-left: auto;
+
text-align: justify;
  padding-left: 15px;
+
display: block;
  padding-right: 15px;
+
margin: auto;
 +
font-size: 16px;
 +
padding-bottom: 20px;
 
}
 
}
.row {
+
 
  margin-left: -15px;
+
article, .article, .contentline {
  margin-right: -15px;
+
width: 90%;
 +
font-size: 16px;
 +
padding-bottom: 30px;
 
}
 
}
  
fieldset {
+
.contentline article, .contentline .article {
  padding: 0;
+
width: 100%;
  margin: 0;
+
  border: 0;
+
  min-width: 0;
+
 
}
 
}
legend {
+
 
  display: block;
+
h1, h2, h3, h4, h5, h6 {
  width: 100%;
+
width: 92%;
  padding: 0;
+
margin: auto;
  margin-bottom: 20px;
+
margin-top: 0px;
  font-size: 21px;
+
padding-top: 20px;
  line-height: inherit;
+
padding-bottom: 15px;
  color: #333333;
+
  border: 0;
+
  border-bottom: 1px solid #e5e5e5;
+
 
}
 
}
label {
+
 
  display: inline-block;
+
.p {
  max-width: 100%;
+
text-align: justify;
  margin-bottom: 5px;
+
  font-weight: bold;
+
 
}
 
}
input[type="search"] {
+
 
  -webkit-box-sizing: border-box;
+
.title {
  -moz-box-sizing: border-box;
+
font-size: 40px;
  box-sizing: border-box;
+
padding-top: 5%;
 +
padding-left: 3%;
 +
padding-bottom: 40px;
 +
font-weight: bold;
 +
background-color: rgb(255,255,255);
 +
margin-top: -70px;
 +
position:sticky;
 +
line-height:1.5em;
 +
text-align:left;
 
}
 
}
input[type="radio"],
+
 
input[type="checkbox"] {
+
h2 {
  margin: 4px 0 0;
+
padding-left: 3%;
  margin-top: 1px \9;
+
font-size:14;
  line-height: normal;
+
 
}
 
}
input[type="file"] {
+
 
  display: block;
+
br {
 +
display: block; /* makes it have a width */
 +
content: ""; /* clears default height */
 +
margin-top: 20px; /* change this to whatever height you want it */
 
}
 
}
input[type="range"] {
+
 
  display: block;
+
p {
  width: 100%;
+
font-size:14px;
 
}
 
}
select[multiple],
+
 
select[size] {
+
body { padding-top: 0px; }
  height: auto;
+
 
 +
 
 +
 
 +
 
 +
article{
 +
padding-right: 5%;
 +
padding-left : 5%;
 
}
 
}
input[type="file"]:focus,
+
 
input[type="radio"]:focus,
+
#page-arrow-top {
input[type="checkbox"]:focus {
+
display: none;
  outline: 5px auto -webkit-focus-ring-color;
+
cursor: pointer;
  outline-offset: -2px;
+
padding: 0;
 +
margin: 0;
 +
position: fixed;
 +
bottom: 20px;
 +
right: 50px;
 
}
 
}
output {
+
 
  display: block;
+
.half {
  padding-top: 7px;
+
width: 48%;
  font-size: 14px;
+
  line-height: 1.42857143;
+
  color: #555555;
+
 
}
 
}
.form-control {
+
 
  display: block;
+
.half.left {
  width: 100%;
+
float: left;
  height: 34px;
+
margin-right: 1%;
  padding: 6px 12px;
+
  font-size: 14px;
+
  line-height: 1.42857143;
+
  color: #555555;
+
  background-color: #ffffff;
+
  background-image: none;
+
  border: 1px solid #cccccc;
+
  border-radius: 4px;
+
  -webkit-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-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
+
  -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+
 
}
 
}
.form-control:focus {
+
 
  border-color: #66afe9;
+
.half.right {
  outline: 0;
+
float: right;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
+
margin-left: 1%;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
+
 
}
 
}
.form-control::-moz-placeholder {
+
 
  color: #999999;
+
.sidenavi{
  opacity: 1;
+
 
 +
margin-top: 50px;
 +
margin-left: 4%;
 +
display: block;
 +
position: -webkit-sticky;
 +
position: sticky;
 +
top: 150px;
 +
float: left;
 +
background-color: #001633;
 +
border-radius: 30px;
 +
border-color: white;
 +
border-style: solid;
 
}
 
}
.form-control:-ms-input-placeholder {
+
 
  color: #999999;
+
 
 +
.side_list{
 +
display: block;
 +
margin-right: 10px;
 +
margin-bottom: 15px;
 +
margin-top: 10px;
 +
margin-left: 10px;
 +
color: white;
 
}
 
}
.form-control::-webkit-input-placeholder {
+
 
  color: #999999;
+
.side_link{
 +
color: white;
 +
font-size: 20px;
 +
text-decoration:none;
 +
padding: 10px;
 
}
 
}
.form-control::-ms-expand {
+
 
  border: 0;
+
.side_list > a:hover{
  background-color: transparent;
+
text-decoration:none;
 +
color: white;
 
}
 
}
.form-control[disabled],
+
 
.form-control[readonly],
+
.side_list > a{
fieldset[disabled] .form-control {
+
text-decoration:none;
  background-color: #eeeeee;
+
font-size: 18px;
  opacity: 1;
+
padding: 10px;
 +
width:100%;
 +
cursor: pointer;
 +
color: white;
 +
}
 +
 
 +
 
 +
@media only screen and (max-width: 1150px){
 +
.sidenavi{
 +
 
 +
margin-top: 50px;
 +
margin-left: 1%;
 +
display: block;
 +
position: -webkit-sticky;
 +
position: sticky;
 +
top: 150px;
 +
float: left;
 +
background-color: #001633;
 +
border-radius: 30px;
 +
border-color: white;
 +
border-style: solid;
 
}
 
}
.form-control[disabled],
+
 
fieldset[disabled] .form-control {
+
.side_list{
  cursor: not-allowed;
+
display: block;
 +
margin-right: 10px;
 +
margin-bottom: 15px;
 +
margin-top: 10px;
 +
margin-left: 10px;
 +
color: white;
 
}
 
}
textarea.form-control {
+
 
  height: auto;
+
.side_link{
 +
color: white;
 +
font-size: 10px;
 +
text-decoration:none;
 +
padding: 10px;
 
}
 
}
input[type="search"] {
+
 
  -webkit-appearance: none;
+
.side_list > a:hover{
 +
text-decoration:none;
 +
color: white;
 
}
 
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
+
 
  input[type="date"].form-control,
+
.side_list > a{
  input[type="time"].form-control,
+
text-decoration:none;
  input[type="datetime-local"].form-control,
+
font-size: 16px;
  input[type="month"].form-control {
+
padding: 12px;
    line-height: 34px;
+
width:100%;
  }
+
cursor: pointer;
  input[type="date"].input-sm,
+
color: white;
  input[type="time"].input-sm,
+
  input[type="datetime-local"].input-sm,
+
  input[type="month"].input-sm,
+
  .input-group-sm input[type="date"],
+
  .input-group-sm input[type="time"],
+
  .input-group-sm input[type="datetime-local"],
+
  .input-group-sm input[type="month"] {
+
    line-height: 30px;
+
  }
+
  input[type="date"].input-lg,
+
  input[type="time"].input-lg,
+
  input[type="datetime-local"].input-lg,
+
  input[type="month"].input-lg,
+
  .input-group-lg input[type="date"],
+
  .input-group-lg input[type="time"],
+
  .input-group-lg input[type="datetime-local"],
+
  .input-group-lg input[type="month"] {
+
    line-height: 46px;
+
  }
+
 
}
 
}
.form-group {
+
 
  margin-bottom: 15px;
+
 
}
 
}
.radio,
+
 
.checkbox {
+
 
  position: relative;
+
@media only screen and (max-width: 1685px){
  display: block;
+
.sidenavi{
  margin-top: 10px;
+
 
  margin-bottom: 10px;
+
margin-top: 50px;
 +
margin-left: 1%;
 +
display: block;
 +
position: -webkit-sticky;
 +
position: sticky;
 +
top: 150px;
 +
float: left;
 +
background-color: #001633;
 +
border-radius: 30px;
 +
border-color: white;
 +
border-style: solid;
 
}
 
}
.radio label,
+
 
.checkbox label {
+
.side_list{
  min-height: 20px;
+
display: block;
  padding-left: 20px;
+
margin-right: 10px;
  margin-bottom: 0;
+
margin-bottom: 15px;
  font-weight: normal;
+
margin-top: 10px;
  cursor: pointer;
+
margin-left: 10px;
 +
color: white;
 
}
 
}
.radio input[type="radio"],
+
 
.radio-inline input[type="radio"],
+
.side_link{
.checkbox input[type="checkbox"],
+
color: white;
.checkbox-inline input[type="checkbox"] {
+
font-size: 10px;
  position: absolute;
+
text-decoration:none;
  margin-left: -20px;
+
padding: 10px;
  margin-top: 4px \9;
+
 
}
 
}
.radio + .radio,
+
 
.checkbox + .checkbox {
+
.side_list > a:hover{
  margin-top: -5px;
+
text-decoration:none;
 +
color: white;
 
}
 
}
.radio-inline,
+
 
.checkbox-inline {
+
.side_list > a{
  position: relative;
+
text-decoration:none;
  display: inline-block;
+
font-size: 16px;
  padding-left: 20px;
+
padding: 8px;  
  margin-bottom: 0;
+
width:100%;
  vertical-align: middle;
+
cursor: pointer;
  font-weight: normal;
+
color: white;
  cursor: pointer;
+
 
}
 
}
.radio-inline + .radio-inline,
+
 
.checkbox-inline + .checkbox-inline {
+
  margin-top: 0;
+
  margin-left: 10px;
+
 
}
 
}
input[type="radio"][disabled],
+
 
input[type="checkbox"][disabled],
+
 
input[type="radio"].disabled,
+
@media only screen and (max-width: 1300px){
input[type="checkbox"].disabled,
+
.sidenavi{
fieldset[disabled] input[type="radio"],
+
display: none;
fieldset[disabled] input[type="checkbox"] {
+
 
  cursor: not-allowed;
+
 
}
 
}
.radio-inline.disabled,
 
.checkbox-inline.disabled,
 
fieldset[disabled] .radio-inline,
 
fieldset[disabled] .checkbox-inline {
 
  cursor: not-allowed;
 
 
}
 
}
.radio.disabled label,
+
 
.checkbox.disabled label,
+
 
fieldset[disabled] .radio label,
+
figure {
fieldset[disabled] .checkbox label {
+
text-align: center;
  cursor: not-allowed;
+
margin-bottom: 30px;
 +
 
 
}
 
}
.form-control-static {
+
 
  padding-top: 7px;
+
figcaption{
  padding-bottom: 7px;
+
text-align: justify;
  margin-bottom: 0;
+
font-size: 13px;
  min-height: 34px;
+
margin-top:10px;
 
}
 
}
.form-control-static.input-lg,
+
 
.form-control-static.input-sm {
+
.figure.eighty {
  padding-left: 0;
+
width:80%;
  padding-right: 0;
+
 
}
 
}
.input-sm {
+
 
  height: 30px;
+
.figure.ten {
  padding: 5px 10px;
+
width:10%;
  font-size: 12px;
+
  line-height: 1.5;
+
  border-radius: 3px;
+
 
}
 
}
select.input-sm {
+
 
  height: 30px;
+
.figure.twenty {
  line-height: 30px;
+
width:20%;
 
}
 
}
textarea.input-sm,
+
 
select[multiple].input-sm {
+
.figure.thirty {
  height: auto;
+
width:30%;
 
}
 
}
.form-group-sm .form-control {
+
 
  height: 30px;
+
.figure.fourty {
  padding: 5px 10px;
+
width:40%;
  font-size: 12px;
+
  line-height: 1.5;
+
  border-radius: 3px;
+
 
}
 
}
.form-group-sm select.form-control {
+
 
  height: 30px;
+
.figure.fifty {
  line-height: 30px;
+
width:50%;
 
}
 
}
.form-group-sm textarea.form-control,
+
 
.form-group-sm select[multiple].form-control {
+
.figure.sixty {
  height: auto;
+
width:60%;
 
}
 
}
.form-group-sm .form-control-static {
+
 
  height: 30px;
+
.figure.seventy {
  min-height: 32px;
+
width:70%;
  padding: 6px 10px;
+
  font-size: 12px;
+
  line-height: 1.5;
+
 
}
 
}
.input-lg {
+
 
  height: 46px;
+
.figure.ninety {
  padding: 10px 16px;
+
width:90%;
  font-size: 18px;
+
  line-height: 1.3333333;
+
  border-radius: 6px;
+
 
}
 
}
select.input-lg {
+
 
  height: 46px;
+
.figure.hundred {
  line-height: 46px;
+
width:100%;
 
}
 
}
textarea.input-lg,
+
 
select[multiple].input-lg {
+
 
  height: auto;
+
table, th, td {
 +
border: 1px solid black;
 +
border-collapse: collapse;
 +
font-size:17px;
 
}
 
}
.form-group-lg .form-control {
+
th, td {
  height: 46px;
+
padding: 15px;
  padding: 10px 16px;
+
text-align: left;
  font-size: 18px;
+
  line-height: 1.3333333;
+
  border-radius: 6px;
+
 
}
 
}
.form-group-lg select.form-control {
+
table#t01 tr:first-child td{
  height: 46px;
+
background-color: #eee;
  line-height: 46px;
+
 
}
 
}
.form-group-lg textarea.form-control,
+
 
.form-group-lg select[multiple].form-control {
+
table#t01 tr td:first-child {
  height: auto;
+
background-color: #eee;
 +
color: black;
 
}
 
}
.form-group-lg .form-control-static {
+
 
  height: 46px;
+
 
  min-height: 38px;
+
table.centern{
  padding: 11px 16px;
+
margin-left:15%;  
  font-size: 18px;
+
margin-right:15%;
  line-height: 1.3333333;
+
margin-top: 100px;
 +
margin-top: 5%;
 
}
 
}
.has-feedback {
+
 
  position: relative;
+
#HQ_page table {
 +
border: 1px solid #ccc;
 +
border-collapse: collapse;
 +
width: 70%;
 +
margin: auto;
 +
margin-bottom: 0px;
 +
margin-top: 100px;
 +
margin-right: auto;
 +
margin-left: auto;
 
}
 
}
.has-feedback .form-control {
+
 
  padding-right: 42.5px;
+
hr {
 +
margin-top: 10%;
 +
margin-bottom: 20px;
 +
border: 0;
 +
text-align: center;
 +
border-top: 2px solid #000000;
 +
margin-left: auto;
 +
margin-right: auto;
 +
 
 
}
 
}
.form-control-feedback {
+
 
  position: absolute;
+
.reftext {
  top: 0;
+
display: block;
  right: 0;
+
text-align: justify;
  z-index: 2;
+
margin-left: 5%;
  display: block;
+
margin-right: 5%;
  width: 34px;
+
font-size: 14px;
  height: 34px;
+
padding-bottom: 20px;
  line-height: 34px;
+
line-height: 20px;
  text-align: center;
+
  pointer-events: none;
+
 
}
 
}
.input-lg + .form-control-feedback,
+
 
.input-group-lg + .form-control-feedback,
+
/*Footer*/
.form-group-lg .form-control + .form-control-feedback {
+
.fa-facebook-official:before {
  width: 46px;
+
content: "\f230";
  height: 46px;
+
color: white;
  line-height: 46px;
+
 
}
 
}
.input-sm + .form-control-feedback,
+
 
.input-group-sm + .form-control-feedback,
+
 
.form-group-sm .form-control + .form-control-feedback {
+
.fa-instagram:before {
  width: 30px;
+
content: "\f230";
  height: 30px;
+
color: white;
  line-height: 30px;
+
 
}
 
}
.has-success .help-block,
+
 
.has-success .control-label,
+
.fa-twitter:before {
.has-success .radio,
+
content: "\f230";
.has-success .checkbox,
+
color: white;
.has-success .radio-inline,
+
.has-success .checkbox-inline,
+
.has-success.radio label,
+
.has-success.checkbox label,
+
.has-success.radio-inline label,
+
.has-success.checkbox-inline label {
+
  color: #3c763d;
+
 
}
 
}
.has-success .form-control {
+
 
  border-color: #3c763d;
+
#myDIV {
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+
margin-top: 10px;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+
display:none;
 
}
 
}
.has-success .form-control:focus {
+
 
  border-color: #2b542c;
+
.refbtn{
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
+
background-color: white;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
+
border: none;
 +
font-size: 150%;
 +
font-weight: bold;
 +
color: black;
 +
margin-left: 5%;
 +
margin-bottom: 26px;
 +
margin-top: 30px;
 +
 
 
}
 
}
.has-success .input-group-addon {
+
 
  color: #3c763d;
+
a.shifted-anchor {
  border-color: #3c763d;
+
display: block;
  background-color: #dff0d8;
+
position:relative;
 +
top: -100px;
 
}
 
}
.has-success .form-control-feedback {
+
 
  color: #3c763d;
+
:active{
 +
text-decoration: none;
 
}
 
}
.has-warning .help-block,
+
 
.has-warning .control-label,
+
html,body {
.has-warning .radio,
+
background-color: #001633; }
.has-warning .checkbox,
+
 
.has-warning .radio-inline,
+
 
.has-warning .checkbox-inline,
+
#myVideo {
.has-warning.radio label,
+
position: static;
.has-warning.checkbox label,
+
top:0;
.has-warning.radio-inline label,
+
left:0
.has-warning.checkbox-inline label {
+
right: 0;
  color: #8a6d3b;
+
bottom: 0;
 +
height: auto;
 +
margin-top: 70px;
 +
z-index:1;
 
}
 
}
.has-warning .form-control {
+
 
  border-color: #8a6d3b;
+
 
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+
.title_picture{
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+
width:100%;
 +
padding-top:40px;
 
}
 
}
.has-warning .form-control:focus {
+
 
  border-color: #66512c;
+
 
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
+
@-webkit-keyframes animateBubble {
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
+
0% {
 +
margin-top: 310%;
 
}
 
}
.has-warning .input-group-addon {
+
100% {
  color: #8a6d3b;
+
margin-top: 5%;
  border-color: #8a6d3b;
+
  background-color: #fcf8e3;
+
 
}
 
}
.has-warning .form-control-feedback {
 
  color: #8a6d3b;
 
 
}
 
}
.has-error .help-block,
+
 
.has-error .control-label,
+
@-moz-keyframes animateBubble {
.has-error .radio,
+
0% {
.has-error .checkbox,
+
margin-top: 310%;
.has-error .radio-inline,
+
.has-error .checkbox-inline,
+
.has-error.radio label,
+
.has-error.checkbox label,
+
.has-error.radio-inline label,
+
.has-error.checkbox-inline label {
+
  color: #a94442;
+
 
}
 
}
.has-error .form-control {
+
100% {
  border-color: #a94442;
+
margin-top: 5%;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+
 
}
 
}
.has-error .form-control:focus {
 
  border-color: #843534;
 
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
 
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
 
 
}
 
}
.has-error .input-group-addon {
+
 
  color: #a94442;
+
@keyframes animateBubble {
  border-color: #a94442;
+
0% {
  background-color: #f2dede;
+
margin-top: 310%;
 
}
 
}
.has-error .form-control-feedback {
+
100% {
  color: #a94442;
+
margin-top: 5%;
 
}
 
}
.has-feedback label ~ .form-control-feedback {
 
  top: 25px;
 
 
}
 
}
.has-feedback label.sr-only ~ .form-control-feedback {
+
 
  top: 0;
+
 
 +
 
 +
@-webkit-keyframes animateBubbleSeite {
 +
0% {
 +
margin-top: 40px;
 
}
 
}
.help-block {
+
100% {
  display: block;
+
margin-top: -200%;
  margin-top: 5px;
+
  margin-bottom: 10px;
+
  color: #737373;
+
 
}
 
}
@media (min-width: 768px) {
 
  .form-inline .form-group {
 
    display: inline-block;
 
    margin-bottom: 0;
 
    vertical-align: middle;
 
  }
 
  .form-inline .form-control {
 
    display: inline-block;
 
    width: auto;
 
    vertical-align: middle;
 
  }
 
  .form-inline .form-control-static {
 
    display: inline-block;
 
  }
 
  .form-inline .input-group {
 
    display: inline-table;
 
    vertical-align: middle;
 
  }
 
  .form-inline .input-group .input-group-addon,
 
  .form-inline .input-group .input-group-btn,
 
  .form-inline .input-group .form-control {
 
    width: auto;
 
  }
 
  .form-inline .input-group > .form-control {
 
    width: 100%;
 
  }
 
  .form-inline .control-label {
 
    margin-bottom: 0;
 
    vertical-align: middle;
 
  }
 
  .form-inline .radio,
 
  .form-inline .checkbox {
 
    display: inline-block;
 
    margin-top: 0;
 
    margin-bottom: 0;
 
    vertical-align: middle;
 
  }
 
  .form-inline .radio label,
 
  .form-inline .checkbox label {
 
    padding-left: 0;
 
  }
 
  .form-inline .radio input[type="radio"],
 
  .form-inline .checkbox input[type="checkbox"] {
 
    position: relative;
 
    margin-left: 0;
 
  }
 
  .form-inline .has-feedback .form-control-feedback {
 
    top: 0;
 
  }
 
 
}
 
}
.form-horizontal .radio,
+
 
.form-horizontal .checkbox,
+
@-moz-keyframes animateBubbleSeite {
.form-horizontal .radio-inline,
+
0% {
.form-horizontal .checkbox-inline {
+
margin-top: 40px;
  margin-top: 0;
+
  margin-bottom: 0;
+
  padding-top: 7px;
+
 
}
 
}
.form-horizontal .radio,
+
100% {
.form-horizontal .checkbox {
+
margin-top: -200%;
  min-height: 27px;
+
 
}
 
}
.form-horizontal .form-group {
 
  margin-left: -15px;
 
  margin-right: -15px;
 
 
}
 
}
@media (min-width: 768px) {
+
 
  .form-horizontal .control-label {
+
@keyframes animateBubbleSeite {
    text-align: right;
+
0% {
    margin-bottom: 0;
+
margin-top: 40px;
    padding-top: 7px;
+
  }
+
 
}
 
}
.form-horizontal .has-feedback .form-control-feedback {
+
100% {
  right: 15px;
+
margin-top: -200%;
 
}
 
}
@media (min-width: 768px) {
 
  .form-horizontal .form-group-lg .control-label {
 
    padding-top: 11px;
 
    font-size: 18px;
 
  }
 
 
}
 
}
@media (min-width: 768px) {
+
 
  .form-horizontal .form-group-sm .control-label {
+
 
    padding-top: 6px;
+
@-webkit-keyframes sideWays {  
    font-size: 12px;
+
0% {  
  }
+
margin-left:0px;
 
}
 
}
.btn {
+
100% {  
  display: inline-block;
+
margin-left:50px;
  margin-bottom: 0;
+
  font-weight: normal;
+
  text-align: center;
+
  vertical-align: middle;
+
  -ms-touch-action: manipulation;
+
      touch-action: manipulation;
+
  cursor: pointer;
+
  background-image: none;
+
  border: 1px solid transparent;
+
  white-space: nowrap;
+
  padding: 6px 12px;
+
  font-size: 14px;
+
  line-height: 1.42857143;
+
  border-radius: 4px;
+
  -webkit-user-select: none;
+
  -moz-user-select: none;
+
  -ms-user-select: none;
+
  user-select: none;
+
 
}
 
}
.btn:focus,
 
.btn:active:focus,
 
.btn.active:focus,
 
.btn.focus,
 
.btn:active.focus,
 
.btn.active.focus {
 
  outline: 5px auto -webkit-focus-ring-color;
 
  outline-offset: -2px;
 
 
}
 
}
.btn:hover,
+
 
.btn:focus,
+
@-moz-keyframes sideWays {
.btn.focus {
+
0% {  
  color: #333333;
+
margin-left:0px;
  text-decoration: none;
+
 
}
 
}
.btn:active,
+
100% {  
.btn.active {
+
margin-left:50px;
  outline: 0;
+
  background-image: none;
+
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+
 
}
 
}
.btn.disabled,
 
.btn[disabled],
 
fieldset[disabled] .btn {
 
  cursor: not-allowed;
 
  opacity: 0.65;
 
  filter: alpha(opacity=65);
 
  -webkit-box-shadow: none;
 
  box-shadow: none;
 
 
}
 
}
a.btn.disabled,
+
 
fieldset[disabled] a.btn {
+
@keyframes sideWays {  
  pointer-events: none;
+
0% {
 +
margin-left:0px;
 
}
 
}
.btn-default {
+
100% {  
  color: #333333;
+
margin-left:50px;
  background-color: #ffffff;
+
  border-color: #cccccc;
+
 
}
 
}
.btn-default:focus,
 
.btn-default.focus {
 
  color: #333333;
 
  background-color: #e6e6e6;
 
  border-color: #8c8c8c;
 
 
}
 
}
.btn-default:hover {
+
 
  color: #333333;
+
 
  background-color: #e6e6e6;
+
.s1 {
  border-color: #adadad;
+
-webkit-animation: animateBubbleSeite 120s linear infinite, sideWays 2s ease-in-out infinite alternate;
 +
-moz-animation: animateBubbleSeite 120s linear infinite, sideWays 2s ease-in-out infinite alternate;
 +
animation: animateBubbleSeite 120s linear infinite, sideWays 2s ease-in-out infinite alternate;
 +
 
 +
left: 5%;
 +
top: 95%;
 +
z-index:1;
 +
overflow: hidden;
 +
 
 +
-webkit-transform: scale(0.1);
 +
-moz-transform: scale(0.1);
 +
transform: scale(0.1);
 
}
 
}
.btn-default:active,
+
 
.btn-default.active,
+
 
.open > .dropdown-toggle.btn-default {
+
 
  color: #333333;
+
.x1 {
  background-color: #e6e6e6;
+
-webkit-animation: animateBubble 100s linear infinite, sideWays 2s ease-in-out infinite alternate;
  border-color: #adadad;
+
-moz-animation: animateBubble 100s linear infinite, sideWays 2s ease-in-out infinite alternate;
 +
animation: animateBubble 100s linear infinite, sideWays 2s ease-in-out infinite alternate;
 +
 
 +
left: -5%;
 +
top: 20%;
 +
z-index:1;
 +
overflow: hidden;
 +
 
 +
-webkit-transform: scale(0.1);
 +
-moz-transform: scale(0.1);
 +
transform: scale(0.1);
 
}
 
}
.btn-default:active:hover,
+
 
.btn-default.active:hover,
+
.x2 {
.open > .dropdown-toggle.btn-default:hover,
+
-webkit-animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate;
.btn-default:active:focus,
+
-moz-animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate;
.btn-default.active:focus,
+
animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate;
.open > .dropdown-toggle.btn-default:focus,
+
 
.btn-default:active.focus,
+
left: 5%;
.btn-default.active.focus,
+
top: 20%;
.open > .dropdown-toggle.btn-default.focus {
+
z-index:1;
  color: #333333;
+
overflow: hidden;
  background-color: #d4d4d4;
+
-webkit-transform: scale(0.2);
  border-color: #8c8c8c;
+
-moz-transform: scale(0.2);
 +
transform: scale(0.2);
 
}
 
}
.btn-default:active,
+
 
.btn-default.active,
+
.x3 {
.open > .dropdown-toggle.btn-default {
+
-webkit-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate;
  background-image: none;
+
-moz-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate;
 +
animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate;
 +
 
 +
left: 10%;
 +
top: 20%;
 +
overflow: hidden;
 +
z-index:1;
 +
-webkit-transform: scale(0.2);
 +
-moz-transform: scale(0.2);
 +
transform: scale(0.2);
 
}
 
}
.btn-default.disabled:hover,
+
 
.btn-default[disabled]:hover,
+
.x4 {
fieldset[disabled] .btn-default:hover,
+
-webkit-animation: animateBubble 90s linear infinite, sideWays 3s ease-in-out infinite alternate;
.btn-default.disabled:focus,
+
-moz-animation: animateBubble 90s linear infinite, sideWays 3s ease-in-out infinite alternate;
.btn-default[disabled]:focus,
+
animation: animateBubble 90s linear infinite, sideWays 3s ease-in-out infinite alternate;
fieldset[disabled] .btn-default:focus,
+
 
.btn-default.disabled.focus,
+
left: 20%;
.btn-default[disabled].focus,
+
top: 20%;
fieldset[disabled] .btn-default.focus {
+
overflow: hidden;
  background-color: #ffffff;
+
z-index:1;
  border-color: #cccccc;
+
-webkit-transform: scale(0.2);
 +
-moz-transform: scale(0.2);
 +
transform: scale(0.2);
 
}
 
}
.btn-default .badge {
+
 
  color: #ffffff;
+
.x5 {
  background-color: #333333;
+
-webkit-animation: animateBubble 70s linear infinite, sideWays 4s ease-in-out infinite alternate;
 +
-moz-animation: animateBubble 70s linear infinite, sideWays 4s ease-in-out infinite alternate;
 +
animation: animateBubble 70s linear infinite, sideWays 4s ease-in-out infinite alternate;
 +
 
 +
left: 30%;
 +
top: 20%;
 +
overflow: hidden;
 +
z-index:1;
 +
-webkit-transform: scale(0.1);
 +
-moz-transform: scale(0.1);
 +
transform: scale(0.1);
 
}
 
}
.btn-primary {
+
 
  color: #ffffff;
+
.x6 {
  background-color: #337ab7;
+
-webkit-animation: animateBubble 115s linear infinite, sideWays 2s ease-in-out infinite alternate;
  border-color: #2e6da4;
+
-moz-animation: animateBubble 115s linear infinite, sideWays 2s ease-in-out infinite alternate;
 +
animation: animateBubble 115s linear infinite, sideWays 2s ease-in-out infinite alternate;
 +
 
 +
left: 50%;
 +
top: 20%;
 +
overflow: hidden;
 +
z-index:1;
 +
-webkit-transform: scale(0.1);
 +
-moz-transform: scale(0.1);
 +
transform: scale(0.1);
 
}
 
}
.btn-primary:focus,
+
 
.btn-primary.focus {
+
.x7 {
  color: #ffffff;
+
-webkit-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate;
  background-color: #286090;
+
-moz-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate;
  border-color: #122b40;
+
animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate;
 +
 
 +
left: 65%;
 +
top: 20%;
 +
overflow: hidden;
 +
z-index:1;
 +
-webkit-transform: scale(0.1);
 +
-moz-transform: scale(0.1);
 +
transform: scale(0.1);
 
}
 
}
.btn-primary:hover {
+
 
  color: #ffffff;
+
.x8 {
  background-color: #286090;
+
-webkit-animation: animateBubble 100s linear infinite, sideWays 3s ease-in-out infinite alternate;
  border-color: #204d74;
+
-moz-animation: animateBubble 100s linear infinite, sideWays 3s ease-in-out infinite alternate;
 +
animation: animateBubble 100s linear infinite, sideWays 3s ease-in-out infinite alternate;
 +
 
 +
left: 80%;
 +
top: 20%;
 +
overflow: hidden;
 +
z-index:1;
 +
-webkit-transform: scale(0.2);
 +
-moz-transform: scale(0.2);
 +
transform: scale(0.2);
 
}
 
}
.btn-primary:active,
+
 
.btn-primary.active,
+
.x9 {
.open > .dropdown-toggle.btn-primary {
+
-webkit-animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate;
  color: #ffffff;
+
-moz-animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate;
  background-color: #286090;
+
animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate;
  border-color: #204d74;
+
 
 +
left: 90%;
 +
top: 20%;
 +
overflow: hidden;
 +
z-index:1;
 +
-webkit-transform: scale(0.1);
 +
-moz-transform: scale(0.1);
 +
transform: scale(0.1);
 
}
 
}
.btn-primary:active:hover,
+
 
.btn-primary.active:hover,
+
.x10 {
.open > .dropdown-toggle.btn-primary:hover,
+
-webkit-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate;
.btn-primary:active:focus,
+
-moz-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate;
.btn-primary.active:focus,
+
animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate;
.open > .dropdown-toggle.btn-primary:focus,
+
 
.btn-primary:active.focus,
+
left: 80%;
.btn-primary.active.focus,
+
top: 20%;
.open > .dropdown-toggle.btn-primary.focus {
+
overflow: hidden;
  color: #ffffff;
+
z-index:1;
  background-color: #204d74;
+
-webkit-transform: scale(0.1);
  border-color: #122b40;
+
-moz-transform: scale(0.1);
 +
transform: scale(0.1);
 
}
 
}
.btn-primary:active,
+
 
.btn-primary.active,
+
 
.open > .dropdown-toggle.btn-primary {
+
.bubble {
  background-image: none;
+
-webkit-border-radius: 50%;
 +
-moz-border-radius: 50%;
 +
border-radius: 50%;
 +
 
 +
-webkit-box-shadow: 0 20px 30px rgba(0, 0, 0, 0.2), inset 0px 10px 30px 5px rgba(255, 255, 255, 1);
 +
-moz-box-shadow: 0 20px 30px rgba(0, 0, 0, 0.2), inset 0px 10px 30px 5px rgba(255, 255, 255, 1);
 +
box-shadow: 0 20px 30px rgba(0, 0, 0, 0.2), inset 0px 10px 30px 5px rgba(255, 255, 255, 1);
 +
 
 +
height: 200px;
 +
position: absolute;
 +
width: 200px;
 
}
 
}
.btn-primary.disabled:hover,
+
 
.btn-primary[disabled]:hover,
+
.bubble:after {
fieldset[disabled] .btn-primary:hover,
+
background: -moz-radial-gradient(center, ellipse cover,  rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 0%); /* FF3.6+ */
.btn-primary.disabled:focus,
+
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(255,255,255,0.5)), color-stop(0%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
.btn-primary[disabled]:focus,
+
background: -webkit-radial-gradient(center, ellipse cover,  rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 0%); /* Chrome10+,Safari5.1+ */
fieldset[disabled] .btn-primary:focus,
+
background: -o-radial-gradient(center, ellipse cover,  rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 0%); /* Opera 12+ */
.btn-primary.disabled.focus,
+
background: -ms-radial-gradient(center, ellipse cover,  rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 0%); /* IE10+ */
.btn-primary[disabled].focus,
+
background: radial-gradient(ellipse at center,  rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 0%); /* W3C */
fieldset[disabled] .btn-primary.focus {
+
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
  background-color: #337ab7;
+
 
  border-color: #2e6da4;
+
-webkit-border-radius: 50%;
 +
-moz-border-radius: 50%;
 +
border-radius: 50%;
 +
 
 +
-webkit-box-shadow: inset 0 20px 30px rgba(255, 255, 255, 0.3);
 +
-moz-box-shadow: inset 0 20px 30px rgba(255, 255, 255, 0.3);
 +
box-shadow: inset 0 20px 30px rgba(255, 255, 255, 0.3);
 +
 
 +
content: "";
 +
height: 180px;
 +
left: 10px;
 +
position: absolute;
 +
width: 180px;
 
}
 
}
.btn-primary .badge {
+
 
  color: #337ab7;
+
@media only screen and (max-width: 1700px) {
  background-color: #ffffff;
+
 
 +
.bubble.x1, .bubble.x2, .bubble.x8, .bubble.x9, .bubble.x10{
 +
display:none;
 
}
 
}
.btn-success {
+
 
  color: #ffffff;
+
 
  background-color: #5cb85c;
+
 
  border-color: #4cae4c;
+
 
}
 
}
.btn-success:focus,
+
 
.btn-success.focus {
+
 
  color: #ffffff;
+
@media only screen and (max-width: 1200px) {
  background-color: #449d44;
+
 
  border-color: #255625;
+
.bubble.x1, .bubble.x2, .bubble.x7, .bubble.x8, .bubble.x9, .bubble.x10{
 +
display:none;
 
}
 
}
.btn-success:hover {
 
  color: #ffffff;
 
  background-color: #449d44;
 
  border-color: #398439;
 
 
}
 
}
.btn-success:active,
+
 
.btn-success.active,
+
 
.open > .dropdown-toggle.btn-success {
+
.timer_box{
  color: #ffffff;
+
    border: white;
  background-color: #449d44;
+
    border-style: solid;
  border-color: #398439;
+
    padding-bottom: 125px;
 +
    padding-left: 10px;
 +
    padding_top:10px;
 +
    marging-bottom: 100px;
 
}
 
}
.btn-success:active:hover,
+
 
.btn-success.active:hover,
+
#gold {
.open > .dropdown-toggle.btn-success:hover,
+
  float: left;
.btn-success:active:focus,
+
  font-size: 50px;
.btn-success.active:focus,
+
  margin-top: 10px;
.open > .dropdown-toggle.btn-success:focus,
+
  width: 50%;
.btn-success:active.focus,
+
   color:white;
.btn-success.active.focus,
+
text-align: center;
.open > .dropdown-toggle.btn-success.focus {
+
    
   color: #ffffff;
+
  background-color: #398439;
+
   border-color: #255625;
+
 
}
 
}
.btn-success:active,
+
 
.btn-success.active,
+
#gold_text {
.open > .dropdown-toggle.btn-success {
+
  background-image: none;
+
}
+
.btn-success.disabled:hover,
+
.btn-success[disabled]:hover,
+
fieldset[disabled] .btn-success:hover,
+
.btn-success.disabled:focus,
+
.btn-success[disabled]:focus,
+
fieldset[disabled] .btn-success:focus,
+
.btn-success.disabled.focus,
+
.btn-success[disabled].focus,
+
fieldset[disabled] .btn-success.focus {
+
  background-color: #5cb85c;
+
  border-color: #4cae4c;
+
}
+
.btn-success .badge {
+
  color: #5cb85c;
+
  background-color: #ffffff;
+
}
+
.btn-info {
+
  color: #ffffff;
+
  background-color: #5bc0de;
+
  border-color: #46b8da;
+
}
+
.btn-info:focus,
+
.btn-info.focus {
+
  color: #ffffff;
+
  background-color: #31b0d5;
+
  border-color: #1b6d85;
+
}
+
.btn-info:hover {
+
  color: #ffffff;
+
  background-color: #31b0d5;
+
  border-color: #269abc;
+
}
+
.btn-info:active,
+
.btn-info.active,
+
.open > .dropdown-toggle.btn-info {
+
  color: #ffffff;
+
  background-color: #31b0d5;
+
  border-color: #269abc;
+
}
+
.btn-info:active:hover,
+
.btn-info.active:hover,
+
.open > .dropdown-toggle.btn-info:hover,
+
.btn-info:active:focus,
+
.btn-info.active:focus,
+
.open > .dropdown-toggle.btn-info:focus,
+
.btn-info:active.focus,
+
.btn-info.active.focus,
+
.open > .dropdown-toggle.btn-info.focus {
+
  color: #ffffff;
+
  background-color: #269abc;
+
  border-color: #1b6d85;
+
}
+
.btn-info:active,
+
.btn-info.active,
+
.open > .dropdown-toggle.btn-info {
+
  background-image: none;
+
}
+
.btn-info.disabled:hover,
+
.btn-info[disabled]:hover,
+
fieldset[disabled] .btn-info:hover,
+
.btn-info.disabled:focus,
+
.btn-info[disabled]:focus,
+
fieldset[disabled] .btn-info:focus,
+
.btn-info.disabled.focus,
+
.btn-info[disabled].focus,
+
fieldset[disabled] .btn-info.focus {
+
  background-color: #5bc0de;
+
  border-color: #46b8da;
+
}
+
.btn-info .badge {
+
  color: #5bc0de;
+
  background-color: #ffffff;
+
}
+
.btn-warning {
+
  color: #ffffff;
+
  background-color: #f0ad4e;
+
  border-color: #eea236;
+
}
+
.btn-warning:focus,
+
.btn-warning.focus {
+
  color: #ffffff;
+
  background-color: #ec971f;
+
  border-color: #985f0d;
+
}
+
.btn-warning:hover {
+
  color: #ffffff;
+
  background-color: #ec971f;
+
  border-color: #d58512;
+
}
+
.btn-warning:active,
+
.btn-warning.active,
+
.open > .dropdown-toggle.btn-warning {
+
  color: #ffffff;
+
  background-color: #ec971f;
+
  border-color: #d58512;
+
}
+
.btn-warning:active:hover,
+
.btn-warning.active:hover,
+
.open > .dropdown-toggle.btn-warning:hover,
+
.btn-warning:active:focus,
+
.btn-warning.active:focus,
+
.open > .dropdown-toggle.btn-warning:focus,
+
.btn-warning:active.focus,
+
.btn-warning.active.focus,
+
.open > .dropdown-toggle.btn-warning.focus {
+
  color: #ffffff;
+
  background-color: #d58512;
+
  border-color: #985f0d;
+
}
+
.btn-warning:active,
+
.btn-warning.active,
+
.open > .dropdown-toggle.btn-warning {
+
  background-image: none;
+
}
+
.btn-warning.disabled:hover,
+
.btn-warning[disabled]:hover,
+
fieldset[disabled] .btn-warning:hover,
+
.btn-warning.disabled:focus,
+
.btn-warning[disabled]:focus,
+
fieldset[disabled] .btn-warning:focus,
+
.btn-warning.disabled.focus,
+
.btn-warning[disabled].focus,
+
fieldset[disabled] .btn-warning.focus {
+
  background-color: #f0ad4e;
+
  border-color: #eea236;
+
}
+
.btn-warning .badge {
+
  color: #f0ad4e;
+
  background-color: #ffffff;
+
}
+
.btn-danger {
+
  color: #ffffff;
+
  background-color: #d9534f;
+
  border-color: #d43f3a;
+
}
+
.btn-danger:focus,
+
.btn-danger.focus {
+
  color: #ffffff;
+
  background-color: #c9302c;
+
  border-color: #761c19;
+
}
+
.btn-danger:hover {
+
  color: #ffffff;
+
  background-color: #c9302c;
+
  border-color: #ac2925;
+
}
+
.btn-danger:active,
+
.btn-danger.active,
+
.open > .dropdown-toggle.btn-danger {
+
  color: #ffffff;
+
  background-color: #c9302c;
+
  border-color: #ac2925;
+
}
+
.btn-danger:active:hover,
+
.btn-danger.active:hover,
+
.open > .dropdown-toggle.btn-danger:hover,
+
.btn-danger:active:focus,
+
.btn-danger.active:focus,
+
.open > .dropdown-toggle.btn-danger:focus,
+
.btn-danger:active.focus,
+
.btn-danger.active.focus,
+
.open > .dropdown-toggle.btn-danger.focus {
+
  color: #ffffff;
+
  background-color: #ac2925;
+
  border-color: #761c19;
+
}
+
.btn-danger:active,
+
.btn-danger.active,
+
.open > .dropdown-toggle.btn-danger {
+
  background-image: none;
+
}
+
.btn-danger.disabled:hover,
+
.btn-danger[disabled]:hover,
+
fieldset[disabled] .btn-danger:hover,
+
.btn-danger.disabled:focus,
+
.btn-danger[disabled]:focus,
+
fieldset[disabled] .btn-danger:focus,
+
.btn-danger.disabled.focus,
+
.btn-danger[disabled].focus,
+
fieldset[disabled] .btn-danger.focus {
+
  background-color: #d9534f;
+
  border-color: #d43f3a;
+
}
+
.btn-danger .badge {
+
  color: #d9534f;
+
  background-color: #ffffff;
+
}
+
.btn-link {
+
  color: #337ab7;
+
  font-weight: normal;
+
  border-radius: 0;
+
}
+
.btn-link,
+
.btn-link:active,
+
.btn-link.active,
+
.btn-link[disabled],
+
fieldset[disabled] .btn-link {
+
  background-color: transparent;
+
  -webkit-box-shadow: none;
+
  box-shadow: none;
+
}
+
.btn-link,
+
.btn-link:hover,
+
.btn-link:focus,
+
.btn-link:active {
+
  border-color: transparent;
+
}
+
.btn-link:hover,
+
.btn-link:focus {
+
  color: #23527c;
+
  text-decoration: underline;
+
  background-color: transparent;
+
}
+
.btn-link[disabled]:hover,
+
fieldset[disabled] .btn-link:hover,
+
.btn-link[disabled]:focus,
+
fieldset[disabled] .btn-link:focus {
+
  color: #777777;
+
  text-decoration: none;
+
}
+
.btn-lg {
+
  padding: 10px 16px;
+
  font-size: 18px;
+
  line-height: 1.3333333;
+
  border-radius: 6px;
+
}
+
.btn-sm {
+
  padding: 5px 10px;
+
  font-size: 12px;
+
  line-height: 1.5;
+
  border-radius: 3px;
+
}
+
.btn-xs {
+
  padding: 1px 5px;
+
  font-size: 12px;
+
  line-height: 1.5;
+
  border-radius: 3px;
+
}
+
.btn-block {
+
  display: block;
+
  width: 100%;
+
}
+
.btn-block + .btn-block {
+
  margin-top: 5px;
+
}
+
input[type="submit"].btn-block,
+
input[type="reset"].btn-block,
+
input[type="button"].btn-block {
+
  width: 100%;
+
}
+
.fade {
+
  opacity: 0;
+
  -webkit-transition: opacity 0.15s linear;
+
  -o-transition: opacity 0.15s linear;
+
  transition: opacity 0.15s linear;
+
}
+
.fade.in {
+
  opacity: 1;
+
}
+
.collapse {
+
  display: none;
+
}
+
.collapse.in {
+
  display: block;
+
}
+
tr.collapse.in {
+
  display: table-row;
+
}
+
tbody.collapse.in {
+
  display: table-row-group;
+
}
+
.collapsing {
+
  position: relative;
+
  height: 0;
+
  overflow: hidden;
+
  -webkit-transition-property: height, visibility;
+
  -o-transition-property: height, visibility;
+
    transition-property: height, visibility;
+
  -webkit-transition-duration: 0.35s;
+
  -o-transition-duration: 0.35s;
+
    transition-duration: 0.35s;
+
  -webkit-transition-timing-function: ease;
+
  -o-transition-timing-function: ease;
+
    transition-timing-function: ease;
+
}
+
.caret {
+
  display: inline-block;
+
  width: 0;
+
  height: 0;
+
  margin-left: 2px;
+
  vertical-align: middle;
+
  border-top: 4px dashed;
+
  border-top: 4px solid \9;
+
  border-right: 4px solid transparent;
+
  border-left: 4px solid transparent;
+
}
+
.dropup,
+
.dropdown {
+
  position: relative;
+
}
+
.dropdown-toggle:focus {
+
  outline: 0;
+
}
+
.dropdown-menu {
+
  position: absolute;
+
  top: 100%;
+
  left: 0;
+
  z-index: 1000;
+
  display: none;
+
 
   float: left;
 
   float: left;
   min-width: 160px;
+
   font-size: 20px;
  padding: 5px 0;
+
   margin-top: 0px;
   margin: 2px 0 0;
+
   width: 50%;
   list-style: none;
+
   color:white;
   font-size: 14px;
+
text-align: center;
  text-align: left;
+
  background-color: #ffffff;
+
  border: 1px solid #cccccc;
+
  border: 1px solid rgba(0, 0, 0, 0.15);
+
  border-radius: 4px;
+
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+
  -webkit-background-clip: padding-box;
+
          background-clip: padding-box;
+
 
}
 
}
.dropdown-menu.pull-right {
+
 
  right: 0;
+
#silver {
  left: auto;
+
}
+
.dropdown-menu .divider {
+
  height: 1px;
+
  margin: 9px 0;
+
  overflow: hidden;
+
  background-color: #e5e5e5;
+
}
+
.dropdown-menu > li > a {
+
  display: block;
+
  padding: 3px 20px;
+
  clear: both;
+
  font-weight: normal;
+
  line-height: 1.42857143;
+
  color: #333333;
+
  white-space: nowrap;
+
}
+
.dropdown-menu > li > a:hover,
+
.dropdown-menu > li > a:focus {
+
  text-decoration: none;
+
  color: #262626;
+
  background-color: #f5f5f5;
+
}
+
.dropdown-menu > .active > a,
+
.dropdown-menu > .active > a:hover,
+
.dropdown-menu > .active > a:focus {
+
  color: #ffffff;
+
  text-decoration: none;
+
  outline: 0;
+
  background-color: #337ab7;
+
}
+
.dropdown-menu > .disabled > a,
+
.dropdown-menu > .disabled > a:hover,
+
.dropdown-menu > .disabled > a:focus {
+
  color: #777777;
+
}
+
.dropdown-menu > .disabled > a:hover,
+
.dropdown-menu > .disabled > a:focus {
+
  text-decoration: none;
+
  background-color: transparent;
+
  background-image: none;
+
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+
  cursor: not-allowed;
+
}
+
.open > .dropdown-menu {
+
  display: block;
+
}
+
.open > a {
+
  outline: 0;
+
}
+
.dropdown-menu-right {
+
  left: auto;
+
  right: 0;
+
}
+
.dropdown-menu-left {
+
  left: 0;
+
  right: auto;
+
}
+
.dropdown-header {
+
  display: block;
+
  padding: 3px 20px;
+
  font-size: 12px;
+
  line-height: 1.42857143;
+
  color: #777777;
+
  white-space: nowrap;
+
}
+
.dropdown-backdrop {
+
  position: fixed;
+
  left: 0;
+
  right: 0;
+
  bottom: 0;
+
  top: 0;
+
  z-index: 990;
+
}
+
.pull-right > .dropdown-menu {
+
  right: 0;
+
  left: auto;
+
}
+
.dropup .caret,
+
.navbar-fixed-bottom .dropdown .caret {
+
  border-top: 0;
+
  border-bottom: 4px dashed;
+
  border-bottom: 4px solid \9;
+
  content: "";
+
}
+
.dropup .dropdown-menu,
+
.navbar-fixed-bottom .dropdown .dropdown-menu {
+
  top: auto;
+
  bottom: 100%;
+
  margin-bottom: 2px;
+
}
+
@media (min-width: 768px) {
+
  .navbar-right .dropdown-menu {
+
    left: auto;
+
    right: 0;
+
  }
+
  .navbar-right .dropdown-menu-left {
+
    left: 0;
+
    right: auto;
+
  }
+
}
+
.nav {
+
  margin-bottom: 0;
+
  padding-left: 0;
+
  list-style: none;
+
}
+
.nav > li {
+
  position: relative;
+
  display: block;
+
}
+
.nav > li > a {
+
  position: relative;
+
  display: block;
+
  padding: 10px 15px;
+
}
+
.nav > li > a:hover,
+
.nav > li > a:focus {
+
  text-decoration: none;
+
  background-color: #eeeeee;
+
}
+
.nav > li.disabled > a {
+
  color: #777777;
+
}
+
.nav > li.disabled > a:hover,
+
.nav > li.disabled > a:focus {
+
  color: #777777;
+
  text-decoration: none;
+
  background-color: transparent;
+
  cursor: not-allowed;
+
}
+
.nav .open > a,
+
.nav .open > a:hover,
+
.nav .open > a:focus {
+
  background-color: #eeeeee;
+
  border-color: #337ab7;
+
}
+
.nav .nav-divider {
+
  height: 1px;
+
  margin: 9px 0;
+
  overflow: hidden;
+
  background-color: #e5e5e5;
+
}
+
.nav > li > a > img {
+
  max-width: none;
+
}
+
.nav-tabs {
+
  border-bottom: 1px solid #dddddd;
+
}
+
.nav-tabs > li {
+
 
   float: left;
 
   float: left;
  margin-bottom: -1px;
 
}
 
.nav-tabs > li > a {
 
  margin-right: 2px;
 
  line-height: 1.42857143;
 
  border: 1px solid transparent;
 
  border-radius: 4px 4px 0 0;
 
}
 
.nav-tabs > li > a:hover {
 
  border-color: #eeeeee #eeeeee #dddddd;
 
}
 
.nav-tabs > li.active > a,
 
.nav-tabs > li.active > a:hover,
 
.nav-tabs > li.active > a:focus {
 
  color: #555555;
 
  background-color: #ffffff;
 
  border: 1px solid #dddddd;
 
  border-bottom-color: transparent;
 
  cursor: default;
 
}
 
.nav-tabs.nav-justified {
 
  width: 100%;
 
  border-bottom: 0;
 
}
 
.nav-tabs.nav-justified > li {
 
  float: none;
 
}
 
.nav-tabs.nav-justified > li > a {
 
 
   text-align: center;
 
   text-align: center;
   margin-bottom: 5px;
+
  font-size: 50px;
 +
   margin-top: 10px;
 +
  width: 50%;
 +
  color:white;
 
}
 
}
.nav-tabs.nav-justified > .dropdown .dropdown-menu {
+
 
  top: auto;
+
#silver_text {
  left: auto;
+
}
+
@media (min-width: 768px) {
+
  .nav-tabs.nav-justified > li {
+
    display: table-cell;
+
    width: 1%;
+
  }
+
  .nav-tabs.nav-justified > li > a {
+
    margin-bottom: 0;
+
  }
+
}
+
.nav-tabs.nav-justified > li > a {
+
  margin-right: 0;
+
  border-radius: 4px;
+
}
+
.nav-tabs.nav-justified > .active > a,
+
.nav-tabs.nav-justified > .active > a:hover,
+
.nav-tabs.nav-justified > .active > a:focus {
+
  border: 1px solid #dddddd;
+
}
+
@media (min-width: 768px) {
+
  .nav-tabs.nav-justified > li > a {
+
    border-bottom: 1px solid #dddddd;
+
    border-radius: 4px 4px 0 0;
+
  }
+
  .nav-tabs.nav-justified > .active > a,
+
  .nav-tabs.nav-justified > .active > a:hover,
+
  .nav-tabs.nav-justified > .active > a:focus {
+
    border-bottom-color: #ffffff;
+
  }
+
}
+
.nav-pills > li {
+
 
   float: left;
 
   float: left;
}
 
.nav-pills > li > a {
 
  border-radius: 4px;
 
}
 
.nav-pills > li + li {
 
  margin-left: 2px;
 
}
 
.nav-pills > li.active > a,
 
.nav-pills > li.active > a:hover,
 
.nav-pills > li.active > a:focus {
 
  color: #ffffff;
 
  background-color: #337ab7;
 
}
 
.nav-stacked > li {
 
  float: none;
 
}
 
.nav-stacked > li + li {
 
  margin-top: 2px;
 
  margin-left: 0;
 
}
 
.nav-justified {
 
  width: 100%;
 
}
 
.nav-justified > li {
 
  float: none;
 
}
 
.nav-justified > li > a {
 
 
   text-align: center;
 
   text-align: center;
   margin-bottom: 5px;
+
  font-size: 20px;
 +
   margin-top: 0px;
 +
  width: 50%;
 +
  color:white;
 
}
 
}
.nav-justified > .dropdown .dropdown-menu {
+
 
  top: auto;
+
.img_text{
  left: auto;
+
text-align:center;
 +
position:absolute;
 
}
 
}
@media (min-width: 768px) {
+
 
  .nav-justified > li {
+
#home_imgs {
    display: table-cell;
+
     margin-top:100px;
    width: 1%;
+
     width:60%;
  }
+
  .nav-justified > li > a {
+
    margin-bottom: 0;
+
  }
+
}
+
.nav-tabs-justified {
+
  border-bottom: 0;
+
}
+
.nav-tabs-justified > li > a {
+
  margin-right: 0;
+
  border-radius: 4px;
+
}
+
.nav-tabs-justified > .active > a,
+
.nav-tabs-justified > .active > a:hover,
+
.nav-tabs-justified > .active > a:focus {
+
  border: 1px solid #dddddd;
+
}
+
@media (min-width: 768px) {
+
  .nav-tabs-justified > li > a {
+
     border-bottom: 1px solid #dddddd;
+
    border-radius: 4px 4px 0 0;
+
  }
+
  .nav-tabs-justified > .active > a,
+
  .nav-tabs-justified > .active > a:hover,
+
  .nav-tabs-justified > .active > a:focus {
+
    border-bottom-color: #ffffff;
+
  }
+
}
+
.tab-content > .tab-pane {
+
  display: none;
+
}
+
.tab-content > .active {
+
  display: block;
+
}
+
.nav-tabs .dropdown-menu {
+
  margin-top: -1px;
+
  border-top-right-radius: 0;
+
  border-top-left-radius: 0;
+
}
+
.navbar {
+
  position: relative;
+
  min-height: 50px;
+
  margin-bottom: 20px;
+
  border: 1px solid transparent;
+
}
+
@media (min-width: 768px) {
+
  .navbar {
+
     border-radius: 0px;
+
margin-bottom: 20px;
+
  }
+
}
+
@media (min-width: 768px) {
+
  .navbar-header {
+
    float: left;
+
  }
+
}
+
.navbar-collapse {
+
  overflow-x: visible;
+
  padding-right: 15px;
+
  padding-left: 15px;
+
  border-top: 1px solid transparent;
+
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
+
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
+
  -webkit-overflow-scrolling: touch;
+
}
+
.navbar-collapse.in {
+
  overflow-y: auto;
+
}
+
@media (min-width: 768px) {
+
  .navbar-collapse {
+
    width: auto;
+
    border-top: 0;
+
    -webkit-box-shadow: none;
+
            box-shadow: none;
+
  }
+
  .navbar-collapse.collapse {
+
    display: block !important;
+
    height: auto !important;
+
    padding-bottom: 0;
+
    overflow: visible !important;
+
  }
+
  .navbar-collapse.in {
+
    overflow-y: visible;
+
  }
+
  .navbar-fixed-top .navbar-collapse,
+
  .navbar-static-top .navbar-collapse,
+
  .navbar-fixed-bottom .navbar-collapse {
+
    padding-left: 0;
+
    padding-right: 0;
+
  }
+
}
+
.navbar-fixed-top .navbar-collapse,
+
.navbar-fixed-bottom .navbar-collapse {
+
  max-height: 340px;
+
}
+
@media (max-device-width: 480px) and (orientation: landscape) {
+
  .navbar-fixed-top .navbar-collapse,
+
  .navbar-fixed-bottom .navbar-collapse {
+
    max-height: 200px;
+
  }
+
}
+
.container > .navbar-header,
+
.container-fluid > .navbar-header,
+
.container > .navbar-collapse,
+
.container-fluid > .navbar-collapse {
+
  margin-right: -15px;
+
  margin-left: -15px;
+
}
+
@media (min-width: 768px) {
+
  .container > .navbar-header,
+
  .container-fluid > .navbar-header,
+
  .container > .navbar-collapse,
+
  .container-fluid > .navbar-collapse {
+
    margin-right: 0;
+
    margin-left: 0;
+
  }
+
}
+
.navbar-static-top {
+
 
+
  position: fixed;
+
    top: 0;
+
    right: 0;
+
    left: 0;
+
    z-index: 1030;
+
}
+
@media (min-width: 768px) {
+
  .navbar-static-top {
+
    border-radius: 0;
+
  }
+
}
+
.navbar-fixed-top,
+
.navbar-fixed-bottom {
+
  position: fixed;
+
  right: 0;
+
  left: 0;
+
  z-index: 1030;
+
}
+
@media (min-width: 768px) {
+
  .navbar-fixed-top,
+
  .navbar-fixed-bottom {
+
    border-radius: 0;
+
  }
+
}
+
.navbar-fixed-top {
+
  top: 0;
+
  border-width: 0 0 1px;
+
}
+
.navbar-fixed-bottom {
+
  bottom: 0;
+
  margin-bottom: 0;
+
  border-width: 1px 0 0;
+
}
+
.navbar-brand {
+
  float: left;
+
  padding: 15px 15px;
+
  font-size: 18px;
+
  line-height: 20px;
+
  height: 50px;
+
}
+
.navbar-brand:hover,
+
.navbar-brand:focus {
+
  text-decoration: none;
+
}
+
.navbar-brand > img {
+
  display: block;
+
}
+
@media (min-width: 768px) {
+
  .navbar > .container .navbar-brand,
+
  .navbar > .container-fluid .navbar-brand {
+
    margin-left: -15px;
+
  }
+
}
+
.navbar-toggle {
+
  position: relative;
+
  float: right;
+
  margin-right: 15px;
+
  padding: 9px 10px;
+
  margin-top: 8px;
+
  margin-bottom: 8px;
+
  background-color: transparent;
+
  background-image: none;
+
  border: 1px solid transparent;
+
  border-radius: 4px;
+
}
+
.navbar-toggle:focus {
+
  outline: 0;
+
}
+
.navbar-toggle .icon-bar {
+
  display: block;
+
  width: 22px;
+
  height: 2px;
+
  border-radius: 1px;
+
}
+
.navbar-toggle .icon-bar + .icon-bar {
+
  margin-top: 4px;
+
}
+
@media (min-width: 768px) {
+
  .navbar-toggle {
+
    display: none;
+
  }
+
}
+
.navbar-nav {
+
  margin: 7.5px -15px;
+
}
+
.navbar-nav > li > a {
+
  padding-top: 10px;
+
  padding-bottom: 10px;
+
  line-height: 20px;
+
}
+
@media (max-width: 767px) {
+
  .navbar-nav .open .dropdown-menu {
+
    position: static;
+
    float: none;
+
    width: auto;
+
    margin-top: 0;
+
    background-color: transparent;
+
    border: 0;
+
    -webkit-box-shadow: none;
+
            box-shadow: none;
+
  }
+
  .navbar-nav .open .dropdown-menu > li > a,
+
  .navbar-nav .open .dropdown-menu .dropdown-header {
+
    padding: 5px 15px 5px 25px;
+
  }
+
  .navbar-nav .open .dropdown-menu > li > a {
+
    line-height: 20px;
+
  }
+
  .navbar-nav .open .dropdown-menu > li > a:hover,
+
  .navbar-nav .open .dropdown-menu > li > a:focus {
+
    background-image: none;
+
  }
+
}
+
@media (min-width: 768px) {
+
  .navbar-nav {
+
    float: left;
+
    margin: 0;
+
  }
+
  .navbar-nav > li {
+
    float: left;
+
  }
+
  .navbar-nav > li > a {
+
    padding-top: 15px;
+
    padding-bottom: 15px;
+
  }
+
}
+
.navbar-form {
+
  margin-left: -15px;
+
  margin-right: -15px;
+
  padding: 10px 15px;
+
  border-top: 1px solid transparent;
+
  border-bottom: 1px solid transparent;
+
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
+
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
+
  margin-top: 8px;
+
  margin-bottom: 8px;
+
}
+
@media (min-width: 768px) {
+
  .navbar-form .form-group {
+
    display: inline-block;
+
    margin-bottom: 0;
+
    vertical-align: middle;
+
  }
+
  .navbar-form .form-control {
+
    display: inline-block;
+
    width: auto;
+
    vertical-align: middle;
+
  }
+
  .navbar-form .form-control-static {
+
    display: inline-block;
+
  }
+
  .navbar-form .input-group {
+
    display: inline-table;
+
    vertical-align: middle;
+
  }
+
  .navbar-form .input-group .input-group-addon,
+
  .navbar-form .input-group .input-group-btn,
+
  .navbar-form .input-group .form-control {
+
    width: auto;
+
  }
+
  .navbar-form .input-group > .form-control {
+
    width: 100%;
+
  }
+
  .navbar-form .control-label {
+
    margin-bottom: 0;
+
    vertical-align: middle;
+
  }
+
  .navbar-form .radio,
+
  .navbar-form .checkbox {
+
    display: inline-block;
+
    margin-top: 0;
+
    margin-bottom: 0;
+
    vertical-align: middle;
+
  }
+
  .navbar-form .radio label,
+
  .navbar-form .checkbox label {
+
    padding-left: 0;
+
  }
+
  .navbar-form .radio input[type="radio"],
+
  .navbar-form .checkbox input[type="checkbox"] {
+
    position: relative;
+
    margin-left: 0;
+
  }
+
  .navbar-form .has-feedback .form-control-feedback {
+
    top: 0;
+
  }
+
}
+
@media (max-width: 767px) {
+
  .navbar-form .form-group {
+
    margin-bottom: 5px;
+
  }
+
  .navbar-form .form-group:last-child {
+
    margin-bottom: 0;
+
  }
+
}
+
@media (min-width: 768px) {
+
  .navbar-form {
+
    width: auto;
+
    border: 0;
+
    margin-left: 0;
+
    margin-right: 0;
+
    padding-top: 0;
+
    padding-bottom: 0;
+
    -webkit-box-shadow: none;
+
    box-shadow: none;
+
  }
+
}
+
.navbar-nav > li > .dropdown-menu {
+
  margin-top: 0;
+
  border-top-right-radius: 0;
+
  border-top-left-radius: 0;
+
}
+
.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {
+
  margin-bottom: 0;
+
  border-top-right-radius: 4px;
+
  border-top-left-radius: 4px;
+
  border-bottom-right-radius: 0;
+
  border-bottom-left-radius: 0;
+
}
+
.navbar-btn {
+
  margin-top: 8px;
+
  margin-bottom: 8px;
+
}
+
.navbar-btn.btn-sm {
+
  margin-top: 10px;
+
  margin-bottom: 10px;
+
}
+
.navbar-btn.btn-xs {
+
  margin-top: 14px;
+
  margin-bottom: 14px;
+
}
+
.navbar-text {
+
  margin-top: 15px;
+
  margin-bottom: 15px;
+
}
+
@media (min-width: 768px) {
+
  .navbar-text {
+
    float: left;
+
    margin-left: 15px;
+
    margin-right: 15px;
+
  }
+
}
+
@media (min-width: 768px) {
+
  .navbar-left {
+
    float: left !important;
+
  }
+
  .navbar-right {
+
    float: right !important;
+
    margin-right: -15px;
+
  }
+
  .navbar-right ~ .navbar-right {
+
    margin-right: 0;
+
  }
+
}
+
.navbar-default {
+
  background-color: #f8f8f8;
+
  border-color: #e7e7e7;
+
}
+
.navbar-default .navbar-brand {
+
  color: #777777;
+
}
+
.navbar-default .navbar-brand:hover,
+
.navbar-default .navbar-brand:focus {
+
  color: #5e5e5e;
+
  background-color: transparent;
+
}
+
.navbar-default .navbar-text {
+
  color: #777777;
+
}
+
.navbar-default .navbar-nav > li > a {
+
  color: #777777;
+
}
+
.navbar-default .navbar-nav > li > a:hover,
+
.navbar-default .navbar-nav > li > a:focus {
+
  color: #333333;
+
  background-color: transparent;
+
}
+
.navbar-default .navbar-nav > .active > a,
+
.navbar-default .navbar-nav > .active > a:hover,
+
.navbar-default .navbar-nav > .active > a:focus {
+
  color: #555555;
+
  background-color: #e7e7e7;
+
}
+
.navbar-default .navbar-nav > .disabled > a,
+
.navbar-default .navbar-nav > .disabled > a:hover,
+
.navbar-default .navbar-nav > .disabled > a:focus {
+
  color: #cccccc;
+
  background-color: transparent;
+
}
+
.navbar-default .navbar-toggle {
+
  border-color: #dddddd;
+
}
+
.navbar-default .navbar-toggle:hover,
+
.navbar-default .navbar-toggle:focus {
+
  background-color: #dddddd;
+
}
+
.navbar-default .navbar-toggle .icon-bar {
+
  background-color: #888888;
+
}
+
.navbar-default .navbar-collapse,
+
.navbar-default .navbar-form {
+
  border-color: #e7e7e7;
+
}
+
.navbar-default .navbar-nav > .open > a,
+
.navbar-default .navbar-nav > .open > a:hover,
+
.navbar-default .navbar-nav > .open > a:focus {
+
  background-color: #e7e7e7;
+
  color: #555555;
+
}
+
@media (max-width: 767px) {
+
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
+
    color: #777777;
+
  }
+
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
+
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
+
    color: #333333;
+
    background-color: transparent;
+
  }
+
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
+
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
+
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
+
    color: #555555;
+
    background-color: #e7e7e7;
+
  }
+
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a,
+
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover,
+
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
+
    color: #cccccc;
+
    background-color: transparent;
+
  }
+
}
+
.navbar-default .navbar-link {
+
  color: #777777;
+
}
+
.navbar-default .navbar-link:hover {
+
  color: #333333;
+
}
+
.navbar-default .btn-link {
+
  color: #777777;
+
}
+
.navbar-default .btn-link:hover,
+
.navbar-default .btn-link:focus {
+
  color: #333333;
+
}
+
.navbar-default .btn-link[disabled]:hover,
+
fieldset[disabled] .navbar-default .btn-link:hover,
+
.navbar-default .btn-link[disabled]:focus,
+
fieldset[disabled] .navbar-default .btn-link:focus {
+
  color: #cccccc;
+
}
+
.navbar-inverse {
+
  background-color: #222222;
+
  border-color: #080808;
+
}
+
.navbar-inverse .navbar-brand {
+
  color: #9d9d9d;
+
}
+
.navbar-inverse .navbar-brand:hover,
+
.navbar-inverse .navbar-brand:focus {
+
  color: #ffffff;
+
  background-color: transparent;
+
}
+
.navbar-inverse .navbar-text {
+
  color: #9d9d9d;
+
}
+
.navbar-inverse .navbar-nav > li > a {
+
  color: #9d9d9d;
+
}
+
.navbar-inverse .navbar-nav > li > a:hover,
+
.navbar-inverse .navbar-nav > li > a:focus {
+
  color: #ffffff;
+
  background-color: transparent;
+
}
+
.navbar-inverse .navbar-nav > .active > a,
+
.navbar-inverse .navbar-nav > .active > a:hover,
+
.navbar-inverse .navbar-nav > .active > a:focus {
+
  color: #ffffff;
+
  background-color: #080808;
+
}
+
.navbar-inverse .navbar-nav > .disabled > a,
+
.navbar-inverse .navbar-nav > .disabled > a:hover,
+
.navbar-inverse .navbar-nav > .disabled > a:focus {
+
  color: #444444;
+
  background-color: transparent;
+
}
+
.navbar-inverse .navbar-toggle {
+
  border-color: #333333;
+
}
+
.navbar-inverse .navbar-toggle:hover,
+
.navbar-inverse .navbar-toggle:focus {
+
  background-color: #333333;
+
}
+
.navbar-inverse .navbar-toggle .icon-bar {
+
  background-color: #ffffff;
+
}
+
.navbar-inverse .navbar-collapse,
+
.navbar-inverse .navbar-form {
+
  border-color: #101010;
+
}
+
.navbar-inverse .navbar-nav > .open > a,
+
.navbar-inverse .navbar-nav > .open > a:hover,
+
.navbar-inverse .navbar-nav > .open > a:focus {
+
  background-color: #080808;
+
  color: #ffffff;
+
}
+
@media (max-width: 767px) {
+
  .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header {
+
    border-color: #080808;
+
  }
+
  .navbar-inverse .navbar-nav .open .dropdown-menu .divider {
+
    background-color: #080808;
+
  }
+
  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
+
    color: #9d9d9d;
+
  }
+
  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover,
+
  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
+
    color: #ffffff;
+
    background-color: transparent;
+
  }
+
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a,
+
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover,
+
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus {
+
    color: #ffffff;
+
    background-color: #080808;
+
  }
+
  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a,
+
  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover,
+
  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus {
+
    color: #444444;
+
    background-color: transparent;
+
  }
+
}
+
.navbar-inverse .navbar-link {
+
  color: #9d9d9d;
+
}
+
.navbar-inverse .navbar-link:hover {
+
  color: #ffffff;
+
}
+
.navbar-inverse .btn-link {
+
  color: #9d9d9d;
+
}
+
.navbar-inverse .btn-link:hover,
+
.navbar-inverse .btn-link:focus {
+
  color: #ffffff;
+
}
+
.navbar-inverse .btn-link[disabled]:hover,
+
fieldset[disabled] .navbar-inverse .btn-link:hover,
+
.navbar-inverse .btn-link[disabled]:focus,
+
fieldset[disabled] .navbar-inverse .btn-link:focus {
+
  color: #444444;
+
}
+
.clearfix:before,
+
.clearfix:after,
+
.container:before,
+
.container:after,
+
.container-fluid:before,
+
.container-fluid:after,
+
.row:before,
+
.row:after,
+
.form-horizontal .form-group:before,
+
.form-horizontal .form-group:after,
+
.nav:before,
+
.nav:after,
+
.navbar:before,
+
.navbar:after,
+
.navbar-header:before,
+
.navbar-header:after,
+
.navbar-collapse:before,
+
.navbar-collapse:after {
+
  content: " ";
+
  display: table;
+
}
+
.clearfix:after,
+
.container:after,
+
.container-fluid:after,
+
.row:after,
+
.form-horizontal .form-group:after,
+
.nav:after,
+
.navbar:after,
+
.navbar-header:after,
+
.navbar-collapse:after {
+
  clear: both;
+
}
+
.center-block {
+
  display: block;
+
  margin-left: auto;
+
  margin-right: auto;
+
}
+
.pull-right {
+
  float: right !important;
+
}
+
.pull-left {
+
  float: left !important;
+
}
+
.hide {
+
  display: none !important;
+
}
+
.show {
+
  display: block !important;
+
}
+
.invisible {
+
  visibility: hidden;
+
}
+
.text-hide {
+
  font: 0/0 a;
+
  color: transparent;
+
  text-shadow: none;
+
  background-color: transparent;
+
  border: 0;
+
}
+
.hidden {
+
  display: none !important;
+
}
+
.affix {
+
  position: fixed;
+
}
+
@-ms-viewport {
+
  width: device-width;
+
}
+
.visible-xs,
+
.visible-sm,
+
.visible-md,
+
.visible-lg {
+
  display: none !important;
+
}
+
.visible-xs-block,
+
.visible-xs-inline,
+
.visible-xs-inline-block,
+
.visible-sm-block,
+
.visible-sm-inline,
+
.visible-sm-inline-block,
+
.visible-md-block,
+
.visible-md-inline,
+
.visible-md-inline-block,
+
.visible-lg-block,
+
.visible-lg-inline,
+
.visible-lg-inline-block {
+
  display: none !important;
+
}
+
@media (max-width: 767px) {
+
  .visible-xs {
+
    display: block !important;
+
  }
+
  table.visible-xs {
+
    display: table !important;
+
  }
+
  tr.visible-xs {
+
    display: table-row !important;
+
  }
+
  th.visible-xs,
+
  td.visible-xs {
+
    display: table-cell !important;
+
  }
+
}
+
@media (max-width: 767px) {
+
  .visible-xs-block {
+
    display: block !important;
+
  }
+
}
+
@media (max-width: 767px) {
+
  .visible-xs-inline {
+
    display: inline !important;
+
  }
+
}
+
@media (max-width: 767px) {
+
  .visible-xs-inline-block {
+
    display: inline-block !important;
+
  }
+
}
+
@media (min-width: 768px) and (max-width: 991px) {
+
  .visible-sm {
+
    display: block !important;
+
  }
+
  table.visible-sm {
+
    display: table !important;
+
  }
+
  tr.visible-sm {
+
    display: table-row !important;
+
  }
+
  th.visible-sm,
+
  td.visible-sm {
+
    display: table-cell !important;
+
  }
+
}
+
@media (min-width: 768px) and (max-width: 991px) {
+
  .visible-sm-block {
+
    display: block !important;
+
  }
+
}
+
@media (min-width: 768px) and (max-width: 991px) {
+
  .visible-sm-inline {
+
    display: inline !important;
+
  }
+
}
+
@media (min-width: 768px) and (max-width: 991px) {
+
  .visible-sm-inline-block {
+
    display: inline-block !important;
+
  }
+
}
+
@media (min-width: 992px) and (max-width: 1199px) {
+
  .visible-md {
+
    display: block !important;
+
  }
+
  table.visible-md {
+
    display: table !important;
+
  }
+
  tr.visible-md {
+
    display: table-row !important;
+
  }
+
  th.visible-md,
+
  td.visible-md {
+
    display: table-cell !important;
+
  }
+
}
+
@media (min-width: 992px) and (max-width: 1199px) {
+
  .visible-md-block {
+
    display: block !important;
+
  }
+
}
+
@media (min-width: 992px) and (max-width: 1199px) {
+
  .visible-md-inline {
+
    display: inline !important;
+
  }
+
}
+
@media (min-width: 992px) and (max-width: 1199px) {
+
  .visible-md-inline-block {
+
    display: inline-block !important;
+
  }
+
}
+
@media (min-width: 1200px) {
+
  .visible-lg {
+
    display: block !important;
+
  }
+
  table.visible-lg {
+
    display: table !important;
+
  }
+
  tr.visible-lg {
+
    display: table-row !important;
+
  }
+
  th.visible-lg,
+
  td.visible-lg {
+
    display: table-cell !important;
+
  }
+
}
+
@media (min-width: 1200px) {
+
  .visible-lg-block {
+
    display: block !important;
+
  }
+
}
+
@media (min-width: 1200px) {
+
  .visible-lg-inline {
+
    display: inline !important;
+
  }
+
}
+
@media (min-width: 1200px) {
+
  .visible-lg-inline-block {
+
    display: inline-block !important;
+
  }
+
}
+
@media (max-width: 767px) {
+
  .hidden-xs {
+
    display: none !important;
+
  }
+
}
+
@media (min-width: 768px) and (max-width: 991px) {
+
  .hidden-sm {
+
    display: none !important;
+
  }
+
}
+
@media (min-width: 992px) and (max-width: 1199px) {
+
  .hidden-md {
+
    display: none !important;
+
  }
+
}
+
@media (min-width: 1200px) {
+
  .hidden-lg {
+
    display: none !important;
+
  }
+
}
+
.visible-print {
+
  display: none !important;
+
}
+
@media print {
+
  .visible-print {
+
    display: block !important;
+
  }
+
  table.visible-print {
+
    display: table !important;
+
  }
+
  tr.visible-print {
+
    display: table-row !important;
+
  }
+
  th.visible-print,
+
  td.visible-print {
+
    display: table-cell !important;
+
  }
+
}
+
.visible-print-block {
+
  display: none !important;
+
}
+
@media print {
+
  .visible-print-block {
+
    display: block !important;
+
  }
+
}
+
.visible-print-inline {
+
  display: none !important;
+
}
+
@media print {
+
  .visible-print-inline {
+
    display: inline !important;
+
  }
+
}
+
.visible-print-inline-block {
+
  display: none !important;
+
}
+
@media print {
+
  .visible-print-inline-block {
+
    display: inline-block !important;
+
  }
+
}
+
@media print {
+
  .hidden-print {
+
    display: none !important;
+
  }
+
 
}
 
}
  
  
 +
@media only screen and (max-width: 1300px) {
  
 +
#home_imgs{
 +
width:70%;
  
 +
}
  
 +
#silver{
 +
font-size: 30px;
  
 +
}
  
 +
#gold{
 +
font-size: 30px;
  
 +
}
  
/* W3 Schools templates*/
+
#silver_text{
+
font-size: 20px;
.w3-top,.w3-bottom{position:fixed;width:100%;z-index:1;}
+
.w3-top{top:0;}
+
.w3-bottom{bottom:0;}
+
+
#footer{display:block;}
+
+
.w3-container:after,.w3-container:before{content:"";display:table;clear:both;}
+
+
.w3-container{padding:0.01em 16px;}
+
+
.w3-padding-32{padding-top:32px!important;padding-bottom:32px!important;}
+
+
.w3-center .w3-bar{display:inline-block;width:auto;}
+
+
.w3-center{text-align:center!important;}
+
+
.w3-black,.w3-hover-black:hover{color:#fff!important;background-color:#000!important;}
+
+
.w3-xlarge{font-size:24px!important;}
+
+
  
 +
}
  
 
 
 
/*OWN STYLES*/
 
  
body {
+
#gold_text{
font-family: "Lato", sans-serif;
+
font-size: 20px;
 
}
 
}
  
.content {
 
 
background-color: white;
 
border: 1px solid #000000;
 
border-radius: 0px;
 
box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.35);
 
min-height: 100px;
 
border-top: none;
 
border-bottom: none;
 
 
}
 
}
  
.container{
 
max-width:60vw;
 
}
 
  
.section{
+
@media only screen and (max-width: 900px) {
margin: 1%;
+
 
 +
.timer_box{
 +
    border: white;
 +
    border-style: solid;
 +
    padding-bottom: 100px;
 +
    padding-left: 10px;
 +
    padding_top:10px;
 +
    marging-bottom: 100px;
 
}
 
}
+
 
.half{
+
#home_imgs{
max-width: 48%;
+
margin-top:50px;
 +
width:90%;
 
}
 
}
  
.half.left {
+
#silver{
float: left;
+
font-size: 20px;
margin-right: 1%;
+
 
 
}
 
}
  
.half.right {
+
#gold{
float: right;
+
font-size: 20px;
margin-left: 1%;
+
  
 
}
 
}
  
article, .article {
+
#silver_text{
text-align: justify;
+
font-size: 15px;
    display: block;
+
 
    margin: auto;
+
font-size: 16px;
+
padding-bottom: 20px;
+
 
}
 
}
  
article, .article, .contentline {
+
 
width: 96%;
+
#gold_text{
font-size: 16px;
+
font-size: 15px;
padding-bottom: 20px;
+
 
}
 
}
  
.contentline article, .contentline .article {
 
width: 100%;
 
 
}
 
}
  
h1, h2, h3, h4, h5, h6 {
+
 
     width: 92%;
+
@media only screen and (max-width: 600px) {
     margin: auto;
+
 
     margin-top: 0px;
+
.timer_box{
     padding-top: 20px;
+
     border: white;
     padding-bottom: 15px;
+
     border-style: solid;
 +
     padding-bottom: 100px;
 +
     padding-left: 10px;
 +
     padding_top:10px;
 +
    marging-bottom: 100px;
 
}
 
}
  
.p {
+
#home_imgs{
text-align: justify;
+
margin-top:15px;
 +
width:100%;
 
}
 
}
  
.title {
+
#silver{
font-size: 40px;
+
font-size: 15px;
padding-top: 10%;
+
 
padding-left: 7%;
+
padding-bottom: 30px;
+
 
}
 
}
  
h2 {
+
#gold{
padding-left: 3%;
+
font-size: 15px;
font-size:14;
+
 
 
}
 
}
  
br {
+
#silver_text{
display: block; /* makes it have a width */
+
font-size: 10px;
        content: ""; /* clears default height */
+
 
        margin-top: 0; /* change this to whatever height you want it */
+
 
}
 
}
  
body { padding-top: 55px; }
 
  
 +
#gold_text{
 +
font-size: 10px;
 +
}
  
.w3-top{
 
padding-bottom:50px;
 
 
}
 
}
  
/* NAVBAR */
 
.navbar{
 
background-color: #000000;
 
border-color: #000000;
 
font-size: 20px;
 
margin-bottom: 0px;
 
 
}
 
  
+
@media only screen and (max-width: 400px) {
.navbar.center .navbar-inner {
+
    text-align: center;
+
}
+
+
.navbar.center .navbar-inner .nav {
+
float: none;
+
display:inline-block;
+
vertical-align: middle;
+
}
+
+
.navbar-inner{
+
+
vertical-align:center;
+
max-height:40px;
+
}
+
+
/* Title */
+
.navbar .navbar-brand {
+
color: #777;
+
}
+
.navbar .navbar-brand:hover,
+
.navbar .navbar-brand:focus {
+
color: #5E5E5E;
+
}
+
/* Link */
+
.navbar .navbar-nav > li > a {
+
color: #ffffff;
+
background-color: #00000;
+
+
padding-top: 20px
+
+
}
+
.navbar .navbar-nav > li > a:hover,
+
.navbar .navbar-nav > li > a:focus {
+
background-color: #002a5c;
+
}
+
.navbar .navbar-nav > .active > a,
+
.navbar .navbar-nav > .active > a:hover,
+
.navbar .navbar-nav > .active > a:focus {
+
color: #ffffff;
+
background-color:  #002a5c;
+
}
+
.navbar .navbar-nav > .open > a,
+
.navbar .navbar-nav > .open > a:hover,
+
.navbar .navbar-nav > .open > a:focus {
+
color: #ffffff;
+
background-color: #002a5c;
+
}
+
+
/* Caret */
+
.navbar .navbar-nav > .dropdown > a .caret {
+
border-top-color: #ffffff;
+
border-bottom-color: #ffffff;
+
}
+
  
.navbar .navbar-nav > .open > a .caret,
+
.timer_box{
.navbar .navbar-nav > .open > a:hover .caret,
+
    border: white;
.navbar .navbar-nav > .open > a:focus .caret {
+
    border-style: solid;
border-top-color: #ffffff;
+
    padding-bottom: 50px;
border-bottom-color: #ffffff;
+
    padding-left: 10px;
}
+
    padding_top:10px;
+
    marging-bottom: 100px;
.navbar .navbar-nav .dropdown-toggle{
+
}
color: #ffffff;
+
background-color: #000000;
+
}
+
+
.navbar .navbar-nav .dropdown-menu {
+
color: #ffffff;
+
background-color: #000000;
+
}
+
+
.navbar .navbar-nav .dropdown-menu > li > a{
+
color: #ffffff;
+
background-color: #000000;
+
}
+
+
.navbar .navbar-nav .dropdown-menu > li > a:hover,
+
.navbar .navbar-nav .dropdown-menu > li > a:focus {
+
color: #ffffff;
+
background-color: #002a5c;
+
}
+
  
.navbar .navbar-toggle {
+
#home_imgs{
border-color: #DDD;
+
margin-top:5px;
}
+
width:100%;
.navbar .navbar-toggle:hover,
+
}
.navbar .navbar-toggle:focus {
+
background-color: #DDD;
+
}
+
.navbar .navbar-toggle .icon-bar {
+
background-color: #CCC;
+
}
+
+
.affix {
+
top: 0;
+
width: 100%;
+
z-index: 1030!important;
+
}
+
  
.affix + .container-fluid {
+
#silver{
padding-top: 70px;
+
font-size: 10px;
}
+
  
+
}
.logo-img{
+
width: 65px;
+
padding-top: 5px;
+
}
+
+
article{
+
padding-right: 5%;
+
padding-left : 5%;
+
}
+
+
#page-arrow-top {
+
display: none;
+
cursor: pointer;
+
padding: 0;
+
margin: 0;
+
position: fixed;
+
bottom: 100px;
+
right: 50px;
+
}
+
+
.half {
+
width: 48%;
+
}
+
  
.half.left {
+
#gold{
float: left;
+
font-size: 10px;
margin-right: 1%;
+
}
+
  
.half.right {
+
}
float: right;
+
 
margin-left: 1%;
+
#silver_text{
}
+
font-size: 5px;
+
.sidenavi{
+
  
margin-top: 50px;
 
margin-left: 100px;
 
display: block;
 
position: -webkit-sticky;
 
        position: sticky;
 
        top: 150px;
 
float: left;
 
}
 
 
.side_list{
 
display: block;
 
margin: 30px;
 
color: #002a5c;
 
}
 
 
.side_link{
 
color: #002a5c;
 
font-size: 20px;
 
text-decoration:none;
 
padding: 10px;
 
}
 
 
.side_list > a:hover{
 
text-decoration:none;
 
color: #002a5c;
 
}
 
 
.side_list > a{
 
text-decoration:none;
 
font-size: 20px;
 
padding: 10px;
 
width:100%;
 
cursor: pointer;
 
}
 
 
 
/*Footer*/
 
.fa-facebook-official:before {
 
    content: "\f230";
 
    color: white;
 
 
}
 
}
  
  
.fa-instagram:before {
+
#gold_text{
    content: "\f230";
+
font-size: 5px;
    color: white;
+
 
}
 
}
  
.fa-twitter:before {
 
    content: "\f230";
 
    color: white;
 
 
}
 
}
 
</style>
 
<html>
 

Latest revision as of 18:31, 17 October 2018

/* HQ CSS*/ .firstHeading { display: none; }

.mw-content-text { display: none; }

.logo_2018 { display: none; }

  1. globalWrapper {

padding: 0px; margin: 0px; padding-bottom: 0px; }

  1. content {

margin-left:0px; padding:0px; width:100%; margin-top: -7px; }


.mw-content-ltr ul, .mw-content-rtl .mw-content-ltr ul{ margin:0px; }

  1. top_title {

margin-bottom: 0px; }

  1. top_menu_14{

border-bottom: 0px solid black; }

  1. HQ_page p {

margin: 0; }

/*NAVBAR*/

@charset "UTF-8";

body{ margin-top:0px; }

.navigation { height: 70px; background: #002a5c; position: fixed; width:100%; text-decoration: none; }

.brand { position: absolute; padding-left: 20px; float: left; line-height: 70px; text-transform: uppercase; font-size: 1.4em; width: 300px; }

.logo-img{ width: 70%; margin-top: 1%; }

@media only screen and (max-width: 1350px) { .logo-img{ width: 70%; margin-top: 2%; }

.navigation{ position: absolute; }

}

@media only screen and (max-width: 790px) { .logo-img{ width: 70%; margin-top: 3%; }

.navigation{ position: absolute; }

}


.brand a, .brand a:visited { color: #ffffff; text-decoration: none; }

.nav-container { max-width: auto; margin: 0 auto; text-decoration: none; }

nav { float: right; text-decoration: none; } nav ul { list-style: none; margin: 0; padding: 0; text-decoration: none; } nav ul li { float: left; position: relative; text-decoration: none; } nav ul li a, nav ul li a:visited, nav ul li a:focus{ display: block; padding: 0 20px; line-height: 70px; background: #002a5c; color: #ffffff; text-decoration: none; margin-bottom:-4px; border-color:#002a5c; } nav ul li a:hover, nav ul li a:visited:hover { background: #4d9dff; color: #ffffff; text-decoration: none; } nav ul li a:not(:only-child):after, nav ul li a:visited:not(:only-child):after { padding-left: 4px; content: " ▾"; text-decoration: none; } nav ul li ul li { min-width: 190px; text-decoration: none; } nav ul li ul li a { padding: 15px; line-height: 20px; text-decoration: none; text-decoration: none; }

.nav-dropdown { position: absolute; display: none; z-index: 1; box-shadow: 0 3px 12px rgba(0, 0, 0, 0.15); text-decoration: none; }

/* Mobile navigation */ .nav-mobile { display: none; position: absolute; top: 0; right: 0; background: #002a5c; height: 70px; width: 70px; }

@media only screen and (max-width: 1350px) {


.nav-mobile { display: block; }

nav { width: 100%; padding: 70px 0 15px; } nav ul { display: none; max-height: 280px; overflow-y: auto; } nav ul li { float: none; } nav ul li a { padding: 15px; line-height: 20px; text-decoration: none; } nav ul li ul li a { padding-left: 30px; text-decoration: none; }

.nav-dropdown { position: static; } } @media screen and (min-width: 1351px) { .nav-list { display: block !important; } }

  1. nav-toggle {

position: absolute; left: 18px; top: 22px; cursor: pointer; padding: 10px 35px 16px 0px; max-height: 280px; overflow-y: auto; }

  1. nav-toggle span,
  2. nav-toggle span:before,
  3. nav-toggle span:after {

cursor: pointer; border-radius: 1px; height: 5px; width: 35px; background: #ffffff; position: absolute; display: block; content: ""; transition: all 300ms ease-in-out; }

  1. nav-toggle span:before {

top: -10px; }

  1. nav-toggle span:after {

bottom: -10px; }

  1. nav-toggle.active span {

background-color: transparent; }

  1. nav-toggle.active span:before, #nav-toggle.active span:after {

top: 0; }

  1. nav-toggle.active span:before {

transform: rotate(45deg); }

  1. nav-toggle.active span:after {

transform: rotate(-45deg); }

article { max-width: 1000px; margin: 0 auto; padding: 10px; line-height: 1.5; }

.article { max-width: 1000px; margin: 0 auto; padding: 10px; line-height: 1.5; padding-right: 5%; padding-left : 5%;

}

/* W3 Schools templates*/

.w3-top,.w3-bottom{position:fixed;width:100%;z-index:1;} .w3-top{top:0;} .w3-bottom{bottom:0;}

  1. footer{display:block;width:98%}

.w3-container:after,.w3-container:before{content:"";display:table;clear:both;width:98%;}

.w3-container{}

.w3-padding-32{padding-top:32px!important;padding-bottom:32px!important;}

.w3-center .w3-bar{display:inline-block;width:auto;}

.w3-center{text-align:center!important;}

.w3-black,.w3-hover-black:hover{color:#fff!important;background-color:#000!important;}

.w3-xlarge{font-size:24px!important;}


/*OWN STYLES*/

body { font-family: "Lato", sans-serif; }

@media only screen and (min-width: 1010px){ .main_content {

background-color: white; border: 1px solid #000000; border-radius: 0px; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.35); min-height: 100px; border-top: none; border-bottom: none; margin-left:25%; margin-right:25%; padding-bottom: 4%; min-height: 420px; position: sticky; margin-top: -100px; } }

@media only screen and (max-width: 1009px){ .main_content {

background-color: white; border: 1px solid #000000; border-radius: 0px; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.35); min-height: 100px; border-top: none; border-bottom: none; margin-left:0; margin-right:0; padding-bottom: 4%; position: sticky; margin-top: -100px; } }


  1. container{

position: relative; min-height: 100%; height: 100%; }

.container{ padding-top:0px; background-color: #001633; }

.section{ margin: 1%; }

.half{ max-width: 48%; }

.half.left { float: left; margin-right: 1%; }

.half.right { float: right; margin-left: 1%;

}

article, .article { text-align: justify; display: block; margin: auto; font-size: 16px; padding-bottom: 20px; }

article, .article, .contentline { width: 90%; font-size: 16px; padding-bottom: 30px; }

.contentline article, .contentline .article { width: 100%; }

h1, h2, h3, h4, h5, h6 { width: 92%; margin: auto; margin-top: 0px; padding-top: 20px; padding-bottom: 15px; }

.p { text-align: justify; }

.title { font-size: 40px; padding-top: 5%; padding-left: 3%; padding-bottom: 40px; font-weight: bold; background-color: rgb(255,255,255); margin-top: -70px; position:sticky; line-height:1.5em; text-align:left; }

h2 { padding-left: 3%; font-size:14; }

br { display: block; /* makes it have a width */ content: ""; /* clears default height */ margin-top: 20px; /* change this to whatever height you want it */ }

p { font-size:14px; }

body { padding-top: 0px; }



article{ padding-right: 5%; padding-left : 5%; }

  1. page-arrow-top {

display: none; cursor: pointer; padding: 0; margin: 0; position: fixed; bottom: 20px; right: 50px; }

.half { width: 48%; }

.half.left { float: left; margin-right: 1%; }

.half.right { float: right; margin-left: 1%; }

.sidenavi{

margin-top: 50px; margin-left: 4%; display: block; position: -webkit-sticky; position: sticky; top: 150px; float: left; background-color: #001633; border-radius: 30px; border-color: white; border-style: solid; }


.side_list{ display: block; margin-right: 10px; margin-bottom: 15px; margin-top: 10px; margin-left: 10px; color: white; }

.side_link{ color: white; font-size: 20px; text-decoration:none; padding: 10px; }

.side_list > a:hover{ text-decoration:none; color: white; }

.side_list > a{ text-decoration:none; font-size: 18px; padding: 10px; width:100%; cursor: pointer; color: white; }


@media only screen and (max-width: 1150px){ .sidenavi{

margin-top: 50px; margin-left: 1%; display: block; position: -webkit-sticky; position: sticky; top: 150px; float: left; background-color: #001633; border-radius: 30px; border-color: white; border-style: solid; }

.side_list{ display: block; margin-right: 10px; margin-bottom: 15px; margin-top: 10px; margin-left: 10px; color: white; }

.side_link{ color: white; font-size: 10px; text-decoration:none; padding: 10px; }

.side_list > a:hover{ text-decoration:none; color: white; }

.side_list > a{ text-decoration:none; font-size: 16px; padding: 12px; width:100%; cursor: pointer; color: white; }

}


@media only screen and (max-width: 1685px){ .sidenavi{

margin-top: 50px; margin-left: 1%; display: block; position: -webkit-sticky; position: sticky; top: 150px; float: left; background-color: #001633; border-radius: 30px; border-color: white; border-style: solid; }

.side_list{ display: block; margin-right: 10px; margin-bottom: 15px; margin-top: 10px; margin-left: 10px; color: white; }

.side_link{ color: white; font-size: 10px; text-decoration:none; padding: 10px; }

.side_list > a:hover{ text-decoration:none; color: white; }

.side_list > a{ text-decoration:none; font-size: 16px; padding: 8px; width:100%; cursor: pointer; color: white; }

}


@media only screen and (max-width: 1300px){ .sidenavi{ display: none;

} }


figure { text-align: center; margin-bottom: 30px;

}

figcaption{ text-align: justify; font-size: 13px; margin-top:10px; }

.figure.eighty { width:80%; }

.figure.ten { width:10%; }

.figure.twenty { width:20%; }

.figure.thirty { width:30%; }

.figure.fourty { width:40%; }

.figure.fifty { width:50%; }

.figure.sixty { width:60%; }

.figure.seventy { width:70%; }

.figure.ninety { width:90%; }

.figure.hundred { width:100%; }


table, th, td { border: 1px solid black; border-collapse: collapse; font-size:17px; } th, td { padding: 15px; text-align: left; } table#t01 tr:first-child td{ background-color: #eee; }

table#t01 tr td:first-child { background-color: #eee; color: black; }


table.centern{ margin-left:15%; margin-right:15%; margin-top: 100px; margin-top: 5%; }

  1. HQ_page table {

border: 1px solid #ccc; border-collapse: collapse; width: 70%; margin: auto; margin-bottom: 0px; margin-top: 100px; margin-right: auto; margin-left: auto; }

hr { margin-top: 10%; margin-bottom: 20px; border: 0; text-align: center; border-top: 2px solid #000000; margin-left: auto; margin-right: auto;

}

.reftext { display: block; text-align: justify; margin-left: 5%; margin-right: 5%; font-size: 14px; padding-bottom: 20px; line-height: 20px; }

/*Footer*/ .fa-facebook-official:before { content: "\f230"; color: white; }


.fa-instagram:before { content: "\f230"; color: white; }

.fa-twitter:before { content: "\f230"; color: white; }

  1. myDIV {

margin-top: 10px; display:none; }

.refbtn{ background-color: white; border: none; font-size: 150%; font-weight: bold; color: black; margin-left: 5%; margin-bottom: 26px; margin-top: 30px;

}

a.shifted-anchor { display: block; position:relative; top: -100px; }

active{

text-decoration: none; }

html,body { background-color: #001633; }


  1. myVideo {

position: static; top:0; left:0 right: 0; bottom: 0; height: auto; margin-top: 70px; z-index:1; }


.title_picture{ width:100%; padding-top:40px; }


@-webkit-keyframes animateBubble { 0% { margin-top: 310%; } 100% { margin-top: 5%; } }

@-moz-keyframes animateBubble { 0% { margin-top: 310%; } 100% { margin-top: 5%; } }

@keyframes animateBubble { 0% { margin-top: 310%; } 100% { margin-top: 5%; } }


@-webkit-keyframes animateBubbleSeite { 0% { margin-top: 40px; } 100% { margin-top: -200%; } }

@-moz-keyframes animateBubbleSeite { 0% { margin-top: 40px; } 100% { margin-top: -200%; } }

@keyframes animateBubbleSeite { 0% { margin-top: 40px; } 100% { margin-top: -200%; } }


@-webkit-keyframes sideWays { 0% { margin-left:0px; } 100% { margin-left:50px; } }

@-moz-keyframes sideWays { 0% { margin-left:0px; } 100% { margin-left:50px; } }

@keyframes sideWays { 0% { margin-left:0px; } 100% { margin-left:50px; } }


.s1 { -webkit-animation: animateBubbleSeite 120s linear infinite, sideWays 2s ease-in-out infinite alternate; -moz-animation: animateBubbleSeite 120s linear infinite, sideWays 2s ease-in-out infinite alternate; animation: animateBubbleSeite 120s linear infinite, sideWays 2s ease-in-out infinite alternate;

left: 5%; top: 95%; z-index:1; overflow: hidden;

-webkit-transform: scale(0.1); -moz-transform: scale(0.1); transform: scale(0.1); }


.x1 { -webkit-animation: animateBubble 100s linear infinite, sideWays 2s ease-in-out infinite alternate; -moz-animation: animateBubble 100s linear infinite, sideWays 2s ease-in-out infinite alternate; animation: animateBubble 100s linear infinite, sideWays 2s ease-in-out infinite alternate;

left: -5%; top: 20%; z-index:1; overflow: hidden;

-webkit-transform: scale(0.1); -moz-transform: scale(0.1); transform: scale(0.1); }

.x2 { -webkit-animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate; -moz-animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate; animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate;

left: 5%; top: 20%; z-index:1; overflow: hidden; -webkit-transform: scale(0.2); -moz-transform: scale(0.2); transform: scale(0.2); }

.x3 { -webkit-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate; -moz-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate; animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate;

left: 10%; top: 20%; overflow: hidden; z-index:1; -webkit-transform: scale(0.2); -moz-transform: scale(0.2); transform: scale(0.2); }

.x4 { -webkit-animation: animateBubble 90s linear infinite, sideWays 3s ease-in-out infinite alternate; -moz-animation: animateBubble 90s linear infinite, sideWays 3s ease-in-out infinite alternate; animation: animateBubble 90s linear infinite, sideWays 3s ease-in-out infinite alternate;

left: 20%; top: 20%; overflow: hidden; z-index:1; -webkit-transform: scale(0.2); -moz-transform: scale(0.2); transform: scale(0.2); }

.x5 { -webkit-animation: animateBubble 70s linear infinite, sideWays 4s ease-in-out infinite alternate; -moz-animation: animateBubble 70s linear infinite, sideWays 4s ease-in-out infinite alternate; animation: animateBubble 70s linear infinite, sideWays 4s ease-in-out infinite alternate;

left: 30%; top: 20%; overflow: hidden; z-index:1; -webkit-transform: scale(0.1); -moz-transform: scale(0.1); transform: scale(0.1); }

.x6 { -webkit-animation: animateBubble 115s linear infinite, sideWays 2s ease-in-out infinite alternate; -moz-animation: animateBubble 115s linear infinite, sideWays 2s ease-in-out infinite alternate; animation: animateBubble 115s linear infinite, sideWays 2s ease-in-out infinite alternate;

left: 50%; top: 20%; overflow: hidden; z-index:1; -webkit-transform: scale(0.1); -moz-transform: scale(0.1); transform: scale(0.1); }

.x7 { -webkit-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate; -moz-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate; animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate;

left: 65%; top: 20%; overflow: hidden; z-index:1; -webkit-transform: scale(0.1); -moz-transform: scale(0.1); transform: scale(0.1); }

.x8 { -webkit-animation: animateBubble 100s linear infinite, sideWays 3s ease-in-out infinite alternate; -moz-animation: animateBubble 100s linear infinite, sideWays 3s ease-in-out infinite alternate; animation: animateBubble 100s linear infinite, sideWays 3s ease-in-out infinite alternate;

left: 80%; top: 20%; overflow: hidden; z-index:1; -webkit-transform: scale(0.2); -moz-transform: scale(0.2); transform: scale(0.2); }

.x9 { -webkit-animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate; -moz-animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate; animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate;

left: 90%; top: 20%; overflow: hidden; z-index:1; -webkit-transform: scale(0.1); -moz-transform: scale(0.1); transform: scale(0.1); }

.x10 { -webkit-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate; -moz-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate; animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate;

left: 80%; top: 20%; overflow: hidden; z-index:1; -webkit-transform: scale(0.1); -moz-transform: scale(0.1); transform: scale(0.1); }


.bubble { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;

-webkit-box-shadow: 0 20px 30px rgba(0, 0, 0, 0.2), inset 0px 10px 30px 5px rgba(255, 255, 255, 1); -moz-box-shadow: 0 20px 30px rgba(0, 0, 0, 0.2), inset 0px 10px 30px 5px rgba(255, 255, 255, 1); box-shadow: 0 20px 30px rgba(0, 0, 0, 0.2), inset 0px 10px 30px 5px rgba(255, 255, 255, 1);

height: 200px; position: absolute; width: 200px; }

.bubble:after { background: -moz-radial-gradient(center, ellipse cover, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 0%); /* FF3.6+ */ background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(255,255,255,0.5)), color-stop(0%,rgba(255,255,255,0))); /* Chrome,Safari4+ */ background: -webkit-radial-gradient(center, ellipse cover, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 0%); /* Chrome10+,Safari5.1+ */ background: -o-radial-gradient(center, ellipse cover, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 0%); /* Opera 12+ */ background: -ms-radial-gradient(center, ellipse cover, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 0%); /* IE10+ */ background: radial-gradient(ellipse at center, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 0%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;

-webkit-box-shadow: inset 0 20px 30px rgba(255, 255, 255, 0.3); -moz-box-shadow: inset 0 20px 30px rgba(255, 255, 255, 0.3); box-shadow: inset 0 20px 30px rgba(255, 255, 255, 0.3);

content: ""; height: 180px; left: 10px; position: absolute; width: 180px; }

@media only screen and (max-width: 1700px) {

.bubble.x1, .bubble.x2, .bubble.x8, .bubble.x9, .bubble.x10{ display:none; }


}


@media only screen and (max-width: 1200px) {

.bubble.x1, .bubble.x2, .bubble.x7, .bubble.x8, .bubble.x9, .bubble.x10{ display:none; } }


.timer_box{

   border: white;
   border-style: solid;
   padding-bottom: 125px;
   padding-left: 10px;
   padding_top:10px;
   marging-bottom: 100px;

}

  1. gold {
 float: left;
 font-size: 50px;
 margin-top: 10px;
 width: 50%;
 color:white;

text-align: center;

}

  1. gold_text {
 float: left;
 font-size: 20px;
 margin-top: 0px;
 width: 50%;
 color:white;

text-align: center; }

  1. silver {
 float: left;
 text-align: center;
 font-size: 50px;
 margin-top: 10px;
 width: 50%;
 color:white;

}

  1. silver_text {
 float: left;
 text-align: center;
 font-size: 20px;
 margin-top: 0px;
 width: 50%;
 color:white;

}

.img_text{ text-align:center; position:absolute; }

  1. home_imgs {
   margin-top:100px;
   width:60%;

}


@media only screen and (max-width: 1300px) {

  1. home_imgs{

width:70%;

}

  1. silver{

font-size: 30px;

}

  1. gold{

font-size: 30px;

}

  1. silver_text{

font-size: 20px;

}


  1. gold_text{

font-size: 20px; }

}


@media only screen and (max-width: 900px) {

.timer_box{

   border: white;
   border-style: solid;
   padding-bottom: 100px;
   padding-left: 10px;
   padding_top:10px;
   marging-bottom: 100px;

}

  1. home_imgs{

margin-top:50px; width:90%; }

  1. silver{

font-size: 20px;

}

  1. gold{

font-size: 20px;

}

  1. silver_text{

font-size: 15px;

}


  1. gold_text{

font-size: 15px; }

}


@media only screen and (max-width: 600px) {

.timer_box{

   border: white;
   border-style: solid;
   padding-bottom: 100px;
   padding-left: 10px;
   padding_top:10px;
   marging-bottom: 100px;

}

  1. home_imgs{

margin-top:15px; width:100%; }

  1. silver{

font-size: 15px;

}

  1. gold{

font-size: 15px;

}

  1. silver_text{

font-size: 10px;

}


  1. gold_text{

font-size: 10px; }

}


@media only screen and (max-width: 400px) {

.timer_box{

   border: white;
   border-style: solid;
   padding-bottom: 50px;
   padding-left: 10px;
   padding_top:10px;
   marging-bottom: 100px;

}

  1. home_imgs{

margin-top:5px; width:100%; }

  1. silver{

font-size: 10px;

}

  1. gold{

font-size: 10px;

}

  1. silver_text{

font-size: 5px;

}


  1. gold_text{

font-size: 5px; }

}