/*
===================== proyecto =================
*/
/*
===================== Base =====================
*/
/*
===================== Base =====================
*/
/*
===================== font-weight ==============
*/
/*
===================== Mixin ================
*/
.disclaimer {
font-family: Helvetica, sans-serif;
font-size: 12px;
color: #8E8E8E;
letter-spacing: 0;
line-height: 16px;
}
.agf-legal {
font-size: 12px;
font-style: italic;
}
/*
===================== fin Mixin =====================
*/
/*
===================== font-size =====================
*/
/*
===================== fin font-size =====================
*/
/*
===================== mediaqueries =====================
*/
/*
===================== mediaqueries =====================
*/
/*
===================== margenes =====================
*/
.margin-top-0 {
margin-top: 0px !important;
}
.margin-n-top-0 {
margin-top: 0px !important;
}
.margin-left-0 {
margin-left: 0px !important;
}
.margin-n-left-0 {
margin-left: 0px !important;
}
.margin-bottom-0 {
margin-bottom: 0px !important;
}
.margin-n-bottom-0 {
margin-bottom: 0px !important;
}
.margin-right-0 {
margin-right: 0px !important;
}
.margin-n-right-0 {
margin-right: 0px !important;
}
.margin-top-1 {
margin-top: 10px !important;
}
.margin-n-top-1 {
margin-top: -10px !important;
}
.margin-left-1 {
margin-left: 10px !important;
}
.margin-n-left-1 {
margin-left: -10px !important;
}
.margin-bottom-1 {
margin-bottom: 10px !important;
}
.margin-n-bottom-1 {
margin-bottom: -10px !important;
}
.margin-right-1 {
margin-right: 10px !important;
}
.margin-n-right-1 {
margin-right: -10px !important;
}
.margin-top-2 {
margin-top: 20px !important;
}
.margin-n-top-2 {
margin-top: -20px !important;
}
.margin-left-2 {
margin-left: 20px !important;
}
.margin-n-left-2 {
margin-left: -20px !important;
}
.margin-bottom-2 {
margin-bottom: 20px !important;
}
.margin-n-bottom-2 {
margin-bottom: -20px !important;
}
.margin-right-2 {
margin-right: 20px !important;
}
.margin-n-right-2 {
margin-right: -20px !important;
}
.margin-top-3 {
margin-top: 30px !important;
}
.margin-n-top-3 {
margin-top: -30px !important;
}
.margin-left-3 {
margin-left: 30px !important;
}
.margin-n-left-3 {
margin-left: -30px !important;
}
.margin-bottom-3 {
margin-bottom: 30px !important;
}
.margin-n-bottom-3 {
margin-bottom: -30px !important;
}
.margin-right-3 {
margin-right: 30px !important;
}
.margin-n-right-3 {
margin-right: -30px !important;
}
.margin-top-4 {
margin-top: 40px !important;
}
.margin-n-top-4 {
margin-top: -40px !important;
}
.margin-left-4 {
margin-left: 40px !important;
}
.margin-n-left-4 {
margin-left: -40px !important;
}
.margin-bottom-4 {
margin-bottom: 40px !important;
}
.margin-n-bottom-4 {
margin-bottom: -40px !important;
}
.margin-right-4 {
margin-right: 40px !important;
}
.margin-n-right-4 {
margin-right: -40px !important;
}
.margin-top-5 {
margin-top: 50px !important;
}
.margin-n-top-5 {
margin-top: -50px !important;
}
.margin-left-5 {
margin-left: 50px !important;
}
.margin-n-left-5 {
margin-left: -50px !important;
}
.margin-bottom-5 {
margin-bottom: 50px !important;
}
.margin-n-bottom-5 {
margin-bottom: -50px !important;
}
.margin-right-5 {
margin-right: 50px !important;
}
.margin-n-right-5 {
margin-right: -50px !important;
}
.margin-top-6 {
margin-top: 60px !important;
}
.margin-n-top-6 {
margin-top: -60px !important;
}
.margin-left-6 {
margin-left: 60px !important;
}
.margin-n-left-6 {
margin-left: -60px !important;
}
.margin-bottom-6 {
margin-bottom: 60px !important;
}
.margin-n-bottom-6 {
margin-bottom: -60px !important;
}
.margin-right-6 {
margin-right: 60px !important;
}
.margin-n-right-6 {
margin-right: -60px !important;
}
.margin-top-7 {
margin-top: 70px !important;
}
.margin-n-top-7 {
margin-top: -70px !important;
}
.margin-left-7 {
margin-left: 70px !important;
}
.margin-n-left-7 {
margin-left: -70px !important;
}
.margin-bottom-7 {
margin-bottom: 70px !important;
}
.margin-n-bottom-7 {
margin-bottom: -70px !important;
}
.margin-right-7 {
margin-right: 70px !important;
}
.margin-n-right-7 {
margin-right: -70px !important;
}
.margin-top-8 {
margin-top: 80px !important;
}
.margin-n-top-8 {
margin-top: -80px !important;
}
.margin-left-8 {
margin-left: 80px !important;
}
.margin-n-left-8 {
margin-left: -80px !important;
}
.margin-bottom-8 {
margin-bottom: 80px !important;
}
.margin-n-bottom-8 {
margin-bottom: -80px !important;
}
.margin-right-8 {
margin-right: 80px !important;
}
.margin-n-right-8 {
margin-right: -80px !important;
}
.margin-top-9 {
margin-top: 90px !important;
}
.margin-n-top-9 {
margin-top: -90px !important;
}
.margin-left-9 {
margin-left: 90px !important;
}
.margin-n-left-9 {
margin-left: -90px !important;
}
.margin-bottom-9 {
margin-bottom: 90px !important;
}
.margin-n-bottom-9 {
margin-bottom: -90px !important;
}
.margin-right-9 {
margin-right: 90px !important;
}
.margin-n-right-9 {
margin-right: -90px !important;
}
.margin-top-10 {
margin-top: 100px !important;
}
.margin-n-top-10 {
margin-top: -100px !important;
}
.margin-left-10 {
margin-left: 100px !important;
}
.margin-n-left-10 {
margin-left: -100px !important;
}
.margin-bottom-10 {
margin-bottom: 100px !important;
}
.margin-n-bottom-10 {
margin-bottom: -100px !important;
}
.margin-right-10 {
margin-right: 100px !important;
}
.margin-n-right-10 {
margin-right: -100px !important;
}
.margin-top-11 {
margin-top: 110px !important;
}
.margin-n-top-11 {
margin-top: -110px !important;
}
.margin-left-11 {
margin-left: 110px !important;
}
.margin-n-left-11 {
margin-left: -110px !important;
}
.margin-bottom-11 {
margin-bottom: 110px !important;
}
.margin-n-bottom-11 {
margin-bottom: -110px !important;
}
.margin-right-11 {
margin-right: 110px !important;
}
.margin-n-right-11 {
margin-right: -110px !important;
}
.margin-top-12 {
margin-top: 120px !important;
}
.margin-n-top-12 {
margin-top: -120px !important;
}
.margin-left-12 {
margin-left: 120px !important;
}
.margin-n-left-12 {
margin-left: -120px !important;
}
.margin-bottom-12 {
margin-bottom: 120px !important;
}
.margin-n-bottom-12 {
margin-bottom: -120px !important;
}
.margin-right-12 {
margin-right: 120px !important;
}
.margin-n-right-12 {
margin-right: -120px !important;
}
@media (max-width: 768px) {
.margin-sm-top-0 {
margin-top: 0px !important;
}
.margin-sm-n-top-0 {
margin-top: 0px !important;
}
.margin-sm-left-0 {
margin-left: 0px !important;
}
.margin-sm-n-left-0 {
margin-left: 0px !important;
}
.margin-sm-bottom-0 {
margin-bottom: 0px !important;
}
.margin-sm-n-bottom-0 {
margin-bottom: 0px !important;
}
.margin-sm-right-0 {
margin-right: 0px !important;
}
.margin-sm-n-right-0 {
margin-right: 0px !important;
}
.margin-sm-top-1 {
margin-top: 10px !important;
}
.margin-sm-n-top-1 {
margin-top: -10px !important;
}
.margin-sm-left-1 {
margin-left: 10px !important;
}
.margin-sm-n-left-1 {
margin-left: -10px !important;
}
.margin-sm-bottom-1 {
margin-bottom: 10px !important;
}
.margin-sm-n-bottom-1 {
margin-bottom: -10px !important;
}
.margin-sm-right-1 {
margin-right: 10px !important;
}
.margin-sm-n-right-1 {
margin-right: -10px !important;
}
.margin-sm-top-2 {
margin-top: 20px !important;
}
.margin-sm-n-top-2 {
margin-top: -20px !important;
}
.margin-sm-left-2 {
margin-left: 20px !important;
}
.margin-sm-n-left-2 {
margin-left: -20px !important;
}
.margin-sm-bottom-2 {
margin-bottom: 20px !important;
}
.margin-sm-n-bottom-2 {
margin-bottom: -20px !important;
}
.margin-sm-right-2 {
margin-right: 20px !important;
}
.margin-sm-n-right-2 {
margin-right: -20px !important;
}
.margin-sm-top-3 {
margin-top: 30px !important;
}
.margin-sm-n-top-3 {
margin-top: -30px !important;
}
.margin-sm-left-3 {
margin-left: 30px !important;
}
.margin-sm-n-left-3 {
margin-left: -30px !important;
}
.margin-sm-bottom-3 {
margin-bottom: 30px !important;
}
.margin-sm-n-bottom-3 {
margin-bottom: -30px !important;
}
.margin-sm-right-3 {
margin-right: 30px !important;
}
.margin-sm-n-right-3 {
margin-right: -30px !important;
}
.margin-sm-top-4 {
margin-top: 40px !important;
}
.margin-sm-n-top-4 {
margin-top: -40px !important;
}
.margin-sm-left-4 {
margin-left: 40px !important;
}
.margin-sm-n-left-4 {
margin-left: -40px !important;
}
.margin-sm-bottom-4 {
margin-bottom: 40px !important;
}
.margin-sm-n-bottom-4 {
margin-bottom: -40px !important;
}
.margin-sm-right-4 {
margin-right: 40px !important;
}
.margin-sm-n-right-4 {
margin-right: -40px !important;
}
.margin-sm-top-5 {
margin-top: 50px !important;
}
.margin-sm-n-top-5 {
margin-top: -50px !important;
}
.margin-sm-left-5 {
margin-left: 50px !important;
}
.margin-sm-n-left-5 {
margin-left: -50px !important;
}
.margin-sm-bottom-5 {
margin-bottom: 50px !important;
}
.margin-sm-n-bottom-5 {
margin-bottom: -50px !important;
}
.margin-sm-right-5 {
margin-right: 50px !important;
}
.margin-sm-n-right-5 {
margin-right: -50px !important;
}
.margin-sm-top-6 {
margin-top: 60px !important;
}
.margin-sm-n-top-6 {
margin-top: -60px !important;
}
.margin-sm-left-6 {
margin-left: 60px !important;
}
.margin-sm-n-left-6 {
margin-left: -60px !important;
}
.margin-sm-bottom-6 {
margin-bottom: 60px !important;
}
.margin-sm-n-bottom-6 {
margin-bottom: -60px !important;
}
.margin-sm-right-6 {
margin-right: 60px !important;
}
.margin-sm-n-right-6 {
margin-right: -60px !important;
}
.margin-sm-top-7 {
margin-top: 70px !important;
}
.margin-sm-n-top-7 {
margin-top: -70px !important;
}
.margin-sm-left-7 {
margin-left: 70px !important;
}
.margin-sm-n-left-7 {
margin-left: -70px !important;
}
.margin-sm-bottom-7 {
margin-bottom: 70px !important;
}
.margin-sm-n-bottom-7 {
margin-bottom: -70px !important;
}
.margin-sm-right-7 {
margin-right: 70px !important;
}
.margin-sm-n-right-7 {
margin-right: -70px !important;
}
.margin-sm-top-8 {
margin-top: 80px !important;
}
.margin-sm-n-top-8 {
margin-top: -80px !important;
}
.margin-sm-left-8 {
margin-left: 80px !important;
}
.margin-sm-n-left-8 {
margin-left: -80px !important;
}
.margin-sm-bottom-8 {
margin-bottom: 80px !important;
}
.margin-sm-n-bottom-8 {
margin-bottom: -80px !important;
}
.margin-sm-right-8 {
margin-right: 80px !important;
}
.margin-sm-n-right-8 {
margin-right: -80px !important;
}
.margin-sm-top-9 {
margin-top: 90px !important;
}
.margin-sm-n-top-9 {
margin-top: -90px !important;
}
.margin-sm-left-9 {
margin-left: 90px !important;
}
.margin-sm-n-left-9 {
margin-left: -90px !important;
}
.margin-sm-bottom-9 {
margin-bottom: 90px !important;
}
.margin-sm-n-bottom-9 {
margin-bottom: -90px !important;
}
.margin-sm-right-9 {
margin-right: 90px !important;
}
.margin-sm-n-right-9 {
margin-right: -90px !important;
}
.margin-sm-top-10 {
margin-top: 100px !important;
}
.margin-sm-n-top-10 {
margin-top: -100px !important;
}
.margin-sm-left-10 {
margin-left: 100px !important;
}
.margin-sm-n-left-10 {
margin-left: -100px !important;
}
.margin-sm-bottom-10 {
margin-bottom: 100px !important;
}
.margin-sm-n-bottom-10 {
margin-bottom: -100px !important;
}
.margin-sm-right-10 {
margin-right: 100px !important;
}
.margin-sm-n-right-10 {
margin-right: -100px !important;
}
.margin-sm-top-11 {
margin-top: 110px !important;
}
.margin-sm-n-top-11 {
margin-top: -110px !important;
}
.margin-sm-left-11 {
margin-left: 110px !important;
}
.margin-sm-n-left-11 {
margin-left: -110px !important;
}
.margin-sm-bottom-11 {
margin-bottom: 110px !important;
}
.margin-sm-n-bottom-11 {
margin-bottom: -110px !important;
}
.margin-sm-right-11 {
margin-right: 110px !important;
}
.margin-sm-n-right-11 {
margin-right: -110px !important;
}
.margin-sm-top-12 {
margin-top: 120px !important;
}
.margin-sm-n-top-12 {
margin-top: -120px !important;
}
.margin-sm-left-12 {
margin-left: 120px !important;
}
.margin-sm-n-left-12 {
margin-left: -120px !important;
}
.margin-sm-bottom-12 {
margin-bottom: 120px !important;
}
.margin-sm-n-bottom-12 {
margin-bottom: -120px !important;
}
.margin-sm-right-12 {
margin-right: 120px !important;
}
.margin-sm-n-right-12 {
margin-right: -120px !important;
}
}
/*
===================== fin margenes =====================
*/
/*
===================== width for flex =====================
*/
.w-20 {
-webkit-box-flex: 0;
-ms-flex: 0 0 20% !important;
flex: 0 0 20% !important;
max-width: 20%;
}
@media (max-width: 768px) {
.w-sm-100 {
-webkit-box-flex: 0;
-ms-flex: 0 0 100% !important;
flex: 0 0 100% !important;
max-width: 100%;
}
}
/*
===================== fin width for flex =====================
*/
@media (min-width: 1200px) {
.container {
max-width: 1312px !important;
}
}
.h-100 {
height: 100%;
}
.bg-gray-light {
background-color: #F7F7F7;
}
.com_title {
padding: 2.5rem 0;
margin: 0;
}
.com_title h1 {
font-size: 2rem;
font-weight: 500;
}
* {
padding: 0;
margin: 0;
outline: none !important;
box-sizing: border-box;
}
li {
list-style: none;
}
fieldset {
border: 0;
}
/*fonts family*/
/*
===================== Colores =================
*/
/*
===================== background =============
*/
.com_bg {
/*
&-white {
background-color: $color-white;
}
&-success {
background-color: $color-success;
}
&-grey-20 {
background-color: $color-grey-20;
}
&-grey-30 {
background-color: $color-grey-30;
}
&-grey-40 {
background-color: $color-grey-40;
}
&-grey-50 {
background-color: $color-grey-50;
}
&-grey-60 {
background-color: $color-grey-60;
}
&-grey-70 {
background-color: $color-grey-70;
}*/
}
.com_bg-base {
background-color: #FFFFFF;
}
.com_bg-primary {
background-color: #002FA7 !important;
}
.com_bg-grey-10 {
background-color: #fcfcfc;
}
.com_bg-grey-45 {
background-color: #E6E6E6;
}
.com_bg-grey-presencia {
background-color: #F6F6F6;
}
.com_bg-secondary {
background-color: #00AEEF;
}
.com_bg-blue {
background-color: #112132;
}
.com_bg-blue-capacidades {
background-color: #00AEEF;
}
.com_bg-light-grey {
background-color: #F1F1F2;
}
.com_bg-white {
background-color: #ffffff;
}
.com_color-text {
color: #6E6E6E !important;
}
.com_color-base {
color: #FFFFFF !important;
}
.com_color-primary {
color: #002FA7 !important;
}
.com_color-secondary {
color: #00AEEF !important;
}
.com_color-white {
color: #ffffff !important;
}
.com_color-blue {
color: #002FA7 !important;
}
.com_color-grey-30 {
color: #D8D8D8;
}
.com_color-grey-disclaimer {
color: #8E8E8E;
}
.com_color-secondary {
color: #00AEEF;
}
.com_color-black {
color: #000000;
}
.com_color-grey-70 {
color: #F3F0ED;
}
.com_color-grey-60 {
color: #434040;
}
.com_color-grey-50 {
color: #4E4E4E;
}
.com_color-grey-40 {
color: #E5E5E5;
}
/*
===================== Base =====================
*/
html {
height: 100%;
}
body {
color: #6E6E6E;
background-color: #ffffff;
font-weight: normal;
position: relative;
width: 100%;
overflow-x: hidden;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.005);
text-rendering: optimizeLegibility !important;
-webkit-font-smoothing: antialiased !important;
line-height: 160%;
overscroll-behavior: contain;
transition: left 500ms linear;
left: 0;
font-family: "Roboto";
font-size: 16px;
}
body.show-menu {
transition: left 500ms linear;
left: -610px;
overflow: hidden;
}
@media (max-width: 768px) {
body.show-menu {
left: -95vw;
}
}
body.show-menu main:before,
body.show-menu .com_com:before {
top: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.6);
width: 100%;
height: 100%;
z-index: 100;
position: fixed;
content: "";
}
/*
===================== Heading =====================
*/
h1,
.com_h1,
h2,
.com_h2 {
margin-bottom: 20px;
line-height: 120%;
font-family: "Roboto Condensed";
font-weight: 400;
color: #000000;
}
@media (max-width: 560px) {
h1,
.com_h1,
h2,
.com_h2 {
margin-bottom: 15px;
}
}
h3,
.com_h3,
h4,
.com_h4,
h5,
.com_h5,
h6,
.com_h6 {
color: #000000;
margin-bottom: 20px;
line-height: 140%;
font-family: "Roboto";
font-weight: 400;
}
@media (max-width: 560px) {
h3,
.com_h3,
h4,
.com_h4,
h5,
.com_h5,
h6,
.com_h6 {
margin-bottom: 15px;
}
}
h1 {
font-size: 44px;
font-weight: 500;
}
.com_h1 {
font-size: 44px !important;
}
h2 {
font-size: 32px;
margin-bottom: 15px;
font-weight: 500;
}
.com_h2 {
font-size: 32px !important;
margin-bottom: 30px;
}
h3 {
font-size: 28px;
font-weight: 500;
}
.com_h3 {
font-size: 28px !important;
}
h4 {
font-size: 22px;
}
.com_h4 {
font-size: 22px !important;
}
h5 {
font-size: 18px;
}
.com_h5 {
font-size: 18px !important;
}
h6 {
font-size: 16px;
margin-bottom: 10px;
}
.com_h6 {
font-size: 16px !important;
margin-bottom: 10px;
}
.com-light, .modal-body h5, .com_close, .com .com_tabla-ficha table tfoot td {
font-weight: 300;
}
.com-regular {
font-weight: 400;
}
.com-strong, footer h6, .com .com_tabla-ficha table tr td p span {
font-weight: 500;
}
.com-medium, .com_rcrumbs .com_breadcrums li a {
font-weight: 500;
}
strong {
font-weight: 700;
}
a {
color: #002FA7;
text-decoration: none;
}
hr {
margin: 20px 0;
border-bottom: 1px solid #F3F0ED;
border-top: none;
border-left: none;
border-right: none;
}
.com_small {
font-size: 12px !important;
line-height: 150%;
}
p {
margin-bottom: 20px;
}
p.xl {
font-size: 18px;
line-height: 180%;
}
img {
display: block;
}
blockquote {
position: relative;
padding-left: 35px;
margin: 30px 0 45px;
}
blockquote:before {
content: "";
position: absolute;
left: 0;
top: 0;
background-color: #002FA7;
width: 4px;
height: 100%;
}
blockquote h3,
blockquote h4,
blockquote h5 {
margin-bottom: 0 !important;
font-weight: 300;
font-family: "Roboto";
}
blockquote h4 {
line-height: 155%;
}
blockquote p {
font-size: 18px;
line-height: 160%;
margin-bottom: 0;
}
blockquote p + p {
margin-top: 20px;
}
@media (max-width: 768px) {
blockquote {
padding-left: 25px;
}
blockquote:before {
width: 5px;
}
blockquote h4 {
font-size: 16px !important;
}
blockquote p {
font-size: 16px;
}
}
/*
===================== Helpers =====================
*/
.com_grey-bg {
padding-top: 8rem;
background-color: #FFFFFF;
}
.com_grey-bg #counter > div:not(:last-child)::after {
content: "";
display: block;
position: absolute;
top: -30px;
right: 0;
height: 120%;
width: 0;
border-right: 1px solid #00AEEF;
}
.com_grey-blue {
background: #FFFFFF;
position: relative;
}
.com_grey-blue h3 {
text-align: left;
}
.com_grey-blue .com_text-link {
color: #6E6E6E;
}
.com_grey-blue .com_text-link::before {
background-color: #6E6E6E;
}
.com_grey-blue .com_text-link:hover {
color: #00AEEF;
}
.com_grey-blue .com_text-link:hover::before {
background-color: #00AEEF;
}
.com_grey-blue .container {
position: relative;
z-index: 2;
}
@media (min-width: 768px) {
.com_grey-blue {
background: #002FA7;
}
.com_grey-blue::after {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #FFFFFF;
clip-path: ellipse(100% 200% at -52% 50%);
}
.com_grey-blue p {
color: #fff;
padding-left: 2rem;
}
}
.com_uppercase {
text-transform: uppercase;
}
.com_img-fluid {
max-width: 100%;
}
.com_to-the-right {
float: right;
}
.com_to-the-left {
float: left;
}
.com_align-v--center {
align-items: center;
}
.com_align-h--center {
justify-content: center;
}
.com_align-h--justify {
justify-content: space-between;
}
.com_align--center-element {
margin: 0 auto 5px;
}
.com_align--center-element-absolute {
position: absolute;
top: 50%;
width: 100%;
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
left: 50%;
}
.com_align--box-center {
align-items: center;
justify-content: center;
flex-direction: column;
text-align: center;
}
.com_align--box-middle {
display: flex;
flex-direction: column;
align-items: self-start;
justify-content: center;
}
@media screen and (min-width: 0\0 ) {
.com_align--box-middle {
display: block;
}
}
@media (max-width: 768px) {
.com_align-v--center.com_align-h--justify {
flex-direction: column;
}
.com_align-v--center.com_align-h--justify a {
align-self: flex-end;
}
}
.com_text--grey {
color: #6E6E6E;
}
.com_text--center {
text-align: center !important;
}
.com_text--left {
text-align: left;
}
.com_text--right {
text-align: right;
}
.com_text--justify {
text-align: justify;
}
.com_text--small {
font-size: 14px;
}
.com_text--big {
font-size: 24px;
line-height: 56px;
}
@media (max-width: 768px) {
.com_text--big {
font-size: 20px;
line-height: 35px;
}
}
.com_display--block {
display: block !important;
}
.com_display--inline {
display: inline-block !important;
}
.com_display--flex {
display: flex;
}
.com_relative {
position: relative;
}
.com_absolute {
position: absolute;
}
.com_full {
width: 100% !important;
}
.com_elastic-img {
width: 100% !important;
}
.com_reset-img {
width: auto !important;
}
.com_box {
/*
&-zoomIn {
display: block;
background-color: $color-white;
@extend .com_box-shadow;
margin-bottom: $margen * 2;
.com_noticias__img {
overflow: hidden;
@media (min-width: $screen-md-min) {
height: 200px;
}
img {
transition: all 500ms ease;
transform: scale(1);
}
}
&:hover {
.com_noticias__img {
img {
transform: scale(1.1);
}
}
}
}*/
}
.com_box--grey {
padding: 30px;
background-color: #F3F0ED;
}
.com_box--slim {
padding: 15px !important;
}
.com_box--int {
padding: 30px;
}
@media (max-width: 768px) {
.com_box--int {
padding: 25px 20px;
}
}
@media (max-width: 560px) {
.com_box--int {
padding: 20px;
}
}
.com_box--white {
background-color: #ffffff;
padding: 30px;
}
.com_box--border {
border: 1px solid #E5E5E5;
}
.com_box--border .com_mod-icons {
padding: 30px 12px 10px;
}
.com_inner {
padding: 50px 0;
}
@media (max-width: 560px) {
.com_inner {
padding: 20px 0 60px;
}
}
.com_inner-2 {
padding: 20px 0;
}
.com_inner-3 {
padding: 30px 0;
}
@media (max-width: 768px) {
.com_inner-3 {
padding: 20px 0;
}
}
.com_inner-4 {
padding: 40px 0 !important;
}
@media (max-width: 768px) {
.com_inner-4 {
padding: 30px 0 !important;
}
}
.com_inner-5 {
padding: 50px 0;
}
@media (max-width: 768px) {
.com_inner-5 {
padding: 30px 0;
}
}
.com_inner-6 {
padding: 50px 0;
}
@media (max-width: 768px) {
.com_inner-6 {
padding: 30px 0;
}
}
.com_inner-7 {
padding: 70px 0;
}
@media (max-width: 768px) {
.com_inner-7 {
padding: 40px 0;
}
}
.com_inner-8 {
padding: 80px 0 100px;
}
@media (max-width: 768px) {
.com_inner-8 {
padding: 40px 0;
}
}
.com_inner-9 {
padding: 90px 0;
}
@media (max-width: 768px) {
.com_inner-9 {
padding: 40px 0;
}
}
.com_inner-10 {
padding: 100px 0;
}
@media (max-width: 768px) {
.com_inner-10 {
padding: 40px 0;
}
}
.com_clear-input, .com_form-item textarea, .com_form-item input, .com_form-item .amcharts-range-selector-from-input {
-webkit-border-radius: 0;
border-radius: 0;
-webkit-box-shadow: none;
box-shadow: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
.com_text-overflow {
overflow: hidden;
text-overflow: ellipsis;
width: 100%;
}
.com_text_spacing {
font-weight: 700;
}
.com_text_center {
text-align: center;
}
.com_reset-margin {
margin: 0 !important;
}
@media (min-width: 560px) {
.com_reset-padding-l {
padding-left: 0 !important;
}
}
.com_wrapper {
margin: 50px 0;
}
@media (max-width: 992px) {
.com_wrapper {
margin: 30px 0;
}
}
.com_border {
border: 1px solid #D8D8D8;
}
.com_border-none {
border: none !important;
}
.com_border-bottom {
margin: 10px 0 0;
border-bottom: 1px solid #F3F0ED;
}
.com_border-top {
border-top: 1px solid #F3F0ED;
}
@media (min-width: 768px) {
.com_border-lateral {
padding-left: 30px;
border-left: 1px solid #E5E5E5;
}
}
.com_overlay {
overflow: hidden;
}
.com_overlay:before {
top: 80px;
left: 0;
background-color: rgba(0, 0, 0, 0.6);
width: 100%;
height: 100%;
z-index: 100;
position: fixed;
content: "";
}
.com_fixed {
position: fixed;
}
.com_hidden {
display: none !important;
}
@media (max-width: 992px) {
.com_hidden--mobile-large {
display: none !important;
}
}
@media (max-width: 767px) {
.com_hidden--mobile {
display: none !important;
}
}
.com_clearfix:after {
content: "";
clear: both;
display: table;
}
.com_img-circle {
border-radius: 50%;
-o-border-radius: 50%;
-ms-border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
}
.com_equal-height {
height: 100%;
}
.com_img-icon-container {
height: 50px;
}
.com_img-icon-container > img {
max-height: 100%;
max-width: 50px;
}
.com_align-center {
display: flex;
align-items: center;
}
.com_margin-bottom--6 {
margin-bottom: 60px;
}
.com_margin-bottom--4 {
margin-bottom: 40px;
}
.com_margin-bottom--3 {
margin-bottom: 30px;
}
.com_padding-right--3 {
padding-right: 30px;
}
.com_padding--3 {
padding: 30px !important;
}
.com_list--large {
font-size: 21px;
line-height: 24px;
}
.com_opacity--80 {
opacity: 0.8;
}
@media (max-width: 768px) {
.margin-bottom-5 {
margin-bottom: 30px !important;
}
.margin-bottom-6 {
margin-bottom: 30px !important;
}
.margin-bottom-7 {
margin-bottom: 40px !important;
}
.margin-bottom-10 {
margin-bottom: 50px !important;
}
}
.com_flex-section {
display: flex;
justify-content: space-between;
gap: 20px;
}
@media (max-width: 768px) {
.com_flex-section {
display: block !important;
}
}
.com_flex-section > div {
width: 100%;
}
.com_flex-center {
display: flex;
align-items: center;
flex-direction: column;
}
.com_box-grey {
background-color: #ffffff;
height: 100%;
box-shadow: 0px 2px 4px rgba(51, 51, 51, 0.2);
border-radius: 2px;
}
.com_font-primary {
font-family: "Roboto";
}
.com_font-secondary {
font-family: "Roboto Condensed" !important;
}
.com_bold {
font-weight: 700;
}
.com_fw-500 {
font-weight: 500;
}
.com_disclaimer {
font-size: 12px;
}
.padding-top-0 {
padding-top: 0;
}
.text-left {
text-align: left !important;
}
.archive h1 {
color: #00AEEF;
font-size: 2rem;
}
.com_agf--content h3 {
font-size: 24px;
color: #00AEEF !important;
}
/*fin*/
.iframe-descarga {
border: 0;
width: 100%;
height: 350px;
}
.videoWrapper {
position: relative;
padding-bottom: 56.25%;
padding-top: 25px;
height: 0;
display: none;
}
.videoWrapper video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/*
===================== alert =====================
*/
.com_alert {
position: relative;
opacity: 1;
clear: both;
padding: 0;
border: 0;
color: #ffffff;
margin-bottom: 10px;
animation-duration: 500ms;
animation-fill-mode: both;
margin-bottom: 1rem;
border: 1px solid transparent;
/* =====================
Tipos de notificacion
======================== */
}
.com_alert--fixed {
position: fixed;
top: 0;
left: 0;
z-index: 160;
width: 100%;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}
.com_alert__inner {
position: relative;
padding: 20px 60px;
line-height: inherit;
border: 1px solid transparent;
border-radius: 3px;
-o-border-radius: 3px;
-ms-border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}
.com_alert__inner h6 {
margin-bottom: 5px;
}
.com_alert__inner p {
font-size: 13px;
margin: 0;
line-height: 140%;
}
.com_alert__close {
transition: all 300ms ease;
position: absolute;
right: 15px;
top: 50%;
margin-top: -6px;
width: 12px;
height: 12px;
transform-origin: center;
border-radius: 50%;
-o-border-radius: 50%;
-ms-border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
}
.com_alert__close:before, .com_alert__close:after {
position: absolute;
left: 50%;
top: 50%;
content: " ";
height: 16px;
width: 2px;
margin-top: -8px;
margin-left: -1px;
background-color: #ffffff;
}
.com_alert__close:before {
transform: rotate(45deg);
}
.com_alert__close:after {
transform: rotate(-45deg);
}
.com_alert__close:hover {
transform: rotate(180deg);
}
.com_alert.com--danger {
border: 1px solid rgba(114, 28, 36, 0.1);
background-color: #f3cdd1;
color: #721C24;
}
.com_alert.com--danger .com_alert__close:before, .com_alert.com--danger .com_alert__close:after {
background-color: #721C24;
}
.com_alert.com--success {
border: 1px solid rgba(21, 87, 36, 0.1);
background-color: #b2ecbf;
color: #155724;
}
.com_alert.com--success .com_alert__close:before, .com_alert.com--success .com_alert__close:after {
background-color: #155724;
}
.com_alert.com--info {
border: 1px solid rgba(1, 70, 147, 0.1);
background-color: #c7e1ff;
color: #014693;
}
.com_alert.com--info .com_alert__close:before, .com_alert.com--info .com_alert__close:after {
background-color: #014693;
}
.com_alert.com--warning {
border: 1px solid rgba(255, 234, 134, 0.1);
background-color: #fff3b9;
color: #534500;
}
.com_alert.com--warning .com_alert__close:before, .com_alert.com--warning .com_alert__close:after {
background-color: #FFEA86;
}
@media (max-width: 560px) {
.com_alert .com_alert__inner {
padding: 20px 40px 20px 30px;
}
}
@media (max-width: 560px) {
.com_alert .com_alert__inner {
padding: 15px 35px 15px 20px;
}
}
/*
===================== Listas =====================
*/
ul {
margin-top: 20px;
}
ul li {
line-height: 130%;
}
ul + ul {
margin-top: 20px;
}
.com_list li {
margin-bottom: 25px;
}
.com_list-dots {
margin-bottom: 20px;
}
.com_list-dots li {
display: block;
list-style: none;
margin-bottom: 20px;
position: relative;
font-size: 16px;
padding-left: 23px;
line-height: 140%;
}
.com_list-dots li:before {
content: "";
border-radius: 50%;
-o-border-radius: 50%;
-ms-border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
width: 10px;
height: 10px;
display: inline-block;
background-color: #002FA7;
position: absolute;
left: 0;
top: 10px;
margin-top: -5px;
}
.com_list-dots li:last-child {
margin-bottom: 0;
}
.com_list-dots li a:hover {
text-decoration: underline;
}
.com_list-square {
margin-bottom: 20px;
}
.com_list-square li {
display: block;
list-style: none;
margin-bottom: 20px;
position: relative;
font-size: 16px;
padding-left: 23px;
line-height: 140%;
}
.com_list-square li:before {
content: "";
width: 4px;
height: 4px;
display: inline-block;
background-color: #002FA7;
position: absolute;
left: 0;
top: 10px;
margin-top: -2px;
}
.com_list-square li:last-child {
margin-bottom: 0;
}
.com_list-square li a:hover {
text-decoration: underline;
}
.com_list-inline li {
display: inline-block;
}
.com_list-inline li + li {
margin-left: 10px;
padding-left: 10px;
border-left: 1px solid;
}
.com_list-check li {
position: relative;
padding-left: 25px;
margin-bottom: 15px;
}
.com_list-check li:before {
position: absolute;
top: 4px;
left: 4px;
z-index: 10;
content: "";
width: 8px;
height: 5px;
border-left: 1.6px solid #ffffff;
border-bottom: 1.5px solid #ffffff;
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.com_list-check li:after {
position: absolute;
top: 0;
left: 0;
border-radius: 50%;
content: "";
width: 16px;
height: 16px;
background-color: #002FA7;
}
ol {
margin-top: 20px;
margin-bottom: 25px;
list-style: none;
counter-reset: my-awesome-counter;
}
ol li {
position: relative;
counter-increment: my-awesome-counter;
padding-left: 20px;
margin-bottom: 8px;
line-height: 160%;
font-size: 16px;
}
ol li:before {
position: absolute;
left: 0;
content: counter(my-awesome-counter) ". ";
color: #002FA7;
font-weight: bold;
}
ol + ol {
margin-top: 20px;
}
ul + ol,
ol + ul {
margin-top: 30px;
}
.com_count-list-wrapper {
padding-top: 40px;
padding-bottom: 40px;
}
.com_count-list {
counter-reset: count-list;
}
.com_count-list-item {
padding: 0 5px;
}
.com_count-list-item::before {
counter-increment: count-list;
content: counter(count-list, decimal-leading-zero) ".";
font-size: 1.5rem;
color: #002FA7;
text-align: left;
display: block;
font-family: "Roboto Condensed";
margin-bottom: 1rem;
}
.com_modal .modal-body ul,
.com_wysi-content ul {
margin-bottom: 20px;
}
.com_modal .modal-body ul li,
.com_wysi-content ul li {
display: block;
list-style: none;
margin-bottom: 20px;
position: relative;
font-size: 16px;
padding-left: 23px;
line-height: 140%;
}
.com_modal .modal-body ul li:before,
.com_wysi-content ul li:before {
content: "";
width: 4px;
height: 4px;
display: inline-block;
background-color: #002FA7;
position: absolute;
left: 0;
top: 10px;
margin-top: -2px;
}
.com_modal .modal-body ul li:last-child,
.com_wysi-content ul li:last-child {
margin-bottom: 0;
}
.com_modal .modal-body ul li a:hover,
.com_wysi-content ul li a:hover {
text-decoration: underline;
}
ul.list-unstyled {
margin: 0 !important;
}
ul.list-unstyled li::before {
content: unset !important;
}
/*
===================== Botones =====================
*/
.com_btn {
transition: background-color 500ms ease;
display: inline-block;
padding: 13px 13px;
text-align: center;
cursor: pointer;
text-decoration: none !important;
position: relative;
vertical-align: middle;
appearance: none;
line-height: 125%;
font-size: 14px;
width: initial;
height: auto;
min-height: 44px;
border: none;
overflow: hidden;
min-width: 100px;
font-family: "Roboto";
}
.com_btn--primary {
color: #ffffff;
font-weight: bold;
border: 1px solid #002FA7;
background-color: #002FA7;
transform: translateZ(0px);
}
.com_btn--primary:hover {
transition: all 500ms ease;
background-color: #ffffff;
color: #002FA7;
}
.com_btn--secondary {
color: #ffffff;
font-weight: bold;
border: 1px solid #00AEEF;
background-color: #00AEEF;
transform: translateZ(0px);
}
.com_btn--secondary:hover {
transition: all 500ms ease;
background-color: #002FA7;
border-color: #002FA7;
}
.com_btn--outline-primary {
color: #000000;
font-weight: bold;
border: 1px solid #00AEEF;
background-color: #ffffff;
transform: translateZ(0px);
}
.com_btn--outline-primary:hover {
transition: all 500ms ease;
border-color: #000000;
background-color: #000000;
color: #ffffff;
}
.com_btn--outline-primary-link {
color: #002FA7;
font-weight: bold;
border: 1px solid #002FA7;
background-color: #ffffff;
transform: translateZ(0px);
}
.com_btn--outline-primary-link:hover {
transition: all 500ms ease;
}
.com_btn--outline-secondary {
color: #000000;
font-weight: bold;
border: 1px solid #00AEEF;
background-color: #ffffff;
transform: translateZ(0px);
}
.com_btn--outline-secondary:hover {
transition: all 500ms ease;
background-color: #000000;
color: #ffffff;
}
.com_btn--secondary-white {
display: inline-flex;
align-items: center;
font-weight: bold;
color: #00AEEF;
border: 1px solid #00AEEF;
background-color: #ffffff;
transform: translateZ(0px);
font-size: 14px;
min-height: unset;
}
.com_btn--secondary-white:hover {
transition: all 500ms ease;
background-color: #00AEEF !important;
color: #ffffff !important;
}
.com_btn--secondary-white:hover i::before {
filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(75deg) brightness(122%) contrast(102%);
}
.com_btn--white {
display: inline-flex;
align-items: center;
font-weight: bold;
color: #000000;
border: 1px solid #ffffff;
background-color: #ffffff;
transform: translateZ(0px);
font-size: 14px;
min-height: unset;
}
.com_btn--white:hover {
transition: all 500ms ease;
border-color: #00AEEF;
}
.com_btn--white:hover i::before {
filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(75deg) brightness(122%) contrast(102%);
}
.com_btn--outline-white {
display: inline-flex;
align-items: center;
color: #ffffff;
border: 1px solid #ffffff;
background-color: transparent;
transform: translateZ(0px);
padding: 0.5rem 1rem;
font-size: 14px;
min-height: unset;
}
.com_btn--outline-white:hover {
transition: all 500ms ease;
background-color: #00AEEF !important;
color: #ffffff !important;
}
.com_btn--outline-white:hover i::before {
filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(75deg) brightness(122%) contrast(102%);
}
.com_btn--filter {
color: #00AEEF;
border: 1px solid #00AEEF;
background-color: #ffffff;
transform: translateZ(0px);
border-radius: 50px;
}
.com_btn--filter.active, .com_btn--filter:hover {
transition: all 500ms ease;
background-color: #00AEEF !important;
color: #ffffff !important;
}
.com_btn + .com_btn {
margin-left: 15px;
}
.com_btn.com_full {
min-width: auto;
}
@media (max-width: 560px) {
.com_btn {
float: left;
}
}
.com_btn--back-button i {
display: inline-block;
margin-right: 5px;
}
.com_btn--back-button i:before {
font-size: 8px;
display: block;
transform: rotate(180deg);
}
.com_text-link {
position: relative;
color: #002FA7;
display: inline-block !important;
font-family: "Roboto";
line-height: 140%;
}
.com_text-link:before {
content: "";
width: 22px;
height: 1px;
display: inline-block;
transition: width 500ms ease;
position: absolute;
font-family: "Roboto";
bottom: -5px;
left: 0;
background-color: #002FA7;
z-index: 10;
}
.com_text-link--center:before {
left: 50%;
transform: translateX(-50%);
}
.com_text-link:hover:before {
transition: width 400ms ease;
width: 100%;
}
.com_text-link.hover-center:before {
left: 50%;
transform: translateX(-50%);
}
.com_cerrar {
background-color: #002FA7;
width: 50px;
height: 50px;
position: relative;
float: right;
}
.com_cerrar i {
position: absolute;
top: 50%;
left: 50%;
width: 18px;
height: 18px;
transform: translate(-50%, -50%);
}
.com_cerrar i::before, .com_cerrar i:after {
height: 2px;
color: #4E4E4E;
}
.com_button-group {
display: flex;
margin: 30px 0 20px;
justify-content: space-between;
align-items: center;
}
@media (max-width: 560px) {
.com_button-group {
flex-direction: column;
}
.com_button-group .com_btn + .com_btn,
.com_button-group .com_btn + .com_text-link--arrow {
margin: 20px 0 0;
}
}
/*
===================== Form =====================
*/
.com {
/*
==============================================
custom radio
==============================================
*/
}
.com_form-item {
margin-bottom: 10px;
position: relative;
padding-top: 15px;
/*file input*/
}
.com_form-item > p {
margin-bottom: 0;
}
.com_form-item label {
transition: all 400ms cubic-bezier(0.5, 0.82, 0.165, 1);
display: inline-block;
position: absolute;
left: 6px;
top: 28px;
pointer-events: none;
padding: 0 10px !important;
width: auto !important;
z-index: 5;
}
.com_form-item label.active {
top: 8px;
left: 10px;
width: auto;
font-size: 13px;
line-height: 130%;
padding: 0 5px !important;
background-color: #ffffff;
}
@media (max-width: 768px) {
.com_form-item label {
padding: 0 8px;
}
}
.com_form-item input, .com_form-item .amcharts-range-selector-from-input {
border: 1px solid #d3d3d3;
height: 38px;
}
.com_form-item input.active, .com_form-item .amcharts-range-selector-from-input.active {
border: 1px solid #002FA7;
}
.com_form-item input:focus, .com_form-item .amcharts-range-selector-from-input:focus {
border: 1px solid #002FA7;
}
.com_form-item input[type=email]:focus:invalid, .com_form-item .amcharts-range-selector-from-input[type=email]:focus:invalid {
/*border: 1px solid $color-error;
color: $color-error;
background-color: transparentize($color-error, 0.8);
box-shadow: none;*/
}
.com_form-item input,
.com_form-item select {
transition: all 400ms cubic-bezier(0.5, 0.82, 0.165, 1);
height: 50px;
font-family: "Roboto";
font-size: 16px;
width: 100%;
box-shadow: none;
padding: 10px 15px;
-webkit-appearance: none;
color: #6E6E6E;
}
.com_form-item input.placeholder,
.com_form-item select.placeholder {
color: #6E6E6E;
font-style: normal;
}
.com_form-item input:-moz-placeholder,
.com_form-item select:-moz-placeholder {
color: #6E6E6E;
font-style: normal;
}
.com_form-item input::-moz-placeholder,
.com_form-item select::-moz-placeholder {
color: #6E6E6E;
font-style: normal;
}
.com_form-item input:-ms-input-placeholder,
.com_form-item select:-ms-input-placeholder {
color: #6E6E6E;
font-style: normal;
}
.com_form-item input::-webkit-input-placeholder,
.com_form-item select::-webkit-input-placeholder {
color: #6E6E6E;
font-style: normal;
}
.com_form-item input::-ms-clear,
.com_form-item select::-ms-clear {
display: none;
}
.com_form-item input[disabled],
.com_form-item select[disabled] {
pointer-events: none;
color: #ffffff;
background-color: #FAFAFB;
cursor: not-allowed;
}
.com_form-item input[type=number] {
-moz-appearance: textfield;
}
.com_form-item input[type=number]::-webkit-inner-spin-button, .com_form-item input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
.com_form-item textarea {
font-family: "Roboto";
transition: border 500ms ease;
border: 1px solid #d3d3d3;
padding: 15px;
width: 100%;
resize: none;
height: 204px;
font-size: 16px;
color: #6E6E6E;
}
.com_form-item textarea.placeholder {
color: #6E6E6E;
font-style: normal;
}
.com_form-item textarea:-moz-placeholder {
color: #6E6E6E;
font-style: normal;
}
.com_form-item textarea::-moz-placeholder {
color: #6E6E6E;
font-style: normal;
}
.com_form-item textarea:-ms-input-placeholder {
color: #6E6E6E;
font-style: normal;
}
.com_form-item textarea::-webkit-input-placeholder {
color: #6E6E6E;
font-style: normal;
}
.com_form-item textarea:focus {
border: 1px solid #002FA7;
}
.com_form-item--error .com_select,
.com_form-item--error input,
.com_form-item--error input.active {
/*border: 1px solid $color-error;
color: $color-error;*/
}
.com_form-item--error .com_select:focus,
.com_form-item--error input:focus,
.com_form-item--error input.active:focus {
background-color: #ffffff;
}
.com_form-item--error select:focus {
background-color: #ffffff;
}
.com_form-item .com_text {
position: absolute;
left: 6px;
top: 101%;
font-size: 11px;
}
.com_form-item .com_text-error {
position: absolute;
width: 100%;
font-size: 12px;
left: 0;
top: 105%;
text-align: left;
line-height: 120%;
}
.com_form-item .fileinput-wrapper {
position: relative;
display: block;
border: 1px solid #d3d3d3;
height: 50px;
background-color: #ffffff;
}
.com_form-item .fileinput-wrapper .fileinput {
overflow: hidden;
position: relative;
cursor: pointer;
z-index: 1;
color: #002FA7;
background-color: #ffffff;
position: absolute;
right: 0;
height: 50px;
line-height: 22px;
margin-top: -1px;
border: 1px solid #002FA7;
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
padding: 13px;
}
.com_form-item .fileinput-wrapper .fileinput input[type=file],
.com_form-item .fileinput-wrapper .fileinput input[type=file]:focus,
.com_form-item .fileinput-wrapper .fileinput input[type=file]:hover {
position: absolute;
top: 0;
right: 0;
margin: 0;
opacity: 0;
-ms-filter: "alpha(opacity=0)";
font-size: 200px;
direction: ltr;
cursor: pointer;
outline: 0;
}
.com_form-item .fileinput-wrapper .fileinput:hover {
color: #ffffff;
background-color: #002FA7;
}
@media (max-width: 560px) {
.com_form-item .fileinput-wrapper .fileinput {
min-width: 95px;
width: auto;
}
}
.com_form-item .fileinput-wrapper .fileinput-name {
left: 0;
margin-left: 15px;
width: calc(100% - 130px);
overflow-wrap: break-word;
text-overflow: ellipsis;
display: inline-block;
position: absolute;
top: 50%;
margin-top: -10px;
color: #666666;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.com_form-item .fileinput-wrapper .fileinput-name .close {
float: none;
margin-left: 8px;
vertical-align: middle;
}
.com_form-item br {
display: none;
}
.com_form-item input:-webkit-autofill {
-webkit-box-shadow: 0 0 0px 1000px white inset;
}
.com_custom-radio {
padding: 0;
position: relative;
padding-left: 1.5rem;
margin-bottom: 15px;
}
.com_custom-radio input {
position: absolute;
z-index: -1;
opacity: 0;
}
.com_custom-radio label:before {
transition: all 0.15s ease-in-out;
position: absolute;
top: 0;
left: 0;
display: block;
width: 1rem;
height: 1rem;
pointer-events: none;
content: "";
user-select: none;
border: 1px solid #d3d3d3;
border-radius: 50%;
background-color: #ffffff;
}
.com_custom-radio label:after {
position: absolute;
top: 0.25rem;
left: 0;
display: block;
width: 1rem;
height: 1rem;
content: "";
background-repeat: no-repeat;
background-position: center center;
background-size: 50% 50%;
}
.com_custom-radio input:checked ~ label:before {
color: #ffffff;
background-color: #ffffff;
border: 6px solid #002FA7;
background: transparent;
background-size: cover;
}
.com_custom-radio input:focus ~ label::before {
box-shadow: 0 0 0 1px #ffffff, 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
.com_custom-checkbox {
padding: 0;
line-height: 24px;
margin-bottom: 20px;
}
.com_custom-checkbox input[type=checkbox] {
display: none !important;
}
.com_custom-checkbox label .com_text-label {
display: inline-block;
vertical-align: middle;
max-width: calc(100% - 38px);
font-size: 16px;
line-height: 130%;
}
.com_custom-checkbox label .com_custom {
background-color: white;
vertical-align: middle;
}
.com_custom-checkbox label .com_custom:before {
transition: all 0.25s ease-in-out;
top: 3px;
left: 2px;
opacity: 0;
display: block;
position: absolute;
z-index: 1;
content: "";
width: 10px;
height: 5px;
border-left: 2px solid #002FA7;
border-bottom: 2px solid #002FA7;
transform: rotate(-45deg);
}
.com_custom-checkbox input[type=checkbox] + label .com_custom {
width: 16px;
height: 16px;
border: 1px solid #d3d3d3;
position: relative;
top: 0;
margin-right: 5px;
display: inline-block;
}
.com_custom-checkbox input[type=checkbox]:checked + label .com_custom:before {
opacity: 1;
}
.com_custom-checkbox label {
display: block;
}
.com_select {
cursor: pointer;
display: inline-block;
position: relative;
font-size: 16px;
height: 50px;
background-color: #ffffff;
padding: 12px 14px;
width: 100%;
border: 1px solid #d3d3d3;
}
.com_select .s-hidden {
visibility: hidden;
padding-right: 10px;
}
.com_select select {
display: block;
width: 110%;
}
.com_select .styledSelect {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: white;
padding: 13px 15px;
}
.com_select .styledSelect:after {
position: absolute;
right: 15px;
top: 50%;
margin-top: -4px;
z-index: 1;
content: "";
width: 9px;
height: 9px;
border-left: 2px solid #FFFFFF;
border-bottom: 2px solid #FFFFFF;
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.com_select .options {
transition: all 500ms ease;
display: none;
position: absolute;
margin-top: 0 !important;
top: 100%;
right: 0;
left: 0;
z-index: 12;
margin: 0 0;
padding: 0;
list-style: none;
border: 1px solid #d3d3d3;
background-color: white;
border-radius: 0;
max-height: 250px;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}
.com_select .options li {
padding: 0 6px;
margin: 0 0;
padding: 10px;
font-size: 16px;
}
.com_select .options li:hover {
background-color: #002FA7;
color: white;
}
.com_percent_item {
font-family: "Roboto";
}
.com_percent_item input {
padding: 10px 20px;
max-width: 100px;
border: 1px solid #979797;
border-radius: 4px;
font-size: 16px;
color: #4D4D4D;
letter-spacing: 0;
}
.com_percent_item input::-webkit-outer-spin-button, .com_percent_item input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
.com_percent_item input[type=number] {
-moz-appearance: textfield;
}
.com_percent_item span.symbol {
font-size: 24px;
letter-spacing: 0;
font-weight: bold;
margin: 0 10px;
}
.wpcf7 .com_form-item .com_select-error {
background-color: transparent;
border: none;
}
.wpcf7 .com_btn--primary {
display: inline-block;
width: auto;
border-color: #00AEEF;
background-color: #ffffff;
color: #000000;
text-transform: uppercase;
}
.wpcf7 .com_btn--primary:hover {
background-color: #000000;
border-color: #000000;
color: #ffffff;
}
.wpcf7-form-control-wrap {
position: initial;
/*label[for="usuario-general"],
label[for="empresa-coordinada"] {
display: none;
}*/
}
.wpcf7-submit,
.wpcf7-display-none {
display: none !important;
}
.wpcf7-validation-errors {
display: block;
margin: 0 !important;
background-color: #fef2ee;
font-size: 13px;
padding: 10px !important;
}
.wpcf7-not-valid {
border: none;
}
span.wpcf7-not-valid-tip {
font-size: 12px !important;
margin-left: 5px;
}
.amcharts-range-selector-range-wrapper {
display: flex;
align-items: center;
}
.amcharts-range-selector-range-wrapper .amcharts-range-selector-title, .amcharts-range-selector-range-wrapper input {
margin-right: 10px;
}
/*
===================== Components =====================
*/
.com_menu--landing {
background-color: #002FA7;
}
.com_menu--landing a {
display: inline-block;
padding: 2rem 1.5rem;
background-color: #002FA7;
color: #ffffff;
font-size: 1rem;
font-weight: 700;
text-transform: uppercase;
}
.com_menu--landing a:first-child {
margin-left: -1.5rem;
}
@media (max-width: 768px) {
.com_menu--landing a {
display: block;
padding: 1rem;
}
.com_menu--landing a:first-child {
margin-left: 0;
}
}
.com_menu--landing a span {
position: relative;
}
.com_menu--landing a span:before {
content: "";
width: 0;
position: absolute;
bottom: -0.5rem;
border-bottom: 1px solid #ffffff;
transition: width 250ms ease;
}
.com_menu--landing a:hover span:before, .com_menu--landing a.active span:before {
width: 100%;
}
.com_mod-icons {
display: block;
color: #FFFFFF;
height: 100%;
}
.com_mod-icons h4 {
transition: color 600ms ease;
}
.com_mod-icons h6 {
height: 45px;
}
.com_mod-icons img {
margin-bottom: 30px;
}
.com_mod-icons p {
line-height: 150%;
}
.com_mod-icons:hover h4 {
color: #002FA7;
}
.com_mod-icons--col {
display: flex;
align-items: self-start;
margin: 15px 0 25px;
padding-top: 25px;
border-top: 1px solid #E5E5E5;
}
.com_mod-icons--col__descript {
margin-left: 25px;
}
.com_title-icon {
display: flex;
align-items: self-end;
margin-bottom: 25px;
}
.com_title-icon h4 {
margin-bottom: 0;
}
.com_title-icon img {
margin-right: 10px;
}
.com_counter-box {
margin-bottom: 10px;
}
.com_counter-box span {
font-size: 36px;
color: #00AEEF;
}
.com_counter-box p {
display: inline-block;
color: #00AEEF;
font-family: "Roboto Condensed";
font-size: 24px;
}
.com_counter-box .com_counter-value {
display: inline-block;
color: #00AEEF;
font-size: 52px;
font-family: "Roboto Condensed";
font-weight: 700;
margin: 0 8px;
}
@media (max-width: 768px) {
.com_cont-fluid {
padding: 0;
}
}
.com_banner--landing img {
width: 100%;
}
.com_banner--landing img.desktop {
display: block;
}
.com_banner--landing img.mobile {
display: none;
}
@media (max-width: 768px) {
.com_banner--landing img.desktop {
display: none;
}
.com_banner--landing img.mobile {
display: block;
}
}
.com_banner-event {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
position: relative;
width: 100%;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
height: auto;
}
.com_banner-event + .com_banner-home__seccion {
position: static;
padding-top: 20px;
padding-bottom: 20px;
}
.com_banner-event .container {
z-index: 1;
}
.com_banner-event::after {
content: "";
position: absolute;
width: 50%;
height: 100%;
z-index: 0;
left: 0;
top: 0;
background-color: #002FA7;
opacity: 0.8;
}
@media (max-width: 1200px) {
.com_banner-event::after {
width: 70%;
}
}
@media (max-width: 768px) {
.com_banner-event::after {
width: 100%;
}
}
.com_banner-event.right-content::after {
right: 0;
left: unset;
}
.com_banner-event.right-content .com_banner-event__descript {
padding-left: 64px;
}
.com_banner-event__container {
position: absolute;
right: 0;
height: 100%;
width: 100%;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
}
.com_banner-event__descript {
padding: 64px 0;
color: #ffffff;
}
@media (max-width: 768px) {
.com_banner-event__descript {
padding: 64px 20px;
}
}
.com_banner-event__descript .com_text_spacing {
margin-bottom: 10px;
}
.com_banner-event__descript__content {
margin-bottom: 64px;
}
.com_banner-event__descript p {
font-size: 24px;
}
.com_banner-event__descript p:last-child {
margin-bottom: 0;
}
@media (max-width: 768px) {
.com_banner-event__descript p {
font-size: 16px;
}
}
.com_banner-event__descript h3 {
font-size: 40px;
line-height: 140%;
margin-bottom: 43px;
color: #ffffff;
text-align: left;
font-weight: 400;
}
@media (max-width: 768px) {
.com_banner-event__descript h3 {
font-size: 22px;
}
}
.com_banner-event__descript h3 img {
max-width: 100%;
}
@media (max-width: 768px) {
.com_banner-event__descript h3 img {
height: 24px;
width: auto;
}
}
.com_banner-event__descript .banner_address {
display: inline-block;
font-size: 20px;
border: 1px solid white;
border-radius: 10px;
padding: 16px;
}
@media (max-width: 768px) {
.com_banner-event__descript .banner_address {
font-size: 16px;
}
}
.com_banner-int {
display: flex;
align-items: center;
justify-content: center;
position: relative;
width: 100%;
height: 200px;
background-color: #002FA7;
}
.com_banner-int-local {
height: 333px;
background-color: transparent;
margin-bottom: 4.5%;
}
@media (max-width: 768px) {
.com_banner-int-local {
height: 250px !important;
}
}
@media (max-width: 560px) {
.com_banner-int-local {
height: unset !important;
}
}
.com_banner-int-local.has-lateral-img .com_banner-int-local__descript {
padding-left: 8rem;
}
@media (min-width: 1200px) and (max-width: 1440px) {
.com_banner-int-local.has-lateral-img .com_banner-int-local__descript {
padding-left: 12rem;
}
}
@media (max-width: 992px) {
.com_banner-int-local.has-lateral-img .com_banner-int-local__descript {
padding-left: 0;
}
}
@media (max-width: 992px) {
.com_banner-int-local.has-lateral-img .com_banner-int-local--bg-left {
background-image: unset !important;
}
}
.com_banner-int-local.has-links .com_banner-int-local--bg-right {
left: 50%;
width: 50%;
}
@media (max-width: 560px) {
.com_banner-int-local.has-links .com_banner-int-local--bg-right {
left: 10%;
width: 90%;
}
}
.com_banner-int-local.has-links .links {
margin-top: 3rem;
}
@media (max-width: 560px) {
.com_banner-int-local.has-links .links {
margin-top: 1rem;
}
}
.com_banner-int-local.has-links .links .row .col-md-6 {
position: relative;
}
.com_banner-int-local.has-links .links .row .col-md-6:last-child::after {
content: "";
position: absolute;
left: 0;
top: 0;
height: 100px;
border-left: 1px solid #99BFC2;
}
.com_banner-int-local.has-links .links .row .col-md-6 a {
float: none;
}
.com_banner-int-local.has-links .links .row .col-md-6 p {
display: flex;
align-items: flex-start;
gap: 0.5rem;
margin-top: 1rem;
font-size: 12px;
line-height: 16px;
color: #6E6E6E;
}
.com_banner-int-local.has-links .links .row .col-md-6 p svg {
min-width: 24px;
}
.com_banner-int-local--bg-left {
position: absolute;
height: 100%;
width: 70%;
left: 0;
background-color: #F1F1F2;
background-repeat: no-repeat;
background-size: contain;
clip-path: polygon(0% 0%, 100% 0%, 90% 100%, 0 100%);
z-index: 1;
}
@media (max-width: 560px) {
.com_banner-int-local--bg-left {
width: 100%;
clip-path: unset;
}
}
.com_banner-int-local--bg-left .bg-polygon-left {
position: relative;
width: 322px;
height: 333px;
z-index: 1;
}
@media screen and (max-width: 1620px) {
.com_banner-int-local--bg-left .bg-polygon-left {
margin-left: -6rem;
}
}
@media screen and (max-width: 1090px) {
.com_banner-int-local--bg-left .bg-polygon-left {
display: none;
}
}
.com_banner-int-local--bg-left .bg-polygon-left::before {
content: "";
position: absolute;
top: 0;
left: -5px;
width: 100%;
height: 100%;
background-color: white;
clip-path: polygon(73% 0%, 100% 0%, 64% 100%, 37% 100%);
transform: scale(1.08);
z-index: -1;
}
.com_banner-int-local--bg-left .bg-polygon-left::after {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-size: cover;
background-position: center;
clip-path: polygon(73% 0%, 100% 0%, 64% 100%, 37% 100%);
z-index: 1;
}
.com_banner-int-local--bg-right {
position: absolute;
left: 40%;
right: 0;
height: 100%;
width: 65%;
bottom: -12%;
clip-path: polygon(117px 0%, 100% 0%, 100% 100%, 0 100%);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
z-index: 1;
}
@media (max-width: 768px) {
.com_banner-int-local--bg-right {
left: 45%;
clip-path: polygon(90px 0%, 100% 0%, 100% 100%, 0 100%);
}
}
@media (max-width: 560px) {
.com_banner-int-local--bg-right {
left: 10%;
height: 130px;
width: 90%;
bottom: -8%;
clip-path: polygon(60px 0%, 100% 0%, 100% 100%, 0 100%);
}
}
.com_banner-int-local:after {
content: "";
height: 123.5%;
background-color: #00AEEF;
position: absolute;
left: 70%;
top: 0;
width: 250px;
z-index: 0;
clip-path: polygon(85% 0%, 100% 0%, 42% 100%, 27% 100%);
}
@media (max-width: 768px) {
.com_banner-int-local:after {
display: none;
}
}
.com_banner-int-local__container {
position: absolute;
right: 0;
height: 100%;
width: 100%;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
z-index: 0;
}
.com_banner-int-local--contact_list {
position: relative;
padding-left: 2rem;
}
.com_banner-int-local--contact_list::before {
position: absolute;
left: 0;
content: url('data:image/svg+xml,');
}
.com_banner-int-local .container {
z-index: 1;
}
@media (max-width: 560px) {
.com_banner-int-local .container {
height: 100%;
display: flex;
align-items: flex-start;
padding-top: 30px;
padding-bottom: 130px;
}
.com_banner-int-local .container .com_btn {
font-size: 14px;
}
.com_banner-int-local .container .com_btn + .com_btn {
margin-left: 10px;
}
}
.com_banner-int-local__descript {
color: #000000;
}
.com_banner-int-local__descript .com_text_spacing {
margin-bottom: 10px;
}
.com_banner-int-local__descript h2 {
line-height: 120%;
margin-bottom: 5px;
color: #000000;
text-align: left;
font-weight: 400;
}
@media (max-width: 768px) {
.com_banner-int-local__descript h2 {
font-size: 1.5rem !important;
}
}
.com_banner-int-local__descript h2 small {
font-size: 70%;
display: block;
}
.com_banner-int.full-width {
background-color: transparent;
}
.com_banner-int.full-width .com_banner-int__container {
width: 100% !important;
background-size: 100% !important;
display: block !important;
clip-path: unset !important;
}
.com_banner-int__container {
display: none;
position: absolute;
right: 0;
height: 100%;
width: 50%;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
clip-path: ellipse(100% 200% at 100% 50%);
}
@media (min-width: 768px) {
.com_banner-int__container {
display: block;
}
}
.com_banner-int--green:before {
background: rgba(0, 174, 239, 0.9);
}
.com_banner-int__descript {
color: #ffffff;
}
.com_banner-int__descript .com_text_spacing {
margin-bottom: 10px;
}
.com_banner-int__descript h3 {
line-height: 140%;
margin-bottom: 5px;
color: #ffffff;
text-align: left;
font-weight: 400;
}
@media (max-width: 768px) {
.com_banner-int__descript h5 {
font-size: 28px !important;
}
}
@media (max-width: 560px) {
.com_banner-int {
height: 135px;
}
.com_banner-int__descript h5 {
font-size: 21px !important;
}
}
.com_banner-int--landing {
height: 300px;
}
.com_banner-int--landing .com_banner-int__container {
background-size: 150%;
}
.com_banner-int--landing .com_banner-int__descript {
max-width: 455px;
}
.com_banner-int--landing .com_banner-int__descript .com_h1 {
font-size: 40px !important;
line-height: 130%;
}
@media (max-width: 768px) {
.com_banner-int--landing {
height: 200px;
}
.com_banner-int--landing .com_banner-int__descript .com_h1 {
font-size: 30px !important;
}
}
@media (max-width: 560px) {
.com_banner-int--landing {
height: 135px;
}
.com_banner-int--landing .com_banner-int__descript .com_h1 {
font-size: 21px !important;
}
}
.com_banner-int + section {
padding-top: 5px;
}
@media screen and (max-width: 560px) {
.com_banner-int + section {
padding-top: 2.5rem;
}
}
.com_mod-link {
position: relative;
display: flex;
align-items: flex-end;
border-bottom: 1px solid #E5E5E5;
padding: 0 0 5px 0;
height: 54px;
color: #000000;
font-family: "Roboto Condensed";
font-weight: 400;
margin: 0 20px 50px 0;
}
.com_mod-link span {
display: inline-block;
margin-right: 5px;
}
.com_mod-link i {
position: absolute;
right: 0;
display: flex;
align-self: baseline;
}
.com_mod-link i:before {
color: rgba(78, 78, 78, 0.5);
}
.com_autor {
display: flex;
}
.com_autor__img {
margin-right: 16px;
}
.com_autor__img img {
border-radius: 50%;
-o-border-radius: 50%;
-ms-border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
}
.com_post {
display: block;
color: #6E6E6E;
}
.com_post__card, .com_post__card-left, .com_post__card-image {
box-shadow: 0px 1px 2px 0px rgba(0, 47, 167, 0.3019607843);
}
.com_post__card .com_post__content, .com_post__card-left .com_post__content, .com_post__card-image .com_post__content {
padding: 1rem;
}
.com_post__card, .com_post__card-left {
position: relative;
}
.com_post__card .com_post__content, .com_post__card-left .com_post__content {
padding-bottom: 3rem;
}
.com_post__card .com_post__link, .com_post__card-left .com_post__link {
position: absolute;
bottom: 1.5rem;
}
.com_post__card-image {
position: relative;
}
.com_post__card-image .com_post__content {
position: absolute;
z-index: 1;
bottom: 2rem;
left: 2rem;
background-color: rgba(255, 255, 255, 0.8588235294);
max-width: 50%;
}
.com_post__title {
color: #000000;
font-weight: 500;
}
.com_post__link {
font-size: 14px;
color: #002FA7;
text-decoration: none;
font-weight: bold;
padding-bottom: 2px;
border-bottom: 1px solid #002FA7;
}
.com_post__info {
display: block;
font-size: 1rem;
margin-bottom: 20px;
position: relative;
}
@media (max-width: 560px) {
.com_post__info {
margin-bottom: 10px;
font-size: 12px;
line-height: 120%;
}
}
.com_post__img {
overflow: hidden;
position: relative;
}
.com_post__img::before {
content: "";
z-index: 1;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(0deg, rgba(0, 47, 167, 0.15), rgba(0, 47, 167, 0.15)), linear-gradient(183.87deg, rgba(0, 0, 0, 0) 24.47%, rgba(0, 47, 167, 0.4) 94.88%);
}
.com_post__img img {
transition: transform 300ms ease;
transform: scale(1);
}
.com_post__img .com_video_icon {
position: absolute;
display: block;
margin: 0;
width: 60px;
height: 60px;
background-image: url(/wp-content/themes/compass-group/assets/img/icons/cg-icon-play.svg);
right: 10px;
bottom: 10px;
opacity: 0.5;
transition: opacity, 0.5s, ease-in-out;
}
@media (max-width: 560px) {
.com_post__img {
margin-bottom: 10px;
}
}
.com_post__height {
height: 85%;
}
.com_post:hover .com_post__img {
position: relative;
}
.com_post:hover .com_post__img img {
transform: scale(1.05);
}
.com_post:hover .com_video_icon {
opacity: 1;
}
.com_filosofia * {
color: #ffffff !important;
}
.com_filosofia .com_content-post h4 + p {
margin-bottom: 35px;
}
@media (max-width: 768px) {
.com_filosofia .com_title-styky {
margin-bottom: 30px;
}
.com_filosofia .com_title-styky h2 {
font-size: 30px !important;
}
.com_filosofia .com_content-post h4 + p {
margin-bottom: 40px;
}
}
.com_title-styky {
position: sticky;
top: 85px;
}
.com_title-styky h2 {
color: #ffffff;
}
.com_mod-workhere {
position: absolute;
right: 0;
z-index: 1;
top: -15%;
width: 255px;
height: 204px;
background: #FFFFFF;
border: 1px solid #E0E0E0;
border-radius: 3px;
padding: 30px 25px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
.com_mod-workhere h5 {
font-size: 20px;
color: #000000;
font-family: "Lira";
font-weight: 700;
line-height: 140%;
margin-bottom: 30px;
}
@media (max-width: 992px) {
.com_mod-workhere {
top: -15%;
}
}
@media (max-width: 768px) {
.com_mod-workhere {
position: relative;
display: flex;
width: 100%;
align-items: center;
height: auto;
padding: 20px;
justify-content: space-between;
}
.com_mod-workhere h5 {
margin-bottom: 0;
}
}
@media (max-width: 440px) {
.com_mod-workhere {
flex-direction: column;
}
.com_mod-workhere h5 {
margin-bottom: 20px;
}
}
.com_mod-404 {
position: relative;
height: 540px;
color: #ffffff;
margin-bottom: 40px;
}
.com_mod-404 .com_mod-404_text {
font-family: "Roboto";
max-width: 540px;
text-align: center;
position: absolute;
left: 50%;
transform: translate(-50%, -50%);
top: 50%;
}
.com_mod-404 .com_mod-404_text h2 {
position: relative;
color: #ffffff;
font-size: 18px;
padding-bottom: 25px;
font-family: "Roboto Condensed";
}
.com_mod-404 .com_mod-404_text h2:after {
content: "";
position: absolute;
bottom: 0;
left: 50%;
margin-left: -50px;
height: 2px;
width: 100px;
background-color: #ffffff;
}
.com_mod-404 .com_mod-404_text h2 span {
display: block;
font-size: 60px;
line-height: 150%;
margin-bottom: 20px;
}
.com_mod-404 .com_mod-404_text .com_btn {
float: none !important;
transition: all 500ms ease;
border: 1px solid #ffffff;
margin-top: 10px;
}
.com_mod-404 .com_mod-404_text .com_btn:hover {
background-color: #ffffff;
color: #002FA7;
}
@media (max-width: 560px) {
.com_mod-404 .com_mod-404_text {
width: 80%;
}
}
.com_menu--secondary {
margin-bottom: 30px;
}
@media (max-width: 992px) {
.com_menu--secondary {
position: relative;
overflow-x: scroll;
overflow-y: hidden;
display: flex;
white-space: pre;
margin-bottom: 30px;
}
}
.com_menu-overlay {
position: relative;
}
@media (max-width: 992px) {
.com_menu-overlay:after {
content: "";
background: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgb(255, 255, 255));
height: 40px;
position: absolute;
pointer-events: none;
right: 0;
top: 1px;
width: 40px;
z-index: 2;
height: 96px;
}
}
.com_menu-overlay--grey {
background-color: #F1F1F2;
border-radius: 100px;
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.1);
padding: 2px;
margin: 1.5rem 0;
}
.com_menu-overlay--grey .com_menu-filter_buttons {
border: none;
padding: 0 1rem;
margin-bottom: 0;
}
.com_menu-overlay--grey .com_menu-filter_buttons a {
text-align: center;
font-weight: 500;
color: #002FA7;
padding: 0.75rem 1.25rem;
white-space: nowrap;
}
.com_menu-overlay--grey .com_menu-filter_buttons a.active {
background-color: white;
border-radius: 100px;
}
.com_menu-overlay--grey .com_menu-filter_buttons a.active::before {
display: none;
}
.com_box-link {
display: flex;
background-color: #F1F1F2;
padding: 0;
font-size: 14px;
border-radius: 5px;
margin: 60px 0;
}
.com_box-link p {
display: block;
margin: 0;
padding: 15px;
}
.com_box-link ul {
display: flex;
margin-left: 5px;
margin-top: 0;
gap: 1rem;
}
.com_box-link ul li a {
display: block;
line-height: 56px;
padding: 0 10px;
transition: background 400ms linear;
}
@media (max-width: 768px) {
.com_box-link {
flex-direction: column;
}
}
@media (max-width: 560px) {
.com_box-link ul {
flex-direction: column;
}
}
@keyframes up {
0% {
transform: translateY(10px);
}
100% {
transform: translateY(0px);
}
}
@-webkit-keyframes rotateIn {
0% {
transform: rotate(0deg);
}
50% {
transform: rotate(40deg);
}
100% {
transform: rotate(0deg);
}
}
@keyframes rotateIn {
0% {
transform: rotate(0deg);
}
50% {
transform: rotate(40deg);
}
100% {
transform: rotate(0deg);
}
}
.funds-tabs .fund-title {
margin: 1.5rem 0;
}
.funds-tabs .btn-filter {
border-radius: 50px;
}
.funds-tabs .nav {
overflow: auto;
}
.funds-tabs .nav-link {
font-size: 24px;
font-style: normal;
font-weight: 500;
margin: 0 2.5rem;
}
.funds-tabs .nav-link:first-child {
margin-left: 0;
}
.funds-tabs .nav-link:last-child {
margin-right: 0;
}
.funds-tabs .fund-teaser {
overflow: auto;
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.1);
background-color: white;
padding: 2rem;
border-radius: 10px;
margin-bottom: 2rem;
}
.funds-tabs .fund-teaser .title {
font-size: 1rem;
font-weight: 500;
}
@media (max-width: 769px) {
.funds-tabs .fund-teaser {
padding: 1rem;
}
.funds-tabs .fund-teaser > div {
display: flex;
}
.funds-tabs .nav {
display: flex;
overflow: auto;
align-items: baseline;
}
.funds-tabs .nav-link {
font-size: 1rem;
white-space: nowrap;
}
.funds-tabs .com_btn--filter {
white-space: nowrap;
min-width: fit-content;
}
}
.video-wrapper {
margin-bottom: 1.5rem;
position: relative;
padding-bottom: 56.25%; /* 16:9 */
height: 0;
}
.video-wrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.com_files_list li {
margin-bottom: 1rem;
}
.com_files_list li a {
color: #002FA7;
}
.agf-directorio h4 {
margin-bottom: 3rem;
}
.agf-directorio .person {
text-align: center;
margin-bottom: 2rem;
text-align: center;
justify-content: center;
margin-bottom: 2rem;
display: flex;
flex-direction: column;
align-items: center;
}
.agf-directorio .person img {
margin: 0 auto;
margin-bottom: 2rem;
}
.agf-directorio .person h5 {
font-weight: 500;
margin-bottom: 0.75rem;
}
.agf-directorio .flex-container {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
}
.agf-directorio .flex-item {
flex: 0 0 calc(20% - 20px);
margin: 10px;
text-align: center;
}
@media (max-width: 768px) {
.agf-directorio .flex-item {
flex: 0 0 calc(40% - 20px);
}
}
@media (max-width: 480px) {
.agf-directorio .flex-item {
flex: 0 0 calc(100% - 20px);
}
}
.agf-directorio .img-circle {
width: 200px;
height: 200px;
border-radius: 50%;
overflow: hidden;
margin-bottom: 2rem;
}
.agf-directorio .img-circle img {
width: 100%;
height: auto;
display: block;
}
.agf-ejecutivos h4 {
margin-bottom: 3rem;
}
.agf-ejecutivos .person {
text-align: left;
margin-bottom: 2rem;
}
.agf-ejecutivos .person .img-circle {
width: 70px;
height: 70px;
border-radius: 50%;
overflow: hidden;
}
.agf-ejecutivos .person .img-circle img {
width: 100%;
height: auto;
display: block;
}
.agf-ejecutivos .person h5 {
font-weight: 700;
margin-bottom: 0.15rem;
}
@font-face {
font-family: "icons";
src: url("../fonts/icons.eot?2yevj2");
src: url("../fonts/icons.eot?2yevj2#iefix") format("embedded-opentype"), url("../fonts/icons.ttf?2yevj2") format("truetype"), url("../fonts/icons.woff?2yevj2") format("woff"), url("../fonts/icons.svg?2yevj2#icons") format("svg");
font-weight: normal;
font-style: normal;
font-display: block;
}
[class^=icon-], [class*=" icon-"] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: "icons" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
a > i, li > i {
vertical-align: middle;
}
a > [class*=icon-] + span, li > [class*=icon-] + span {
display: inline-block;
padding-left: 8px;
vertical-align: middle;
}
.icon_xs:before {
font-size: 20px;
}
.icon_s:before {
font-size: 31px;
}
.icon-twitter:before {
content: "\e908";
}
.icon-arrow-slide:before {
content: "\e907";
}
.icon-document:before {
content: "\e904";
}
.icon-clientes:before {
content: "\e905";
}
.icon-search:before {
content: "\e906";
}
.icon-arrow:before {
content: "\e901";
}
.icon-home:before {
content: "\e902";
}
.icon-linkedin:before {
content: "\e903";
}
.icon-download:before {
content: url('data:image/svg+xml,');
}
.icon-ticket {
position: relative;
}
.icon-ticket:after {
position: absolute;
z-index: 10;
content: "";
width: 16px;
height: 9px;
border-left: 3.2px solid rgb(0, 0, 0);
border-bottom: 3.2px solid rgb(0, 0, 0);
transform: rotate(-45deg);
}
.icon-arrow-down {
position: relative;
}
.icon-arrow-down:after {
position: absolute;
z-index: 10;
content: "";
width: 14px;
height: 14px;
border-left: 2.3333333333px solid #FFFFFF;
border-bottom: 2.3333333333px solid #FFFFFF;
transform: rotate(-45deg);
}
.icon-arrow-2 {
display: inline-block;
margin-left: 8px;
}
.icon-arrow-2:after {
position: absolute;
content: "";
transition: all 500ms ease;
width: 7px;
height: 7px;
transform-origin: center;
transform: rotate(-45deg) translate(3px, -2px);
border-left: 2.33333px solid #000000;
border-bottom: 2.33333px solid #000000;
}
.icon-close {
position: relative;
display: inline-block;
width: 20px;
height: 20px;
overflow: hidden;
}
.icon-close:hover::before, .icon-close:hover::after {
background: #FFFFFF;
}
.icon-close::before, .icon-close::after {
content: "";
position: absolute;
height: 2px;
width: 100%;
top: 50%;
left: 0;
margin-top: -1px;
background: #000;
}
.icon-close::before {
transform: rotate(45deg);
}
.icon-close::after {
transform: rotate(-45deg);
}
.icon-fund::before {
display: inline-block;
content: "";
background-image: url("../img/icons/icon-fund-blue.svg");
background-size: contain;
height: 1.5rem;
width: 1.5rem;
margin-right: 0.5rem;
}
.icon-file::before {
display: inline-block;
content: "";
background-image: url("../img/icons/icon-file-blue.svg");
background-size: contain;
height: 1.5rem;
width: 1.5rem;
margin-right: 0.5rem;
}
.icon-link::before {
display: inline-block;
content: "";
background-image: url("../img/icons/icon-link-blue.svg");
background-size: contain;
height: 1.5rem;
width: 1.5rem;
margin-right: 0.5rem;
}
/*
===================== Content post =====================
*/
.com_content-post {
margin-bottom: 10px;
}
.com_content-post h1 {
font-size: 2.125rem;
}
.com_content-post h1 + h3 {
font-size: 24px;
font-weight: 400;
}
.com_content-post h1,
.com_content-post h2,
.com_content-post h3,
.com_content-post h4,
.com_content-post h5,
.com_content-post h6 {
margin-bottom: 20px;
color: #000000;
font-family: "Roboto";
}
.com_content-post a:hover {
text-decoration: underline;
}
.com_content-post a.com_text-link:hover {
text-decoration: none;
}
.com_content-post ul {
margin: 30px 0 25px;
}
.com_content-post ul li {
display: block;
list-style: none;
margin-bottom: 20px;
position: relative;
font-size: 18px;
padding-left: 23px;
line-height: 140%;
}
.com_content-post ul li:before {
content: "";
border-radius: 50%;
-o-border-radius: 50%;
-ms-border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
width: 10px;
height: 10px;
display: inline-block;
background-color: #002FA7;
position: absolute;
left: 0;
top: 10px;
}
.com_content-post ul li strong {
font-family: "Lira";
}
.com_content-post ul li:last-child {
margin-bottom: 0;
}
.com_content-post .com_select .options li:before {
display: none !important;
}
.com_content-post blockquote {
position: relative;
padding-left: 15px;
margin: 30px 0 50px 60px;
}
@media (max-width: 992px) {
.com_content-post {
padding: 0;
margin-bottom: 20px;
}
.com_content-post h1 {
margin-bottom: 20px;
}
.com_content-post blockquote {
position: relative;
padding-left: 15px;
margin: 30px 0 50px !important;
}
}
.com_content-post--intro {
margin-bottom: 70px;
}
.com_content-post--intro h1 {
font-size: 28px;
margin-bottom: 0;
color: #FFFFFF;
}
.com_content-post--intro p {
line-height: 160%;
font-size: 18px;
margin-bottom: 0;
}
.com_content-post--intro p + p {
margin-top: 20px;
}
@media (max-width: 992px) {
.com_content-post--intro {
margin-bottom: 40px;
}
.com_content-post--intro h1 {
margin-bottom: 20px;
}
}
.com_content-post-local {
font-size: 18px;
line-height: 32px;
}
/*
===================== Paginador =====================
*/
.com_pagination {
display: flex;
justify-content: center;
gap: 10px;
padding-left: 0;
list-style: none;
margin: 40px 0;
}
.com_pagination li {
color: #000000;
}
.com_pagination li:before {
display: none;
}
.com_pagination li a {
transition: all 500ms ease;
display: block;
font-size: 14px;
text-align: center;
margin-left: -1px;
padding: 0.3rem 0.6rem;
color: #000000;
background-color: #ffffff;
border: 1px solid #F3F0ED;
min-width: 32px;
}
.com_pagination li a:hover {
background-color: #F3F0ED;
}
.com_pagination li a.current {
background-color: #00AEEF;
color: #000000;
}
.com_pagination li a.disabled {
color: #FFFFFF;
pointer-events: none;
cursor: auto;
}
/*
===================== Tablas =====================
*/
.com table {
width: 100%;
max-width: 100%;
border-spacing: 0;
border-collapse: collapse;
background: #ffffff;
white-space: nowrap;
}
.com table td,
.com table th {
padding: 10px 30px;
text-align: left;
}
.com table thead th {
background-color: #434040;
color: #ffffff;
height: 56px;
}
.com table tbody tr:nth-child(even) td {
background-color: rgba(250, 250, 251, 0.5);
}
.com .com_tabla {
display: block;
width: 100%;
overflow-x: auto;
margin: 15px 0;
padding: 40px;
background: #ffffff;
}
.com .com_tabla-ficha + .um_tabla-ficha {
margin-top: 15px;
}
.com .com_tabla-ficha table {
white-space: initial;
}
.com .com_tabla-ficha table th {
text-align: center;
padding: 10px;
height: 50px;
font-size: 16px;
}
.com .com_tabla-ficha table tr td {
border-bottom: 1px solid #FAFAFB;
border-left: 1px solid #FAFAFB;
text-align: center;
padding: 8px;
white-space: normal;
width: 100%;
}
.com .com_tabla-ficha table tr td p {
margin-bottom: 0;
}
.com .com_tabla-ficha table tr td p span {
display: block;
font-size: 24px;
}
.com .com_tabla-ficha table tr td p + p {
margin-top: 10px;
}
.com .com_tabla-ficha table tr td.um_dest {
background-color: #fcfcfc;
}
.com .com_tabla-ficha table tr:nth-child(even) td {
background-color: #ffffff;
}
.com .com_tabla-ficha table tr:nth-child(even) td.um_dest {
background-color: #fcfcfc;
}
.com .com_tabla-ficha table tbody tr {
display: flex;
}
.com .com_tabla-ficha table tfoot td {
background-color: #fcfcfc;
font-size: 20px;
}
.com_as-table {
display: table;
width: 100%;
}
.com_as-table * {
line-height: 130%;
}
.com_as-table_mobile-as-title {
display: none;
}
@media (max-width: 768px) {
.com_as-table {
display: block;
}
.com_as-table_mobile-as-title {
display: block;
}
}
.com_as-table .com_as-thead {
display: table-row;
vertical-align: middle;
background: #E3E3E3;
padding: 0px 0;
}
@media (max-width: 768px) {
.com_as-table .com_as-thead {
display: block;
background: none;
}
.com_as-table .com_as-thead_mobile-title {
text-transform: uppercase;
letter-spacing: 2.6px;
}
}
.com_as-table .com_as-thead > div {
display: table-cell;
padding: 5px 10px;
text-align: center;
vertical-align: middle;
}
.com_as-table .com_as-thead > div:first-child {
text-align: left;
}
@media (max-width: 768px) {
.com_as-table .com_as-thead > div {
display: none;
width: 100%;
}
.com_as-table .com_as-thead > div:first-child {
display: block;
}
}
.com_as-table .com_as-row {
display: table-row;
}
@media (max-width: 768px) {
.com_as-table .com_as-row {
display: flex;
flex-flow: column;
text-align: left;
align-items: flex-start;
}
}
.com_as-table .com_as-row > div {
display: table-cell;
padding: 19px 10px;
text-align: center;
vertical-align: middle;
border-bottom: solid 1px #E3E3E3;
}
@media (max-width: 768px) {
.com_as-table .com_as-row > div {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
text-align: left;
padding: 10px;
background: #E3E3E3;
}
.com_as-table .com_as-row > div:nth-child(2n+1) {
background: #ffffff;
}
.com_as-table .com_as-row > div:first-child {
padding: 10px;
background: #ffffff;
}
.com_as-table .com_as-row > div > * + * {
min-width: 80px;
}
}
.com_as-table .com_as-row > div:first-child {
text-align: left;
border-radius: 5px 0 0 5px;
}
.com_as-table .com_as-row > div:last-child {
text-align: center;
border-radius: 0 5px 5px 0;
}
.com_as-table.com_as-table-shadow {
border-spacing: 0 10px;
}
.com_as-table.com_as-table-shadow .com_as-thead {
background: none;
margin-bottom: 10px;
}
.com_as-table.com_as-table-shadow .com_as-row {
position: relative;
transition: background 100ms linear;
background: #FFFFFF;
box-shadow: 0 5px 10px 0 #E3E3E3;
border-radius: 5px;
font-size: 14px;
}
.com_as-table.com_as-table-shadow .com_as-row > div {
border: none;
}
.com_as-table.com_as-table-shadow .com_as-row .com_as-table_mobile-as-title {
border: none;
}
.com_as-table.com_as-table-shadow .com_as-row:hover {
background-color: #00AEEF;
color: #ffffff;
}
.com_as-table.com_as-table-shadow .com_as-row:hover .com_text-link {
color: #ffffff;
}
.com_as-table.com_as-table-shadow .com_as-row:hover .com_text-link::before {
background-color: #ffffff;
}
.com_as-table.com_as-table-shadow .com_as-row.light {
position: relative;
transition: background 100ms linear;
background: transparent;
box-shadow: unset;
border-radius: 5px;
font-size: 14px;
}
.com_as-table.com_as-table-shadow .com_as-row.light > div {
border: none;
}
.com_as-table.com_as-table-shadow .com_as-row.light .com_as-table_mobile-as-title {
border: none;
}
.com_as-table.com_as-table-shadow .com_as-row.light:hover {
background-color: transparent;
color: #6E6E6E;
}
.com_as-table.com_as-table-shadow .com_as-row.light:hover .com_text-link {
color: #002FA7;
}
.com_as-table.com_as-table-shadow .com_as-row.light:hover .com_text-link::before {
background-color: #002FA7;
}
@media (max-width: 768px) {
.com_as-table.com_as-table-shadow .com_as-row {
padding: 20px;
margin-bottom: 15px;
}
.com_as-table.com_as-table-shadow .com_as-row > div {
justify-content: flex-start;
background: transparent;
border: none;
padding: 5px 10px;
}
.com_as-table.com_as-table-shadow .com_as-row > div:last-child:not(.no-link) {
padding: 10px 0;
}
.com_as-table.com_as-table-shadow .com_as-row > div:last-child:not(.no-link) .com_as-table_mobile-as-title:after {
display: none;
}
.com_as-table.com_as-table-shadow .com_as-row .com_as-table_mobile-as-title {
margin-right: 8px;
}
.com_as-table.com_as-table-shadow .com_as-row .com_as-table_mobile-as-title:after {
position: relative;
content: ":";
color: #FFFFFF;
}
.com_as-table.com_as-table-shadow .com_as-row .com_as-thead_mobile-sub-title {
font-weight: 600;
}
}
.com_table--info th, .com_table--info td {
padding: 0.125rem 1rem 0.125rem 0;
}
.com_simple-acc.is-children {
border-radius: 0;
border: none;
}
.com_simple-acc.is-children .com_acc-deploy-button {
border-radius: 0;
border: none;
font-weight: 400;
}
.com_simple-acc.is-children .com_acc-deploy-button:nth-of-type(even) {
background-color: #fff;
}
.com_simple-acc.is-children + .com_download-button {
margin-top: 30px;
}
.com_simple-acc .com_acc-deploy-button {
background-color: #F1F1F2;
color: #6E6E6E;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 16px;
font-weight: 400;
padding: 15px 20px;
border: none;
width: 100%;
text-align: left;
cursor: pointer;
}
.com_simple-acc .com_acc-deploy-button:nth-of-type(even) {
background-color: #ffffff;
}
.com_simple-acc .com_acc-deploy-button i:before {
font-size: 12px;
display: block;
transition: all 300ms ease;
}
.com_simple-acc .com_acc-deploy-button.active i:before {
transform: rotate(-90deg);
transition: all 300ms ease;
}
.com_simple-acc .com_acc-deploy-button:last-of-type {
border-bottom: none;
border-radius: 0 0 5px 5px;
}
.com_simple-acc .com_deploy-area {
display: none;
}
.com_simple-acc .com_info-core {
padding: 30px;
}
.com_simple-acc .com_content-post {
margin-bottom: 0;
}
.com_simple-acc .com_download-button {
margin-bottom: 0;
}
.com_simple-acc .com_download-button + .com_download-button {
margin-top: 20px;
}
.com_simple-acc.com_simple-acc--primary {
border: none;
border-radius: 4px;
box-shadow: 0px 5px 10px #E3E3E3;
}
.com_simple-acc.com_simple-acc--primary .com_acc-deploy-button {
background-color: #002FA7;
border-radius: 5px;
color: #ffffff;
font-size: 1.2rem;
}
.com_simple-acc.com_simple-acc--primary .com_acc-deploy-button.active {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
.com_simple-acc.com_simple-acc--primary .com_acc-deploy-button i:before {
color: #ffffff;
}
.com_event-item {
margin-bottom: 2rem;
}
.com_event-item h2 {
color: #002FA7;
font-family: "Roboto";
font-size: 1.2rem;
margin-bottom: 2rem;
}
.com_event-item .event {
margin-bottom: 1rem;
font-size: 1rem;
display: flex;
}
@media (max-width: 768px) {
.com_event-item .event {
display: block;
}
}
.com_event-item .event-time {
font-weight: bold;
margin-right: 2rem;
}
@media (max-width: 768px) {
.com_event-item .event-time {
margin-right: 0;
}
}
.com_event-item .event > div:first-child {
min-width: 120px;
display: inline-block;
}
h1 + .com_simple-acc, h2 + .com_simple-acc, h3 + .com_simple-acc, h4 + .com_simple-acc, h5 + .com_simple-acc, h6 + .com_simple-acc {
margin-top: 30px;
}
/*
===================== alert =====================
*/
.com_card {
background-color: white;
box-shadow: 0 5px 10px 0 #E3E3E3;
transition: box-shadow 0.3s ease-in-out;
border-radius: 4px;
padding: 20px;
}
.com_card-blue {
display: block;
padding: 2rem;
border-radius: 10px;
background-color: #00AEEF;
min-height: 120px;
height: 100%;
color: #fff;
transition: all 0.3s;
}
.com_card-blue .com_text-link::before {
bottom: -8px;
}
.com_card-blue:hover {
background-color: #00AEEF;
}
.com_card-blue:hover .com_text-link::before {
width: 50%;
}
.com_card-link {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
max-width: max-content;
display: block;
}
.com_card .com_card-title {
color: #000000;
letter-spacing: 0;
font-weight: 400;
}
.com_card .com_card-subtitle {
font-family: "Roboto";
font-size: 14px;
color: #FFFFFF;
line-height: 21px;
}
.com_card .com_card-logo {
display: flex;
justify-content: center;
align-items: center;
}
@media (max-width: 768px) {
.com_card .com_card-logo {
padding-bottom: 15px;
margin: 15px;
}
}
.com_card .com_card-logo img {
width: 200px;
max-width: 100%;
}
.com_card .com_card-line {
border-right: 2px solid #002FA7;
}
@media (max-width: 768px) {
.com_card .com_card-line {
border-right: none;
border-bottom: 2px solid #002FA7;
}
}
.com_card .com_card-text p {
margin-bottom: 0;
}
.com_card:hover {
box-shadow: 0 5px 10px 0 #AAAAAA;
}
.com_card.com_card--manager a {
text-decoration: underline;
}
.com_card.com_card--manager .com_card-line {
border-color: #F1F1F2;
}
.com_card.com_card--manager .com_card-logo {
justify-content: start;
}
.cards-link-row .col-md-3, .cards-link-row .col-md-6 {
margin-bottom: 2rem;
}
.cards-link-row .card-link {
position: relative;
display: block;
padding: 2rem 2rem 5rem 2rem;
border-radius: 10px;
background-color: #00AEEF;
color: white;
transition: all 500ms ease;
height: 100%;
}
.cards-link-row .card-link::after {
content: "";
position: absolute;
left: 2rem;
bottom: 2rem;
background-image: url("../img/icons/arrow-right.svg");
background-size: 32px 32px;
width: 32px;
height: 32px;
}
.cards-link-row .card-link .title {
position: relative;
font-size: 24px;
}
.cards-link-row .card-link .title:after {
position: absolute;
content: "";
height: 1px;
width: 30px;
left: 0;
bottom: -3px;
background-color: white;
transition: width 500ms ease;
}
.cards-link-row .card-link .description {
opacity: 0;
transition: opacity 500ms ease;
}
.cards-link-row .card-link:hover {
background-color: #00AEEF;
}
.cards-link-row .card-link:hover .title:after {
width: 100%;
}
.cards-link-row .card-link:hover .description {
opacity: 1;
}
.slider-news .card-news {
position: relative;
display: block;
padding: 2rem 2rem 4rem 2rem;
border-radius: 10px;
background-color: white;
color: #6E6E6E;
transition: all 500ms ease;
height: 100%;
}
.slider-news .card-news.with-bg {
background-position: center;
background-size: cover;
color: #ffffff;
}
.slider-news .card-news.with-bg:after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0.4;
background-color: #00AEEF;
z-index: 0;
transition: opacity 300ms ease;
border-radius: 10px;
}
.slider-news .card-news.with-bg:hover:after {
opacity: 1;
}
.slider-news .card-news.with-bg > * {
position: relative;
color: #ffffff;
z-index: 2;
}
.slider-news .card-news.with-bg > * a {
color: #ffffff;
position: static;
}
.slider-news .card-news .title {
position: relative;
font-size: 24px;
font-weight: 500;
}
.slider-news .card-news .date {
font-size: 12px;
}
.slider-news .card-news .description {
opacity: 0;
transition: opacity 500ms ease;
}
.slider-news .card-news a {
position: absolute;
bottom: 2rem;
left: 2rem;
}
.slider-news .card-news:hover {
background-color: #00AEEF;
color: #ffffff;
}
.slider-news .card-news:hover .description {
opacity: 1;
}
.slider-news .card-news:hover a {
color: white;
text-decoration: underline;
}
.slider-news .slick-track {
display: flex !important;
}
.slider-news .slick-slide {
margin-left: 15px;
margin-right: 15px;
height: inherit !important;
}
.slider-news .slick-slide > div {
height: 100%;
}
.slider-news .slick-list {
margin-left: -15px !important;
margin-right: -15px !important;
}
.slider-news .slick-dots {
margin-top: 1.5rem !important;
}
.slider-news .slick-dots li button {
background-color: #00AEEF;
}
.slider-news .slick-dots li.slick-active button {
background-color: #00AEEF;
}
.slider_eventos .slide {
position: relative;
padding: 5rem 0;
color: white;
background-image: linear-gradient(0deg, rgba(0, 47, 167, 0.9) 0%, rgba(0, 47, 167, 0.9) 100%), url("../img/slide-bg-1.jpeg");
background-position: 0px -56%;
background-size: cover;
}
.slider_eventos .slide .title {
font-size: 32px;
font-weight: 500;
line-height: 150%;
margin: 0;
}
.slider_eventos .slide .content {
padding: 1.5rem 0;
}
.slider_eventos .slide .content p:last-child {
margin-bottom: 0;
}
.slider_eventos .slick-dots {
position: absolute;
bottom: 10px;
left: 0;
}
.slider_eventos .slick-dots li button {
background-color: white;
}
.slider_eventos .slick-dots li.slick-active button {
background-color: #00AEEF;
}
.fw-500 {
font-weight: 500;
}
.com_box-blue {
background: #00AEEF;
padding: 40px 40px 80px;
max-width: 430px;
border-radius: 10px;
height: 96%;
min-height: 450px;
}
.com_box-blue h4, .com_box-blue .com_text-link, .com_box-blue p {
color: #ffffff;
}
.com_box-blue .com_text-link::before {
background-color: #ffffff;
bottom: -18px;
}
.com_bg-media {
position: relative;
color: #ffffff;
}
.com_bg-media h1, .com_bg-media h2, .com_bg-media h3, .com_bg-media h4, .com_bg-media h5, .com_bg-media h6, .com_bg-media p, .com_bg-media .com_text-link {
color: #ffffff;
}
.com_bg-media h3 {
text-transform: uppercase;
}
.com_bg-media .com_text_spacing {
font-weight: 500;
}
.com_bg-media .com_text-link::before {
background-color: #ffffff;
}
.com_bg-media__container {
position: absolute;
top: 0;
right: 0;
height: 100%;
width: 100%;
opacity: 0.8;
z-index: -2;
background-position-y: 30%;
background-size: cover;
}
.com_bg-media__container video, .com_bg-media__container img {
object-fit: cover;
height: 100%;
width: 100%;
}
.com_bg-media__container video {
display: none;
}
.com_bg-media::after {
content: "";
display: block;
position: absolute;
top: 0;
background: #002FA7;
opacity: 0.8;
height: 100%;
width: 100%;
z-index: -1;
}
.com_bg-media--80::after {
background: linear-gradient(0deg, rgba(58, 91, 142, 0.8), rgba(58, 91, 142, 0.8)) !important;
}
.com_bg-media--blue {
position: relative;
color: #ffffff;
background-color: #00AEEF;
}
.com_bg-media--blue h1, .com_bg-media--blue h2, .com_bg-media--blue h3, .com_bg-media--blue h4, .com_bg-media--blue h5, .com_bg-media--blue h6, .com_bg-media--blue p, .com_bg-media--blue .com_text-link {
color: #ffffff;
}
.com_bg-media--blue__container {
display: none;
position: absolute;
top: 0;
right: 0;
height: 100%;
width: 55%;
z-index: 1;
background-position-y: 30%;
background-size: cover;
clip-path: ellipse(100% 130% at 100% 50%);
}
.com_bg-media--blue__container video, .com_bg-media--blue__container img {
object-fit: cover;
height: 100%;
width: 100%;
}
.com_bg-media--blue .com_text-link:hover {
color: #00AEEF;
}
.com_bg-media--blue .com_text-link:hover::before {
background-color: #00AEEF;
}
.com_bg-media--blue .com_text-link::before {
background-color: #ffffff;
}
@media (min-width: 768px) {
.com_bg-media--blue::before {
width: 45%;
}
.com_bg-media--blue__container {
display: block;
}
}
.com_slider-projects .com_color-text a {
color: #002FA7 !important;
}
.com_slider-projects--image {
position: relative;
padding: 2.5rem 0;
}
.com_slider-projects--image:after {
content: "";
height: 100%;
background-color: #00AEEF;
position: absolute;
left: 35%;
top: 0;
width: 40%;
z-index: -1;
clip-path: polygon(85.2% 0%, 100% 0%, 15.6% 100%, 0% 100%);
}
.com_slider-projects--image img {
aspect-ratio: 16/9;
object-fit: cover;
object-position: center;
width: 400px;
max-width: 100%;
height: auto;
z-index: 1;
}
.com_slider--arrows {
padding-top: 1rem;
width: 100px;
display: flex;
justify-content: space-between;
}
@media (max-width: 768px) {
.com_slider--arrows {
padding-top: 1rem;
}
}
.com_slider--arrows .slick-arrow {
display: inline-block;
position: static;
width: 16px;
height: 16px;
border-width: 3px !important;
border-color: #000000 !important;
}
.com_contact-info .com_box-blue {
min-height: unset;
padding: 30px;
}
.com_contact-info .com_box-blue h4 {
margin-bottom: 20px;
}
.com_contact-info .com_box-blue p {
margin-bottom: 10px;
}
#list-tabs a {
cursor: pointer;
}
#list-tabs .list-tabs__text {
display: none;
animation: appearText 0.8s;
font-size: 16px;
}
#list-tabs .list-tabs__text--show {
display: block;
}
#list-tabs .list-tabs__images {
position: absolute;
top: 0;
opacity: 0;
transition: opacity 0.8s;
}
#list-tabs .list-tabs__images--show {
opacity: 1;
}
#slide-box .com_box-blue {
height: 400px;
position: relative;
}
#slide-box .slide-box__content {
display: none;
animation: appearText 0.8s;
}
#slide-box .slide-box__content--show {
display: block;
}
#slide-box .slide-box__controls {
position: absolute;
bottom: 48px;
}
#slide-box .slide-box__controls img {
cursor: pointer;
}
#slide-box .slide-box__controls img:first-child {
margin-right: 10px;
}
#slide-box .slide-box__images {
position: absolute;
top: 0;
z-index: 1;
transition: visibility 0.6s;
visibility: hidden;
}
#slide-box .slide-box__images--show-left {
visibility: visible;
animation: appearImgSlideLeft 0.6s;
z-index: 2;
}
#slide-box .slide-box__images--show-right {
visibility: visible;
animation: appearImgSlideRight 0.6s;
z-index: 2;
}
@media (min-width: 500px) {
.com_bg-media__container video {
display: block;
}
#slide-box .com_box-blue {
min-height: 450px;
}
}
@keyframes appearText {
0% {
transform: translateX(-40px);
opacity: 0;
}
100% {
transform: translateX(0px);
opacity: 1;
}
}
@keyframes appearImg {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes appearImgSlideRight {
0% {
left: 100%;
}
100% {
left: 0%;
}
}
@keyframes appearImgSlideLeft {
0% {
left: -100%;
}
100% {
left: 0%;
}
}
.com_slider_cards {
display: none;
}
.com_slider_cards .com_slider_card {
background-color: #ffffff;
height: 100%;
margin-right: 20px;
}
.com_slider_cards .com_slider_card.has-footer {
position: relative;
padding-bottom: 2rem;
}
.com_slider_cards .com_slider_card__image {
width: 100%;
}
.com_slider_cards .com_slider_card__content {
padding: 1.5rem;
}
.com_slider_cards .com_slider_card__content ul li {
display: flex;
align-items: flex-start;
list-style: none;
margin-bottom: 0.5rem;
position: relative;
font-size: 16px;
}
.com_slider_cards .com_slider_card__content ul li:before {
content: "";
width: 4px;
height: 4px;
display: inline-block;
margin-right: 1.25rem;
margin-top: 0.5rem;
background-color: #002FA7;
}
.com_slider_cards .com_slider_card__footer {
text-align: right;
padding: 1.5rem;
position: absolute;
right: 0;
bottom: 0;
color: #002FA7;
}
.com_slider_cards .slick-dots {
margin-top: 2rem !important;
}
.com_new-modal {
font-family: "Lira";
}
@media screen and (min-width: 768px) {
.com_new-modal {
margin-top: 2.5rem;
}
}
.com_new-modal#modal-video .modal-content .modal-body {
max-width: 100%;
}
.com_new-modal--logo {
margin: 2rem 0;
}
.com_new-modal--logo img {
width: 400px;
display: inline;
max-width: 100%;
}
.com_new-modal .com_close {
color: #00AEEF;
}
.com_new-modal .modal-content {
position: relative;
overflow-x: hidden;
border-radius: 5px;
background: #002FA7;
background: linear-gradient(45deg, rgb(0, 174, 239) 0%, rgb(0, 47, 167) 50%, rgb(0, 47, 167) 100%);
}
.com_new-modal .modal-content::before {
content: "";
background-image: url("../img/modal-pattern.png");
opacity: 0.2;
background-size: cover;
background-repeat: no-repeat;
position: absolute;
height: 600px;
width: 500px;
bottom: 0;
left: -100px;
}
.com_new-modal .modal-content .modal-body {
max-width: 650px;
margin: 0 auto;
color: #ffffff;
}
.com_new-modal .modal-content .modal-body h1 {
color: #ffffff;
width: 100%;
}
.com_new-modal .modal-content .modal-body h1 img {
display: block;
margin: 0 auto;
}
.com_new-modal .modal-content .modal-body h2 {
font-weight: bold;
color: #00AEEF;
margin-bottom: 12px;
font-size: 55px;
line-height: 40px;
}
.com_new-modal .modal-content .modal-body h3 {
font-size: 26px;
font-weight: bold;
color: #ffffff;
}
.com_new-modal .modal-content .modal-body p {
font-size: 21px;
}
.com_new-modal .modal-content .modal-footer {
display: flex;
width: 100%;
justify-content: space-between;
}
@media screen and (max-width: 500px) {
.com_new-modal .modal-content .modal-footer {
justify-content: center;
align-items: center;
flex-direction: column;
gap: 1rem;
}
.com_new-modal .modal-content .modal-footer .com_btn {
margin-left: 0;
}
}
.com_new-modal .modal-content .modal-footer .com_btn {
min-width: 200px;
text-align: center;
border-radius: 50px;
text-transform: uppercase;
display: flex;
justify-content: center;
align-items: center;
gap: 5px;
font-weight: bold;
}
.com_new-modal .modal-content .modal-footer .com_btn > span {
text-transform: lowercase;
color: #00AEEF;
}
.com_new-modal .modal-content .modal-footer .com_btn:hover > span {
color: #ffffff;
}
.video-container {
position: relative;
width: 100%;
padding-bottom: 56.25%; /* 16:9 aspect ratio */
height: 0;
overflow: hidden;
}
.video-container video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover; /* Asegura que el video se ajuste correctamente */
}
li.with-dropdown {
--bg: #fff;
--fg: #111;
--fg-muted: #666;
--shadow: 0 1px 4px rgba(0,0,0,.22);
position: relative;
display: flex;
align-items: stretch;
}
li.with-dropdown a[data-toggle=_dropdown] {
display: inline-flex;
align-items: center;
gap: 0.4rem;
padding: 0;
text-decoration: none;
font-weight: 500;
line-height: 1;
white-space: nowrap;
}
li.with-dropdown .com_dropdown {
position: absolute;
left: 0;
top: 100%;
min-width: 220px;
margin: 0;
padding: 0.5rem 0;
list-style: none;
background: var(--bg);
border: 1px solid #eaeaea;
box-shadow: var(--shadow);
opacity: 0;
transform: translateY(6px);
pointer-events: none;
transition: opacity 0.16s ease, transform 0.16s ease;
z-index: 1000;
}
li.with-dropdown .com_dropdown > li {
margin-bottom: 0 !important;
}
li.with-dropdown .com_dropdown > li > a {
display: block;
padding: 0.55rem 0.9rem;
color: var(--fg);
text-decoration: none;
line-height: 1.2;
}
li.with-dropdown .com_dropdown > li > a:hover, li.with-dropdown .com_dropdown > li > a:focus {
background: #f7f8fa;
color: #00AEEF;
outline: none;
}
li.with-dropdown.is-open > .com_dropdown {
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}
li.with-dropdown > a[data-toggle=_dropdown]::after {
content: "";
margin-left: 0.35rem;
border: 5px solid transparent;
border-top-color: currentColor;
transform: translateY(2px);
}
@media (max-width: 900px) {
.com_dropdown {
position: absolute;
min-width: min(86vw, 360px);
}
}
/*
===================== header =====================
*/
header {
transition: opacity 400ms ease-in, background 300ms ease-in-out;
position: relative;
top: 0;
left: 0;
background-color: #fff;
opacity: 1;
display: flex;
width: 100%;
height: 80px;
z-index: 150;
align-items: center;
}
header .com_logo img {
max-width: 200px;
max-height: 50px;
}
@media (max-width: 375px) {
header .com_logo img {
max-width: 100%;
}
}
header .container {
display: flex;
justify-content: space-between;
align-items: center;
height: 100%;
}
header .container > a {
display: inline-block;
}
@media (max-width: 992px) {
header .container {
position: relative;
}
}
@media (max-width: 768px) {
header {
position: relative;
top: 0;
height: 70px;
}
}
header.active-menu {
transition: opacity 500ms ease-in;
opacity: 0;
}
header.affix {
position: fixed;
transition: background 500ms ease;
animation: fadeInDown 500ms;
}
.com_header {
position: relative;
transition: background 500ms ease, position 500ms ease;
background: #002FA7;
}
.com_header.affix {
position: fixed;
transition: background 500ms ease;
background: #002FA7;
animation: fadeInDown 500ms;
}
.com_navigation {
display: flex;
align-items: center;
height: 100%;
margin-right: 45px;
margin-left: auto;
}
.com_navigation > ul.com_menu_primary > li > a {
text-transform: uppercase;
}
.com_navigation ul {
display: flex;
align-items: center;
margin: 0;
height: 100%;
}
.com_navigation ul > li {
display: flex;
align-items: center;
height: 100%;
color: #000000;
font-weight: bold;
font-family: "Roboto Condensed";
}
.com_navigation ul > li.com_submenu > a {
text-transform: uppercase;
}
.com_navigation ul > li > a {
transition: all 400ms ease;
position: relative;
font-size: 16px;
display: flex;
align-items: center;
height: 100%;
color: #000000;
padding: 0 14px;
}
.com_navigation ul > li > a i {
display: inline-block;
vertical-align: middle;
margin-right: 8px;
}
.com_navigation ul > li > a i:before {
font-size: 16px;
}
.com_navigation ul > li > a:hover {
background-color: rgba(255, 255, 255, 0.5);
}
.com_navigation ul > li > a.active {
background-color: rgba(255, 255, 255, 0.5);
}
.com_navigation ul > li > a.active:before {
transition: all 500ms ease;
content: "";
position: absolute;
bottom: 0;
left: 50%;
margin-left: -8px;
content: "";
display: block;
width: 0;
height: 0;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-bottom: 8px solid #ffffff;
}
.com_navigation ul > li.list-office {
height: auto;
}
.com_navigation ul > li.list-office > a {
left: 0 !important;
color: #002FA7 !important;
}
.com_navigation ul > li.com_submenu-sitios {
position: relative;
}
.com_navigation ul > li.com_submenu-sitios a:before {
right: 20px;
}
.com_navigation ul > li.com_submenu-sitios .com_box-desplegable-sitios {
right: 0;
left: auto;
}
@media (max-width: 1199px) {
.com_navigation ul li a {
padding: 0 10px;
}
}
@media (max-width: 992px) {
.com_navigation {
height: auto;
display: none;
}
.com_navigation ul li {
margin-right: 10px;
}
}
@media (max-width: 768px) {
.com_navigation ul > * {
border-top: 1px solid #FAFAFB;
}
.com_navigation ul li .com_box-desplegable {
padding-bottom: 20px;
overflow-y: scroll;
}
.com_navigation ul li .com_box-desplegable .col-md-4 {
margin-bottom: 10px;
}
.com_navigation ul li .com_box-desplegable p {
display: none;
}
.com_navigation ul li .com_box-desplegable ul li {
border: none;
}
.com_navigation ul li .com_box-desplegable ul li a::after {
display: none;
}
.com_navigation.active {
height: calc(100vh - 70px);
}
}
.com_menu-button {
position: relative;
width: 30px;
height: 25px;
}
.com_menu-button span {
display: block;
width: 30px;
height: 3px;
top: 10px;
position: absolute;
background-color: #002FA7;
}
.com_menu-button span::before, .com_menu-button span::after {
content: "";
display: block;
position: absolute;
width: 30px;
height: 3px;
background-color: #002FA7;
}
.com_menu-button span::before {
top: -10px;
}
.com_menu-button span::after {
bottom: -10px;
}
.com_menu-wrap {
width: 610px;
height: 100vh;
position: fixed;
top: 0;
right: -610px;
z-index: 200;
background-color: #001344;
overflow-y: scroll;
transition: right 500ms linear;
}
.com_menu-wrap.active {
right: 0;
transition: right 500ms linear;
}
.com_menu-wrap.active .com_menu-wrap__inner {
right: 0;
opacity: 1;
transition: right 600ms ease, opacity 600ms ease;
transition-delay: 300ms;
}
.com_menu-wrap h4,
.com_menu-wrap h5 {
color: #ffffff;
}
.com_menu-wrap h5 {
font-family: "Roboto";
}
.com_menu-wrap a {
color: #ffffff;
}
.com_menu-wrap .com_cont-search {
display: block;
position: relative;
max-width: 264px;
margin-bottom: 40px;
}
.com_menu-wrap .com_cont-search input {
font-size: 14px;
padding: 5px 0;
width: 100%;
color: #ffffff;
background: transparent;
border: none;
border-bottom: 1px solid #ffffff;
}
.com_menu-wrap .com_cont-search .icon-search {
position: absolute;
top: 4px;
right: 0;
}
.com_menu-wrap .com_cont-search .icon-search:before {
font-size: 16px;
}
.com_menu-wrap ul {
margin-top: 0;
margin-bottom: 40px;
}
.com_menu-wrap ul li {
margin-bottom: 25px;
}
.com_menu-wrap .com_text-link:before {
background-color: #ffffff;
}
.com_menu-wrap .com_display--flex ul {
width: 50%;
}
.com_menu-wrap__inner {
position: relative;
padding: 36px 95px;
right: -60px;
opacity: 0;
transition: right 0ms ease, opacity 0ms ease;
transition-delay: 700ms;
}
.com_menu-wrap__inner .icon-close {
position: absolute;
left: 425px;
text-indent: -9999px;
}
.com_menu-wrap__inner .icon-close:before, .com_menu-wrap__inner .icon-close:after {
background-color: #ffffff;
}
@media (max-width: 560px) {
.com_menu-wrap__inner {
transition: padding 500ms ease;
padding: 36px 18px;
}
}
.com_menu-wrap__bottom {
display: flex;
justify-content: space-between;
align-items: center;
background-color: #002FA7;
padding: 20px 95px;
}
.com_menu-wrap__bottom .com_text-link i {
margin-right: 10px;
}
.com_menu-wrap__bottom .com_submenu {
position: relative;
}
.com_menu-wrap__bottom .com_submenu i.icon-arrow-2 {
padding-bottom: 4px;
}
.com_menu-wrap__bottom .com_submenu i.icon-arrow-2:after {
border-left: 2.33333px solid #fff;
border-bottom: 2.33333px solid #fff;
}
.com_menu-wrap__bottom .com_submenu a.active i.icon-arrow-2:after {
transform: rotate(-225deg) translate(0px, 0px);
}
.com_menu-wrap__bottom .com_submenu .com_inner-deploy-balloon {
transition: all 600ms ease;
position: absolute;
left: 50%;
visibility: hidden;
opacity: 0;
top: -10px;
z-index: 10;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.23);
background: #ffffff;
padding: 30px 18px;
transform: translate(-50%, 0);
}
.com_menu-wrap__bottom .com_submenu .com_inner-deploy-balloon ul {
margin-bottom: 0;
}
.com_menu-wrap__bottom .com_submenu .com_inner-deploy-balloon a {
color: #002FA7;
}
.com_menu-wrap__bottom .com_submenu .com_inner-deploy-balloon a:before {
background-color: #002FA7;
}
.com_menu-wrap__bottom .com_submenu .com_inner-deploy-balloon:before {
transition: all 500ms ease;
content: "";
position: absolute;
top: -6px;
left: 50%;
margin-left: -8px;
content: "";
display: block;
border-radius: 2px;
transform: rotate(180deg);
width: 0;
height: 0;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 8px solid #ffffff;
}
.com_menu-wrap__bottom .com_submenu .com_inner-deploy-balloon.active {
top: 30px;
opacity: 1;
visibility: visible;
}
@media (max-width: 560px) {
.com_menu-wrap__bottom {
transition: padding 500ms ease;
padding: 15px 18px;
}
}
@media (max-width: 768px) {
.com_menu-wrap {
width: 95vw;
right: -95vw;
}
.com_menu-wrap__inner .icon-close {
left: auto;
right: 30px;
}
.com_menu-wrap__inner .com_mobile-grid {
display: grid;
grid-template-columns: 1fr 1fr;
}
}
@media (min-width: 768px) {
.com_desplegable {
transition: all 600ms ease;
position: absolute;
left: 0;
visibility: hidden;
opacity: 0;
filter: alpha(opacity=0);
top: 70px;
z-index: 10;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.23);
}
.com_desplegable .container {
height: 100%;
}
.com_desplegable.active {
opacity: 1;
filter: alpha(opacity=100);
top: 80px;
visibility: visible;
}
}
@media (min-width: 768px) {
.com_box-desplegable {
background-color: #ffffff;
width: 100%;
display: block;
min-height: 300px;
padding: 30px 0;
}
.com_box-desplegable:before {
left: 65%;
}
.com_box-desplegable .row {
width: 100%;
}
.com_box-desplegable img {
margin: 0 auto 20px;
}
.com_box-desplegable h5 {
margin-bottom: 10px;
color: #00AEEF;
text-align: center;
font-weight: 700;
}
}
.com_box-desplegable p {
margin-bottom: 10px;
line-height: 140%;
max-width: 238px;
margin: 0 auto;
}
.com_box-desplegable ul {
display: block;
}
.com_box-desplegable ul li {
margin: 0;
}
.com_box-desplegable ul li .com_text-link::before {
bottom: 0;
}
.com_box-desplegable ul li a {
display: inline-block;
position: relative;
font-size: 14px;
color: #FFFFFF;
min-height: auto;
padding: 10px 0;
left: 20px;
}
.com_box-desplegable-sitios {
opacity: 0;
position: absolute;
background: white;
border-radius: 2px;
-o-border-radius: 2px;
-ms-border-radius: 2px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
display: block;
min-height: 125px;
right: -20px;
left: auto;
padding: 30px 18px;
}
.com_box-desplegable-sitios:before {
left: 61%;
}
.com_box-desplegable-sitios ul {
display: flex;
flex-direction: column;
align-items: flex-start;
}
.com_box-desplegable-sitios ul li {
height: auto;
margin-bottom: 15px;
}
.com_box-desplegable-sitios ul li a {
padding: 0;
height: auto;
color: #002FA7;
}
.com_box-desplegable-sitios ul li a img {
margin-right: 24px;
}
.com_desplegable-item:hover .com_submenu-item:not(:hover) {
transition: opacity 500ms ease;
opacity: 0.3;
display: block;
}
.com_menu--main-local {
display: flex;
justify-content: space-between;
margin: auto;
width: 100%;
flex-wrap: wrap;
}
@media screen and (max-width: 992px) {
.com_menu--main-local li {
padding: 1rem 2rem;
min-width: 50%;
}
}
.com_menu--main-local li a {
font-size: 18px;
color: #000000;
font-weight: 500;
}
.com_menu--main-local li.separator {
position: relative;
}
@media screen and (max-width: 992px) {
.com_menu--main-local li.separator {
display: none;
}
}
.com_menu--main-local li.separator:after {
content: "";
position: absolute;
right: 0;
top: -20px;
height: 65px;
border-right: 1px solid #BDBDBD;
transform: rotate(20deg);
}
/*
===================== Footer =====================
*/
footer {
background-color: #ffffff;
padding: 58px 0 40px;
color: #000000;
}
footer a {
transition: color 300ms linear;
color: #000000;
}
footer a:hover {
color: rgba(0, 0, 0, 0.5);
}
footer h6 {
font-family: "Roboto Condensed";
font-weight: bold;
color: #000000;
font-size: 1.25rem;
text-transform: uppercase;
}
footer ul li {
margin-bottom: 20px;
font-size: 1rem;
}
footer ul.com_list-footer {
margin-bottom: 0;
}
footer ul.com_list-footer li {
font-family: "Roboto Condensed";
font-size: 14px;
font-weight: 500;
}
footer ul.com_list-footer li + li {
border-left: 1px solid #D8D8D8;
margin-left: 20px;
}
footer ul.com_list-footer li + li a {
padding-left: 20px;
}
footer .com_footer__logo--wrapper {
max-width: 300px;
}
footer .com_footer__logo--wrapper .com_footer__logo {
display: block;
margin-bottom: 1.25rem;
}
footer .com_footer__logo--wrapper .com_footer__logo + p {
font-size: 12px;
line-height: 140%;
}
footer hr {
border-bottom: 1px solid #D8D8D8;
margin: 50px 0 20px;
}
footer p {
color: #000000;
}
footer .icon-linkedin:before {
font-size: 30px;
}
footer .com_small {
font-size: 12px !important;
}
footer .com_display--flex ul {
margin-top: 0;
}
footer .com_display--flex ul:first-child {
width: 50%;
}
footer .com_border-lateral {
height: 100%;
display: block;
padding-left: 20px;
border-left: 1px solid #ffffff;
}
footer .com_rrss {
display: flex;
align-items: center;
justify-content: center;
background-color: #002FA7;
border-radius: 100%;
width: 48px;
height: 48px;
margin-right: 15px;
}
footer .com_rrss img {
width: 18px;
}
@media (min-width: 992px) {
footer {
height: 540px;
}
footer .com_footer__logo img {
width: 100%;
}
}
@media (min-width: 768px) {
footer .acc__title:after {
display: none;
}
footer .acc__panel {
display: block !important;
}
}
@media (max-width: 992px) {
footer {
padding: 50px 0 40px;
}
footer .com_border-lateral {
border: none;
margin-top: 30px;
padding: 0;
}
}
@media (max-width: 359px) {
footer ul.com_list-footer li {
font-size: 13px;
}
footer ul.com_list-footer li + li {
margin-left: 15px;
}
footer ul.com_list-footer li + li a {
padding-left: 15px;
}
}
/*
===================== Breadcrums =====================
*/
.com_rcrumbs {
white-space: nowrap;
margin-bottom: 30px;
}
.com_rcrumbs .com_breadcrums {
display: flex;
margin: 0;
}
.com_rcrumbs .com_breadcrums li {
margin-right: 7px;
display: none;
font-size: 12px;
}
.com_rcrumbs .com_breadcrums li a {
color: #FFFFFF;
margin-right: 7px;
display: inline-block;
}
.com_rcrumbs .com_breadcrums li a i {
font-style: normal;
font-size: 14px;
vertical-align: baseline;
}
.com_rcrumbs .com_breadcrums li a i:before {
color: #002FA7;
}
.com_rcrumbs .com_breadcrums li .divider {
display: inline-block;
width: 7px;
height: 12px;
position: relative;
}
.com_rcrumbs .com_breadcrums li .divider:before {
position: absolute;
z-index: 10;
top: 3px;
left: -2px;
content: "";
width: 7px;
height: 7px;
border-left: 1.2px solid #4A4E57;
border-bottom: 1.2px solid #4A4E57;
transform: rotate(-135deg);
}
.com_rcrumbs .com_breadcrums li.show {
display: flex;
align-items: center;
}
.com_rcrumbs .com_breadcrums li.ellipsis {
display: block;
text-overflow: ellipsis;
overflow: hidden;
min-width: 100px;
white-space: nowrap;
}
.com_rcrumbs .com_breadcrums li:last-child {
margin-right: 0;
}
@media (max-width: 560px) {
.com_rcrumbs .com_breadcrums li a {
margin-right: 2px;
}
}
/*
===================== Collapse =====================
*/
.acc__title {
position: relative;
cursor: pointer;
display: block;
margin-bottom: 26px;
}
.acc__title::after {
width: 10px;
height: 10px;
border-right: 1px solid #ffffff;
border-bottom: 1px solid #ffffff;
position: absolute;
right: 10px;
content: " ";
top: 7px;
transform: rotate(45deg);
transition: all 600ms ease-in-out;
}
.acc__title.active::after {
transform: rotate(-135deg);
transition: all 600ms ease-in-out;
}
.acc__panel {
display: none;
margin: 0;
text-align: left;
}
/*
===================== Slider =====================
*/
.slick-slider {
position: relative;
display: block;
box-sizing: border-box;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list {
position: relative;
overflow: hidden;
display: block;
margin: 0;
padding: 0;
}
.slick-list:focus {
outline: none;
}
.slick-list.dragging {
cursor: pointer;
cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track {
position: relative;
left: 0;
top: 0;
display: block;
}
.slick-track:before, .slick-track:after {
content: "";
display: table;
}
.slick-track:after {
clear: both;
}
.slick-loading .slick-track {
visibility: hidden;
}
.slick-slide {
float: left;
height: 100%;
min-height: 1px;
}
.slick-slide img {
display: block;
width: 100%;
}
.slick-slide .com_post__content__plus {
width: auto;
}
@media (max-width: 560px) {
.slick-slide img {
width: 100%;
}
.slick-slide .com_post__content__plus {
width: auto;
}
}
.slick-slide.slick-loading img {
display: none;
}
.slick-slide.dragging img {
pointer-events: none;
}
.slick-initialized .slick-slide {
display: block;
}
.slick-loading .slick-slide {
visibility: hidden;
}
.slick-vertical .slick-slide {
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
.slick-arrow {
z-index: 10;
width: 32px;
height: 32px;
color: transparent;
cursor: pointer;
position: absolute;
top: 50%;
background: transparent;
border-color: #002FA7;
}
.slick-arrow.slick-prev {
border-bottom: 4px solid #002FA7;
border-left: 4px solid #002FA7;
transform: rotate(45deg);
left: 0;
border-top: none;
border-right: none;
}
.slick-arrow.slick-next {
right: 0;
border-bottom: 4px solid #002FA7;
border-left: 4px solid #002FA7;
border-top: none;
border-right: none;
transform: rotate(-135deg);
}
.slick-dots {
display: inline-block;
text-align: center;
margin: 0 !important;
width: 100%;
}
.slick-dots li {
display: inline-block;
width: 12px;
height: 12px;
margin: 0 3px;
font-size: 1px;
}
.slick-dots li button {
display: inline-block;
width: 12px;
height: 12px;
border-radius: 50%;
border: none !important;
background-color: #000000;
border: none;
text-indent: -9999px;
}
.slick-dots li.slick-active button {
background-color: #002FA7;
}
.com_slider-noticias .slick-dots {
position: static;
}
@media (max-width: 767px) {
.com_slider-noticias .item {
margin-bottom: 20px;
}
}
.com_slider-single .slick-arrow {
top: auto;
bottom: 0;
transform: rotate(0deg);
border: none;
width: 35px;
height: 35px;
background: url(../../assets/img/icons/arrow.svg) 0 0 no-repeat;
}
.com_slider-single .slick-arrow.slick-prev {
left: auto;
right: 35px;
}
.com_slider-single .slick-arrow.slick-next {
transform: rotate(-180deg);
}
.com_slider-vision {
background-color: #1F7E7F;
height: 100vh;
}
.com_slider-vision img {
width: auto;
}
.com_slider-vision .section {
height: 100vh;
}
.com_slider-vision .slick-dots {
position: absolute;
bottom: 90px;
list-style-type: none;
margin: 25px 0 0;
padding: 0;
}
.com_slider-vision .slick-dots li {
width: auto;
height: auto;
display: inline-block;
padding: 0 5px;
}
.com_slider-vision .slick-dots li button {
position: relative;
background: transparent;
cursor: pointer;
border-radius: 0 !important;
width: auto;
height: auto;
margin: 0 10px;
font-size: 14px;
color: #fff;
border: none;
background: transparent;
text-indent: 1px;
}
.com_slider-vision .slick-dots li button:before {
content: none;
}
.com_slider-vision .slick-dots li button:after {
content: "";
position: absolute;
height: 2px;
width: 20px;
background: #ffffff;
opacity: 0.5;
left: 0;
bottom: -6px;
transition: all 400ms ease;
}
.com_slider-vision .slick-dots li button:hover:after {
content: "";
position: absolute;
height: 2px;
width: 100%;
background: #ffffff;
left: 0;
bottom: -6px;
transition: all 400ms ease;
}
.com_slider-vision .slick-dots li.slick-active button:after {
content: "";
position: absolute;
height: 2px;
width: 100%;
background: #ffffff;
opacity: 1;
left: 0;
bottom: -6px;
transition: all 400ms ease;
}
@media (max-width: 1600px) {
.com_slider-vision .slick-dots {
bottom: 30px;
}
}
@media (max-width: 1280px) {
.com_slider-vision .slick-dots {
bottom: 18px;
}
.com_slider-vision .slick-dots li button {
margin: 0;
}
}
@media (max-width: 768px) {
.com_slider-vision {
height: auto;
background-color: #3A5B8E;
}
.com_slider-vision .section {
height: auto !important;
min-height: 400px;
padding: 40px 0;
}
.com_slider-vision .section:first-child {
padding: 150px 0 20px;
}
.com_slider-vision .section .container {
height: auto;
}
.com_slider-vision .section .container .row {
height: auto;
}
}
/*
== malihu jquery custom scrollbar plugin ==
Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller
*/
/*
CONTENTS:
1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited).
2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar.
3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar.
4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars.
5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars.
6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS
6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes.
*/
/*
------------------------------------------------------------------------------------------------------------------------
1. BASIC STYLE
------------------------------------------------------------------------------------------------------------------------
*/
.mCustomScrollbar {
-ms-touch-action: pinch-zoom;
touch-action: pinch-zoom; /* direct pointer events to js */
}
.mCustomScrollbar.mCS_no_scrollbar, .mCustomScrollbar.mCS_touch_action {
-ms-touch-action: auto;
touch-action: auto;
}
.mCustomScrollBox { /* contains plugin's markup */
position: relative;
overflow: hidden;
height: 100%;
max-width: 100%;
outline: none;
direction: ltr;
}
.mCSB_container { /* contains the original content */
overflow: hidden;
width: auto;
height: auto;
}
/*
------------------------------------------------------------------------------------------------------------------------
2. VERTICAL SCROLLBAR
y-axis
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_inside > .mCSB_container {
margin-right: 30px;
}
.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
margin-right: 0;
} /* non-visible scrollbar */
.mCS-dir-rtl > .mCSB_inside > .mCSB_container { /* RTL direction/left-side scrollbar */
margin-right: 0;
margin-left: 30px;
}
.mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
margin-left: 0;
} /* RTL direction/left-side scrollbar */
.mCSB_scrollTools { /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */
position: absolute;
width: 16px;
height: auto;
left: auto;
top: 0;
right: 0;
bottom: 0;
}
.mCSB_outside + .mCSB_scrollTools {
right: -26px;
} /* scrollbar position: outside */
.mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools,
.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools { /* RTL direction/left-side scrollbar */
right: auto;
left: 0;
}
.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools {
left: -26px;
} /* RTL direction/left-side scrollbar (scrollbar position: outside) */
.mCSB_scrollTools .mCSB_draggerContainer { /* contains the draggable element and dragger rail markup */
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
height: auto;
}
.mCSB_scrollTools a + .mCSB_draggerContainer {
margin: 20px 0;
}
.mCSB_scrollTools .mCSB_draggerRail {
width: 2px;
height: 100%;
margin: 0 auto;
-webkit-border-radius: 16px;
-moz-border-radius: 16px;
border-radius: 16px;
}
.mCSB_scrollTools .mCSB_dragger { /* the draggable element */
cursor: pointer;
width: 100%;
height: 30px; /* minimum dragger height */
z-index: 1;
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { /* the dragger element */
position: relative;
width: 4px;
height: 100%;
margin: 0 auto;
-webkit-border-radius: 16px;
-moz-border-radius: 16px;
border-radius: 16px;
text-align: center;
}
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
width: 12px; /* auto-expanded scrollbar */
}
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
width: 8px; /* auto-expanded scrollbar */
}
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown {
display: block;
position: absolute;
height: 20px;
width: 100%;
overflow: hidden;
margin: 0 auto;
cursor: pointer;
}
.mCSB_scrollTools .mCSB_buttonDown {
bottom: 0;
}
/*
------------------------------------------------------------------------------------------------------------------------
3. HORIZONTAL SCROLLBAR
x-axis
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_horizontal.mCSB_inside > .mCSB_container {
margin-right: 0;
margin-bottom: 30px;
}
.mCSB_horizontal.mCSB_outside > .mCSB_container {
min-height: 100%;
}
.mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden {
margin-bottom: 0;
} /* non-visible scrollbar */
.mCSB_scrollTools.mCSB_scrollTools_horizontal {
width: auto;
height: 16px;
top: auto;
right: 0;
bottom: 0;
left: 0;
}
.mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal {
bottom: -26px;
} /* scrollbar position: outside */
.mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer {
margin: 0 20px;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
height: 2px;
margin: 7px 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger {
width: 30px; /* minimum dragger width */
height: 100%;
left: 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
width: 100%;
height: 4px;
margin: 6px auto;
}
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
height: 12px; /* auto-expanded scrollbar */
margin: 2px auto;
}
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
height: 8px; /* auto-expanded scrollbar */
margin: 4px 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft,
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
display: block;
position: absolute;
width: 20px;
height: 100%;
overflow: hidden;
margin: 0 auto;
cursor: pointer;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft {
left: 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
right: 0;
}
/*
------------------------------------------------------------------------------------------------------------------------
4. VERTICAL AND HORIZONTAL SCROLLBARS
yx-axis
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_container_wrapper {
position: absolute;
height: auto;
width: auto;
overflow: hidden;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin-right: 30px;
margin-bottom: 30px;
}
.mCSB_container_wrapper > .mCSB_container {
padding-right: 30px;
padding-bottom: 30px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical {
bottom: 20px;
}
.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal {
right: 20px;
}
/* non-visible horizontal scrollbar */
.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical {
bottom: 0;
}
/* non-visible vertical scrollbar/RTL direction/left-side scrollbar */
.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal {
right: 0;
}
/* RTL direction/left-side scrollbar */
.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal {
left: 20px;
}
/* non-visible scrollbar/RTL direction/left-side scrollbar */
.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal {
left: 0;
}
.mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper { /* RTL direction/left-side scrollbar */
margin-right: 0;
margin-left: 30px;
}
.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container {
padding-right: 0;
}
.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container {
padding-bottom: 0;
}
.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden {
margin-right: 0; /* non-visible scrollbar */
margin-left: 0;
}
/* non-visible horizontal scrollbar */
.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden {
margin-bottom: 0;
}
/*
------------------------------------------------------------------------------------------------------------------------
5. TRANSITIONS
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_scrollTools,
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight {
-webkit-transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
-moz-transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
-o-transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
}
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail {
-webkit-transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
-moz-transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
-o-transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
}
/*
------------------------------------------------------------------------------------------------------------------------
6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS
------------------------------------------------------------------------------------------------------------------------
*/
/*
----------------------------------------
6.1 THEMES
----------------------------------------
*/
/* default theme ("light") */
.mCSB_scrollTools {
opacity: 0.75;
filter: "alpha(opacity=75)";
-ms-filter: "alpha(opacity=75)";
}
.mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools,
.mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools {
opacity: 0;
filter: "alpha(opacity=0)";
-ms-filter: "alpha(opacity=0)";
}
.mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollBox:hover > .mCSB_scrollTools,
.mCustomScrollBox:hover ~ .mCSB_scrollTools,
.mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools,
.mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools {
opacity: 1;
filter: "alpha(opacity=100)";
-ms-filter: "alpha(opacity=100)";
}
.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.4);
filter: "alpha(opacity=40)";
-ms-filter: "alpha(opacity=40)";
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.75);
filter: "alpha(opacity=75)";
-ms-filter: "alpha(opacity=75)";
}
.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.85);
filter: "alpha(opacity=85)";
-ms-filter: "alpha(opacity=85)";
}
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.9);
filter: "alpha(opacity=90)";
-ms-filter: "alpha(opacity=90)";
}
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight {
background-repeat: no-repeat;
opacity: 0.4;
filter: "alpha(opacity=40)";
-ms-filter: "alpha(opacity=40)";
}
.mCSB_scrollTools .mCSB_buttonUp {
background-position: 0 0;
/*
sprites locations
light: 0 0, -16px 0, -32px 0, -48px 0, 0 -72px, -16px -72px, -32px -72px
dark: -80px 0, -96px 0, -112px 0, -128px 0, -80px -72px, -96px -72px, -112px -72px
*/
}
.mCSB_scrollTools .mCSB_buttonDown {
background-position: 0 -20px;
/*
sprites locations
light: 0 -20px, -16px -20px, -32px -20px, -48px -20px, 0 -92px, -16px -92px, -32px -92px
dark: -80px -20px, -96px -20px, -112px -20px, -128px -20px, -80px -92px, -96px -92px, -112 -92px
*/
}
.mCSB_scrollTools .mCSB_buttonLeft {
background-position: 0 -40px;
/*
sprites locations
light: 0 -40px, -20px -40px, -40px -40px, -60px -40px, 0 -112px, -20px -112px, -40px -112px
dark: -80px -40px, -100px -40px, -120px -40px, -140px -40px, -80px -112px, -100px -112px, -120px -112px
*/
}
.mCSB_scrollTools .mCSB_buttonRight {
background-position: 0 -56px;
/*
sprites locations
light: 0 -56px, -20px -56px, -40px -56px, -60px -56px, 0 -128px, -20px -128px, -40px -128px
dark: -80px -56px, -100px -56px, -120px -56px, -140px -56px, -80px -128px, -100px -128px, -120px -128px
*/
}
.mCSB_scrollTools .mCSB_buttonUp:hover,
.mCSB_scrollTools .mCSB_buttonDown:hover,
.mCSB_scrollTools .mCSB_buttonLeft:hover,
.mCSB_scrollTools .mCSB_buttonRight:hover {
opacity: 0.75;
filter: "alpha(opacity=75)";
-ms-filter: "alpha(opacity=75)";
}
.mCSB_scrollTools .mCSB_buttonUp:active,
.mCSB_scrollTools .mCSB_buttonDown:active,
.mCSB_scrollTools .mCSB_buttonLeft:active,
.mCSB_scrollTools .mCSB_buttonRight:active {
opacity: 0.9;
filter: "alpha(opacity=90)";
-ms-filter: "alpha(opacity=90)";
}
/* theme: "dark" */
.mCS-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.15);
}
.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -80px 0;
}
.mCS-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -80px -20px;
}
.mCS-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -80px -40px;
}
.mCS-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -80px -56px;
}
/* ---------------------------------------- */
/* theme: "light-2", "dark-2" */
.mCS-light-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail {
width: 4px;
background-color: #fff;
background-color: rgba(255, 255, 255, 0.1);
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
}
.mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 4px;
background-color: #fff;
background-color: rgba(255, 255, 255, 0.75);
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
}
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
width: 100%;
height: 4px;
margin: 6px auto;
}
.mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.85);
}
.mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.9);
}
.mCS-light-2.mCSB_scrollTools .mCSB_buttonUp {
background-position: -32px 0;
}
.mCS-light-2.mCSB_scrollTools .mCSB_buttonDown {
background-position: -32px -20px;
}
.mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -40px -40px;
}
.mCS-light-2.mCSB_scrollTools .mCSB_buttonRight {
background-position: -40px -56px;
}
/* theme: "dark-2" */
.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.1);
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp {
background-position: -112px 0;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown {
background-position: -112px -20px;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -120px -40px;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight {
background-position: -120px -56px;
}
/* ---------------------------------------- */
/* theme: "light-thick", "dark-thick" */
.mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail {
width: 4px;
background-color: #fff;
background-color: rgba(255, 255, 255, 0.1);
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 6px;
background-color: #fff;
background-color: rgba(255, 255, 255, 0.75);
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
height: 4px;
margin: 6px 0;
}
.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
width: 100%;
height: 6px;
margin: 5px auto;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.85);
}
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.9);
}
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp {
background-position: -16px 0;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown {
background-position: -16px -20px;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -20px -40px;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight {
background-position: -20px -56px;
}
/* theme: "dark-thick" */
.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.1);
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp {
background-position: -96px 0;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown {
background-position: -96px -20px;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -100px -40px;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight {
background-position: -100px -56px;
}
/* ---------------------------------------- */
/* theme: "light-thin", "dark-thin" */
.mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.1);
}
.mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 2px;
}
.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
}
.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
width: 100%;
height: 2px;
margin: 7px auto;
}
/* theme "dark-thin" */
.mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.15);
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp {
background-position: -80px 0;
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown {
background-position: -80px -20px;
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -80px -40px;
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight {
background-position: -80px -56px;
}
/* ---------------------------------------- */
/* theme "rounded", "rounded-dark", "rounded-dots", "rounded-dots-dark" */
.mCS-rounded.mCSB_scrollTools .mCSB_draggerRail {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.15);
}
.mCS-rounded.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger {
height: 14px;
}
.mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 14px;
margin: 0 1px;
}
.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger {
width: 14px;
}
.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
height: 14px;
margin: 1px 0;
}
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
width: 16px; /* auto-expanded scrollbar */
height: 16px;
margin: -1px 0;
}
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
width: 4px; /* auto-expanded scrollbar */
}
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
height: 16px; /* auto-expanded scrollbar */
width: 16px;
margin: 0 -1px;
}
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
height: 4px; /* auto-expanded scrollbar */
margin: 6px 0;
}
.mCS-rounded.mCSB_scrollTools .mCSB_buttonUp {
background-position: 0 -72px;
}
.mCS-rounded.mCSB_scrollTools .mCSB_buttonDown {
background-position: 0 -92px;
}
.mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft {
background-position: 0 -112px;
}
.mCS-rounded.mCSB_scrollTools .mCSB_buttonRight {
background-position: 0 -128px;
}
/* theme "rounded-dark", "rounded-dots-dark" */
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.15);
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -80px -72px;
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -80px -92px;
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -80px -112px;
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -80px -128px;
}
/* theme "rounded-dots", "rounded-dots-dark" */
.mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail {
width: 4px;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
background-color: transparent;
background-position: center;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg==");
background-repeat: repeat-y;
opacity: 0.3;
filter: "alpha(opacity=30)";
-ms-filter: "alpha(opacity=30)";
}
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
height: 4px;
margin: 6px 0;
background-repeat: repeat-x;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp {
background-position: -16px -72px;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown {
background-position: -16px -92px;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -20px -112px;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight {
background-position: -20px -128px;
}
/* theme "rounded-dots-dark" */
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII=");
}
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -96px -72px;
}
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -96px -92px;
}
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -100px -112px;
}
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -100px -128px;
}
/* ---------------------------------------- */
/* theme "3d", "3d-dark", "3d-thick", "3d-thick-dark" */
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-repeat: repeat-y;
background-image: -moz-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0.5)), color-stop(100%, rgba(255, 255, 255, 0)));
background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -o-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -ms-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: linear-gradient(to right, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
}
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
background-repeat: repeat-x;
background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.5)), color-stop(100%, rgba(255, 255, 255, 0)));
background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
}
/* theme "3d", "3d-dark" */
.mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger {
height: 70px;
}
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger {
width: 70px;
}
.mCS-3d.mCSB_scrollTools,
.mCS-3d-dark.mCSB_scrollTools {
opacity: 1;
filter: "alpha(opacity=30)";
-ms-filter: "alpha(opacity=30)";
}
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
-webkit-border-radius: 16px;
-moz-border-radius: 16px;
border-radius: 16px;
}
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail {
width: 8px;
background-color: #000;
background-color: rgba(0, 0, 0, 0.2);
box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.5), inset -1px 0 1px rgba(255, 255, 255, 0.2);
}
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #555;
}
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 8px;
}
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
height: 8px;
margin: 4px 0;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5), inset 0 -1px 1px rgba(255, 255, 255, 0.2);
}
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
width: 100%;
height: 8px;
margin: 4px auto;
}
.mCS-3d.mCSB_scrollTools .mCSB_buttonUp {
background-position: -32px -72px;
}
.mCS-3d.mCSB_scrollTools .mCSB_buttonDown {
background-position: -32px -92px;
}
.mCS-3d.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -40px -112px;
}
.mCS-3d.mCSB_scrollTools .mCSB_buttonRight {
background-position: -40px -128px;
}
/* theme "3d-dark" */
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.1);
box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1);
}
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
}
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -112px -72px;
}
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -112px -92px;
}
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -120px -112px;
}
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -120px -128px;
}
/* ---------------------------------------- */
/* theme: "3d-thick", "3d-thick-dark" */
.mCS-3d-thick.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools {
opacity: 1;
filter: "alpha(opacity=30)";
-ms-filter: "alpha(opacity=30)";
}
.mCS-3d-thick.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools,
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer {
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.mCSB_inside + .mCS-3d-thick.mCSB_scrollTools_vertical,
.mCSB_inside + .mCS-3d-thick-dark.mCSB_scrollTools_vertical {
right: 1px;
}
.mCS-3d-thick.mCSB_scrollTools_vertical,
.mCS-3d-thick-dark.mCSB_scrollTools_vertical {
box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5);
}
.mCS-3d-thick.mCSB_scrollTools_horizontal,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal {
bottom: 1px;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5);
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4);
width: 12px;
margin: 2px;
position: absolute;
height: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4);
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #555;
}
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
height: 12px;
width: auto;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer {
background-color: #000;
background-color: rgba(0, 0, 0, 0.05);
box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1);
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail {
background-color: transparent;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp {
background-position: -32px -72px;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown {
background-position: -32px -92px;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -40px -112px;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight {
background-position: -40px -128px;
}
/* theme: "3d-thick-dark" */
.mCS-3d-thick-dark.mCSB_scrollTools {
box-shadow: inset 0 0 14px rgba(0, 0, 0, 0.2);
}
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal {
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.2);
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4), inset -1px 0 0 rgba(0, 0, 0, 0.2);
}
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), inset 0 -1px 0 rgba(0, 0, 0, 0.2);
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #777;
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer {
background-color: #fff;
background-color: rgba(0, 0, 0, 0.05);
box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1);
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: transparent;
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -112px -72px;
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -112px -92px;
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -120px -112px;
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -120px -128px;
}
/* ---------------------------------------- */
/* theme: "minimal", "minimal-dark" */
.mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical,
.mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical {
right: 0;
margin: 12px 0;
}
.mCustomScrollBox.mCS-minimal + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal {
bottom: 0;
margin: 0 12px;
}
/* RTL direction/left-side scrollbar */
.mCS-dir-rtl > .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical,
.mCS-dir-rtl > .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical {
left: 0;
right: auto;
}
.mCS-minimal.mCSB_scrollTools .mCSB_draggerRail,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: transparent;
}
.mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger {
height: 50px;
}
.mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger {
width: 50px;
}
.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.2);
filter: "alpha(opacity=20)";
-ms-filter: "alpha(opacity=20)";
}
.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.5);
filter: "alpha(opacity=50)";
-ms-filter: "alpha(opacity=50)";
}
/* theme: "minimal-dark" */
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.2);
filter: "alpha(opacity=20)";
-ms-filter: "alpha(opacity=20)";
}
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.5);
filter: "alpha(opacity=50)";
-ms-filter: "alpha(opacity=50)";
}
/* ---------------------------------------- */
/* theme "light-3", "dark-3" */
.mCS-light-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail {
width: 6px;
background-color: #000;
background-color: rgba(0, 0, 0, 0.2);
}
.mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 6px;
}
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
height: 6px;
margin: 5px 0;
}
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
width: 12px;
}
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
height: 12px;
margin: 2px 0;
}
.mCS-light-3.mCSB_scrollTools .mCSB_buttonUp {
background-position: -32px -72px;
}
.mCS-light-3.mCSB_scrollTools .mCSB_buttonDown {
background-position: -32px -92px;
}
.mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -40px -112px;
}
.mCS-light-3.mCSB_scrollTools .mCSB_buttonRight {
background-position: -40px -128px;
}
/* theme "dark-3" */
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.1);
}
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp {
background-position: -112px -72px;
}
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown {
background-position: -112px -92px;
}
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -120px -112px;
}
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight {
background-position: -120px -128px;
}
/* ---------------------------------------- */
/* theme "inset", "inset-dark", "inset-2", "inset-2-dark", "inset-3", "inset-3-dark" */
.mCS-inset.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail {
width: 12px;
background-color: #000;
background-color: rgba(0, 0, 0, 0.2);
}
.mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 6px;
margin: 3px 5px;
position: absolute;
height: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
height: 6px;
margin: 5px 3px;
position: absolute;
width: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
height: 12px;
margin: 2px 0;
}
.mCS-inset.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp {
background-position: -32px -72px;
}
.mCS-inset.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown {
background-position: -32px -92px;
}
.mCS-inset.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -40px -112px;
}
.mCS-inset.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight {
background-position: -40px -128px;
}
/* theme "inset-dark", "inset-2-dark", "inset-3-dark" */
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.1);
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -112px -72px;
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -112px -92px;
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -120px -112px;
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -120px -128px;
}
/* theme "inset-2", "inset-2-dark" */
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: transparent;
border-width: 1px;
border-style: solid;
border-color: #fff;
border-color: rgba(255, 255, 255, 0.2);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail {
border-color: #000;
border-color: rgba(0, 0, 0, 0.2);
}
/* theme "inset-3", "inset-3-dark" */
.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.6);
}
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.6);
}
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.75);
}
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.85);
}
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.9);
}
/* ---------------------------------------- */
/*
===================== Tabs =====================
*/
.nav-tabs {
border-bottom: 1px solid #E5E5E5;
}
.nav-tabs .nav-link {
padding: 1rem 0;
display: inline-block;
margin-right: 1rem;
color: #8E8E8E;
}
.nav-tabs .nav-link.active {
border-bottom: 3px solid #002FA7;
color: #002FA7;
}
.tab-content > .fade {
transition: opacity 0.15s linear;
}
.tab-content > .fade:not(.show) {
opacity: 0;
}
.tab-content > .tab-pane {
display: none;
}
.tab-content > .tab-pane.active {
display: block;
}
.animated {
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.animated.infinite {
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
.animated.hinge {
-webkit-animation-duration: 2s;
animation-duration: 2s;
}
@-webkit-keyframes bounce {
0%, 20%, 53%, 80%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
40%, 43% {
-webkit-transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-webkit-transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0, -4px, 0);
transform: translate3d(0, -4px, 0);
}
}
@keyframes bounce {
0%, 20%, 53%, 80%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
40%, 43% {
-webkit-transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -30px, 0);
-ms-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-webkit-transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -15px, 0);
-ms-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0, -4px, 0);
-ms-transform: translate3d(0, -4px, 0);
transform: translate3d(0, -4px, 0);
}
}
.bounce {
-webkit-animation-name: bounce;
animation-name: bounce;
-webkit-transform-origin: center bottom;
-ms-transform-origin: center bottom;
transform-origin: center bottom;
}
@-webkit-keyframes flash {
0%, 50%, 100% {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
@keyframes flash {
0%, 50%, 100% {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
.flash {
-webkit-animation-name: flash;
animation-name: flash;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes pulse {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
50% {
-webkit-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes pulse {
0% {
-webkit-transform: scale3d(1, 1, 1);
-ms-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
50% {
-webkit-transform: scale3d(1.05, 1.05, 1.05);
-ms-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
-ms-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.pulse {
-webkit-animation-name: pulse;
animation-name: pulse;
}
@-webkit-keyframes rubberBand {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
30% {
-webkit-transform: scale3d(1.25, 0.75, 1);
transform: scale3d(1.25, 0.75, 1);
}
40% {
-webkit-transform: scale3d(0.75, 1.25, 1);
transform: scale3d(0.75, 1.25, 1);
}
50% {
-webkit-transform: scale3d(1.15, 0.85, 1);
transform: scale3d(1.15, 0.85, 1);
}
65% {
-webkit-transform: scale3d(0.95, 1.05, 1);
transform: scale3d(0.95, 1.05, 1);
}
75% {
-webkit-transform: scale3d(1.05, 0.95, 1);
transform: scale3d(1.05, 0.95, 1);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes rubberBand {
0% {
-webkit-transform: scale3d(1, 1, 1);
-ms-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
30% {
-webkit-transform: scale3d(1.25, 0.75, 1);
-ms-transform: scale3d(1.25, 0.75, 1);
transform: scale3d(1.25, 0.75, 1);
}
40% {
-webkit-transform: scale3d(0.75, 1.25, 1);
-ms-transform: scale3d(0.75, 1.25, 1);
transform: scale3d(0.75, 1.25, 1);
}
50% {
-webkit-transform: scale3d(1.15, 0.85, 1);
-ms-transform: scale3d(1.15, 0.85, 1);
transform: scale3d(1.15, 0.85, 1);
}
65% {
-webkit-transform: scale3d(0.95, 1.05, 1);
-ms-transform: scale3d(0.95, 1.05, 1);
transform: scale3d(0.95, 1.05, 1);
}
75% {
-webkit-transform: scale3d(1.05, 0.95, 1);
-ms-transform: scale3d(1.05, 0.95, 1);
transform: scale3d(1.05, 0.95, 1);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
-ms-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.rubberBand {
-webkit-animation-name: rubberBand;
animation-name: rubberBand;
}
@-webkit-keyframes shake {
0%, 100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%, 40%, 60%, 80% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
@keyframes shake {
0%, 100% {
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translate3d(-10px, 0, 0);
-ms-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%, 40%, 60%, 80% {
-webkit-transform: translate3d(10px, 0, 0);
-ms-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
.shake {
-webkit-animation-name: shake;
animation-name: shake;
}
@-webkit-keyframes swing {
20% {
-webkit-transform: rotate3d(0, 0, 1, 15deg);
transform: rotate3d(0, 0, 1, 15deg);
}
40% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg);
}
60% {
-webkit-transform: rotate3d(0, 0, 1, 5deg);
transform: rotate3d(0, 0, 1, 5deg);
}
80% {
-webkit-transform: rotate3d(0, 0, 1, -5deg);
transform: rotate3d(0, 0, 1, -5deg);
}
100% {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
}
@keyframes swing {
20% {
-webkit-transform: rotate3d(0, 0, 1, 15deg);
-ms-transform: rotate3d(0, 0, 1, 15deg);
transform: rotate3d(0, 0, 1, 15deg);
}
40% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
-ms-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg);
}
60% {
-webkit-transform: rotate3d(0, 0, 1, 5deg);
-ms-transform: rotate3d(0, 0, 1, 5deg);
transform: rotate3d(0, 0, 1, 5deg);
}
80% {
-webkit-transform: rotate3d(0, 0, 1, -5deg);
-ms-transform: rotate3d(0, 0, 1, -5deg);
transform: rotate3d(0, 0, 1, -5deg);
}
100% {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
-ms-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
}
.swing {
-webkit-transform-origin: top center;
-ms-transform-origin: top center;
transform-origin: top center;
-webkit-animation-name: swing;
animation-name: swing;
}
@-webkit-keyframes tada {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
10%, 20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
}
30%, 50%, 70%, 90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
}
40%, 60%, 80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes tada {
0% {
-webkit-transform: scale3d(1, 1, 1);
-ms-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
10%, 20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
-ms-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
}
30%, 50%, 70%, 90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
-ms-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
}
40%, 60%, 80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
-ms-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
-ms-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.tada {
-webkit-animation-name: tada;
animation-name: tada;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes wobble {
0% {
-webkit-transform: none;
transform: none;
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
}
100% {
-webkit-transform: none;
transform: none;
}
}
@keyframes wobble {
0% {
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
-ms-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
-ms-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
-ms-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
-ms-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
-ms-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
}
100% {
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.wobble {
-webkit-animation-name: wobble;
animation-name: wobble;
}
@-webkit-keyframes bounceIn {
0%, 20%, 40%, 60%, 80%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
60% {
opacity: 1;
-webkit-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03);
}
80% {
-webkit-transform: scale3d(0.97, 0.97, 0.97);
transform: scale3d(0.97, 0.97, 0.97);
}
100% {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes bounceIn {
0%, 20%, 40%, 60%, 80%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
-ms-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
-ms-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
-ms-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
60% {
opacity: 1;
-webkit-transform: scale3d(1.03, 1.03, 1.03);
-ms-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03);
}
80% {
-webkit-transform: scale3d(0.97, 0.97, 0.97);
-ms-transform: scale3d(0.97, 0.97, 0.97);
transform: scale3d(0.97, 0.97, 0.97);
}
100% {
opacity: 1 !important;
-webkit-transform: scale3d(1, 1, 1);
-ms-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.bounceIn {
-webkit-animation-name: bounceIn;
animation-name: bounceIn;
-webkit-animation-duration: 0.75s;
animation-duration: 0.75s;
}
@-webkit-keyframes bounceInDown {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}
75% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
90% {
-webkit-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}
100% {
-webkit-transform: none;
transform: none;
}
}
@keyframes bounceInDown {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, -3000px, 0);
-ms-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, 25px, 0);
-ms-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}
75% {
-webkit-transform: translate3d(0, -10px, 0);
-ms-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
90% {
-webkit-transform: translate3d(0, 5px, 0);
-ms-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}
100% {
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.bounceInDown {
-webkit-animation-name: bounceInDown;
animation-name: bounceInDown;
}
@-webkit-keyframes bounceInLeft {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(-3000px, 0, 0);
transform: translate3d(-3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(25px, 0, 0);
transform: translate3d(25px, 0, 0);
}
75% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
90% {
-webkit-transform: translate3d(5px, 0, 0);
transform: translate3d(5px, 0, 0);
}
100% {
-webkit-transform: none;
transform: none;
}
}
@keyframes bounceInLeft {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(-3000px, 0, 0);
-ms-transform: translate3d(-3000px, 0, 0);
transform: translate3d(-3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(25px, 0, 0);
-ms-transform: translate3d(25px, 0, 0);
transform: translate3d(25px, 0, 0);
}
75% {
-webkit-transform: translate3d(-10px, 0, 0);
-ms-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
90% {
-webkit-transform: translate3d(5px, 0, 0);
-ms-transform: translate3d(5px, 0, 0);
transform: translate3d(5px, 0, 0);
}
100% {
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.bounceInLeft {
-webkit-animation-name: bounceInLeft;
animation-name: bounceInLeft;
}
@-webkit-keyframes bounceInRight {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(3000px, 0, 0);
transform: translate3d(3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(-25px, 0, 0);
transform: translate3d(-25px, 0, 0);
}
75% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
90% {
-webkit-transform: translate3d(-5px, 0, 0);
transform: translate3d(-5px, 0, 0);
}
100% {
-webkit-transform: none;
transform: none;
}
}
@keyframes bounceInRight {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(3000px, 0, 0);
-ms-transform: translate3d(3000px, 0, 0);
transform: translate3d(3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(-25px, 0, 0);
-ms-transform: translate3d(-25px, 0, 0);
transform: translate3d(-25px, 0, 0);
}
75% {
-webkit-transform: translate3d(10px, 0, 0);
-ms-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
90% {
-webkit-transform: translate3d(-5px, 0, 0);
-ms-transform: translate3d(-5px, 0, 0);
transform: translate3d(-5px, 0, 0);
}
100% {
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.bounceInRight {
-webkit-animation-name: bounceInRight;
animation-name: bounceInRight;
}
@-webkit-keyframes bounceInUp {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-webkit-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes bounceInUp {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
-ms-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
-ms-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-webkit-transform: translate3d(0, 10px, 0);
-ms-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-webkit-transform: translate3d(0, -5px, 0);
-ms-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
100% {
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.bounceInUp {
-webkit-animation-name: bounceInUp;
animation-name: bounceInUp;
}
@-webkit-keyframes bounceOut {
20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
50%, 55% {
opacity: 1;
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
}
@keyframes bounceOut {
20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
-ms-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
50%, 55% {
opacity: 1;
-webkit-transform: scale3d(1.1, 1.1, 1.1);
-ms-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
-ms-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
}
.bounceOut {
-webkit-animation-name: bounceOut;
animation-name: bounceOut;
-webkit-animation-duration: 0.75s;
animation-duration: 0.75s;
}
@-webkit-keyframes bounceOutDown {
20% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
40%, 45% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
@keyframes bounceOutDown {
20% {
-webkit-transform: translate3d(0, 10px, 0);
-ms-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
40%, 45% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
-ms-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
-ms-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
.bounceOutDown {
-webkit-animation-name: bounceOutDown;
animation-name: bounceOutDown;
}
@-webkit-keyframes bounceOutLeft {
20% {
opacity: 1;
-webkit-transform: translate3d(20px, 0, 0);
transform: translate3d(20px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
@keyframes bounceOutLeft {
20% {
opacity: 1;
-webkit-transform: translate3d(20px, 0, 0);
-ms-transform: translate3d(20px, 0, 0);
transform: translate3d(20px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
-ms-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
.bounceOutLeft {
-webkit-animation-name: bounceOutLeft;
animation-name: bounceOutLeft;
}
@-webkit-keyframes bounceOutRight {
20% {
opacity: 1;
-webkit-transform: translate3d(-20px, 0, 0);
transform: translate3d(-20px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
@keyframes bounceOutRight {
20% {
opacity: 1;
-webkit-transform: translate3d(-20px, 0, 0);
-ms-transform: translate3d(-20px, 0, 0);
transform: translate3d(-20px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
-ms-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
.bounceOutRight {
-webkit-animation-name: bounceOutRight;
animation-name: bounceOutRight;
}
@-webkit-keyframes bounceOutUp {
20% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
40%, 45% {
opacity: 1;
-webkit-transform: translate3d(0, 20px, 0);
transform: translate3d(0, 20px, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
@keyframes bounceOutUp {
20% {
-webkit-transform: translate3d(0, -10px, 0);
-ms-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
40%, 45% {
opacity: 1;
-webkit-transform: translate3d(0, 20px, 0);
-ms-transform: translate3d(0, 20px, 0);
transform: translate3d(0, 20px, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
-ms-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
.bounceOutUp {
-webkit-animation-name: bounceOutUp;
animation-name: bounceOutUp;
}
@-webkit-keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.fadeIn {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
}
@-webkit-keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
-ms-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.fadeInDown {
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown;
}
@-webkit-keyframes fadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
-ms-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.fadeInDownBig {
-webkit-animation-name: fadeInDownBig;
animation-name: fadeInDownBig;
}
@-webkit-keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
-ms-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.fadeInLeft {
-webkit-animation-name: fadeInLeft;
animation-name: fadeInLeft;
}
@-webkit-keyframes fadeInLeftBig {
0% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInLeftBig {
0% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
-ms-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.fadeInLeftBig {
-webkit-animation-name: fadeInLeftBig;
animation-name: fadeInLeftBig;
}
@-webkit-keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
-ms-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.fadeInRight {
-webkit-animation-name: fadeInRight;
animation-name: fadeInRight;
}
@-webkit-keyframes fadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
-ms-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.fadeInRightBig {
-webkit-animation-name: fadeInRightBig;
animation-name: fadeInRightBig;
}
@-webkit-keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
-ms-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.fadeInUp {
-webkit-animation-name: fadeInUp;
animation-name: fadeInUp;
}
@-webkit-keyframes fadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
-ms-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.fadeInUpBig {
-webkit-animation-name: fadeInUpBig;
animation-name: fadeInUpBig;
}
@-webkit-keyframes fadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes fadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
.fadeOut {
-webkit-animation-name: fadeOut;
animation-name: fadeOut;
}
@-webkit-keyframes fadeOutDown {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes fadeOutDown {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
-ms-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
.fadeOutDown {
-webkit-animation-name: fadeOutDown;
animation-name: fadeOutDown;
}
@-webkit-keyframes fadeOutDownBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
@keyframes fadeOutDownBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
-ms-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
.fadeOutDownBig {
-webkit-animation-name: fadeOutDownBig;
animation-name: fadeOutDownBig;
}
@-webkit-keyframes fadeOutLeft {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes fadeOutLeft {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
-ms-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
.fadeOutLeft {
-webkit-animation-name: fadeOutLeft;
animation-name: fadeOutLeft;
}
@-webkit-keyframes fadeOutLeftBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
@keyframes fadeOutLeftBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
-ms-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
.fadeOutLeftBig {
-webkit-animation-name: fadeOutLeftBig;
animation-name: fadeOutLeftBig;
}
@-webkit-keyframes fadeOutRight {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes fadeOutRight {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
-ms-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
.fadeOutRight {
-webkit-animation-name: fadeOutRight;
animation-name: fadeOutRight;
}
@-webkit-keyframes fadeOutRightBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
@keyframes fadeOutRightBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
-ms-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
.fadeOutRightBig {
-webkit-animation-name: fadeOutRightBig;
animation-name: fadeOutRightBig;
}
@-webkit-keyframes fadeOutUp {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes fadeOutUp {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
-ms-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
.fadeOutUp {
-webkit-animation-name: fadeOutUp;
animation-name: fadeOutUp;
}
@-webkit-keyframes fadeOutUpBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
@keyframes fadeOutUpBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
-ms-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
.fadeOutUpBig {
-webkit-animation-name: fadeOutUpBig;
animation-name: fadeOutUpBig;
}
@-webkit-keyframes flip {
0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
@keyframes flip {
0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
-ms-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
-ms-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
-ms-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
-ms-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
100% {
-webkit-transform: perspective(400px);
-ms-transform: perspective(400px);
transform: perspective(400px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
.animated.flip {
-webkit-backface-visibility: visible;
-ms-backface-visibility: visible;
backface-visibility: visible;
-webkit-animation-name: flip;
animation-name: flip;
}
@-webkit-keyframes flipInX {
0% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
@keyframes flipInX {
0% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-ms-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-ms-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
-ms-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
-ms-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
}
100% {
-webkit-transform: perspective(400px);
-ms-transform: perspective(400px);
transform: perspective(400px);
}
}
.flipInX {
-webkit-backface-visibility: visible !important;
-ms-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInX;
animation-name: flipInX;
}
@-webkit-keyframes flipInY {
0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
@keyframes flipInY {
0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-ms-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
-ms-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
-ms-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
-ms-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
}
100% {
-webkit-transform: perspective(400px);
-ms-transform: perspective(400px);
transform: perspective(400px);
}
}
.flipInY {
-webkit-backface-visibility: visible !important;
-ms-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInY;
animation-name: flipInY;
}
@-webkit-keyframes flipOutX {
0% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
opacity: 0;
}
}
@keyframes flipOutX {
0% {
-webkit-transform: perspective(400px);
-ms-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-ms-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-ms-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
opacity: 0;
}
}
.flipOutX {
-webkit-animation-name: flipOutX;
animation-name: flipOutX;
-webkit-animation-duration: 0.75s;
animation-duration: 0.75s;
-webkit-backface-visibility: visible !important;
-ms-backface-visibility: visible !important;
backface-visibility: visible !important;
}
@-webkit-keyframes flipOutY {
0% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
opacity: 0;
}
}
@keyframes flipOutY {
0% {
-webkit-transform: perspective(400px);
-ms-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
-ms-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-ms-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
opacity: 0;
}
}
.flipOutY {
-webkit-backface-visibility: visible !important;
-ms-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipOutY;
animation-name: flipOutY;
-webkit-animation-duration: 0.75s;
animation-duration: 0.75s;
}
@-webkit-keyframes lightSpeedIn {
0% {
-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
transform: translate3d(100%, 0, 0) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: skewX(20deg);
transform: skewX(20deg);
opacity: 1;
}
80% {
-webkit-transform: skewX(-5deg);
transform: skewX(-5deg);
opacity: 1;
}
100% {
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes lightSpeedIn {
0% {
-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
-ms-transform: translate3d(100%, 0, 0) skewX(-30deg);
transform: translate3d(100%, 0, 0) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: skewX(20deg);
-ms-transform: skewX(20deg);
transform: skewX(20deg);
opacity: 1;
}
80% {
-webkit-transform: skewX(-5deg);
-ms-transform: skewX(-5deg);
transform: skewX(-5deg);
opacity: 1;
}
100% {
-webkit-transform: none;
-ms-transform: none;
transform: none;
opacity: 1;
}
}
.lightSpeedIn {
-webkit-animation-name: lightSpeedIn;
animation-name: lightSpeedIn;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
@-webkit-keyframes lightSpeedOut {
0% {
opacity: 1;
}
100% {
-webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
transform: translate3d(100%, 0, 0) skewX(30deg);
opacity: 0;
}
}
@keyframes lightSpeedOut {
0% {
opacity: 1;
}
100% {
-webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
-ms-transform: translate3d(100%, 0, 0) skewX(30deg);
transform: translate3d(100%, 0, 0) skewX(30deg);
opacity: 0;
}
}
.lightSpeedOut {
-webkit-animation-name: lightSpeedOut;
animation-name: lightSpeedOut;
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
@-webkit-keyframes rotateIn {
0% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, -200deg);
transform: rotate3d(0, 0, 1, -200deg);
opacity: 0;
}
100% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateIn {
0% {
-webkit-transform-origin: center;
-ms-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, -200deg);
-ms-transform: rotate3d(0, 0, 1, -200deg);
transform: rotate3d(0, 0, 1, -200deg);
opacity: 0;
}
100% {
-webkit-transform-origin: center;
-ms-transform-origin: center;
transform-origin: center;
-webkit-transform: none;
-ms-transform: none;
transform: none;
opacity: 1;
}
}
.rotateIn {
-webkit-animation-name: rotateIn;
animation-name: rotateIn;
}
@-webkit-keyframes rotateInDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateInDownLeft {
0% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
-ms-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
-ms-transform: none;
transform: none;
opacity: 1;
}
}
.rotateInDownLeft {
-webkit-animation-name: rotateInDownLeft;
animation-name: rotateInDownLeft;
}
@-webkit-keyframes rotateInDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateInDownRight {
0% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
-ms-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
-ms-transform: none;
transform: none;
opacity: 1;
}
}
.rotateInDownRight {
-webkit-animation-name: rotateInDownRight;
animation-name: rotateInDownRight;
}
@-webkit-keyframes rotateInUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateInUpLeft {
0% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
-ms-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
-ms-transform: none;
transform: none;
opacity: 1;
}
}
.rotateInUpLeft {
-webkit-animation-name: rotateInUpLeft;
animation-name: rotateInUpLeft;
}
@-webkit-keyframes rotateInUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -90deg);
transform: rotate3d(0, 0, 1, -90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateInUpRight {
0% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -90deg);
-ms-transform: rotate3d(0, 0, 1, -90deg);
transform: rotate3d(0, 0, 1, -90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
-ms-transform: none;
transform: none;
opacity: 1;
}
}
.rotateInUpRight {
-webkit-animation-name: rotateInUpRight;
animation-name: rotateInUpRight;
}
@-webkit-keyframes rotateOut {
0% {
-webkit-transform-origin: center;
transform-origin: center;
opacity: 1;
}
100% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, 200deg);
transform: rotate3d(0, 0, 1, 200deg);
opacity: 0;
}
}
@keyframes rotateOut {
0% {
-webkit-transform-origin: center;
-ms-transform-origin: center;
transform-origin: center;
opacity: 1;
}
100% {
-webkit-transform-origin: center;
-ms-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, 200deg);
-ms-transform: rotate3d(0, 0, 1, 200deg);
transform: rotate3d(0, 0, 1, 200deg);
opacity: 0;
}
}
.rotateOut {
-webkit-animation-name: rotateOut;
animation-name: rotateOut;
}
@-webkit-keyframes rotateOutDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
}
@keyframes rotateOutDownLeft {
0% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
-ms-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
}
.rotateOutDownLeft {
-webkit-animation-name: rotateOutDownLeft;
animation-name: rotateOutDownLeft;
}
@-webkit-keyframes rotateOutDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
@keyframes rotateOutDownRight {
0% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
-ms-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
.rotateOutDownRight {
-webkit-animation-name: rotateOutDownRight;
animation-name: rotateOutDownRight;
}
@-webkit-keyframes rotateOutUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
@keyframes rotateOutUpLeft {
0% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
-ms-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
.rotateOutUpLeft {
-webkit-animation-name: rotateOutUpLeft;
animation-name: rotateOutUpLeft;
}
@-webkit-keyframes rotateOutUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 90deg);
transform: rotate3d(0, 0, 1, 90deg);
opacity: 0;
}
}
@keyframes rotateOutUpRight {
0% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 90deg);
-ms-transform: rotate3d(0, 0, 1, 90deg);
transform: rotate3d(0, 0, 1, 90deg);
opacity: 0;
}
}
.rotateOutUpRight {
-webkit-animation-name: rotateOutUpRight;
animation-name: rotateOutUpRight;
}
@-webkit-keyframes hinge {
0% {
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%, 60% {
-webkit-transform: rotate3d(0, 0, 1, 80deg);
transform: rotate3d(0, 0, 1, 80deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40%, 80% {
-webkit-transform: rotate3d(0, 0, 1, 60deg);
transform: rotate3d(0, 0, 1, 60deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
opacity: 1;
}
100% {
-webkit-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
@keyframes hinge {
0% {
-webkit-transform-origin: top left;
-ms-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%, 60% {
-webkit-transform: rotate3d(0, 0, 1, 80deg);
-ms-transform: rotate3d(0, 0, 1, 80deg);
transform: rotate3d(0, 0, 1, 80deg);
-webkit-transform-origin: top left;
-ms-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40%, 80% {
-webkit-transform: rotate3d(0, 0, 1, 60deg);
-ms-transform: rotate3d(0, 0, 1, 60deg);
transform: rotate3d(0, 0, 1, 60deg);
-webkit-transform-origin: top left;
-ms-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
opacity: 1;
}
100% {
-webkit-transform: translate3d(0, 700px, 0);
-ms-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
.hinge {
-webkit-animation-name: hinge;
animation-name: hinge;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollIn {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes rollIn {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
-ms-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.rollIn {
-webkit-animation-name: rollIn;
animation-name: rollIn;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
}
}
@keyframes rollOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
-ms-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
}
}
.rollOut {
-webkit-animation-name: rollOut;
animation-name: rollOut;
}
@-webkit-keyframes zoomIn {
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
50% {
opacity: 1;
}
}
@keyframes zoomIn {
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
-ms-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
50% {
opacity: 1;
}
}
.zoomIn {
-webkit-animation-name: zoomIn;
animation-name: zoomIn;
}
@-webkit-keyframes zoomInDown {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInDown {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
-ms-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomInDown {
-webkit-animation-name: zoomInDown;
animation-name: zoomInDown;
}
@-webkit-keyframes zoomInLeft {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInLeft {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
-ms-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
-ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomInLeft {
-webkit-animation-name: zoomInLeft;
animation-name: zoomInLeft;
}
@-webkit-keyframes zoomInRight {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInRight {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
-ms-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
-ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomInRight {
-webkit-animation-name: zoomInRight;
animation-name: zoomInRight;
}
@-webkit-keyframes zoomInUp {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInUp {
0% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
-ms-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomInUp {
-webkit-animation-name: zoomInUp;
animation-name: zoomInUp;
}
@-webkit-keyframes zoomOut {
0% {
opacity: 1;
}
50% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
100% {
opacity: 0;
}
}
@keyframes zoomOut {
0% {
opacity: 1;
}
50% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
-ms-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
100% {
opacity: 0;
}
}
.zoomOut {
-webkit-animation-name: zoomOut;
animation-name: zoomOut;
}
@-webkit-keyframes zoomOutDown {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
100% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomOutDown {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
100% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
-ms-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
-webkit-transform-origin: center bottom;
-ms-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomOutDown {
-webkit-animation-name: zoomOutDown;
animation-name: zoomOutDown;
}
@-webkit-keyframes zoomOutLeft {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
transform: scale(0.1) translate3d(-2000px, 0, 0);
-webkit-transform-origin: left center;
transform-origin: left center;
}
}
@keyframes zoomOutLeft {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
-ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
-ms-transform: scale(0.1) translate3d(-2000px, 0, 0);
transform: scale(0.1) translate3d(-2000px, 0, 0);
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
}
}
.zoomOutLeft {
-webkit-animation-name: zoomOutLeft;
animation-name: zoomOutLeft;
}
@-webkit-keyframes zoomOutRight {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
transform: scale(0.1) translate3d(2000px, 0, 0);
-webkit-transform-origin: right center;
transform-origin: right center;
}
}
@keyframes zoomOutRight {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
-ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
-ms-transform: scale(0.1) translate3d(2000px, 0, 0);
transform: scale(0.1) translate3d(2000px, 0, 0);
-webkit-transform-origin: right center;
-ms-transform-origin: right center;
transform-origin: right center;
}
}
.zoomOutRight {
-webkit-animation-name: zoomOutRight;
animation-name: zoomOutRight;
}
@-webkit-keyframes zoomOutUp {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
100% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomOutUp {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
100% {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
-ms-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
-webkit-transform-origin: center bottom;
-ms-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomOutUp {
-webkit-animation-name: zoomOutUp;
animation-name: zoomOutUp;
}
@-webkit-keyframes slideInDown {
0% {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
visibility: visible;
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes slideInDown {
0% {
-webkit-transform: translateY(-100%);
-ms-transform: translateY(-100%);
transform: translateY(-100%);
visibility: visible;
}
100% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.slideInDown {
-webkit-animation-name: slideInDown;
animation-name: slideInDown;
}
@-webkit-keyframes slideInLeft {
0% {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
visibility: visible;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes slideInLeft {
0% {
-webkit-transform: translateX(-100%);
-ms-transform: translateX(-100%);
transform: translateX(-100%);
visibility: visible;
}
100% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.slideInLeft {
-webkit-animation-name: slideInLeft;
animation-name: slideInLeft;
}
@-webkit-keyframes slideInRight {
0% {
-webkit-transform: translateX(100%);
transform: translateX(100%);
visibility: visible;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes slideInRight {
0% {
-webkit-transform: translateX(100%);
-ms-transform: translateX(100%);
transform: translateX(100%);
visibility: visible;
}
100% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.slideInRight {
-webkit-animation-name: slideInRight;
animation-name: slideInRight;
}
@-webkit-keyframes slideInUp {
0% {
-webkit-transform: translateY(100%);
transform: translateY(100%);
visibility: visible;
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes slideInUp {
0% {
-webkit-transform: translateY(100%);
-ms-transform: translateY(100%);
transform: translateY(100%);
visibility: visible;
}
100% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.slideInUp {
-webkit-animation-name: slideInUp;
animation-name: slideInUp;
}
@-webkit-keyframes slideOutDown {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
visibility: hidden;
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
@keyframes slideOutDown {
0% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
visibility: hidden;
-webkit-transform: translateY(100%);
-ms-transform: translateY(100%);
transform: translateY(100%);
}
}
.slideOutDown {
-webkit-animation-name: slideOutDown;
animation-name: slideOutDown;
}
@-webkit-keyframes slideOutLeft {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
visibility: hidden;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@keyframes slideOutLeft {
0% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
visibility: hidden;
-webkit-transform: translateX(-100%);
-ms-transform: translateX(-100%);
transform: translateX(-100%);
}
}
.slideOutLeft {
-webkit-animation-name: slideOutLeft;
animation-name: slideOutLeft;
}
@-webkit-keyframes slideOutRight {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
visibility: hidden;
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@keyframes slideOutRight {
0% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
visibility: hidden;
-webkit-transform: translateX(100%);
-ms-transform: translateX(100%);
transform: translateX(100%);
}
}
.slideOutRight {
-webkit-animation-name: slideOutRight;
animation-name: slideOutRight;
}
@-webkit-keyframes slideOutUp {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
visibility: hidden;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
@keyframes slideOutUp {
0% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
visibility: hidden;
-webkit-transform: translateY(-100%);
-ms-transform: translateY(-100%);
transform: translateY(-100%);
}
}
.slideOutUp {
-webkit-animation-name: slideOutUp;
animation-name: slideOutUp;
}
#preloader_1 {
position: relative;
margin: 0 auto;
width: 60px;
}
#preloader_1 span {
display: block;
bottom: 0px;
width: 9px;
height: 5px;
background: #002FA7;
position: absolute;
animation: preloader_1 1.5s infinite ease-in-out;
}
#preloader_1 span:nth-child(2) {
left: 11px;
animation-delay: 0.2s;
}
#preloader_1 span:nth-child(3) {
left: 22px;
animation-delay: 0.4s;
}
@keyframes preloader_1 {
0% {
height: 5px;
transform: translateY(0px);
background: #D4D8E7;
}
25% {
height: 30px;
transform: translateY(15px);
background: #112132;
}
50% {
height: 5px;
transform: translateY(0px);
background: #D4D8E7;
}
100% {
height: 5px;
transform: translateY(0px);
background: #D4D8E7;
}
}
@keyframes move-arrow {
25% {
opacity: 1;
}
33.3% {
opacity: 1;
transform: translateY(0.6rem);
}
66.6% {
opacity: 1;
}
100% {
opacity: 1;
}
}
/*
==============================================
Modal
==============================================
*/
.com_close {
border: none;
position: absolute;
right: 0;
top: 0;
width: 35px;
height: 35px;
background: transparent;
transition: transform 400ms ease-in-out;
cursor: pointer;
color: #002FA7;
font-size: 35px;
font-weight: 500;
line-height: 40px;
}
.modal-dialog {
position: relative;
max-width: 700px;
margin: 10px auto;
z-index: 100;
}
@media (max-width: 768px) {
.modal-dialog {
margin: 10px 20px;
}
}
@media (max-width: 560px) {
.modal-dialog {
margin: 0;
}
}
.modal-content {
position: relative;
background-color: #ffffff;
background-clip: padding-box;
padding: 1.5rem;
outline: 0;
width: 100%;
border-radius: 20px;
}
@media (max-width: 560px) {
.modal-content {
padding: 6%;
}
}
@media (max-width: 400px) {
.modal-content {
padding: 2%;
}
}
.modal-backdrop {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1040;
background-color: #ffffff;
}
.modal-backdrop.fade {
opacity: 0;
filter: alpha(opacity=0);
}
.modal-backdrop.in {
opacity: 0.7;
filter: alpha(opacity=70);
}
.modal-header {
position: relative;
padding: 0 0 12px;
}
.modal-header .com_title--int {
padding-bottom: 10px;
margin-bottom: 10px;
}
.modal-header .modal-title {
margin: 0;
line-height: 1.42857143;
}
.modal-body {
position: relative;
}
.modal-body h5 {
margin-bottom: 10px !important;
}
.modal-body a {
color: #00AEEF;
}
.modal-body .modal-scroll {
overflow-y: auto;
max-height: calc(100vh - 120px);
padding: 0px 15px;
}
.modal-body .modal-scroll::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
border-radius: 10px;
background-color: #F5F5F5;
}
@media (max-width: 560px) {
.modal-body .com_list-dots {
margin-top: 15px !important;
margin-bottom: 30px !important;
}
}
.modal-footer {
padding: 1rem;
}
.modal-footer .btn + .btn,
.modal-footer a + a {
margin-bottom: 0;
margin-left: 10px;
}
.modal-scrollbar-measure {
position: absolute;
top: -9999px;
width: 50px;
height: 50px;
overflow: scroll;
}
@media (min-width: 768px) {
.modal-content {
background: #FFFFFF;
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.14), 0 2px 2px 0 rgba(0, 0, 0, 0.12), 0 1px 3px 0 rgba(0, 0, 0, 0.2);
}
}
.modal-centered .modal-body,
.modal-centered .modal-header {
max-width: 430px;
margin-left: auto;
margin-right: auto;
}
.modal-open {
overflow: hidden;
}
.modal-open .modal {
overflow-x: hidden;
overflow-y: auto;
}
.modal {
position: fixed;
top: 0;
left: 0;
z-index: 1050;
display: none;
width: 100%;
height: 100%;
overflow: hidden;
outline: 0;
}
.modal-dialog {
position: relative;
width: auto;
margin: 0.5rem;
}
.modal.fade .modal-dialog {
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
-webkit-transform: translate(0, -50px);
transform: translate(0, -50px);
}
@media (prefers-reduced-motion: reduce) {
.modal.fade .modal-dialog {
transition: none;
}
}
.modal.show .modal-dialog {
-webkit-transform: none;
transform: none;
}
.modal.modal-static .modal-dialog {
-webkit-transform: scale(1.02);
transform: scale(1.02);
}
.modal-dialog-scrollable {
display: -ms-flexbox;
display: flex;
max-height: calc(100% - 1rem);
}
.modal-dialog-scrollable .modal-content {
max-height: calc(100vh - 1rem);
overflow: hidden;
}
.modal-dialog-scrollable .modal-header,
.modal-dialog-scrollable .modal-footer {
-ms-flex-negative: 0;
flex-shrink: 0;
}
.modal-dialog-scrollable .modal-body {
overflow-y: auto;
}
.modal-dialog-centered {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
min-height: calc(100% - 1rem);
}
.modal-dialog-centered::before {
display: block;
height: calc(100vh - 1rem);
height: -webkit-min-content;
height: -moz-min-content;
height: min-content;
content: "";
}
.modal-dialog-centered.modal-dialog-scrollable {
-ms-flex-direction: column;
flex-direction: column;
-ms-flex-pack: center;
justify-content: center;
height: 100%;
}
.modal-dialog-centered.modal-dialog-scrollable .modal-content {
max-height: none;
}
.modal-dialog-centered.modal-dialog-scrollable::before {
content: none;
}
.modal-backdrop {
position: fixed;
top: 0;
left: 0;
z-index: 1040;
width: 100vw;
height: 100vh;
background-color: #000;
}
.modal-backdrop.fade {
opacity: 0;
}
.modal-backdrop.show {
opacity: 0.5;
}
.modal-title {
margin-bottom: 0;
line-height: 1.5;
}
.modal-body {
position: relative;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
padding: 16px;
}
.modal-scrollbar-measure {
position: absolute;
top: -9999px;
width: 50px;
height: 50px;
overflow: scroll;
}
@media (min-width: 576px) {
.modal-dialog {
max-width: 947px;
margin: 1.75rem auto;
}
.modal-dialog-scrollable {
max-height: calc(100% - 3.5rem);
}
.modal-dialog-scrollable .modal-content {
max-height: calc(100vh - 3.5rem);
}
.modal-dialog-centered {
min-height: calc(100% - 3.5rem);
}
.modal-dialog-centered::before {
height: calc(100vh - 3.5rem);
height: -webkit-min-content;
height: -moz-min-content;
height: min-content;
}
.modal-sm {
max-width: 300px;
}
.modal-md {
max-width: 500px;
}
}
#modal-simple .modal-body {
max-height: 75vh;
overflow: auto;
}
@media (min-width: 992px) {
.modal-lg,
.modal-xl {
max-width: 800px;
}
}
@media (min-width: 1200px) {
.modal-xl {
width: 1240px;
max-width: 100%;
}
}
/*
===================== home =====================
*/
.com {
/*&_statistics {
padding-top: 8rem;
background-color: $color-base;
p {
color: $color-primary;
}
#counter {
> div:not(:last-child)::after {
content: "";
display: block;
position: absolute;
top: -30px;
right: 0;
height: 120%;
width: 0;
border-right: 1px solid $color-secondary;
}
}
}*/
}
.com_banner-cta {
height: 475px;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
display: flex;
align-items: center;
justify-content: center;
}
@media (max-width: 992px) {
.com_banner-cta {
height: auto;
padding: 2rem;
}
}
.com_banner-cta > .container {
height: 355px;
width: 644px;
background-size: cover;
background-repeat: no-repeat;
}
@media (max-width: 992px) {
.com_banner-cta > .container {
height: auto;
background-size: contain;
background-color: #ffffff;
padding: 2rem 1.5rem;
}
}
.com_banner-cta__descript {
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
padding: 2rem;
}
.com_banner-cta__descript--content {
max-width: 50%;
}
.com_banner-cta__descript--buttons {
margin-top: 2rem;
}
@media (max-width: 992px) {
.com_banner-cta__descript {
padding: 0.25rem;
}
.com_banner-cta__descript--content {
max-width: 100%;
}
}
.com_banner-cta__descript h2 {
font-weight: 300;
}
.com_banner-cta__descript p {
line-height: 130%;
font-size: 1rem;
margin-bottom: 0;
}
.com_banner-home {
position: relative;
display: block;
width: 100%;
height: 470px;
background-position: center center;
background-size: cover;
}
.com_banner-home .container {
height: 100%;
}
.com_banner-home .container > .row {
display: flex;
align-items: center;
height: 100%;
}
.com_banner-home__descript {
max-width: 548px;
padding-top: 2rem;
}
.com_banner-home__descript h1 {
color: #ffffff;
line-height: 120%;
margin-bottom: 20px;
font-weight: 400;
}
.com_banner-home__descript h1 small {
display: block;
font-size: 70%;
}
.com_banner-home__descript h1 b {
display: block;
font-weight: bold;
}
.com_banner-home__descript p {
line-height: 150%;
margin-bottom: 0;
font-size: 16px;
}
.com_banner-home__descript .com_text-link {
color: #ffffff;
font-weight: bold;
font-size: 0.875rem;
background-color: #002FA7;
border-color: #00AEEF;
}
.com_banner-home__descript .com_text-link:before {
background-color: #002FA7;
}
@media (max-width: 992px) {
.com_banner-home__descript {
top: 35%;
}
.com_banner-home__descript h1 {
line-height: 140%;
}
}
.com_banner-home__news {
color: #ffffff;
}
@media (min-width: 992px) {
.com_banner-home__news {
max-width: 350px;
}
}
.com_banner-home__news ul {
margin: 0 !important;
}
.com_banner-home__news ul li {
display: block;
height: auto;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
.com_banner-home__news ul li:not(:first-child) {
border-top: 1px solid #ffffff;
}
.com_banner-home__news ul li a {
display: block;
line-height: 150%;
font-size: 16px;
color: #ffffff;
opacity: 1;
position: relative;
padding-right: 40px;
margin: 20px 0;
}
.com_banner-home__news ul li a svg {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
}
.com_banner-home__news ul li a svg path {
transition: all 0.3s;
}
.com_banner-home__news ul li a:hover {
transition: all 500ms ease;
display: block;
color: #00AEEF;
}
.com_banner-home__news ul li a:hover svg path {
fill: #00AEEF;
}
@media (max-width: 992px) {
.com_banner-home__news {
margin: 20px 0 10px;
}
.com_banner-home__news ul li {
min-height: auto;
}
.com_banner-home__news ul li a {
font-size: 14px;
}
}
@media (max-width: 400px) {
.com_banner-home__news {
margin: 10px 0;
}
}
.com_banner-home #myVideo {
position: absolute;
z-index: -1;
width: 100%;
object-fit: cover;
}
@media (max-width: 768px) {
.com_banner-home__descript {
width: 91%;
top: 30%;
}
.com_banner-home__descript h1 {
font-size: 21px !important;
}
.com_banner-home__descript p {
font-size: 13px;
}
}
@media (max-width: 380px) {
.com_banner-home__descript {
top: 28%;
}
.com_banner-home__descript p {
line-height: 150%;
}
}
.com_banner-home--contingencia:before, .com_banner-home--seminario:before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 47, 167, 0.9);
}
.com_banner-home--contingencia .com_banner-home__descript, .com_banner-home--seminario .com_banner-home__descript {
top: 38%;
}
.com_banner-home--contingencia .com_banner-home__seccion, .com_banner-home--seminario .com_banner-home__seccion {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: auto;
right: 0;
padding: 40px 0;
align-content: flex-start;
background-color: rgba(137, 27, 46, 0.8);
}
.com_banner-home--contingencia .com_banner-home__seccion h4, .com_banner-home--contingencia .com_banner-home__seccion p, .com_banner-home--seminario .com_banner-home__seccion h4, .com_banner-home--seminario .com_banner-home__seccion p {
margin-bottom: 30px;
}
.com_banner-home--contingencia .com_banner-home__seccion h4, .com_banner-home--seminario .com_banner-home__seccion h4 {
font-family: "Lira";
}
.com_banner-home--contingencia .com_banner-home__seccion h6, .com_banner-home--seminario .com_banner-home__seccion h6 {
font-family: "Lira";
font-size: 16px;
}
.com_banner-home--contingencia .com_banner-home__seccion p, .com_banner-home--seminario .com_banner-home__seccion p {
font-size: 14px !important;
}
@media (max-width: 768px) {
.com_banner-home--contingencia .com_banner-home__descript, .com_banner-home--seminario .com_banner-home__descript {
top: 33%;
}
.com_banner-home--contingencia .com_banner-home__seccion, .com_banner-home--seminario .com_banner-home__seccion {
padding: 30px 0 10px;
}
.com_banner-home--contingencia .com_banner-home__seccion h4:after, .com_banner-home--seminario .com_banner-home__seccion h4:after {
display: none;
}
.com_banner-home--contingencia .com_banner-home__seccion h6, .com_banner-home--seminario .com_banner-home__seccion h6 {
margin-bottom: 0;
}
.com_banner-home--contingencia .com_banner-home__seccion .com_text-link, .com_banner-home--seminario .com_banner-home__seccion .com_text-link {
margin-bottom: 20px;
}
}
@media (max-width: 560px) {
.com_banner-home--contingencia .com_banner-home__descript p, .com_banner-home--seminario .com_banner-home__descript p {
line-height: 140%;
}
.com_banner-home--contingencia .com_banner-home__seccion, .com_banner-home--seminario .com_banner-home__seccion {
padding: 20px 0 10px;
}
}
.com_banner-home--seminario:before {
background-color: rgba(58, 156, 198, 0.9);
}
.com_banner-home--seminario .com_banner-home__seccion {
background-color: rgba(58, 91, 142, 0.8);
}
.com_intro {
margin-top: 60px;
}
@media (max-width: 768px) {
.com_intro {
margin-top: 40px;
}
}
.com_map img {
width: 100%;
margin: 0 auto;
max-width: 418px;
}
.com_mod-app {
display: block;
border-top: 1px solid #F3F0ED;
background-color: #F1F2F3;
width: 100%;
height: 175px;
padding-top: 18px;
}
.com_mod-app .container {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
height: 100%;
}
.com_mod-app__descript {
transition: all 500ms ease;
margin: 0 0 0 240px;
width: 500px;
}
.com_mod-app .com_display--flex {
margin-right: 18px;
width: 288px;
margin-bottom: 20px;
justify-content: space-between;
}
.com_mod-app .com_display--flex a + a {
transition: all 500ms ease;
margin: 0 0 0 10px;
}
.com_mod-app .com_img-app {
transition: all 500ms ease;
display: block;
width: 207px;
height: 151px;
position: absolute;
left: 0;
bottom: 0;
background: url("../img/examples/img-app.png") 0 0 no-repeat;
}
@media (max-width: 992px) {
.com_mod-app__descript {
margin: 16px 0 0 212px;
width: 320px;
}
.com_mod-app .com_display--flex {
flex-direction: column;
}
.com_mod-app .com_display--flex a + a {
margin: 10px 0 0 0;
}
}
@media (max-width: 768px) {
.com_mod-app {
height: auto;
padding: 40px 0;
}
.com_mod-app .container {
align-items: initial;
flex-direction: column;
align-items: center;
justify-content: flex-start;
}
.com_mod-app__descript {
margin: 0 auto 16px;
width: 365px;
}
.com_mod-app .com_display--flex {
flex-direction: row;
margin-right: 0;
width: 200px;
}
.com_mod-app .com_display--flex a + a {
margin: 0 0 0 10px;
}
.com_mod-app .com_img-app {
display: none;
}
}
@media (max-width: 560px) {
.com_mod-app__descript {
width: 90%;
}
.com_mod-app .com_display--flex {
width: 288px;
}
}
@media (max-width: 375px) {
.com_mod-app .com_display--flex {
width: 100%;
margin: 0;
}
}
@media (min-width: 500px) {
.com_bg-media__container video {
display: block;
}
}
@media (min-width: 992px) {
.com_banner--full-width {
position: relative;
}
.com_banner--full-width .com_banner-home__seccion {
bottom: unset;
margin-top: -90px;
}
}
/*
===================== Nosotros =====================
*/
.com_bg-timeline {
background: #3A5B8E;
}
.com_scroll-area {
overflow-x: auto;
max-width: 996px;
position: relative;
margin: 0 auto;
width: 100%;
}
.com_scroll-area:after {
content: "";
position: absolute;
right: 0;
top: 0;
height: 100%;
width: 70px;
background: #3A5B8E;
box-shadow: -18px 0px 53px 22px rgb(58, 91, 142);
pointer-events: none;
}
@media only screen and (max-width: 992px) {
.com_scroll-area:after {
width: 30px;
}
}
.com_scroll-parent-area {
position: relative;
}
.com_scroll-parent-area .mCSB_scrollTools_horizontal {
z-index: 1;
opacity: 1;
}
.com_scroll-parent-area > .mCSB_buttonLeft, .com_scroll-parent-area > .mCSB_buttonRight {
position: absolute;
top: 50%;
transform: translate(0, -50%);
width: 24px;
height: 150px !important;
margin: auto;
z-index: 1;
opacity: 1;
color: #ffffff;
}
.com_scroll-parent-area > .mCSB_buttonLeft i, .com_scroll-parent-area > .mCSB_buttonRight i {
display: block;
font-size: 40px;
position: absolute;
top: 50% !important;
color: #ffffff;
}
@media only screen and (max-width: 992px) {
.com_scroll-parent-area > .mCSB_buttonLeft i, .com_scroll-parent-area > .mCSB_buttonRight i {
font-size: 20px;
}
}
.com_scroll-parent-area > .mCSB_buttonLeft {
left: 0;
width: 22px !important;
}
.com_scroll-parent-area > .mCSB_buttonLeft i {
transform: translate(0, -50%) rotate(180deg);
}
.com_scroll-parent-area > .mCSB_buttonRight {
right: 0;
width: 22px !important;
}
.com_scroll-parent-area > .mCSB_buttonRight i {
transform: translate(0, -50%);
}
.com_time-ballon-cont {
display: flex;
flex-flow: column;
position: relative;
justify-content: flex-start;
}
.com_time-ballon-cont:before {
content: "";
position: absolute;
bottom: 0;
height: 100%;
width: 1px;
border-right: solid 2px white;
margin: auto;
transform: translate(-50%, 0);
left: 50%;
right: initial;
}
.com_timeline-box-group {
display: flex;
justify-content: center;
flex-flow: column;
}
.com_timeline-horizontal {
display: flex;
padding: 40px 0 0;
}
.com_timeline-info {
text-align: right;
padding-top: 10px;
padding-right: 100px;
text-align: left;
padding-left: 20px;
padding-bottom: 30px;
}
.com_timeline-box {
width: 380px;
position: relative;
display: flex;
flex-flow: row;
}
.com_timeline-box:after {
content: "";
position: absolute;
top: -8px;
width: 14px;
height: 14px;
background: white;
border-radius: 100%;
left: auto;
display: none;
}
.com_timeline-box:nth-child(even) {
border-right: none;
border-top: solid 2px #ffffff;
left: 40px;
}
.com_timeline-box:nth-child(even):before {
border: none !important;
}
.com_timeline-box:nth-child(even):after {
left: -7px;
right: auto;
display: block;
}
.com_timeline-box:nth-child(even) .com_time-ballon-cont {
justify-content: flex-end;
height: 100px;
}
.com_timeline-box:nth-child(even) .com_time-ballon:after {
left: 0;
right: auto;
}
.com_timeline-box:nth-child(even) .com_timeline-info {
text-align: left;
text-align: left;
padding-right: 50px;
padding-top: 60px;
}
.com_time-ballon {
background: #ffffff;
border-radius: 20px;
padding: 8px 15px;
color: #3A5B8E;
font-size: 21px;
font-family: "Roboto Condensed";
z-index: 2;
}
.com_time-box > div {
max-width: 365px;
display: flex;
flex-flow: column;
}
.com_download-button i {
font-size: 24px;
margin-right: 10px;
}
@media only screen and (max-width: 992px) {
.com_menu-filter .com_deploy-mobile-button {
display: flex;
}
.com_menu-filter .com_menu-filter_buttons {
overflow: hidden;
opacity: 0;
visibility: hidden;
max-height: 0;
transition: all 600ms ease;
}
.com_menu-filter .com_menu-filter_buttons.active {
opacity: 1;
visibility: visible;
max-height: 1000px;
transition: all 800ms ease;
}
.com_menu-filter .com_menu-filter_buttons li {
display: block;
margin-left: 0 !important;
}
.com_menu-filter .com_menu-filter_buttons li ul.com_desplegable {
display: block;
position: static;
visibility: visible;
opacity: 1;
margin: 0;
}
.com_menu-filter .com_menu-filter_buttons li ul.com_desplegable a.active:before {
height: 2px;
}
.com_menu-filter .com_menu-filter_buttons li a:hover {
background: unset;
color: inherit;
transition: none;
}
.com_menu-filter .com_menu-filter_buttons li a.active:before {
height: 0;
}
.com_menu-filter .com_menu-filter_buttons button,
.com_menu-filter .com_menu-filter_buttons a {
display: inline-block;
font-size: 14px;
padding: 18px 10px;
margin-left: 0;
width: 100%;
text-align: left;
transition: color 0ms ease;
}
.com_menu-filter .com_menu-filter_buttons button:hover,
.com_menu-filter .com_menu-filter_buttons a:hover {
background: #002FA7;
color: #ffffff;
transition: color 0ms ease;
}
}
.com_deploy-mobile-button {
border: 1px solid #d3d3d3;
padding: 17px 10px;
width: 100%;
text-align: left;
font-size: 14px;
background: none;
color: #8B8B8B;
cursor: pointer;
display: none;
justify-content: space-between;
align-items: center;
}
.com_deploy-mobile-button i {
width: 9px;
height: 3px;
}
.com_deploy-mobile-button i:after {
border-color: #FFFFFF;
}
.com_menu-filter_buttons li {
position: relative;
display: inline-block;
}
.com_menu-filter_buttons li + li {
margin-left: 20px;
}
.com_menu-filter_buttons li .com_desplegable a.active:before {
height: 0;
}
.com_menu-filter_buttons button,
.com_menu-filter_buttons a {
display: inline-block;
border: none;
background: no-repeat;
font-size: 14px;
cursor: pointer;
color: #000000;
padding: 1rem 0;
position: relative;
transition: color 600ms ease;
}
.com_menu-filter_buttons button:before,
.com_menu-filter_buttons a:before {
content: "";
width: 0;
height: 2px;
display: inline-block;
transition: width 500ms ease;
position: absolute;
bottom: -1px;
left: 0;
background-color: #002FA7;
z-index: 10;
}
.com_menu-filter_buttons button + button,
.com_menu-filter_buttons button + a,
.com_menu-filter_buttons a + button,
.com_menu-filter_buttons a + a {
margin-left: 20px;
}
.com_menu-filter_buttons button:hover,
.com_menu-filter_buttons a:hover {
color: #002FA7;
transition: color 0ms ease;
}
.com_menu-filter_buttons button .icon-arrow-2,
.com_menu-filter_buttons a .icon-arrow-2 {
margin-bottom: 4px;
}
.com_menu-filter_buttons button .icon-arrow-2:after,
.com_menu-filter_buttons a .icon-arrow-2:after {
border-color: #002FA7;
}
.com_menu-filter_buttons .active {
color: #002FA7;
}
.com_menu-filter_buttons .active:before {
width: 100%;
}
.com_menu-filter_buttons .com_desplegable {
min-width: 145px;
top: 39px;
padding: 10px 15px 25px 15px;
min-height: auto;
}
.com_menu-filter_buttons .com_desplegable li {
display: block;
margin-left: 0 !important;
}
.com_menu-filter_buttons .com_desplegable a {
padding-bottom: 0;
}
.com_category-box-group {
overflow: hidden;
opacity: 0;
visibility: hidden;
max-height: 0;
transition: all 0ms ease;
}
.com_category-box-group.active {
opacity: 1;
visibility: visible;
max-height: 10000px;
transition: all 600ms ease;
}
.com_category-box-group > div {
margin-bottom: 30px;
}
.com_share-button {
display: block;
}
.com_share-button a {
display: inline-block;
margin-left: 10px;
}
.com_share-button i:before {
font-size: 31px;
}
@media (max-width: 768px) {
.com_share-button {
margin-top: 20px;
}
}
article {
margin-bottom: 40px;
}
@media only screen and (max-width: 992px) {
.md-gutters [class^=col-] {
padding-right: 15px;
padding-left: 15px;
}
}
@media only screen and (max-width: 768px) {
.sm-gutters [class^=col-] {
padding-right: 15px;
padding-left: 15px;
}
}
@media only screen and (max-width: 560px) {
.xs-gutters [class^=col-] {
padding-right: 15px;
padding-left: 15px;
}
}
/*
===================== testimonios =====================
*/
.com_testimonio, .com_socio {
position: relative;
background-color: #ffffff;
padding: 70px 40px 40px;
border: 1px solid #FAFAFB;
margin-right: 35px;
width: 94%;
}
.com_testimonio h6, .com_socio h6 {
line-height: 150%;
color: #000000;
}
@media (max-width: 1199px) {
.com_testimonio, .com_socio {
width: 92%;
}
}
@media (min-width: 769px) {
.com_testimonio, .com_socio {
max-width: 537px;
}
}
.com_testimonio__body, .com_socio__body {
display: flex;
justify-content: space-between;
}
.com_testimonio__body__img, .com_socio__body__img {
border-radius: 50%;
filter: grayscale(1);
background-color: #ececec;
width: 60px;
height: 60px;
overflow: hidden;
}
.com_testimonio__body__img img, .com_socio__body__img img {
border-radius: 50%;
width: 100%;
height: 100%;
object-position: center;
object-fit: cover;
}
.com_testimonio__body__descript, .com_socio__body__descript {
width: 75%;
}
.com_testimonio__body__descript p, .com_socio__body__descript p {
margin-bottom: 10px;
line-height: 140%;
}
.com_testimonio img, .com_socio img {
width: auto;
}
@media (max-width: 768px) {
.com_testimonio, .com_socio {
padding: 70px 25px 30px;
width: 94%;
margin-right: 0;
}
.com_testimonio:before, .com_socio:before {
left: 25px;
font-size: 24px;
}
.com_testimonio h5, .com_socio h5 {
font-size: 20px !important;
}
.com_testimonio__body__descript, .com_socio__body__descript {
margin-left: 15px;
}
}
@media (max-width: 560px) {
.com_testimonio, .com_socio {
padding: 60px 20px 30px;
width: 100%;
}
.com_testimonio h5, .com_socio h5 {
font-size: 18px !important;
}
}
.com_socio__body {
margin-bottom: 50px;
padding-right: 20px;
}
.com_socio__body p {
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
@media (max-width: 1190px) {
.com_socio__body {
padding-right: 0;
}
}
@media (max-width: 992px) {
.com_socio__body__img {
width: 46px;
height: 46px;
}
}
@media (max-width: 768px) {
.com_socio__body {
justify-content: flex-start;
}
.com_socio__body__img {
width: 60px;
height: 60px;
}
}
.com_socio__body--xl {
display: block;
}
@media (max-width: 768px) {
.com_socio__body--xl {
margin-bottom: 0;
}
}
.com_socio__body--xl .com_socio__body__img {
width: 120px;
height: 120px;
display: inline-block;
vertical-align: middle;
}
@media (max-width: 768px) {
.com_socio__body--xl .com_socio__body__img {
width: 20vw;
height: 20vw;
}
}
.com_socio__body--xl .com_socio__body__descript {
display: inline-block;
margin-left: 30px;
width: 50%;
vertical-align: middle;
}
@media (max-width: 768px) {
.com_socio__body--xl .com_socio__body__descript {
width: 66%;
}
}
@media (max-width: 560px) {
.com_socio__body--xl .com_socio__body__descript {
margin-left: 15px;
}
.com_socio__body--xl .com_socio__body__descript .com_h3 {
font-size: 20px !important;
}
}
.com_alianzas__body {
margin-bottom: 0px;
padding: 0 20px;
}
.com_page-vision {
height: 100%;
}
.com_page-vision header {
position: fixed;
}
.com_page-vision .h-100vh {
height: 100vh;
}
.com_page-vision .com_goto-arrow {
background: none;
border: none;
font-size: 40px;
cursor: pointer;
}
.com_page-vision .com_goto-arrow i {
animation: move-arrow 1.5s linear infinite;
position: relative;
display: block;
color: white;
top: 0;
transition: all 300ms ease;
}
.com_page-vision .com_goto-arrow i::before {
transform: rotate(90deg);
position: relative;
display: block;
}
.com_page-vision .section {
position: relative;
height: 100vh;
display: flex;
align-content: center;
}
.com_page-vision .section .container {
position: relative;
height: 100%;
}
.com_page-vision .section .row {
display: flex;
align-content: center;
height: 100vh;
}
.com_page-vision .com_rcrumbs {
position: absolute;
top: 90px;
left: 15px;
color: #ffffff;
z-index: 4;
margin-bottom: 0;
}
.com_page-vision .com_rcrumbs i:before {
color: #ffffff !important;
}
.com_page-vision .com_rcrumbs a {
color: #ffffff !important;
}
.com_page-vision .com_rcrumbs .divider:before {
border-left-color: #ffffff !important;
border-bottom-color: #ffffff !important;
}
.com_text-big {
font-size: 42px;
}
@media (max-width: 992px) {
.com_text-big {
font-size: 31px;
}
}
@media (max-width: 560px) {
.com_text-big {
font-size: 24px;
}
}
.com_value-list * {
color: #ffffff;
font-family: "Lira";
}
.com_value-list dt {
font-size: 21px;
margin-bottom: 20px;
}
.com_value-list dd {
font-size: 14px;
}
.com_value-list dd + dt {
margin-top: 60px;
}
@media (max-width: 992px) {
.com_value-list dd + dt {
margin-top: 30px;
}
}
.com_vision h1.com_text-big,
.com_vision h2.com_text-big,
.com_vision h3.com_text-big,
.com_vision h4.com_text-big,
.com_vision h5.com_text-big,
.com_vision h6.com_text-big {
font-size: 42px !important;
}
@media (max-width: 992px) {
.com_vision h1.com_text-big,
.com_vision h2.com_text-big,
.com_vision h3.com_text-big,
.com_vision h4.com_text-big,
.com_vision h5.com_text-big,
.com_vision h6.com_text-big {
font-size: 31px !important;
}
}
@media only screen and (max-width: 1280px) {
.com_vision .com_h1 {
font-size: 28px !important;
}
}
@media only screen and (max-width: 992px) {
.com_vision .com_h1 {
font-size: 20px !important;
}
}
@media only screen and (max-width: 375px) {
.com_vision .com_h1 {
font-size: 17px !important;
}
}
.com_vision .com_h2 {
text-transform: uppercase;
}
.com_vision .com_bg-last-vision-block {
height: 100vh;
display: flex;
position: relative;
align-content: center;
background-color: #0D61E7;
}
.com_vision .com_bg-last-vision-block .row {
align-items: flex-start;
}
@media only screen and (min-width: 768px) {
.com_vision .com_bg-last-vision-block .row .com_content-post {
padding: 0 40px;
}
}
.com_vision .com_bg-last-vision-block h2 {
text-align: center;
margin-bottom: 50px;
}
.com_vision .com_bg-last-vision-block h4 {
margin-bottom: 10px;
}
.com_vision .com_bg-last-vision-block h4 img {
display: inline-block;
vertical-align: bottom;
margin-right: 10px;
}
@media (max-width: 375px) {
.com_vision .com_bg-last-vision-block h4 img {
margin-right: 5px;
}
}
@media (max-width: 320px) {
.com_vision .com_bg-last-vision-block h4 {
font-size: 20px !important;
}
}
.com_vision .com_bg-last-vision-block p {
margin-bottom: 30px !important;
}
@media (max-width: 1280px) {
.com_vision .com_bg-last-vision-block {
padding-top: 80px;
}
.com_vision .com_bg-last-vision-block .row {
align-content: flex-start;
}
.com_vision .com_bg-last-vision-block h2 {
margin-bottom: 25px;
}
.com_vision .com_bg-last-vision-block p {
line-height: 140%;
margin-bottom: 25px !important;
font-size: 13px;
}
}
.com_content-post .animation {
opacity: 0;
transition: opacity 600ms ease;
}
@media (max-width: 992px) {
.com_content-post .animation {
opacity: 1;
}
}
.com_content-post-intro p {
font-size: 18px;
line-height: 32px;
}
.slick-active .animation {
opacity: 1;
transition: opacity 600ms ease;
}
/*
===================== Fondos =====================
*/
.com_banner-country {
width: 100%;
}
.com_banner-country--title {
background-color: #F3F0ED;
}
.com_acc-detail button {
align-items: center;
width: 100%;
padding: 1rem 1.25rem;
background-color: #ffffff;
color: #000000;
font-size: 14px;
border: none;
text-align: left;
display: flex;
justify-content: space-between;
cursor: pointer;
transition: all 500ms ease;
}
.com_acc-detail button.active {
background-color: #112132;
color: #ffffff;
transition: all 300ms ease;
}
.com_acc-detail button.active i:before {
transform: rotate(-90deg);
color: #ffffff;
transition: all 300ms ease;
}
.com_acc-detail button i {
display: block;
}
.com_acc-detail button i:before {
display: block;
transform: rotate(0deg);
font-size: 11px;
right: 6px;
position: relative;
color: #002FA7;
transition: all 300ms ease;
}
.com_acc-detail button + div {
display: none;
}
.com_user-img-text {
color: #6E6E6E;
}
.com_user-img-text .com_small p {
margin-bottom: 0;
}
@media only screen and (max-width: 992px) {
.com_user-img-text {
margin-bottom: 60px;
display: block;
}
}
.com_user-img-text:hover {
text-decoration: none !important;
}
.com_radius-img {
border-radius: 100%;
}
.com_less-children-margin p {
margin-bottom: 5px;
}
.com_download-button {
display: block;
}
.com_download-button:hover {
text-decoration: none !important;
}
.com_acc-sidebar .com_info-core > a {
color: #000000;
}
.com_acc-sidebar .com_info-core > a:hover, .com_acc-sidebar .com_info-core > a.active {
color: #002FA7;
font-weight: 700;
}
@media (max-width: 992px) {
.com_acc-sidebar {
margin-top: 0;
}
}
.com_acc-sidebar .com_acc-detail {
display: block;
}
@media (max-width: 991px) {
.com_acc-sidebar .com_acc-detail {
display: none;
}
}
.com_acc-sidebar .com_acc-detail button {
align-items: center;
width: 100%;
padding: 1.25rem 1.25rem;
background-color: #ffffff;
color: #000000;
font-size: 1rem;
border: none;
text-align: left;
display: flex;
justify-content: space-between;
cursor: pointer;
position: relative;
overflow: hidden;
transition: all 500ms ease;
border-left: 4px solid #ffffff;
}
.com_acc-sidebar .com_acc-detail button span {
position: relative;
z-index: 1;
}
.com_acc-sidebar .com_acc-detail button:before {
content: "";
position: absolute;
left: 0;
top: 0;
visibility: hidden;
opacity: 0;
height: 100%;
width: 100%;
background-color: #F1F1F2;
transition: background-color 600ms ease, opacity 600ms ease, visibility 600ms ease, width 600ms ease;
}
.com_acc-sidebar .com_acc-detail button.active {
transition: all 300ms ease;
border-left-color: #002FA7;
}
.com_acc-sidebar .com_acc-detail button.active span {
transition: all 300ms ease;
}
.com_acc-sidebar .com_acc-detail button.active:before {
opacity: 1;
visibility: visible;
transition: background-color 300ms ease, opacity 600ms ease, visibility 600ms ease, width 600ms ease;
}
.com_acc-sidebar .com_acc-detail button.active i:before {
transform: rotate(-90deg);
transition: all 300ms ease;
}
.com_acc-sidebar .com_acc-detail button i {
display: block;
}
.com_acc-sidebar .com_acc-detail button i:before {
display: block;
transform: rotate(0deg);
font-size: 11px;
right: -1px;
position: relative;
color: #6E6E6E;
transition: all 300ms ease;
}
.com_acc-sidebar .com_acc-detail button + div {
display: none;
}
.com_acc-sidebar .com_info-core {
padding: 20px 20px 32px 32px;
}
.com_acc-sidebar .com_info-core > a {
display: table !important;
width: auto;
}
.com_acc-sidebar .com_info-core > a + a {
margin-top: 16px;
}
.com_deploy-acc-menu-mobile {
display: none;
border: none;
width: 100%;
max-width: 100%;
margin: 0 0 10px 0;
align-items: center;
font-size: 14px;
justify-content: center;
background: none;
padding: 20px 10px;
border-bottom: solid 1px #E3E3E3;
color: #002FA7;
text-transform: uppercase;
cursor: pointer;
font-weight: 600;
}
.com_deploy-acc-menu-mobile.active i {
transform: rotate(90deg);
transition: all 300ms ease;
}
@media only screen and (max-width: 991px) {
.com_deploy-acc-menu-mobile {
display: flex;
justify-content: space-between;
}
.com_deploy-acc-menu-mobile i {
margin-left: 30px;
transform: rotate(0deg);
transition: all 300ms ease;
}
}
.com_commentary-post {
margin-bottom: 50px;
}
@media only screen and (max-width: 992px) {
.com_commentary-post {
margin-bottom: 40px;
}
.com_commentary-post .com_download-button i {
font-size: 15px;
}
}
@media only screen and (max-width: 768px) {
.com_commentary-post {
margin-bottom: 30px;
}
}
.com_footnote {
margin-top: -30px;
margin-bottom: 50px;
}
@media only screen and (max-width: 768px) {
.com_footnote {
margin-top: -10px;
margin-bottom: 30px;
}
}
/*custom amchart*/
.amcharts-range-selector-from-input,
.amcharts-range-selector-to-input {
height: 37px !important;
}
.amcharts-range-selector-wrapper {
padding: 0 !important;
}
#selectordiv .amcharts-range-selector-period-wrapper .amcharts-range-selector-period-title {
display: none !important;
}
#selectordiv .amcharts-range-selector-period-button {
position: relative;
transition: background 100ms linear;
background: #FFFFFF;
box-shadow: 0 2px 9px 0 #E3E3E3;
border-radius: 5px !important;
font-size: 14px;
color: #4D4D4D;
border-radius: 10px;
border: none !important;
padding: 10px 16px;
cursor: pointer;
}
#selectordiv .amcharts-range-selector-period-button:hover {
background-color: #00AEEF;
color: #ffffff;
}
#chartdiv {
margin-top: 50px;
}
.single-fondo .com_content-post p {
color: #6E6E6E;
}
@media only screen and (max-width: 992px) {
.md-margin-top-2 {
margin-top: 20px;
}
}
/*
===================== Landing =====================
*/
.com_acceso-clientes {
display: none;
}
@media (max-width: 768px) {
.com_acceso-clientes {
position: fixed;
bottom: 0;
z-index: 100;
box-shadow: 0 -2px 4px 0 rgba(185, 185, 185, 0.5);
border-radius: 5px 5px 0 0;
font-family: "Lira";
color: #002FA7;
background: #FFFFFF;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
height: 50px;
animation: fadeInUp 500ms;
}
.com_acceso-clientes i {
margin-right: 5px;
}
.com_acceso-clientes i::before {
font-size: 16px;
}
}
.page-template-page-landing-eventos .com_content-post h1 {
font-size: 1.5rem !important;
}
.page-template-page-landing-eventos .com_menu--landing {
background-color: #3A5B8E;
}
.page-template-page-landing-eventos .com_menu--landing a {
background-color: #3A5B8E;
}
.page-template-page-landing-eventos .com_simple-acc.com_simple-acc--primary .com_acc-deploy-button {
background-color: #3A5B8E;
}
.page-template-page-landing-eventos .com_simple-acc.com_simple-acc--primary .com_event-item h2 {
color: #3A5B8E;
}
h2.landing-subtitle {
font-size: 1.5rem !important;
}
/*
===================== Intermediarios =====================
*/
.com_percent_counter {
padding: 10px 20px;
border-left: 3px solid #002FA7;
}
.com_percent_counter .com_counter {
color: #002FA7;
font-family: "Roboto Condensed";
font-size: 32px;
letter-spacing: 0;
margin: 0 5px;
}
.com_percent_counter .symbol {
font-size: 22px;
}
/*
===================== Intermediarios =====================
*/
.com_icon-list-item:not(:last-child):not(:nth-child(4n)):after {
content: "";
position: absolute;
top: 50%;
right: 0;
width: 2px;
height: 100%;
transform: translateY(-50%);
background-color: #e3e3e3;
}
@media (max-width: 400px) {
.com_icon-list-item:not(:last-child):not(:nth-child(4n)):after {
content: none;
}
}
.com_list-grid {
margin: 0 -25px;
}
.com_list-grid-item {
padding: 0 25px;
position: relative;
}
.com_list-grid-item:first-child:after {
content: "";
position: absolute;
top: 50%;
right: 0;
width: 2px;
height: 100%;
transform: translateY(-50%);
background-color: #e3e3e3;
}
@media (max-width: 400px) {
.com_list-grid-item:first-child:after {
content: none;
}
}
.com_list-grid-item:last-child:after {
content: "";
position: absolute;
top: 50%;
left: 0;
width: 2px;
height: 100%;
transform: translateY(-50%);
background-color: #e3e3e3;
}
@media (max-width: 400px) {
.com_list-grid-item:last-child:after {
content: none;
}
}
.com_modal-wealth .modal-pb-0 .modal-content {
padding-bottom: 0;
}
.com_modal-wealth .modal-pb-0 .modal-content .modal-body {
padding-bottom: 0;
}
.com_modal-wealth .modal-content {
padding: 2% 50px;
}
@media (max-width: 560px) {
.com_modal-wealth .modal-content {
padding: 6%;
}
}
@media (max-width: 400px) {
.com_modal-wealth .modal-content {
padding: 2%;
}
}
.com_modal-wealth .modal-content .modal-clear-padding {
margin-left: -66px;
margin-right: -66px;
padding-left: 66px;
padding-right: 66px;
}
@media (max-width: 560px) {
.com_modal-wealth .modal-content .modal-clear-padding {
margin-left: -48px;
margin-right: -48px;
padding-left: 48px;
padding-right: 48px;
}
}
@media (max-width: 400px) {
.com_modal-wealth .modal-content .modal-clear-padding {
margin-left: -22px;
margin-right: -22px;
padding-left: 22px;
padding-right: 22px;
}
}
.com_modal-wealth .modal-title {
text-transform: uppercase;
text-align: center;
font-family: "Roboto";
color: #4D4D4D;
font-size: 24px;
margin-bottom: 40px;
}
.com_modal-wealth .com_mod-icons img {
margin-bottom: 16px;
}
.com_modal-wealth ul {
margin-bottom: 20px;
}
.com_modal-wealth ul li {
display: block;
list-style: none;
margin-bottom: 20px;
position: relative;
font-size: 16px;
padding-left: 23px;
line-height: 140%;
}
.com_modal-wealth ul li:before {
content: "";
width: 4px;
height: 4px;
display: inline-block;
background-color: #002FA7;
position: absolute;
left: 0;
top: 10px;
margin-top: -2px;
}
.com_modal-wealth ul li:last-child {
margin-bottom: 0;
}
.com_modal-wealth ul li a:hover {
text-decoration: underline;
}
.com_global-trends__highlight {
font-size: 18px;
line-height: 32px;
}
section {
padding: 60px 0;
}
.card {
padding: 30px;
border-radius: 5px;
}
.card--gray {
background-color: #EFEDEB;
height: 250px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}
.card--gray img {
height: 30px;
margin: auto;
margin-bottom: 24px;
}
.card--white {
background-color: #fff;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
height: 100%;
}
.card--white p {
color: #4E4E4E;
}
.card--white .com_icon--circle {
display: inline-flex;
align-items: center;
justify-content: center;
width: 60px;
height: 60px;
border-radius: 50%;
border: 1px solid #3A5B8E;
margin-bottom: 20px;
}
.card--half-blue {
display: grid;
grid-template-columns: 1fr;
margin-bottom: 20px;
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3);
}
.card--half-blue__title {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
padding: 20px 20px 30px 20px;
background-color: #3A5B8E;
border-radius: 3px 0 0 3px;
text-align: center;
}
.card--half-blue__title::after {
content: "";
display: block;
position: absolute;
bottom: -10px;
left: 50%;
transform: translate(-50%, 0) rotate(45deg);
width: 35px;
height: 35px;
background-color: #3A5B8E;
}
.card--half-blue__title img {
margin-bottom: 15px;
}
.card--half-blue__title p {
margin: 0;
}
.card--half-blue__content {
display: flex;
align-items: center;
background-color: #fff;
padding: 20px;
padding-top: 30px;
border-radius: 0 3px 3px 0;
color: #4E4E4E;
}
.card--half-blue__content ul {
margin: 0;
padding-left: 10px;
}
.card--half-blue__content ul li {
list-style-type: disc;
margin-bottom: 8px;
}
.grid-container.desktop {
display: none;
}
@media (min-width: 768px) {
.grid-container {
display: grid;
grid-template-columns: 40% 60%;
}
.grid-container.desktop {
display: grid;
}
.card--half-blue {
grid-template-columns: 40% 60%;
}
.card--half-blue__title {
flex-direction: row;
padding: 20px 30px 20px 20px;
text-align: left;
}
.card--half-blue__title::after {
top: 50%;
right: -10px;
bottom: auto;
left: auto;
transform: translate(0, -50%) rotate(45deg);
}
.card--half-blue__title img {
margin-right: 20px;
margin-bottom: 0px;
}
.card--half-blue__content {
padding-top: 20px;
padding-left: 40px;
}
}
.no-after.com_banner-int::before {
visibility: hidden;
}
#gt-grafics .com_banner-int__descript {
max-width: unset;
position: relative;
}
#gt-why {
position: relative;
font-family: "Lira";
}
#gt-why:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(243, 240, 237, 0.7);
}
#gt-why h5 {
position: relative;
}
#gt-graphics {
position: relative;
}
#gt-graphics .gt-graphics__container {
position: relative;
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
text-align: center;
}
#gt-graphics .gt-graphics__container img {
max-width: 790px;
}
#gt-graphics:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(58, 91, 142, 0.7);
}
.play-video a {
position: relative;
display: flex;
align-items: center;
justify-content: center;
}
.play-video a::after {
content: url("../../assets/img/icons/video-player.svg");
position: absolute;
margin-bottom: 20px;
}
#gt-megatendencias .com_post__img img {
height: 200px;
object-fit: cover;
}
/*# sourceMappingURL=main.css.map */