﻿/******************************************************************
 RESET CSS - Normalize
******************************************************************/
body, img, p, h1, h2, h3, fieldset { margin: 0; padding: 0; border: 0; resize: none; }
a:hover { text-decoration: none !important; }
input[type=submit] { cursor: pointer; }
*:focus { outline: none; }
h1, h2, h3, h4, h6 { margin: 0; padding: 0; }
::selection { background: #000; color: #fafafa; }
::-moz-selection { background: #000; color: #fafafa; }
._v-align { display: inline-block; vertical-align: middle; line-height: normal; }
.relative { position: relative; }
.unstyled { background:none; border:0; box-shadow:none; }

/******************************************************************
Geral Html
******************************************************************/
@font-face { font-family: 'ScoutCond'; src: url('../assets/fonts/ScoutCond/webfont/ScoutCond-Regular/ScoutCond-Regulard41d.eot?#iefix') format('embedded-opentype'), url('../assets/fonts/ScoutCond/webfont/ScoutCond-Regular/ScoutCond-Regular.html') format('opentype'), url('../assets/fonts/ScoutCond/webfont/ScoutCond-Regular/ScoutCond-Regular.woff') format('woff'), url('../assets/fonts/ScoutCond/webfont/ScoutCond-Regular/ScoutCond-Regular.ttf') format('truetype'), url('../assets/fonts/ScoutCond/webfont/ScoutCond-Regular/ScoutCond-Regular.svg#ScoutCond-Regular') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'Omnes-Light'; src: url('../assets/fonts/Omnes/webfont/omnes-light/Omnes-Lightd41d.eot?#iefix') format('embedded-opentype'), url('../assets/fonts/Omnes/webfont/omnes-light/Omnes-Light.woff') format('woff'), url('../assets/fonts/Omnes/webfont/omnes-light/Omnes-Light.ttf') format('truetype'), url('../assets/fonts/Omnes/webfont/omnes-light/Omnes-Light.svg#Omnes-Light') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'Omnes-Semibold'; src: url('../assets/fonts/Omnes/webfont/omnes-semibold/Omnes-Semiboldd41d.eot?') format('eot'), url('../assets/fonts/Omnes/webfont/omnes-semibold/Omnes-Semibold.woff') format('woff'), url('../assets/fonts/Omnes/webfont/omnes-semibold/Omnes-Semibold.ttf') format('truetype'), url('../assets/fonts/Omnes/webfont/omnes-semibold/Omnes-Semibold.svg#Omnes-Semibold') format('svg'); }
@font-face { font-family: 'Omnes'; src: url('../assets/fonts/Omnes/webfont/omnes-regular/Omnes-Regulard41d.eot?') format('eot'), url('../assets/fonts/Omnes/webfont/omnes-regular/Omnes-Regular.woff') format('woff'), url('../assets/fonts/Omnes/webfont/omnes-regular/Omnes-Regular.ttf') format('truetype'), url('../assets/fonts/Omnes/webfont/omnes-regular/Omnes-Regular.svg#Omnes-Regular') format('svg'); }
@font-face { font-family: 'Omnes-Medium'; src: url('../assets/fonts/Omnes/webfont/omnes-medium/Omnes-Mediumd41d.eot?') format('eot'), url('../assets/fonts/Omnes/webfont/omnes-medium/Omnes-Medium.woff') format('woff'), url('../assets/fonts/Omnes/webfont/omnes-medium/Omnes-Medium.ttf') format('truetype'), url('../assets/fonts/Omnes/webfont/omnes-medium/Omnes-Medium.svg#Omnes-Medium') format('svg'); }
@font-face { font-family: 'SceneStd'; src: url('../assets/fonts/SceneStd/webfont/SceneStd-Regular/SceneStd-Regulard41d.eot?#iefix') format('embedded-opentype'), url('../assets/fonts/SceneStd/webfont/SceneStd-Regular/SceneStd-Regular.html') format('opentype'), url('../assets/fonts/SceneStd/webfont/SceneStd-Regular/SceneStd-Regular.woff') format('woff'), url('../assets/fonts/SceneStd/webfont/SceneStd-Regular/SceneStd-Regular.ttf') format('truetype'), url('../assets/fonts/SceneStd/webfont/SceneStd-Regular/SceneStd-Regular.svg#SceneStd-Regular') format('svg'); font-weight: normal; font-style: normal; }

body {overflow-x: hidden; animation: fadein 1s; -moz-animation: fadein 1s; /* Firefox */ -webkit-animation: fadein 1s; /* Safari and Chrome */ -o-animation: fadein 1s; /* Opera */ position:relative; }
body .wrapper { width: 1000px; display: block; margin: auto; position: relative; }

.large-wrapper { width: 1500px; display: block; margin: auto; position: relative; }
.small-wrapper { width: 700px; display: block; margin: auto; position: relative; }
.med-wrapper { width: 950px; display: block; margin: auto; position: relative; }

#ZCmsContent {margin-top:-5px !important; padding-bottom:64px; padding-top:103px; min-height: 100vh; background:#fff;}

/* button social*/
.circle { position: relative; width: 34px; height: 34px; display: inline-block; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; text-align: center; margin-left: 10px; }
    .circle.bgblue { background-color: #004EA0 !important; color: white !important; -moz-transition: ease-out 1s; -o-transition: ease-out 1s; -webkit-transition: ease-out 1s; transition: ease-out 1s; }
        .circle.bgblue:hover { background-color: #00AEE9 !important; }
    .circle .fa-facebook { position: absolute; right: 0; left: 0; margin: auto; top: 8px; display: block; font-size: 22px; }

    .desk { display: block !important; }
    .mobile { display: none !important; } 


/******************************************************************
Header
******************************************************************/
#Mobile { display:none; position:relative;}
.mobileWrapper { display:none; position:fixed; width:100%; z-index:20;margin-top:5px; border-bottom:2px solid #E2E2E2;background:white;}

#Header { padding-top: 10px; left: 0; position: fixed; display: block; background-color: white; width:100%; z-index:20; top:0; /*height:100px;*/ border-bottom:2px solid #E2E2E2; }
    .logo { background: url('../assets/images/sprites.png') -0px -0px; width: 145px; height: 93px; display: inline-block; position: relative; z-index: 5; vertical-align:middle; margin-top:5px;}
        #Header .logo:hover { background: url('../assets/images/sprites.png') -0px -0px; width: 145px; height: 93px; }
    #Header a { color: #969696; text-decoration: none; margin: 0 2px; text-transform: uppercase; letter-spacing: 1px; }
        #Header a:hover { background: none; color: #00ade8; -moz-transition: ease-out 1s; -o-transition: ease-out 1s; -webkit-transition: ease-out 1s; transition: ease-out 1s; }
    #Header .language { text-align: right; height: 35px; color: #969696; margin-right: 91px; }
    #Header ul { font-family: 'ScoutCond'; font-size: 22px; padding: 0; margin-bottom: 0; text-align: center; vertical-align:middle;}
        #Header ul li { margin: 0 5px; list-style: none; display: inline-block; }
    #Header .slogan {width: 150px; height: 48px; display: inline-block; vertical-align:middle; position: relative; top: 20px; }
    #Header .active { color: #00AEE9; }
    #Header .dropdown a:hover { background: none !important; }

    #Header .dropdown-menu { position:fixed; border: none; top:100px; left:0; right:0;  z-index: 4; margin:0; }
    #Header .nav .open > a, .nav .open > a:hover, .nav .open > a:focus { background-color: none !important; }
    #Header ul li ul li { display: inline-block; list-style: none; margin: 0 -22px; text-align: left; }
        #Header ul li ul li a { font-family: ScoutCond; font-size: 24px; color: #005CA0 !important; text-transform: uppercase; text-align: center; padding: 0; }
        #Header ul li ul li:hover a { color: #00AEE9 !important; background-color: transparent !important; }
        #Header ul li ul li a img { max-width: 55%; }
        #Header ul li ul li:hover a img { opacity: 0.8; -moz-opacity: 0.8; -khtml-opacity: 0.8; filter: alpha(opacity=80); }
        #Header ul li ul li a span { display: block; position: relative; top: -8px; }

/******************************************************************
Footer
******************************************************************/
#Footer { height: 64px; display: block; padding: 15px; font-family: 'Omnes'; border-top:2px solid #E2E2E2; position: absolute;bottom: 0;left: 0;right: 0;margin: auto; background: white;}
    #Footer .copyWrapper {display:inline-block;margin-left:30px;}
    #Footer .icon-partern1 { margin-left: 40px; }
    #Footer a { display:inline-block; vertical-align:middle; }
    #Footer .gray { color: #969696; position: relative; }
        #Footer .gray a { color: #969696; text-transform: uppercase; font-size: 14px; padding-top: 2px; margin-right:100px; }
            #Footer .gray a:hover { color: #00AEE9; }
    #Footer .copy { color: #969696; font-size: 14px; position: relative; top: 2px; }
    #Footer .itp-btn { margin-left:25px; }


/******************************************************************
Icons
******************************************************************/
.icon { display: inline-block; vertical-align: middle; }
    .icon.icon-agencia { background: url('../assets/images/sprites.png') -297px -36px; width: 68px; height: 12px; }
    .icon.icon-itp { background: url('../assets/images/sprites.png') -371px -0px; width: 181px; height: 26px; }
    .icon.icon-partern1 { background: url('../assets/images/sprites.png') -297px -0px; width: 36px; height: 34px; }
    .icon.icon-partern2 { background: url('../assets/images/sprites.png') -333px -0px; width: 37px; height: 34px; }
    .icon.icon-more { background: url('../assets/images/sprites.png') -0px -93px; width: 54px; height: 54px; }
    .icon.icon-btnBlue { background: url('../assets/images/sprites.png') -54px -147px; width: 51px; height: 51px; }
    .icon.icon-btnPink { background: url('../assets/images/sprites.png') -0px -147px; width: 51px; height: 51px; }
    .icon.icon-btnPurple { background: url('../assets/images/sprites.png') -54px -93px; width: 51px; height: 51px; }
    .icon.icon-btnYellow { background: url('../assets/images/sprites.png') -114px -93px; width: 51px; height: 51px; }
    .icon.icon-pme { background: url('../assets/images/sprites.png') -168px -50px; width: 179px; height: 79px; }
    .icon.icon-kozzi-logo { background: url('../assets/images/sprites.png') -347px -58px; width: 103px; height: 86px; }
    .icon.icon-love-kozzi { background: url('../assets/images/sprites.png') -450px -36px; width: 142px; height: 146px; }
    .icon.icon-pdf { background: url('../assets/images/sprites.png') -613px -1px; width: 45px; height: 66px; }
    .icon.icon-phone { background: url('../assets/images/sprites.png') -2px -278px; width: 21px; height: 21px; }
    .icon.icon-fax { background: url('../assets/images/sprites.png') -2px -229px; width: 21px; height: 22px; }
    .icon.icon-web { background: url('../assets/images/sprites.png') -2px -255px; width: 21px; height: 21px; }
    .icon.icon-telephone { background: url('../assets/images/sprites.png') -2px -204px; width: 21px; height: 22px; }
    .icon.icon-location { background: url('../assets/images/sprites.png') -2px -303px; width: 21px; height: 21px; }


@media print 
{
    #Header, #Footer{ display: none; }
    #AccountOrder { padding: 0; }
        #AccountOrder .box { margin: 0; padding: 0; }
        #AccountOrder .btn { display: none; }
        #AccountOrder .col-md-6 { width: 50% !important; float: left !important; }
}

/* animations */

.animated { -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; }

@keyframes fadein {
    from { opacity: 0; }
    to { opacity: 1; }
}

@-moz-keyframes fadein { /* Firefox */
    from { opacity: 0; }
    to { opacity: 1; }
}

@-webkit-keyframes fadein { /* Safari and Chrome */
    from { opacity: 0; }
    to { opacity: 1; }
}

@-o-keyframes fadein { /* Opera */
    from { opacity: 0; }
    to { opacity: 1; }
}



@-webkit-keyframes bounceInRight {
    0% { opacity: 0; -webkit-transform: translateX(2000px); -moz-transform: translateX(2000px); -ms-transform: translateX(2000px); -o-transform: translateX(2000px); transform: translateX(2000px); }

    60% { opacity: 1; -webkit-transform: translateX(-30px); -moz-transform: translateX(-30px); -ms-transform: translateX(-30px); -o-transform: translateX(-30px); transform: translateX(-30px); }

    80% { -webkit-transform: translateX(10px); -moz-transform: translateX(10px); -ms-transform: translateX(10px); -o-transform: translateX(10px); transform: translateX(10px); }

    100% { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); }
}

@keyframes bounceInRight {
    0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); -moz-transform: translateX(2000px); -o-transform: translateX(2000px); transform: translateX(2000px); }

    60% { opacity: 1; -webkit-transform: translateX(-30px); -ms-transform: translateX(-30px); -moz-transform: translateX(-30px); -o-transform: translateX(-30px); transform: translateX(-30px); }

    80% { -webkit-transform: translateX(10px); -ms-transform: translateX(10px); -moz-transform: translateX(10px); -o-transform: translateX(10px); transform: translateX(10px); }

    100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); -moz-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); }
}

