#press-release{background:#e7e7e7}
.press-row{display:block}
/*---------------- ABOUT US ------------------*/
#about-us-hero{
    background:url('../img/company/bg-hero-about-us-02f.jpg');
    height:750px
}
#about-us-hero section{margin-top:335px}
#about-us-hero section p{font-size:18px}

#history-section{margin-top:0;padding-bottom:70px}

#history-section h3{
    font:normal 30px Decagram Medium;
    margin-bottom:50px;
    color:#346c97
}

.history-box{float:left;width:100%;position:relative}

#history-section .left, #history-section .right{
    width:50%;
    position:relative;
    padding-bottom:20px
}

#history-section .left:after, #history-section .right:before{
    position:absolute;
    content:'';
    width:1px;
    height:100%;
    top:5px;
    background:#346c97;
    z-index:5
}

#history-section .right:before{left:-1px}
#history-section .left:after{right:0}

.history-box ul{position:relative;width:85%}
#history-section .left ul{padding-right:3%}
#history-section .right ul{padding-left:3%}

.history-box .left ul:after, .history-box .right ul:before{
    content: "";
    background-color: #fff;
    border-radius:50%;
    display:block;
    height:5px;
    width:5px;
    top:7.5px;
    position: absolute;
    z-index:25;
}

.history-box .left ul:before, .history-box .right ul:after{
    content: "";
    background-color:#346c97;
    border-radius:50%;
    display:block;
    height:11px;
    width:11px;
    top:5px;
    position: absolute;
    z-index:24;
}

.history-box .right ul:before{left:-2.5px}
.history-box .right ul:after{left:-5.5px}
.history-box .left ul:before{right:-5px}
.history-box .left ul:after{right:-2px}

.history-box .left ul{float:right}

.history-box ul li{font:16px/1.3 Camber Medium;color:#101820}
.history-box ul li small{display:block;font:15px/1.3 Camber Light;color:#101820;padding-top:4px}

#history-section .history-year{
    position:absolute;
    top:-5px;
    color:#346c97;
    font:23px Camber Regular
}

.left .history-year{right:20px}
.right .history-year{left:20px}

.left .history-info{padding-right:70px;text-align:right}
.right .history-info{padding-left:70px}

.history-box:last-child .right:after{
 content: '';
 position:absolute;
 bottom:-25px;
 left:-15.5px;
 width:30px;
 height:30px;
 background:url('../img/common/2-arrows-down.svg');
 z-index:6
}

#map-puerto-rico-section{padding-bottom:120px}
#map-puerto-rico-section h2{margin-top:0}
#map-puerto-rico-section .diagrams-wrapper{width:70%;min-width:800px}

/*---------------- CONTACT CDI ---------------*/
#contact-form{
    margin-bottom:0;
    padding-top:150px;
    padding-bottom:100px;
    height: auto;
    border-bottom: 0;
    background:url('../img/company/bg-hero-contact-cdi-01a.jpg')
}

#contact-form .center-paragraph{text-align: center;width:85%}
#contact-form form{text-align:left}

#contact-form h1{
 text-align: center;
 font:48px Camber Regular;
 color:#fff;
 padding:20px 0 5px 0
}

#contact-form h2{
    margin:0 0 20px 0;
    padding-bottom:5px;
    color:#A4A4A4;
    font:20px/1.4 Camber Light It;
    letter-spacing:0;
}
#contact-form h3{display:none}
#contact-form h4{color:#fff;font:14px lft-etica}

#form-note{margin-bottom:5px;text-align:left}

#contact-form form p{margin-bottom:0;width: auto}

#contact-form p{margin-top:0}

#contact-form .global-btn{
    width:auto;
    padding:8px 18px 9px 19px;
    border:1px solid #fff;
    color:#fff;
    background:transparent
}

#contact-form #form-error {
    width: 100%;
    margin-left:0;
    color: red
}

#contact-distributors{margin-bottom:120px}
#contact-distributors h4, #contact-distributors address{text-align:left}
#contact-distributors.col3-wrapper{margin-bottom:30px}
#contact-distributors h4{font:22px Decagram Semibold;color:#101820;margin:35px 0 15px}
#contact-distributors ul{margin-bottom:25px}
#contact-distributors ul img{width:47%;border:solid 1px #ccc;border-radius:5px;margin:10px 0 20px}
#contact-distributors li{margin-bottom:4px;font-size:15px}
#contact-distributors ul:last-child, #contact-distributors li:last-child{margin-bottom:0}
#contact-distributors li:first-child{margin-bottom:10px}
#contact-distributors li em{font:16px Decagram Semibold;color:#1f3549;font-style:normal}


