/*######################################
// CARLOS SANTOS DE AZEVEDO
// Software: Medienberatungs-Tool
// Para: INVENTIO CONSULTING GMBH
// V.1, Setembro 2016 
//######################################*/

/* #F4B350 laranja */

/*F89406*/
/*body { font-family: "Montserrat", Helvetica, Arial, sans-serif; }*/



/*################################
butao Loader
#################################*/
.butao_loader{
    border: 3px solid #f3f3f3; /* Light grey */
    border-top: 3px solid #bed541; /* grun */
    border-radius: 50%;
    width: 20px;
    height: 20px;
    animation: spin 2s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}



.login_content form div a:hover {color:#F89406;}

#erro_msg{display:none; position:fixed;top:0px; z-indenx:999999; width:100%;-webkit-border-radius:  0px;
-moz-border-radius:  0px;
border-radius:  0px;}


.sidebar-footer a:hover{ color:#F89406;}



.login_content form input[type="text"]:focus, .login_content form input[type="email"]:focus, .login_content form input[type="password"]:focus {
    -ms-box-shadow: 0 0 2px #f39c12 inset;
    -o-box-shadow: 0 0 2px #f39c12 inset;
    box-shadow: 0 0 2px #f39c12 inset;
    background-color: #fff;
    border: 1px solid #f39c12;
    outline: none;
}






.thumbnail {
	height: auto;
	min-height:210px !important;
	overflow: hidden
   
}
.caption {
    padding: 9px 5px;
 background: none; 
	
}







/*AVATAR Minha conta*/

#avatar {width: 200px;
			height: 200px;
			border-radius:50%;
			background:rgba(179,179,179,1.00);
			position:relative;  
	       background-size: cover !important;cursor: pointer;
border: 2px solid #F1F1F1;
			padding:0px !important;
 overflow: hidden,
}





#logo_para_effekte{
min-width: 600px;
min-height: 360px;
background:rgba(179,179,179,1.00);
position:relative;  
background-position:50% 50%; background-size: 200px 200px;cursor: pointer;
border: 2px solid #F1F1F1;
padding:0px !important;
}






#cropContainerHeaderButton{
opacity:0;
left:-2px;
top:-2px;
width: 200px;
height: 200px;
border-radius:50%;
border: 2px solid #F1F1F1;
background:#fff;
position:absolute; 
-webkit-transition: all 1s ease;
transition: all 1s ease;
z-index:2;
text-align:center; 
padding:50px;
font-size:66px;
color:#F89406;
}

#cropContainerHeaderButton:hover{
	opacity:0.7; 
	border: 2px solid #F1F1F1;
}
/* FIM AVATAR*/





/* AVATAR IMAGEM CROPER */

.croppedImg{ border-radius:50%;} /* imagem que aparece depois de croped*/

#croppicModalObj > div.cropControls.cropControlsCrop i{ position:relative; padding-left:3px }
#croppicModalObj > div.cropControls.cropControlsCrop i:hover{ background:none !important}
.cropControls i {
    display: inline !important;
    float: none !important;
    margin: 0;
	margin-top:-2px !important;
	margin-left:10px !important;
	left:-2px !important;
    cursor: pointer;
    width: 32px !important;
    height: 29px!important;
    text-align: center;
    line-height: 20px;
    color: #FFF;
    font-size: 20px !important;
    font-weight: 300 !important;
    font-style: normal;
}




/*Coltrolos wraper*/
.cropControls {
    z-index: 2;
    position: absolute;
    height: 30px;
    display: block;
	padding-top:5px;
    top: -31px !important; 
	left:-2px;
    font-family: sans-serif;
    background-color: rgba(0,0,0,0.35);
}