.bounceInRight { -webkit-animation-name: bounceInRight; -moz-animation-name: bounceInRight; -o-animation-name: bounceInRight; animation-name: bounceInRight; }

@-webkit-keyframes bounceInDown {
    0% { opacity: 0; -webkit-transform: translateY(-2000px); -moz-transform: translateY(-2000px); -ms-transform: translateY(-2000px); -o-transform: translateY(-2000px); transform: translateY(-2000px); }

    60% { opacity: 1; -webkit-transform: translateY(30px); -moz-transform: translateY(30px); -ms-transform: translateY(30px); -o-transform: translateY(30px); transform: translateY(30px); }

    80% { -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); transform: translateY(-10px); }

    100% { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); }
}

@keyframes bounceInDown {
    0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); -moz-transform: translateY(-2000px); -o-transform: translateY(-2000px); transform: translateY(-2000px); }

    60% { opacity: 1; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); -moz-transform: translateY(30px); -o-transform: translateY(30px); transform: translateY(30px); }

    80% { -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); -moz-transform: translateY(-10px); -o-transform: translateY(-10px); transform: translateY(-10px); }

    100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); -moz-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); }
}

.bounceInDown { -webkit-animation-name: bounceInDown; -moz-animation-name: bounceInDown; -o-animation-name: bounceInDown; animation-name: bounceInDown; }
