@import url('https://fonts.googleapis.com/css?family=Nunito:100,300,400,600,700');
@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");


html{
    /*
    background-image: url("../images/textures/t1.png"); 
    
    background-image: url("../images/mannheim.jpg");  */
    background-size: cover;
    background-repeat: no-repeat;
}
html,
body {
	margin: 0;
	font-family: Roboto, -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
	height: 100%;
	color: #1f1412;
	overflow: hidden;
}

body {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;/*
	background: #454545;
	
    background-image: url("../images/textures/t1.png");
    
    background-image: url("../images/mannheim.jpg"); 
    background-size: cover;
    background-repeat: no-repeat; */
    /*
    -webkit-box-shadow: inset 0px 0px 150px 166px rgba(0,0,0,1);
    -moz-box-shadow: inset 0px 0px 150px 166px rgba(0,0,0,1);
    box-shadow: inset 0px 0px 150px 166px rgba(0,0,0,1);
    */
}

.hero{
    height: 100%;
    backdrop-filter: blur(3px);
    background: #2e2e2e61;
}

#grid-container {
    /*background-image: url("../images/mannheim.jpg");*/
    background-image: url(../images/globalplayers/sap/buildings/sap5.png);
    width: 100%;
    max-width: 800px !important;
    margin-bottom: 10px;
    border-radius: 10px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.header h1 {
	display: flex;
	justify-content: center;
	align-items: center;
	margin:0px;
}

.header a {
	font-size: 16px;
	color: #199900;
	text-decoration: none;
	margin-left: 24px;
}

.header a:hover {
	color: #116600;
	text-decoration: underline;
}

.header a span {
	margin-left: 4px;
}

.header a svg {
	vertical-align: middle;
}
#leaflet-map{
	height: 60vh !important;
	position:relative;
    margin-top: 10px;
    margin-bottom: 10px;
	width:100%;
    padding: 6px;
    background: #fff;
    border: 5px solid #787878;
    border-radius: 10px;
    /*
    -webkit-box-shadow: 0px 0px 16px 4px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 16px 4px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 16px 4px rgba(0,0,0,0.75);
    */
}

.leaflet-label-marker,
.leaflet-label-other {
  border: 4px solid black; /* #c5c2ba; */
  border-radius: 0;
  color: black;
  font: 12px Helvetica; /* what is the std tooltip font ? */
  font-weight: 500;
  opacity: 1;
  padding: 3px;
}
.leaflet-label-other {
  border: 4px solid grey;
}

.button-line{
  z-index: 1000;
  position: absolute;
  right: 0;
  top: 0;
  padding: 10px;
}
.pure-button-group{
  margin-bottom: 10px;
}
#button-show, #button-hide, #button-fly-osl, #button-fly-ham, #button-fly-par{
  font-size: 85%;
  color: white;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}
#button-fly-osl, #button-fly-ham, #button-fly-par{
  background: rgb(28, 184, 65);
}

#button-show, #button-hide{
  background: rgb(223, 117, 20);
}
.citox{
	z-index:10000000000 !important;
	text-align:center;
	top: 20px;
	position: absolute;
}
.dashdiv {
    padding: 3px;
    background: #fff;
	float: left;
    margin: 3px;
    border: 1px solid #d4d2d2;
    border-radius: 5px;
    -webkit-box-shadow: -1px 0px 5px 0px rgba(0,0,0,0.34);
    -moz-box-shadow: -1px 0px 5px 0px rgba(0,0,0,0.34);
    box-shadow: -1px 0px 5px 0px rgba(0,0,0,0.34);
}

