/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 21 août 2016, 23:11:17
    Author     : KOUACOU WILLIAM
*/
body{
    font-family: sans-serif;
}
.loginBox {
  max-width:  90%;
  width: 500px
}

.stretch input  {
  width: 100%
}
/* ------------------------- Separate line ------------------------- */
.breadcrumb {
  text-align: center;
  display: inline-block;
  box-shadow: 0 2px 5px rgba(0,0,0,0.25);
  overflow: hidden;
  border-radius: 5px;
  counter-reset: flag;
      padding: 0px 0px !important;
}
.breadcrumb > a {
  text-decoration: none;
  outline: none;
  display: block;
  float: left;
  font-size: 12px;
  line-height: 36px;
  color: #fff;
  padding: 0 10px 0 60px;
  position: relative;
}
.breadcrumb > a:first-child {
  padding-left: 46px;
  border-radius: 5px 0 0 5px;
}
.breadcrumb > a:first-child::before {
  left: 14px;
}
.breadcrumb > a:last-child {
  border-radius: 0 5px 5px 0;
  padding-right: 20px;
}
.breadcrumb > a:last-child::after {
  content: none;
}
.breadcrumb > a::before {
  content: counter(flag);
  counter-increment: flag;
  border-radius: 100%;
  width: 20px;
  height: 20px;
  line-height: 20px;
  margin: 8px 0;
  position: absolute;
  top: 0;
  left: 30px;
  font-weight: bold;
}
.breadcrumb > a::after {
  content: '';
  position: absolute;
  top: 0;
  right: -18px;
  width: 36px;
  height: 36px;
  transform: scale(0.707) rotate(45deg);
  z-index: 1;
  box-shadow: 2px -2px 0 2px #f7ad0e;
  border-radius: 0 5px 0 50px;
}
.flat a,
.flat a::after {
  background: #fff;
  color: #f7ad0e;
  transition: all 0.5s;
}
.flat a::before {
  background: #fff;
  box-shadow: 0 0 0 1px #f7ad0e;
}
.flat a:hover,
.flat a.active,
.flat a:hover::after,
.flat a.active::after {
  background: #f7ad0e;
}
.flat a.active:hover {
  background: #d81b60;
}
.flat a:hover,
.flat a.active {
  color: #fff;
}
.flat a:hover::before,
.flat a.active::before {
  color: #f7ad0e;
}
footer{
   color:white;
    position:relative; left:0px; bottom:0px; height:50px; width:100%;
    margin-bottom: 0px;
}
.footer{
     padding:0px 10px;
}
.carddemoBasicUsage .card-media {
  background-color: #999999; }
.sms-img{
    height: 80px;
    width: 110px;
}
md-card md-card-title md-card-title-media .md-media-sm {
    height: 80px;
    width: 120px !important;
}
.color-secondary{
    background-color: #fff; //rgba(247, 173, 14,0.68);
}
.fadein.ng-enter {
  -webkit-transition: 1s;
  transition: 1s;
  opacity: 0;
}
.fadein.ng-enter.ng-enter-active {
  opacity: 1;
}
.inline-fadein.ng-hide-remove {
  -webkit-transition: 500ms ease all;
  -moz-transition: 500ms ease all;
  -o-transition: 500ms ease all;
  transition: 500ms ease all;
  display: inline-block !important;
  opacity: 0;
}
.inline-fadein.ng-hide-remove.ng-hide-remove-active {
  opacity: 1;
}
@-webkit-keyframes webkit-spin {
  from {
    -webkit-transform: scale(1) rorate(0deg);
  }
  to {
    -webkit-transform: scale(1) rotate(359deg);
  }
}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.loading-icon {
  -ms-animation: spin .7s infinite linear;
  -moz-animation: spin .7s infinite linear;
  -webkit-animation: webkit-spin .7s infinite linear;
  top: 2px;
  margin-left: 7px;
}
.alert {
  margin-top: 15px;
}
.color-primary {
    background-color: rgb(29, 173, 129);
    color: white;
}
.color-black {
    background-color: black;
   
}

.md-radio-button md-on{
     background-color: #e3e3e3 !important;
}
 .md-radio-button md-off{
      border-color:  #e3e3e3 !important;
       background-color: #e3e3e3 !important;
    }
   .md-radio-button.md-checked .md-ink-ripple {
        color:#e3e3e3 !important;
         background-color: rgba(99, 85, 89, 0.87);
    }
     md-radio-button.md-checked .md-off {
    border-color: rgba(255,64,129,0.87);
}
md-radio-button.md-default-theme .md-on, md-radio-button .md-on {
    background-color: rgba(0,0,0,0.38);
}
md-radio-group.md-default-theme .md-checked .md-ink-ripple, md-radio-group .md-checked .md-ink-ripple {
  //  color: rgba(0,0,0,0.38);
  color:rgbaa(63,81,181,1);
}
.color-atic-green{
       background-color: rgb(0, 255, 1) !important;
       color :000;
       
}
.color-atic-green-ligth{
       background-color: rgba(255,160,63,1) !important;
       color :white !important;
       
}
.color-atic-grey-light {
    background-color: #e3e3e3 !important;
  
   
}
.atic-carousel-item-heading{
    font-size: xx-large;
    color: #000;
   
    margin: 50 0;
}

.atic-carousel-item-heading{
    font-size: xx-large;
    text-transform: uppercase;
   margin: 10 0 20 0 !important;
}
.atic-carousel-item-subheading{
    font-size: large;
    text-transform: uppercase;
    max-height: 150px;
   padding: 5px !important;
}
.atic-carousel-item{
   background-image : url('../images/feuille.png')
}
.fix-to-top {
    position: fixed;
    top: 0;
}
.md-button.md-fab {
    background-color: rgb(255,255,255) !important;
    color: white;
}
.md-fab-speed-dial .md-fab-top-right {
    top: 5px;
    right: 20px;
    bottom: auto;
    left: auto;
    position: absolute;
}
md-menu-bar.md-default-theme md-menu.md-open > button, md-menu-bar md-menu.md-open > button, md-menu-bar.md-default-theme md-menu > button:focus, md-menu-bar md-menu > button:focus {
    outline: none;
    background-color: rgb(255,160,63) !important;
}
.md-button.md-default-theme:not([disabled]):hover, .md-button:not([disabled]):hover {
   background-color: rgb(176, 226, 211) !important;
    color:white !important;
}
.md-button.md-default-theme.md-primary.md-raised, .md-button.md-primary.md-raised, .md-button.md-default-theme.md-primary.md-fab, .md-button.md-primary.md-fab {
    color: white;
    background-color: rgb(29, 173, 129);
}
.transbar {
   background-color:rgba(29, 173, 129, 0.7) !important;
   font-color:black;
   // background-color: rgba(254,121,13,0.8);
    position: relative;
    bottom: 0;
 
    text-align: center;
    display: inline-block;
    width: 100%;
    z-index: 22;
}
.transbar a.trsnav {
    font-family: 'bnpp_sans_condensedregular',sans-serif;
    font-weight: 400;
    color: black;
    font-size: 14px;
    text-align: left;
    text-transform: uppercase;
   /* height: 78px;*/
    display: block;
    vertical-align: middle;
   padding: 10px 10px 10px 10px;
  /*  border-right: 1px solid rgba(255,255,255,0.4);*/
    background: url(../img/trs-compte.png) no-repeat 5px center;
    line-height: 78px;
}
.transbar a.trsnav:hover {
    font-family: 'bnpp_sansregular',sans-serif;
    font-weight: 500;
    line-height: 18px;
    font-size: 14px;
    letter-spacing: 0.3px;
    text-transform: none;
   /* background: #2a8662;*/
      display: block;
 /*   background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(50%, rgb(255, 160, 63))color-stop(30%, #e3e3e3));
    background-image: -webkit-linear-gradient(rgb(255, 160, 63),#e3e3e3);
    background-image: -moz-linear-gradient(rgb(255, 160, 63),#e3e3e3);
    background-image: -o-linear-gradient(rgb(255, 160, 63),#e3e3e3);
    background-image: linear-gradient(rgb(255, 160, 63),#e3e3e3);*/
    text-decoration: none;
    color:white;
   // border-right: 1px solid rgba(255,255,255,0.2);
    padding: 10px 10px 10px 10px;
}
.transbar a.trsnav.trs-part-01 {
 //   background-image: url(../img/trs-part-01.png);
     text-align: center;
}

.transbar a.trsnav .rolloff {
    display: inline;
    width: 100px;
    vertical-align: middle;
  //  display: inline-block;
    line-height: 20px;
}
.transbar a.trsnav:hover .rolloff {
    display: none;
}
.transbar a.trsnav .rollon {
    display: none;
}
.transbar a.trsnav:hover .rollon {
    display: inline;
}
.transbar .container {
  //  border-left: 1px solid rgba(255,255,255,0.4);
    
}
.transbar .col-sm-3 {
    padding: 0;
}
.transbar img {
    margin-right: 15px;
}
.container {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}
html.md-default-theme, html, body.md-default-theme, body {
    color: rgba(0,0,0,0.87);
     background-color: #fff; 
}
.atic-p{ //paragraphe présentation
    margin: 0 0 10px;
    font-size: 18px;
    height: 40px;

    }
  md-tabs.md-default-theme .md-tab, md-tabs .md-tab {
    color: rgba(0, 0, 0, 0.87);
}
md-tabs.md-default-theme md-ink-bar, md-tabs md-ink-bar {
    color: rgb(23, 21, 22);
    background: rgb(23, 21, 22);
}
.atic-service-p{
    border: 2px solid  rgb(27, 172, 129);;
    margin-top:0px;
    font-size:14px;
   
}
.atic-timeline-rotate{
    -ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
    transform: rotate(90deg);
}



@media only screen and (min-width: 768px) {
  .atic-anim:nth-child(odd) timeline-panel.bounce-in {
    animation: cd-bounce-2 0.5s; }
  .atic-anim:nth-child(even) timeline-panel.bounce-in {
    animation: cd-bounce-2-inverse 0.5s; } }

@media only screen and (max-width: 767px) {
  .atic-anim.bounce-in {
    animation: cd-bounce-2 0.5s; } }

.atic-anim{
  animation: cd-bounce-1 0.5s; }
.atic-anim-enter{
  animation: cd-bounce-1 0.5s; }

    .atic-anim-enter-active {
    animation: cd-bounce-2 3s; }
      .atic-anim-leave {
    animation: cd-bounce- 0.5s; }

      .atic-carousel-container{
          margin-top: 230px;
          margin-bottom:200px;
      }
  .truncate {
 overflow: hidden;
text-overflow: ellipsis;
 display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
.contactus-bg-color{
    background-color: rgba(167,167,167,0.56);
}
md-input-container.md-default-theme .md-input, md-input-container:not(.md-input-invalid) .md-input-focused .md-input {
    color: rgba(0,0,0,0.87);
    border-color: rgb(255, 160, 63)!important;
}
md-toolbar.md-default-theme:not(.md-menu-toolbar), md-toolbar:not(.md-menu-toolbar) {
    background-color: rgb(255,160,63);
    color: white;
}
p {
    margin: 0 0 12px;
    font-size: 16px;
    font-family: inherit;
    letter-spacing: 0.8;
}

.atic-image{
	height:60px;
	width:60px;
}
.logo{
	width:60px;
	height:60px;
}
@media (max-width: 480px) {
	 .atic-carousel-item-heading{
    font-size: 1.2em;
    text-transform: uppercase;
   margin: 0 0 0 0 !important;
   max-width:130px;
}
.atic-carousel-item-subheading{
    font-size: 0.9em;
    text-transform: uppercase;
    max-height: 200px;

    max-width:130px;
}
.atic-image{
	height:30px;
	width:30px;
}
.logo{
	width:80px;
	/*height:30px;*/
}
.material-icons{
font-size:1.1em !important;
}
md-icon {
   height: inherit !important;
    width:inherit !important; 
    min-height: inherit !important;
     min-width: inherit !important; 
}
 p{margin: 0 0 3px;
   
    font-size: 08px;
    font-family: inherit;
    letter-spacing: 0.2;
	
 }
   h1,h2,h3,h4{
    font-size: 12px;
   
 }
}
@media (min-width: 480px) and (max-width: 768px) {
	 .atic-carousel-item-heading{
    font-size: 1.5em;
    text-transform: uppercase;
   margin: 10 0 0 0 !important;
   max-width:200px;
}
.atic-carousel-item-subheading{
    font-size: 1.2em;
    text-transform: uppercase;
   
   padding: 5px !important;
    max-width:200px;
}
.logo{
	width:100px;
	/*height:40px;*/
}
.material-icons{
font-size:1.3em !important;
}
md-icon {
   height: inherit !important;
    width:inherit !important; 
    min-height: inherit !important;
     min-width: inherit !important; 
}
 p{margin: 0 0 5px;
    font-size: 10px;
    font-family: inherit;
    letter-spacing: 0.2;
	line-height: 13px;
 }
 h1,h2,h3,h4{
    font-size: 14px;
   
 }
}
.iphone{
    background-image: url('../images/iphonebg.png');
    background-size: 100% auto;
    background-repeat: no-repeat;
    width: 310px;
    height: 350px;
    float: right;
    margin-left: 30px;
}
 .screenshot{
    background-size: 100% auto;
    background-repeat: no-repeat;
    width: 250px;
    height: 250px;
    margin: auto;
    margin-top: 84px;
    cursor: pointer;
    position: relative;
}