/*---------------------- LEADERSHIP -----------------------*/

#leadership-hero{
  background:url('../img/company/bg-hero-leadership-04b.jpg')
}

#leadership-section{margin:80px 0 30px 0}

#leadership-section .center-paragraph{margin-bottom:70px}

#leadership-section .col4{margin-bottom:60px}

#leadership-section .col4-start{clear:left}

#leadership-section .center-icon{
    width:75%;
    border-radius:13px;
    border:solid 3px #fff;
    overflow:hidden;
box-shadow: 5px 5px 2px -3px rgba(184,184,184,0.75) inset;
-webkit-box-shadow: 5px 5px 2px -3px rgba(184,184,184,0.75) inset;
-moz-box-shadow: 5px 5px 2px -3px rgba(184,184,184,0.75) inset;
}

#leadership-section h2{margin:35px 0}

#leadership-section h4, .board-section h4{
	font:18px Decagram Semibold;
	color:#181818;
    margin-bottom:5px;
    padding:0
}

#leadership-section h5, .board-section h5{
	padding-top:2px;
    font:14px Camber Regular;
	color:#54565b
}

#leadership-section .thmb-with-shadow{margin-bottom:20px}

#leadership-section img{
    border:0;
    position:relative;
    z-index:-2
}

#leadership-section .hover-thmb:before {
    top:0;
    width:75%;
    height:100%;
    margin:auto;
    border-radius:13px
}

#leadership-section .download-hover{
    width:100%;
    top:42%
}

/*--------- BOARD OF DIRECTORS ----------*/

.board-section .page-inner{max-width:1150px}

.board-section h2{margin:0 0 40px 0}

.board-section .col5{
    text-align:center;
    position:relative;
    height:110px;
    margin-bottom:50px
}

.board-section .col5 a{
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    color:#346c97
}

.board-section .col5 img, .board-section .col5 svg{margin-bottom:0}
.board-section .small-right-arrow{vertical-align:middle;fill:#346c97}

/*------POPUP--------*/

 .leadership-box{
  position:fixed;
  left:50%;
  top:50%;
  margin:0;
  width:50%;
  min-width:320px;
  max-width:700px;
  height:auto;
  background:transparent;
  z-index:-1;
  transform:translate(-50%, -50%); /* for centering */
}
 .leadership-text{
  position:relative;
  width:86%;
  padding:7%;
  background:#fafafa;
  transition:all 0.2s ease-in-out;
  opacity:0;
  transform: scale(.8)
}

.leadership-box h4{margin:0 0 20px 0;font:24px Decagram Semibold;color:#101820}
.leadership-box em{display:block;font:16px Camber Light}
.leadership-box p{font:400 15px/1.7 lft-etica;margin-bottom:20px}
.leadership-box .bold{font-family:Decagram Semibold}

 .close-box{
  position:absolute;
  top:0;
  right:0;
  padding:5px 10px;
  color:#fff;
  background:#346c97;
  text-align:center;
  font:500 18px lft-etica
}

.leadership-anim{
  opacity:1;
  transform: scale(1)
}

/*---------------- CAREERS -----------------------*/

/*---------------- PRIVACY ----------------------*/

#privacy-policy{
	margin-top:150px
}

#privacy-policy h2{
	margin-bottom:30px
}

#privacy-policy .text-paragraph{
	width:100%;
	text-align:left
}

#privacy-policy p{
    margin: 20px 0 5px 50px;
    font-size:15px;
    line-height: 1.4
}
#privacy-policy p a{
    font-family: Camber Medium;
    color:#346c97
}
#privacy-policy h4, .indent-policy{
	margin-left: 0px;
    Margin-top: 50px;
	font: 22px Decagram Semibold
}
#privacy-policy h5, .indent-policy{
	margin-left: 0px;
    Margin-top: 20px;
	font: 17px Camber Regular;
    color: #346c97
}
#privacy-policy ul {
    margin-top: 0;
    padding-left: 12px;
    list-style-image: url("../img/common/bullet-blue-square-01c.svg")
}
#privacy-policy ul li{
    font: 15px/1.4 lft-etica;
    color: #54565b;
    padding-left: 6px;
    margin-left: 50px;
    margin-top: 20px
}
#privacy-policy ul li a{
    font-family: Camber Medium;
    color:#346c97
}
#privacy-policy ul2 {
    list-style:decimal;
    margin-top:0;
    padding-left:12px;
}
#privacy-policy ul2 li{
    font: 15px/1.4 Camber Regular;
    color: #54565b;
    margin:10px 0 20px 50px
}
#privacy-policy ul2 li a{
    font-family: Camber Medium;
    color:#346c97
}