.dashdiv.active img{
	border-radius: 50%;
}
ul.fi {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.fi {  
	display:none;
}
.bobo{
	background: #f2f2f2;
}
/*not necessary*/
body{font-family:Nunito,arial,sans-serif;}
.section{float:left;width:100%;background: #fff;padding:30px 0;}
.promote{border:1px dashed #ddd;display:flex; height:100%;justify-content: center;flex-direction: column;align-items: stretch;}
.col-md-4{padding:15px;}

/*not necessary*/

#circledom{
    position: relative !important;
    margin: auto;
    width: 63px;
    margin-top: 74px;
}
.menoo {
    background-repeat: no-repeat !important;
    background-size: cover !important;
}
.mainoo {
    background-repeat: no-repeat !important;
    background-size: cover !important;
}
.profile-card-2 .card-img-block{
    float:left;
    width:100%;
    height:150px;
    overflow:hidden;
}
.profile-card-2 .card-body{
    position:relative;
}
.profile-card-2 .profile {
  border-radius: 50%;
  position: absolute;
  top: -42px;
  left: 15%;
  max-width: 75px;
  border: 3px solid rgba(255, 255, 255, 1);
  -webkit-transform: translate(-50%, 0%);
  transform: translate(-50%, 0%);
}
.profile-card-2 h5{
    font-weight:600;
    color:#007bff;
}
.profile-card-2 .card-text{
    font-weight:300;
    font-size:15px;
}
.profile-card-2 .icon-block{
    float:left;
    width:100%;
}
.profile-card-2 .icon-block a{
    text-decoration:none;
}
.profile-card-2 i {
  display: inline-block;
    font-size: 16px;
    color: #007bff;
    text-align: center;
    border: 1px solid #007bff;
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-radius: 50%;
    margin:0 5px;
}
.profile-card-2 i:hover {
  background-color:#007bff;
  color:#fff;
}

.jtextfill{
    position: absolute;
    text-align: center;
    width: 141px;
    height: 50px;
    font-weight: bold;
    top: -30px;
    left: -20px;
}
#pop {
    display: block;
    width: 75px;
    height: 75px;
    margin: auto;
    margin-top: 62px;
}

#pop .primary {
    background-size: contain;
    border-radius: 50%;
    width: 90px;
    height: 90px;
    border: 1px solid #fff;
    background: blue;
    margin: auto;
    margin-left: -5px;
    display: block;
    -webkit-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75);
}

#pop .secondary {
    background-size: contain;
    height: 35px;
    width: 40px;
    margin-left: -10px;
    display: block;
    border-radius: 10px;
    border: 1px solid #fff;
    background: red;
}
.monthus {
    position: relative !important;
    z-index: 0 !important;
    top: 29px !important;
    left: 15px !important;
    height: 16px !important;
    width: 28px !important;
    text-align: center;
    line-height: 12px;
    background: #ffffff24 !important;
    border: 2px solid #ffffff24 !important;
    border-top: 4px solid #bcbcbcb0 !important;
    border-radius: 3px !important;
    box-shadow: none !important;
    font-size: 10px;
    color: #000000;
}

.wrapex {
    width: 211px;
    height: 209px;
    margin: auto;
    margin-top: 18px;
    border: 4px dashed #8080805e;
    border-radius: 50%;
    background: #0000008d;
}

.flagox{
	position: absolute;
    top: 44px;
    left: 32px;
}
img.igoflag {
    margin-left: 0px;
	margin-right: 15px;
    position: relative;
    width: 23px;
}
img.countryflag {
    margin-left: 0px;
    position: relative;
    width: 23px;
}
#lobipanel-multiple {
    max-width: 450px;
}





