/*######################################
// CARLOS SANTOS DE AZEVEDO
// Software: Medienberatungs-Tool
// Para: Schaufensterclip GMBH
// V.1 März 2019 
//######################################*/

/* #F4B350 laranja */

/*F89406*/

body { 
    animation-name: fadeIn;
    animation-iteration-count: 1;
    animation-timing-function: ease-in-out;
    animation-duration: 0.5s;
    animation-fill-mode:forwards;
  
}
.panel_toolbox a.collapse-link, .panel_toolbox a.close-link{
    display: none;
}


tbody tr:nth-child(odd){
    background-color: #f8f8f8;
  }
 



@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}


.verde{ color: #a3b357}
.vermelho{color:#d64541}
.laranja{ color: #f89406}
.azul{color: #42a6f0}


/*################################
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); }
}




.form-control  {
    border-radius: 8px; 
    height: inherit; 
    border: 1px;
    background-color: #ecf0f194;  
    border: 1px solid #ececec;
    }
 


#erro_msg{display:none; position:fixed;top:0px; z-index:999999; width:100%;-webkit-border-radius:  0px;
-moz-border-radius:  0px;
border-radius:  0px;}


.thumbnail {
	height: auto;
	min-height:210px !important;
    overflow: hidden;
}
.caption {
    padding: 9px 5px;
 background: none; 
}
 


.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;
}





/*AVATAR Minha conta*/

#avatar {width: 200px;
			height: 200px !important;
			border-radius:50%;
			background:rgba(179,179,179,1.00);
			position:relative;  

background-repeat:no-repeat !important;
background-size: cover !important; 
cursor: pointer;
border: 2px solid #F1F1F1;
padding:0px !important;
 
}



#cropContainerHeaderButton {
    opacity: 0;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    border: 2px solid #F1F1F1;
    background: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* Center the overlay */
    transition: all 1s ease;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    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;}




/*Notificacoes*/
ul.msg_list li { position:relative}






.editar_usuario_container .btn-group .btn-default{
	padding: 5px;
	padding-right: 10px;
	border-radius: 2px;
	font-size: 13px;
    border-radius: 5px;
}

















/********************* PAGINACAO   *********************/
ul.paginacao {
    /*display: inline-block;
    padding: 0px;
    margin: 0;  */
    display: flex; flex-wrap: nowrap; overflow-x: auto; padding-bottom:25px;
}

  
ul.paginacao li:first-of-type  { margin-left:-30px;}

ul.paginacao li {display: inline; }

ul.paginacao li a {
    color: black;
    float: left;
    padding: 8px 14px;
    text-decoration: none;
    transition: background-color .3s; 
    border-radius: 7px;
    background: #efefef;
}

ul.paginacao li a:first-of-type { 
    margin-left:  -8px; 
}

ul.paginacao li a.active {
    background-color: #F89406;
    color: white;
    border-radius: 4px;
}

ul.paginacao li a:hover:not(.active) {background-color: #ddd;}

/********************* FIM PAGINACAO   *********************/








/********************* 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  *********************/







/********************* 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   *********************/












#notas_textarea {
 background: url(../img/note.png?a=q);
 width: 100%; 
 height: 350px;
 font: normal 14px verdana;
 line-height: 25px;
 padding: 2px 15px;
 border: solid 1px #ddd;
    border-radius: 10px;
}


#notas_textarea:focus { border:none;outline: none !important;}


#ultimos_videos_lista{ height: 350px; overflow:auto;}















/* HR novo*/

hr.novo_hr {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(160, 160, 160, 0.55), rgba(0, 0, 0, 0));
	margin-top: 5px;
margin-bottom: 5px;
}



/* Minha border*/
.minha_border{
      background: #eee;
      border: 4px solid white;
      box-shadow: 0 0 1px rgba(0,0,0, .4);
    }






/*######################################
// PRight Sidebar Todo
//#####################################*/

.loader_card{position: absolute;
 
    top: 0;
    left: 0;
    right: 0;
	height:100%;
	width:100%;
 

background:rgba(255,255,255,0.5);
background-image: url('load.svg');
background-repeat: no-repeat;
background-position: center; 
z-index:999999;
 

}

#fechar_todo{ /* Cruz para fechar o sidebar*/
    position: absolute;
    z-index: 2;
    top: -5px;
	padding-left: 15px;
    font-size: 36px;
 
}


 .control-sidebar-bg, .control-sidebar {
    width: 50%;
	 top: 0; 
	 right:-50%;
    -webkit-transition: right .3s ease-in-out;
    -o-transition: right .3s ease-in-out;
    transition: right .3s ease-in-out; 
	 
}



.control-sidebar {
    position: fixed;
    padding-top:  0px;
    z-index: 99999;
	overflow-y: auto;
	height: 100%;
	 

}




