html {
    height: 100%;
    width: 100%;
  }
body {
  background: url(../images/logo/nft_galery_bg_logo.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  font-family: Arial, Helvetica, sans-serif;
  margin: 0px;
  padding: 1em;
  height: 100%;
  width: 100%;
}
footer {
  background-color:#ececec;
  width: 100%;
}
.flex-container {
  min-height: 200px;
  margin: 0 auto;
  display: -webkit-flex; /* Safari */     
  display: flex; /* Standard syntax */
}
.flex-container .column{
  -webkit-flex: 1; /* Safari */
  -ms-flex: 1; /* IE 10 */
  flex: 1; /* Standard syntax */
}
.navbar {
    background-color:  #663a08;
}
.navbar_index {
  overflow: hidden;
  background-color: #666666;
  position: fixed;
  top: 0; 
  left: 0; 
}
.navbar-brand {
    min-height: 55px;
    padding-top: 0px 15px 15px;
}
.navbar-brand2 {
    min-height: 55px;
    padding-top: 0px 15px 15px;
    position: fixed;
    top: 30px; 
    right: 30px; 
}
.navbar-expand-sm {
    min-height: 40px;
    padding-top: 0px 15px 15px;
}

.mytooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted #c69c6d; /* If you want dots under the hoverable text */
}

/* Tooltip text */
.mytooltip .tooltiptext {
  top: -5px;
  left: 105%; 
  visibility: hidden;
  width: 300px;
  background-color: #c69c6d;
  color: #fff;
  text-align: center;
  padding: 10px;
  border-radius: 6px;
 
  /* Position the tooltip text - see examples below! */
  position: absolute;
  z-index: 8;
}

/* Show the tooltip text when you mouse over the tooltip container */
.mytooltip:hover .tooltiptext {
  visibility: visible;
}
.newtag {
  font-weight: bold;
}
.corner-box {
  background-color: #c5c3c3;
  border-radius: 7px;
}
.frame-box {
  color: #c5c3c3;
  border-style: solid;
  border-width: 4px 20px 4px 20px;
  border-radius: 7px;
  padding-top:10px;
  padding-bottom:10px;
}
.frame-box2 {
  color: #c5c3c3;
  border-style: solid;
  border-width: 4px 4px 4px 4px;
  border-radius: 7px;
  padding-left:10px;
  padding-right:10px;
  padding-top:10px;
  padding-bottom:10px;
}
.corner-box-h3 {
  padding-left:50px;
  padding-right:50px;
  padding-top:20px;
  padding-bottom:20px;
}
.separation-bar {
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #787878), color-stop(0.5, #5E5E5E), color-stop(0.51, #707070), color-stop(1, #838383));
  background-image: -moz-linear-gradient(center bottom, #787878 0%, #5E5E5E 50%, #707070 51%, #838383 100%);
  background-color: #5f5f5f;
  border-radius: 4px;
  padding-top: 10px;
  padding-bottom: 10px;
  margin-top: 60px;
  margin-left: 60px;
  margin-right: 60px;
}
.separation-bar2 {
  background-color:  #c69c6d;
  padding-top: 10px;
  padding-bottom: 10px;
  margin-top: 30px;
  margin-bottom: 30px;
}
.boxes {
  padding-top:5px;
  padding-bottom:5px;
}
tr{
  border-bottom: 1px solid #c69c6d;
}
h1 {
  font: 32px Arial, Helvetica, sans-serif;
  color: #f2f2f2;
  font-weight: bold;
  text-align: center;
  padding-top: 20px;
  padding-bottom: 20px;
  
}
.h1-shadow {
  font: 144px Arial, Helvetica, sans-serif;
  color: #555454;
  text-shadow: 10px 10px #d3d3d38c;
  font-weight: bold;
  text-align: center;
}
h2 {
  font: 24px Arial, Helvetica, sans-serif;
  color: #f2f2f2;
  font-weight: bold;
  padding-top: 6px;
}
.h2-shadow {
  font: 72px Arial, Helvetica, sans-serif;
  color: #555454;
  text-shadow: 6px 6px #d3d3d38c;
  font-weight: bold;
  text-align: center;
}
h3 {
  font: 24px Arial, Helvetica, sans-serif;
  color: #f2f2f2;
  font-weight: bold;
  padding-top: 6px;
}
h4 {
  font: 18px Arial, Helvetica, sans-serif;
  color: #f2f2f2;
  font-weight: bold;
  padding-top: 6px;
}
p {
  font: 18px Arial, Helvetica, sans-serif;
  color: #f2f2f2;
}
.img-responsive {
  border-radius: 7px;
}
.landing-text {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
  }
.landing-text {
  font-size:500%;
  font-weight:700;
}
.landing-text h3 {
  font-size:250%;
  font-weight:700;
}
.padding {
    padding:80px 0;
}
.padding img {
    width:100%;
}
#fixed {
    background: url(../images/content/fixed_pic.png) no-repeat center center fixed;
    display: table;
    height: 60%;
    position: relative;
    width: 100%;
    background-size: cover;
}
.carousel-control-prev-icon {
  width: 60px;
  height: 60px;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='rgb(141, 106, 66)' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e");
}

