@charset "utf-8";
/* CSS Document */
/* ---------------- RESET ---------------- */
    html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h4, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0;  font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
    :focus { outline: 0;}
    a, a:link, a:visited, a:hover, a:active{text-decoration:none}
    table { border-collapse: separate;border-spacing: 0;}
    th, td {text-align: left; font-weight: normal;}
    img, iframe {border: none; text-decoration:none;}
    ol, ul {list-style: none;}
    input, textarea, select, button {font-size: 100%;font-family: inherit; margin:0; padding:0;}
    select {margin: inherit;}
    hr {margin: 0;padding: 0;border: 0;color: #000;background-color: #000;height: 1px}
    b { font-weight:900 }
    a:hover { text-decoration: underline;}
    img { max-width: 100%; height: auto; }
    @media \0screen { img { width: auto; /* for ie 8 */ } }

    html { background:#FFF; scroll-behavior: smooth; }
    body{ font-family: 'Roboto', sans-serif; font-size:62.5%; color:#454547; font-weight:400;  background:#FFF; height: auto; }
    section {width:100%; position: relative; float:left; }
    .row { position: relative; margin-left: auto; margin-right: auto; margin-top: 0; margin-bottom: 0; max-width: 1260px; }
    .scroll-off {overflow: hidden !important;}
    .ie8 input {line-height:2.0 !important;}
    .ie7 input {line-height:3.0 !important;}
    .left { float: left !important; }
    .right { float: right !important; }
    .hide { display: none !important; }
    .divider { width: 100%; height: 1px; background: transparent; float: left; margin: 1.5% 0 }
    .divider.line { background: #f2f2f2 }
/* ---------------- RESET END ---------------- */

/* ---------------- HEADER ---------------- */

    header { background:#FFF; float: left; width: 100%; height: auto; position: absolute; z-index: 9999;  }
    header#desktop { display:; border-bottom: 3px solid #E5E5E5; }
    header#mobile { display:none !important; }



/* ---------------- HEADER DESKTOP ---------------- */

    header .top { float: left; width: 100%; background: #0087B9 }
    header .top .one { float: left; padding: 13px 0 0 0; background:; }
    header .top .one a { float: left; margin: 0 0 0 15px }
    header .top .one a p { float: left; color: #FFF; font-size: 1.1em;  }
    header .top .one a p.medium { font-size: 1.6em; margin: -3px 2px 0 2px; }
    header .top .one a p.big { font-size: 2.2em; color: #BFECFF; font-weight: 900; margin: -7px 0 -1px 0; }
    header .top .two { float: right; }
    header .top .two span { float: left; width: 1px; height: 38px; background: #318BC4; position: relative }
    header .top .two img.password { float: left; margin: 8px 4px 0 10px; }
    header .top .two p { float: left; margin: 12px 5px 0; color: #BCD9EC }
    header .top .two a p { font-size: 1.05em; padding: 0 0.7em; }
    header .top .two a p:hover { color: #FFF }
    header .top .two a.log { float: left; border-radius: 50px; background:#b0daf5; color: #0087B9;
    margin: 7px 4px; padding: 5px 11px; transition: .3s }
    header .top .two a.log:hover { text-decoration: none; background: #FFF }
    header .top .two a .facebook { float: left; padding: 9px 16px 0; opacity:.3; transition:.3s; }
    header .top .two a .linkedin { float: left; padding: 10px 12px 0; opacity:.3; transition:.3s; }
    header .top .two a .facebook:hover { opacity: 1 }
    header .top .two a .linkedin:hover { opacity: 1 }


    header#desktop .left { float: left; margin: 12px 0 10px 15px; }
    header#desktop .left h1 { float: left; }
    header#desktop .left h1 p { float: left; display: none }
    header#desktop .left h1 img { float: left; width: 160px !important; margin: 4px 0 0 0 !important; }

    header#desktop .right { float: right; }
    header#desktop .right div { float: left; position: relative }
    header#desktop .right div p { float: left; padding: 31px 15px 32px; border-left: 1px solid #e5e5e5; font-size: 1.4em; color: #666; cursor: default; font-weight: 500 }
    header#desktop .right div a.cursor p { cursor: pointer; }
    header#desktop .right div:hover p { text-decoration: none; background: #F3F3F3 }
    header#desktop .right div.active p { text-decoration: none; background: #e5e5e5; cursor: default}
    header#desktop .right div:hover > span { display: block; opacity: 1; }
    header#desktop .right div.active:hover > span { display: none; opacity: 0; }

    header#desktop .right div span { display:none; opacity: 0; transition: 1s; position: absolute; top: 80px; left: 1px; float: left; width: 230px; height: auto; background: #F3F3F3; border-bottom: 3px solid #E5E5E5; }
    header#desktop .right div span a { float: left; padding: 20px 10px; box-sizing: border-box; margin: 0 10%; width: 80%; border-bottom: 1px solid #e5e5e5; font-size: 1.4em; color: #2DA1D2; cursor: pointer; font-weight: 500 }
    header#desktop .right div span a:last-child { border-bottom:0 }


/* ---------------- HEADER MOBILE ---------------- */
    header#mobile { position: absolute; z-index: 999999; height: auto; padding: 0  }
    header#mobile .left { float: left; background: #FFF; width: 100%; position: fixed; top: 0; left: 0; z-index: 2; border-bottom: 3px solid #E5E5E5; }
    header#mobile .left h1 { float: left; }
    header#mobile .left h1 p { float: left; display: none }
    header#mobile .left h1 img { width: 131px; float: left; margin: 10px 0 11px 15px; }

    header#mobile .top .one { font-size: 81%; width: 100%; margin-top: 71px; }
    header#mobile .top .one a { margin: 0 0 0 5%; }
    header#mobile .top .one a.excep { float: right; margin: 0 5% 0 0; }
    header#mobile .top .two { width: 100%; border-bottom: 1px solid #318BC4; background: #0087B9; position: fixed; top: 0; left: 0; z-index: 5; }

    header#mobile .top .two p { font-size: 0.5em; }
    header#mobile .top .two a.log { font-size: 0.42em; }
    header .top .two a.log.excep { display: none }


    header#mobile .top .two.excepMobile { position: relative; top: 64px; z-index: 1; }
    header#mobile .top .two.excepMobile p { font-size: 0.95em; }
    header#mobile .top .two.excepMobile a.log { font-size: 0.9em; font-weight: 500; }

    header#mobile .top .two img.password { margin: 9px 4px 0 10px;}
    header#mobile .top .two p {margin: 15px 5px 0;}
    header#mobile .top .two p b {font-weight: 400}
    header#mobile .top .two a.log {margin: 9px 4px 8px;}






    /* ==== MENU MOBILE ==== */
    header#mobile .header-fixo {position: absolute; z-index: 99999; top: 0; right: 0; width: 100%; height: auto; }
    header#mobile #menu { display:none; }
    header#mobile .black { width: 100%; height: 100%; margin: 0; position: fixed; z-index: 1;  background: #0087B9; }
    header#mobile .menu_phone { display:block; position: fixed; top: 0; right: 0; z-index: 999; width: 35px; height: auto; cursor:pointer; padding:30px 20px; margin:0; border-left: 1px solid #e5e5e5;   }
    header#mobile .on-swift { background: none }
    header#mobile .off-swift { background: #0087B9;; margin: 38px 0px 0;
    border: 1px solid #318BC4; padding: 39px 25px 39px 24px; }

    header#mobile .header-fixo #menu { margin: 0; font-size: 2.6em; float: left; width: 100%; height: 100%; background:; position: fixed; overflow: auto; z-index: 3; }
    header#mobile .header-fixo #menu .big { width: 100%; margin: 39px 0 0; float: left; position: relative;z-index: 3; }
    header#mobile .header-fixo #menu .big div {  text-align: left; position: relative; z-index: 998; float: left; color: #FFF; margin: 0 0 0 0;padding: 1em 0 1em 30px; clear: both; cursor: pointer; border-left: 10px solid transparent; font-weight: 300; }
    header#mobile .header-fixo #menu .big div a {   color: #FFF; }

    header#mobile .header-fixo #menu .big div:hover { border-left: 10px solid #FFF; font-weight: 900; background: #1f78b0; width: calc(100% - 40px);   }
    header#mobile .header-fixo #menu .big div:hover > span { height: auto }

    header#mobile .header-fixo #menu .big div span { width: 100%; height: 0; display: block; overflow: hidden; float: left}
    header#mobile .header-fixo #menu .big div span a { width: 100%; float: left; font-size: 0.6em;
    font-weight: 500; color: #b4e2fe; margin: 21px 0 0 20px;}


    /* === ICON MENU HAMBURGUER ANIMATED  === */
    header#mobile #nav-toggle span, #nav-toggle span:before, #nav-toggle span:after { cursor: pointer; border-radius: 1px; height: 2px; width: 35px; background: #cacaca; position: absolute; display: block;content: '';}
    header#mobile #nav-toggle.off-swift span, #nav-toggle.off-swift span:before, #nav-toggle.off-swift span:after { background: #61a6d1;  }
    #nav-toggle.off-swift:hover span:before, #nav-toggle.off-swift:hover span:after { background: #FFF;  }

    header#mobile #nav-toggle span:before { top: -12px; }
    header#mobile #nav-toggle span:after { bottom: -12px; }
    header#mobile #nav-toggle span, #nav-toggle span:before, #nav-toggle span:after { transition: all 500ms ease-in-out; }
    header#mobile #nav-toggle.active span { background-color: transparent;  }
    header#mobile #nav-toggle.active span:before, #nav-toggle.active span:after { top: 0; }
    header#mobile #nav-toggle.active span:before { transform: rotate(45deg); }
    header#mobile #nav-toggle.active span:after { transform: rotate(-45deg); }









/* ---------------- HOME  ---------------- */
    #setor1 { width: 100%; height: auto; position: relative; background:#000; float: left; z-index: 999}
    #setor1 .swiper-slide { background: url(../img/bgs/deltaGlobal-home.webp); background-size: cover; background-position: center; padding-bottom:0 !important; margin: 121px 0 0; }
    #setor1 h2 { width: 80%; margin: 10% 10%; float: left; z-index: 2; text-align: center; float: left; color: #FFF; font-size: 3.2em; font-weight: 700;  }
    #setor1 .black { width: 100%; height: 100%; background: #000; position: absolute; top: 0; left: 0; float: left; z-index: 1; opacity: .3 }

    #setor9 .OnlyMobile { display: none !important }


    #setor2 { width: 100%; height: auto; position: relative; background:; float: left; z-index: 999}
    #setor2.excep { background: #F8F8F8; border-top: 1px solid #F1F1F1; }
    #setor2.excep::after {
      content: "";
      background: url(../img/bgs/deltaGlobal-success.jpg);
      background-position: center;
      background-size: cover;
      opacity: 0.1;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      position: absolute;
      z-index: -1;
     }
    #setor2 .top { width: 100%; float: left; text-align: center; padding: 5% 0 3%  }
    #setor2 .top p { width: 100%; float: left; font-size: 2.1em; font-weight: 700; color: #C8C8C8 }
    #setor2 .top h2 { width: 100%; float: left; font-size: 3.8em; font-weight: 900; color: #2DA1D2; margin: 0; }

    #setor2 p.center { width: 70%; margin: 0 15% 5%; text-align: center; float: left; font-size: 1.4em; line-height: 1.6; font-weight: 400; color: #666 }
    #setor2 p.center.special { width: 47%; margin: 0; text-align: justify }
    #setor2 p.center.special.last { float: right }


    #setor2 ul { width: 100%; float: left; padding: 2% 0 7% 0;  }
    #setor2 ul li { width: 25%; float: left; box-sizing: border-box; }
    #setor2 ul li:last-child { border-right: 0 }
    #setor2 ul li i { width: 100%; height: 90px; float: left; text-align: center; opacity: .1; }
    #setor2 ul li div { width: 100%; float: left; }
    #setor2 ul li div h3 { width: 100%; float: left; text-align: center; font-size: 1.8em; font-weight: 700; color: #B780DB }
    #setor2 ul li div p { width: 80%; float: left; text-align: center; margin: 14px 10% 0; font-size: 1.4em; color: #666; line-height: 1.6; }
    #setor2 ul li div a { color: #FFF; padding: 0.6em 1em 0.5em; font-weight: 700; font-size: .8em; text-transform: uppercase; text-decoration: none; border-radius: 25px; }
    #setor2 ul li.veiculos div h3 { color: #2da1d2 }
    #setor2 ul li.frotas div h3 { color: #68BC87 }
    #setor2 ul li.pessoas div h3 { color: #EBBB68 }
    #setor2 ul li.propriedades div h3 { color: #EC7B7B }

    #setor2 ul li.veiculos div a { background: #2da1d2 }
    #setor2 ul li.frotas div a { background: #68BC87 }
    #setor2 ul li.pessoas div a { background: #EBBB68 }
    #setor2 ul li.propriedades div a { background: #EC7B7B }

    #setor3 { width: 100%; margin: 5% 0 0; height: auto; position: relative; background:; float: left; z-index: 999}
    #setor3 .top { width: 100%; float: left; text-align: center }
    #setor3 .top h2 { width: 100%; float: left; font-size: 4.2em; font-weight: 900; color: #666 }
    #setor3 .top p { width: 100%; float: left; font-size: 1.6em; font-weight: 300; line-height: 1.5;  color: #999 }
    #setor3 .swiper2 { width: 100%; float: left; margin: 5% 0  }
    #setor3 .swiper2 figure { width: 100%; float: left; text-align: center; padding: 0; margin: 0  }



    #setor4 { width: 100%; height: auto; position: relative; background:#0087B9; float: left; padding: 4% 0 2%; z-index: 999}
    #setor4 .top { width: 100%; margin: 0 0 0 0; float: left; text-align: center }
    #setor4 .top h2 { width: 100%; float: left; font-size: 2.7em; font-weight: 700; color: #CFF5FF }

    #setor4 ul { width: 100%; float: left; padding: 3% 0 2%; margin: 0; font-size: 85%}
    #setor4 ul li { width: 16.666%; padding: 0 2.5%; float: left; box-sizing: border-box; text-align: center }
    #setor4 ul li h4 { width: 100%; float: left; font-size: 3.8em; font-weight: 900; color: #FFF }
    #setor4 ul li p { width: 100%; float: left; font-size: 1.55em; font-weight: 500; line-height: 1.3;  color: #CFF5FF; }



    #setor5 { width: 100%; height: auto; position: relative; background:#0087B9; float: left; z-index: 999}
    #setor5 ul { width: 100%; float: left;  }
    #setor5 ul li { width: 33.333%;  background-size: auto 100% !important; background-position: center !important; padding: 10% 2.5%; float: left; box-sizing: border-box; text-align: center; transition: 2s; transition-timing-function: ease-out }
    #setor5 ul li:hover { background-size: auto 120% !important; }
    #setor5 ul li h4 { width: 100%; float: left; font-size: 5.9em; font-style:italic; font-weight: 900; color: #FFF }
    #setor5 ul li p { width: 100%; float: left; font-size: 2.6em; font-style:italic; font-weight: 300; line-height: 0.75;  color: #FFF }
    #setor5 ul li span { float: left; margin: 1.5em 0 0; width: 100%; text-align: center}
    #setor5 ul li span a { border-radius: 50px; background:#0087B9; color: #FFF; font-size: 1.2em; margin: 7px 4px; padding: 10px 16px; transition: .3s; font-weight: 700 }
    #setor5 ul li span a:hover { text-decoration: none; background: #FFF; color: #0087B9 }




    #setor6 { width: 100%; height: auto; position: relative; background:#FFF; float: left; z-index: 999; border-top: 1px solid #F1F1F1;}
    #setor6 ul { width: 100%; float: left; margin: 5% 0 4%;  }
    #setor6 ul li { width: 25%; padding: 0 5% 0 0; float: left; box-sizing: border-box; }
    #setor6 ul li:last-child { width: 25%; }
    #setor6 ul li h5 { width: 100%; float: left; font-size: 3.1em; line-height:1.5; font-weight: 900; color: #0087b9; margin: 0 }
    #setor6 ul li h5.excep { font-size: 2em; line-height: 2;  }
    #setor6 ul li p { width: 100%; float: left; font-size: 1.6em; line-height:1.5; font-weight: 500; line-height: 0.75;  color: #0087b9 }
    #setor6 ul li span { width: 100%; float: left; font-size: 1.3em; font-weight: 300; line-height: 1.5;  color: #0087b9 }
    #setor6 ul li div { width: 100%; float: left; text-align: center}
    #setor6 ul li div a { border-radius: 50px; background:#0087b9; color: #FFF; font-size: 1.1em; margin: 13px 0; padding: 10px 36px; transition: .3s; font-weight: 700; float: left; text-transform: uppercase}
    #setor6 ul li div a:hover { text-decoration: none; opacity: .85 }



    #setor7 { width: 100%; padding: 3% 0 2%; height: auto; position: relative; background:#0081B2; float: left; z-index: 999; border-top: 1px solid #0B8EC5; border-bottom: 1px solid #0B8EC5}
    #setor7 .top { width: 100%; margin: 0 0 0 0; float: left; text-align: center }
    #setor7 .top h2 { width: 100%; float: left; font-size: 2.7em; font-weight: 700; color: #CFF5FF }
    #setor7 .swiper-slide.carousel { width: 25%; background: transparent; margin: 3em 0 2em; }


    .swiper-button-next.next3 {
    background-image: url(../../img/icons/arrow-right.svg) !important; margin:0 }
    .swiper-button-prev.prev3 {
    background-image: url(../../img/icons/arrow-left.svg) !important; margin:0 }




    #setor7 ul li p { width: 100%; float: left; font-size: 1.3em; line-height:1.5; font-weight: 300;  color: #FFF; opacity: .7; text-align: center; margin: 10px 0}
    #setor7 ul li div { width: 100%; float: left; text-align: center; margin: 2em 0 0 }
    #setor7 ul li div a { border-radius: 50px; background:; border: 2px solid #FFF; color: #FFF; font-size: 1.2em;  padding: 9px 16px; transition: .3s; font-weight: 700;}
    #setor7 ul li div a:hover { text-decoration: none; background:#FFF; color: #0463AA }



    .addthis { z-index: 9999; position: relative; clear: both; float: left; left: 50%; transform: translate(-50%,0); margin: 2% 0 0; }
    article .addthis { left: inherit; transform: translate(0,0); margin: -40px 0 0  }
    .at-style-responsive .at-share-btn {  padding: 0 !important; border-radius: 7px !important; }




    #topper {width: 100%; float: left; height: 200px; background: url(../../img/blog/bg.jpg);
    background-size: cover !important; background-position: center !important; padding-bottom: 0 !important; margin: 121px 0 0; position: relative}
    #topper .black {width: 100%; float: left; height: 100%; position: absolute; top: 0; left: 0; background: #000; opacity: .3 }
    #topper.blog { margin-bottom: 7.5%; height: auto; padding: 7% 0 !important  }
    #topper.blog.interna { margin-bottom: 3.5%; padding: 12% 0 !important }
    #topper.blog .black { opacity: .5 }
    #topper small { text-align:center; font-size: 2.9em; font-weight: 700; color: #b2e8ff; position: relative; z-index: 2;   }
    #topper h2 { text-align:center; width: 100%; line-height: 1; color:#FFF; font-size: 6em; font-weight: 700; position: relative; z-index: 2; padding: 0; }

    #topper.blog .center { position: relative; z-index: 3; left: 50%; transform: translate(-50%); margin: 1.5em 0 0; float: left; }

    #topper .blue {width: 100%; float: left; height: 100%; position: absolute; top: 0; left: 0; background: #000; opacity: .65 }


    #topper.fullheight {height: 100vh !important; display: flex; justify-content: center;} 
    #topper.fullheight .center {width: 60%; display: flex;flex-direction: column;align-self: center;}

    #topper.fullheight img.mouse { position: absolute; bottom: 5vh; left: calc(50% - 15px);    z-index: 3; transition: .2s; }
    #topper.fullheight img.mouse:hover { bottom: 6vh; }



    #setor8 { width: 100%; padding: 5% 0; height: auto; position: relative; background:#FFF; float: left; z-index: 999; text-align: center; }
    #setor8.excep { padding: 7% 0; }
    #setor8.excep2 { padding: 0 0 5%; }
    #setor8.excep3 { padding: 0 0 8% 0; }

    #setor8.excep2 h4 { text-transform: uppercase}
    #setor8.excep2 figure { width: 45%; float: left; margin: 5% 0 0; text-align: center }
    #setor8.excep2 p { width: 50%; float: right; margin: 7.5% 0 0; text-align: left }



    #setor8 small { width: 100%; float: left; font-size: 2.1em; font-weight: 700; color: #C8C8C8 }

    #setor8 h2 { width: 80%; margin: 0 10%; float: left; color:#2da1d2; font-size: 4.2em; font-weight: 700 }
    #setor8 h4 { width: 100%; float: left; color:#8E8E8E; font-size: 2.7em; font-weight: 500; margin: 5% 0 0; }
    #setor8 p { width: 80%; margin: 2.5% 10% 0; line-height: 1.8; float: left; color:#666; font-size: 1.5em; font-weight: 300 }

    #setor8 ul { width: 100%; margin: 2em 0; float: left; }
    #setor8 ul li { width: 100%; float: left; color:#2da1d2; font-size: 1.6em; font-weight: 700; margin: 1.3em 0 0; }

    #setor8 .left { width: 60%; float: left; margin: 5% 0 0; text-align: left; padding: 0 10% 0 15%; box-sizing: border-box;}
    #setor8 .right { width: 40%; float: left; margin: 5% 0 0; border-radius: 14px; text-align: left }



    #setor8.condicoes {  }
    #setor8.condicoes small { width: 80%; float: left; margin:10px 10% 0; font-weight: 400; color: #969696;font-size: 16px;  }
    #setor8.condicoes ul { width: 100%; float: left; padding: 40px 0;  }
    #setor8.condicoes ul li { width: 33.333%; float: left; text-align: center; box-sizing: border-box; }
    #setor8.condicoes ul li b { width: 100%; float: left; font-size: 16px;     color: #969696; font-weight: 400; line-height: 2;}
    #setor8.condicoes ul li h3 { width: 100%; float: left; font-size:26px;color: #026C9F;margin: 0; }
    #setor8.condicoes ul li div { width: 100%; float: left; margin: 25px 0; text-align: center; height: 30px; }
    #setor8.condicoes ul li div a {font-size:15px;background: #026C9F;color: #FFF;padding:12px 25px;border-radius:7px; text-decoration: none; }




    


    #setor9 { width: 100%; height: auto; position: relative; background:; float: left; z-index: 999; margin: 2.5% 0 5%; }
    #setor9 h4 { width: 100%; float: left; color:#8E8E8E; font-size: 2.3em; font-weight: 700;
    text-align: center; margin: 5% 0 1%; text-transform: uppercase; }
    #setor9 h4.Excep { margin: 0 0 2%}

    #setor2 h4 { width: 100%; float: left; color:#8E8E8E; font-size: 2.3em; font-weight: 700;
    text-align: center; margin: 5% 0 1%; text-transform: uppercase; }

    #setor9 .swiper-slide { font-size: 1em; }
    #setor9 .swiper-slide .alen { width: 100%; float: left; }
    #setor9 .swiper-slide .alen i { width: 100%; height: 80px; margin: 0 0 20px; float: left; text-align: center; opacity:; position: relative }
    #setor9 .swiper-slide .alen i img { max-width: 75px; height: 60px; opacity: .2; position: absolute; bottom: 0; transform: translate(-50%) }
    #setor9 .swiper-slide .alen .box { width: 100%; float: left; height: 180px; }
    #setor9.afinidades .swiper-slide .alen .box { height: auto !important; }
    .gestao_sinistros #setor9 .swiper-slide .alen .box { height: auto !important; }
    .distribuidores #setor9 .swiper-slide .alen .box { height: auto !important; }
    #setor9 .swiper-slide .alen .box h3 { width: 100%; float: left; text-align: center; font-size: 1.8em; font-weight: 700; color: #2da1d2 }
    #setor9 .swiper-slide .alen .box p { width: 80%; float: left; text-align: center; margin: 14px 10% 0; font-size:1.4em; font-weight: 300; color: #8E8E8E; line-height: 1.6; }

    #setor9 .OnlyDesktop { width: 100%; float: left;  }
    #setor9 .OnlyDesktop .swiper-slide { width: 25%; float: left;  }

    #setor9 .OnlyDesktop.Excep .swiper-slide { width: 33.333% }
    #setor9 .OnlyDesktop.Excep2 .swiper-slide { width: 50% }
    #setor9 .OnlyDesktop.Excep3 .swiper-slide { width: 20% }
    #setor9 .OnlyDesktop.Excep4 .swiper-slide { width: 25% }

    #setor9 .OnlyDesktop.OnlyOne .swiper-slide { margin: 0 0 0 33.333%  }



    #setor9.afinidades { margin: 0 0 0; }
    #setor9.afinidades h4 { margin: 0 0 5%; }

    #setor9.afinidades .swiper-slide { width: 16.666% }
    #setor9.afinidades .swiper-slide h3 { font-size: 1.4em !important }

    #setor9.afinidades .swiper-slide span { width: 30px; height: 30px; float: left; background: #CBCBCB; margin: 0 0 13px; color: #FFF; font-size: 1.4em; font-weight: 700; text-align: center; box-sizing: border-box; padding: 7px 0 0; border-radius: 50px; position: relative; left: 50%; transform: translate(-50%); z-index: 2}
    #setor9.afinidades .swiper-slide .line { width: 100%; height: 1px; float: left; background: #CBCBCB; position: absolute; top: 116px; left: 0; z-index: 1}
    #setor9.afinidades .swiper-slide:first-child .line { width: 50%; left: 50%;}
    #setor9.afinidades .swiper-slide:last-child .line { width: 50%; }



    #highlights { width: 100%; float: left;  }
    #highlights li { width: 50%; height: 370px; float: left; box-sizing: border-box; padding: 5% 10%; display: block; overflow: hidden; position: relative}
    #highlights.excep li { height: 280px; }
    #highlights li h4 { width: 100%; float: left; font-size: 2.5em; font-weight: 500; color: #0087B9   }
    #highlights li p { width: 100%; float: left; font-size: 1.6em; font-weight: 400; line-height: 28px; margin: 5% 0 0; color: #0087B9 }

    #highlights li.triple { width: 33.333%; padding: 5%; }

    #highlights li.blue { background: #0087B9 }
        #highlights li.blue h4 { color: #FFF }
        #highlights li.blue p { color: #BFECFF }
    #highlights li.white { background: #e1f6ff }

    #highlights li::after { content: ""; background-position: center; background-size: cover !important; opacity: 0.07; top: 0; left: 0; bottom: 0; right: 0; position: absolute; z-index: 1; }

    #highlights li.atendimento::after { background-position: left; background: url(../img/bgs/deltaGlobal-deltaassist-contato.jpg) }
    #highlights li.pagamento::after { background: url(../img/bgs/deltaGlobal-pagamento.jpg) }
    #highlights li.acompanhamento::after { background: url(../img/bgs/deltaGlobal-acompanhamento.webp) }
    #highlights li.marketing::after { background: url(../img/bgs/deltaGlobal-marketing.webp) }

    #highlights li.veiculos::after { background: url(../img/bgs/deltaGlobal-veiculos.jpg) }
    #highlights li.pessoas::after { background: url(../img/bgs/deltaGlobal-pessoas2.jpg) }
    #highlights li.imoveis::after { background: url(../img/bgs/deltaGlobal-imoveis.jpg) }
    #highlights li.frotas::after { background: url(../img/bgs/frotas.jpg) }
    #highlights li.parceiros::after { background: url(../img/bgs/deltaGlobal-parceiros.jpg); opacity: 0.05; }
    #highlights li.diferenciais::after { background: url(../img/bgs/deltaGlobal-success.jpg) }


    #setorCarreira { width: 100%; padding: 5% 15% 0; height: auto; position: relative; background:#FFF; float: left; z-index: 999; text-align: center; box-sizing: border-box; color: #FFF; font-size: 3em; font-weight: 700 }
    #setorCarreira .row { position: relative; z-index: 2 }
    #setorCarreira a { border-radius: 50px; background: #FFF; color: #298cb5; font-size: 0.8em; margin: 30px 0 0; padding: 20px 36px; transition: .3s; font-weight: 700; float: left; position: relative; left: 50%; transform: translate(-50%,0);}
    #setorCarreira a:hover {text-decoration: none; opacity: .85;}

    #setorCarreira.one { background:#2da1d2; padding: 5% 20%;  }

    #setorCarreira.one::after { background: url(../img/bgs/deltaGlobal-carreiras3.jpg); content: ""; background-position: center; background-size: cover !important; opacity: 0.15; top: 0; left: 0; bottom: 0; right: 0; position: absolute; z-index: 1; }

    #setor10 p.excep { width: 100%; text-align: center; box-sizing: border-box; padding: 0 20% 5% 20%; float: left; color: #2da1d2; font-size: 2.2em; font-weight: 500; }


    #setor11 { width: 100%; padding: 0; height: auto; position: relative; background:#F8F8F8; float: left; z-index: 999; border-top: 1px solid #F1F1F1;  }
    #setor11 .top { width: 100%; float: left; text-align: center; padding: 5% 0 }
    #setor11 .top p { width: 100%; float: left; font-size: 2.1em; font-weight: 700; color: #C8C8C8 }

    #setor11 .top h2 { width: 100%; float: left; font-size: 3.8em; font-weight: 900; color: #2DA1D2; margin: 0; }


    #setor11 ul { width: 100%; float: left}
    #setor11 ul li { width: 45%; float: left; height: 240px;  }
    #setor11 ul li i { width: 30%; float: left;  }
    #setor11 ul li div { width: 65%; margin: 0; float: left;  }
    #setor11 ul li div h3 { width: 100%; float: left; font-size: 1.8em; color: #2DA1D2; font-weight: 700  }
    #setor11 ul li div p { width: 100%; float: left; font-size: 1.4em; line-height: 1.6; color: #666; font-weight: 400; margin: 1em 0 0 0  }

    #setor11 p.more { width: 100%; float: left; text-align: center; font-size: 1.1em; color: #666666; font-weight: 700; margin: 5% 0 0  }
    #setor11 p.more a { color: #666666; }
    #setor11 p.more a:hover { text-decoration: underline}



    #setorMapa { width: 100%; padding: 0; height: auto; position: relative; background:#0087B9; float: left; z-index: 99999; }
    #setorMapa .left { width: 50%; float: left;  }
    #setorMapa .left img { margin: -25px auto; text-align: center; overflow: auto; display: block; }
    #setorMapa .right { width: 50%; float: right; margin: 6% 0 0; }
    #setorMapa .right h4 { width: 100%; float: left; color: #FFF; font-size: 3em; font-weight: 500; text-transform: uppercase; margin: 0 0 5%; }
    #setorMapa .right ul { width: 50%; float: left;  }
    #setorMapa .right ul li { width: 100%; float: left; color: #FFF; font-size: 1.4em; margin: 0 0 1em  }
    #setorMapa .right ul li span { color: #BFECFF  }




    #setorEndereco { width: 50%; padding: 0; height: auto; position: relative; background:#0087B9; float: left; z-index: 99999; }
    #setorEndereco .row { width: 80%; margin: 0 10%; }
    #setorEndereco.blue { background:#0081B2 }
    #setorEndereco adress { width: 100%; padding: 2.5em 0; height: auto;  float: left; color: #FFF; font-size: 1.5em }
    #setorEndereco .frame { width: 100%; float: left; display: block; overflow: hidden; border-radius: 14px }
    #setorEndereco adress i { float:left;  margin: 3px 10px 0}
    #setorEndereco adress p { float:left; }
    #setorEndereco adress a { padding: 0.5em 1em; height: auto; float: left; color: #FFF; font-size: 0.95em; border-radius: 50px; border:1px solid #FFF; background: transparent; transition: .15s }
    #setorEndereco adress a:hover { text-decoration: none; color: #0087B9; background:#FFF}
    #setorEndereco adress h3 { width: 100%; text-align: center; float:left; font-size: 1.45em; font-weight: 700 }



/* ---------------- FORM  ---------------- */

    #setor11 { width: 100%; padding: 6% 0; background: #F8F8F8; border-top: 1px solid #F1F1F1;  height: auto; position: relative; background:; float: left; z-index: 999}
    #setor11 .box { width: 80%; margin: 0 10%; box-sizing: border-box; padding: 75px 0; background: #2da1d2; float: left; font-weight: 400; border-radius: 20px; display: block; overflow: hidden }
    #setor11 .box h3 { width: 100%; padding: 0 0 10px; color: #FFF; float: left; font-size: 3.6em; font-weight: 700; text-align: center; }
    #setor11 .box p { width: 100%; padding: 0 0 30px; color: #FFF; float: left; font-size: 1.8em; font-weight: 300; text-align: center; }
    #setor11 .box a { padding: 18px 35px 16px; border-radius: 12px; background: #FFF; color: #2DA1D2; float: left; font-size: 2.4em; font-weight: 600; text-align: center; position: relative; left: 50%; transform: translate(-50%); }
    #setor11 .box a:hover { text-decoration: none; opacity: .9;}





/* ---------------- FORM  ---------------- */

    #setor10 { width: 100%; padding: 6% 0; background: #F8F8F8; border-top: 1px solid #F1F1F1;  height: auto; position: relative; background:; float: left; z-index: 999}

    form { width: 80%; margin: 0 10%; box-sizing: border-box; padding: 50px; background: #2da1d2; float: left; font-weight: 400; border-radius: 20px; display: block; overflow: hidden }
    form h3 { width: 100%; padding: 0 0 30px; color: #FFF; float: left; font-size: 2.2em; font-weight: 700; text-transform: uppercase}
    form span { width:33.333%; box-sizing: border-box; padding: 0 2px 2px 0; float: left; text-align: left; font-size: 1.6em; float: left; font-weight: 400; position: relative}
    form span label { position: absolute; top: 7px;  left: 20px; color: #FFF; font-size: 0.9em;}
    form span.triple { width:100%; }
    form span.right { float: right !important }

    form span.para_robos { width: 0 !Important; height: 0 !Important; opacity: 0 }
    form span.para_robos input { cursor: default; background: rgb(45, 161, 210);}

    form span input { width: 100%; box-sizing: border-box; padding: 0 20px; float: left; border-radius: 7px; border:7px; height: 57px; transition:0.3s; font-weight: 400; color: #FFF; background: rgba(255, 255, 255, 0.15); }
    form span input.input-file { padding: 25px 20px 0; font-size: 13px; }

    form span select { width: 100%; box-sizing: border-box; padding: 0 20px; float: left; border-radius: 7px; border:7px; height: 57px; transition:0.3s; font-weight: 400; color: #FFF; background: rgba(255, 255, 255, 0.15); }
    form span select option { color: #2da1d2; font-weight: 500; }

    form span textarea { width: 100%; height: 140px; box-sizing: border-box; padding: 20px 20px 0; float: left; border-radius: 7px; border:7px; transition:0.3s; font-weight: 400; color: #FFF; background: rgba(255, 255, 255, 0.15); resize: none; }

    form span input:focus { border: 2px solid #FFF; box-shadow:0 0 20px rgba(0, 0, 0, 0.20); }
    form span select:focus { border: 2px solid #FFF; box-shadow:0 0 20px rgba(0, 0, 0, 0.20); }
    form span button { width: 100%; box-sizing: border-box; padding: 0 20px; float: left; border-radius: 7px; border:7px; height: 57px; transition:0.3s; font-weight: 500; background: #FFF; color: #2da1d2; text-transform: uppercase; cursor: pointer; opacity: 1 }
    form span button:hover { opacity: .85 }


    form input.btn:hover { opacity: .7 }

    form span input::placeholder { color: #FFF; font-weight: 400 }
    form span select::placeholder { color: #FFF; font-weight: 400 }
    form span textarea::placeholder { color: #FFF; font-weight: 400 }








/* ---------------- COLORS  ---------------- */
    .veiculos #setor8 h2 {color:#2da1d2 }
    .veiculos #setor9 .swiper-slide .box h3 { color: #2da1d2 }
    .veiculos form { background: #2da1d2 }
    .veiculos form span button { color: #2da1d2 }
    .veiculos form span select option { color: #2da1d2 }

    .pessoas #setor8 h2 {color:#EBBB68 }
    .pessoas #setor9 .swiper-slide .box h3 { color: #EBBB68 }
    .pessoas form { background: #EBBB68 }
    .pessoas form span button { color: #EBBB68 }
    .pessoas form span select option { color: #EBBB68 }

    .frotas #setor8 h2 {color:#68BC87 }
    .frotas #setor9 .swiper-slide .box h3 { color: #68BC87 }
    .frotas form { background: #68BC87 }
    .frotas form span button { color: #68BC87 }
    .frotas form span select option { color: #68BC87 }

    .propriedades #setor8 h2 {color:#EC7B7B }
    .propriedades #setor9 .swiper-slide .box h3 { color: #EC7B7B }
    .propriedades form { background: #EC7B7B }
    .propriedades form span button { color: #EC7B7B }
    .propriedades form span select option { color: #EC7B7B }





/* ---------------- MENU SECUNDARIO  ---------------- */

    #MenuSecundario { width: 100%; height: auto; position: relative; background:#e5e5e5; float: left; z-index: 999}
    #MenuSecundario ul { width: 100%; float: left; margin: -5px 0 0;  }
    #MenuSecundario ul li { width: 25%; height: 69px; float: left; padding: 1.5em 0; box-sizing: border-box; border-top:5px solid #CCC; border-color:transparent; transition: .3s }
    #MenuSecundario ul li:hover { background: rgba(255, 255, 255, 0.60) }
    #MenuSecundario ul li div { float: left; position: relative; left:calc(50% - 64px)   }
    #MenuSecundario ul li div h3 { float: left; text-align: center; font-size: 1.8em; font-weight: 700; color: #2DA1D2; margin: 9px 0 0 10px }
    #MenuSecundario ul li img { width: 40px; float: left; opacity: .15 }
    #MenuSecundario ul li.active {background:#FFF; border-color:#2DA1D2  }


    #MenuSecundario ul li.veiculos.active {border-color:#2da1d2  }
    #MenuSecundario ul li.veiculos div { left:calc(50% - 64px)  }
    #MenuSecundario ul li.veiculos h3 { color:#2da1d2 ; margin: 9px 0 0 10px }

    #MenuSecundario ul li.pessoas.active {border-color:#EBBB68  }
    #MenuSecundario ul li.pessoas div { left:calc(50% - 64px)  }
    #MenuSecundario ul li.pessoas h3 { color: #EBBB68; margin: 9px 0 0 10px }

    #MenuSecundario ul li.frotas.active {border-color:#68BC87  }68BC87
    #MenuSecundario ul li.frotas div { left:calc(50% - 50px)  }
    #MenuSecundario ul li.frotas img { width: 40px; float: left; opacity: .15; margin: 5px 0 0; }
    #MenuSecundario ul li.frotas h3 { color: #68BC87; margin: 9px 0 0 10px }

    #MenuSecundario ul li.propriedades.active {border-color:#EC7B7B  }
    #MenuSecundario ul li.propriedades div { left:calc(50% - 73px)  }
    #MenuSecundario ul li.propriedades h3 { color: #EC7B7B; margin: 10px 0 0 10px }


    .acionamento #MenuSecundario ul li { width: 50% }
    .gestao_sinistros #MenuSecundario ul li { width: 50% }
    .produto_dedicado #MenuSecundario ul li { width: 33.333% }

    #MenuSecundario ul li.acionamento div { left:calc(50% - 80px)  }
    #MenuSecundario ul li.acionamento img { width: 32px }

    #MenuSecundario ul li.gestao_sinistros div { left:calc(50% - 103px)  }

    #MenuSecundario ul li.produto_dedicado div { left:calc(50% - 98px)  }
    #MenuSecundario ul li.produto_dedicado img { width: 32px; margin: 5px 0 0; }

/* ---------------- FOOTER  ---------------- */

    footer { width: 100%; padding: 4% 0 120px; height: auto; position: relative; float: left; z-index: 999; background: url(../img/deltaGlobal-draw-footer.svg) no-repeat #0087B9; background-position: center bottom; }
    footer ul.one { width: 100%; float: left;  }
    footer ul.one li { width: 25%; padding: 0 2.5% 5%; float: left; box-sizing: border-box; }
    footer ul.one li h6 { width: 100%; float: left; font-size: 2.3em; line-height:1.5; font-weight: 900;  color: #CFF5FF; margin: 10px 0}
    footer ul.one li a { width: 100%; float: left; font-size: 1.4em; line-height:1.5; font-weight: 400;  color: #FFF; margin: 7px 0 0}

    footer ul.two { width: 100%; float: left; margin: 1% 0 0; }
    footer ul.two li { width: 33.333%; padding: 0 2.5% 2.5%; float: left; box-sizing: border-box; }
    footer ul.two li i { float: left; text-align: center}
    footer ul.two li i img.grupo { margin: 15px 0 0  }
    footer ul.two li p { width: 100%; float: left; font-size: 1.3em; line-height:1.5; font-weight: 300;  color: #FFF; text-align: left; margin: 0 0 10px 0 }
    footer ul.two li div { width: 100%; float: left; }
    footer ul.two li div div { margin: 0 0 0 9px }
    footer ul.two li div input { width: 80%; height: 43px; padding: 0 5%; float: left; border-radius: 7px 0 0 7px; background:#0087b9; border: 1px solid #FFF; color: #FFF; font-size: 1.2em; box-sizing: border-box; margin: 0 0 5px; }
    footer ul.two li div input::placeholder { color: #FFF }
    footer ul.two li div button { width: 20%; height: 43px; float: left; background: #FFF; color:#0087b9; border: 0; font-size: 1.3em; font-weight: 700; border-radius:0 7px 7px 0; cursor: pointer}

    footer ul.two li.excep { margin: 30px 0 0}
    footer ul.two li.excep i { width: 10%; margin: 3px 0 0}
    footer ul.two li.excep p { width: 90%;}

    footer .copyright { width: 100%; float: left; font-size: 1.1em; line-height:1.5; font-weight: 400;  color: #3cafda; text-align: center; margin: 15px 0 }


    footer form { padding: 0;background: none !important;margin: 0; width: 100%; border-radius: 0; }




    ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
      color: #FFF;
    }
    ::-moz-placeholder { /* Firefox 19+ */
      color: #FFF;
    }
    :-ms-input-placeholder { /* IE 10+ */
      color: #FFF;
    }
    :-moz-placeholder { /* Firefox 18- */
      color: #FFF;
    }









/* ---------------- BLOG  ---------------- */


    #blog-container { width: 100%; height: auto; position: relative; background:; float: left; z-index: 999; margin:0 0 5%; }

    #blog-container .left { width: 65%; float: left;  }
    #blog-container .right { width: 25%; float: right;  }

    article { width: 100%; float: left;  margin: 0 0 5%; padding: 0 0 5%; border-bottom: 1px solid #F0F0F0 }
    article.bot { border-bottom: 0 }
    article figure { width: 100%; float: left;  margin: 0 0 5%; height: 400px; border-radius: 7px; display: block; overflow: hidden; background: #f4f8f9}
    article figure img { width: 100%; height: auto; position: relative; top: 50%; left: 50%; transform: translate(-50%,-50%); float: left; transition: 5s }
    article figure:hover img { width: 120%; max-width: 120% }

    article ul.categorias { width: 100%; float: left;  margin: 2% 0;}
    article ul.categorias li { float: left;  margin: 5px 5px 0 0; background: #F5F5F5; color: #B5B5B5; padding: 0.5em 1em; border-radius: 25px; font-size: 1.2em; font-weight: 700 }



    article small { width: 100%; float: left; margin: 0; font-size: 2.1em; font-weight: 700; color: #DFDFDF }
    article h3 { width: 100%; float: left; margin: 0; font-size: 4.8em; font-weight: 700; color: #2DA1D2; line-height: 1 }
    article p { width: 100%; float: left; margin: 0; font-size: 1.6em; font-weight: 400; color: #747474; line-height: 1.8 }
    article p strong { font-weight: 700; }
    article h3 > a { font-weight: 700; color: #2DA1D2; text-decoration: underline;font-size: 1.5em; float: left; }
    article a.more { margin: -20px 0 0;font-size: 1.35em;
        color: var(--azul);
        text-decoration: underline;
    }
    article a.more:hover {
        text-decoration: none;
    }
    article h3 a { font-size: 1em; }
    article strong { font-weight: 700 }

    article h2 { width: 100%; float: left; margin: 0 0 1em; font-size: 2.3em; font-weight: 700; color: #666;line-height: 1 }

    aside { width: 100%; float: left; }
    aside .box { width: 100%; float: left;  margin: 0 0 10%;  }
    aside .box h5 { width: 100%; float: left; margin: 0; font-size: 1.8em; font-weight: 700; color: #2DA1D2; margin: 0 0 5% }

    aside .box form { width: 100%; float: left;  padding: 0; background: transparent; border-radius: 0; margin: 0 }
    aside .box form input.text { width: calc(100% - 100px); float: left; height: 55px; background: #F4F8F9; border-radius: 10px 0 0 10px; margin: 0; border: 0; padding: 0 20px; box-sizing: border-box; font-size: 1.2em; color: #666  }
    aside .box form input::placeholder { color: #666; font-weight: 400 }

    aside .box form button { width:100px; float: left; height: 55px; background: #2DA1D2; border-radius: 0 10px 10px 0; margin: 0; border: 0; padding: 0 20px; box-sizing: border-box; font-size: 1.2em; color: #FFF; font-weight: 700; cursor: pointer; transition: .15s }
    aside .box form button:hover { opacity: .8  }

    aside .box ul { width: 100%; float: left; background: #F4F8F9; box-sizing: border-box; padding: 10%; border-radius: 10px }
    aside .box ul li { width: 100%; float: left; font-size: 1.6em; color: #989898; margin: 0 0 1.5em; font-weight: 700; }
    aside .box ul li a { color: #989898; }
    aside .box ul li:last-child { margin: 0 }


    #blog-container article p { text-align: left !important; }
    #blog-container-interna article p { text-align: left !important; }
    #blog-container-interna ul.relacionados p { text-align: left !important; }


    #blog-container-interna { width: 100%; height: auto; position: relative; background:; float: left; z-index: 999; margin:0 0 5%; }
    #blog-container-interna article { width: 80%; margin: 0 10%; padding: 0 0 5%; }
    #blog-container-interna article p { margin: 0 }
    #blog-container-interna article img { margin: 0 0 5% }



    #breadcamp { background: #F4F8F9; width: 90%; margin: 0 5% 5%; float: left; padding: 2em 2em; border-radius: 7px; box-sizing: border-box }
    #breadcamp img { float: left; margin: 2px 2em 0 0}
    #breadcamp img.arrow { margin: 6px 1.5em 0}
    #breadcamp li { list-style: none; float: left; color: #B1B1B1; line-height: 1.5; font-size: 1.4em; font-weight: 400 }
    #breadcamp li a { color: #2DA1D2 }


    #blog-container-interna ul.relacionados { width: 85%; margin: 0 7.5%; padding: 0 0 5%; }
    #blog-container-interna ul.relacionados h4 { width: 100%; float: left; margin: 0 0 1em; font-size: 3.3em; font-weight: 700; color: #2DA1D2;line-height: 2; text-align: center }

    #blog-container-interna ul.relacionados li { width: 33.333%; box-sizing: border-box; float: left; padding: 0 2.5% 5%; }


    #blog-container-interna ul.relacionados li figure { width: 100%; float: left; margin: 0 0 30px; height: 170px; background: #CCC; background-position: center !important; background-size: cover !important; border-radius: 7px; }

    #blog-container-interna ul.relacionados li h3 { width: 100%; float: left; margin: 0; font-size: 2.3em; font-weight: 700; color: #666;line-height: 1 }
    #blog-container-interna ul.relacionados li p { width: 100%; float: left; margin: 0 0 1em; font-size: 1.3em; font-weight: 400; color: #909090;line-height: 1.6 }
    #blog-container-interna ul.relacionados li a { float: left; margin: 0 0 1em; font-size: 1.3em; font-weight: 700; color: #2DA1D2;line-height: 1.5 }





    h3#msg_falha {
        color: #ffffff;
        float: right;
        font-size: 1.5em;
        text-align: center;
        line-height: 1;
        background: #ff9696;
        padding: 2% 15%;
        box-sizing: border-box;
        margin: -15px 0 10px;
        border-radius: 7px;
        min-width: 960px;
        max-width: 100%;
        margin: 0 auto;
    }

    h3#msg_sucesso {
        color: #33c998;
        float: right;
        font-size: 1.5em;
        text-align: center;
        line-height: 1;
        background: #c1ffeb;
        padding: 2% 15%;
        box-sizing: border-box;
        margin: -15px 0 10px;
        border-radius: 7px;
        min-width: 960px;
        max-width: 100%;
        margin: 0 auto;
    }












/*============== RAIZ 2019 ===============*/
:root {
    --azul: #007eb3;        /*   var(--azul)   */
    --azul-claro: #0a9dd8;        /*   var(--azul)   */
    --amarelo: #FFC978;     /*   var(--amarelo)   */
    --verde: #48E1C1;       /*   var(--verde)   */
    --verde-leve: #e9fffa;       /*   var(--verde-leve)   */
    --vermelho: #FF717B;    /*   var(--vermelho)   */
    --roxo: #775dd0;    /*   var(--roxo)   */
    --vermelho-leve: #fff5f6;    /*   var(--vermelho-leve)   */
    --preto: #616161;       /*   var(--preto)   */
    --cinza: #888888;       /*   var(--cinza)   */
    --cinza-leve: #b7b7b7;  /*   var(--cinza-leve)   */
    --azul-leve: #EEF5F6;   /*   var(--azul-leve)   */
    --azul-medio: #98B4BB;   /*   var(--azul-medio)   */
    --bg-leve: #f7f7f7;     /*   var(--bg-leve)   */

    --sompo: #b3001f;        /*   var(--sompo)   */
    --sompo1: #b3001f0d;        /*   var(--sompo)   */
    --delta1: #007eb31c;        /*   var(--delta1)   */


    --swift: #EEF5F6;     /*   var(--swift)   */


    --caminhao: #00b6e9;;        /*   var(--caminhao)   */
    --chaveiro: #FEB019;        /*   var(--chaveiro)   */
    --taxi: #CC69FD;            /*   var(--taxi)   */
    --vidro : #5DD8BF;          /*   var(--vidro )   */
    --auto-moto: #F85A65;       /*   var(--auto-moto)   */
    --especial: #FFE45A;        /*   var(--especial)   */
    --caminhao-vidro: #FC3BEF;  /*   var(--caminhao-vidro)   */
    --reboque-oficina: #51FF45; /*   var(--reboque-oficina)   */
    --oficina: #FC763B;         /*   var(--oficina)   */

  }

 label.new {background: var(--swift); color: #FFF; font-weight: 700; font-size: 0.95em; color: #FFF; padding: 3px 7px; border-radius: 4px; margin: 1px 0 -1px; }
 .new.simples { color: var(--azul-medio) !important; }
 .new.simples2 { --swift:var(--azul-medio);  color:#EEF5F6 !important }
 
 .new.cancelar { color: var(--cinza) !important; background: transparent; border:1px solid var(--cinza-leve) }
 .new.zero { --swift:#FFF;  color:#656565 }
 .new.azul { --swift: var(--azul); }
 .new.azul-claro { --swift: var(--azul-claro); }
 .new.sompo { --swift: var(--sompo); }
 .new.sompo1 { --swift: var(--sompo1); color:#b3001f }
 .new.bike { --swift: var(--bike); color:#B32A000D }
 .new.delta1 { --swift: var(--delta1); color:#007eb3 }
 .new.amarelo { --swift: var(--amarelo); }
 .new.verde { --swift: var(--verde); }
 .new.verde-leve { --swift: var(--verde-leve);  color:var(--verde) }
 .new.vermelho { --swift: var(--vermelho); }
 .new.roxo { --swift: var(--roxo); }
 .new.vermelho-leve { --swift: var(--vermelho-leve);  color:var(--vermelho) }
 .new.azul-medio { --swift: var(--azul-medio); }
 .new.cinza-leve { --swift: var(--cinza-leve); }
 .new.preto { --swift: var(--preto); }
 .new.big {font-weight: 600; font-size: 1.7em; padding: 1em 2em;}



 a.new { background: var(--swift); text-transform: uppercase; font-size: 0.95em; font-weight: 700; text-transform: uppercase; border-radius: 50px; color: #FFF !important; padding: 0.6em 1.25em 0.65em; transition: .3s }
 input.new { background: var(--swift); text-transform: uppercase; font-size: 0.95em; font-weight: 700; text-transform: uppercase; border-radius: 50px; color: #FFF !important; padding: 0.6em 1.25em 0.65em; transition: .3s; border:0 }
 a.new:hover { opacity: .8; }
 button.new { background: var(--swift); text-transform: uppercase; font-size: 0.95em; font-weight: 700; text-transform: uppercase; border-radius: 50px; color: #FFF !important; padding: 0.6em 1.25em 0.65em; transition: .3s; border:0 }
 button.new:hover { opacity: .8; }


 form input[type=text] { background: #f9f9f9 }
 form input[type=file] { background: #f9f9f9; padding: 14px 15px !important;     border: 0 !important; }
 form input[type=text]::placeholder { color: var(--cinza-leve) }
 form input[type=file]::placeholder { color: var(--cinza-leve) }
 form input:disabled { background: #f7fafa !important; border:0 !important;  color: #6d919a !important; }
 form input:disabled::placeholder { color: var(--azul-medio) !important; }

 .flex-box textarea.field { height: 120px; background: #fbfbfb; padding: 15px; }
 .flex-box textarea.field.small { height: 70px; padding: 10px 130px 10px 15px;  }
 .flex-box textarea.field::placeholder { color: var(--cinza-leve) }

 .new.flutuante { position: absolute; right: 20px; top: 19px; }

    /*============== RAIZ 2019 ===============*/
    /*============== FLEXBOX 2019 ===============*/
    .flex-content {
        display: flex;
        flex-wrap: wrap;
        padding: 0;
        margin: -15px;
    }
    .flex-box { position: relative; margin: 26px 15px 40px 15px; flex-basis: auto;  list-style: none }
    .box-1 { flex: 1; }
    .box-2 { flex: 2; }
    .box-3 { flex: 3;  }

    .space-between {justify-content: space-between;}
    .flex-box .field { border-radius: 7px; height: 50px; padding: 0 15px; border: 1px solid #F2F2F2; color: var(--preto); font-size: 1.35em; font-weight: 600; width: -webkit-fill-available; background: #f7f7f7;  }
    .flex-box .field::placeholder { color: var(--cinza-leve) }

    .flex-box select.field { margin: 0; }
    label.flex-box::before { content: attr(data-content); color: var(--preto); padding: 0; position: absolute; left: 0; bottom: 115%; line-height: 1; font-size: 1.2em; font-weight: 600; }


    label.flex-box.radix { color: var(--preto); padding: 0; line-height: 1; font-size: 1.4em; font-weight: 600;     margin: 26px 15px 15px 15px; }
    label.flex-box.radix input { float:left; margin: 0 6px 0 0; height: 15px; width: 15px;  }
    
    label.flex-box.radix p { position: relative; float:left; margin: 0; cursor: pointer; padding: 0 0 0 5px;     font-weight: 500; }

    .flex-content.Floated label { width: 100%;
        float: left;
        flex: none;
        margin: 13px 15px 0; }


    .flex-box.double .field { width: 37px; float: left;  }
    .flex-box.double p{  float: left;  font-size: 1.3em; font-weight: 500; color: #888;
        margin: 18px 7px 0;  }

    label.flex-box input[type=file] { box-sizing: border-box; padding: 13px 18px; }



    /*===== Radio Moderno ======*/
    label.flex-box.radix input[type=radio] { opacity: 0; }
    label.flex-box.radix input[type=radio] + p::before { content: ''; position: absolute; left: -21px; bottom: -2px; width: 18px; height: 18px; border-radius: 50%; border: solid 2px #666666; vertical-align: bottom; cursor: pointer;  }
    label.flex-box.radix input[type=radio]:checked + p::after { content: '';background-color: var(--azul-claro);width: 12px;height: 12px;border-radius: 50%;position: absolute;left: -16px;bottom: 3px;}
    label.flex-box.radix input[type=radio]:checked + p::before {border: solid 2px var(--azul-claro);}
    label.flex-box.radix input[type=radio]:checked + p { color: var(--azul-claro);font-weight: 700; }

    /*===== checkbox Moderno ======*/
    label.flex-box.radix input[type=checkbox] { opacity: 0; }
    label.flex-box.radix input[type=checkbox] + p::before { content: ''; position: absolute; left: -21px; bottom: -2px; width: 18px; height: 18px; border-radius: 6px; border: solid 2px #666666; vertical-align: bottom; cursor: pointer;  }
    label.flex-box.radix input[type=checkbox]:checked + p::after { content: '';background-color: var(--azul-claro);width: 12px;height: 12px;border-radius: 3px;position: absolute;left: -16px;bottom: 3px;}
    label.flex-box.radix input[type=checkbox]:checked + p::before {border: solid 2px var(--azul-claro);}
    label.flex-box.radix input[type=checkbox]:checked + p { color: var(--azul-claro);font-weight: 700; }




    /*============== FLEXBOX 2019 ===============*/
    .cadastro_prestador form { padding: 5px; background: transparent; }
    .cadastro_prestador #topper { height: auto; }
    .cadastro_prestador #topper h2 { font-size: 4.5em; padding: 55px 0; }
    .cadastro_prestador .top { width: 100%; text-align: center; float: left; margin:5% 0 3%; }
    .cadastro_prestador .top small { width: 100%; text-align: center; float: left; font-size: 2.1em; font-weight: 700; color: #7E7E7E;}
    .cadastro_prestador .top p { width: 50%; text-align: center; margin: 1% 25% 0; line-height: 1.4; float: left; color: #666; font-size: 1.5em; font-weight: 300;}
    .cadastro_prestador .box_msgs { display: flex; flex-direction: row; justify-content: center; align-items: center; width: 100%; margin-bottom: 20px; }

    .cadastro_prestador ul.bread { width: 100%; float: left; margin: 0 0 3%; position: relative;}
    .cadastro_prestador ul.bread li { width: 20%; float: left; position: relative; }
    .cadastro_prestador ul.bread li .ball { width: 48px; height:48px; float: left; text-align: center; background: #F6F6F6; border-radius: 50%; font-size: 2em; font-weight: 700; color: #EAEAEA; box-sizing: border-box;
        padding-top: 12px; position: relative; left: 50%; transform: translate(-50%); z-index: 3; }
    .cadastro_prestador ul.bread li p { width: 100%; float: left; text-align: center; font-size: 1.15em;      color: #B9B9B9; margin-top: 10px; }
    .cadastro_prestador ul.bread li .line { width: 100%; height: 5px; background:#F6F6F6; float: left; position: absolute; z-index: 1; top: 22px; }
    .cadastro_prestador ul.bread li:first-child .line { width: 50%; right: 0;  }
    .cadastro_prestador ul.bread li:last-child .line { width: 50%; }

    .cadastro_prestador ul.bread li.active .ball { background:#0081B2; color:#FFF }
    .cadastro_prestador ul.bread li.active p { font-weight: 700; color:#7E7E7E; }

    .cadastro_prestador ul.bread li.active.done .ball span { display: none; }
    .cadastro_prestador ul.bread li.active.done .ball::before { content: url(../../img/icons/check-white.svg); margin: 2px 0 0 13px; float: left; }
    .cadastro_prestador ul.bread li.active.done p { font-weight: 400; color:#B9B9B9; }
    .cadastro_prestador ul.bread li.active.done .line { background:#0081B2 }

    .cadastro_prestador ul.bread li .line-active { display: none; width: 50%; height: 5px; background:#0081B2; float: left; position: absolute; z-index: 2; top: 22px; }
    .cadastro_prestador ul.bread li.active .line-active {  display: block; }



    /*============== FORMULARIO STYLE 2019 ===============*/
    #Container { width: 100%; float: left; background: #FFF; box-shadow: 1px 1px 3px #e5e5e5; border-radius: 4px; padding: 0; margin: 0 0 5%; }
    #Container .ContainerIn { padding: 40px; }
    #Container .ContainerIn #Pesquisa { margin: 0 0 10px; }
    #Container ul li { list-style: none }

    #Container .ContainerIn h5 {width: 100%; float: left; font-size: 1.6em; font-weight: 500; color:#666666; margin: 1% 0 40px; }
    #Container .ContainerIn h6 {width: 100%; float: left; font-size: 1.3em; font-weight: 500; color:#888; margin: 1% 0 2%; }

    #Container .ContainerIn h5.foradio { margin: 0; }
    #Container .ContainerIn h5.final { color: #22e0b8; font-size: 1.5em; font-weight: 700; }
    #Container .ContainerIn h5 small { color: var(--cinza);  }
    #Container .ContainerIn form input[type=text] { background: #ffffff !important; }

    #Container .box { width: 100%; margin: 0 0 3%; padding: 0 0 40px; float: left; border-bottom: 1px solid #f2f2f2; position: relative; }
    #Container .box.two { width: 100%; margin:2em 0; padding: 0 2.5%; min-height: 510px; }
    #Container .box.two #Filtro { margin:2em 0 0;   }

    #Container .box.noline { border-bottom: 0;margin: 0; float: left;}
    #Container .box.lateraline { border-bottom: 0;margin: 0; border-right: 1px solid #f2f2f2; }
    #Container .box:last-child { margin: 0; border-bottom: 0 }
    #Container .box-interno {  width: 100%; border-radius: 7px;  float: left;  margin: 20px 0 0; padding: 5%; background: #f8fcfc; box-sizing: border-box; }

    #Container .ContainerEdit { width: 100%; box-sizing: border-box; float: left; background: var(--bg-leve); border-top: 1px solid #f8f8f8; border-radius: 0 0 4px 4px; padding: 1.5% 3.5% 2% !important; margin: 0 !important; justify-content: space-between; }
    #Container .ContainerEdit .flex-box { margin: 26px 0 15px 15px; }
    .modal #Container h4 { color: var(--azul) !important; font-size: 1.8em; font-weight: 700; margin: 0.5% 0 0; }
    
    #Container .ContainerIn p.mostra { font-size: 1em; font-weight: 600; color: var(--cinza); margin: 0 20px 0 0; }
    

    /* width */
    #Container .box-interno::-webkit-scrollbar {
        width: 7px;
    }
    /* Track */
    #Container .box-interno::-webkit-scrollbar-track {
        background: #f1f1f1;
    }
    /* Handle */
    #Container .box-interno::-webkit-scrollbar-thumb {
        background: #dedede;
        border-radius: 50px;
    }
    /* Handle on hover */
    #Container .box-interno::-webkit-scrollbar-thumb:hover {
        background: #cccccc;
    }


    /*============== NEW TABLE 2019 ===============*/
    .table-top { padding: 0 0 2%; display: flex; align-content: space-between; justify-content: flex-end  }
    .table-top h4 { color: var(--preto); font-weight: 600; font-size: 1.2em  }
    .table-top .flex-content { margin: 0 }
    .table-top .field { color: var(--preto); font-size: 0.85em; height: 36px; padding: 0 10px; border:1px solid #f2f2f2; border-radius: 4px; font-weight: 600;    margin: 0 0 0 10px;}
    .table-flex .field { color: var(--preto); font-size: 1.2em; height: 36px; padding: 0 10px; border:1px solid #f2f2f2; border-radius: 4px; font-weight: 600;    margin: 0; background: #FFF }

    table.table-flex { width: 100%; float: left; font-size: 1.2em; color: var(--preto); font-weight: bold; margin: 30px 0 30px 0;  }
    table.table-flex tr:nth-child(odd) { background-color:var(--bg-leve) }
    table.table-flex tr td {position: relative; padding: 13px 5px; min-width: 60px; font-weight: 500; }
    table.table-flex tr td a { color: var(--azul); }
    table.table-flex tr td img { width: 30px }
    table.table-flex tr:first-child td::after { content: attr(data-content) !important; color: var(--cinza-leve); padding: 5px; position: absolute; left: 0; bottom: 110%; line-height: 1; font-size: 0.9em; }

    table.table-flex tr td .new { float: left;     text-align: center; line-height: 1.3; }
    table.table-flex tr td a.new.small { padding: 0.3em 0.9em 0.3em; font-size:0.81em }
    table.table-flex tr td a.new.iconn { width: 22px;
    height: 22px; box-sizing: border-box; padding: 5px 3px 3px 4px; line-height: 1; font-size: 0.81em; margin: -1px 0 0 5px; border:0; zoom: .8; }

    table.table-flex tr.linhas td p { float: left; margin:0 }  
    table.table-flex.resultado { margin: 0;  }
    table.table-flex.resultado tr:nth-child(odd) { background-color:transparent }
    table.table-flex.nocadastro tr td { text-align: center;  }
    table.table-flex.nocadastro tr td img {  width: 208px;  }
    table.table-flex.nocadastro tr:nth-child(odd) { background-color:transparent }
    table.table-flex tr.gamb td { padding: 0 !important; }

    table.table-flex tr [data-content="Parcela"] { min-width: 40px; }
    table.table-flex tr [data-content="img"] { text-align:center }
    table.table-flex tr [data-content="img"]::after { display: none }
    table.table-flex tr [data-content="ação"] { text-align:right }
    table.table-flex tr [data-content="ação"]::after { display: none }
    table.table-flex tr [data-content="titulo"] { padding-left: 0; font-size: 1.2em; color: var(--cinza-leve); font-weight: 600;}
    table.table-flex tr [data-content="titulo"]::after { display: none }

    table.table-flex tr [data-content="Situação"] a { float: left; margin: 0 5px 3px 0; }



    @media (max-width: 767px) {
        table.table-flex { margin: 0; }
        table.table-flex tr:nth-child(odd) { background-color:#FFF }
        table.table-flex { border-bottom: 1px solid var(--bg-leve);  }
        table.table-flex tr { width: 100%; float: left;  border: 1px solid var(--bg-leve); border-bottom: 0; padding: 7%; box-sizing: border-box; }
        table.table-flex tr td { padding: 5px; width: 100%; float: left;     }
        table.table-flex tr td::after, table.table-flex tr:first-child td::after { content: attr(data-content); color: var(--cinza-leve); padding: 2px 15px 2px 0; position: relative; left: inherit; bottom: inherit; line-height: 1; font-size: 0.9em; width: 40%; float: left; }
    }

    

    /*============== NEW TABLE 2019 ===============*/


    .clickable { cursor: pointer; }
    .no-clickable { pointer-events: none; touch-action: none; cursor: not-allowed; }

    .borda_vermelha { border: 1px solid rgba(255, 0, 0, 0.5) !important; }

    .asterisco { margin-right:-12px; margin-right: -15px; padding-left: 8px; font-size:1.5em;}

    .prestador_servico_th {
        text-align:left;
        vertical-align:bottom;
        padding-left:7px;
    }