.control-sidebar ul{
list-style-type: none;
}
 



 /* classes para as Transicoes*/
.todo-list-aberta{right: 0px;
transition-timing-function: cubic-bezier(.17,.67,.13,1.16);
transition-duration: 0.6s;
}/*para  abrir sidebar*/
.body-todo-list-aberta{margin-right: 50%; }/*para arrastar o body ao abrir sidebar*/
/*
body{
transition-timing-function: cubic-bezier(.17,.67,.13,1.16);
transition-duration: 0.6s;
}
*/


/* iPad portrait*/
@media only screen and (max-width: 1024px) {
 .control-sidebar-bg, .control-sidebar {
    width: 100%;
	 top: 0; 
	 right:-100%;
    -webkit-transition: right .3s ease-in-out;
    -o-transition: right .3s ease-in-out;
    transition: right .3s ease-in-out; 
	 
}
	
.todo-list-aberta{right: 0px;
transition-timing-function: cubic-bezier(.17,.67,.13,1.16);
transition-duration: 0.6s;
	z-index: 99999;
}/*para  abrir sidebar*/
.body-todo-list-aberta{margin-right: 50%; }/*para arrastar o body ao abrir sidebar*/
body{
transition-timing-function: cubic-bezier(.17,.67,.13,1.16);
transition-duration: 0.6s;
}

}
	
 







.control-sidebar>.tab-content {
    padding:  15px  15px 0px 0px
}

 


 


.control-sidebar-dark, .control-sidebar-dark+.control-sidebar-bg {
  /*  background: #222d32;*/
background: #2A3F54;
}


a#todo_list_tab, .active a#todo_list_tab {
    border-left-color: #2A3F54;
    border-bottom-color: #2A3F54;
	border-top-color: #2A3F54;
}


/*To-do list tab*/
a#todo_list_tab, .active a#todo_list_tab {background:#2A3F54;color: aliceblue; }




/*add new to-do*/
 .control-sidebar .btn-xspull-right .btn-primary,  .control-sidebar .btn-xspull-right .btn-primary:hover {
    text-decoration: none;
    background-color: #ffffff;
	 background: #ffffff;color:#333;
}

.control-sidebar #add-to-list{ padding-left: 20px;}

 
.control-sidebar-tabs a{ border-radius: 0px !important;}

.control-sidebar-dark {
    color: #b8c7ce;
}


 
 
.control-sidebar textarea.form-control {
    height: 250px;
}

.control-sidebar #form_add_todo button{
	border: 0px;
	border-radius: 0px;
}



.control-sidebar div.box {
	position: relative;
	border: 0px;
	box-sizing: border-box;
	border-radius: 3px;
    background: #ffffff;
    border-top: 3px solid #d2d6de;
	border-bottom: 1px solid #ccc;
    height: auto;
	width: 100%;
	padding-top: 10px;
    padding: 10px;
	margin-bottom: 20px;
    overflow: hidden;
	box-shadow: 0 1px 1px rgba(0,0,0,0.1);
    background-color: #ffffff;
}







.box-body {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    padding: 10px;
}
 


/*######################################
// To do List
//#####################################*/

.todo-list ul {list-style-type: none;}

.todo-list {
    margin: 0;
    padding: 10px 5px 5px 20px;
    list-style: none;
}


.todo-list .handle {
    display: inline-block;
    cursor: move;
    margin: 0 5px;
	font-size:14px;
}

.todo-list>li {
    border-radius: 2px;
	padding-top: 5px;
	padding-bottom: 8px;
    background: #f4f4f4;
    margin-bottom: 4px;
    border-left: 2px solid #e6e7e8;
    color: #444;
	width: 100%;
}




.todo-list>li .tools {
	display: none;
    float: right;
    color: #dd4b39;
	padding-right: 10px;
	font-size: 14px;
	cursor:pointer;
	  -webkit-transition: right .3s ease-in-out;
    -o-transition: right .3s ease-in-out;
    transition: right .3s ease-in-out;
}

.todo-list>li:hover .tools{
	display: block;
    float: right;
    color: #dd4b39;
}







 .todo-list>li .label {
    margin-left:  3px;
    font-size: 9px;
	border-radius: 0px;
}



.todo-list>li.done .label {
    background: #d2d6de !important;
}
.todo-list>li.done .text {
    text-decoration: line-through;
    font-weight: 500;
}
.todo-list>li.done {
    color: #999;
}



.todo-list>li .text {
    display: inline-block;
	margin-top: 5px;
    margin-left: 5px;
    font-weight: 500;
	font-size: 12px;
	overflow-wrap: break-word;
	word-wrap: break-word;
 	word-break: break-word;
 
}




 .todo-list>li>input[type='checkbox'] {
    margin: 0  0px 0 5px;
}


 

