/* Fonts */

@font-face {
font-family: 'Lato';
src: url('../fonts/Lato-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal; 
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: bold; 
    }
    
@font-face {
font-family: 'Roboto';
src: url('../fonts/Roboto-Medium.ttf') format('truetype');
font-weight: 500;
font-style: normal; 
}

@font-face {
    font-family: 'Roboto Condensed';
    src: url('../fonts/RobotoCondensed-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: bold; 
    }

@font-face {
      font-family: 'Roboto Condensed';
      src: url('../fonts/RobotoCondensed-Regular.ttf') format('truetype');
      font-weight: 400;
      font-style: regular; 
      }



/* Custom Styles */

.credits { font-size:11px; font-weight:500; padding-top: 1.3rem;  }
.nav-user h5 { margin-bottom:0px; letter-spacing: -.5px; }
.nav-user a { letter-spacing: -.5px; }


/* 	Modal */

.modal-header { padding:1.4em;  padding-bottom:0; border-bottom: none;  }
.modal-body {padding:1.4em;  } 
.modal.show .modal-dialog { box-shadow: 3px 7px 15px -5px rgba(0,0,0,0.75); }
.modal-header h3 { 	 border-left: 3px solid #ff6900; padding-left:.7em; position: absolute; left: 0;}
.modal-body span {  color: #ff6500; position: relative; top: .4em; }
.modal-body span {  color: #ff6500; position: relative; top: .4em; }
.modal-header h3 { line-height: 1.3em; 	 border-left: 3px solid #ff6900; padding-left:1.5em; position: absolute; left: 0; margin-right:2em;  }

#terms iframe { min-height:550px; }
.terms { margin:0em 1em;  }
.terms ul { margin-right:2em; }
.terms li { margin-bottom:1.5em; font-size:.8em; }



/* ----------------------------------------------------------------  	Row Information */

.row-info { padding-left: 15px; padding-right: 15px;}
.row-info h4 {padding:.3em 0;}
.row-info h6 {line-height:.9em; margin-bottom:.2em;  }
.row-info p { line-height:1em; }
.row-info strong {color:#533c3f; display: block;}
.row-info a { font-size:13px;  }


/* ---------------------------------------------------------------- 	Alertbox */

.alert-box { background-color:#fff6ee;  padding: 1.5em; border-radius: 12px; box-shadow: 0px 2px 0px #e1e1e1; margin: 0;  }
.alert-box h4 { border-left:3px solid #ff6500; padding-left:1.1em;  }
.alert-box .fa-exclamation-circle.fa-lg { color:#ff6500 !important; font-size: 1.5em;   }
.alert-box strong {color: #ff6500; font-weight: 500; }

	.container-blocks .alert-box {padding: 1.2em;} 
	.container-blocks .alert-box h4 {padding-left:1em; position: relative; left:-1em;}

	.form-row .alert-box { background-color: antiquewhite; }
	.form-row .alert-box h4 {color:#ff6500; position: relative; left:-1.2em; }
	.form-row .alert-box p { margin-bottom: 0; }


/* ---------------------------------------------------------------- 	Forms */
.form-box { background-color:#f9f9f9; border-radius: 12px; box-shadow: 0px 2px 0px #e1e1e1;   }
.form-box strong { color:#ff6500;}
.form-box p { line-height: 1.2em; }
.form-box b { font-weight:500;  }
.form-box .col-12 {border-right: 1px solid #E5E5E5; }
.form-box .col-12:last-child {border-right:none; }
.user-box { display: inline; background-color: antiquewhite; border-radius:30px; padding:.7em 1.2em; margin-left: 1em; color:#ff6500; }
.userbox strong { font-size:18px; font-weight: 500; color: #ff6500; margin-left: .4em; }
@media (max-width: 768px) { 
	.form-box .col-12 {border-right: none; }
	.form-box .col-12:first-child {border-bottom: 1px solid #E5E5E5; }}


.container-ri label { padding-left:1em;  }
.container-ri {   line-height:1em;     cursor: pointer;    user-select: none; }
.form-check-input { margin: 0; }
.container-ri input {    position: absolute; top:2px;  left:2px; z-index:20;   opacity: 0;    cursor: pointer;}
.checkmark {
    position: absolute; 
    top: 0; z-index: 0;
    left: 0;
    height: 18px;
    width: 18px;
    background-color: white; border: 1px solid #ABABAB; 
    border-radius: 50%;
}
.container-ri:hover input ~ .checkmark {  background-color:white ; border: 1px solid #ff6500  ; }
.container-ri input:checked ~ .checkmark {    background-color: #ff6500; border: 5px solid #ff6500; }
.checkmark:after {	content: "";    position: absolute;    display: none;}
.container-ri input:checked ~ .checkmark:after {    display: block;}
.container-ri .checkmark:after {
 	top: 0px; border: 1px solid white;
	left: 0px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}


.container-chb {  line-height:1em;    margin-bottom: 0;    cursor: pointer;    user-select: none; }
.container-chb label { margin:0 1.2em; }
.container-chb input {    position: absolute; left:3px; top:2px;  z-index: 20;   opacity: 0;    cursor: pointer;  }
.checkmark-chb {
    position: absolute; z-index: 0;
    left: 0px;
    height: 20px;
    width: 20px;
    background-color: white; border: 1px solid #ABABAB; 
    border-radius: 10%;
}
.container-chb:hover input ~ .checkmark-chb {    background-color:white ; border: 1px solid #ff6500  ; }
.container-chb input:checked ~ .checkmark-chb {     background-color: #ff6500; border: 1px solid #ff6500; }
.checkmark-chb:after {    content: "";    position: absolute;    display: none;}
.container-chb input:checked ~ .checkmark:after { display: block;}
.container-chb .checkmark-chb:after {
	left: 6px;
    top: 1px; display: block;
    width: 7px;
    height: 13px;
    border: solid white;
    border-width: 0 3px 3px 0;
    transform: rotate(45deg);
}

/* ---------------------------------------------------------------- 	Gmap */

.container-map {	height: 0;	overflow: hidden;	padding-bottom: 60%;	position: relative;}
.googlemap {	border: 0;	height: 100%;	left: 0;	position: absolute;	top: 0;	width: 100%;}

/* ---------------------------------------------------------------- 	Accordion Side bar */
.card { margin-bottom:8px;  }
.card-header { padding:.2rem 1.25rem}
.card-header h5 { font-size:1.1em; }
.card-header h5 button { color: #ff6500;  line-height: 1.3em; }
.card-header h5 button:hover, .card-header h5 button:focus { color:#86090B; text-decoration: none; }

.card-header .btn:focus { box-shadow: none;}

.card-body strong { font-weight: 900; }
.card-header.active { background-color: #E4E4E4 ; }
.card-header.active h5 button { color: #545454; font-weight:500; }
.card-header h5 button.btn { white-space: normal; text-align: left;  }
.card-header h5 button span { display: inline-block; width: 95%; margin-top: .2em;}



/* ---------------------------------------------------------------- 	Box Shortcut */

.box-shortcut {  background-color:#efefef; border-radius:10px; text-align: center; line-height: 13px; box-shadow: 0px 2px 0px #e1e1e1; }
.box-shortcut a { font-size: 14px; font-weight: 100;  }
.box-shortcut span { display: block; padding-top:.5em; }
.box-shortcut .p-2 { padding:1.4em .7em !important;  } 
#contentCollapse p, #contentCollapse-url ul, #contentCollapse-urlplus ul, #contentCollapse-allies ul, #contentSocial ul  { padding-left:4.5em; }
@media (min-width: 768px) {
  .collapse.dont-collapse-lg {    display: block;    height: auto !important;    visibility: visible;  }
	#contentCollapse p, #contentCollapse-url ul, #contentCollapse-urlplus ul, #contentCollapse-allies ul, #contentSocial ul  { padding-left:1.3em; }
    

}
/* ---------------------------------------------------------------- 	Login Box */

.login-box { border-radius:7px; background-color:white; padding:.9em 1em;   }
.login-box .form-group { margin-bottom: .3em; }
.content-cover { background-color: #ff6500; box-shadow: inset 0px 6px 5px -3px  rgba(50, 50, 50, 0.15); }
.login-box h4 { color:#212529; font-size:1em;  }


/* ------------------------------------------------------- 	Home Information Blocks */

.container-blocks p { line-height:1.4em; } 
.container-blocks strong {color:#533c3f;}
.container-blocks strong.l-number {color:#6d3330;}
.container-blocks h4 { font-size:1em; color:#212529;  line-height:1em; margin:0 auto .7em;  }
.container-blocks h4 span .fa-sm { font-size:.8em!important; }
.container-blocks .main h4 { margin-bottom:.2em; }



.container-blocks .row .col-6 {
    padding-left: 0
}
p strong.l-number {
    text-align: center;
    font-size: 1.2em;
    font-weight: bold;
    display: block;
    border-radius: 20px;
    border: 1px solid #EAEAEA;
    margin: .7em auto;
    width: 100%;
    line-height: .8em;
    padding: .5em;
    line-height: 1.3em
}

@media (max-width:768px) {
    p strong.l-number {
        width: 70%
    }
    .container-blocks .row .col-6 {
        padding-left: 15px
    }
}



.container-fluid:nth-child(4) img {
 	margin:0 auto; 	
}

.container-blockone { padding: 0 2em;}
.container-blocks .blockone .container-blockone { padding: 0!important;}

/* ---------------------------------------------------------------- 	Article */
blockquote h3 { font-style: italic;}
.justify-content-between:nth-child(1) .d-inline-flex p { font-size:.9em;  }

.table-sm { font-size:.9em;}

.table { margin: 3em auto;  min-width:90%; width:90%;  border:none; border-radius:8px;   box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.20);   }

.table th { text-align: center; font-weight:normal; line-height:1.3em;  border-top:none;   }
.table thead th { vertical-align: middle; }

.table thead tr:first-child th:first-child {border-radius: 8px 0 0 0;}
.table thead tr:first-child th:last-child {border-radius: 0 8px 0 0;}


.table td { padding:.50rem 1.3rem; font-size: .9em; vertical-align: middle; }
.table th { padding:.65rem 0; }
.table .thead-light th { background-color: #d84800; color: white; font-weight: bold; vertical-align: middle; }
.table .thead-light th:first-child {  border-radius: 8px 0 0 0 ;}
.table .thead-light th:last-child {  border-radius: 0 8px 0 0; }


.table.table-single-header .thead-light th {border-radius: 8px 8px 0 0!important; padding:.5rem  1rem;}
.table.table-single-header td {background-color: white;}
.table tbody tr:last-child td:first-child  {  border-radius: 0 0 0 8px;}
.table tbody tr:last-child td:last-child {  border-radius: 0 0 8px 0;}
.table td.active { background-color:#E9E9E9; }
.table td.active a { color: #7E7E7E }
.table caption { padding:.7em 1.5em; }
.table.tableinfo { border-radius:0px;   box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.10); width: 100%;    }
.table.tableinfo td, .table.tableinfo th { border: 1px solid #DFDFDF; line-height:1.1em;  }
.table.tableinfo th { font-size:.9em; color: #545454;}
.table.tableinfo caption { font-size:.8em; }
.table.tableinfo  tbody tr:last-child td:first-child {  border-radius:0;}
.table.tableinfo  tbody tr:last-child td:last-child {  border-radius:0;}
.table th[scope=row] { font-weight: 500; text-align: left; padding-left:1em;    }
table.table-hover tr:hover td {  background: #F3F3F3;}
table.table-hover tr:hover td.active {  background: #e9e9e9;}



.table.tabledot td { border-style:dotted!important; border-width:1px; border-left: 0; border-right: 0; border-color:#D7D7D7; padding:.6rem 1.4rem; line-height: 1.2em;   }
.table.tabledot tbody tr:first-child td.active:first-child, .table.table-hover.tabledot tbody tr:first-child:hover td:first-child  {  border-radius: 8px 8px 0 0;} 
.table.tabledot tbody tr:last-child td.active:last-child, .table.tabledot tbody tr:last-child:hover td:last-child {  border-radius: 0 0 8px 8px;} 

.table.tabledot td i, .table.tabledot td span {float:left;}
.table.tabledot td span { width: 140px;}
.table.tabledot a { display: block;}

.table.tabledot.manual td span { width: 90%; }

@media (max-width:1200px) {
.table.tabledot td span { width: 100px;}

}

@media (max-width:990px) {
.table.tabledot td span { width: 130px;}

}

@media (max-width:767px) {
.table.tabledot td span { width: 90%;}
.table.tabledot.manual td span { width: 70%; }
}




.tableheader { border-radius: 8px 8px 0 0; background: #CE4428; padding:.9em 1.2em;  box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.15);    }
.tableheader strong { display: block;  color: white; font-size: 1.6em; margin: 0; line-height: 1.2em;     }
.tableheader strong em { font-weight: 600; font-style: normal; opacity: .7; margin-right:.3em;   }
.tableheader span { color:white; line-height: 1em; font-size:.8em !important;  }
.tableheader a.print { position: absolute; top:1.2em; right: 2.3em; }
.tableheader .fa-lg { font-size: 1.5em; color: white;  }
.tableheader a.print {color:white}
.tableheader a.print:hover { opacity:.7; }
.tableheader.idnum { background-color:#d0d1cc;   }
.tableheader.idnum strong, .tableheader.idnum span {color:#545454; }

.table-footer {
border-radius:10px; margin: 1.5em auto 3em auto;  box-sizing: border-box; width:90%; padding: 1em; background-color: #f9f9f9; display: block; }



.table-responsive { margin-bottom: 2em;}

#infodocs table td { font-size:.95em;  line-height:1.4em; padding:1.3em; vertical-align: middle; }


@media (max-width: 480px) { 
	.table th, .table td  { font-size:.9em;  }
}



.container-fluid.bg-secondary { margin-bottom: 0; }
.container-fluid.bg-secondary .container { text-align: center;}
.container-fluid.bg-secondary .container img { width: 600px; }

.sitemap li {margin-bottom:1em; }
.sitemap li ul { margin: 1em auto; }
.blocknote { color: darkslategray; padding: 2em 5em; font-style: italic; }


ul.check-list li:before {
  content: '✓'; color:#ff6600; font-weight: 400; font-size: 1.3em; position: absolute; left:35px;
  content: '✓'; color:#ff6600; font-weight: 400; font-size: 1.3em; position: absolute; left:35px;
}

ul.check-list li { margin-bottom: 1em; }

ul.check-list { list-style-type: none; margin-bottom: 2em;}

ul.list-info li, ol.list-info li  { margin-bottom: 1.2em;   }


/* ---------------------------------------------------------------- 	Stepper */
		.stepper-step {  margin: 0px auto; padding: 1.7em 1em; height:180px;   }
		.stepper-step › .stepper-step-step { padding: 0; position: relative; width:33%;  display: flex; justify-content: center; }
		.stepper-step.four-steps › .stepper-step-step {width:25%;}  
		.stepper-step › .stepper-step-step .stepper-step-info { position: absolute; top:85px;  width: 100%; 
			display: block; font-size: .9em; font-family: lato; font-weight: 500;   line-height: 1.2em; }
		.stepper-step › .stepper-step-step › .stepper-step-icon {
				position: absolute;
				width: 60px; 
				height: 60px;
				display: block;
				background: #e6e6e6;
				top: 45px; margin: 0 auto;
				margin-top: -35px;
				border-radius: 50%;
			}
		.active › .stepper-step-icon › span { color:#ff6500; font-size:1.8em; display: block;  height: 60px; text-align: center; line-height:1.9em;    }
		.active › .stepper-step-icon { border: 2px solid #ff6500; background: white!important; }
		.disabled › .stepper-step-icon › span { color:#707070; font-size:1.8em; display: block;  height: 60px; text-align: center; line-height:1.9em;    }
		.disabled › .stepper-step-icon { border: 2px solid #e6e6e6; background: #e6e6e6!important; }
		.stepper-step-icon › span { color:#707070;}
		.stepper-step › .stepper-step-step › .progress {
				position: absolute;
				border-radius: 0;
				height: 5px; left: 0;
				margin-top: 37px; }
		.stepper-step › .stepper-step-step › .progress › .progress-bar {    box-shadow: none;       background: #ff6500;   }
		.stepper-step › .stepper-step-step.complete › .progress › .progress-bar {        width: 100%;    }
		.stepper-step › .stepper-step-step.active › .progress › .progress-bar {       width: 100%;    }
		.stepper-step › .stepper-step-step:first-child.active › .progress › .progress-bar {    width: 0%;  }
		.stepper-step › .stepper-step-step:last-child.active › .progress › .progress-bar {  width: 100%;  }
		
		.stepper-step › .stepper-step-step.disabled › .stepper-step-icon {    background-color: #f5f5f5;   }
		.stepper-step › .stepper-step-step.disabled › .stepper-step-icon:after {  opacity: 0;  }
		
		.stepper-step › .stepper-step-step › .progress { background-color:#CECECE; width: 100%; left: 0; }
		.stepper-step › .stepper-step-step:first-child › .progress {  left: 50%;  width: 50%; background-color: #ff6500 !important;  }
		.stepper-step › .stepper-step-step:last-child › .progress {  width: 50%; }
		.stepper-step › .stepper-step-step.disabled a.stepper-step-icon { pointer-events: none;  }
		.complete › .stepper-step-icon { background-color: #ff6500 !important; color: white !important; text-align: center; line-height:2.6em;  font-size: 1.5em; }

@media (max-width: 750px) { 
.stepper-step › .stepper-step-step .stepper-step-info { display: none;}
.stepper-step {  margin: 0px auto; padding: 1.7em 0em; height:130px;   }
	.stepper-step › .stepper-step-step › .stepper-step-icon { width: 50px; height: 50px;  }
	.active › .stepper-step-icon › span { font-size:1.5em; height: 50px; font-weight:500;     }
	.disabled › .stepper-step-icon › span { font-size:1.5em; height: 50px; font-weight:100;   }
	.complete › .stepper-step-icon { line-height:2.3em;  font-size: 1.5em; }
	
		.stepper-step › .stepper-step-step › .progress {
				margin-top: 33px; }
}

/* ---------------------------------------------------------------- 	Google Search*/

.popover { max-width:400px; padding:.8em; box-shadow: 4px 7px 19px -8px rgba(0,0,0,0.60);   }
.cse .gsc-search-button-v2, .gsc-search-button-v2 { border-color:#ff6500!important; background-color: #ff6500!important; background-image: -webkit-linear-gradient(top,#ff6500,#ff6500) !important; border-radius:50px!important; }
input.gsc-input { padding:.8em !important; }
.gsc-input-box { border-radius:5px;  }



.block-2 p  { line-height:1.1em; letter-spacing: -.03em;  }
.block-2 strong { margin:.5em auto;  }
.points-dates [class*='col-'] { border-right:1px solid #eaeaea;}

/* ---------------------------------------------------------------- 	Custom inline*/
.fs-09 { font-size:.9em;}
.lh-09 { line-height: .9em; }
.lh-12 { line-height: 1.5em;}
.color-primary { color:#ff6500; }
.color-secondary { color:#533c3f; }
.color-light { color:#8B8B8B; }
.no-bullets { list-style-type: none; padding-left: 0; }
.rule li { padding:.6em; border-bottom: 1px solid #FFD4C3; }
.img-info {box-shadow: 0 2px 7px #ddd!important; margin:4em auto; display: block; border-radius:10px;  }
.circle {
    border: 0.1em solid #ff6500;
    border-radius: 100%;
    height: 2em;
    width: 2em;
    text-align: center; display: block; float: left; margin-right: 1em; margin-bottom: 3em;
}

.circle i {
	display: block;
	margin-top: .28em; font-style: normal;
    font-size: 1.3em;
    font-weight: 100;
    font-family: sans-serif;
   
}


.information h2 {font-size:1.2em; margin:1em auto; }
.information [class^="col-"] {
    
 padding:0 1.7em;  }

.information h3 {font-size:1.2em; margin:1em auto; line-height:1.2em; }
.information h3.h-2lines { height: 45px;}
.information h3.h-3lines { height: 60px;}
.information h3.h-4lines { height: 80px;}
.information h3.h-5lines { height: 100px;}
.information p a {font-weight:bold;}

.note {font-size:.8em;}

.morenews div { padding: .7em 1.2em; border-top:1px solid #ddd; width: 100%; }
.morenews a {font-weight:bold;}

@media screen and (max-width: 480px)  {

	.morenews h3 { line-height:1.2em!important;    }
	
}



/* ----------------------------------------------------- 	Styling  Bootstrap */
body { font-size:.9em; font-family: 'Lato'; }
a {color:#ff6500; }
a:hover {color:#c64c09; text-decoration: none; }
a.visited { color: gray; } 
strong { font-family: 'Lato'; font-weight: 700!important; }



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

footer › .container .row {padding-top: 4em;}
footer {color:#8d8d8d; font-size:14px; }
footer p { line-height:1.4em;}
footer /Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/code/electron-sandbox/workbench/workbench.htmlh5 { font-weight:500; font-size: 1.2em; color:#F9F9F9; font-style: normal; }
footer strong { font-weight:500; }
footer h5 { color:#ffffff; font-style:normal; }
footer ul {list-style-type: none; padding-left: 0;}
footer a { color:white; }
footer a:hover { color:#ff6600; text-decoration: none; }
footer i {margin-right: .5em;}
footer > div:nth-child(2) { display: flex; justify-content: center;}
#contentSocial .icon-facebook-squared, #contentSocial .icon-twitter-squared, #contentSocial .icon-youtube-play { font-size: 1.8em!important;  }
#contentSocial ul { padding-top:1em; }


footer div.container:nth-child(2) > div:nth-child(2)  { display: flex; justify-content: center;}


footer .container:nth-child(2) { flex-direction: column;}


@media (max-width: 990px)  {
    
    footer h5 i { display: inline-block; width: 25px; height: 25px; /*float: left;*/}


        #contentSocial ul { padding-left: 0; padding-top: 1em; }
	#contentSocial .icon-facebook-squared, #contentSocial .icon-twitter-squared, #contentSocial .icon-youtube-play { margin-right:0;  }
}

@media (max-width: 576px)  {
    #contentSocial ul { padding-left: 3.7em; padding-top: 0;}
    
}


h1,h2,h3,h4,h5,h6 { font-family:'Roboto'; text-align: left!important;  }


h1 { font-size: 2em; color: #ff6500;  }
h2 { font-size: 1.3em; color:#ff6500; }
h6 { font-size:1.2em;  }
h3 { font-size: 1.2em; color: #533c3f; line-height:1.4em;  } .lh-h3-sm { line-height:1.3;  }
h4 { font-size:1.2em; line-height:1.2em; color: #707070;   }
h5 { font-size:1.2em; font-style: italic; color: #ff6500; }
h6 { font-size: 1em; color:#533c3f;  }
p { line-height: 1.6em; margin-bottom: 1.6rem; }

label { font-size: 13px; font-family:'Roboto';   }

blockquote { padding:.5em 2em; }
.custom-select.is-valid, .form-control.is-valid, .was-validated .custom-select:valid, .was-validated .form-control:valid { border-color:#64BFFF; }.form-check-input.is-valid~.form-check-label, .was-validated .form-check-input:valid~.form-check-label { color:currentColor; }
.breadcrumb { background-color: transparent; padding-left: 0; }
.breadcrumb-item+.breadcrumb-item::before { color:lightgray; }
.custom-select.is-valid:focus,.form-control.is-valid:focus,.was-validated .custom-select:valid:focus,.was-validated .form-control:valid:focus{border-color:#64BFFF;box-shadow:0 0 0 .2rem rgba(11,149,255,.25)}
.border-right { border-color:#EAEAEA!important;  }
@media screen and (max-width: 768px)  {
h1 { font-size: 1.4em; }
	
}

@media screen and (max-width: 480px)  {
	h3 { font-size: 1em !important; line-height:.7em;   }
	blockquote {padding:0 1em}
	h2 { font-size: 1em !important;    }
	
}

.line-height-sm { line-height:1.2em; }

.navbar {  background-color: white; }


.container-fluid { margin:0; padding:0;  }
header .navbar {padding:0; font-family: 'Roboto'; width:80%; display: inline-flex; margin-bottom: 0; padding-bottom: 0; } /* rev */

header nav.generic { width: 100%!important; }

@media (max-width:1200px) {
header .navbar {padding:0; font-family: 'Roboto'; width:100%; display: inline-flex;} /* rev */

}

@media (max-width:991px) {
header .navbar { height:50px!important; } /* rev */

}



.navbar-light .navbar-nav .nav-link, 
.navbar-light .navbar-nav .btn, 
.navbar-light .navbar-nav .dropdown-item 
    {color:#533c3f; font-family: 'Roboto'; font-weight: 500; }


.navbar-light .navbar-nav .nav-link:hover {color:#ff6500;}
.navbar-nav li a {  text-transform: uppercase; font-size:.9em;  }
.nav-link { margin: 0 .3rem; padding:.5rem .7rem!important; display: inline-block;  }

.navbar-nav li:last-child .nav-link { margin-right: 0;}

@media (max-width:1200px) {
    .nav-link { margin: 0 .3rem; padding:.5rem .5rem!important;  }
    
    }

    @media (max-width:940px) {
        .nav-link { margin: .3rem;   }
        
        }
        
    



/* #navapp .nav-link.active {
 background-color: #FAEBD7;
 box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.1); 
  animation: light .8s infinite alternate;
    
}

@keyframes light { 
  from { background-color: #ffd8b8; box-shadow: 2px 2px 0 rgba(193, 73, 25, 0.3);   } 
  to {background-color: #f8f8f8; box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.1);   }
    
    
}

 */




.dropdown-menu a { text-transform: none !important; }
.dropdown-item {border-left: 2px solid white;}

.navbar h5 { font-style: normal; color: #707070; }


a:hover.dropdown-item  {background:#f4f4f4; border-left: 2px solid #ff6500; }
.btn { border-radius:1.7em; font-size:1em;  }
.btn-primary {background-color: #ff6500; border-color: #ff6500; color: white!important; font-weight:normal; }
a:hover.btn-primary, button:hover.btn-primary {background-color:#c64c09; border-color:#c64c09;  }
.btn-outline-primary { color: #ff6500 !important; border-color: #ff6500; background-color: white;}
a:hover.btn-outline-primary, button:hover.btn-outline-primary { color: white !important; background-color: #ff6500 !important; border-color: #ff6500; }

.bg-dark {background-color:#333333!important;}
.bg-secondary {background-color:#ff6500!important;}
.bg-light { background-color:#f9f9f9; }



.btn-primary.disabled, .btn-primary:disabled { background-color:#E2E2E2 ; border-color:#E2E2E2 ; color:#4D4D4D!important; }
.btn-secondary { background-color: #c64c0a; border-color:#c64c0a ; }
.btn-secondary:hover { background-color: #ff6500; border-color:white ; color:white!important;  }

.btn-info { color:#ff6500; background-color: white; border-color:#DDDDDD; padding:.5em 1.5em;  }
.btn-info:hover, .btn-info:active  { color:#ff6500!important; background-color: white!important; border-color:#ff6500!important;  }


.simpleBanner .bannerListWpr ul li { width:110px !important;  }
.simpleBanner  { margin:0 auto;  }

.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show›.btn-primary.dropdown-toggle:focus { box-shadow: 0 0 0 0.2rem rgba(255,102,0,.5); }

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show›.btn-primary.dropdown-toggle 
{ background-color :#ff6600; border-color:#ff6600; }


.btn-primary.focus, .btn-primary:focus { box-shadow:0 0 0 0.2rem rgba(255,102,0,.5); }
.btn.focus, .btn:focus { box-shadow:0 0 0 0.2rem rgba(255,102,0,.5); }

.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show›.btn-primary.dropdown-toggle:focus { box-shadow:0 0 0 0.2rem rgba(255,102,0,.5);} 



/* ---------------------------------------------------------------- 	Carousel*/


.carousel-item { height: 380px }
@media (max-width: 480px) and (max-width: 640px) {
	.carousel-item { height: 530px!important; }
	.carousel-item h1 { font-size:1.4em; line-height: 1.1em; text-align: left!important; margin-bottom:1em; margin-top:.7em;  } /* Temp */
	.carousel-item h2 { font-size:1.4em; line-height: 1.1em; text-align: left!important; margin-bottom:1em; margin-top:.7em;  }
	
}
	

.container-carousel { align-self: flex-end; }
.carousel-indicators { background-color: transparent; border-radius:20px; padding:.6em; right: auto; left:auto; margin:2% 7%; }
.carousel-indicators li {  margin:.3em;   border-radius: 20px;  width: 12px; background: none;   height: 12px; border:2px solid white;}
.carousel-control-next, .carousel-control-prev { width:5%;  }
.carousel-control-prev { left: 15px;}
.carousel-control-next { right: 15px;}
.carousel-caption { position: absolute; right:5%; left: 7%; top:5%; width:400px; }

.carousel-caption p a {color:white; }
.carousel-caption p a:hover {color:white;}
.carousel-caption p {  width: 220px; }
.container-image { height: 360px; }
.carousel-item img.img-fluid {  margin-top: 130px;  }

@media (min-width:780px) {
    .carousel-caption h1 {
        font-size: 1.4;
        line-height: .92em;
    } /* Temp */
    .carousel-caption h2 {
      font-size: 1.4;
      line-height: .92em;
  }
}

@media (min-width:1200px) {
    .carousel-caption {
        width: 250px;
        top: 10%
    }
    .carousel {
        margin-top: 0
    }
    .carousel-item img.img-fluid {
        height: 380px;
        height: auto;
        position: relative;
        bottom: 0;
        margin-top: 45px
    }
    .carousel-caption h1 {
        font-size: 1.9em;
        line-height: 1.05em;
        height: 200px;
        letter-spacing: -1px;
    }
}

/* .carousel-item h1, .carousel-item p { color:white; }  Temp */
.carousel-item p { line-height:1.3em;  }

/* .cover h1 { font-size:1.4em; }
.cover a {color:white;}
.cover a:hover { color:antiquewhite;} */




/* ------------------------------------------------------------ PORTAL SELECTION */
.portal-nav {display: flex; flex-direction: column; justify-content:flex-end; margin-left: 2rem;}
.portal-nav h6 { margin-bottom: 0;}
.portal-nav a { font-size:.8rem;}


@media (max-width:990px) {
    .portal-nav {display: none; } 
    
}

@media (max-width:1200px) {
    .portal-nav {margin-left:.8rem;}

    .portal-line { border:none;  }
    .portal-line p { padding: 0 1.3em; margin:.3em 0 .5em; }
    .portal-line p:nth-child(2) {  border-left:1px solid lightgray;  }
    .navbar {width:100%; }

}
.portal-block p {margin-bottom: 0;}
.portal-block  {padding: 0 1.3em;}

@media (min-width:1200px) {
    .portal-line { margin-top: 18px; border-left:1px solid lightgray;  display: block; padding-left: 1.5em;  }
    .portal-line p.active { font-weight: 600; color: #5f5f5f; font-size:1.15em; line-height:.3em;  padding: 0; margin-bottom: .3em; margin-top: .5em; }
    .portal-line p:nth-child(2) { margin-bottom: 0;}
    
}
#portal { width: 20%; }
.portalbox { height: 80px;  padding:0; width: 100%; margin-left: .5em; margin-top: .2em; }
.portalbox a span {border-left: 1px solid #ccc; padding:.4em 0 .4em 1.2em; font-size:1.2em; font-weight: 100;  }

#portal .dropdown-menu { border-radius:.35rem;  border:none;  font-size:.95em;  margin:.095rem 0 0 1rem; padding:0; }


#portal  .dropdown-item {  color: #545454; padding: .6rem 1rem;  border: 1px solid rgba(0,0,0,.15); background:white; transition: all .3s;border-radius:.35rem; }
#portal  a:hover.dropdown-item { color: #ff6600; }

#portal  a:hover.dropdown-item, #portal  a:focus.dropdown-item { color:#ff6600;border: 1px solid rgba(255,102,0,.4);  }


@media (max-width:1200px) { 
    .portalbox { height:auto; margin-left: .3em; margin-top: 0; margin-bottom: .5em;}
    .portalbox a span {border-left:none; padding:0 0 .4em 1.5em;  }
    #portal .dropdown.d-flex { padding-top: 0;}
    header nav a img { padding: .2em 1.031em 0!important; }
    header .navbar { height: 65px;}

}

@media (max-width:991px){
    #portal { width: 100%; }
    
    
}


/* ---------------------------------------------------------------- LOGIN*/
.container-login {align-self: center;}
.login-box { border-radius:8px; background-color:white; padding:.9em 1em; align-self: center;   }
.login-box .form-group { margin-bottom: .3em; }

.outline { background: #f9f9f9; 
box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.1); -webkit-box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.1); -moz-box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.1); 

}

label { font-weight:500; font-size: 13px; margin: 0 0 .3em;  }
.tooltip-inner { background-color:#fce7d2; opacity:7 !important; color: #543c40; font-size:1em; line-height:1.2em;  max-width:250px;  text-align: left; padding:1.3em;     }
.bs-tooltip-top .arrow::before, .bs-tooltip-auto[x-placement^="top"] .arrow::before {
  border-top-color: #fce7d2 !important;
}
.bs-tooltip-right .arrow::before, .bs-tooltip-auto[x-placement^="right"] .arrow::before {
  border-right-color: #fce7d2 !important;
}
.bs-tooltip-bottom .arrow::before, .bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
  border-bottom-color: #fce7d2 !important;
}
.bs-tooltip-left .arrow::before, .bs-tooltip-auto[x-placement^="left"] .arrow::before {
  border-left-color: #fce7d2 !important;
}
.form-control { padding: .3rem .75rem !important;  }


/* ---------------------------------------------------------------- 	FAQ */

.tab-content { border-left:1px solid #ddd; padding-left: 1.4em; padding-bottom:4em; min-height:400px;     }
.nav-pills .nav-link { border-radius: .50rem 0rem 0rem .50rem; margin-bottom:10px;   }
.nav-pills .nav-link.active, .nav-pills .show›.nav-link { color:#ff6500; border:1px solid #ff6500; background: white; border-right-width:3px;   }
.nav-link { font-weight: 500; line-height:1.2em;   }

/* FAQ Question */

.faq-content {  margin: 0 auto;}
.faq-question {  padding:.2em 0;  border-bottom: 1px dotted #ccc; margin-bottom: .2em;}
.panel-title {
  font-size: 1em; color:#ff6500; 
  width: 100%;
  position: relative;
  margin: 0;
  padding: 10px 10px 10px 35px;
  display: block;
  cursor: pointer;
}

.panel-content {
  margin: 0 40px;
  height: 0;
  overflow: hidden;
  position: relative;
  opacity: 0;
  -webkit-transition: .4s ease;
  -moz-transition: .4s ease;
  -o-transition: .4s ease;
  transition: .4s ease;
}


.panel:checked ~ .panel-content{
  height: auto;
  opacity: 1;
	padding-top: .5em;
}

.plus {
  position: absolute; color:#ff6500;  
  margin-left: 10px; 
  margin-top: 5px;
  z-index: 5;
  font-size: 28px;
  line-height: 1em;
  -webkit-user-select: none;    
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-transition: .2s ease;
  -moz-transition: .2s ease;
  -o-transition: .2s ease;
  transition: .2s ease;
    font-weight: bold;
}

.panel:checked ~ .plus {
  transform: rotate(90deg);
}

.panel {  display: none;}


/* ---------------------------------------------------------------- 	Footer Logos*/
 .footer-logos { width:100%; }
.footer-logos div {padding: 1.2em .5em;}

/*
.footer-logos :nth-child(6) { margin-top: -30px;  }

@media (max-width: 760px) {
    
    .footer-logos :nth-child(6) { margin-top:0px;  }
}

@media (max-width: 480px) {
    
    .footer-logos :nth-child(2), .footer-logos :nth-child(4) { position: relative; }
    .footer-logos :nth-child(4) { top:-52px; margin-bottom:-52px; width:350px; }
    .footer-logos :nth-child(6) { margin:15px 0;  }
    
} */

@media (max-width: 520px) {
    
    .footer-logos › div { width: 50%; text-align: center;}
    
}
@media (max-width: 780px) {	.border-sm-none { border:none!important; }
	
}


/* ---------------------------------------------------------------- 	Sticky Menu Start*/

.sticky-container{
    margin:0px;
    position:fixed;
    left:-170px;
    top:115px;
    width:220px;
    z-index:1000;  background-color:#ff6500; border-radius: 5px;
}

.sticky {
    margin-bottom: 0;
}

.sticky li{
    list-style-type:none; border-radius: 5px;
    color:#ff6500;
    height:51px;
    padding:0px;
    margin:0px;
    transition:all 0.25s ease-in-out;
    cursor:pointer;

}

		
.sticky li.item-help:hover{
	 margin-right:-125px;
}

.sticky li.item-email:hover{
	 margin-right:-85px;
}
		
		
.sticky li.item-faq:hover{
	 margin-right:-85px;
}

.sticky li.item-location:hover{
    margin-right:-60px;
}

.sticky li.item-whatsapp:hover{
    margin-right:-85px;
}
		
		


.sticky li a{
    display:flex;
    align-items: center;
    justify-content:flex-end;
    margin-right: 1rem;
    color:white;
    padding:15px 17px; background-color:#ff6500; border-radius: 5px; 
    margin:0px; 
    line-height:15px; 
	font-size: 15px;
    text-transform: uppercase;
    font-size: .75rem;
    font-family:Roboto;
    
    
}

.sticky li a span { margin-right: 1rem;}
.sticky li a:hover { color:white; background-color: #ff6500;}

.sticky li i {font-size: 1.3rem!important;}		


		
	@media (max-width: 990px)  {
  .sticky-container {    
            position:relative; 
            padding: 0;  
            left: auto; 
            width:100%;  
            top: auto;  
            border-radius: 0;
            background-color:#ff6500; 
            height:auto;
    }
		
		.sticky { margin: 0; padding: 0; width: 100%; height: 92px; margin-bottom: 0!important; }
		
		.sticky li a{
		border-radius: 0; background-color: #ff6500; color: white!important; margin: 0;  justify-content:center;
        flex-direction: column; order: 1; text-align: center; height:92px; }
		
        .sticky li a span { margin-right:0; order:2; margin-top: .6rem;}

        .sticky li.item-faq:hover, .sticky li.item-email:hover, .sticky li.item-help:hover, .sticky li.item-whatsapp:hover { margin-right:0;}

	

		.sticky li {  float: left; width: 25%; }

        .sticky.emp li {  width: 33.33%; }
        .sticky.emp li a { flex-direction: row;  order: 2;}
        .sticky.emp li a span { margin-right: 1rem;  order: 1;}

    }
        /*
        .sticky.basic li { width:50%; }
        .sticky.basic li i { margin: 0 .7em; }
        
        
        .shortened .sticky li { width: 50%;}
        .shortened .sticky li p i { margin-left: .7em; }
		
       
*/
		}


/* ---------------------------------------------------------------- 	 News Mobile */

.latest-news .row {  border-bottom: 1px solid #ddd; background-color: #f9f9f9; }
.latest-news h4 { font-weight:500; }
.latest-news p { line-height:1em;  }
.latest-news .cover { background-color: #ff6500; color: white; }
.latest-news .cover h4 { font-size:1.4em; line-height:1em; }
.latest-news .cover a {color:white;}
.latest-news .cover a:hover { text-decoration: underline; }
 

/* ---------------------------------------------------------------- 	Search Box*/

#navapp .navbar-collapse {
		position: relative;
		max-height: auto; 
        background-color: none;
        border-radius: none;
        padding: 0!important;
	}

.navbar-collapse {
		position: relative;
		/*padding: 15px 20px;*/
		max-height: auto; 
        background-color: none;
        border-radius: 0 0 10px 10px;
        z-index: 1000;
	}



	.navbar-collapse form[role="search"] {
		position: absolute;
		top: 0px;
		right: 0px;
		width: 100%;
		padding: 0px;
		margin: 0px;
		z-index: 0;
	}
	.navbar-collapse form[role="search"] button,
	.navbar-collapse form[role="search"] input {
		padding: 8px 12px;
		border-radius: 0px;
		border-width: 0px;
		color: rgb(119, 119, 119);
		background-color: rgb(248, 248, 248);
		border-color: rgb(231, 231, 231);
		box-shadow: none;
		outline: none;
	}
	.navbar-collapse form[role="search"] input {
		padding: 16px 12px;
		font-size: 14pt;
		font-style: italic;
		color: rgb(160, 160, 160);
		box-shadow: none;
	}



/* ---------------------------------------------------------------- 	 Style Guide */
.guide ul { list-style-type: none;}
.guide ul li h1 { line-height:.3em; }
.fill-orange {color:#ff6500;}
.fill-darkorange {color:#C64C09;}
.fill-brown { color:#533c3f; }
.fill-lightblue { color:#a2c6d5;}
.fill-dark {color:#212529;}
.fill-lightgray { color:#f9f9f9}
.fill-gray {color:#d8d8d8;}
.fill-darkgray {color:#707070;}
.fill-lightorange { color:antiquewhite;}

.centertext {text-align:center}

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


header .container-fluid {display: flex; align-items: center; }
header .navbar-brand { padding: 0; margin: 0; font-size:.85rem;  }
header nav a img { display: inline-block; padding: 1.031em; }
@media (max-width:640px) {
header nav a img {  padding: 0.4em; }
}

.navbar-light .navbar-toggler { border-color:rgba(0,0,0,0);}
.navbar-toggler { line-height: 2.5rem; }


/*  --------------------------------------------------------------   NAVAPP   */

#navapp h4 { margin:1.3em 0;}

#navapp .container { padding: 2em 0!important;  }
#navapp .nav-link p  { margin-left: 37%; line-height: 1.2em; font-size:.8em;  text-transform:uppercase; display: inline-block; margin-bottom: 0; position: relative; top: -5px; color: #ff6600;   transition: all 0.5s ease; width: 75%!important; font-family:'Roboto'; font-weight: bold;}


#navapp .nav-link img { position: absolute; transition: opacity .5s ease-in-out; }
#navapp .navbar .nav-link { height: 70px; background: #F8F8F8; color: #EE8A48; transition: all .5s ease!important; display:inline-flex; align-items: center; border-radius: 7px; font-size: 1em;
	box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.1); 
     } 



#navapp .navbar .nav-link:hover .top { opacity:0;}
#navapp .navbar .nav-link:hover {   background: #ff6600!important; color: white;
box-shadow: 2px 2px 0 rgba(205, 82, 0, 0.3)  ; 
-webkit-box-shadow: 2px 2px 0 rgba(205, 82, 0, 0.3)  ; 
-moz-box-shadow: 2px 2px 0 rgba(205, 82, 0, 0.3)  ; 

}

#navapp .navbar .nav-link:hover p { color: white!important;}
#navapp .navbar-nav { display: flex; justify-content: space-between; width: 100%; vertical-align: middle; }
#navapp .navbar-collapse { padding-top: 0!important; max-height: none; } 





@media (min-width:1200px) {
    #navapp .nav-link img { margin-left:.3em; }
    #navapp .navbar .nav-link { width: 190px; }
    .nav-link p { padding-top: .9em;   margin-left:1em; width: 100px; }
    
    .navbar-nav.navapp-empresas .nav-link img { margin-left: 1.3em!important; }
    .navbar-nav.navapp-empresas .nav-link p {  margin-left: 6em!important;   }
    .navbar-nav.navapp-empresas .nav-item { width: 260px;    }
    .navbar-nav.navapp-empresas .nav-link { width: 100%!important;}
    #navapp .container.side  .nav-link {height: 55px;}
}

@media (max-width:1200px) {
    
    #navapp .navbar .nav-link { width: 170px; height: 60px;    }
    #navapp .nav-link p  { margin-left: 30%; line-height: 1.2em; font-size:.8em;  text-transform:uppercase;   }
    #navapp .nav-link img {margin-left: 0; width:3.5%;  }
    .nav-link p  {line-height: 1.1em; padding-top:1em; font-size:.75em; width: 110px; margin-left:.9em;}
    .navbar-nav.navapp-empresas .nav-item { width: 220px;  }
    .navbar-nav.navapp-empresas .nav-link { width: 100%!important; }
    #navapp .container.side .nav-link p { font-size:.95em!important; }
    #navapp .container.side .nav-link img { width: 10%!important; }
}


@media (max-width:991px) {
    #navapp .navbar .nav-link {  width: 100%;  height: 54px; display: flex; align-items: center;  }
    #navapp .navbar .nav-link p { margin-left: 13%; font-size:.95em;   }
    #navapp .nav-link img {  left: 4%; width:4.5%; }
    #navapp .container.side .navbar .nav-link p {position: auto; padding-top:.7em; font-size:.8em; margin-left:13%; }
    #navapp .container.side .navbar .nav-link img {left: 4%; width:4.5%; }
    
    header nav a img {  padding: .7em; }
    .nav-link p { width: 100%; padding-top: .8em;  }
    
    .navbar-nav.navapp-empresas .nav-item { width: 100%;  }
    .navbar-nav.navapp-empresas .nav-link { width: 100%!important; }
    
    #navapp .container.side .nav-link p { font-size:.95em!important; }
    #navapp .container.side .nav-link img { width: 5%!important; }
    
    #navapp .navbar { margin: 0; }
    #navapp .navbar-nav .nav-item { margin:0 0 .8em 0; }
    #navapp .container { padding: 0 0 2em; }
    
    
    
}

@media (max-width:768px){
    
    #navapp .nav-link img {  left: 5%; width:6%; } 
    #navapp .container.side .navbar .nav-link img {left: 4%; width:6%; }
    #navapp .container.side .nav-link p { font-size:.95em!important; margin-left: 5.5em!important; }
    #navapp .container.side .nav-link img { width: 6.5%!important; }
}



@media (max-width:480px){ 
    
    .navbar { padding:0 1.3em; }
     #navapp .container.side .navbar .nav-link img { width:8%; }
     #navapp .container.side .navbar .nav-link p { margin-left: 15%; }
}

#navapp .container.side { padding:0!important; }
#navapp .container.side .navbar-nav {  display: block; justify-content:flex-start; }
#navapp .container.side .navbar { padding:0;}
#navapp .container.side .navbar-nav .nav-item { margin:0 0 .7em 0; }
#navapp .container.side .navbar-nav .nav-item .nav-link { width: 100%; }
#navapp .container.side .navbar-nav .nav-item .nav-link p { width: 90%; font-size:.9em; }
#navapp .container.side .nav-link p  { margin-left: 22%; line-height: 1.3em; font-size:.85em;  text-transform:uppercase;  }
#navapp .container.side .nav-link img { position: absolute; left: 4%; transition: opacity .5s ease-in-out; width: 9.5%; }


@media (min-width:1200px) {
#navapp .container.side .nav-link img {  left: 7%;  width: 9.5%; }
    #navapp .container.side .nav-link p { margin-left: 20%;}

}




@media (min-width:1200px) {
    #navapp .container.side .navbar-nav .nav-item .nav-link p {font-size:.95em; padding-left: .95em; }
    #navapp .container.side .navbar-nav .nav-item .nav-link span { margin-left: 1.2em;}
}

@media (min-width:1400px) {
    #navapp .container.side .navbar-nav .nav-item .nav-link span { margin-left: 1em;}
    #navapp .container.side .navbar-nav .nav-item .nav-link p { width: 90%; font-size:1em; padding-left: .8em;  }
    
    
}


@media (max-width:991px) {
   #navapp .container.side .navbar-nav .nav-item { margin:0 0 1em 0; } 
}


/* ------------------------------------------------------------------- FONTELLO */

@font-face {
      font-family: 'fontello';
      src: url('../fonts/fontello.ttf') format('truetype');
      font-weight: normal;
      font-style: normal;
    }
     


 [class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  /* speak-as: none; */
  speak: never;
 
  display: inline-block;
  text-decoration: inherit;
/*  width: 1em;*/
  /*margin-right: .2em;*/
  text-align: center;
  /* opacity: .8; */
 
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
 
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
 
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  /*margin-left: .2em;*/
 
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
 
  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}





.sticky .icon-help-circled, .sticky .icon-info-circled, .sticky .icon-mail-alt, .sticky .icon-icons8-whatsapp, .sticky .icon-location-1 { font-size: 1.35em; }
.icon-hammer, .icon-book, .icon-bank, .icon-folder-open, .icon-doc-inv-1, .icon-credit-card, .icon-medkit, .icon-certificate-outline, .icon-flight, .icon-clipboard-check-solid { font-size: 1.5em; margin-right: .8em;  }
.icon-star-1, .icon-pencil-neg { margin-right: .5em; }
.icon-pin { font-size:1.5em; margin-right: .5em; color:#ff6600; }
.icon-asterisk { margin-right: .5em;}
.icon-warning, .icon-sitemap { font-size: 4em; }
.icon-help-circled { font-size:1.1em; }

.icon-calendar-1 { font-size:1.4em; margin-right: .5em;  }

.icon-plus-circled { margin-left:.5em; }
.icon-bell-alt, .icon-asterisk { color:#ff6600; font-size:1.3em;  margin-right: .5em;  }
.icon-arrows-cw {margin:0 .4em; }




/* ---------------------------------------------------- SEARCH BUTTON */

.icon-search { display: flex; align-items: center; justify-content: center; width:35px; height: 35px;  font-size:1.2em;  border-radius:100px; padding: 0;  }
.nav-item button { padding: 0; border: 0; border-radius:100px!important; height: 35px; width: 35px; }
.btn-outline-primary:hover { background-color: #ff6600; color:white!important; border-color:#ff6600;  }
.btn-outline-primary:not(:disabled):not(.disabled).active:focus, .btn-outline-primary:not(:disabled):not(.disabled):active:focus, .show›.btn-outline-primary.dropdown-toggle:focus { box-shadow:0 0 0 0.2rem rgba(255,102,0,.5) }
.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show›.btn-outline-primary.dropdown-toggle {background-color: #ff6600; border-color:#ff6600;  }

 
@media (max-width:1200px) {
    .slidecontainer h1 span.odd img {width: 80%!important;} 
}

@media (max-width:990px) {
    .slidecontainer h1 span.odd { margin-top: 0;}
    .slidecontainer h1 span.odd img { margin: 0 auto; width: 36%!important;} 
}

.slide-title { width: 230px; position: absolute;  
                z-index: 200;  top: 35px; }

.slidelink {    
                width: 110px; height: 110px; 
                position: absolute; top: 135px; 
                left:28%;  z-index: 200;  }
.slidelink a span {display: none;}




@media (min-width:1400px) { 
    .slidelink {  left:30%;} 

}

@media (min-width:1600px) { 
    .slidelink {  left:32%;} 

}
@media (min-width:1790px) { 
    .slidelink {  left:34%;} 

}



@media (max-width:1200px) {
    
    .slidecontainer h1 { font-size:1.6em;   line-height: 1.1em;}
    .slidelink { left:25%;  }
    .slide-title { margin-left:90px; width:170px; }
}

@media (max-width:780px) {
    .slidecontainer { width: 600px;margin: 0 auto;}
    .slidecontainer h1 { font-size:1.5em;  text-align: center!important; }
    #coverandlogin .container-fluid {height: 380px!important; }
    .slide-title { position:relative; width: 400px;}
    
    }

@media (max-width:580px) {
    .slidecontainer { width: 100%; margin: 0 auto; }
    .slidecontainer h1 { font-size:1.4em;  text-align: center!important; }
    
     .slide-title {margin-left: 0; padding:0 1.3em;  position:relative; width:100%;}
    
    #coverandlogin .container-fluid {height: 350px!important; }
        .slidelink { width:100%; margin:0; padding: 0; display: flex; justify-content: center;  }
    .slidecontainer h1 { width: 100%; }
    .slidelink a span {display: block; width: 190px; padding:.5em 1em; border-radius:50px; color: white; background-color: #ff6600; text-align: center; margin-top: .5em; transition: all .5s;  }
    .coverandlogin-container { padding-bottom: 1rem;}
    }

@media (max-width:580px) { 
   .slidecontainer › .img-fluid { max-width: none; height: auto; width: 150%!important; position:relative; left:-25%!important; right: 0!important;}
   

}



/* ----------------------------------------------------- COVER & LOGIN */

@media (max-width:470px) { 
    #coverandlogin .container-fluid {height: 360px!important; }
}
#coverandlogin .container-fluid { height: 290px; }
@media (max-width:990px) {
#coverandlogin .container-fluid {    height: 420px; margin-bottom: 3em; }
}


/* ---------------------------------------------------------- LOGBOX */

.logbox {   height: 290px; position: absolute; top:80px; z-index: 300; left:0; right: 0; pointer-events: none;   }

.logbox .row { display: flex; justify-content: flex-end;}
.logbox [class*=' col-'] { padding: 0; height: 290px; display: flex; }
.logbox [class*=' col-'] .login-box { align-items: center; width: 100%; }
.login-box { pointer-events: all; }
.login-box .icon-help-circled { font-size:.9em; color: #ff6600; }


@media (max-width:1200px) {
    .logbox {   top:140px;  pointer-events: none;   }
    
}

@media (max-width:1197px) {
    .logbox {   top:80px;  pointer-events: none;   }
    
}

@media (max-width:991px) {
    .logbox {position: relative;  top:0; height: 230px!important; margin: 1em auto;   }
    .logbox [class*=' col-'] { padding: .5em 0; height: 230px; display: flex; }

}


@media (max-width:780px) {
    .logbox {padding:0 2.5em; }
}



/* -------------------------------------------------------- WELCOME MOBILE */
#welcomemobile { display: none; }
@media (max-width:990px){
#welcomemobile { display: block; margin-top: 1.075em; }
#welcomemobile .row { background-color: antiquewhite; padding: 1em; display: flex; justify-content: center; }
#welcomemobile h2 {   margin:.5em 1.5em; padding-bottom: 0;  }
#welcomemobile a { font-family: 'Roboto'; font-weight: 500; margin-right:2em; padding:.5em 2em;  letter-spacing: -.5px;  }
}

@media (max-width:630px) {
    #welcomemobile { display: block; margin-top: 1.075em; }
    #welcomemobile .row { display: block; margin: 0; padding: .7em 0; }
    #welcomemobile h2, #welcomemobile span { display: block; text-align: center!important; } 
    #welcomemobile span { padding-left: 2.3em;}
    #welcomemobile a { padding:.5em 2.8em; margin-bottom: .5em;  }
}


/*  --------------------------------------------------------------   SEGURIDAD EN LA INFORMACION  */

#infotabs div.card {
   border: 0; margin-bottom: 30px; margin-top: 30px;  background: #EFEFEF; box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 8px 0 rgba(0,0,0,.12);
}
#infotabs div.card .card-header {
    border-radius: 8px 8px 0 0;   padding: 8px; border: 0;
}
#infotabs .card-body{    padding:0;}
#infotabs .card-body h1 { font-size: 1.8em; }
#infotabs div.card .card-header-primary {
    background: linear-gradient(60deg,#ff6600,#cc5100);
    /*box-shadow: 0 5px 20px 0 rgba(0,0,0,.2), 0 13px 24px -11px rgba(156,39,176,.6);*/
}

#infotabs .card-nav-tabs .card-header {    margin-top:0!important;}
#infotabs .card .card-header .nav-tabs {    padding: 0;}
#infotabs .nav-tabs {   border: 0;    border-radius: 8px;   padding: 0 15px;}
#infotabs .nav {    padding-left: 0;    margin-bottom: 0;    list-style: none;}
#infotabs .nav-tabs .nav-item {   width: 20%; }

#infotabs .nav-tabs .nav-item .nav-link.active {
    background-color: hsla(0,0%,100%,.2);
    transition: background-color .3s .2s;
}

#infotabs .nav-tabs .nav-item .nav-link{
    border: 0!important;
    color: #fff!important;
    font-weight: 500;
}

#infotabs .nav-tabs .nav-item .nav-link {
    color: #fff;    border: 0;    margin: 0;
    border-radius: 8px;
    text-transform: uppercase;
    font-size: .8em;line-height: 1.2em; padding: 15px 0;
    background-color: transparent;
    transition: background-color .3s 0s; 
}

#infotabs .nav-link{    display: block; text-align: center; padding:1rem .5rem!important;}
#infotabs .nav .nav-item {  position: relative;  }
#infotabs .tab-content { border-left:none; padding:0; min-height: auto;}
#infotabs .tab-content .pane-content { padding: 3em;  }
#infotabs .tab-content .row { padding: 0; margin: 0; display: block;}
#infotabs .tab-content .row img { max-width: 100%; width: auto; height: auto;}
        
#infotabs .nav-link i { font-size:3em;  }
#infotabs .nav-link span {display:block; margin:1.2em 0 .5em; }
#infotabs .tab-content ul li {margin-bottom: 2em;} 
#infotabs .pane-content p.illus { text-align: center; margin:3em 0; } 
        #infotabs .tab-content strong { font-weight:  900;}
        
        
@media (max-width: 1200px) { 
        #infotabs .nav-link span {display:none; }
}


/* ----------------------------------------------------------- CONTAINER BANNER  */
.container-banner { display: block; padding:1em; margin: 2em 0; height:150px; max-width: 100%;   }
.container-banner img  {border-radius:7px; border:1px solid #eee;  transition: all;  transition-duration: .3s; max-width: 100%!important;    }
.container-banner a img:hover { box-shadow: 2px 2px 0 rgba(22,22,22,.15);   }



.container-blocks .container-banner { margin-top: 0; padding:0;}

#slider > div { 
    position: absolute; 
    left:50%; margin-left: -142px;
} 

.banner-800 { display:flex; flex-direction: column; width:800px; margin:1.2rem auto; height:90px;}
.banner-800 > div:nth-child(1)  { display:flex; flex-direction: row!; justify-content: space-between;}


@media (max-width: 992px) {
    .banner-800 { margin:2rem;}
    .banner-800 img { margin:0; width:80%;}
}


@media (max-width: 768px) {
    .container-banner {margin: 0 1.3em 2rem;}
    .banner-800 { width:300px; margin:1.8rem auto;  height:170px;}
    
}





/* ----------------------------------------------------------- CONTAINER INTERNA  */
body div:nth-child(3) .row .col-12:nth-child(2) h4 {margin: 2em 0 2em;}
body div:nth-child(3) .row .col-12:nth-child(2) .container-blockone { padding:0; }
body div:nth-child(3) .row .col-12:nth-child(2) .container-blockone .l-number { width:85%; }
body div:nth-child(3) .row .col-12:nth-child(2) .container-blockone h4 {margin:0 0 1em; }
body div:nth-child(3) .row .col-12:nth-child(2) .container-blockone { margin-bottom: 2em;}



@media (max-width: 480px) { 
    body div:nth-child(3) .row .col-12:nth-child(2) .container-blockone { padding:0 1em; }
    #navapp .container.side .navbar-nav .nav-link {padding:1.8em!important;}
    #navapp .navbar .nav-link { margin-bottom:0;}
    .row.information .col-12 h3 { font-size: 1em!important; width: 100%!important; }
   

}
@media (max-width: 767px) { 
    .row.information .col-12 { text-align: center; }
    .row.information .col-12 p { width: 400px; text-align: left; margin: 0 auto;}
    .row.information .col-12 h3 {width: 400px; height: auto; max-height:40px; margin: 1.5em auto .5em;  }
    .row.information .col-12 { padding-bottom:3em;}
    .row.information .col-12:nth-child(3) { padding-bottom:0;}
    body div:nth-child(3) .row .col-12:nth-child(2) { padding:0 1.8em;  }
}

.card-body .row .col-12 h4 { margin:1em 0!important;  }
.col-12 .row i.icon-info-circled {font-size:1.35em!important;}
.card-body { background-color: #f9f9f9; border: none;}



/*.sidecolumn div.row { padding-top:2em; }*/
.sidecolumn div.row { margin-bottom: 2em;}
.sidecolumn div.row div:nth-child(2).border-right { border: none!important; }
.sidecolumn div.row div.px-3 { padding: 0 1.5rem!important;}
.sidecolumn div.row h4 { margin: 0!important; }
.sidecolumn .simpleBanner { margin: 0 auto;}

/*.nav-item .icon-lightbulb { font-size: 1.2em; }*/

.nav-mark { background-color:#fff0e7!important; }
.nav-mark:hover { background-color:#ff6600!important; }

@media (max-width:780px) {
    ul.nav.anchor li { width: 100%!important; border-bottom: 1px solid #e1e1e1;}
}


.update {color: chocolate; font-weight: normal;}
.slidecontainer .update {
position: absolute; display: flex; 
    margin: 0;
    color: floralwhite; 
}


.slidecontainer .update i { background-color: chocolate; color:white; border-radius:50%; line-height:0; padding:.25em .20em ; display: inline-block; width:18px; height: 18px; font-size:.85em; text-align: center!important; vertical-align: middle; }



@media (max-width:990px) {
    .slidecontainer .update {
position: relative;
    top: auto;
    margin: 0;
    text-align: center;
        justify-content: center;

}
    
}
.bg-header { background-color: white;}
.fix-header {display: block; height: 84px;}
@media (max-width:990px) {
    .fix-header {height: 60px;}
    
}

/* FAQ */

.qs-result { background-color: #fff6ee;/*  border: 1px solid #ffefe8; */ padding: 1em; border-radius: 8px; box-shadow: 2px 2px 0px 0px rgba(255, 228, 204, 0.8); margin-bottom: 3em; padding: 1.5em 2em;}

.qs-result p:last-child {margin-bottom: none;}
.qs-result p i {display: inline-block; font-weight: bold; padding: .3em; font-style: normal; font-weight: bold; background-color: #ffe4cc;}




.tt-hint {
    color: #999999;
}
.tt-menu {
    background-color: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 8px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    margin-top: 12px;
    padding: 8px 0;
    width: 100%;
}
.tt-suggestion {
    font-size: 18px;  /*Set suggestion dropdown font size*/
    padding:.3em 1em;
}
.tt-suggestion:hover {
    cursor: pointer;
    background-color: #ffede3;
    color:  #323232;
}
.tt-suggestion p {
    margin: 0;}

.twitter-typeahead { width: 100%;
    margin:1.2em 0;

}


	

.search-wrapper { position: relative; margin:2.5rem 0;  } 


.search-box {
	position: relative;
	padding: 10px;
}


.search-box {
    border: 1px solid #CCCCCC;
    border-radius: 8px;
    font-size: 1.3em; 
    height: 30px;
    line-height: 30px;
    padding:1.15em 1em;
    width: 100%;
    background-color: #FFFFFF;
    position: relative;
    outline: 0;

}
.search-box:focus {
border: 1px solid #f60;
outline: 0;
border-radius:8px;
border: 1px solid #f60;
}
.close-icon {
	border:1px solid transparent;
	background-color: transparent;
	display: inline-block;
	vertical-align: middle;
    outline: 0;
    cursor: pointer;
    top:22px;
    right: 10px;
    position: absolute;
}
.close-icon:after {   
    content: "×";
    display: block;
    width: 17px;
    height: 17px;
    z-index:1;
    right: 30px;
    top: 0;
    bottom: 0;
    margin: auto;
    padding: 2px;
    text-align: center;
    color: #bababa;
    font-weight: bold;
    font-size: 1.5em;
    cursor: pointer;
    line-height: 1.3em;

}


.hideout
{
    display: none;
}



.search-wrapper form span.twitter-typeahead input:nth-child(2):valid { background-color: #f5f5f9;}
button.close-icon:focus { outline: 0!important;}


.faq-more .card {border: none;}
.faq-more  .collapse .card-body { background-color: none; background: none;}
.faq-more .faq-question .panel-content ul li { margin-bottom: 1em;}

.formula { width: 50%; margin: 2em auto; }
.formula p { text-align: center; margin: 0; padding:.7em; font-weight: bold; }
.formula p:first-child {border-bottom: 1px solid #999;}

.tabla-modulos td i { color:#ff6500; font-size: 1em;  }
.tabla-modulos tbody tr td:nth-child(3), 
.tabla-modulos tbody tr td:nth-child(4), 
.tabla-modulos tbody tr td:nth-child(5) {
    text-align: center;
}

.card-modulos { border-radius:10px; margin:0em 0 3em 0; }
.card-modulos .col-12, .card-modulos .col-md-6 {
	padding: 2em; align-self: center;
}

.card-modulos-color { background-color: #e2feff;}
.card-modulos .btn { padding: .5em 3em;}
.card-modulos .btn i {  margin-right: 1em; }

.quote-page { text-align: center; padding: 2em; }
.quote-page h2 { margin-bottom: .5em; margin-top: 1.5em; text-align: center!important; line-height: 1em; font-size:2.3em; color:#00ADBB!important; letter-spacing: -.04rem;  }
.quote-page p { font-size: 1.5em;  line-height: 1.1em; }
.quote-page hr { margin-top: 3em; border-top:2px solid #00ADBB; width: 50%; margin-bottom: 2em;}


/* ---------- Modal --------------- */
.modal-body ul li {padding-bottom: .7em;}
.list-modal {  list-style-type: none; padding:0; display:flex; flex-direction: row; flex-wrap: wrap;  }
.list-modal li { width:50%; padding:1rem 1.2rem; border-bottom:1px solid #ececec;}
.list-modal li a {transition: all 0.5s; position: relative; width: auto;}

.list-modal li a::before {
    content: '\f14c';
    font-family: 'fontello';
    font-weight: 400;
    position: absolute;
    left: 0;
    top: 0;
    left: 0;
    bottom: 0;
    opacity: 0;

}

.list-modal li a:hover {

    transition: all 0.2s;
    padding: 0 0 0 1.5rem; 
}

.list-modal li a:hover::before {
        opacity: 1;
        transition: all 0.2s;

    }

.side-note {
    color:#533c3f; 
    font-family: Roboto; 
    padding:2em; 
    border-radius:8px; 
    background-color: #fbfbfb;  
}

.side-note p:last-child {
font-size:.8em;
}
.icon-heading { display:flex; margin-bottom: 1.5em; }
.icon-heading i { margin-right: 1rem; color:#ff6500; font-size: 1.3em;}

.side-note hr { margin:2.5rem 0; }

.form-frame {
    background-color: #F6F6F6;
    padding:2em;
    border-radius:12px;
}

.results-pagination { font-family: Roboto; margin:3em auto; display:flex; justify-content: center; }
.active-page { color:#8d8d8d; font-weight: 900; }
.results-pagination ul { list-style-type: none;margin:0; padding: 0; display:flex;  }
.results-pagination ul li {padding: 0 1em;}

.sidecolumn .points-dates { margin:3rem 0;}
.sidecolumn .points-dates #one, .sidecolumn .points-dates #two, .sidecolumn .points-dates #three { border-right: 1px solid transparent;}

.grid-navapp {  display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: 0.3fr;
    gap: 1em;
    grid-auto-flow: row;
    grid-template-areas:
      "nav-cesantias nav-pensiones nav-consultar nav-pse nav-presencial nav-certificado";
  }

  
  
    .nav-cesantias { grid-area: nav-cesantias; display: flex;}
    .nav-pensiones { grid-area: nav-pensiones;  display: flex; }
    .nav-consultar { grid-area: nav-consultar; display: flex; }
    .nav-pse { grid-area: nav-pse;  display: flex; }
    .nav-presencial { grid-area: nav-presencial; display: flex; }
    .nav-certificado { grid-area: nav-certificado; display: flex; }


    .grid-navapp.emp { 
        grid-template-columns: 1fr 1fr 1fr 1fr;
        grid-template-areas:
          "nav-cesantias nav-pensiones nav-consultar nav-certificado";
      }




.grid-navapp a { display:flex; background-color: #f1f1f1; border-radius:7px; align-items:center; color:#ff6500; transition:all .2s; box-shadow:2px 2px 0 rgba(0, 0, 0, 0.1); text-transform:uppercase; padding:1rem;  font-family:Roboto; font-weight: 500; justify-content:center; width:100%;}

.grid-navapp a i { display:flex; align-items:center; font-size:1.7rem; margin-right:.5em; width:35px; height:35px; }
.grid-navapp a span { font-size:.77rem; line-height:1em;}

.grid-navapp a:hover { background-color:#ff6500; color:#fff;}

.grid-navapp a i.icon-pse { text-indent: -9999px; background-image: url(../Content/Images/Icons/ico-pse-color.svg); background-size: cover; transition:all .2s;}

.grid-navapp a:hover i.icon-pse { background-image: url(../Content/Images/Icons/ico-pse-orange.svg); }


@media (max-width:1200px) {
    .grid-navapp a { flex-direction: column; }
    .grid-navapp a i {  margin-right:0; margin-bottom:.5em; }  
    .grid-navapp a span { text-align: center; }
}

@media (max-width:800px) {
    .grid-navapp a { flex-direction: row; }
    .grid-navapp a i {  margin-right:.5em; margin-bottom:0; }  
    .grid-navapp a span { text-align: left; }


    .grid-navapp {  display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 0.3fr 0.3fr 0.3fr;
        gap: 1em;
        grid-auto-flow: row;
        grid-template-areas:
          "nav-cesantias nav-pensiones"
          "nav-consultar nav-pse"
          "nav-presencial nav-certificado";
          padding:2rem;
      }

      .grid-navapp a { justify-content: flex-start;}


      .grid-navapp.emp { 
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 0.3fr 0.3fr;
        grid-template-areas:
          "nav-cesantias nav-pensiones"
          "nav-consultar nav-certificado";
      }
    
}


@media (max-width:768px) {
    .points-dates .col-6:nth-child(4) { border-right:1px solid transparent;} 
}

.sidecolumn .grid-navapp {  display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 0.3fr 0.3fr 0.3fr 0.3fr 0.3fr 0.3fr;
    gap: 1em;
    grid-auto-flow: row;
    grid-template-areas:
      "nav-cesantias" 
      "nav-pensiones" 
      "nav-consultar"
      "nav-pse"
      "nav-presencial"
      "nav-certificado";
      padding:0;
  }
.sidecolumn .grid-navapp a { justify-content: flex-start;}


.sidecolumn .grid-navapp.emp {  display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 0.3fr 0.3fr 0.3fr 0.3fr;
    gap: 1em;
    grid-auto-flow: row;
    grid-template-areas:
      "nav-cesantias" 
      "nav-pensiones" 
      "nav-consultar"
      "nav-certificado";
      padding:0;
  }


@media (max-width:1200px) {
    .sidecolumn .grid-navapp a { flex-direction: row; }
    .sidecolumn .grid-navapp a i {  margin-right:.5em; margin-bottom:0; }  
    .sidecolumn .grid-navapp a span { text-align: left; }


}

@media (max-width:990px) {

    .sidecolumn .grid-navapp {  
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 0.3fr 0.3fr 0.3fr;
        gap: 1em;
        grid-auto-flow: row;
        grid-template-areas:
          "nav-cesantias nav-pensiones" 
          "nav-consultar nav-pse"
          "nav-presencial nav-certificado";
       margin-bottom:3rem;
      }

      .sidecolumn .grid-navapp.emp {  display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 0.3fr 0.3fr;
        gap: 1em;
        grid-auto-flow: row;
        grid-template-areas:
          "nav-cesantias nav-pensiones" 
          "nav-consultar nav-certificado";
          padding:0 ;
          margin-bottom:0;
      }
      .container-fluid.blocks {
        padding-top: 4rem;
      }

}


@media (max-width:768px) {

    .sidecolumn .grid-navapp, .sidecolumn .grid-navapp.emp {  
          padding:0 2em;
      }

}


/* .sticky-container.emp li {
 width:33.33%;
} */

.list-column {
    column-count: 2;
    column-gap: 40px;
}

@media (max-width:768px) {

    .list-column {
        column-count: 1;
        column-gap: 0;
    }

}

.footer-contact { border-top: 1px solid #525252;}
.footer-contact > div.col-12 { padding-top: 2em;}
.footer-contact > div.col-12 > .row .col-12 { display: flex; flex-direction: column;}
footer .container { padding:0 2em;}

#tab-carousel .nav li.active { background-color: #64BFFF;

}

#tab-carousel .nav li { padding:.8rem; }
#tab-carousel .nav li a { color:#533C3F; font-weight:bold; }
#tab-carousel .nav li.active { background-color:transparent; border-bottom:2px solid #ff6500; }

#tab-carousel  .tab-content { 
    border-left: none;
    padding:0;
}

#tab-carousel  .nav-tabs { border-bottom: none;}


#tab-carousel .tab-content #fechas-de-pago, 
#tab-carousel .tab-content #informacion, 
#tab-carousel .tab-content #cifras
{  
    padding:.8rem 1.2em; 
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    box-shadow:2px 2px 0 rgba(0, 0, 0, 0.1);
    height: 155px;
}

#tab-carousel .tab-content { min-height: 155px;}

#tab-carousel .tab-content #fechas-de-pago,
#tab-carousel .tab-content #cifras {
    background-color:#f2f2f2;
}

#tab-carousel .tab-content #informacion {
    background-color: #FFF4EC;
}


#tab-carousel .tab-content #fechas-de-pago p { margin-bottom: 0; text-align: center}
#fechas-de-pago i { color:#6d3330; margin:0 1rem; }
.range { font-size:2rem; color:#6d3330; font-weight: 700; font-family: ;}


#tab-carousel .tab-content #fechas-de-pago > div { display:flex; flex-direction: column; justify-content: center; align-items: center; min-height:90px;}


.grid-numbers {  display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 0.5fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
      "rates interest wage";
  }
  
  .rates { grid-area: rates; }
  
  .interest { grid-area: interest; }
  
  .wage { grid-area: wage; }

  .rates,  .interest,   .wage   { padding:0 .6rem; }


  .grid-numbers strong { display:block;}
  .grid-numbers h6 {margin-bottom: 0; line-height:1rem; font-size: .85rem; margin-bottom: .5rem;}
  .grid-numbers p {margin-bottom:.5rem; line-height:1.2rem;}

 
/* ------ */
  .grid-blocks {  display: grid;
    grid-template-columns: .3fr 1.2fr .8fr;
    grid-template-rows: 1fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
      "b-networks b-information b-promo";
  }
  
.b-networks { grid-area: b-networks; }
.b-information { grid-area: b-information; margin:0 1rem; }
.b-promo { grid-area: b-promo; display: flex; flex-direction: column; justify-content: center; align-items: center; justify-content: space-between; padding: .95rem 0 0;}

.b-networks .block-2 { display:none; }
.b-networks h6 { padding:.95rem 0;}


@media (max-width:991px) {

    .grid-blocks {  display: grid;
        grid-template-columns: .3fr 1.2fr;
        grid-template-rows: 1fr 1fr;
        grid-template-areas:
          "b-networks b-information"
          "b-promo b-promo";
      }
      .b-promo {  flex-direction: row; justify-content: center; align-items: center; justify-content: space-between; padding: .95rem;}
      .b-promo img {margin:.5rem; width:100%;}
      .b-promo a { padding:0 .5rem;}

}

@media (max-width:768px) {
    .grid-blocks {  display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: .8fr .8fr 1fr;
        grid-template-areas:
          "b-networks"
          "b-information"
          "b-promo";
      }


    .b-promo {  flex-direction: column; justify-content: center; align-items: center; justify-content: space-around; padding: 1rem 0;}
    .b-promo a { text-align: center; padding:.5rem 0;}
    .b-promo img {margin:1rem; width:95%; }

    .simpleBanner { width:330px!important;}
    .simpleBanner .bannerListWpr ul li { width:110px!important;}
    .simpleBanner .bannerListWpr ul li a { display:flex; justify-content: center;}
    .simpleBanner .bannerListWpr ul li a img { width:90%;}
}


/* Bootstrap Carousel */
.slide-container {
    max-width:100%;
    padding-left: 15px;
    padding-right: 15px;
    margin-right: auto;
    margin-left: auto; 
    display:flex;
    pointer-events: auto; 
    
}


.slide-container-control {
    max-width:100%;
    right: 0;
    left: 0;
    position: absolute;
    display:flex;
    justify-content:space-between;
    top:0;
    bottom: 0;
    margin: 0 auto;
    pointer-events: none; 

}

.slide-container caption p:nth-child(2) {
  font-size: 1.35em;
  margin-bottom: 1em;
}


@media (min-width:1200px) {
    .slide-container {
        max-width:1140px; 
    }
    .slide-container-control {
        max-width:1140px;
    }

}

.carousel-item {height:430px;}

.carousel-control-next, .carousel-control-prev {
    background-color: transparent;
    border:none;
    pointer-events: auto; 
    cursor: pointer;
}

.carousel-control-prev { justify-content: left; }
.carousel-control-next { justify-content: right; }



.carousel-control-next-icon, .carousel-control-prev-icon {
    margin-top: -70px;
}

.cover {  text-align: center; overflow: hidden;}
.cover img { margin-top:-70px; }
.caption, .cover { width:50%; }
.caption { padding:2.5em 0 2em 3em;  }
.caption h2 { letter-spacing: -.05rem; font-size: 2rem; line-height:2.2rem; } 



@media (max-width:990px) {
    .caption  { width:50%; }
    .cover { width:50%; }
    .carousel-item {height:auto;}
    .caption h2 { font-size: 1.7rem; line-height:1.8rem; }
    .cover img { margin-top:-20px; }
}

@media (max-width:768px) {
   
    .cover img { margin-top:0;width: 80%; height: 80%;  }

}

@media (max-width:768px) {
    .slide-container { flex-direction:column;}
    .caption  { width:100%; }
    .cover { width:100%; }
   
}


@media (max-width:768px) {
    .cover img { margin-bottom: 30px; }
}



.carousel-item img.img-fluid { margin-top:0;}

/* Colors Cover */

.bg-template-gradient-1 {background: linear-gradient(90deg, rgba(243,110,42,1) 9%, rgba(249,163,27,1) 85%);}
.bg-template-gradient-2 {background: linear-gradient(90deg, rgba(0,179,184,1) 0%, rgba(101,121,180,1) 100%);}
.bg-template-gradient-3 { background: linear-gradient(90deg, rgba(250,169,17,1) 38%, rgba(243,110,43,1) 100%); }
.bg-template-gradient-4 {background: linear-gradient(90deg, rgba(197,242,255,1) 0%, rgba(172,219,233,1) 36%, rgba(150,200,215,1) 100%);}
.bg-template-gradient-5 {background: linear-gradient(90deg, rgba(29,177,86,1) 0%, rgba(29,177,86,1) 55%, rgba(139,198,62,1) 95%);}
/* .bg-template-primary { background:#1A345B url(../Content/Images/Slider/Emp/1023-promocion-foro-miplanilla.com-2023-bg.png) no-repeat center top; } */


/* Enlace Plantillas 1,2,5 lightlink */

.bg-template-gradient-1 h2, .bg-template-gradient-2 h2, .bg-template-gradient-5 h2 { color: #fff;} 
.bg-template-gradient-3 h2, .bg-template-gradient-4 h2 { color: #202020;} 

#carousel-cover a.infolink {
  background-color: transparent;
  padding: .5em 2.7em .5em 1.2em;
  border-radius: 20px;
  transition:all .2s;
  position:relative;
  border-width: 1px;
  border-style: solid;
}

#carousel-cover .bg-template-gradient-1 a.infolink, 
#carousel-cover .bg-template-gradient-2 a.infolink, 
#carousel-cover .bg-template-gradient-5 a.infolink { 
  color:#fff;
  border-color: #fff;
}

#carousel-cover .bg-template-gradient-1 a:hover.infolink,
#carousel-cover .bg-template-gradient-2 a:hover.infolink,
#carousel-cover .bg-template-gradient-5 a:hover.infolink
{ 
  background-color:rgba(0, 0, 0, .25);
  border-color:rgba(0, 0, 0, .12); 
}

/* Enlace Plantillas 3,4 darklink */

#carousel-cover .bg-template-gradient-3 a.infolink,
#carousel-cover .bg-template-gradient-4 a.infolink
 { 
  color:#202020;
  border-color: #202020;
}

#carousel-cover .bg-template-gradient-3 a:hover.infolink,
#carousel-cover .bg-template-gradient-4 a:hover.infolink 
{ 
  background-color:rgba(255, 255, 255, .5);
  border-color:#fff;
}

#carousel-cover a.infolink i
{ 
  position:absolute;
  transition: transform .3s; 
}

#carousel-cover a:hover.infolink i
{ 
   transform: translate(5px, 0);
}





.toolbox { max-width:1120px;  height: 180px; 
    position: absolute; 
    top:315px; z-index: 300; 
    box-shadow: 2px 2px 7px -1px rgba(0,0,0,0.5);
    margin: 0 auto;
    border-radius: 8px;
    left: 50%;
  transform: translateX(-50%);
background-color: white;
   }

   @media (max-width:1920px) {
    .toolbox { width:1120px; }
}


@media (max-width:1200px) {
    .toolbox { width:990px; }
    .caption { padding:2em 2em 2em 3em;  }
}

@media (max-width:990px) {
    
    .toolbox { width:768px; position: relative;  left: 50%;
        transform: translateX(-50%); margin:0; top:40px;  }
}

@media (max-width:768px) {
    .toolbox { width:600px; }
}

@media (max-width:660px) {
   
    .toolbox { width:auto; margin:0 15px; left:46.5%; }
    .caption { padding:2em;  }


}

.toolbox .row { margin:0; }
.toolbox .row [class*="col-"] { padding: 1em; height:180px;}
.toolbox .row > div:nth-child(2) { border-top-right-radius: 8px; border-bottom-right-radius: 8px; background-color: #f9f9f9; }

.container-login-cta { display:flex; align-items: center; justify-content: space-between;}

.container-login-cta button { padding:.3rem 4rem;}
.toolbox  .form-control { font-size: .9rem;}
.toolbox  .form-group { margin-bottom: .75rem;}

.grid-toolbar {  display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
      "tool1 tool2 tool3 tool4 tool5 tool6 tool7";
    height:110px;
  }
  

  .tool1, 
  .tool2,
  .tool3, 
  .tool4, 
  .tool5, 
  .tool6,
  .tool7, 
  .tool8 
{ display:flex; align-items: center; justify-content: center;
} 

.tool8 { display:none;}

.tool1 a, 
.tool2 a,
.tool3 a, 
.tool4 a, 
.tool5 a, 
.tool6 a,
.tool7 a, 
.tool8 a 
{ display:flex; text-align: center;
  flex-direction: column; text-transform: uppercase;
  font-weight: 400; font-family: 'Roboto Condensed'; font-size:.82rem;
  line-height:1rem; letter-spacing: -.02rem;
  transition:all .5s;
} 

.tool1 a i, 
.tool2 a i,
.tool3 a i, 
.tool4 a i, 
.tool5 a i, 
.tool6 a i,
.tool7 a i, 
.tool8 a i 
{
    font-size: 1.7rem;
    margin-bottom: .9rem;
    
}


.tool1 a span, 
.tool2 a span,
.tool3 a span, 
.tool4 a span, 
.tool5 a span, 
.tool6 a span,
.tool7 a span, 
.tool8 a span
{ 
    color:#424242;
   
} 

.tool1 a:hover span, 
.tool2 a:hover span,
.tool3 a:hover span, 
.tool4 a:hover span, 
.tool5 a:hover span, 
.tool6 a:hover span,
.tool7 a:hover span, 
.tool8 a:hover span
{ 
    color:#6d3330;
} 




    .tool1 { grid-area: tool1; }
    .tool2 { grid-area: tool2; }
    .tool3 { grid-area: tool3; }
    .tool4 { grid-area: tool4; }
    .tool5 { grid-area: tool5; }
    .tool6 { grid-area: tool6; }
    .tool7 { grid-area: tool7; }
    .tool8 { grid-area: tool8; }
  


    .grid-toolbar a i.icon-pse { text-indent: -9999px; background-image: url(../Content/Images/Icons/ico-pse-color.svg); background-size: cover; width:35px; height: 35px; margin:0 auto .9rem auto;}


    @media (max-width:991px) {
   
        .grid-toolbar {  
            grid-template-columns: 1fr 1fr 1fr 1fr;
            grid-template-rows: 1fr;
            grid-template-areas:
              "tool3 tool6 tool5 tool8";

          }
          .tool8 { display:flex;}

          .tool1, 
          .tool2, 
          .tool4,
          .tool7 { display:none; }

          .toolbox { height:auto;}


          .toolbox .row>div:nth-child(2) {
            border-top-right-radius: 0; border-bottom-right-radius: 8px; 
            border-bottom-left-radius: 8px; 
          }
    
    }

#pop-options .grid-toolbar {

    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    grid-template-areas:
      "tool1 tool2"
      "tool4 tool7";
      min-height: 230px;
    
}

#pop-options .tool3,
#pop-options .tool6,
#pop-options .tool5,
#pop-options .tool8 { display:none;}


#pop-options .tool1, 
#pop-options .tool2, 
#pop-options .tool4,
#pop-options .tool7 { display:block; padding: 1rem; }



.grid-toolbar.portal-emp {
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr;
    grid-template-areas:
      "tool1 tool2 tool3 tool4";
}

.grid-toolbar.portal-emp  .tool5,
.grid-toolbar.portal-emp  .tool6,
.grid-toolbar.portal-emp  .tool7,
.grid-toolbar.portal-emp  .tool8 { display:none;}


@media (max-width:991px) {

    .grid-toolbar.portal-emp  .tool1,
    .grid-toolbar.portal-emp  .tool2,
    .grid-toolbar.portal-emp  .tool3,
    .grid-toolbar.portal-emp  .tool4 { display:flex;}
   

    .grid-toolbar.portal-emp  .tool5,
    .grid-toolbar.portal-emp  .tool6,
    .grid-toolbar.portal-emp  .tool7,
    .grid-toolbar.portal-emp  .tool8 { display:none;}

}
.grid-toolbar .icon-clipboard-check-solid { margin-right: 0;}

.caption a i { margin-left: .7rem;}


/* ---------------------- Circular Menu --------------- */


.c-circle-menu {
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 1000;
  
  }
  
  @media (min-width: 480px) and (min-height: 480px) {
    .c-circle-menu {
      width: 75px;
      height: 75px;
    }
  }
  
  .c-circle-menu__items {
    display: block;
    list-style: none;
    position: absolute;
    z-index: 2;
    margin: 0;
    padding: 0;
  }
  
  .c-circle-menu__item {
    display: block;
    position: absolute;
    top: 0;
    left: 10px;
    opacity: 0;
    background-color: #ff6600 ;
    -webkit-transition: opacity, -webkit-transform;
    transition: opacity, -webkit-transform;
    transition: transform, opacity;
    transition: transform, opacity, -webkit-transform;
    -webkit-transition-duration: 0.3s, 0.3s;
            transition-duration: 0.3s, 0.3s;
    -webkit-transition-timing-function: cubic-bezier(0.35, -0.59, 0.47, 0.97);
            transition-timing-function: cubic-bezier(0.35, -0.59, 0.47, 0.97);
  }
  
  
  .c-circle-menu__item p { color:white; 
    position: absolute; 
    animation: paragraph 2s 1;
    line-height: 1rem;
    text-align: right;
    font-size: 1rem;
    text-shadow: 1px 1px 1px #000000;
}


  
  
  @keyframes paragraph { 
    0% {
      opacity: 0;
    }
  
    100% {
      opacity: 1;
    }
  }
  
  .c-circle-menu__item:hover {
    background-color: #c64c09; 
  }
  
  .c-circle-menu__item:nth-child(1) p { right:70px; top:0; }
  .c-circle-menu__item:nth-child(2) p { right:70px; top:-20px;}
  .c-circle-menu__item:nth-child(3) p { right:70px; top:-10px;}
  .c-circle-menu__item:nth-child(4) p { right:70px; top:-30px;}
  .c-circle-menu__item:nth-child(5) p { right:45px; top:-30px;}
  .c-circle-menu__item:nth-child(6) p { right:30px; top:-40px; width: 80px;}
  
  
  @media (min-width: 480px) and (min-height: 480px) {
    .c-circle-menu__item {
      width: 50px;
      height: 50px;
      border-radius: 50px;
    }
  }
  
  /**
   * Transisition delays at the default state.
   */
  .c-circle-menu__item:nth-child(1) {
    -webkit-transition-delay: 0.5s;
            transition-delay: 0.5s;
  }
  
  .c-circle-menu__item:nth-child(2) {
    -webkit-transition-delay: 0.4s;
            transition-delay: 0.4s;
  }
  
  .c-circle-menu__item:nth-child(3) {
    -webkit-transition-delay: 0.3s;
            transition-delay: 0.3s;
  }
  
  .c-circle-menu__item:nth-child(4) {
    -webkit-transition-delay: 0.2s;
            transition-delay: 0.2s;
  }
  
  .c-circle-menu__item:nth-child(5) {
    -webkit-transition-delay: 0.1s;
            transition-delay: 0.1s;
  }
  
  .c-circle-menu__item:nth-child(6) {
    -webkit-transition-delay: 0s;
            transition-delay: 0s;
  }
  
  /**
   * We're using the .is-active class, which is added to the menu via JavaScript.
   * Once the menu is active, the items inherit the properties below. We will
   * manually write out the transform properties for first and last items, as we
   * already know their position. For all items in between though, we'll use some
   * polar-to-cartesian math and some Sass functions to get the positioning.
   */
  .c-circle-menu.is-active .c-circle-menu__item {
    -webkit-transition-timing-function: cubic-bezier(0.35, 0.03, 0.47, 1.59);
            transition-timing-function: cubic-bezier(0.35, 0.03, 0.47, 1.59);
  }
  
  .c-circle-menu.is-active .c-circle-menu__item:nth-child(1) {
    -webkit-transition-delay: 0s;
            transition-delay: 0s;
  }
  
  @media (min-width: 480px) and (min-height: 480px) {
    .c-circle-menu.is-active .c-circle-menu__item:nth-child(1) {
      -webkit-transform: translate(-250px, 0);
              transform: translate(-250px, 0);
    }
  }
  
  .c-circle-menu.is-active .c-circle-menu__item:nth-child(2) {
    -webkit-transition-delay: 0.1s;
            transition-delay: 0.1s;
  }
  
  @media (min-width: 480px) and (min-height: 480px) {
    .c-circle-menu.is-active .c-circle-menu__item:nth-child(2) {
      -webkit-transform: translate(-240px, -80px);
              transform: translate(-240px, -80px);
    }
  }
  
  .c-circle-menu.is-active .c-circle-menu__item:nth-child(3) {
    -webkit-transition-delay: 0.2s;
            transition-delay: 0.2s;
  }
  
  @media (min-width: 480px) and (min-height: 480px) {
    .c-circle-menu.is-active .c-circle-menu__item:nth-child(3) {
      -webkit-transform: translate(-210px, -155px);
              transform: translate(-210px, -155px);
    }
  }
  
  .c-circle-menu.is-active .c-circle-menu__item:nth-child(4) {
    -webkit-transition-delay: 0.3s;
            transition-delay: 0.3s;
  }
  
  @media (min-width: 480px) and (min-height: 480px) {
    .c-circle-menu.is-active .c-circle-menu__item:nth-child(4) {
      -webkit-transform: translate(-155px, -210px);
              transform: translate(-155px, -210px);
    }
  }
  
  .c-circle-menu.is-active .c-circle-menu__item:nth-child(5) {
    -webkit-transition-delay: 0.4s;
            transition-delay: 0.4s;
  }
  
  @media (min-width: 480px) and (min-height: 480px) {
    .c-circle-menu.is-active .c-circle-menu__item:nth-child(5) {
      -webkit-transform: translate(-85px, -250px);
              transform: translate(-85px, -250px);
    }
  }
  
  
  .c-circle-menu.is-active .c-circle-menu__item:nth-child(6) {
    -webkit-transition-delay: 0.5s;
            transition-delay: 0.5s;
  }
  
  @media (min-width: 480px) and (min-height: 480px) {
    .c-circle-menu.is-active .c-circle-menu__item:nth-child(6) {
      -webkit-transform: translate(0, -260px);
              transform: translate(0, -260px);
    }
  }
  
  /**
   * Apart from the transform properties, we'll also make sure the items get
   * the correct opacity.
   */
  .c-circle-menu.is-active .c-circle-menu__item {
    opacity: 1;
  }
  
  
  /**
   * Let's style the links now. This is just boilerplate stuff, and of course,
   * you'll probably want to change up the icons to match your needs. In any case,
   * we'll do it here for the sake of completion.
   */
  .c-circle-menu__link {
    display: flex;
    width: 100%;
    height: 100%;
    border-radius: 25px;
    justify-content: center;
    align-items: center;
  }

  .c-circle-menu__item a i { color: white; font-size: 1.5rem;}
  
  @media (min-width: 480px) and (min-height: 480px) {
    .c-circle-menu__link {
      border-radius: 50px;
    }
  }
  
  /* .c-circle-menu__link img {
    display: block;
    max-width: 100%;
    height: auto;
  }
   */
  
  
  /* -----------------------------------------------------------------------------
  
    The Toggle Component
  
  ----------------------------------------------------------------------------- */
  
  .c-circle-menu__toggle {
    display: block;
    position: absolute;
    z-index: 100;
    margin: 0;
    padding: 0;
    /* width: 48px;
    height: 48px; */
    background-color: #ff6600;
    font: inherit;
    font-size: 0;
    text-indent: -9999px;
    border-radius: 24px;
    -webkit-transition: background 0.3s;
    transition: background 0.3s;
    /* reset some browser defaults */
    cursor: pointer;
    border: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    box-shadow: none; 
    background-image: url(../Content/Images/btn-pili-ayuda.png);
    background-size: contain;
    background-repeat: none;
  }
  
  @media (min-width: 480px) and (min-height: 480px) {
    .c-circle-menu__toggle {
      width: 70px;
      height: 70px;
      border-radius: 50px;
    }
  }
  
  .c-circle-menu__toggle:hover,
  .c-circle-menu__toggle:focus,
  .c-circle-menu__toggle.is-active {
    outline: none;
    background-color: #c64c09;
    
  }
  
  
  
  .c-circle-menu__toggle span,
  .c-circle-menu__toggle span::before,
  .c-circle-menu__toggle span::after {
    display: block;
    position: absolute;
    transition: all .2s;
  }
  
  @media (min-width: 480px) and (min-height: 480px) {
    .c-circle-menu__toggle span {opacity: 0; }
  
    .c-circle-menu__toggle span,
    .c-circle-menu__toggle span::before,
    .c-circle-menu__toggle span::after {
      height: 6px;
      border-radius: 50px;
      background-color: white;
     
    }
  }
  
  .c-circle-menu__toggle span {
    -webkit-transition: background 0.3s;
    transition: background 0.3s;
    background-color: transparent;
  }
  
  @media (min-width: 480px) and (min-height: 480px) {
    .c-circle-menu__toggle span {
      top: 32px;
      left: 16px;
      right: 16px;
    }
  }
  
  .c-circle-menu__toggle span::before,
  .c-circle-menu__toggle span::after {
    left: 0;
    width: 100%;
    content: "";
    -webkit-transition-duration: 0.3s, 0.3s;
            transition-duration: 0.3s, 0.3s;
    -webkit-transition-delay: 0.3s, 0s;
            transition-delay: 0.3s, 0s;
            
  }
  
  .c-circle-menu__toggle span::before {
    top: -8px;
    -webkit-transition-property: top, -webkit-transform;
    transition-property: top, -webkit-transform;
    transition-property: top, transform;
    transition-property: top, transform, -webkit-transform;
    
  }
  
  @media (min-width: 480px) and (min-height: 480px) {
    .c-circle-menu__toggle span::before {
      top: -16px;
      
    }
  }
  
  .c-circle-menu__toggle span::after {
    
    bottom: -8px;
    -webkit-transition-property: bottom, -webkit-transform;
    transition-property: bottom, -webkit-transform;
    transition-property: bottom, transform;
    transition-property: bottom, transform, -webkit-transform;
  }
  
  @media (min-width: 480px) and (min-height: 480px) {
    .c-circle-menu__toggle span::after {
      bottom: -16px;
      
    }
  }
  
  /* button active state */
  
  .c-circle-menu__toggle.is-active {
    background-image: none;
    
  }
  
  .c-circle-menu__toggle.is-active span {
    background: none; opacity: 1;
  }
  
  .c-circle-menu__toggle.is-active span::before {
    top: 0;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
    -webkit-transition-delay: 0s, 0.3s;
            transition-delay: 0s, 0.3s;
            background-color: white;
            
            
  }
  
  .c-circle-menu__toggle.is-active span::after {
    bottom: 0;
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg);
    -webkit-transition-delay: 0s, 0.3s;
            transition-delay: 0s, 0.3s;
           
  }
  
  /* -----------------------------------------------------------------------------
  
    The Mask Component
  
  ----------------------------------------------------------------------------- */
  
  .c-circle-menu__mask {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
    visibility: hidden;
    opacity: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    -webkit-transition: opacity 0.8s, visibility 0.8s;
    transition: opacity 0.8s, visibility 0.8s;
  }
  
  .c-circle-menu__mask.is-active {
    opacity: 1;
    visibility: visible;
  }
  


  small { line-height: 1rem;}

  .choose-profile .row { background-image: url(../Content/Images/popup/emp/0623-fondo.png); background-position: 20px -40px; background-repeat: no-repeat; padding-bottom: 1.3em; }
  .choose-profile p { padding: 0 1em; font-size: 1.3rem; line-height: 1.2em; margin-bottom: 0;}
  .choose-profile h2 { display: block; text-align: center!important; color:#606060; margin: 1em 1em 0 1em;}
  .choose-profile a img { transition: .3s ease-in-out; transform: scale(.9); }
  .choose-profile a span { transition: .3s ease-in-out; line-height: 1.2em; margin-top: .8em; display: block; 
}

  .choose-profile a:hover span { color:#6d3330!important;}
  .choose-profile a:hover img { transform: scale(1);  }

  .text-info { color: #ff702c; }
  a.text-info:focus, a.text-info:hover { color: #ffb37b; }

  .compatibility {
    display: flex; list-style-type:none; justify-content:space-between; margin:0; padding:0;
  }

  .compatibility li {display:flex;align-items:center;text-align:center;flex-direction:column;}
  .compatibility li i {font-size:1.7em; margin-right:0;}
  .compatibility li span {font-size: .82em;}
  .compatibility li strong {display:block;}

.list-inline-item a i { font-size: 1.8em;}