.button{
    color: #000;
}
.ripple{
    border-radius: 50px 50px 7px 7px;
    display: none;
    position: absolute;
    z-index: 22;
    left: 175px;
    top: 133px;
    width: 90px;
    height: 90px;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    -webkit-filter: drop-shadow( 2px 2px 5px #000 ) !important;
    filter: drop-shadow( 2px 2px 5px #000 ) !important;
}

.imgo img {
    position: absolute;
    top: 28px;
    margin-left: 30px;
    width: 50px;
    z-index: 2222;
}
.imgo {
    width: 25px;
    margin-right: 10px;
}

.tablus {
    width: 100%;
    height: 226px;
    background: #0000004d;
    position: relative;
}
.tablus table {
    position: absolute;
    border-collapse: collapse;
    top: 0%;
    left: 0%;
    min-width: 100%;
    min-height: 100% !important;
}
.tablus td.topleft {
    background-color: #f88700;
    background-image: url(https://www.transparenttextures.com/patterns/white-wall-3-2.png);
}
.tablus td.topright {
    background-color: #00ff3e;
    background-image: url(https://www.transparenttextures.com/patterns/white-wall-3-2.png);
}
.tablus td.bottomleft {
    background-color: #9100ff;
    background-image: url(https://www.transparenttextures.com/patterns/white-wall-3-2.png);
}
.tablus td.bottomright {
    background-color: #00cbff;
    background-image: url(https://www.transparenttextures.com/patterns/white-wall-3-2.png);
}
.tablus td, .tablus th {
	border: 1px solid #595959;
	border-collapse: collapse;
    padding: 3px;
    width: 30px;
    height: 25px;
    color: white;
    font-size: 14;
    font-weight: bold;
    text-align: center;
}
.tablus th {
	background: #f0e6cc;
}
.tablus .horiz {
    background: url(assets/images/stripes/bg_film2a.png) repeat-x;
    background-size: 300% 100%;
}
.tablus .verti {
    background: url(assets/images/stripes/bg_film3a.png) repeat-x;
    background-size: 100% 250%;
}
.tablus .stagus {
    background: #0000007d;
}
.tablus .oddi {
    background-color: #000000;
    background-image: url(https://www.transparenttextures.com/patterns/white-wall-3-2.png);
}

@media all and (min-width: 1024px) {
	#leaflet-map {
		height: 768px;
		width: 800px;
	}
	.scene {
		width: 800px;
	}
	.designe-actions {
		width: 800px;
	}
}
@media all and (max-width: 400px) {
    img.logus {
        display:none;
    }
    img.logus1 {
        display:block;
        width: 40px;
    }
    .scene {
        display:block;
        width: 375px;
    }
}

.scene {
	height: 1250px;
	min-width: 375px;
	text-align: center;
	border: 2px solid #5353536b;
	position: relative;
	border-radius: 5px 5px 0 0;
    background: #525252; /*
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
Animations*/
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;  
}
.scene.fullscreen{
    z-index: 999; 
    width: 100%; 
    height: 100%; 
    position: fixed; 
	border: none;
    top: 0; 
    left: 0; 
 }
.buttfull {
    position: absolute;
    right: 0;
    z-index: 3;
}
.leaflet-control{
    display: none;
}

.header {
    margin-bottom: 10px;
    background: url(../images/bg/31.png);
    background-size: cover;
    position: relative;
    background-repeat: no-repeat;
    color: #000;
    width: 100%;
    font-family: "Arial Black", Gadget, sans-serif;
    text-shadow: 6px 3px 10px #a8a8a8;
    -webkit-box-shadow: 0px 0px 6px 0px rgba(19,34,43,1);
    -moz-box-shadow: 0px 0px 6px 0px rgba(19,34,43,1);
    box-shadow: 0px 0px 6px 0px rgba(19,34,43,1);
}
.dlab {
    text-align: center;
    width: 100%;
    color: #3f6991;
    font-weight: 100 !important;
    font-size: 15px;
}

img.logus {
    width: 150px;
    position: absolute;
    padding: 3px;
    margin-top: 14px;
}
img.logus1 {
    display:none;
}
.fullo{
    position: absolute;
    width: 22px;
    right: 0;
    top: 0;
    padding: 3px;
}


.chaptus{
    font-weight: bold;
    border: 1px solid #333;
    margin-bottom: 3px;
    border-radius: 3px;
    background: #f7f3f3;
    color: #000;
    padding-left: 5px;
    padding-top: 4px;
}
.namus {
    text-decoration: none;
    line-height: 30px;
    margin-left: 5px;
}
.paragrus{
    width: 400px;
    border: 1px solid gray;
    border-radius: 5px;
    text-align: center;
    display: inline-block;
}
.imgus {
    width: 30px;
}

.rightox {
    float: right;
}
.firmlog {
    width: 50px !important;
    margin-right: 4px !important;
    background: #fff;
    border-radius: 3px;
    -webkit-box-shadow: 0px 0px 13px 4px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 13px 4px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 13px 4px rgba(0,0,0,0.75);
}
.familog {
    position: absolute;
    width: 37px !important;
    left: 219px;
    top: 8px;
    border-radius: 3px;
    -webkit-box-shadow: 0px 0px 13px 4px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 13px 4px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 13px 4px rgba(0,0,0,0.75);
}
.gastgebo {
    right: 118px;
    position: absolute;
    top: -4px;
    font-size: 11px;
    color: #000 !important;
    text-shadow: 0px 1px 2px #fff !important;
}
.active .chaptus{
    background-color: #2d2d2d;
    background-image: url(https://dialogorium.com/assets/images/textures/t1.png); 
    background-size: cover;
    background-repeat: no-repeat;
}
.reactus {
    position: absolute;
    right: -225px;
    color: #fff;
    background: #00000096;
}
.wappo {
    z-index: 60 !important;
}
.buttus{
    width: 96%;
    height: 53px;
    margin-left: -11px;
    text-align: left;
    padding-left: 10px;
    border-radius: 5px;
    position: relative;
    border: 1px solid #00000078;
    overflow-x: hidden;/*
    background: #515151;*/
    background-color: #2d2d2d;
    background-image: url(https://dialogorium.com/assets/images/textures/t1.png); 
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 3px;
    border-right: 1px solid #0F1014;
    border-bottom: 1px solid #0F1014;
    border-top: 1px solid #53575C;
    border-left: 1px solid #53575C;
    box-shadow: 1px 1px #17191C;
}
.activim .buttus{
    background-color: #000;
}
.activimo{
    background-color: #000;
}
.buttus img {
    width: 23px;
    margin-right: 10px;
}

.buttus span{
    font-weight: bold;
    color: #fffebd;
    text-shadow: 1px 2px 2px black;
}
.nicescroll-cursors {
    right: -6px;
    width: 10px !important;
    height: 32px;
    cursor: pointer;
    border-radius: 2px !important;
    background: linear-gradient(#2f2f2f, #676767);
    border-radius: 3px;
    border-right: 1px solid #0F1014;
    border-bottom: 1px solid #0F1014;
    border-top: 1px solid #53575C;
    border-left: 1px solid #53575C;
    box-shadow: 1px 1px #17191C;
}
#ascrail2000 {
    background: #22211e;
    width: 12px !important;
}
.hando {
    width: 28px;
    height: 20px;
    border-right: 1px solid #000;
    margin-right: 5px;
    padding-top: 2px;
    background: white;
    text-align: center;
}
.citox2 {
    margin-top: -69px !important;
    width: 100px;
    text-align: center !important;
    height: 58px;
    z-index: 444 !important;
}
.dyntextval2 {
    color: #7c7c7c;
    font-size: 12px;
}
.topo{
    width: 80%;
    height: 80%;
    margin: 0 auto;
    background: #fff;
    border-radius: 10px;
    border: 10px solid #000;
    -webkit-box-shadow: 0px 0px 35px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 35px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 35px 0px rgba(0,0,0,0.75);
}


#slide_wrap {
    width: 100%;
    height: 50vw;
    max-height: 600px;
    margin: 40px auto 20px;
    background: #fff;
    border-radius: 10px;
    border: 10px solid #000;
    -webkit-box-shadow: 0px 0px 35px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 35px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 35px 0px rgba(0,0,0,0.75);
}

.sidepanel .sidepanel-toggle-container .sidepanel-toggle-button {
    width: 40px !important;
    height: 160px !important;
    cursor: pointer;
}
.sidepanel.sidepanel-dark.sidepanel-right .sidepanel-toggle-container .sidepanel-toggle-button {
    border-right: 1px solid #d8d8d8;
    right: 0;
}
.navigus{
    display: none;
    position: absolute;
    top: 20px;
    height: 80%;
    margin: auto;
    z-index: 10000;
    border-radius: 10px;
    border: 5px solid #787878;
    background-color: #ffffffd1;
    backdrop-filter: blur(5px);
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
}
#pager{
    display: block !important;
    min-width: 375px;
}
#content {
    display: block !important;
    width: 300px;
    margin: auto;
}
#content li{
    cursor: pointer;
}
.searchBox .search {
    /*width: 320px !important;*/
}
#fasearcho {
    position: absolute;
    left: 100px;
    margin-top: 10px;
}
#fasearcho a{
    color: #fff;
}
.vertical {
    -ms-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -ms-transform-origin: right top 0;
    -moz-transform-origin: right top 0;
    -webkit-transform-origin: right top 0;
    right: 100%;
    top: 39px;
    color: #ffffff;
    font-size: 20px;
    text-transform: uppercase;
    cursor: pointer;
    position: absolute;
    display: block;
    z-index: 11;
}
li.meno {
    cursor: pointer;
    border: 1px solid #c2c2c2;
    padding-left: 9px;
    margin: 2px;
    background: white;
}
.nono{
    display: none;
}
.nonu{
    background-color: #dbdbdb50;
    white-space: nowrap;
    width: 350px;
    height: 186px;
    position: relative;
    margin-bottom: 10px;
    height: 200px;
    padding: 10px;
    border: 5px solid #787878;
    border-radius: 7px;
    backdrop-filter: blur(5px);
    -webkit-box-shadow: 0px 0px 14px 4px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 14px 4px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 14px 4px rgba(0,0,0,0.75);
}
.nono0{
    width: 98%;
    margin-left: 14px;
}
.nono0 span{
    text-transform: uppercase; 
}
.nono1{
    white-space: nowrap;
    width: 100%;
    height: 178px;
    border-radius: 5px;
    overflow-y: auto;
    overflow-x: hidden;
    background: #00000060;
}
.nono1 li {
    color: white;
    text-align: center;
    padding: 2px;
    text-decoration: none;
}

.nono3{
    width: 350px;
    height: 309px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
    margin-bottom: 10px;
    border: 5px solid #787878;
    background-color: #dbdbdb50;
    white-space: nowrap;
    position: relative;
    backdrop-filter: blur(5px);
    -webkit-box-shadow: 0px 0px 14px 4px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 14px 4px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 14px 4px rgba(0,0,0,0.75);
}
.nono3 .texti {
    position: absolute;
    margin-top: 23px;
    z-index: 1;
    width: 331px;
    text-align: center;
    color: #bcbcbc;
    text-shadow: -1px 1px 1px black;
}
.nono4{
    width: 350px;
    height: 309px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
    margin-bottom: 10px;
    border: 5px solid #787878;
    background-color: #dbdbdb50;
    white-space: nowrap;
    position: relative;
    backdrop-filter: blur(5px);
    -webkit-box-shadow: 0px 0px 14px 4px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 14px 4px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 14px 4px rgba(0,0,0,0.75);
}
.nono4 .texti {
    position: absolute;
    margin-top: 0px;
    z-index: 1;
    width: 331px;
    text-align: center;
    color: #bcbcbc;
    text-shadow: -1px 1px 1px black;
}
.nono5{
    width: 350px;
    height: 309px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
    margin-bottom: 10px;
    border: 5px solid #787878;
    background-color: #dbdbdb50;
    white-space: nowrap;
    position: relative;
    backdrop-filter: blur(5px);
    -webkit-box-shadow: 0px 0px 14px 4px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 14px 4px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 14px 4px rgba(0,0,0,0.75);
}
.nono5 .texti {
    position: absolute;
    margin-top: 0px;
    z-index: 1;
    width: 331px;
    text-align: center;
    color: #bcbcbc;
    text-shadow: -1px 1px 1px black;
}
.hostum{
    width: 350px;
    height: 309px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 240px 240px 10px 10px;
    margin-bottom: 10px;
    border: 5px solid #787878;
    background-color: #7a7a7acc;
    white-space: nowrap;
    position: relative;
}
.hostum .texti {
    position: absolute;
    bottom: 25px;
    z-index: 1;
    width: 331px;
    text-align: center;
    color: #dfdfdf;
    text-shadow: -1px 1px 1px black;
}
.nonotext {
    text-align: center;
    color: #c4c4c4;
}
.texti {
    position: absolute;
    margin-top: -74px;
    width: 331px;
    z-index: 1;
    text-align: center;
    color: #bcbcbc;
    text-shadow: -1px 1px 1px black;
}
.main img {
    margin-top: -14px;
    -webkit-box-shadow: 0px 0px 7px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 7px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 7px 0px rgba(0,0,0,0.75);
}
.menu img {
    border-radius: 5px !important;
    -webkit-box-shadow: 0px 0px 7px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 7px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 7px 0px rgba(0,0,0,0.75);
}
svg.bubble {
    border: 1px solid #5a5a5a;
    border-radius: 240px 240px 10px 10px;
    background: #00000060;
    height: 200px;
}
svg.svg.d3-parliament {
    background: #000000b8;
    padding-top: 14px;
    border-radius: 240px 240px 10px 10px;
    background: #213877b8;
    background-image: url(../images/maps/worldmap1.png);
    background-size: cover;   
}
svg .seat {
	cursor: pointer;
	transition: all 800ms;
    /* Use -webkit- only if supporting: Chrome < 54, iOS < 9.3, Android < 4.4.4 */
    -webkit-filter: drop-shadow( 2px 2px 2px #000 ) !important;
            filter: drop-shadow( 2px 2px 2px #000 ) !important;
         
}
.svgot{
	position:relative;	
}
.svgbg{
	width:fit-content;	
}

circle:hover{
	opacity: 0.5;
	border: 1px solid #000;
	color:red;
    stroke-width:10px;
}

.actival{
    display:block;
}
.rounded-circle {
    border-radius: 50%!important;
}

.me-1 {
    margin-right: 0.25rem!important;
}

/**WRAPO ************************************/

.wrapo {
    background: #393939;
    bottom: 0px;
    width: 340px;
    position: absolute;
}

.wrapo ul {
    background: #3f3f3f66;
    margin: 0 !important;
    padding-top: 20px;
    padding-bottom: 2px;
}
.wrapo  a {
  color: #08F;
  text-decoration: none;
}

.wrapo  a:hover {
  opacity: .4;
}

.wrapo ul li {
    float: left;
    width: 56.5px;
    height: 14px;
    line-height: 14px;
    color: #D9D9D9;
    text-align: center;
    text-shadow: 0 1px #0F1014;
    display: table;
    background: linear-gradient(#2f2f2f, #676767);
    border-radius: 3px;
    border-right: 1px solid #0F1014;
    border-bottom: 1px solid #0F1014;
    border-top: 1px solid #53575C;
    border-left: 1px solid #53575C;
    box-shadow: 1px 1px #17191C;
    cursor: pointer;
}

.wrapo ul li b {
  font-size: 26px;
}

.wrapo ul li:active,
.wrapo ul li.active {
  color: #171820;
  background: #2A2D31;
  box-shadow: inset 0 0 5px 2px rgba(15, 16, 20, 0.5);
  border: 1px solid #0F1014;
}
.wrapo ul li.active b,
.wrapo ul li.active span{
  color: transparent;
  -webkit-text-stroke: 1px #ffe976;
}
.wrapo ul li:not(.active):hover {
  text-shadow: 0 0 10px #ffe976;
}

.wrapo ul li:active {
  text-shadow: none !important;
}

/**WRAPO 1************************************/

.wrapo1 {
    background: #39393900;
    margin-top: -60px;
    width: 350px;
    margin-left: 5px;
    position: absolute;
}

.wrapo1 ul {
    background: #3f3f3f66;
    margin: 0 !important;
    padding-top: 20px;
    padding-bottom: 2px;
}
.wrapo1  a {
  color: #08F;
  text-decoration: none;
}

.wrapo1  a:hover {
  opacity: .4;
}

.wrapo1 ul li {
    float: left;
    width: 70px;
    height: 14px;
    line-height: 14px;
    color: #D9D9D9;
    text-align: center;
    text-shadow: 0 1px #0F1014;
    display: table;
    background: linear-gradient(#2f2f2f, #676767);
    border-radius: 3px;
    border-right: 1px solid #0F1014;
    border-bottom: 1px solid #0F1014;
    border-top: 1px solid #53575C;
    border-left: 1px solid #53575C;
    box-shadow: 1px 1px #17191C;
    cursor: pointer;
}

.wrapo1 ul li b {
  font-size: 26px;
}

.wrapo1 ul li:active,
.wrapo1 ul li.active {
  color: #171820;
  background: #2A2D31;
  box-shadow: inset 0 0 5px 2px rgba(15, 16, 20, 0.5);
  border: 1px solid #0F1014;
}
.wrapo1 ul li.active b {
  color: transparent;
  -webkit-text-stroke: 1px #ffe976;
}

.wrapo1 ul li:not(.active):hover {
  text-shadow: 0 0 10px #ffe976;
}

.wrapo1 ul li:active {
  text-shadow: none !important;
}

/**WRAPO 3************************************/

.wrapo3 {
    background: #39393900;
    margin-top: 25px;
    width: 319px;
    position: absolute;
}

.wrapo3 ul {
    background: #3f3f3f66;
    margin: 0 !important;
    padding-top: 20px;
    padding-bottom: 2px;
}
.wrapo3  a {
  color: #08F;
  text-decoration: none;
}

.wrapo3  a:hover {
  opacity: .4;
}

.wrapo3 ul li {
    float: left;
    width: 63.8px;
    height: 14px;
    line-height: 14px;
    color: #D9D9D9;
    text-align: center;
    text-shadow: 0 1px #0F1014;
    display: table;
    background: linear-gradient(#2f2f2f, #676767);
    border-radius: 3px;
    border-right: 1px solid #0F1014;
    border-bottom: 1px solid #0F1014;
    border-top: 1px solid #53575C;
    border-left: 1px solid #53575C;
    box-shadow: 1px 1px #17191C;
    cursor: pointer;
}

.wrapo3 ul li b {
  font-size: 26px;
}

.wrapo3 ul li:active,
.wrapo3 ul li.active {
  color: #171820;
  background: #2A2D31;
  box-shadow: inset 0 0 5px 2px rgba(15, 16, 20, 0.5);
  border: 1px solid #0F1014;
}
.wrapo3 ul li.active b {
  color: transparent;
  -webkit-text-stroke: 1px #ffe976;
}

.wrapo3 ul li:not(.active):hover {
  text-shadow: 0 0 10px #ffe976;
}

.wrapo3 ul li:active {
  text-shadow: none !important;
}




/* Animation 
#title,
#job,
.quote-title {
  animation-name: fadeIn;
  animation-delay: 1s;
  animation-duration: 2s;
  animation-fill-mode: forwards;
  animation-iteration-count: 1;
  position: relative;
}
*/
@keyframes fadeIn {
  0% {
    opacity: 0;
    left: -100vw;
  }
  
  50% {
    opacity: .3;
  }
  
  100% {
    opacity: 1;
    left: 0;
  }
}
.btn-new-quote {
    color: #0C0C0D;
    background-color: transparent;
    border-color: #414147;
}

.btn-new-quote:hover {
    color: #0C0C0D;
    background-color: #9A989E;
    border-color: #0C0C0D;
}

.jumbotro {
    display:none;
    margin-top: 18px;
    height: 150px !important;
}
.fa-quote-left {
    text-align: left !important;
    position: absolute;
    left: 2px;
    top: 2px;
}

.quote-title {
    font-size: 24px !important;
    color: #fff;
}
.quote-title {
    font-size: 20px !important;
    color: #fff;
}

.progresso {
    width: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    height: 5px;
}
.progresso-wrap {
    overflow: hidden;
    position: absolute;
    background: #535353;
}
.progresso-bar {
    background: #000;
    border-top: 1px solid #000;
    position: absolute;
    top: 0;  
    border-width: 0.0625em;
    border-style: solid;
    -webkit-border-image: -webkit-linear-gradient(top,#121212,#787878) 1;
    -moz-border-image: -moz-linear-gradient(top,#121212,#787878) 1;
    -o-border-image: -o-linear-gradient(top,#121212,#787878) 1;
    -ms-border-image: -ms-linear-gradient(top,#121212,#787878) 1;
    border-image: linear-gradient(to bottom,#121212,#787878) 1;   
} 
.designer_actions{
    width: 800px !important;
    background: #fff !important;
}

.remotus {
    position: absolute;
    left: 9px;
    margin-top: 9px;
}
.remotus a {
    color: #fff;
}
.remotus a:hover {
    color: #ffffff99;
}
.dropitus1 {
    position: absolute;
    left: 55%;
    margin-top: 6px;
}
.settus {
    position: absolute;
    left: 45px;
    margin-top: 4px;
    color: #fff;
}

.dropdown-menu-left {
    right: 0;
    left: auto;
    padding-left: 1px;
    padding-right: 1px;
}
.cogus{
    background: none;
    border: none;
}
.cogus:focus{
    background: none;
    border: none;
}
.cogus:hover{
    color: #ffffff99 !important;
}
.coloricon {
    border: 1px solid #fff;
    border-radius: 50px;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
}
.dropup .dropdown-menu{
    background-color: #33333350;
    backdrop-filter: blur(5px);
    color: #fff;
    border: 5px solid #787878;
    text-shadow: -1px 1px 1px black;
}
.dropup .dropdown-menu>li>a:hover {
    color: #ffffffbb;
    text-decoration: none;
    background-color: #1c1c1c;
}
.dropup .dropdown-menu>li>a {
    color: #fff;
}
.seatlist {
    background: #000000cc;
}
.circlus a{
    color: #fff;
}
input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #fff;
    border-color: #6b7280;
    border-width: 1px;
    border-radius: 0;
    padding-top: 0.5rem;
    padding-right: 0.75rem;
    padding-bottom: 0.5rem;
    padding-left: 0.75rem;
    font-size: 1rem;
    line-height: 1.5rem;
    min-width: 300px;
}



#quote-carousel 
{
    padding: 0 10px 10px 10px;
    height: 100%;
}

/* Control buttons  */
#quote-carousel .carousel-control
{
    background: none;
    color: #fff;
    font-size: 2.3em;
    text-shadow: none;
    margin-top: 30px;
}
/* Previous button  */
#quote-carousel .carousel-control.left 
{
    left: -12px;
}
/* Next button  */
#quote-carousel .carousel-control.right 
{
    right: -12px !important;
}
/* Changes the position of the indicators */
#quote-carousel .carousel-indicators 
{
    right: 50%;
    top: auto;
    bottom: 0px;
    margin-right: -19px;
}
/* Changes the color of the indicators */
#quote-carousel .carousel-indicators li 
{
    background: #c0c0c0;
}
#quote-carousel .carousel-indicators .active 
{
    background: #333333;
}
#quote-carousel img
{
    width: 250px;
    height: 100px;
}
/* End carousel */

.item blockquote {
    border-left: none; 
    margin: 0;
    color: #fff;
}

.item blockquote img {
    margin-bottom: 10px;
}

.item blockquote p:before {
    content: "\f10d";
    font-family: 'Fontawesome';
    float: left;
    margin-right: 10px;
}
.nama {
    color: #000000;
    font-weight: bold;
    background: #fff;
    width: fit-content;
    margin: auto;
    border-radius: 5px;
    padding: 0 10px 0 10px;
}
.namat {
    color: #cbcbcb;
    text-shadow: 1px 2px 4px black;
    font-weight: bold;
    width: 100%;
    margin: auto;
    margin-top: -30px;
    text-align: center;
    position: absolute;
}
.pico {
    width: 100%;
    min-width: 801px;
    background: #dbdbdb50;
    border: 2px solid #000;
    padding-top: 10px;
    height: 186px !important;
    -webkit-box-shadow: 0px 0px 14px 4px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 14px 4px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 14px 4px rgba(0,0,0,0.75);
}
.fop {
    cursor: pointer;
    transition: all 800ms;
    -webkit-filter: drop-shadow( -5px -5px 5px #000 );
    filter: drop-shadow( -5px -5px 5px #000 );
}
circle:hover {
    opacity: 0.5;
    border: 1px solid #000;
}
circle {
    cursor: pointer;
    transition: all 800ms;
    -webkit-filter: drop-shadow( -5px -5px 5px #000 );
    filter: drop-shadow( -5px -5px 5px #000 );
}
text {
    cursor: pointer;
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}
.parlo{
    display:block !important;
}
.seatlist{
    display:block !important;
}