.noty_theme__mint.noty_bar .noty_body {
	font-weight: 400; color: #fff;
}




#todo_qty_container {
    font-size: 10px;
	width: 20px;
	height: 20px;
    font-weight: normal;
    line-height: 13px;
    padding: 3px 2px;
    position: absolute;
    right: 2px;
    top: 6px;
	border-radius:  50%;
}
#abrir_todo-list { padding-right: 20px}

#todo_container{ overflow-y: auto !important; -webkit-overflow-scrolling: touch; max-height: 730px}


 


.wichtig_to_do_class{
	background: #BFD641 !important;
 border-left:5px #fff solid !important;
}



/*######################################
// End To do List
//#####################################*/















 
/********************* 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 landscape*/
@media only screen and (max-width: 1024px) {
.col-md-6,.ansprechpartner_container,.avatar_user_edit   { 
width: 100% !important;
	}
}


/* iPad portrait*/
@media only screen and (max-width: 900px) {
.col-md-6,.ansprechpartner_container,.col-md-8, .avatar_user_edit, .col-md-12,#widget_container_meses,.col-md-4  { 
width: 100% !important;
 padding: 0px;
 }


 .newsletter_ohne_erfolg_container > div {
    max-width: 95% !important;
    margin-left: 5% !important;
    margin-bottom: 12px; 
 }
.newsletter_ohne_erfolg_container > div  > div > div.col-md-8.laranja{
    padding-left: 10px !important;
    padding-top: 5px !important;
}


 
    .col-md-12,.col-md-8,.col-sm-6,.col-xs-12 { padding-left: 0px !important; padding-right: 0px !important} 
    
    
.nav-md .container.body .right_col,.container{padding:0px !important;}
    .x_panel{ margin-top: 60px; padding: 2px;}   
    .x_content{ overflow-x: auto;}
    body{padding:0px !important;}
    
    /*Termin Calender*/
    #controls{ margin-top:0px !important} 
    #termicalender-h2{ visibility: hidden;}
    #calendar > div.ui-cal-resourceline > div > p{ padding-top: 5px; min-width: 100px !important}
    #calendar > div.ui-cal-resourceline > div span.hidden-xs{ display: none}
    
    #database_list_result_terminplaner > table  th,
    #database_list_result_auftrage_protokolle >  table  th,
    #database_list_result_done > table  th,
    #database_list_result >  table  th,
    #database_list_result_abgelehnte_dashboard >  table  th,
     #database_list_result_disposition_neumontage > table  th,
    #database_list_result_disposition_neumontage_vereinbart >table  th,
    #database_list_result_disposition_service > table  th,
    #database_list_result_disposition_service_vereinbart > table  th,
    #database_list_result_disposition_demontage > table  th,
    #database_list_result_disposition_demontage_vereinbart > table  th,
    #database_list_result_disposition_rechtsstreit > table  th
    { min-width: 120px;}
    
    #database_list_result_disposition_rechtsstreit > table  th:last-child{ min-width: 300px;}
    #database_list_result_disposition_demontage > table  th:last-child{ min-width: 300px;}
    #database_list_result_disposition_demontage_vereinbart > table  th:last-child{ min-width: 300px;}
    #database_list_result_disposition_service_vereinbart > table  th:last-child{ min-width: 300px;}
    #database_list_result_disposition_service > table  th:last-child{ min-width: 300px;}
    #database_list_result_disposition_neumontage_vereinbart > table  th:last-child{ min-width: 300px;}
    #database_list_result_disposition_neumontage > table  th:last-child{ min-width: 300px;}
    #database_list_result_done > table  th:last-child{ min-width: 300px;}
    #database_list_result >  table  th:last-child{ min-width: 400px !important;}
    #database_list_result_qm_done > table  th:last-child{ min-width:350px !important;}
    #database_list_result_auftrage_protokolle >  table  th:last-child{ min-width: 170px;}
    #database_list_result_abgelehnte_dashboard >  table  th:last-child{ min-width: 270px;}
    #database_list_result_terminplaner > table  th:nth-last-child(2){ min-width: 250px;}
    #database_list_result_interessanten > table  th:nth-last-child(2){ min-width: 290px;}
    #database_list_result_disposition_done >  table  th:last-child{ min-width: 350px;}

    .rating-carlos { width: 100% !important;}
    
    .modal_audios_mobile .modal-dialog{ width: 99.8% !important; margin-left: 0px; }
}   



@media only screen and (max-width:  450px) {
#controls{ margin-right:-13px !important } 
#form_container > div > div.x_content > div.ui-cal-dateline  p{ margin-left:-2px;}   
 #controls li button { min-width: 30px !important;}   
}








 

/* Videos logo entwurfe*/
@media only screen and (max-width: 1400px) {
.ansprechpartner_container  { 
width: 33%;
	}
}










