/*****************************
SITE: IPDEC
DATA: 18/08/2018
DESIGN: IPDEC
DESENVOLVIDO POR: Ricardo Belfort

REFORM BASED 1366 ON: 12/12/2018
*****************************/

/*
RESET
*/
* {
	margin:0;
	padding: 0;
    outline: 0;
    border: 0;
    
    font-family: 'Open Sans', sans-serif;
    font-size: 1em;
    font-weight: 300;
    -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;    
    line-height: 1.6em;
    letter-spacing: 0;
    box-sizing: border-box;
    -o-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

html, 
body{
    min-height: 100%;
    height: 100%;
    background-color: #fff;
    color: #8a8989;
}


/*
DEFAULT TITLES 
*/
h1{
    font-size:2em;
    font-weight: 300;
}
h2{
    font-size:1.6em;
    font-weight: 400;
    margin-bottom: 15px;
    border-bottom: 3px solid #c2c2c2;
}
h3{
    font-size:1em;
    font-weight: 700;
}


/*
DEFAULT LINKS
*/
a{
    color:#152860;
    font-weight: 500;
    text-decoration:none;
}
a:hover{
    color:#00CF31;
    text-decoration:none;
}
a img{
    border: 0;
}


/*
HELPERS
*/

b,
strong{
    font-weight: bold;
}
mark{
    padding: 5px 10px;
    background-color: #eee;
}
ul{
    list-style: none;
}
img{
    max-width: 100%;
    vertical-align: middle;
}
small {font-size: 0.75em; color: #555;}
sup {top: -0.8em;}
sub, sup {font-size: 60%; line-height: 0; position: relative; vertical-align: baseline;}
hr{
    border: none;
    background-color: #ddd;
    color: #eee;
    margin: 30px;
    height: 1px; margin-bottom: 20px;/* IE6 e 7*/
}
.far, .fas {margin-right: 10px;}
.ds_none {display: none !important;}
.m-bottom{margin-bottom: 20px !important;}
.textshadow{text-shadow: rgb(0, 0, 0) 0px 1px 1px;}
.boxshadow{-webkit-box-shadow: 0px 1px 5px rgba(0,0,0,0.3); -moz-box-shadow: 0px 1px 5px rgba(0,0,0,0.3); box-shadow: 0px 1px 5px rgba(0,0,0,0.3)}
.boxshadow-container{-webkit-box-shadow: 0px 3px 3px 3px rgba(0,0,0,0.5); -moz-box-shadow: 0px 3px 3px 3px rgba(0,0,0,0.5); box-shadow: 0px 3px 3px 3px rgba(0,0,0,0.5);}
.last{margin-right: 0 !important;}
.clear{clear: both;}


/********** CONTAINERS **********/
.container-header{float: left; width: 100%; margin-top: 60px;}
.content-nopad{width: 70%; margin: 0 15%;}
.content-page{padding: 5% 0 !important;}
.flexbox-container{max-width: 1200px; margin: 0 auto;}

.maps-container {
    width: 100%;
    background-color: #E9E5DC;
}

/*
BOX STYLES
*/
.radius {
    --radius: 4px;
    border-radius: var(--radius);
    -o-border-radius: var(--radius);
    -moz-border-radius: var(--radius);
    -webkit-border-radius: var(--radius);
}

.rounded {
    --radius: 50%;
    border-radius: var(--radius);
    -o-border-radius: var(--radius);
    -moz-border-radius: var(--radius);
    -webkit-border-radius: var(--radius);
}

.transition {
    --seconds: .2s;
    transition-duration: var(--seconds);
    -o-transition-duration: var(--seconds);
    -moz-transition-duration: var(--seconds);
    -webkit-transition-duration: var(--seconds);
    cursor: pointer;
}

/*
COLORS STYLE COM VARIÁVEIS
*/
:root {
    --themeColorA: #00CF31;
    --themeColorA_h: #02af2b;

    --themeColorB: #152860;
    --themeColorB_h: #0d1a41;

    --green: #46ceac;
    --greenH: #35ba9b;
    --greenL: #61ddbc;

    --blue: #4fc0e8;
    --blueH: #3aadd9;
    --blueL: #66d4f1;

    --yellow: #fdcd56;
    --yellowH: #f5b945;
    --yellowL: #fbd277;

    --red: #eb5463;
    --redH: #d94452;
    --redL: #f76c82;
}


/********** BACKGROUND COLORS **********/
.bg-transparent{background-color: transparent; padding: 30px 0;}
.bg-white{background-color: #fff; color: #8a8989 !important;}
.bg-light{background-color: #FAF9FA; color: #8a8989 !important;}
.bg-gray{background-color: #c2c6c9; color: #8a8989 !important;}
.bg-green{background-color: #00CF31; color: #fff !important;}
.bg-lightgreen{background-color: #1ABC9C; color: #fff !important;}
.bg-pattern{background: rgba(52,102,102, .2) url(../img/pattern.png) repeat;}
.bg-orange{background-color: #fd7e14; color: #fff !important;}
.bg-dark{background-color: #323232; color: #fff !important;}
.bg-dark a{color: #c2c6c9;}
.bg-darker{background-color: #2A2A2A; color: #fff !important;}
.bg-gradient{background: -webkit-linear-gradient(left, #86bb40, #0695d6); color: #fff !important;}
.bg-darkblue{background-color: #152860; color: #fff !important;}

.bgreen{background-color: #96db70; color: #fff !important;}
.bblue{background-color: #3B9ADA; color: #fff !important;}
.bred{background-color: #F16670; color: #fff !important;}
.byellow{background-color: #F5B846; color: #fff !important;}
.byellow a{color: #2B2728;}
.byellow a:hover{color: #fff !important;}
.bgray{background-color: #FBFBFC; color: #8a8989 !important;}
.bcyan{background-color: #37BED0; color: #fff !important;}
.bcyan a{color: #fff !important;}
.bcyan a:hover{color: #0069D9 !important;}
.bpurple{background-color: #6f42c1; color: #fff !important;}


/********** BACKGROUND IMAGES **********/
.bg-business{background: url(../img/handshake.jpg) top center no-repeat; background-size: cover; color: #fff !important;}
.bg-bi{background: url(../img/business.jpg) center center no-repeat; background-size: cover; background-attachment: fixed; color: #fff !important;}
.bg-abstract{background: url(../img/abstract-background.jpg) center center no-repeat; background-attachment: fixed; color: #fff !important; min-height: auto;}
.bg-violet{background: url(../img/violet-highlight.jpg) center center no-repeat; background-attachment: fixed; color: #fff !important; min-height: auto;}
.bg-circuit{background: url(../img/circuit.jpg) center center no-repeat; background-attachment: fixed; color: #fff !important; min-height: auto;}
.bg-strategy{background: url(../img/strategy.jpg) center center no-repeat; background-attachment: fixed; color: #fff !important; min-height: auto;}
.bg-books{background: url(../img/books.jpg) center center no-repeat; background-attachment: fixed; color: #fff !important; min-height: auto;}
.bg-literatura{background: url(../img/literatura.jpg) center center no-repeat; background-attachment: fixed; color: #fff !important; min-height: auto;}
.bg-leis{background: url(../img/leis.jpg) center center no-repeat; background-attachment: fixed; color: #fff !important; min-height: auto;}
.bg-contact{background: url(../img/contact.jpg) center center no-repeat; background-attachment: fixed; color: #fff !important; min-height: auto;}
.bg-job{background: url(../img/vagas.jpg) center center no-repeat; background-size: cover; color: #fff !important;}
.bg-code{background: url(../img/desenvolvimento-web.jpg) center center no-repeat; background-size: cover; color: #fff !important;}
.bg-search{background: url(../img/searching.jpg) center center no-repeat; background-attachment: fixed; color: #fff !important; min-height: auto;}
.bg-rank{background: url(../img/ranking_internacional.jpg) center center no-repeat; background-attachment: fixed; color: #fff !important; min-height: auto;}
.bg-patents{background: url(../img/patents.jpg) center center no-repeat; background-attachment: fixed; color: #fff !important; min-height: auto;}
.bg-thanks{background: url(../img/thanks.jpg) center center no-repeat; background-size: cover; color: #fff !important;}


/********** FONT WEIGHT **********/
.light{font-weight: 300 !important;}
.normal{font-weight: 400 !important;}
.bold{font-weight: 700 !important;}
.uppercase{text-transform: uppercase;}


/********** FONT SIZE **********/
.fzero{font-size: 0em !important;}
.fsmall{font-size: 0.8em;}
.fsize1{font-size: 1em;}
.fsize1b{font-size: 1.3em; font-weight: 500;}
.fsize2{font-size: 2em;}
.fsize2b{font-size: 2.5em;}
.fsize3{font-size: 3em;}
.fsize3b{font-size: 3.5em;}


/********** TEXT ALIGN **********/
.al-left{text-align: left;}
.al-right{text-align: right;}
.al-center{text-align: center;}


/********** TITLE **********/
.title {display: flex; align-items: center; justify-content: center; width: 100%; padding: 30px 0; text-align: center;}
.title h1 {font-family: 'Oswald', sans-serif; font-size: 4.4em; font-weight: 300; text-transform: uppercase; text-align: center;}
.title .tagline{font-size: 1em; font-weight: 400; text-align: center;}
.title img {width: 250px; margin-right: 30px;}

/********** TITLE SECTION **********/
.title-section{width: 100%; margin-bottom: 30px;}
.title-section h1{font-family: 'Oswald', sans-serif; font-size: 2.4em; font-weight: 500; margin-bottom: 20px; text-transform: uppercase;}
.title-section .tagline{font-family: inherit; font-size: 1em; font-weight: 300; padding-bottom: 15px;}


/********** SECTION TITLE **********/
.section-title{float: left; width: 100%; margin-bottom: 30px; text-align: center;}
.section-title h1{font-family: 'Oswald', sans-serif; font-size: 2.4em; font-weight: 300; margin-bottom: 10px;}
.section-title .tagline{font-size: 1.4em; font-weight: 300; padding-bottom: 30px;}
.section-title-nomargin, .articletitle-nomargin{margin: 0 !important;}
.aside-tagline{font-size: 1.1em; font-weight: 300; padding-bottom: 10px; width: 70%; margin: 0 15%;}


/********** ARTICLE TITLE **********/
.article-title{width: 100%;}
.article-title h1{font-family: 'Oswald', sans-serif; font-size: 3em; font-weight: 500; text-transform: uppercase;}
.article-title .tagline{font-size: 1.1em;}


/********** BOX TITLE **********/
.box-title{width: 100%; padding: 40px 0 30px 0;}
.box-title h1{font-family: 'Oswald', sans-serif; font-size: 2.1em; font-weight: 300; padding-bottom: 10px;}
.box-title .tagline{font-size: 1.2em; font-weight: 300;}


/********** FORM STYLES **********/
.form-legend h1{font-size: 1.1em !important; font-weight: bold !important; color: #444;}

input,
textarea, 
select {
    width: 100%;
    padding: .7em;
    font-size: 1em;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

input[type="date"]{
    display:block;
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    min-height: 1.2em;
    padding: .7em;
    font-size: 1em;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
}


input[type="submit"],
input[type="reset"],
button{width: auto;}

.form-check .form-field{margin-bottom: 15px;}
.form-check label{display: inline-block; margin-right: 30px; padding: 8px 15px 10px 15px; background-color: #fbfbfb; cursor: pointer;}
.form-check label:hover{background-color: #ddd;}
.form-check input{float: left; width: auto; margin: 4px 10px 0 0; cursor: pointer;}

input::-webkit-input-placeholder {color: #333 !important;}
textarea::-webkit-input-placeholder {color: #333 !important;}
input:-moz-placeholder {color: #333 !important; /* Firefox 18- */ }
input::-moz-placeholder {color: #333 !important; /* Firefox 19+ */}
input:-ms-input-placeholder {color: #333 !important;}

:focus{outline: 0;}


/********** MARGIN MODE **********/
.m_top{margin-top: 20px;}
.m_bottom{margin-bottom: 20px;}
.m_left{margin-left: 20px;}
.m_right{margin-right: 20px;}


/********** FLOATS **********/
.left{float: left !important;}
.right{float: right !important;;}
.none{float: none !important;;}


/********** DISPLAY **********/
.block{display: block;}
.inblock{display: inline-block;}
.inline{display: inline;}
.none{display: none;}


/*
FLEXBOX
*/

.messages {
    width: 100%;
    padding: 20px;
}

.flex {
    display: flex;
    flex-wrap: wrap;
}

.flex .flex-1 {
    flex-basis: 100%;
}

.flex .flex-2 {
    flex-basis: calc(50% - 40px);
    margin: 20px;
}

.flex .flex-3 {
    flex-basis: calc(33.33% - 30px);
    margin: 15px;
}

.flex .flex-4 {
    flex-basis: calc(25% - 20px);
    margin: 10px;
}

/********** BOXES **********/
.box{width: auto; float: left;}
.box-line{float: left; width: 100%;}

.flexbox{width: 100%; display: flex; flex-wrap: nowrap; align-items: center;}

/*BOX 8 COL*/
.box-min{width: 11%; margin-right: 1.5%;}
.box-min p{font-size: 0.9em; font-weight: bold !important; color: #333; line-height: 120% !important; text-align: center; text-transform: uppercase;}
.box-min span{font-size: 0.8em; font-weight: bold; color: #333;}

/*BOX 6 COL*/
.box-mini{width: 15%; margin: 0 2% 2% 0;}

/*BOX 4 COL*/
.box-small{width: 22.75%; margin-right: 3%;}
.box-small-no-mbottom{width: 22.75%; margin-right: 3%;}

/*BOX 3 COL*/
.box-medium{width: 30%; margin-right: 5%; margin-bottom: 30px;}
.box-medium-no-mbottom{width: 30%; margin-right: 5%;}

/*BOX 2 COL*/
.box-large{width: 46.5%; margin-right: 7%;}
.box-large-w-pad{width: 46.5%; margin-right: 7%; padding: 25px;}
.box-large-no-mbottom{width: 48%; margin-right: 3.5%;}



/*BOX 100% COL*/
.box-full{width: 100%; margin: 0;}
.box-full-w-pad{width: 100%; margin: 0 0 30px 0; padding-bottom: 30px;}
.box-full-no-space{width: 100%; margin: 0;}
.box-full-w-mbottom{width: 100%; margin-bottom: 20px;}

/*BOX 80% COL*/
.box-3to4{width: 65%; margin-right: 5%;}
.box-middle-no-pad{width: 80%; margin: 0 10% 3% 10%;}

/*BOX 20% COL*/
.box-1to4{width: 35%; margin-right: 5%;}
.box-middle-no-pad{width: 80%; margin: 0 10% 3% 10%;}

/*BOX 3/4 COL*/
.box-1152{width: 65%; margin-right: 5%; padding-left: 15px;}
.box-1152-no-pad{width: 65%; margin-right: 5%;}
.box-forthree{width: 64%;}

/*BOX 3 COL*/
.box-forthreesmall{width: 30%; padding: 20px;}
.box-forthreesmall h1{margin-bottom: 20px; border-bottom: 1px solid #a1afba;}
.box-forthreesmall img{border: 1px solid #ddd;}


/********** TOOLTIP **********/
.wc_tooltip{display: inline-block; vertical-align: top; position: relative;}
.wc_tooltip:hover .wc_tooltip_balloon{display: inline;}
.wc_tooltip_balloon{display: none; position: absolute; left: 50%; margin-left: -100px; bottom: 100%; margin-bottom: 10px; font-weight: 500; width: 200px; padding: 15px; background: #000; opacity: 0.9; z-index: 70; color: #fff; font-size: 0.75rem; text-align: center; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; text-shadow: none !important; text-transform: none;}
.wc_tooltip_balloon::after {content: ''; position: absolute; top: 100%; left: 50%; margin-left: -8px; width: 0; height: 0; border-top: 8px solid #000000; border-right: 8px solid transparent; border-left: 8px solid ransparent;}


/********** SHAREBOX **********/
.sharebox{float: left; width: 100%; padding: 30px 0; text-align: center;}
.sharebox li{display: inline-block; background: #ccc; margin: 0 15px; background-position: left 10px center; background-repeat: no-repeat; background-size: auto 60%;}
.sharebox a{float: left; padding: 10px 20px 10px 40px; color: #fff;}
.sharebox .count{float: right; background: rgba(0,0,0,0.5); padding: 10px 15px; color: #fff;}
.sharebox .facebook{background-image: url(social/facebook.png); background-color: #45619D;}
.sharebox .facebook:hover{background-color: #778FC4;}


/********** VIDEO **********/
.video{width: 100%; margin: 0; padding: 10px; background-color: #fff;}
.video-small{width: 40%; margin: 0 30%;}
.video-medium{width: 70%; margin: 0 15%;}
.video-large{width: 80%; margin: 0 10%;}
.videoratio{position: relative; padding-bottom: 56.25%; float: left; width: 100.05% !important;  height: 0; background: #000;}
.videomedia{position: absolute; width: 100%; height: 100%; left: 0; top: 0;}


/********** IFRAMES **********/
.iframe{position: relative;}
.iframe .ratio {display: block; width: 100%; height: auto;}
.iframe iframe {position: absolute; top:0; left: 0; width: 100%; height: 100%;}


/*
BUTTONS STYLE
*/
.btn {
    display: inline-block;
    padding: .75em 1.25em;
    background: #888;
    border: none;
    cursor: pointer;
    font-size: 1em;
    font-weight: 400;
    color: #fff;
    /* text-shadow: 1px 1px rgba(0,0,0,0.3); */
}

.btn:hover {
    color: #fff;
    text-decoration: none;
    background: #666;
}

.btn-small {
    font-size: 0.875em;
}

.btn-big {
    font-size: 1.275em;
}

.btn-green {
    background: var(--green);
    color: #fff !important;
}

.btn-green:hover {
    background: var(--greenH);
}

.btn-green-theme {
    background: var(--themeColorA);
    color: #fff !important;
}

.btn-green-theme:hover {
    background: var(--themeColorA_h);
}

.btn-green-out {
    color: var(--green);
    border: 1px solid var(--green);
    background: transparent;
    text-shadow: none;
}

.btn-green-out:hover {
    color: #fff;
    border: 1px solid var(--greenH);
    background: var(--greenH);
    text-shadow: 1px 1px rgba(0,0,0,0.3);
}

.btn-blue {
    background: var(--blue);
}

.btn-blue:hover {
    background: var(--blueH);
}

.btn-blue-out {
    color: var(--blue);
    border: 1px solid var(--blue);
    background: transparent;
    text-shadow: none;
}

.btn-blue-out:hover {
    color: #fff;
    border: 1px solid var(--blueH);
    background: var(--blueH);
    text-shadow: 1px 1px rgba(0,0,0,0.3);
}

.btn-yellow {
    background: var(--yellow);
}

.btn-yellow:hover {
    background: var(--yellowH);
}

.btn-yellow-out {
    color: var(--yellow);
    border: 1px solid var(--yellow);
    background: transparent;
    text-shadow: none;
}

.btn-yellow-out:hover {
    color: #fff;
    border: 1px solid var(--yellowH);
    background: var(--yellowH);
    text-shadow: 1px 1px rgba(0,0,0,0.3);
}

.btn-red {
    background: var(--red);
}

.btn-red:hover {
    background: var(--redH);
}

.btn-red-out {
    color: var(--red);
    border: 1px solid var(--red);
    background: transparent;
    text-shadow: none;
}

.btn-red-out:hover {
    color: #fff;
    border: 1px solid var(--redH);
    background: var(--redH);
    text-shadow: 1px 1px rgba(0,0,0,0.3);
}

/*
TRIGGERS
*/
.trigger {
    color: #fff;
    font-size: 0.875em;
    background-color: #888;
    padding: 12px;
    border: 1px solid #666;
    margin-bottom: 12px;
}

.trigger-success {
    background-color: var(--green);
    border-color: var(--greenH);
}

.trigger-info {
    background-color: var(--blue);
    border-color: var(--blueH);
}

.trigger-alert {
    background-color: var(--yellow);
    border-color: var(--yellowH);
}

.trigger-error {
    background-color: var(--red);
    border-color: var(--redH);
}

.trigger-success-outline {
    background-color: transparent;
    border-color: var(--green);
    color: var(--green);
}

.trigger-info-outline {
    background-color: transparent;
    border-color: var(--blue);
    color: var(--blue);
}

.trigger-alert-outline {
    background-color: transparent;
    border-color: var(--yellow);
    color: var(--yellow);
}

.trigger-error-outline {
    background-color: transparent;
    border-color: var(--red);
    color: var(--red);
}