.carousel-control-next-icon {
  width: 60px;
  height: 60px;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='rgb(141, 106, 66)' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e");
}
.fa-facebook a {
    color: #3B5998;
}
.fa-twitter {
    color: #00ACED;
}
.fa-instagram {
  color: transparent;
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
  background: -webkit-radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
  background-clip: text;
  -webkit-background-clip: text;
}

.fa-instagram-square{
  color: green;
  font-size: 108px;
}
.fa-linkedin {
    color: #2867B2;
}
.fa-youtube {
    color: #BB0000;
}
.social a {
    font-size: 4.5em;
    padding: 3rem;
}
.fa {
    padding: 15px;
    font-size: 25px;
}
.fa:hover {
    color: #D5D5D5;
    text-decoration: none;
}
.icon {
    max-width: 400px;
}
.container {
  max-width: 70% !important;/*Set your own width %; */
  background:#c69c6d5c;
}
.col_small_left {
  padding-left:300px;
}
.col_small_right {
  padding-right:300px;
}
@media (max-width:768px) {
  .landing-text h1 {
      font-size: 300%;
  }
  .landing-text h3 {
      font-size: 200%;
  }
  .fa {
      font-size: 20px;
      padding: 10px;
  }
  .icon {
      padding-top: 5px;
      max-width: 100px;
  }
  h1 {
    font-size:70%;
    padding:0px;
    line-height: 1;
  }   
  h2 {
    font-size:50%;
    padding:0px;
    line-height: 1;
  }   
  h3 {
    font-size:50%;
    padding:0px;
    line-height: 1;
  }   
  .col_small_left {
    padding-left:0px;
  }
  .col_small_right {
    padding-right:0px;
  }
}
@media (max-width:992px) {
  .container {
    max-width: 90% !important;/*Set your own width %; */
  }
}

svg {
  background-color: #d8d8d8;
  cursor: pointer;
  height: 44px;
  width: 44px;
}
.scroller__thumb {
  background-color:rgba(0,0,0,0);
}
.buttonsmenu {
  font-family : Verdana, Arial, sans-serif;
  padding-top:10px;
  padding-bottom:10px;
  width:100%;
  float:center;
  margin-bottom:20px;
}
.buttonsmenufull {
  font-family : Verdana, Arial, sans-serif;
  padding-top:10px;
  padding-bottom:10px;
  width:100%;
  float:center;
  margin-bottom:20px;
  background-color:  #c69c6d;
  color:  #e2e2e2;
  border-color: #663a08;
}
.buttonsmenuhalf {
  font-family : Verdana, Arial, sans-serif;
  padding-top:10px;
  padding-bottom:10px;
  width:45%;
  float:center;
  margin-bottom:20px;
  background-color: #c69c6d;
  color: #e2e2e2;
  border-color: #663a08;
}
.centertext {
  width: 100%; 
  margin-bottom: 30px;
}
.imgdisplay {
  margin-left:20px;
  margin-right:20px;
  width: 80px;
  height: 40px;
  border:1px solid #d3d3d3;
}
.label_input {
  font-family : Verdana, Arial, sans-serif;
  width: 40%;
  margin-bottom:20px;
}
.label_captcha {
  font-family : Verdana, Arial, sans-serif;
  width: 20%;
  margin-bottom:20px;
}
input[type="text"]:focus, input[type="email"]:focus, textarea:focus {
  color : #009;
  border : 1px solid #990000;
  background-color : #ffff99;
  font-family : Verdana, Arial, sans-serif;
  width: 50%;
}
input[type="password"]:focus {
  color : #009;
  border : 1px solid #990000;
  background-color : #ffff99;
  font-family : Verdana, Arial, sans-serif;
  width: 100%;
}
input[type="text"], input[type="email"], select, textarea {
  font-family : Verdana, Arial, sans-serif;
  width: 50%;
}
input[type="password"] {
  font-family : Verdana, Arial, sans-serif;
  width: 100%;
}
input[type="radio"] {
  font-family : Verdana, Arial, sans-serif;
  width: 1%;
  display:inline-block;
}
.radio_text {
  font: 24px Arial, Helvetica, sans-serif;
  color: #181716;
  font-weight: bold;
  display:inline-block;
  padding-left:3%;
  width:20%;
}
input[type="text"]:focus, #css_camycasa textarea:focus {
  color : #009;
  border : 1px solid #990000;
  background-color : #ffff99;
  font-family : Verdana, Arial, sans-serif;
  width: 50%;
}
.aftertitle {
  margin-top: 30px;
}
.error {
  font-family: Verdana, Arial, sans-serif; 
  font-size: 20px;
  color: #003366;
  background-color : #ffbf00;
}
#antispam {
  padding:2px;
  border-top:1px solid #EEE;
  border-left:0;
  border-right:0;
  border-bottom:0;
  width:450px;
  font-family : Arial, sans-serif;
  font-size: 0.8em;
  font-weight:bold;
  color:#333;   
}
.short_explanation {
  font-family : Arial, sans-serif;
  font: 16px Arial, Helvetica, sans-serif;
  color: #003366;
  position: relative;
  margin-top:30px;
  margin-bottom:30px;
}
/* spam_trap: This input is hidden. This is here to trick the spam bots*/
.spmhidip {
  display:none;
  width:10px;
  height:3px;
}
#scaptcha {
  width:60px;
  height:18px;
}
.overlay {
  height: 100%;
  width: 100%;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: rgba(211,211,211, 0.9);
  overflow-x: hidden;
  transition: 0.5s;
}