.nav-sm .container.body .col-md-3.left_col,.nav-sm .navbar.nav_title  {
 
    width: 135px;
  
}

.nav-sm .nav.side-menu li a i {
    font-size: 16px !important;
    text-align: center;
    width: 100% !important;
    margin-bottom: 5px;
}

.nav-sm .nav.side-menu li a{
   word-break: break-all !important;
    font-size: 9px !important;
}

.nav-sm   .profile{
    display: block !important;
}

.nav-sm   .profile_info{
    display: none !important;
}
.nav-sm  .profile_pic {
    width:50% !important; 
    margin-top:10px !important;
    margin-left: 25px
}

body.nav-sm{
    position: relative;
}
 
 body.nav-sm::before {
    content:"";
    display: block;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.8);
     z-index: 99;
}

.nav-sm .nav.side-menu li:last-child {
    border-bottom: 1px solid #5c5f7c;
}

.nav-sm .nav.side-menu li {
   padding-top: 10px !important;
    padding-bottom: 10px !important;
}
.nav-sm .menu_section {
   margin-top: 0px !important;
}


/********************* FIM Mobil   *********************/







/***********************************/
/*  Animation
/***********************************/
.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}

.animated.infinite {
  animation-iteration-count: infinite;
}

.animated.hinge {
  animation-duration: 2s;
}

.animated.flipOutX,
.animated.flipOutY,
.animated.bounceIn,
.animated.bounceOut {
  animation-duration: .75s;
}






.meu-pulse {
  
  border-radius: 100%;
  background: #f4f4f4;
  cursor: pointer;
  box-shadow:0 0 0 0 rgba(255,0,0, 0.4);
  animation: meu-pulse  2s infinite;
 
}
.meu-pulse:hover {
  animation: none;
}

@-webkit-keyframes meu-pulse {
  0% {
    -webkit-box-shadow:0 0 0 0 rgba(255,0,0, 0.5);
  }
  70% {
      -webkit-box-shadow:0 0 0 10px rgba(255,0,0, 0);
  }
  100% {
      -webkit-box-shadow: 0 0 0 0 rgba(255,0,0, 0);
  }
}
@keyframes meu-pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(255,0,0, 0.5);
    box-shadow: 0 0 0 0 rgba(255,0,0, 0.4);
  }
  70% {
      -moz-box-shadow: 0 0 0 10px rgba(255,0,0, 0);
      box-shadow: 0 0 0 10px rgba(255,0,0, 0);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(255,0,0, 0);
      box-shadow: 0 0 0 0 rgba(255,0,0, 0);
  }
}








.dot-pulse {
 
  width: 20px;
  height: 20px;
  text-align:center;
  border-radius: 10%;
  background: #dd5353; 
  box-shadow: 0 0 0 rgba(204,169,44, 0.4);
  animation: dot-pulse 2s infinite;
}
.pulse:hover {
  animation: none;
}

@-webkit-keyframes dot-pulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(255,0,0, 0.4);
  }
  70% {
      -webkit-box-shadow: 0 0 0 10px rgba(255,0,0, 0);
  }
  100% {
      -webkit-box-shadow: 0 0 0 0 rgba(255,0,0, 0);
  }
}
@keyframes dot-pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(255,0,0, 0.4);
    box-shadow: 0 0 0 0 rgba(255,0,0, 0.4);
  }
  70% {
      -moz-box-shadow: 0 0 0 10px rgba(255,0,0, 0);
      box-shadow: 0 0 0 10px rgba(255,0,0, 0);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(255,0,0, 0);
      box-shadow: 0 0 0 0 rgba(255,0,0, 0);
  }
}







.dot-pulse-vermelho {
  width: 25px;
  height: 25px; 
  text-align:center;
  border-radius: 10%;
  background: #e74c3c !important;
	color: #fff;
	 
}

.dot-pulse-verde-desativado {
  width: 25px;
  height: 25px; 
  text-align:center;
  border-radius: 10%;
  background: #888 !important;
	color: #fff;
	
}

.dot-pulse-verde {
  width: 25px;
  height: 25px; 
  text-align:center;
  border-radius: 10%;
  background: #a3b357;
	color: #fff;
  box-shadow: 0 0 0 rgba(204,169,44, 0.4); 
  animation: dot-pulse-verde 2s infinite;
}
.pulse:hover {
  animation: none;
}

@-webkit-keyframes dot-pulse-verde {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(163,179,87, 0.4);
  }
  70% {
      -webkit-box-shadow: 0 0 0 10px rgba(163,179,87, 0);
  }
  100% {
      -webkit-box-shadow: 0 0 0 0 rgba(163,179,87, 0);
  }
}
@keyframes dot-pulse-verde {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(163,179,87, 0.4);
    box-shadow: 0 0 0 0 rgba(163,179,87, 0.4);
  }
  70% {
      -moz-box-shadow: 0 0 0 10px rgba(163,179,87, 0);
      box-shadow: 0 0 0 10px rgba(163,179,87, 0);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(163,179,87, 0);
      box-shadow: 0 0 0 0 rgba(163,179,87, 0);
  }
}