/* Onde sera cortada a imagem*/
.cropImgWrapper{ border:#f39c12 dashed 2px;}






/*Coltrolos do crop*/
.cropControlZoomMuchIn:before{content: "\f000";font-family: FontAwesome;}
.cropControlZoomIn:before{content: "\f00e";font-family: FontAwesome;}
.cropControlZoomOut:before{content: "\f010";font-family: FontAwesome;}
.cropControlZoomMuchOut:before{content: "\f000";font-family: FontAwesome;}
.cropControlRotateLeft:before{content: "\f01e";font-family: FontAwesome;display: inline-block;}
.cropControlRotateLeft:before{  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";
  -webkit-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  transform: scale(-1, 1);}

.cropControlRotateRight:before{content: "\f01e";font-family: FontAwesome;}
.cropControlCrop:before{content: "\f00c"; font-family: FontAwesome; color:rgba(109,166,51,1.00)}
.cropControlReset:before{content: "\f00d";font-family: FontAwesome; color:#D90003;}
.cropControlRemoveCroppedImage:before{ display:none;}

/* FIM AVATAR IMAGEM CROPER*/






/* Criar clientes form*/
.form-control.has-feedback-left {
    padding-left: 55px;
}

/* Resultado Criar clientes form*/
#resultado > div a:hover{ color:#2A3F54}
.autocomplete-suggestion{ margin-top:20px;}



 

.sidebar-footer:hover{ cursor: pointer;}




/*********************
CALENDARIO
*********************/
.calendario_container{ position:relative; margin-top:25px; width:205px; margin-left:20px;}
.calendario_container .cabecalho {
	border-radius: 1em 1em 0 0;
	/*background: #e66b6b;*/
	background:#6C7A89;
	color: #fff;
	padding:10px;
	padding-bottom:16px;
	text-align:center;
}

.titulo_calendario {
	font-size: 20px;;
	font-weight: 700;
}
 

.calendario_inner {
	background: #fff;
	color: #555;
	display: inline-block;
	width:100%;
	height:80px;
	text-align:center;
}
div.calendario_inner  label.btn.btn-default{ padding-left:8px; padding-right:8px;}
div.calendario_inner label.btn.btn-primary.active{ padding-left:8px; padding-right:8px;}
div.calendario_inner label.btn.btn-primary{ padding-left:8px; padding-right:8px;}
 
 
 

.ring-left,
.ring-right {
	position: absolute;
	top:  36px;z-index:2 !important;
}

.ring-left { left: 2em; }
.ring-right { right: 2em; }

.ring-left:before,
.ring-left:after,
.ring-right:before,
.ring-right:after {
	background: #fff;
	border-radius: 4px;
	-webkit-box-shadow: 0 3px 1px rgba(0, 0, 0, .3), 0 -1px 1px rgba(0, 0, 0, .2);
	box-shadow: 0 3px 1px rgba(0, 0, 0, .3), 0 -1px 1px rgba(0, 0, 0, .2);
	content: "";
	display: inline-block;
	margin: 8px;
	height: 20px;
	width: 5px;
	z-index:2 !important;
}
 





div.calendario_inner  label.btn { height:80px; padding-top:30px; z-index:1 !important;
border-radius: 0 0 1em 1em;
	-webkit-box-shadow: 0 2px 1px rgba(0, 0, 0, .2), 0 3px 1px #fff;
	box-shadow: 0 2px 1px rgba(0, 0, 0, .2), 0 3px 1px #fff;}



/********************* FIM CALENDARIO *********************/

 












/********************* STEPS TABS Nova campanha *********************/
.tabs ul {
  list-style-type: none !important;
  margin-left:0px;
  padding-left:0px;
}
 
.tabs ul li {
font-size:20px;
position: relative;
z-index: 1;
display: block;
text-align: center;
background:#d6d6d6;
border-bottom: #F4B350 3px solid;
min-height:95px;
}

.tabs ul li:after { content:''; height:70%; width:1px; background:#FFFFFF; color:#FFFFFF; position:absolute; right:0px; top:20px}
.tabs ul li:last-child:after{ content:'';width:0px;}


.tabs ul li i {
font-size:30px;
}

  
nav > ul > li.active {
font-size:20px;
position: relative;
z-index: 1;
display: block;
text-align: center;
background:#FFF;
border-top:#d6d6d6 7px solid;
border-left:#d6d6d6 0px solid;
margin-left:-1px;
border-bottom: none;
}	
 
.tabs ul > li:nth-child(1).active {
font-size:20px;
position: relative;
z-index: 1;
display: block;
text-align: center;
background:#FFF;
border-top:#d6d6d6 7px solid;
border-left:#d6d6d6 7px solid;
border-bottom: none;
}
.tabs ul li.active:after { content:''; height:5px; background:#F4B350; top:0px; width:100%;}
.tabs ul li.active a{ color:#000; }
.tabs ul li.active a i{ color:#F89406; }
  
  
  
  

.tabs ul li a {
    overflow: visible;
    line-height: 1;
	padding-top:20px;
	padding-bottom:20px;
	color:#FFF;
    position: relative;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    
}


.novotabscontent{
	padding-top:30px;
}


/********************* FIM STEPS TABS Nova campanha *********************/





























/********************* STEPS TABS Zusammenfassung *********************/
 
.steps ul {
  list-style-type: none !important;
  margin-left:0px;
  padding-left:0px;
}
 
.steps ul li {
font-size:20px;
position: relative;
z-index: 1;
display: block;
text-align: center;
background:#2A3F54;
}
.steps ul li i {
font-size:30px;
}

  

.steps ul li a {
    overflow: visible;
    line-height: 1;
	padding-top:40px;
	padding-bottom:40px;
	color:#E1E1E2;
    position: relative;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    
}


 /*trianglo*/
.steps ul li:after{
width: 15px;
height: 128px;
-webkit-transform:rotate(360deg);
border-style: solid;
border-width: 64px 0 64px 20px;
border-color: transparent transparent transparent #2A3F54;
position:absolute;
 right:-26px;
 top:0px;
 content:'';
}
 
 
.steps hr{background: #2A3F54; height:50px; width:5px; margin-bottom:5px; margin-top:5px}
 
 
 
 /********************* FIM STEPS TABS Zusammenfassung *********************/
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
/********************* ICONS  *********************/
@font-face {
  font-family: 'icomoon';
  src:  url('icomoon.eot?z919om');
  src:  url('icomoon.eot?z919om#iefix') format('embedded-opentype'),
    url('icomoon.ttf?z919om') format('truetype'),
    url('icomoon.woff?z919om') format('woff'),
    url('icomoon.svg?z919om#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-store_mall_directory:before {
  content: "\e901";
}
/********************* FIM ICONS  *********************/








/********************* Über Ihr Unternehmen  *********************/
.uber_unternehmen_fotos_container .btn.btn-default.btn-xs{position:absolute; z-index:999;border-radius:0px;}
.foto_uber_unternehmer_container_einzeln{ padding-bottom:120px;max-height: 300px;}
.uber_unternehmen_fotos_container .img_preview{position:relative; overflow:hidden;width:200px;  border:1px #F7F7F7 solid; text-align:center;}
.uber_unternehmen_fotos_container .img_preview img{ max-width:200px; max-height:148px; margin:auto;}
.uber_unternehmen_fotos_container .form-group.has-feedback{padding-left:0px;}
.uber_unternehmen_fotos_container .form-control-feedback {width:23px;}


.uber_unternehmen_fotos_container textarea{width:100%; padding-left:40px; max-width:200px}


/********************* FIM Über Ihr Unternehmen  *********************/


























/********************* PAGINACAO   *********************/
.ul.paginacao {
    display: inline-block;
    padding: 0;
    margin: 0;
 
}

ul.paginacao li {display: inline;}

ul.paginacao li a {
    color: black;
    float: left;
    padding: 8px 16px;
    text-decoration: none;
    transition: background-color .3s;
}

ul.paginacao li a.active {
    background-color: #F89406;
    color: white;
}

ul.paginacao li a:hover:not(.active) {background-color: #ddd;}

/********************* FIM PAGINACAO   *********************/












/********************* Zusammenfassung   *********************/
.timeline h2.title a {
    color: #F4B350;
    font-weight: 700;
	font-size:20px;
}

.timeline .tag {
    display: block;
    font-size: 13px;
    padding: 8px;
    border-radius: 50%;
    height: 60px;
    width: 60px;
	margin-left:16px;
}


.timeline .tag span {
    display: block;
    overflow: hidden;
    width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
	font-size:36px;
	padding-left:4px;
	padding-top:2px;
	
}
.tag {
    line-height: 1;
    background: #D6D6D6;
    color: #fff !important;
}



/*seta*/
.tag:after {
	display:none;
    content: " ";
    height: 30px;
    width: 0;
    position: absolute;
    left: 100%;
    top: 0;
    margin: 0;
    pointer-events: none;
    border-top: 14px solid transparent;
    border-bottom: 14px solid transparent;
    border-left: 11px solid #F4B350;
}





/* titulo e bolinha cinza*/
.timeline h2.title {
    position: relative;
    font-size: 16px;
    margin: 0;
    margin-top: 26px;
	
}

.timeline h2.title a{color:#F4B350; font-weight: 700}



/********************* FIM Zusammenfassung   *********************/



/*** Chat ***/
.estado_offline_footer{ background:#BFBFBF;}
.estado_online_footer{ background:#26B99A;}
#footer_chat_container{ z-index:99999999999 !important; border-top:5px solid #2A3F54;border-left:5px solid #2A3F54;border-right:5px solid #2A3F54;}
/*** FIM Chat ***/






/*** Arquivo ***/
#arquivo_de_files_container{ width:100%;}
#arquivo_de_files_container .modal-dialog{ width:95% !important;}

/*** FIM Arquivo ***/






/********************* Mobil   *********************/
@media only screen and (max-width: 1400px) {
div.uber_unternehmen_fotos_container.col-md-6 > div { 
width: 50%;
	}
}

@media only screen and (max-width:  450px) {
div.uber_unternehmen_fotos_container.col-md-6 > div { 
width: 100%;
	}
}



/* logo effekte*/
@media only screen and (max-width: 1400px) {
#logo_effekte_container > div.x_content > div { 
width: 50%;
	}
}
/* Bilder hochgeladen für logo effekte*/
@media only screen and (max-width: 1400px) {
#uploaded_logos_container > div.x_content > div  { 
width: 50%;
	}
}
 
 
/* Videos logo entwurfe*/
@media only screen and (max-width: 1400px) {
.logo_entwurfe_widget  { 
width: 50%;
	}
}



/* iPad portrait*/
@media only screen and (max-width: 770px) {
.col-md-6,.ansprechpartner_container,.col-md-8, .avatar_user_edit, .col-md-12,#widget_container_meses,.col-md-4  { 
width: 100% !important;
	}
}

/*iPad landscape*/
@media only screen and (max-width: 1024px) {
.col-md-6,.ansprechpartner_container,.col-md-8, .avatar_user_edit   { 
width: 100% !important;
	}
}


/* Videos logo entwurfe*/
@media only screen and (max-width: 1400px) {
.ansprechpartner_container  { 
width: 33%;
	}
}



/********************* FIM Mobil   *********************/