#privacy-policy ol {
    list-style:lower-alpha;
    margin-top: 0;
    padding-left: 30px;
}
#privacy-policy ol li{
    font:15px/1.4 Camber Regular;
    color: #54565b;
    padding-left: 6px;
    margin:10px 0 10px 50px
}
#privacy-policy ol li a{
    font-family: Camber Medium;
    color:#346c97
}
#privacy-policy em{
    font: 15px Camber Semibold
}

.policy-number{
	float:left;
	width:5%
}

.policy-list{
    float: left;
    width: 95%
}

#error-box{margin-left: 1.5%}

/*////////////////////////////////////////////
------------------- RESIZE -------------------
/////////////////////////////////////////////*/

@media all and (max-width: 1600px) {
    #about-us-hero{height:620px}
    #about-us-hero section{margin-top:100px}
    #leadership-hero section{margin-top:130px}
}

@media all and (max-width: 1410px) {
    #about-us-hero{height:590px}
    #about-us-hero section{margin-top:125px}
    #contact-form{padding-top:100px}
    #leadership-hero section{margin-top:160px}
}

@media all and (max-width: 1350px) {
    #press-date, #press-release .view-all{background:#e7e7e7}
}

@media all and (max-width: 1285px) {
    #about-us-hero section{margin-top:180px}
    #about-us-hero section p{font-size:17px}
    .leadership-box{
     top:55%;
     height:600px
  }
    #contact-form .center-paragraph{width:90%}
    #contact-form form p{font-size:13px}
    #contact-form #select-platform p{font-size:17px}
}

@media all and (max-width: 1230px) {
 .board-section .col5{height:110px}
}

@media all and (max-width: 1170px) {
  #contact-form .center-paragraph{width:100%}
}

@media all and (max-width: 1080px) {
    #about-us-hero section{margin-top:165px}
    .history-box ul{width:100%}
    #map-puerto-rico-section .diagrams-wrapper{width:100%;min-width:auto}
    #leadership-section .col4{
        width: 22%;
        padding:0 1.5%;
    }
    .policy-number{width:10%}
    #privacy-policy p{margin-left:71px}
}

@media all and (max-width: 900px) {
 #about-us-hero section{margin-top:160px}
}

@media all and (max-width: 845px) {
    #history-section .history-year{font-size:22px}
    .history-box ul li{font-size:15px}
    
    #leadership-hero{
        background:url('../img/mobile/img-m-cdi-hero-leadership-01d.jpg');  
    }
    .board-section .col5{height:130px}
    .board-section h4{font-size:16px}
    
    #contact-form h4{text-align: left}
    
}

@media all and (max-width: 815px) {
    #leadership-section .col4{
        width: 45%;
        padding:0 2.5%;
    }
}

@media all and (max-width: 736px) {
    #contact-form{
        background-image: url('../img/company/bg-hero-contact-cdi-01a.jpg');
        background-image: -webkit-image-set(url('../img/company/bg-hero-contact-cdi-01a.jpg') 1x);
        background-size:cover
    }
    .col3{
        width: 100%;
        float: left;
        padding: 0;
        height:auto;
        margin-bottom:8%
    }
}

@media all and (max-width: 670px) {
    #about-us-hero{
    background:url('../img/mobile/img-m-cdi-hero-about-us-01c.jpg')
    }
    #about-us-hero section p{font-size:16px}
    .board-section .col5{
       width: 100%;
        padding: 0;
        height: auto
    }
    .board-section h4{font-size:17px}
    .board-section h5{margin-bottom:15px}
    .board-section .col5 a{
        position:relative
    }

}

@media all and (max-width: 570px) {
    #history-section .history-year{
     position: relative;
     text-align:right
    }
    #history-section .right .history-year{left:0;text-align:left;padding-left:20px}
    .left .history-info{padding-right:20px}
    .right .history-info{padding:0 0 0 20px}
     #contact-form .line-break{display:inline}
    
    #privacy-policy h4, .indent-policy{
    margin-top:40px;
	font-size:19px
    }
    #privacy-policy p{
    margin-left:39px;
	font-size:14px 
    }
    .policy-number{width:12%}
}

@media all and (max-width: 436px) {
    #about-us-hero section{margin-top:135px}
    #leadership-section .col4{width:100%;padding:0}
    #leadership-section .center-icon{width:60%}
}