/* Estilos CSS para Crucero del Norte Website Amarillo base: #ffcf00; Amarillo fluo: #ffeb16; Amarillo fluo 2024: #ffee02; */ body { font-family: "Roboto Condensed", sans-serif; font-size: 13px; } a, a:visited { color: #fdb916; } a:hover, a:active, a:focus { color: #fdb916; text-decoration: none; } header { /*background: url(../images/ui/tri-bg.jpg) no-repeat top center;*/ background-color: #ffee02; border-bottom: 2px solid #ffeb16; position: fixed; width: 100%; z-index: 99; } .ui-datepicker { z-index: 9999 !important; } footer { margin: 25px 0 0 0; padding: 20px 0 20px 0; background-color: #e5e5e5; } input { font-size: 16px; padding: 5px; border-radius: 5px; } input.base { color: #c54f00; border: 2px solid #e3c600; font-size: 16px; font-style: italic; letter-spacing: -0.025em; width: 100%; padding: 7px; border-radius: 7px; margin: 10px 0 10px 0; } h1, h2, h3, h4 { letter-spacing: -0.025em; margin: 0px; } .bullet { display: inline-block; margin-right: 15px; } .wrapper { background-color: white; } .top-header { } .logo { text-align: center; } .logo-top { max-width: 120px; padding: 10px; } .main-carrousel { max-width: 1170px; width: 100%; margin: 20px auto 20px auto; } .sliderhome { } .img-rounded { border-radius: 12px; } .sliderhome li { text-align: center; height: 500px; background-repeat: no-repeat; background-position: center; } .slidercards { } .card-item { display: block; padding: 10px; border-radius: 10px; border-bottom: 5px solid #ffcf00; background: #f6f6f6; background: -moz-linear-gradient(top, #f6f6f6 0%, #ececec 100%); background: -webkit-linear-gradient(top, #f6f6f6 0%, #ececec 100%); background: linear-gradient(to bottom, #f6f6f6 0%, #ececec 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f6f6', endColorstr='#ececec',GradientType=0 ); transition: all 0.3s; min-height: 120px; } .card-item:hover { border-bottom-color: #000; } .card-item a:hover { text-decoration: none; } .von-max-container { background-color: #1addda; } .von-container { width: 100%; position: relative; /*margin-top:-140px;*/ } .von-widget { max-width: 1170px; width: 95%; margin: 20px auto 20px auto; padding: 20px 20px 10px 20px; background: url(../images/ui/tri-bg.jpg) no-repeat top center; border-radius: 12px; box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.25); } .von-header { padding: 0 0 0 20px; display: flex; align-content: center; justify-content: flex-start; } .von-header img { width: 30px; height: auto; margin-right: 5px; } .von-header h3 { color: black; font-size: 32px; margin: 0px; font-weight: bold; } .von-header h3 span { color: #e05a00; font-weight: bold; } #mascrucero { font-size: 18px; line-height: 21px; color: white; font-family: "Roboto", sans-serif; font-weight: 300; overflow: auto; } #hoteles { } .main { } .tarjetas-container { } .tarjetas-carrousel { margin: 0px; } .promo { } .promo-imagen { border-top-right-radius: 10px; border-top-left-radius: 10px; } .aside-info-contacto { text-align: left; } .aside-info-contacto div { padding-left: 10px; } .aside-info-contacto .txt1-contacto { background: url(../images/ui/telefono.png) no-repeat 5px 0; } .aside-info-contacto .num-contacto, .aside-info-contacto .num-contacto-min { text-align: center; } .separador-trama { height: 20px; border: none; background: url(../images/ui/bg-separador-promos.jpg); background-size: cover; padding: 0px; margin: 0 0 5px 0; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; } .item-callcenter-arg { padding-top: 15px; height: 170px; border-top-left-radius: 12px; border-bottom-left-radius: 12px; background-color: #ffee02; } .item-callcenter-py { padding-top: 15px; height: 170px; background-color: #ffee02; } .item-callcenter-ws { padding-top: 15px; height: 170px; background-color: #ffee02; } .item-chat { height: 170px; background: url(../images/ui/chat-naranja.jpg) no-repeat top center, url(../images/ui/bg-item-chat.jpg) repeat-x; border-radius: 0px; } .item-callcenter-arg-aside { padding-top: 15px; height: 170px; background-color: #ffcf00; border-top-left-radius: 12px; border-top-right-radius: 12px; } .item-callcenter-py-aside { padding-top: 15px; height: 170px; background-color: #ffcf00; } .item-callcenter-ws-aside { padding-top: 15px; height: 170px; background-color: #ffcf00; } .item-chat-aside { height: 170px; background: url(../images/ui/chat.jpg) no-repeat top center, url(../images/ui/bg-item-chat.jpg) repeat-x; border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; } .item-callcenter-arg-min { height: 125px; background: url(../images/ui/callcenter-arg-min.jpg) no-repeat top center; background-color: #ffcf00; border-radius: 0px; } .item-callcenter-py-min { height: 125px; background: url(../images/ui/callcenter-py-min.jpg) no-repeat top center; background-color: #ffcf00; border-radius: 0px; } .item-callcenter-ws-min { height: 125px; background: url(../images/ui/callcenter-ws-min.jpg) no-repeat top center; background-color: #ffcf00; border-radius: 0px; } .item-chat-min { height: 125px; background: url(../images/ui/chat-min.jpg) no-repeat top center, url(../images/ui/bg-item-chat.jpg) repeat-x; } .bottom-pattern { /*height:220px;*/ height: 120px; /*background: url(../images/ui/bottom-pattern.jpg) no-repeat top center;*/ background-color: #ffee02; } .refcontacto { height: 170px; background: url(../ref/contacto.jpg) no-repeat; } .lista-nav-footer { list-style: none; margin: 20px 0 20px 0; padding: 0px; } .lista-nav-footer li { margin: 0px; padding: 5px 0 5px 0; } .lista-nav-footer li a { color: #000; font-size: 18px; transition: all 0.25s; padding-left: 0px; } .lista-nav-footer li a:hover { text-decoration: none; color: #e05a00; padding-left: 15px; } /*MENU PRINCIPAL*/ .menuprincipal { list-style: none; margin-top: 40px; } .menuprincipal li { float: right; } .menuprincipal li a { display: block; font-size: 21px; text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.35); font-weight: bold; color: white; padding: 20px; } .menuprincipal li a:hover { text-decoration: none; color: #c75200; text-shadow: 0px 0px 0px rgba(0, 0, 0, 0.35); } /*SOCIAL LINKS*/ .socialitem-container { margin: 10px 0 10px 0; overflow: auto; } .socialitem { display: block; float: left; width: 40px; height: 40px; margin-right: 15px; transition: all 0.25s; } .fb { background: url(../images/ui/social.png) no-repeat 0 0; } .fb:hover { background: url(../images/ui/social.png) no-repeat 0 -40px; } .ins { background: url(../images/ui/social.png) no-repeat -40px 0; } .ins:hover { background: url(../images/ui/social.png) no-repeat -40px -40px; } .twi { background: url(../images/ui/social.png) no-repeat -80px 0; } .twi:hover { background: url(../images/ui/social.png) no-repeat -80px -40px; } .ytb { background: url(../images/ui/social.png) no-repeat -120px 0; } .ytb:hover { background: url(../images/ui/social.png) no-repeat -120px -40px; } .pint { background: url(../images/ui/social.png) no-repeat -160px 0; } .pint:hover { background: url(../images/ui/social.png) no-repeat -160px -40px; } /*VON WIDGET*/ .input-von { color: #c54f00; border: 2px solid #e3c600; font-size: 20px; font-style: italic; letter-spacing: -0.025em; width: 100%; padding: 7px; border-radius: 7px; margin-bottom: 15px; margin-top: 7px; transition: border-color 0.35s; } .input-von:focus { border-color: #c54f00; } #input-von-origen { padding-left: 55px; background: url(../images/ui/input-origen-icon.png) no-repeat 8px 8px, -moz-linear-gradient(top, #dbdbdb 0%, #ffffff 100%); background: url(../images/ui/input-origen-icon.png) no-repeat 8px 8px, -webkit-linear-gradient(top, #dbdbdb 0%, #ffffff 100%); background: url(../images/ui/input-origen-icon.png) no-repeat 8px 8px, linear-gradient(to bottom, #dbdbdb 0%, #ffffff 100%); } #input-von-destino { padding-left: 55px; background: url(../images/ui/input-origen-icon.png) no-repeat 8px 8px, -moz-linear-gradient(top, #dbdbdb 0%, #ffffff 100%); background: url(../images/ui/input-origen-icon.png) no-repeat 8px 8px, -webkit-linear-gradient(top, #dbdbdb 0%, #ffffff 100%); background: url(../images/ui/input-origen-icon.png) no-repeat 8px 8px, linear-gradient(to bottom, #dbdbdb 0%, #ffffff 100%); } #input-von-ida { padding-left: 55px; background: url(../images/ui/input-fecha-icon.png) no-repeat 8px 8px, -moz-linear-gradient(top, #dbdbdb 0%, #ffffff 100%); background: url(../images/ui/input-fecha-icon.png) no-repeat 8px 8px, -webkit-linear-gradient(top, #dbdbdb 0%, #ffffff 100%); background: url(../images/ui/input-fecha-icon.png) no-repeat 8px 8px, linear-gradient(to bottom, #dbdbdb 0%, #ffffff 100%); } #input-von-regreso { padding-left: 55px; background: url(../images/ui/input-fecha-icon.png) no-repeat 8px 8px, -moz-linear-gradient(top, #dbdbdb 0%, #ffffff 100%); background: url(../images/ui/input-fecha-icon.png) no-repeat 8px 8px, -webkit-linear-gradient(top, #dbdbdb 0%, #ffffff 100%); background: url(../images/ui/input-fecha-icon.png) no-repeat 8px 8px, linear-gradient(to bottom, #dbdbdb 0%, #ffffff 100%); } ::-webkit-input-placeholder { color: #c54f00; } ::-moz-placeholder { color: #c54f00; } :-ms-input-placeholder { color: #c54f00; } :-moz-placeholder { color: #c54f00; } /* Slide */ .slide-image { position: relative; } .slide-data { position: absolute; top: 20px; width: 40%; z-index: 9999; text-align: right; } .slide-data-bg { background: url(../images/ui/fondo-promo.png) no-repeat top right; padding: 15px; } .base-globito { height: 16px; width: 100%; background: url(../images/ui/base-globito.png) no-repeat right; } .irArriba { position: fixed; right: 50px; bottom: 50px; width: 40px; height: 40px; background: url(../images/ui/irArriba.jpg) no-repeat center center; border-radius: 5px; display: none; } .irArriba:hover { cursor: pointer; } .foto-mascrucero { display: none; } #txt_newsletter_suscripcion { border-color: #c5c5c5; } #txt_newsletter_suscripcion:focus { border-color: #ffcf00; } /*VON Min VersiĆ³n Vertical 2022*/ .slidevon-container { } .von-min-container { margin-top: 20px; margin-bottom: 20px; } .von-min-widget { background-color: yellow; padding: 15px 15px 10px 15px; border-radius: 12px; /*background: url(../images/ui/tri-bg.jpg) no-repeat top center;*/ } .von-min-header { padding: 0; display: flex; align-content: center; justify-content: flex-start; } .von-min-header img { width: 30px; height: 40px; margin-right: 5px; } .von-min-header h3 { color: #000; font-size: 28px; margin: 0px; line-height: 40px; font-weight: bold; } .von-min-header h3 span { color: #e05a00; font-weight: bold; } .von-min-fechaida { float: left; width: 48%; } .von-min-fechavuelta { float: right; width: 48%; } /* Super Extra Small Devices, Phones */ @media only screen and (min-width: 320px) { .foto-mascrucero { display: none; } .top-header { } .logo-top { max-width: 200px; height: auto; } .cardimg { /*float:left;*/ width: 80%; height: auto; padding-right: 0px; } .cardcuotas { font-size: 24px; color: #c54f00; font-weight: bold; line-height: 30px; margin: 0px; letter-spacing: -0.025em; text-align: center; } .cardinfo1 { font-size: 14px; line-height: 18px; color: #acacac; text-transform: uppercase; margin: 0px; text-align: center; } .cardinfo2 { line-height: 14px; font-size: 16px; color: #ffcf00; margin: 0px; text-align: center; } .promos-titulo { padding: 12px; border-radius: 12px; background-color: #e67800; margin-left: 15px; margin-right: 15px; } .logopie { text-align: center; } .logopie img { width: 80%; height: auto; text-align: center; } .infopie { padding: 20px 0 0 20px; text-align: center; } .infopie p { margin: 0px; padding: 0px; font-size: 16px; color: #3b3b3b; } .von-container { /*margin-top:0px;*/ } .sliderhome li { height: 320px; } .slide-data-title { font-size: 21px; line-height: 20px; font-weight: bold; letter-spacing: -0.025em; color: #c54f00; } .slide-data-subtitle { font-size: 16px; line-height: 16px; font-weight: normal; letter-spacing: -0.05em; color: #5a5a5a; text-transform: uppercase; } .slide-data-bg { padding: 5px; } .cd-dropdown-trigger { font-size: 1.25em; } } /* Extra Small Devices, Phones */ @media only screen and (min-width: 480px) { .logo-top { max-width: 300px; height: auto; margin:15px 0 15px 0; } .cardimg { float: left; width: 100%; height: auto; padding-right: 0px; } .cardcuotas { font-size: 24px; color: #c54f00; font-weight: bold; line-height: 24px; margin: 0px; letter-spacing: -0.025em; } .cardinfo1 { font-size: 14px; line-height: 14px; color: #acacac; text-transform: uppercase; margin: 0px; } .cardinfo2 { line-height: 14px; font-size: 14px; color: #ffcf00; margin: 0px; } .logopie img { width: 50%; height: auto; text-align: center; } .sliderhome li { height: 360px; } .slide-data-title { font-size: 30px; line-height: 30px; } .slide-data-subtitle { font-size: 21px; line-height: 21px; } } /* Small Devices, Tablets */ @media only screen and (min-width: 768px) { .foto-mascrucero { display: inline; float: left; padding-right: 15px; } .cardcuotas { font-size: 32px; line-height: 32px; } .cardinfo1 { font-size: 18px; line-height: 18px; } .cardinfo2 { line-height: 18px; font-size: 18px; } .promos-titulo { padding: 12px; border-radius: 12px; background-color: #e67800; } .von-container { /*margin-top:-60px;*/ } .sliderhome li { height: 400px; } .slide-data-bg { padding: 10px; } .slide-data-title { font-size: 32px; line-height: 30px; } .slide-data-subtitle { font-size: 21px; line-height: 20px; } .cd-dropdown-trigger { padding: 0 36px 0 10px; background-color: transparent; text-transform: uppercase; font-size: 1.25em; font-weight: bold; color: #000; } .cd-dropdown-trigger:hover { text-shadow: none; } .cd-dropdown-trigger:focus { text-shadow: none; } .cd-dropdown-trigger:active { text-shadow: none; } .item-callcenter-arg { border-top-left-radius: 12px; border-bottom-left-radius: 0px; } .item-callcenter-py { border-top-right-radius: 12px; } .item-callcenter-ws { border-bottom-left-radius: 12px; } .item-chat { border-top-right-radius: 0px; border-bottom-right-radius: 12px; } .item-callcenter-arg-aside { border-top-left-radius: 12px; border-top-right-radius: 0px; } .item-callcenter-py-aside { border-top-right-radius: 12px; } .item-callcenter-ws-aside { border-bottom-left-radius: 12px; } .item-chat-aside { border-bottom-left-radius: 0px; border-bottom-right-radius: 12px; } } /* Medium Devices, Desktops */ @media only screen and (min-width: 992px) { .logo-top { max-width: 400px; height: auto; margin:15px 0 15px 0; } .top-header { } .cardimg { float: none; width: 75%; text-align: center; padding-right: 0px; } .promos-titulo { margin-bottom: 20px; background-color: #ffee02; padding: 12px 12px 8px 12px; border-radius: 12px; margin-left: auto; margin-right: auto; color:black; } .infopie { text-align: left; } .logopie img { width: 80%; height: auto; text-align: center; } .von-container { /*margin-top:-60px;*/ } .titulo-contactate { height: 100px; background: url(../images/ui/chica-callcenter.png) no-repeat right; padding: 25px 90px 0 0; } .sliderhome li { height: 435px; } .slide-data-bg { padding: 15px; } .slide-data-title { font-size: 40px; line-height: 40px; } .slide-data-subtitle { font-size: 26px; line-height: 26px; } .cd-dropdown-trigger { font-size: 2em; } .menu .cd-dropdown-trigger { } .cd-dropdown-trigger { font-size: 1.25em; } .menu .content-menu-widescreen { display: block; } .menu .cd-dropdown-wrapper { margin: 30px 0 0 2%; } .von-min-header { display: none; } .item-callcenter-arg-aside { border-top-left-radius: 12px; border-top-right-radius: 12px; } .item-callcenter-py-aside { border-top-right-radius: 0px; } .item-callcenter-ws-aside { border-bottom-left-radius: 0px; } .item-chat-aside { border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; } } /* Large Devices, Wide Screens */ @media only screen and (min-width: 1200px) { .logo-top { max-width: 500px; height: auto; margin:15px 0 15px 0; } .von-container { /*margin-top:-70px;*/ } .cardimg { float: left; width: 45%; padding-right: 15px; padding-bottom: 20px; } .cardcuotas { font-size: 30px; color: #c54f00; font-weight: bold; line-height: 32px; margin: 0px; letter-spacing: -0.025em; text-align: left; } .cardinfo1 { font-size: 16px; line-height: 18px; color: #acacac; text-transform: uppercase; margin: 0px; text-align: left; } .cardinfo2 { line-height: 18px; font-size: 16px; color: #000; margin: 0px; text-align: left; } .slide-data-title { font-size: 52px; line-height: 56px; } .slide-data-subtitle { font-size: 30px; line-height: 34px; } .cd-dropdown-trigger { padding: 0 36px 0 20px; font-size: 1.5em; } .von-min-header { display: flex; } .item-callcenter-arg { border-top-left-radius: 12px; border-bottom-left-radius: 12px; } .item-callcenter-py { border-top-right-radius: 0px; } .item-callcenter-ws { border-bottom-left-radius: 0px; } .item-chat { border-top-right-radius: 12px; border-bottom-right-radius: 12px; } }