.alert-success {
    color: #ffffff;
    background-color: #bed541;
    border-color: #bed541;
}



.nav li a{
    opacity: 0.9;
} 
 
.nav-md .nav li a > i{
    font-size: 13px;
    margin-right: 5px
} 

.nav-md #sidebar-menu li{
    font-size: 12px;
     color: #fff;
     border: none; 
        margin: 0;
        text-decoration: none;
}

.nav li.current-page a {
     opacity: 1;
     color: #fff;
    
} 
.nav li.current-page  {
    background: rgba(255, 255, 255, 0.1); 
} 

.nav li:hover {
    background: rgba(255, 255, 255, 0.2); 
} 


.main_menu span.fal,.main_menu span.fas,.main_menu span.fad,.main_menu span.far {
    float: right;
    text-align: center;
    margin-top: 5px;
    font-size: 11px;
    min-width: inherit;
    color: #C4CFDA;
}






@keyframes bounce{20%,53%,80%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1);transform:translate3d(0,0,0)}40%,43%{animation-timing-function:cubic-bezier(.755,.050,.855,.060);transform:translate3d(0,-30px,0)}70%{animation-timing-function:cubic-bezier(.755,.050,.855,.060);transform:translate3d(0,-15px,0)}90%{transform:translate3d(0,-4px,0)}}.bounce{animation-name:bounce;transform-origin:center bottom}@keyframes flash{50%,from,to{opacity:1}25%,75%{opacity:0}}.flash{animation-name:flash}@keyframes pulse{from,to{transform:scale3d(1,1,1)}50%{transform:scale3d(1.05,1.05,1.05)}}.pulse{animation-name:pulse}@keyframes rubberBand{from,to{transform:scale3d(1,1,1)}30%{transform:scale3d(1.25,.75,1)}40%{transform:scale3d(.75,1.25,1)}50%{transform:scale3d(1.15,.85,1)}65%{transform:scale3d(.95,1.05,1)}75%{transform:scale3d(1.05,.95,1)}}.rubberBand{animation-name:rubberBand}@keyframes shake{from,to{transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{transform:translate3d(-10px,0,0)}20%,40%,60%,80%{transform:translate3d(10px,0,0)}}.shake{animation-name:shake}@keyframes headShake{0%{transform:translateX(0)}6.5%{transform:translateX(-6px) rotateY(-9deg)}18.5%{transform:translateX(5px) rotateY(7deg)}31.5%{transform:translateX(-3px) rotateY(-5deg)}43.5%{transform:translateX(2px) rotateY(3deg)}50%{transform:translateX(0)}}.headShake{animation-timing-function:ease-in-out;animation-name:headShake}@keyframes swing{20%{transform:rotate3d(0,0,1,15deg)}40%{transform:rotate3d(0,0,1,-10deg)}60%{transform:rotate3d(0,0,1,5deg)}80%{transform:rotate3d(0,0,1,-5deg)}to{transform:rotate3d(0,0,1,0deg)}}.swing{transform-origin:top center;animation-name:swing}@keyframes tada{from,to{transform:scale3d(1,1,1)}10%,20%{transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)}30%,50%,70%,90%{transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)}40%,60%,80%{transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)}}.tada{animation-name:tada}@keyframes wobble{from,to{transform:none}15%{transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)}30%{transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg)}45%{transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)}60%{transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg)}75%{transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)}}.wobble{animation-name:wobble}@keyframes jello{11.1%,from,to{transform:none}22.2%{transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{transform:skewX(6.25deg) skewY(6.25deg)}44.4%{transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{transform:skewX(-.78125deg) skewY(-.78125deg)}77.7%{transform:skewX(.390625deg) skewY(.390625deg)}88.8%{transform:skewX(-.1953125deg) skewY(-.1953125deg)}}.jello{animation-name:jello;transform-origin:center}@keyframes bounceIn{20%,40%,60%,80%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:scale3d(.3,.3,.3)}20%{transform:scale3d(1.1,1.1,1.1)}40%{transform:scale3d(.9,.9,.9)}60%{opacity:1;transform:scale3d(1.03,1.03,1.03)}80%{transform:scale3d(.97,.97,.97)}to{opacity:1;transform:scale3d(1,1,1)}}.bounceIn{animation-name:bounceIn}@keyframes bounceInDown{60%,75%,90%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,-3000px,0)}60%{opacity:1;transform:translate3d(0,25px,0)}75%{transform:translate3d(0,-10px,0)}90%{transform:translate3d(0,5px,0)}to{transform:none}}.bounceInDown{animation-name:bounceInDown}@keyframes bounceInLeft{60%,75%,90%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(-3000px,0,0)}60%{opacity:1;transform:translate3d(25px,0,0)}75%{transform:translate3d(-10px,0,0)}90%{transform:translate3d(5px,0,0)}to{transform:none}}.bounceInLeft{animation-name:bounceInLeft}@keyframes bounceInRight{60%,75%,90%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}from{opacity:0;transform:translate3d(3000px,0,0)}60%{opacity:1;transform:translate3d(-25px,0,0)}75%{transform:translate3d(10px,0,0)}90%{transform:translate3d(-5px,0,0)}to{transform:none}}.bounceInRight{animation-name:bounceInRight}@keyframes bounceInUp{60%,75%,90%,from,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}from{opacity:0;transform:translate3d(0,3000px,0)}60%{opacity:1;transform:translate3d(0,-20px,0)}75%{transform:translate3d(0,10px,0)}90%{transform:translate3d(0,-5px,0)}to{transform:translate3d(0,0,0)}}.bounceInUp{animation-name:bounceInUp}@keyframes bounceOut{20%{transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;transform:scale3d(1.1,1.1,1.1)}to{opacity:0;transform:scale3d(.3,.3,.3)}}.bounceOut{animation-name:bounceOut}@keyframes bounceOutDown{20%{transform:translate3d(0,10px,0)}40%,45%{opacity:1;transform:translate3d(0,-20px,0)}to{opacity:0;transform:translate3d(0,2000px,0)}}.bounceOutDown{animation-name:bounceOutDown}@keyframes bounceOutLeft{20%{opacity:1;transform:translate3d(20px,0,0)}to{opacity:0;transform:translate3d(-2000px,0,0)}}.bounceOutLeft{animation-name:bounceOutLeft}@keyframes bounceOutRight{20%{opacity:1;transform:translate3d(-20px,0,0)}to{opacity:0;transform:translate3d(2000px,0,0)}}.bounceOutRight{animation-name:bounceOutRight}@keyframes bounceOutUp{20%{transform:translate3d(0,-10px,0)}40%,45%{opacity:1;transform:translate3d(0,20px,0)}to{opacity:0;transform:translate3d(0,-2000px,0)}}.bounceOutUp{animation-name:bounceOutUp}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.fadeIn{animation-name:fadeIn}@keyframes fadeInDown{from{opacity:0;transform:translate3d(0,-100%,0)}to{opacity:1;transform:none}}.fadeInDown{animation-name:fadeInDown}@keyframes fadeInDownBig{from{opacity:0;transform:translate3d(0,-2000px,0)}to{opacity:1;transform:none}}.fadeInDownBig{animation-name:fadeInDownBig}@keyframes fadeInLeft{from{opacity:0;transform:translate3d(-100%,0,0)}to{opacity:1;transform:none}}.fadeInLeft{animation-name:fadeInLeft}@keyframes fadeInLeftBig{from{opacity:0;transform:translate3d(-2000px,0,0)}to{opacity:1;transform:none}}.fadeInLeftBig{animation-name:fadeInLeftBig}@keyframes fadeInRight{from{opacity:0;transform:translate3d(100%,0,0)}to{opacity:1;transform:none}}.fadeInRight{animation-name:fadeInRight}@keyframes fadeInRightBig{from{opacity:0;transform:translate3d(2000px,0,0)}to{opacity:1;transform:none}}.fadeInRightBig{animation-name:fadeInRightBig}@keyframes fadeInUp{from{opacity:0;transform:translate3d(0,100%,0)}to{opacity:1;transform:none}}.fadeInUp{animation-name:fadeInUp}@keyframes fadeInUpBig{from{opacity:0;transform:translate3d(0,2000px,0)}to{opacity:1;transform:none}}.fadeInUpBig{animation-name:fadeInUpBig}@keyframes fadeOut{from{opacity:1}to{opacity:0}}.fadeOut{animation-name:fadeOut}@keyframes fadeOutDown{from{opacity:1}to{opacity:0;transform:translate3d(0,100%,0)}}.fadeOutDown{animation-name:fadeOutDown}@keyframes fadeOutDownBig{from{opacity:1}to{opacity:0;transform:translate3d(0,2000px,0)}}.fadeOutDownBig{animation-name:fadeOutDownBig}@keyframes fadeOutLeft{from{opacity:1}to{opacity:0;transform:translate3d(-100%,0,0)}}.fadeOutLeft{animation-name:fadeOutLeft}@keyframes fadeOutLeftBig{from{opacity:1}to{opacity:0;transform:translate3d(-2000px,0,0)}}.fadeOutLeftBig{animation-name:fadeOutLeftBig}@keyframes fadeOutRight{from{opacity:1}to{opacity:0;transform:translate3d(100%,0,0)}}.fadeOutRight{animation-name:fadeOutRight}@keyframes fadeOutRightBig{from{opacity:1}to{opacity:0;transform:translate3d(2000px,0,0)}}.fadeOutRightBig{animation-name:fadeOutRightBig}@keyframes fadeOutUp{from{opacity:1}to{opacity:0;transform:translate3d(0,-100%,0)}}.fadeOutUp{animation-name:fadeOutUp}@keyframes fadeOutUpBig{from{opacity:1}to{opacity:0;transform:translate3d(0,-2000px,0)}}.fadeOutUpBig{animation-name:fadeOutUpBig}@keyframes flip{from{transform:perspective(400px) rotate3d(0,1,0,-360deg);animation-timing-function:ease-out}40%{transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);animation-timing-function:ease-out}50%{transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);animation-timing-function:ease-in}80%{transform:perspective(400px) scale3d(.95,.95,.95);animation-timing-function:ease-in}to{transform:perspective(400px);animation-timing-function:ease-in}}.animated.flip{-webkit-backface-visibility:visible;backface-visibility:visible;animation-name:flip}@keyframes flipInX{from{transform:perspective(400px) rotate3d(1,0,0,90deg);animation-timing-function:ease-in;opacity:0}40%{transform:perspective(400px) rotate3d(1,0,0,-20deg);animation-timing-function:ease-in}60%{transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1}80%{transform:perspective(400px) rotate3d(1,0,0,-5deg)}to{transform:perspective(400px)}}.flipInX{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;animation-name:flipInX}.flipInY,.flipOutX{-webkit-backface-visibility:visible!important}@keyframes flipInY{from{transform:perspective(400px) rotate3d(0,1,0,90deg);animation-timing-function:ease-in;opacity:0}40%{transform:perspective(400px) rotate3d(0,1,0,-20deg);animation-timing-function:ease-in}60%{transform:perspective(400px) rotate3d(0,1,0,10deg);opacity:1}80%{transform:perspective(400px) rotate3d(0,1,0,-5deg)}to{transform:perspective(400px)}}.flipInY{backface-visibility:visible!important;animation-name:flipInY}@keyframes flipOutX{from{transform:perspective(400px)}30%{transform:perspective(400px) rotate3d(1,0,0,-20deg);opacity:1}to{transform:perspective(400px) rotate3d(1,0,0,90deg);opacity:0}}.flipOutX{animation-name:flipOutX;backface-visibility:visible!important}@keyframes flipOutY{from{transform:perspective(400px)}30%{transform:perspective(400px) rotate3d(0,1,0,-15deg);opacity:1}to{transform:perspective(400px) rotate3d(0,1,0,90deg);opacity:0}}.flipOutY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;animation-name:flipOutY}@keyframes lightSpeedIn{from{transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{transform:skewX(20deg);opacity:1}80%{transform:skewX(-5deg);opacity:1}to{transform:none;opacity:1}}.lightSpeedIn{animation-name:lightSpeedIn;animation-timing-function:ease-out}@keyframes lightSpeedOut{from{opacity:1}to{transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}.lightSpeedOut{animation-name:lightSpeedOut;animation-timing-function:ease-in}@keyframes rotateIn{from{transform-origin:center;transform:rotate3d(0,0,1,-200deg);opacity:0}to{transform-origin:center;transform:none;opacity:1}}.rotateIn{animation-name:rotateIn}@keyframes rotateInDownLeft{from{transform-origin:left bottom;transform:rotate3d(0,0,1,-45deg);opacity:0}to{transform-origin:left bottom;transform:none;opacity:1}}.rotateInDownLeft{animation-name:rotateInDownLeft}@keyframes rotateInDownRight{from{transform-origin:right bottom;transform:rotate3d(0,0,1,45deg);opacity:0}to{transform-origin:right bottom;transform:none;opacity:1}}.rotateInDownRight{animation-name:rotateInDownRight}@keyframes rotateInUpLeft{from{transform-origin:left bottom;transform:rotate3d(0,0,1,45deg);opacity:0}to{transform-origin:left bottom;transform:none;opacity:1}}.rotateInUpLeft{animation-name:rotateInUpLeft}@keyframes rotateInUpRight{from{transform-origin:right bottom;transform:rotate3d(0,0,1,-90deg);opacity:0}to{transform-origin:right bottom;transform:none;opacity:1}}.rotateInUpRight{animation-name:rotateInUpRight}@keyframes rotateOut{from{transform-origin:center;opacity:1}to{transform-origin:center;transform:rotate3d(0,0,1,200deg);opacity:0}}.rotateOut{animation-name:rotateOut}@keyframes rotateOutDownLeft{from{transform-origin:left bottom;opacity:1}to{transform-origin:left bottom;transform:rotate3d(0,0,1,45deg);opacity:0}}.rotateOutDownLeft{animation-name:rotateOutDownLeft}@keyframes rotateOutDownRight{from{transform-origin:right bottom;opacity:1}to{transform-origin:right bottom;transform:rotate3d(0,0,1,-45deg);opacity:0}}.rotateOutDownRight{animation-name:rotateOutDownRight}@keyframes rotateOutUpLeft{from{transform-origin:left bottom;opacity:1}to{transform-origin:left bottom;transform:rotate3d(0,0,1,-45deg);opacity:0}}.rotateOutUpLeft{animation-name:rotateOutUpLeft}@keyframes rotateOutUpRight{from{transform-origin:right bottom;opacity:1}to{transform-origin:right bottom;transform:rotate3d(0,0,1,90deg);opacity:0}}.rotateOutUpRight{animation-name:rotateOutUpRight}@keyframes hinge{0%{transform-origin:top left;animation-timing-function:ease-in-out}20%,60%{transform:rotate3d(0,0,1,80deg);transform-origin:top left;animation-timing-function:ease-in-out}40%,80%{transform:rotate3d(0,0,1,60deg);transform-origin:top left;animation-timing-function:ease-in-out;opacity:1}to{transform:translate3d(0,700px,0);opacity:0}}.hinge{animation-name:hinge}@keyframes jackInTheBox{from{opacity:0;transform:scale(.1) rotate(30deg);transform-origin:center bottom}50%{transform:rotate(-10deg)}70%{transform:rotate(3deg)}to{opacity:1;transform:scale(1)}}.jackInTheBox{animation-name:jackInTheBox}@keyframes rollIn{from{opacity:0;transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)}to{opacity:1;transform:none}}.rollIn{animation-name:rollIn}@keyframes rollOut{from{opacity:1}to{opacity:0;transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)}}.rollOut{animation-name:rollOut}@keyframes zoomIn{from{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}.zoomIn{animation-name:zoomIn}@keyframes zoomInDown{from{opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,60px,0);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInDown{animation-name:zoomInDown}@keyframes zoomInLeft{from{opacity:0;transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(10px,0,0);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInLeft{animation-name:zoomInLeft}@keyframes zoomInRight{from{opacity:0;transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInRight{animation-name:zoomInRight}@keyframes zoomInUp{from{opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInUp{animation-name:zoomInUp}@keyframes zoomOut{from{opacity:1}50%{opacity:0;transform:scale3d(.3,.3,.3)}to{opacity:0}}.zoomOut{animation-name:zoomOut}@keyframes zoomOutDown{40%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform-origin:center bottom;animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomOutDown{animation-name:zoomOutDown}@keyframes zoomOutLeft{40%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}to{opacity:0;transform:scale(.1) translate3d(-2000px,0,0);transform-origin:left center}}.zoomOutLeft{animation-name:zoomOutLeft}@keyframes zoomOutRight{40%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}to{opacity:0;transform:scale(.1) translate3d(2000px,0,0);transform-origin:right center}}.zoomOutRight{animation-name:zoomOutRight}@keyframes zoomOutUp{40%{opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,60px,0);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform-origin:center bottom;animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomOutUp{animation-name:zoomOutUp}@keyframes slideInDown{from{transform:translate3d(0,-100%,0);visibility:visible}to{transform:translate3d(0,0,0)}}.slideInDown{animation-name:slideInDown}@keyframes slideInLeft{from{transform:translate3d(-100%,0,0);visibility:visible}to{transform:translate3d(0,0,0)}}.slideInLeft{animation-name:slideInLeft}@keyframes slideInRight{from{transform:translate3d(100%,0,0);visibility:visible}to{transform:translate3d(0,0,0)}}.slideInRight{animation-name:slideInRight}@keyframes slideInUp{from{transform:translate3d(0,100%,0);visibility:visible}to{transform:translate3d(0,0,0)}}.slideInUp{animation-name:slideInUp}@keyframes slideOutDown{from{transform:translate3d(0,0,0)}to{visibility:hidden;transform:translate3d(0,100%,0)}}.slideOutDown{animation-name:slideOutDown}@keyframes slideOutLeft{from{transform:translate3d(0,0,0)}to{visibility:hidden;transform:translate3d(-100%,0,0)}}.slideOutLeft{animation-name:slideOutLeft}@keyframes slideOutRight{from{transform:translate3d(0,0,0)}to{visibility:hidden;transform:translate3d(100%,0,0)}}.slideOutRight{animation-name:slideOutRight}@keyframes slideOutUp{from{transform:translate3d(0,0,0)}to{visibility:hidden;transform:translate3d(0,-100%,0)}}.slideOutUp{animation-name:slideOutUp}