/* Our wrapper (from imagewrapper) */

.animwrapper{
  box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
  border-radius: 7px;
}
.zoom:hover {
  transform: scale(1.5); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
  z-index:2;
}
.zoom2:hover {
  transform: scale(1.1);  
  z-index:2;
}
/* Main Navigation */
#nav {
  position:fixed;
  top:1px;
  left:1px;
  width:1060px;
  height:100px;
  margin:0 auto;
  margin-top:0px;
  padding:10px;
  z-index:10;
}

ul#navigation {
  margin:0px auto;
  position:relative;
  float:left;
  border-right:1px solid #c69c6d;

}

ul#navigation li {
  display:inline;
  font-size:12px;
  font-weight:bold;
  margin:0;
  padding:0;
  float:left;
  position:relative;
  border-top:1px solid  #c69c6d;
  border-bottom:2px solid  #c69c6d;
}

ul#navigation li a {
  padding:10px 25px;
  color: #c69c6d;
  text-shadow:1px 1px 0px #fff;
  text-decoration:none;
  display:inline-block;
  border-right:1px solid #fff;
  border-left:1px solid #C2C2C2;
  border-top:1px solid #fff;
  background:#ececec;

  -webkit-transition:color 0.2s linear, background 0.2s linear;
  -moz-transition:color 0.2s linear, background 0.2s linear;
  -o-transition:color 0.2s linear, background 0.2s linear;
  transition:color 0.2s linear, background 0.2s linear;
}

ul#navigation li a:hover {
  background:#ececec;
  color: #c69c6d;
}

ul#navigation li a.first {
  border-left: 0 none;
}

ul#navigation li a.last {
  border-right: 0 none;
}

ul#navigation li:hover > a {
  background:#fff;
}

/* Drop-Down Navigation */
ul#navigation li:hover > ul
{
/*these 2 styles are very important,
being the ones which make the drop-down to appear on hover */
    visibility:visible;
    opacity:1;
}
 
ul#navigation ul, ul#navigation ul li ul {
    list-style: none;
    margin: 0;
    padding: 0;
/*the next 2 styles are very important,
being the ones which make the drop-down to stay hidden */
    visibility:hidden;
    opacity:0;
    position: absolute;
    z-index: 99999;
    width:180px;
    background:#ececec;
    box-shadow:1px 1px 3px #ccc;
/* css3 transitions for smooth hover effect */
    -webkit-transition:opacity 0.2s linear, visibility 0.2s linear;
    -moz-transition:opacity 0.2s linear, visibility 0.2s linear;
    -o-transition:opacity 0.2s linear, visibility 0.2s linear;
    transition:opacity 0.2s linear, visibility 0.2s linear;
}
 
ul#navigation ul {
    top: 43px;
    left: 1px;
}
 
ul#navigation ul li ul {
    top: 0;
    left: 181px; /* strong related to width:180px; from above */
}
 
ul#navigation ul li {
    clear:both;
    width:100%;
    border:0 none;
    border-bottom:1px solid #c9c9c9;
}
 
ul#navigation ul li a {
    background:none;
    padding:7px 15px;
    color: #c69c6d;
    text-shadow:1px 1px 0px #fff;
    text-decoration:none;
    display:inline-block;
    border:0 none;
    
    clear:both;
    width:150px;
}
.carousel-indicators li {
  height: 10px;
  width: 40px;
  background-color: #663a08a1;
}
.line-sep::before {
  content:'';
  display:block;
  background:#663a08;
  margin-bottom:10px;
  margin-left:10%;
  width: 80%;
  height:5px;
}
.line-sep::after {
  content:'';
  display:block;
  background:#663a08;
  margin-left:10%;
  width: 80%;
  height:5px;
}
.line-sep2::before {
  content:'';
  display:block;
  background:#663a08;
  margin-bottom:10px;
  width: 100%;
  height:5px;
}
.line-sep2::after {
  content:'';
  display:block;
  background:#663a08;
  width: 100%;
  height:5px;
}
.fab{
  font-size: 30px;
}
