/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* FONT-FACE */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
@font-face {
font-family:'MyriadPro';
src: url('fonts/myriadpro/MyriadPro-Regular.eot');
src: url('fonts/myriadpro/MyriadPro-Regular.eot?#iefix') format('embedded-opentype'),
url('fonts/myriadpro/MyriadPro-Regular.woff') format('woff'),
url('fonts/myriadpro/MyriadPro-Regular.ttf') format('truetype'),
url('fonts/myriadpro/MyriadPro-Regular.svg#') format('svg'),
url('fonts/minionpro/MinionPro-Regular.otf') format('opentype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family:'Calibri';
src: url('fonts/Calibri/Calibri.eot');
src: url('fonts/Calibri/Calibri.eot?#iefix') format('embedded-opentype'),
url('fonts/Calibri/Calibri.woff') format('woff'),
url('fonts/Calibri/Calibri.ttf') format('truetype'),
url('fonts/Calibri/Calibri.svg#') format('svg'),
url('fonts/Calibri/Calibri.otf') format('opentype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family:'Perpetua';
src: url('fonts/Perpetua/Perpetua.eot');
src: url('fonts/Perpetua/Perpetua.eot?#iefix') format('embedded-opentype'),
url('fonts/Perpetua/Perpetua.woff') format('woff'),
url('fonts/Perpetua/Perpetua.ttf') format('truetype'),
url('fonts/Perpetua/Perpetua.svg#') format('svg'),
url('fonts/Perpetua/Perpetua.otf') format('opentype');
font-weight: normal;
font-style: normal;
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* BODY NO DEBE IR */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
html
{
font-family : verdana, sans-serif;
-webkit-text-size-adjust : 100%;
-ms-text-size-adjust : 100%;
font-size : 62.5%;
}
body
{
font-family : 'Calibri', sans-serif;
font-size : 12px;
/* background : url(imgs/scribble_light.png) ; */
background-color: rgba(235, 235, 235, 1);
margin-left : 0rem;
margin-right : 0rem;
padding-top : 15px;
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* TYPE RENDERING MIX */
/* apply CSS based on the text rasterizer and */
/* antialiasing your browser is using */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/*The text rasterizer class can take the following values:*/
.tr-coretext { /* for OS X and iOS; */
}
.tr-gdi { /* for Windows XP and Windows Vista SP1; */
}
.tr-directwrite { /* for Windows Vista SP2 and above; */
}
.tr-freetype { /* for Android and Linux. */
}
/*The antialiasing method class will be one of the following:*/
.tr-aa-none { /* when no antialiasing is applied; */
}
.tr-aa-grayscale { /* when grayscale antialiasing is applied; */
}
.tr-aa-subpixel { /* when subpixel antialiasing is applied. */
}
/* If Type Rendering Mix can’t determine the antialiasing method with absolute certainty it will attempt to guess. In this case unknown will be added to the class name. The resulting classes are: */
.tr-aa-unknown-none { /* when aliasing is guessed; */
}
.tr-aa-unknown-grayscale { /* when grayscale antialiasing is guessed; */
}
.tr-aa-unknown-subpixel { /* when subpixel antialiasing is guessed. */
}
/* ///////////////////////////////////////////////////////////////////////// */
/* LOS TÃTULOS EN MAC AHORA SE VEN MÃS FINOS */
/* ///////////////////////////////////////////////////////////////////////// */
.tr-coretext h1 {
font-weight: 100;
}
/* ///////////////////////////////////////////////////////////////////////// */
/* LOS TÃTULOS EN WINDOWS Y LINUX AHORA SE VEN MÃS GRUESOS */
/* ///////////////////////////////////////////////////////////////////////// */
.tr-directwrite h1,
.tr-freetype h1 {
font-weight: 600;
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* CLASES DE FONT-SIZE - REM */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
.fs-06rem { font-size: 0.6rem }
.fs-07rem { font-size: 0.7rem }
.fs-08rem { font-size: 0.8rem }
.fs-09rem { font-size: 0.9rem }
.fs-10rem { font-size: 1.0rem }
.fs-11rem { font-size: 1.1rem }
.fs-12rem { font-size: 1.2rem }
.fs-13rem { font-size: 1.3rem }
.fs-14rem { font-size: 1.4rem }
.fs-15rem { font-size: 1.5rem }
.fs-16rem { font-size: 1.6rem }
.fs-17rem { font-size: 1.7rem }
.fs-18rem { font-size: 1.8rem }
.fs-19rem { font-size: 1.9rem }
.fs-20rem { font-size: 2.0rem }
.fs-21rem { font-size: 2.1rem }
.fs-22rem { font-size: 2.2rem }
.fs-23rem { font-size: 2.3rem }
.fs-24rem { font-size: 2.4rem }
.fs-25rem { font-size: 2.5rem }
.fs-26rem { font-size: 2.6rem }
.fs-27rem { font-size: 2.7rem }
.fs-28rem { font-size: 2.8rem }
.fs-29rem { font-size: 2.9rem }
.fs-30rem { font-size: 3.0rem }
.fs-31rem { font-size: 3.1rem }
.fs-32rem { font-size: 3.2rem }
.fs-33rem { font-size: 3.3rem }
.fs-34rem { font-size: 3.4rem }
.fs-35rem { font-size: 3.5rem }
.fs-36rem { font-size: 3.6rem }
.fs-37rem { font-size: 3.7rem }
.fs-38rem { font-size: 3.8rem }
.fs-39rem { font-size: 3.9rem }
.fs-40rem { font-size: 4.0rem }
.fs-41rem { font-size: 4.1rem }
.fs-42rem { font-size: 4.2rem }
.fs-43rem { font-size: 4.3rem }
.fs-44rem { font-size: 4.4rem }
.fs-45rem { font-size: 4.5rem }
.fs-46rem { font-size: 4.6rem }
.fs-47rem { font-size: 4.7rem }
.fs-48rem { font-size: 4.8rem }
.fs-49rem { font-size: 4.9rem }
.fs-50rem { font-size: 5.0rem }
.fs-51rem { font-size: 5.1rem }
.fs-52rem { font-size: 5.2rem }
.fs-53rem { font-size: 5.3rem }
.fs-54rem { font-size: 5.4rem }
.fs-55rem { font-size: 5.5rem }
.fs-56rem { font-size: 5.6rem }
.fs-57rem { font-size: 5.7rem }
.fs-58rem { font-size: 5.8rem }
.fs-59rem { font-size: 5.9rem }
.fs-60rem { font-size: 6.0rem }
.fs-61rem { font-size: 6.1rem }
.fs-62rem { font-size: 6.2rem }
.fs-63rem { font-size: 6.3rem }
.fs-64rem { font-size: 6.4rem }
.fs-65rem { font-size: 6.5rem }
.fs-66rem { font-size: 6.6rem }
.fs-67rem { font-size: 6.7rem }
.fs-68rem { font-size: 6.8rem }
.fs-69rem { font-size: 6.9rem }
.fs-70rem { font-size: 7.0rem }
.fs-71rem { font-size: 7.1rem }
.fs-72rem { font-size: 7.2rem }
.fs-73rem { font-size: 7.3rem }
.fs-74rem { font-size: 7.4rem }
.fs-75rem { font-size: 7.5rem }
.fs-76rem { font-size: 7.6rem }
.fs-77rem { font-size: 7.7rem }
.fs-78rem { font-size: 7.8rem }
.fs-79rem { font-size: 7.9rem }
.fs-80rem { font-size: 8.0rem }
.fs-81rem { font-size: 8.1rem }
.fs-82rem { font-size: 8.2rem }
.fs-83rem { font-size: 8.3rem }
.fs-84rem { font-size: 8.4rem }
.fs-85rem { font-size: 8.5rem }
.fs-86rem { font-size: 8.6rem }
.fs-87rem { font-size: 8.7rem }
.fs-88rem { font-size: 8.8rem }
.fs-89rem { font-size: 8.9rem }
.fs-90rem { font-size: 9.0rem }
.fs-91rem { font-size: 9.1rem }
.fs-92rem { font-size: 9.2rem }
.fs-93rem { font-size: 9.3rem }
.fs-94rem { font-size: 9.4rem }
.fs-95rem { font-size: 9.5rem }
.fs-96rem { font-size: 9.6rem }
.fs-97rem { font-size: 9.7rem }
.fs-98rem { font-size: 9.8rem }
.fs-99rem { font-size: 9.9rem }
.fs-100rem { font-size: 10.0rem }
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* CLASES DE FUENTES DE LETRAS ESPECIALES */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/**
TYPE: SANS SERIF ///////////////////////////////////////////////////////////////////////////////////////////////////////
.ff-maven-pro -> <link href="https://fonts.googleapis.com/css?family=Maven+Pro:400,500,700" rel="stylesheet">
.ff-lato -> <link href="https://fonts.googleapis.com/css?family=Lato:400,700" rel="stylesheet">
.ff-montserrat -> <link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet">
.ff-libre-franklin -> <link href="https://fonts.googleapis.com/css?family=Libre+Franklin:300,400,500,700" rel="stylesheet">
.ff-rubik -> <link href="https://fonts.googleapis.com/css?family=Rubik:300,400,500,700" rel="stylesheet">
.ff-muli -> <link href="https://fonts.googleapis.com/css?family=Muli:300,400" rel="stylesheet">
.ff-dosis -> <link href="https://fonts.googleapis.com/css?family=Dosis:300,400,600,700" rel="stylesheet">
.ff-poppins -> <link href="https://fonts.googleapis.com/css?family=Poppins:300,400,600" rel="stylesheet">
.ff-quicksand -> <link href="https://fonts.googleapis.com/css?family=Quicksand:300,400,700" rel="stylesheet">
.ff-raleway -> <link href="https://fonts.googleapis.com/css?family=Raleway:400,700" rel="stylesheet">
.ff-open -> <link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700" rel="stylesheet">
.ff-josefin -> <link href="https://fonts.googleapis.com/css?family=Josefin+Sans:400,700" rel="stylesheet">
*/
.ff-maven-pro { font-family: 'Maven Pro', sans-serif; }
.ff-lato { font-family: 'Lato', sans-serif; }
.ff-montserrat { font-family: 'Montserrat', sans-serif; }
.ff-libre-franklin { font-family: 'Libre Franklin', sans-serif; }
.ff-rubik { font-family: 'Rubik', sans-serif; }
.ff-muli { font-family: 'Muli', sans-serif; }
.ff-dosis { font-family: 'Dosis', sans-serif; }
.ff-poppins { font-family: 'Poppins', sans-serif; }
.ff-quicksand { font-family: 'Quicksand', sans-serif; }
.ff-raleway { font-family: 'Raleway', sans-serif; }
.ff-open { font-family: 'Open Sans Condensed', sans-serif; }
.ff-josefin { font-family: 'Josefin Sans', sans-serif; }
.ff-perpetua { font-family: 'Perpetua', sans-serif; }
.ff-myriadpro { font-family: 'MyriadPro', sans-serif; }
.ff-calibri { font-family: 'Calibri', sans-serif; }
/*
-- definir css para titulo
*/
.ff-deta-ttlo , .ff-deta-ttlo * { font-family: 'Perpetua', sans-serif !important; color: #666666; margin-top: 30px; }
.ff-deta-antettlo, .ff-deta-antettlo * { font-family: 'Perpetua', sans-serif !important; color: #999999 !important; font-size: 2.5rem !important; line-height: 2.7rem !important; padding-left: 0 !important; padding-top: 10px !important; padding-bottom: 10px !important; }
.ff-deta-subttlo , .ff-deta-subttlo * { font-family: 'MyriadPro', sans-serif !important; color: #FA7C00 !important; font-size: 2.2rem !important; line-height: 2.5rem !important; padding-left: 0 !important; padding-top: 10px !important; padding-bottom: 10px !important; }
.ff-deta-conte , .ff-deta-conte * { font-family: 'Calibri', sans-serif !important; color: #444444 !important; font-size: 1.7rem !important; line-height: 2.0rem !important; padding-left: 0 !important; }
/*
.ff-deta-conte , .ff-deta-conte * { font-family: 'Calibri', sans-serif !important; color: #444444 !important; font-size: 1.7rem !important; line-height: 2.0rem !important; padding-left: 0 !important; }
*/
/**
TYPE: HANDWRITING ///////////////////////////////////////////////////////////////////////////////////////////////////////
.ff-shadows -> <link href="https://fonts.googleapis.com/css?family=Shadows+Into+Light+Two" rel="stylesheet">
.ff-nothing -> <link href="https://fonts.googleapis.com/css?family=Nothing+You+Could+Do" rel="stylesheet">
.ff-schoolbell -> <link href="https://fonts.googleapis.com/css?family=Schoolbell" rel="stylesheet">
.ff-waiting -> <link href="https://fonts.googleapis.com/css?family=Waiting+for+the+Sunrise" rel="stylesheet">
.ff-merienda -> <link href="https://fonts.googleapis.com/css?family=Merienda:400,700" rel="stylesheet">
.ff-annie -> <link href="https://fonts.googleapis.com/css?family=Annie+Use+Your+Telescope" rel="stylesheet">
.ff-short-stack -> <link href="https://fonts.googleapis.com/css?family=Short+Stack" rel="stylesheet">
.ff-kristi -> <link href="https://fonts.googleapis.com/css?family=Kristi" rel="stylesheet">
.ff-over-rainbow -> <link href="https://fonts.googleapis.com/css?family=Over+the+Rainbow" rel="stylesheet">
.ff-poiret -> <link href="https://fonts.googleapis.com/css?family=Poiret+One&subset=latin-ext" rel="stylesheet">
.ff-badscript -> <link href="https://fonts.googleapis.com/css?family=Bad+Script&subset=latin-ext" rel="stylesheet">
.ff-parisienne -> <link href="https://fonts.googleapis.com/css?family=Parisienne" rel="stylesheet">
.ff-comfortaa -> <link href="https://fonts.googleapis.com/css?family=Comfortaa:300,400,700&subset=latin-ext" rel="stylesheet">
.ff-farsan -> <link href="https://fonts.googleapis.com/css?family=Farsan&subset=latin-ext" rel="stylesheet">
.ff-special-elite -> <link href="https://fonts.googleapis.com/css?family=Special+Elite&subset=latin-ext" rel="stylesheet">
.ff-raleway-dots -> <link href="https://fonts.googleapis.com/css?family=Raleway+Dots" rel="stylesheet">
*/
.ff-shadows { font-family: 'Shadows Into Light Two', cursive; }
.ff-nothing { font-family: 'Nothing You Could Do', cursive; }
.ff-schoolbell { font-family: 'Schoolbell', cursive; }
.ff-waiting { font-family: 'Waiting for the Sunrise', cursive; }
.ff-merienda { font-family: 'Merienda', cursive; }
.ff-annie { font-family: 'Annie Use Your Telescope', cursive; }
.ff-short-stack { font-family: 'Short Stack', cursive; }
.ff-kristi { font-family: 'Kristi', cursive; }
.ff-over-rainbow { font-family: 'Over the Rainbow', cursive; }
.ff-poiret { font-family: 'Poiret One', cursive; }
.ff-badscript { font-family: 'Bad Script', cursive; }
.ff-parisienne { font-family: 'Parisienne', cursive; }
.ff-comfortaa { font-family: 'Comfortaa', cursive; }
.ff-farsan { font-family: 'Farsan', cursive; }
.ff-special-elite { font-family: 'Special Elite', cursive; }
.ff-raleway-dots { font-family: 'Raleway Dots', cursive; }
/**
TYPE: SERIF ///////////////////////////////////////////////////////////////////////////////////////////////////////
.ff-droid -> <link href="https://fonts.googleapis.com/css?family=Droid+Serif:400,700" rel="stylesheet">
.ff-roboto -> <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,700" rel="stylesheet">
.ff-roboto-slab -> <link href="https://fonts.googleapis.com/css?family=Roboto+Slab:300,400,700" rel="stylesheet">
*/
.ff-droid { font-family: 'Droid Serif', serif; }
.ff-roboto { font-family: 'Roboto' , serif; }
.ff-roboto-slab { font-family: 'Roboto Slab', serif; }
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* FONT - GENERALES */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/**
TYPE: SERIF /////////////////////////////////////////////////////////////////////////////////
*/
.ff-georgia { font-family: Georgia, serif; }
.ff-palatino { font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; }
.ff-times-new-roman { font-family: "Times New Roman", Times, serif; }
/**
TYPE: SANS SERIF ////////////////////////////////////////////////////////////////////////////
*/
.ff-arial { font-family: Arial, Helvetica, sans-serif !important; }
.ff-arial-black { font-family: "Arial Black", Gadget, sans-serif; }
.ff-comic-sans-ms { font-family: "Comic Sans MS", cursive, sans-serif; }
.ff-impact { font-family: Impact, Charcoal, sans-serif; }
.ff-lucida-sans { font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; }
.ff-tahoma { font-family: Tahoma, Geneva, sans-serif; }
.ff-trebuchet-ms { font-family: "Trebuchet MS", Helvetica, sans-serif; }
.ff-verdana { font-family: Verdana, Geneva, sans-serif; }
.ff-copperplate { font-family: Copperplate / Copperplate Gothic Light, sans-serif; }
.ff-gill-sans { font-family: Gill Sans / Gill Sans MT, sans-serif; }
.ff-andale-mono { font-family: 'Andale Mono', sans-serif; }
.ff-century-gothic { font-family: 'Century Gothic', sans-serif; }
.ff-arial-narrow { font-family: 'Arial Narrow', sans-serif; }
/**
TYPE: MONOSPACE /////////////////////////////////////////////////////////////////////////////
*/
.ff-courier-new { font-family: "Courier New", Courier, monospace; }
.ff-lucida-console { font-family: "Lucida Console", Monaco, monospace; }
.fw-bold { font-weight: bold; }
.fw-normal { font-weight: normal; }
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
.op-separador-1 {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#4c4c4c+0,595959+12,666666+25,474747+39,2c2c2c+50,000000+51,111111+60,2b2b2b+76,1c1c1c+91,131313+100;Black+Gloss+%231 */
border-top : 5px solid rgb(76,76,76); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
border-top : 5px solid url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRjNGM0YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEyJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjI1JSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjM5JSIgc3RvcC1jb2xvcj0iIzQ3NDc0NyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzJjMmMyYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjYwJSIgc3RvcC1jb2xvcj0iIzExMTExMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijc2JSIgc3RvcC1jb2xvcj0iIzJiMmIyYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjkxJSIgc3RvcC1jb2xvcj0iIzFjMWMxYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxMzEzMTMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
border-top : 5px solid -moz-linear-gradient(top, rgba(76,76,76,1) 0%, rgba(89,89,89,1) 12%, rgba(102,102,102,1) 25%, rgba(71,71,71,1) 39%, rgba(44,44,44,1) 50%, rgba(0,0,0,1) 51%, rgba(17,17,17,1) 60%, rgba(43,43,43,1) 76%, rgba(28,28,28,1) 91%, rgba(19,19,19,1) 100%); /* FF3.6-15 */
border-top : 5px solid -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(76,76,76,1)), color-stop(12%,rgba(89,89,89,1)), color-stop(25%,rgba(102,102,102,1)), color-stop(39%,rgba(71,71,71,1)), color-stop(50%,rgba(44,44,44,1)), color-stop(51%,rgba(0,0,0,1)), color-stop(60%,rgba(17,17,17,1)), color-stop(76%,rgba(43,43,43,1)), color-stop(91%,rgba(28,28,28,1)), color-stop(100%,rgba(19,19,19,1))); /* Chrome4-9,Safari4-5 */
border-top : 5px solid -webkit-linear-gradient(top, rgba(76,76,76,1) 0%,rgba(89,89,89,1) 12%,rgba(102,102,102,1) 25%,rgba(71,71,71,1) 39%,rgba(44,44,44,1) 50%,rgba(0,0,0,1) 51%,rgba(17,17,17,1) 60%,rgba(43,43,43,1) 76%,rgba(28,28,28,1) 91%,rgba(19,19,19,1) 100%); /* Chrome10-25,Safari5.1-6 */
border-top : 5px solid -o-linear-gradient(top, rgba(76,76,76,1) 0%,rgba(89,89,89,1) 12%,rgba(102,102,102,1) 25%,rgba(71,71,71,1) 39%,rgba(44,44,44,1) 50%,rgba(0,0,0,1) 51%,rgba(17,17,17,1) 60%,rgba(43,43,43,1) 76%,rgba(28,28,28,1) 91%,rgba(19,19,19,1) 100%); /* Opera 11.10-11.50 */
border-top : 5px solid -ms-linear-gradient(top, rgba(76,76,76,1) 0%,rgba(89,89,89,1) 12%,rgba(102,102,102,1) 25%,rgba(71,71,71,1) 39%,rgba(44,44,44,1) 50%,rgba(0,0,0,1) 51%,rgba(17,17,17,1) 60%,rgba(43,43,43,1) 76%,rgba(28,28,28,1) 91%,rgba(19,19,19,1) 100%); /* IE10 preview */
border-top : 5px solid linear-gradient(to bottom, rgba(76,76,76,1) 0%,rgba(89,89,89,1) 12%,rgba(102,102,102,1) 25%,rgba(71,71,71,1) 39%,rgba(44,44,44,1) 50%,rgba(0,0,0,1) 51%,rgba(17,17,17,1) 60%,rgba(43,43,43,1) 76%,rgba(28,28,28,1) 91%,rgba(19,19,19,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
border-top : 5px solid progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=0 ); /* IE6-8 */
}
.op-separador-2 {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#8fc800+0,8fc800+100;Green+Flat+%232 */
border-top : 5px solid #8fc800; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
border-top : 5px solid url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzhmYzgwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM4ZmM4MDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
border-top : 5px solid -moz-linear-gradient(top, #8fc800 0%, #8fc800 100%); /* FF3.6-15 */
border-top : 5px solid -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8fc800), color-stop(100%,#8fc800)); /* Chrome4-9,Safari4-5 */
border-top : 5px solid -webkit-linear-gradient(top, #8fc800 0%,#8fc800 100%); /* Chrome10-25,Safari5.1-6 */
border-top : 5px solid -o-linear-gradient(top, #8fc800 0%,#8fc800 100%); /* Opera 11.10-11.50 */
border-top : 5px solid -ms-linear-gradient(top, #8fc800 0%,#8fc800 100%); /* IE10 preview */
border-top : 5px solid linear-gradient(to bottom, #8fc800 0%,#8fc800 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
border-top : 5px solid progid:DXImageTransform.Microsoft.gradient( startColorstr='#8fc800', endColorstr='#8fc800',GradientType=0 ); /* IE6-8 */
}
.op-footer-1 {
padding-top : 20px;
padding-bottom : 20px;
font : 1.4rem/1.8rem Arial, sans-serif;
background-color: #292929;
color : #F0F0F0;
min-height : 70px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffd65e+0,febf04+100;Yellow+3D+%232 */
border-top : 15px solid #ffd65e; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
border-top : 15px solid url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZDY1ZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZWJmMDQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
border-top : 15px solid -moz-linear-gradient(top, #ffd65e 0%, #febf04 100%); /* FF3.6-15 */
border-top : 15px solid -webkit-linear-gradient(top, #ffd65e 0%,#febf04 100%); /* Chrome10-25,Safari5.1-6 */
border-top : 15px solid linear-gradient(to bottom, #ffd65e 0%,#febf04 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
border-top : 15px solid progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffd65e', endColorstr='#febf04',GradientType=0 ); /* IE6-8 */
}
.op-footer-2 {
padding-top : 30px;
padding-bottom : 20px;
font : 1rem/3rem verdana, sans-serif;
background-color: #2C2C2C !important;
color : #BBBBBB;
min-height : 20px;
border-top : 1px solid #444;
}
footer a {
color : #888;
padding-top : 10px;
padding-right : 0px;
padding-bottom : 5px;
padding-left : 0px;
margin-bottom : 0px;
font : 1.5rem/1.7rem Arial, sans-serif;
text-decoration: none !important;
}
footer a:hover {
color : #AAA;
border-bottom : 1px dashed #AAA;
}
footer h4 {
color : #888;
padding : 10px 0;
/*
background-color: #2f2f2f;
*/
/*
font : 1.4rem/1.8rem Arial, sans-serif;
*/
}
footer h4:before {
font-family: 'Glyphicons Halflings';
font-style: normal;
font-weight: normal;
font-size: 8px;
line-height: 1;
content: "\e074";
color: #ffd65e;
position: relative;
margin-right: -9px;
left: -20px;
}
footer address {
outline: 0px solid #f50;
width: 300px;
font-size: 1.4rem;
line-height: 18px;
color: #EEE;
}
footer address span {
line-height: 3rem;
color: #DDD;
}
footer address abbr {
line-height: 3rem;
color: #AAA;
}
/* /////// OBJETOS DE COLUMNAS /////// */
/* -- CONTENEDOR ANCHO 100% -- */
.og-wrpp {
width : 100%;
max-width : 100%;
min-width : 100%;
margin : 4rem auto;
position : relative;
overflow : hidden;
}
/* -- PROPIEDAD QUE MODIFICA CONTENEDOR CON ANCHO FIJO -- */
.og-wrpp.op-maxw-100 { max-width : 100%; min-width : 220px; }
.og-wrpp.op-maxw-1200 { max-width : 1200px; min-width : 220px; }
.og-wrpp.op-maxw-1000 { max-width : 1000px; min-width : 220px; }
/* Divide the text in a <div> element into 'N' oc-cols-d1: */
.op-cols-1 { column-count : 1 !important; -moz-column-count : 1 !important; -webkit-column-count : 1 !important; }
.op-cols-2 { column-count : 2 !important; -moz-column-count : 2 !important; -webkit-column-count : 2 !important; }
.op-cols-3 { column-count : 3 !important; -moz-column-count : 3 !important; -webkit-column-count : 3 !important; }
.op-cols-4 { column-count : 4 !important; -moz-column-count : 4 !important; -webkit-column-count : 4 !important; }
.op-cols-5 { column-count : 5 !important; -moz-column-count : 5 !important; -webkit-column-count : 5 !important; }
.op-cols-6 { column-count : 6 !important; -moz-column-count : 6 !important; -webkit-column-count : 6 !important; }
.op-cols-7 { column-count : 7 !important; -moz-column-count : 7 !important; -webkit-column-count : 7 !important; }
/* -- OBJETO DE CONTENIDO COLUMNAS -- */
.og-cols-d1 {
/* Divide the text in a <div> element into 7 */
/*
column-count : 3;
-moz-column-count : 3;
-webkit-column-count : 3;
*/
/* Specify a 15 pixels gap between the oc-cols-d1 */
column-gap : 15px;
-moz-column-gap : 15px; /* Firefox */
-webkit-column-gap : 15px; /* Chrome, Safari, Opera */
/* Specify the width, style and color of the rule between oc-cols-d1. */
column-rule : 0px outset #EEE;
-moz-column-rule : 0px outset #EEE; /* Firefox */
-webkit-column-rule : 0px outset #EEE; /* Chrome, Safari, Opera */
/* Specify how to fill oc-cols-d1: */
column-fill : balance;
-moz-column-fill : balance;
padding : 0 0.7rem;
}
/* MODELO PINTEREST */
.oc-thumb-d1 {
width : 100%;
max-width : 100%;
min-width : 100%;
display : inline-block;
margin-bottom : 15px;
padding : 0px 0px 15px 0px;
border : 0px solid #FAFAFA;
background : #FEFEFE;
box-shadow : 0 1px 2px rgba(34, 25, 25, 0.4);
background : -webkit-linear-gradient(45deg, #FFF, #F9F9F9);
box-sizing : border-box;
opacity : 1;
border-radius : 2px 2px 2px 2px; /* -- W3C Specification -- */
-moz-border-radius : 2px 2px 2px 2px; /* -- Mozilla -- */
-webkit-border-radius : 2px 2px 2px 2px; /* -- WebKit y Safari -- */
column-break-inside : avoid;
-moz-column-break-inside : avoid;
-webkit-column-break-inside : avoid;
break-inside : avoid; /* IE 10+ */
page-break-inside : avoid; /* Firefox */
-webkit-page-break-inside : avoid; /* Chrome, Safari, Opera */
-webkit-transition : all .2s ease;
-moz-transition : all .2s ease;
-o-transition : all .2s ease;
transition : all .2s ease;
}
/*
100% - ( 16px + 16px )/(236px + 8px)
*/
.oc-thumb-d1 img {
width : auto;
max-width : 100%;
min-width : 100%;
height : auto;
max-width : 100%;
border-bottom : 0px solid #ccc;
margin : 0px;
padding : 0px;
margin-bottom : 0px;
padding-bottom : 5px;
-webkit-border-radius : 2px 2px 0px 0px; /* -- WebKit y Safari -- */
-moz-border-radius : 2px 2px 0px 0px; /* -- Mozilla -- */
border-radius : 2px 2px 0px 0px; /* -- W3C Specification -- */
}
/* MODELO DE ALTO FIJO (Todas las box tienen el mismo tamaño) */
.oc-thumb-d2 {
/* outline: 1px solid #f50; */
width : 100%;
max-width : 100%;
min-width : 100%;
/*
max-width : 22.5em;
min-width : 15.5em;
*/
height : auto;
display : inline-block;
margin-bottom : 15px;
padding : 0px 0px 15px 0px;
border : 0px solid #FAFAFA;
/* box-shadow : 0 0.5px 1px rgba(34, 25, 25, 0.4); */
background : #FEFEFE;
background : -webkit-linear-gradient(45deg, #FFF, #F9F9F9);
/*
overflow : hidden;
*/
box-sizing : border-box;
opacity : 1;
border-radius : 2px 2px 2px 2px; /* -- W3C Specification -- */
-moz-border-radius : 2px 2px 2px 2px; /* -- Mozilla -- */
-webkit-border-radius : 2px 2px 2px 2px; /* -- WebKit y Safari -- */
column-break-inside : avoid;
-moz-column-break-inside : avoid;
-webkit-column-break-inside : avoid;
break-inside : avoid; /* IE 10+ */
page-break-inside : avoid; /* Firefox */
-webkit-page-break-inside : avoid; /* Chrome, Safari, Opera */
-webkit-transition : all .2s ease;
-moz-transition : all .2s ease;
-o-transition : all .2s ease;
transition : all .2s ease;
z-index : 2;
}
.oc-thumb-d2 a { text-decoration: none; }
.oc-thumb-d2 .op-imge { margin : 0; padding : 0; width : 100%; min-height : 13em; max-height : 100%; height : auto; overflow: hidden; }
.oc-thumb-d2 .op-imge img {
display: inline-block;
margin : 0px 0 0 0px;
padding : 0rem 0 0 0rem;
width : auto;
min-width : 100%;
height : 27rem;
border-bottom : 0px solid #ccc;
-webkit-border-radius : 2px 2px 0px 0px; /* -- WebKit y Safari -- */
-moz-border-radius : 2px 2px 0px 0px; /* -- Mozilla -- */
border-radius : 2px 2px 0px 0px; /* -- W3C Specification -- */
}
.oc-thumb-d2 img,
.oc-thumb-d2 picture {
margin : 0px 0 0 0px;
padding : 0rem 0 0 0rem;
width : auto;
min-width : 100%;
height : 26rem;
border-bottom : 0px solid #ccc;
-webkit-border-radius : 2px 2px 0px 0px; /* -- WebKit y Safari -- */
-moz-border-radius : 2px 2px 0px 0px; /* -- Mozilla -- */
border-radius : 2px 2px 0px 0px; /* -- W3C Specification -- */
}
.oc-thumb-d1 p.op-attl,
.oc-thumb-d2 p.op-attl { min-height : 1rem; height : 1.5rem; font : 1.2rem/1.3rem Arial, sans-serif; color : #ff6600; margin : 0; padding : 4px 2rem; }
.oc-thumb-d1 p.op-ttlo,
.oc-thumb-d2 p.op-ttlo { min-height : 1rem; height : 1.5rem; font : 1.5rem/1.9rem Arial, sans-serif; font-weight: bold; color : #111; margin : 0; padding : 6px 2rem; }
.oc-thumb-d1 p.op-ttlo span,
.oc-thumb-d2 p.op-ttlo span { min-height : 1rem; height : 1.5rem; font : 1.5rem/1.9rem Arial, sans-serif; font-weight: bold; color : #777; margin : 0; }
.oc-thumb-d1 p.op-sttl,
.oc-thumb-d2 p.op-sttl { min-height : 1rem; height : 1.5rem; font : 1.5rem/1.9rem Arial, sans-serif; color : #ff6600; margin : 0; padding : 2px 2rem; }
.oc-thumb-d1 p.op-desc,
.oc-thumb-d2 p.op-desc { height : 15rem; font : 1.4rem/1.9rem Arial, sans-serif; color : #333; margin : 0; padding : 2rem; }
.oc-thumb-d2 p.op-mass { height : 2rem; font : 1.4rem/1.9rem Arial, sans-serif; color : #888; margin : 0; padding : 2rem; text-align: center; outline: 0px solid #f50;}
/* TTLO-CAROUSEL */
.op-ttlo-caru-l h1 { font : 3rem/4rem Arial, sans-serif; color : #444; margin : 0; padding : 2rem 0rem 0rem 0rem; width: 100%; left: -20px; position: relative; }
.og-cols-d1:hover .oc-thumb-d1:not(:hover) { opacity: 0.8; }
.og-cols-d1:hover .oc-thumb-d2:not(:hover) { opacity: 0.8; }
/* HR */
hr.og-hr-d1 { border-top: 1px solid #8c8b8b; }
hr.og-hr-d2 { border-top: 3px double #8c8b8b; }
hr.og-hr-d3 { border-top: 1px dashed #8c8b8b; }
hr.og-hr-d4 { border-top: 1px dotted #8c8b8b; }
hr.og-hr-d5 { background-color: #fff; border-top: 2px dashed #8c8b8b; }
hr.og-hr-d6 { background-color: #fff; border-top: 2px dotted #8c8b8b; }
hr.og-hr-d7 { border-top: 1px solid #8c8b8b; border-bottom: 1px solid #fff; }
hr.og-hr-d8 { border-top: 1px solid #8c8b8b; border-bottom: 1px solid #fff; }
hr.og-hr-d8:after { content: ''; display: block; margin-top: 2px; border-top: 1px solid #8c8b8b; border-bottom: 1px solid #fff; }
hr.og-hr-d9 { border-top: 1px dashed #8c8b8b; border-bottom: 1px dashed #fff; }
hr.og-hr-d10 { border-top: 1px dotted #8c8b8b; border-bottom: 1px dotted #fff; }
hr.og-hr-d11 { height: 6px; background: url(http://ibrahimjabbari.com/english/images/hr-11.png) repeat-x 0 0; border: 0; }
hr.og-hr-d12 { height: 6px; background: url(http://ibrahimjabbari.com/english/images/hr-12.png) repeat-x 0 0; border: 0; }
hr.og-hr-d13 { height: 10px; border: 0; box-shadow: 0 10px 10px -10px #8c8b8b inset; }
hr.og-hr-d14 { border: 0; height: 1px; background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0); }
hr.og-hr-d15 { border-top: 4px double #8c8b8b; text-align: center; }
hr.og-hr-d15:after { content: '\002665'; display: inline-block; position: relative; top: -15px; padding: 0 10px; background: #f0f0f0; color: #8c8b8b; font-size: 18px; }
hr.og-hr-d16 { border-top: 1px dashed #8c8b8b; height: 5px;}
hr.og-hr-d16:after { content: '\002702'; display: inline-block; position: relative; top: -12px; left: 40px; padding: 0 3px; background: tranparent; color: #8c8b8b; font-size: 18px; }
hr.og-hr-d17 { border-top: 1px solid #8c8b8b; text-align: center; }
hr.og-hr-d17:after { content: '§'; display: inline-block; position: relative; top: -14px; padding: 0 10px; background: #f0f0f0; color: #8c8b8b; font-size: 18px; -webkit-transform: rotate(60deg); -moz-transform: rotate(60deg); transform: rotate(60deg); }
hr.og-hr-d18 { height: 30px; border-style: solid; border-color: #8c8b8b; border-width: 1px 0 0 0; border-radius: 20px; }
hr.og-hr-d18:before { display: block; content: ""; height: 30px; margin-top: -31px; border-style: solid; border-color: #8c8b8b; border-width: 0 0 1px 0; border-radius: 20px; }
/* Inset, by Dan Eden */
hr.og-hr-d19 { border: 0; height: 0; border-top: 1px solid rgba(0, 0, 0, 0.15); border-bottom: 1px solid rgba(255, 255, 255, 0.3); }
/* Gradient color1 -color2 - color1 */
hr.og-hr-d20 { border: 0; height: 1px; background: #333; background-image: linear-gradient(to right, #ccc, #333, #ccc); }
.og-hr-d24 { border: 0; border-bottom: 2px solid rgba(235,235,235,1); background: transparent; margin: 0 0.6rem; z-index: 100000; }
.og-hr-d24:after
{
content : '';
position : relative;
top : 0rem;
left : -3rem;
float : left;
width : 4rem;
height : 2px;
border-top : 2px dashed rgba(235, 235, 235, 1);
background-color : rgba(235, 235, 235, 1) !important;
z-index : 100 !important;
}
.og-hr-d24:before
{
content : '' !important;
position : relative;
top : 0rem;
right : -3rem;
float : right;
width : 4rem;
height : 2px;
border-top : 2px dashed rgba(235, 235, 235, 1);
background-color : rgba(235, 235, 235, 1) !important;
z-index : 100 !important;
}
/* Gradient transparent - color - transparent */
hr.og-hr-d21 { border: 0; height: 1px; background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0)); }
/* Double-color dashed line */
hr.og-hr-d22 { border: 0; border-bottom: 1px dashed #ccc; background: transparent; }
.og-hr-d23 { border: 0; border-bottom: 1px dashed rgba(235,235,235,1); background: transparent; margin: 0 0.6rem; z-index: 100000; }
.og-hr-d23:after
{
content : '';
position : relative;
top : -0.5rem;
left : -1rem;
float : left;
width : 1rem;
height : 1rem;
border : 0px solid rgba(235, 235, 235, 1);
background-color : rgba(235, 235, 235, 1) !important;
-moz-border-radius : 50%;
-webkit-border-radius : 50%;
border-radius : 50%;
z-index : 100000 !important;
}
.og-hr-d23:before
{
content : '' !important;
position : relative;
top : -0.5rem;
right : -1rem;
float : right;
width : 1rem;
height : 1rem;
border : 0px solid rgba(245, 245, 245, 0.1);
background-color : rgba(235, 235, 235, 1) !important;
-moz-border-radius : 50%;
-webkit-border-radius : 50%;
border-radius : 50%;
z-index : 1000 !important;
}
.op-circle
{
background-color: #f50;
width: 1rem;
height: 1rem;
position: relative;
z-index: 2;
top: 1rem;
border-radius: 50%;
}
.op-circle.op-left
{
left: -.5rem;
}
.op-circle.op-right
{
right: -.5rem;
}
.op-icon-ecom-1 { height: 25px; width: auto; background: url(../imgs/carro_compras_negro.png) no-repeat 0 0; border: 0 !important; }
/* RESPONSIVE
========================================================================= */
/* RECETEA REVISAR !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
<style type="text/css">
@media only screen and (max-device-width: 480px) {
table[class=contenttable] {
width:320px !important;
}
}
</style>
<table width="640" border="0" cellpadding="0" cellspacing="0" class="contenttable">
*/
/* Smartphones (portrait) ----------- */
/*
@media only screen
and (max-width : 1380px) {
.op-maxw-100 .oc-cols-d1
{
-webkit-column-count : 6 !important;
-moz-column-count : 6 !important;
column-count : 6 !important;
padding : 0 0.7em;
}
}
*/
/*
@media only screen
and (max-width : 1024px) {
.op-maxw-100 .oc-cols-d1
{
-webkit-column-count : 5 !important;
-moz-column-count : 5 !important;
column-count : 5 !important;
padding : 0 0.7em;
}
}
*/
/*
@media only screen
and (max-width : 850px) {
.op-maxw-100 .oc-cols-d1
{
-webkit-column-count : 4 !important;
-moz-column-count : 4 !important;
column-count : 4 !important;
padding : 0 0.55em;
}
}
*/
/*
@media only screen
and (max-width : 700px) {
.op-maxw-100 .oc-cols-d1
{
-webkit-column-count : 4 !important;
-moz-column-count : 4 !important;
column-count : 4 !important;
padding : 0 0.4em;
}
}
*/
/*
@media only screen
and (max-width : 520px) {
.op-maxw-100 .oc-cols-d1
{
-webkit-column-count : 3 !important;
-moz-column-count : 3 !important;
column-count : 3 !important;
column-gap : 10px;
-moz-column-gap : 10px;
-webkit-column-gap : 10px;
padding : 0 0.1em;
}
}
*/
/*
@media only screen
and (max-width : 375px) {
.op-maxw-100 .oc-cols-d1
{
-webkit-column-count : 2 !important;
-moz-column-count : 2 !important;
column-count : 2 !important;
column-gap : 10px;
-moz-column-gap : 10px;
-webkit-column-gap : 10px;
padding : 0 0.1em;
}
}
*/
/*
@media only screen
and (max-width : 250px) {
.op-maxw-100 .oc-cols-d1
{
-webkit-column-count : 1 !important;
-moz-column-count : 1 !important;
column-count : 1 !important;
column-gap : 0px;
-moz-column-gap : 0px;
-webkit-column-gap : 0px;
padding : 0 0.1em;
}
.og-wrpp {
margin : 0 auto;
}
}
*/
/* ///////////////////////////////////////////////////////////////////////// */
/*
@media only screen
and (min-width : 961px) {
.op-maxw-1200 .oc-cols-d1,
.op-maxw-1000 .oc-cols-d1
{
-webkit-column-count : 3 !important;
-moz-column-count : 3 !important;
column-count : 3 !important;
padding : 0 0.7em;
}
}
@media only screen
and (max-width : 960px) {
.op-maxw-1200 .oc-cols-d1,
.op-maxw-1000 .oc-cols-d1
{
-webkit-column-count : 2 !important;
-moz-column-count : 2 !important;
column-count : 2 !important;
padding : 0 0.7em;
}
.og-wrpp.op-maxw-1200,
.og-wrpp.op-maxw-1000
{
width : calc((320px*2) + (15px*2));
}
.op-maxw-1200 .oc-thumb-d2,
.op-maxw-1000 .oc-thumb-d2
{
width : 100% !important;
max-width : 360px !important;
min-width : 320px !important;
}
.op-maxw-1200 .oc-thumb-d2 img,
.op-maxw-1000 .oc-thumb-d2 img,
.op-maxw-1200 .oc-thumb-d2 picture,
.op-maxw-1000 .oc-thumb-d2 picture
{
height : 24rem;
}
}
@media only screen
and (max-width : 640px) {
.op-maxw-1200 .oc-cols-d1,
.op-maxw-1000 .oc-cols-d1
{
-webkit-column-count : 1 !important;
-moz-column-count : 1 !important;
column-count : 1 !important;
padding : 0 0em;
column-gap : 0px;
-moz-column-gap : 0px;
-webkit-column-gap : 0px;
}
.og-wrpp.op-maxw-1200,
.og-wrpp.op-maxw-1000
{
width : calc((300px + 10px));
margin-top : 5px;
}
.op-maxw-1200 .oc-thumb-d2,
.op-maxw-1000 .oc-thumb-d2
{
width : calc(100% - 25px) !important;
max-width : 360px !important;
min-width : 300px !important;
margin-left : 5px;
margin-right : 5px;
}
.op-maxw-1200 .oc-thumb-d2 img,
.op-maxw-1000 .oc-thumb-d2 img,
.op-maxw-1200 .oc-thumb-d2 picture,
.op-maxw-1000 .oc-thumb-d2 picture
{
height : 24rem;
}
.op-ttlo-caru-l h1 { font : 2rem/3rem Arial, sans-serif; color : #444; margin : 0; padding : 2rem 0rem 0rem 0rem; width: 100%; left: 0px; position: relative; text-align: -webkit-center; text-align: -moz-center ; text-align: center;}
}
*/
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* BOOTSTRAP - TEMA NAVBAR */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
.navbar-brand {
float : left;
height : 50px;
padding : 25px 15px;
/*
font-size : 18px;
*/
line-height : 20px;
border-bottom : 0px solid #F50;
}
.navbar-brand:hover,
.navbar-brand:focus {
text-decoration : none;
}
.navbar-brand > img {
display: block;
}
.navbar > .container .navbar-brand,
.navbar > .container-fluid .navbar-brand {
margin-left: 0px;
margin-right: 0px;
padding-left: 0px;
padding-right: 0px;
}
.navbar-toggle {
position: relative;
float: right;
padding: 9px 10px;
margin-top: 8px;
margin-right: 15px;
margin-bottom: 8px;
background-color: transparent;
background-image: none;
border: 1px solid transparent;
border-radius: 4px;
}
.navbar-toggle:focus {
outline: 0;
}
.navbar-toggle .icon-bar {
display: block;
width: 22px;
height: 2px;
border-radius: 1px;
}
.navbar-toggle .icon-bar + .icon-bar {
margin-top: 4px;
}
.navbar-default {
background-color: #FFF;
border-bottom: 1px solid transparent;
font-size: 1.4rem;
font-family: verdana;
width: 100%;
white-space: nowrap;
max-height: 50px;
overflow: visible;
}
.navbar-default .navbar-brand {
color: #777;
margin: 0; /* ++ De-Facto S.A.*/
padding: 0; /* ++ De-Facto S.A.*/
/* padding-right: 4.5rem; */
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
color: #5e5e5e;
background-color: transparent;
}
.navbar-default .navbar-text {
color: #777;
}
.navbar-default .navbar-nav {
color: #777;
background-color: rgba(255,255,255,1);
}
.navbar-default .navbar-nav > li > a {
color: #777;
padding-left: 1.2rem;
padding-right: 1.2rem;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
color: #fff;
background-color: #E35623;
}
.navbar-color-2 .navbar-default .navbar-nav > li > a:hover,
.navbar-color-2 .navbar-default .navbar-nav > li > a:focus {
color: #fff;
background-color: #777;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
color: #fff;
background-color: #E35623;
}
.navbar-default .navbar-nav > .disabled > a,
.navbar-default .navbar-nav > .disabled > a:hover,
.navbar-default .navbar-nav > .disabled > a:focus {
color: #ccc;
background-color: transparent;
}
.navbar-default .navbar-toggle {
border-color: #ddd;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
background-color: #ddd;
}
.navbar-default .navbar-toggle .icon-bar {
background-color: #888;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
border-color: #e7e7e7;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
color: #FFF;
background-color: #E35623;
}
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
color: #FFF;
background-color: #FF7F00;
}
.navbar-nav .open .dropdown-menu > li > a,
.navbar-nav .open .dropdown-menu .dropdown-header {
padding: 10px 25px 10px 25px;
}
.navbar-nav .open .dropdown-menu > li > a {
line-height: 20px;
}
@media (max-width: 991px) {
.navbar-nav .open .dropdown-menu > li > a,
.navbar-nav .open .dropdown-menu .dropdown-header {
padding: 10px 25px 10px 25px;
}
.navbar-nav .open .dropdown-menu > li > a {
line-height: 25px;
}
.navbar-default .navbar-nav .open .dropdown-menu > li > a {
color: #777;
}
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
color: #FFF;
background-color: #555;
}
.navbar-default .navbar-nav .open .dropdown-menu > .active > a,
.navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
color: #FFF;
background-color: #888;
}
.navbar-default .navbar-nav .open .dropdown-menu > .disabled > a,
.navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
color: #ccc;
background-color: transparent;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
color: #FFF;
background: #E35623;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
color: #fff;
background: transprent;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
color: #fff;
background-color: #E35623;
}
}
@media (min-width: 991px) {
.navbar-left {
float: left !important;
}
.navbar-right {
float: right !important;
margin-right: -15px;
}
.navbar-right ~ .navbar-right {
margin-right: 0;
}
}
@media (max-width: 768px) {
.navbar-default {
background-color: #FFF;
border-bottom: 1px solid #DDD;
font-size: 1.4rem;
font-family: verdana;
max-height: 100%;
overflow: visible;
}
/*
.navbar-collapse {
overflow: auto !important;
max-height: 300px !important;
outline: 1px solid #000;
}
*/
/*
.navbar-collapse.collapse {
overflow: auto !important;
outline: 1px solid #f50;
}
*/
}
.navbar-default .navbar-link {
color: #777;
}
.navbar-default .navbar-link:hover {
color: #333;
}
.navbar-default .btn-link {
color: #777;
}
.navbar-default .btn-link:hover,
.navbar-default .btn-link:focus {
color: #333;
}
.navbar-default .btn-link[disabled]:hover,
fieldset[disabled] .navbar-default .btn-link:hover,
.navbar-default .btn-link[disabled]:focus,
fieldset[disabled] .navbar-default .btn-link:focus {
color: #ccc;
}
@media (min-width: 990px) { .navbar { border-radius: 0px; } }
@media (min-width: 990px) { .navbar-header { float: left; } }
.navbar-nav .open .dropdown-menu {
-webkit-animation: fadein 0.5s; /* Safari and Chrome */
-moz-animation: fadein 0.5s; /* Firefox */
-ms-animation: fadein 0.5s; /* Internet Explorer */
-o-animation: fadein 0.5s; /* Opera */
animation: fadein 0.5s;
}
@media (max-width: 990px) {
.navbar-nav .open .dropdown-menu {
position: static;
float: none;
width: auto;
margin-top: 0;
background-color: transparent;
border: 0;
-webkit-box-shadow: none;
box-shadow: none;
}
}
@media (max-width: 991px) {
.navbar-header {
float: none;
}
.navbar-toggle {
display: block;
}
.navbar-collapse {
border-top: 1px solid transparent;
box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
}
.navbar-collapse.collapse {
display: none!important;
}
.navbar-nav {
float: none!important;
margin-top: 0px;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
}
.navbar-nav>li {
float: none;
}
.navbar-nav>li>a {
padding-top: 10px;
padding-bottom: 10px;
}
.navbar-text {
float: none;
margin: 10px 0;
}
/* since 3.1.0 */
.navbar-collapse.collapse.in {
display: block!important;
}
.collapsing {
overflow: hidden!important;
}
.navbar-collapse {
width: auto;
border-top: 0;
-webkit-box-shadow: none;
box-shadow: none;
}
.navbar-collapse.collapse {
display: none !important;
height: auto !important;
padding-bottom: 0;
overflow: visible !important;
}
.navbar-collapse.in {
overflow-y: visible;
}
.navbar-fixed-top .navbar-collapse,
.navbar-static-top .navbar-collapse,
.navbar-fixed-bottom .navbar-collapse {
padding-right: 0;
padding-left: 0;
overflow-y: scroll !important;
}
}
/*
ARMA MENU POPUP PARA RESOLUCIONES de 768 a 991
*/
@media (min-width: 768px) and (max-width: 991px) {
.navbar-collapse {
border-top: 0px solid transparent;
-webkit-box-shadow: 0 0px 0px rgba(0, 0, 0, .05);
box-shadow: 0 0px 0px rgba(0, 0, 0, .05);
text-shadow: 0 1px 1px rgba(256, 256, 256, 0.1);
background-color: rgba(255,255,255,0.7);
float: right;
max-height: 100% !important;
outline: 5px solid #FFF;
}
.navbar-nav {
background-color: transparent;
width: 300px;
border-top: none;
overflow: hidden;
}
.navbar-nav:first-child {
margin-top: 0px ;
width: 300px;
}
.navbar-fixed-top .navbar-collapse,
.navbar-static-top .navbar-collapse,
.navbar-fixed-bottom .navbar-collapse {
padding-right: 0;
padding-left: 0;
overflow-y: auto !important;
}
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* CUSTOMIZE THE CAROUSEL */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* V1 ////////////////////////////////////////////////////////////////////// */
/* V1 ////////////////////////////////////////////////////////////////////// */
/* V1 ////////////////////////////////////////////////////////////////////// */
/* Carousel base class */
.carousel.op-min200-max500 {
min-height: 200px;
max-height: 500px;
overflow: hidden;
}
.carousel.op-min200-max500 .item {
min-height: 100%;
max-height: 100%;
}
/* Since positioning the image, we need to help out the caption */
.carousel.op-min200-max500 .carousel-caption {
z-index: 10;
}
.carousel.op-min200-max500 .item p {
font-size : 16px;
}
.carousel.op-min200-max500 .carousel-inner > .item > img {
/*
position: absolute;
display: blocK;
top: 0;
left: 0;
*/
width: 100%;
/*height: 500px;*/
}
.carousel.op-min200-max500 .carousel,
.carousel.op-min200-max500 .carousel-inner,
.carousel.op-min200-max500 .carousel-inner .item {
height: 100%;
text-transform: none;
}
/* V1 ////////////////////////////////////////////////////////////////////// */
/* V1 ////////////////////////////////////////////////////////////////////// */
/* V1 ////////////////////////////////////////////////////////////////////// */
.carousel.op-min440-max440 {
border: 30px solid #fff;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
/* Declare heights because of positioning of img element */
.carousel.op-min440-max440 .item {
overflow: hidden;
}
/* Since positioning the image, we need to help out the caption */
.carousel.op-min440-max440 .carousel-caption {
z-index: 10;
}
.carousel.op-min440-max440 .item p {
font-size : 16px;
}
.carousel.op-min440-max440 .carousel-inner > .item > img {
height: 440px;
}
.carousel.op-min440-max440 .carousel,
.carousel.op-min440-max440 .carousel-inner,
.carousel.op-min440-max440 .carousel-inner .item {
height: 440px;
}
.carousel.op-min440-max440 .carousel-control.left {
background-image: none;
}
.carousel.op-min440-max440 .carousel-control.right {
right: 0;
left: auto;
background-image: none;
}
.carousel.op-min440-max440 .carousel-control:hover,
.carousel.op-min440-max440 .carousel-control:focus {
color: #fff;
text-decoration: none;
filter: alpha(opacity=90);
outline: 0;
opacity: .9;
}
.carousel.op-min440-max440 .carousel-inner>.item>a>img,
.carousel.op-min440-max440 .carousel-inner>.item>img,
.carousel.op-min440-max440 .img-responsive,
.carousel.op-min440-max440 .thumbnail a>img,
.carousel.op-min440-max440 .thumbnail>img {
display: block;
max-width: none;
width: auto;
}
@media (max-width: 800px) {
.carousel.op-min440-max440 {
border: 20px solid #fff;
}
.carousel.op-min440-max440 .carousel-inner > .item > img {
height: 400px;
}
.carousel.op-min440-max440 .carousel,
.carousel.op-min440-max440 .carousel-inner,
.carousel.op-min440-max440 .carousel-inner .item {
height: 400px;
}
}
@media (max-width: 768px) {
.carousel.op-min440-max440 {
border: 10px solid #fff;
}
.carousel.op-min440-max440 .carousel-inner > .item > img {
height: 350px;
}
.carousel.op-min440-max440 .carousel,
.carousel.op-min440-max440 .carousel-inner,
.carousel.op-min440-max440 .carousel-inner .item {
height: 350px;
}
}
@media (max-width: 570px) {
.carousel.op-min440-max440 {
border: 10px solid #fff;
}
.carousel.op-min440-max440 .carousel-inner > .item > img {
height: 250px;
}
.carousel.op-min440-max440 .carousel,
.carousel.op-min440-max440 .carousel-inner,
.carousel.op-min440-max440 .carousel-inner .item {
height: 250px;
}
}
/* V2 ////////////////////////////////////////////////////////////////////// */
/* V2 ////////////////////////////////////////////////////////////////////// */
/* V2 ////////////////////////////////////////////////////////////////////// */
.carousel.op-min590-max310 {
border: 30px solid #fff;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
/* Declare heights because of positioning of img element */
.carousel.op-min590-max310 .item {
overflow: hidden;
}
/* Since positioning the image, we need to help out the caption */
.carousel.op-min590-max310 .carousel-caption {
z-index: 10;
}
.carousel.op-min590-max310 .item p {
font-size : 16px;
}
.carousel.op-min590-max310 .carousel-inner > .item > img {
max-height: 440px;
height: auto;
width: 100%;
}
.carousel.op-min590-max310 .carousel,
.carousel.op-min590-max310 .carousel-inner,
.carousel.op-min590-max310 .carousel-inner .item {
max-height: 440px;
height: auto;
}
.carousel.op-min590-max310 .carousel-control.left {
background-image: none;
}
.carousel.op-min590-max310 .carousel-control.right {
right: 0;
left: auto;
background-image: none;
}
.carousel.op-min590-max310 .carousel-control:hover,
.carousel.op-min590-max310 .carousel-control:focus {
color: #fff;
text-decoration: none;
filter: alpha(opacity=90);
outline: 0;
opacity: .9;
}
.carousel.op-min590-max310 .carousel-inner>.item>a>img,
.carousel.op-min590-max310 .carousel-inner>.item>img,
.carousel.op-min590-max310 .img-responsive,
.carousel.op-min590-max310 .thumbnail a>img,
.carousel.op-min590-max310 .thumbnail>img {
display: block;
max-width: none;
width: auto;
}
@media (max-width: 800px) {
.carousel.op-min590-max310 {
border: 20px solid #fff;
}
.carousel.op-min590-max310 .carousel-inner > .item > img {
height: 450px;
}
.carousel.op-min590-max310 .carousel,
.carousel.op-min590-max310 .carousel-inner,
.carousel.op-min590-max310 .carousel-inner .item {
height: 450px;
}
}
@media (max-width: 768px) {
.carousel.op-min590-max310 {
border: 1.4rem solid #fff;
}
.carousel.op-min590-max310 .carousel-inner > .item > img {
height: auto;
width: 100%;
}
.carousel.op-min590-max310 .carousel,
.carousel.op-min590-max310 .carousel-inner,
.carousel.op-min590-max310 .carousel-inner .item {
height: auto;
}
}
/* V3 ////////////////////////////////////////////////////////////////////// */
/* V3 ////////////////////////////////////////////////////////////////////// */
/* V3 ////////////////////////////////////////////////////////////////////// */
/* Carousel base class */
.carousel.op-min500-max500 {
min-height: 500px;
max-height: 500px;
overflow: hidden;
}
.carousel.op-min500-max500 .item {
min-height: 100%;
max-height: 100%;
}
/* Since positioning the image, we need to help out the caption */
.carousel.op-min500-max500 .carousel-caption {
z-index: 10;
}
.carousel.op-min500-max500 .item p {
font-size : 16px;
}
.carousel.op-min500-max500 .carousel-inner > .item > img {
/*
position: absolute;
display: blocK;
top: 0;
left: 0;
*/
width: 100%;
/*height: 500px;*/
}
.carousel.op-min500-max500 .carousel,
.carousel.op-min500-max500 .carousel-inner,
.carousel.op-min500-max500 .carousel-inner .item {
height: 100%;
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* CAROUSEL FADE */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
.carousel-fade .carousel-inner .item {
-webkit-transition-property: opacity;
transition-property: opacity;
}
.carousel-fade .carousel-inner .item,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
opacity: 0;
}
.carousel-fade .carousel-inner .active,
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
opacity: 1;
}
.carousel-fade .carousel-inner .next,
.carousel-fade .carousel-inner .prev,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
left: 0;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.carousel-fade .carousel-control {
z-index: 2;
}
.item:nth-child(1),
.item:nth-child(4),
.item:nth-child(7),
.item:nth-child(10) {
/* background: #74C390; */
background-color: #FFF;
}
.item:nth-child(2),
.item:nth-child(5),
.item:nth-child(8),
.item:nth-child(11) {
/*
background: #51BCE8;
*/
background-color: #FFF;
}
.item:nth-child(3),
.item:nth-child(6),
.item:nth-child(9),
.item:nth-child(12) {
/*
background: #E46653;
*/
background-color: #FFF;
}
.carousel-fade .carousel-inner .item .carousel-caption {
position: absolute;
top: 35%;
left: 50%;
width: 100%;
z-index: 3;
color: #fff;
text-align: center;
text-transform: none;
text-shadow: 1px 1px 0 rgba(0,0,0,.75);
-webkit-transform: translate3d(-50%,-50%,0);
-moz-transform: translate3d(-50%,-50%,0);
-ms-transform: translate3d(-50%,-50%,0);
-o-transform: translate3d(-50%,-50%,0);
transform: translate3d(-50%,-50%,0);
}
.carousel-fade .carousel-inner .item .carousel-caption h1 {
font-size: 5rem;
font-weight: bold;
margin: 0;
padding: 10px 0;
}
.carousel-fade .carousel-inner .item .carousel-caption h2 {
color: #FFF;
font-size: 3rem;
font-weight: bold;
margin: 0;
padding: 15px 0;
}
.carousel-fade .carousel-inner .item .carousel-caption h3 {
color: #FFF;
font-size: 3rem;
font-weight: normal;
margin: 0;
padding: 5px 0;
}
.carousel-fade .carousel-inner .item .carousel-caption {
opacity: 0;
-webkit-transition: 1s all ease-in-out .1s;
-moz-transition: 1s all ease-in-out .1s;
-ms-transition: 1s all ease-in-out .1s;
-o-transition: 1s all ease-in-out .1s;
transition: 1s all ease-in-out .1s;
}
.carousel-fade .carousel-inner .item.active .carousel-caption {
opacity: 1;
-webkit-transition: 1s all ease-in-out .1s;
-moz-transition: 1s all ease-in-out .1s;
-ms-transition: 1s all ease-in-out .1s;
-o-transition: 1s all ease-in-out .1s;
transition: 1s all ease-in-out .1s;
}
@media (max-width: 1024px) { .carousel-indicators { display: none } }
@media (max-width: 993px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 6.0rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 3.0rem; } }
@media (max-width: 992px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 5.8rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 2.8rem; } }
@media (max-width: 991px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 5.6rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 2.6rem; } }
@media (max-width: 990px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 5.4rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 2.4rem; } }
@media (max-width: 980px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 5.2rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 2.2rem; } }
@media (max-width: 970px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 5.0rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 2.0rem; } }
@media (max-width: 960px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 4.8rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.8rem; } }
@media (max-width: 950px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 4.6rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media (max-width: 940px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 4.4rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media (max-width: 930px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 4.2rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media (max-width: 920px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 4.0rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media (max-width: 910px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 3.8rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media (max-width: 900px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 3.6rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media (max-width: 890px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 3.4rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media (max-width: 880px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 3.2rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media (max-width: 870px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 3.0rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media (max-width: 860px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 2.8rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media (max-width: 850px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 2.8rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media (max-width: 840px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 2.8rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media (max-width: 830px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 2.8rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media (max-width: 820px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 2.8rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media (max-width: 810px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 2.8rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media (max-width: 790px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 2.8rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media (max-width: 780px) { .carousel-fade .carousel-inner .item .carousel-caption h1 { font-size: 2.8rem; } .carousel-fade .carousel-inner .item .carousel-caption h2, .carousel-fade .carousel-inner .item .carousel-caption h3 { font-size: 1.6rem; } }
@media screen and (min-width: 980px){ .carousel-caption { width: 980px; } }
@media screen and (max-width: 640px){ .carousel-caption h1 { font-size: 4em; } }
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* OVERLAY / BUTTON / CAPA DEGRADADA PARA CAROUSEL 2 */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/*
<div id="d_carousel" class="carousel slide carousel-fade" data-ride="carousel">
... (indicators)
<div class="op-polarizado"></div>
...
*/
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
.op-polarizado {
position: absolute;
width: 100%;
height: 100%;
z-index: 1;
background-color: #080d15;
opacity: .1;
filter: alpha(opacity=10); /* For IE8 and earlier */
outline: 0px solid #f50;
}
/********************************/
/* Custom Buttons */
/********************************/
.btn.btn-lg {padding: 10px 40px;}
.btn.btn-hero,
.btn.btn-hero:hover,
.btn.btn-hero:focus {
color: #f5f5f5;
background-color: #1abc9c;
border-color: #1abc9c;
outline: none;
margin: 20px auto;
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* Estilos Miscelaneos */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
.op-height-s { height: 5rem !important; }
.op-height-m { height: 10rem !important; }
.op-height-l { height: 40rem !important; }
.op-desc-size-m
{
display: -webkit-box;
margin: 0 auto;
border-bottom: 40px solid transparent;
line-height: 1.9rem;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
}
.op-center-block { position: relative; margin-left: auto; margin-right: auto; display: block; width: 330px;}
ul.socialNetwork { padding:0; display: inline-block; margin-bottom: 0; width: 230px; }
ul.socialNetwork li { display:inline-block; list-style-type: none; margin-top: 0.8em; font-size: 20px; }
.op-nowrap { white-space: nowrap; }
/* ------------------------------------------------------------------------- */
/* blockquote */
/* ------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
/* blockquote */
/* ------------------------------------------------------------------------- */
blockquote.op-comillas-dobles-1 {
font: 14px/20px italic Times, serif;
padding: 8px;
background-color: tranparent;
border-top: 0px solid #e1cc89;
border-bottom: 0px solid #e1cc89;
margin: 5px;
background-image: url(images/openquote1.gif);
background-position: top left;
background-repeat: no-repeat;
text-indent: 23px;
}
blockquote.op-comillas-dobles-1 span {
display: block;
background-image: url(images/closequote1.gif);
background-repeat: no-repeat;
background-position: bottom right;
}
blockquote.op-comillas-dobles-2 {
display:block;
background: transprent;
padding: 15px 30px 15px 45px;
margin: 0 40px 20px 40px;
position: relative;
/*Font*/
line-height: 1.2;
color: #666;
text-align: justify;
/*Borders - (Optional)*/
border-left: 0px solid #c76c0c;
border-right: 0px solid #c76c0c;
}
blockquote.op-comillas-dobles-2::before{
content: "\201C"; /*Unicode for Left Double Quote*/
/*Font*/
font-family: Georgia, serif;
font-size: 60px;
font-weight: bold;
color: #999;
/*Positioning*/
position: absolute;
left: 0px;
top: 5px;
}
blockquote.op-comillas-dobles-2::after{
/*Reset to make sure*/
content: "\02EE";
/*Font*/
font-family: Georgia, serif;
font-size: 60px;
font-weight: bold;
color: #999;
/*Positioning*/
float: right;
left: 10px;
top:5px;
}
blockquote.op-comillas-dobles-2 a{
text-decoration: none;
background: #eee;
cursor: pointer;
padding: 0 3px;
color: #c76c0c;
}
blockquote.op-comillas-dobles-2 a:hover{
color: #666;
}
blockquote.op-comillas-dobles-2 em{
font-style: italic;
}
@media (max-width: 510px) {
blockquote.op-comillas-dobles-2 {
padding-top : 15px;
padding-right : 15px;
padding-bottom : 10px;
padding-left : 15px;
margin-top : 0px;
margin-right : 0px
margin-bottom : 5px;
margin-left : 5px;
float : left;
display : inline-block;
width : 100%;
}
blockquote.op-comillas-dobles-2::before{
font-size: 3rem;
font-weight: bold;
left: -10px;
top:5px;
}
blockquote.op-comillas-dobles-2::after{
font-size: 3rem;
font-weight: bold;
right: -10px;
top:5px;
}
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
blockquote.op-comillas-dobles-3 {
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
display:block;
background: transprent;
padding-top: 15px;
padding-right: 35px;
padding-bottom: 15px;
padding-left: 35px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 20px;
margin-left: 40px;
position: relative;
/*Font*/
line-height: 1.2;
color: #333;
text-align: justify;
/*Borders - (Optional)*/
border-left: 0px solid #c76c0c;
border-right: 0px solid #c76c0c;
text-shadow: 1px 1px 0 rgba(200,200,200,.3);
}
blockquote.op-comillas-dobles-3::before{
content: "\201C"; /*Unicode for Left Double Quote*/
/*Font*/
font-family: Georgia, serif;
font-size: 30px;
font-weight: bold;
color: #999;
/*Positioning*/
position: absolute;
left: 10px;
top:5px;
}
blockquote.op-comillas-dobles-3::after{
/*Reset to make sure*/
content: "\02EE";
/*Font*/
font-family: Georgia, serif;
font-size: 30px;
font-weight: bold;
color: #999;
/*Positioning*/
float: none;
position: relative;
left: 10px;
top:12px;
line-height: 10px;
}
blockquote.op-comillas-dobles-3 a{
text-decoration: none;
background: #eee;
cursor: pointer;
padding: 0 3px;
color: #c76c0c;
}
blockquote.op-comillas-dobles-3 a:hover{
color: #666;
}
blockquote.op-comillas-dobles-3 em {
font-style: italic;
}
@media (max-width: 510px) {
blockquote.op-comillas-dobles-3 {
padding-top : 15px;
padding-right : 10px;
padding-bottom : 10px;
padding-left : 5px;
margin-top : 0px;
margin-right : 0px
margin-bottom : 5px;
margin-left : 5px;
display: inline-block;
width: 100%;
}
blockquote.op-comillas-dobles-3::before{
font-size: 3rem;
font-weight: bold;
left: -10px;
top:5px;
}
blockquote.op-comillas-dobles-3::after{
font-size: 3rem;
font-weight: bold;
right: -30px;
top:10px;
}
}
@media (max-width: 768px) {
blockquote.op-comillas-dobles-3 {
padding-top : 15px;
padding-right : 10px;
padding-bottom : 10px;
padding-left : 5px;
margin-top : 0px;
margin-right : 0px
margin-bottom : 5px;
margin-left : 5px;
display: inline-block;
width: 100%;
}
blockquote.op-comillas-dobles-3::before{
font-size: 3rem;
font-weight: bold;
left: -10px;
top:5px;
}
blockquote.op-comillas-dobles-3::after{
font-size: 3rem;
font-weight: bold;
right: -30px;
top:10px;
}
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* CORTAR CONTENIDOS 1 */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/*
<article class="op-crta-cont-1">
<p class="op-desc text-justify">
Es relativamente sencillo y que se vea bien en todas las situaciones, incluso en aquellos casos que son el nº exacto de lÃneas y la última no esté completa. Es relativamente sencillo y que se vea bien en todas las situaciones, incluso en aquellos casos XXX
</p>
</article>
*/
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
.op-crta-cont-1 * {
position: relative;
font : 1.4rem/1.9rem Arial, sans-serif;
color : #333;
margin : 0;
padding : 2rem;
}
.op-crta-cont-1 *,
.op-crta-cont-1 *:after,
.op-crta-cont-1 *:before {
box-sizing: inherit;
-moz-box-sizing: inherit;
}
/*
html {
box-sizing: border-box;
-moz-box-sizing: inherit;
color: #8B6615;
font-size: 1.2rem;
}
*/
.op-crta-cont-1 {
width: 100%;
margin: 0 auto;
line-height: 1.5rem;
box-shadow: 0 0 0;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
font-size: 1.4rem !important;
}
.op-crta-cont-1 h1 {
font-weight: 100;
/* color: #3F7963;*/
}
.op-crta-cont-1 p {
background: #fff;
max-height: 11.8rem;
overflow: hidden;
padding: 0 0;
display: block;
font-size: 1.4rem !important;
}
.op-crta-cont-1 strong {
text-align: left;
}
/*
.op-crta-cont p:before {
content:'...';
position: relative;
right: 0;
}
*/
.op-crta-cont-1 p:after {
/*
content: '...';
background: inherit;
position: absolute;
bottom: 0.7rem;
right: 0;
height: 1.5rem;
z-index: 1;
*/
content: '...';
background: inherit;
position: relative;
bottom: 2.0rem;
right: -15px;
height: 1rem;
z-index: 1;
float: right;
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* CORTAR CONTENIDOS 2 */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/*
<p class="op-desc text-left op-crta-cont-2 text-justify">
Disfrute del icono más representativo de la Patagonia, con turismo de estancia, actividades locales, excursión a la octava maravilla del mundo.
Disfrute del icono más representativo de la Patagonia, con turismo de estancia, actividades locales, excursión a la octava maravilla del mundo.
</p>
*/
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
.op-crta-cont-2 * {
position: relative;
font : 1.5rem/1.7rem Arial, sans-serif;
color : #333;
margin : 0;
padding : 2rem;
}
.op-crta-cont-2 *,
.op-crta-cont-2 *:after,
.op-crta-cont-2 *:before {
box-sizing: inherit;
-moz-box-sizing: inherit;
}
/*
html {
box-sizing: border-box;
-moz-box-sizing: inherit;
color: #8B6615;
font-size: 1.2rem;
}
*/
.op-crta-cont-2 {
width : 100%;
margin : 0 auto;
line-height : 1.5rem;
font-size : 1.6rem !important;
-webkit-box-shadow: 0 0 0;
box-shadow: 0 0 0;
-webkit-box-sizing: inherit;
-moz-box-sizing: inherit;
box-sizing: border-box;
}
.op-crta-cont-2 h1 {
font-weight : 100;
/* color: #3F7963;*/
}
.op-crta-cont-2 {
background : #fff;
max-height : 14.8rem;
padding : 0 0;
font-size : 1.6rem !important;
display : -moz-box; /* Mozilla */
display : -webkit-box; /* WebKit */
display : box; /* As specified */
margin : 0 auto;
border-bottom : 0px solid transparent;
line-height : 1.7rem;
-webkit-line-clamp : 5;
box-orient : vertical;
-moz-box-orient : vertical;
-webkit-box-orient : vertical;
overflow : hidden;
text-overflow : ellipsis;
word-wrap : break-word;
}
.op-crta-cont-2.op-cata-deta-desc {
background : #fff;
max-height : 28.9rem !important;
padding : 0 0;
font-size : 1.6rem !important;
display : -moz-box; /* Mozilla */
display : -webkit-box; /* WebKit */
display : box; /* As specified */
margin : 0 auto;
border-bottom : 0px solid transparent;
line-height : 1.7rem;
-webkit-line-clamp : 20 !important;
box-orient : vertical;
-moz-box-orient : vertical;
-webkit-box-orient : vertical;
overflow : hidden;
text-overflow : ellipsis;
word-wrap : break-word;
}
@media (max-width: 570px) {
.op-crta-cont-2 {
background : #fff;
max-height : 17.4rem;
padding : 0 0;
font-size : 1.6rem !important;
display : -moz-box; /* Mozilla */
display : -webkit-box; /* WebKit */
display : box; /* As specified */
margin : 0 auto;
border-bottom : 0px solid transparent;
line-height : 1.7rem;
-webkit-line-clamp : 5;
box-orient : vertical;
-moz-box-orient : vertical;
-webkit-box-orient : vertical;
overflow : hidden;
text-overflow : ellipsis;
word-wrap : break-word;
}
.op-crta-cont-2.op-cata-deta-desc {
background : #fff;
max-height : 28.9rem !important;
padding : 0 0;
font-size : 1.6rem !important;
display : -moz-box; /* Mozilla */
display : -webkit-box; /* WebKit */
display : box; /* As specified */
margin : 0 auto;
border-bottom : 0px solid transparent;
line-height : 1.7rem;
-webkit-line-clamp : 20 !important;
box-orient : vertical;
-moz-box-orient : vertical;
-webkit-box-orient : vertical;
overflow : hidden;
text-overflow : ellipsis;
word-wrap : break-word;
}
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ICONS */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
.iconLinks a i.iconRounded { border-color: #fff; }
.iconLinks a:hover i.iconRounded { border-color: #525252; }
/*** icons ***/
.iconRounded {
color:#525252;
border: 1px solid #525252;
}
.iconRounded:hover,
.color1 .iconRounded:hover,
.iconLinks a:hover i,
.boxIcon a:hover i{
background-color:#525252;
color:#fff;
border-color: #525252;
}
.color2 .iconRounded {
background-color:#525252;
color:#fff;
border: 1px solid #fff;
}
.color2 .iconRounded:hover,.color2 .boxIcon a:hover i {
background-color:#fff;
color:#525252;
border: 2px solid #525252;
}
/* NEKO CSS FRAMEWORK
================================================== */
/*** lists ***/
/* icons */
.iconList li:before{
content:'\e801';
font-family: 'custom-icons';
font-size: 10px;
text-align: left;
padding: 0;
margin:0;
display:inline-block;
margin-right:10px;
line-height:1em;
}
.iconList li {padding:5px;}
/* border*/
.borderList li {
border-bottom: 1px solid rgba(125,125,125,0.5);
}
/*** icons ***/
.iconRounded{
border-radius:50%;
width: 40px;
height: 40px;
display: block;
text-align: center;
font-size:18px;
}
.iconRounded:before{margin: auto;text-align: center; line-height: 40px; }
.iconBig{
font-size: 40px;
}
.iconBig.iconRounded{
width:100px;
height: 100px;
}
.iconBig.iconRounded:before{
line-height: 100px;
}
.iconMedium {
font-size: 33px;
}
.iconMedium.iconRounded{
width: 66px;
height: 66px;
}
.iconMedium.iconRounded:before{
line-height: 66px;
}
.iconSmall:before {
font-size: 10px;
}
.iconSmall.iconRounded{
width: 26px;
height: 26px;
}
.iconSmall.iconRounded:before{
line-height: 26px;
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* BOOTSTRAP - PORTAFOLIO / CATALOGO */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
.og-cata-d1 .op-cata-item {
max-width: 500px;
margin-bottom: 15px;
right: 0;
}
.og-cata-d1 .op-cata-item .op-cata-link {
display: block;
position: relative;
max-width: 800px;
margin: 0 auto;
}
.og-cata-d1 .op-cata-item .op-cata-link .op-cata-over {
background: rgba(254, 209, 54, 0.9);
position: absolute;
width: 100%;
height: 100%;
opacity: 0;
transition: all ease 0.5s;
-webkit-transition: all ease 0.5s;
-moz-transition: all ease 0.5s;
}
.og-cata-d1 .op-cata-item .op-cata-link .op-cata-over:hover {
opacity: 1;
}
.og-cata-d1 .op-cata-item .op-cata-link .op-cata-over .op-cata-over-cont {
position: absolute;
width: 100%;
height: 20px;
font-size: 20px;
text-align: center;
top: 50%;
margin-top: -12px;
color: white;
}
.og-cata-d1 .op-cata-item .op-cata-link .op-cata-over .op-cata-over-cont i {
margin-top: -12px;
}
.og-cata-d1 .op-cata-item .op-cata-link .op-cata-over .op-cata-over-cont h3,
.og-cata-d1 .op-cata-item .op-cata-link .op-cata-over .op-cata-over-cont h4 {
margin: 0;
}
.og-cata-d1 .op-cata-item .op-cata-imge {
min-height : 15rem;
max-height : 100%;
height : auto;
overflow : hidden;
max-width : 100%;
width : 100%;
/*
max-width: 360px;
*/
margin: 0 auto;
background-color: white;
text-align: center;
padding: 0px;
}
.og-cata-d1 .op-cata-item .op-cata-imge img {
margin : 0;
padding : 0;
width : auto;
min-width : 100%;
height : 27rem;
border-bottom : 0px solid #ccc;
-webkit-border-radius : 2px 2px 0px 0px; /* -- WebKit y Safari -- */
-moz-border-radius : 2px 2px 0px 0px; /* -- Mozilla -- */
border-radius : 2px 2px 0px 0px; /* -- W3C Specification -- */
}
.og-cata-d1 .op-cata-item .op-cata-msge {
max-width: 100%;
margin: 0 auto;
background-color: white;
text-align: left;
padding: 15px;
overflow: hidden;
}
.og-cata-d1 .op-cata-item .op-cata-msge h4 {
text-transform: none;
margin: 0;
}
.og-cata-d1 .op-cata-item .op-cata-msge p {
font-family: "Droid Serif", "Helvetica Neue", Helvetica, Arial, sans-serif;
/*
font-style: normal;
*/
font-size: 16px;
margin: 0;
}
.og-cata-d1 .op-cata-item .op-cata-msge .op-attl { min-height : 1rem; height : 2.0rem; font : 1.2rem/1.3rem Arial, sans-serif; color : #ff6600; margin : 0; padding : 4px 2rem; }
.og-cata-d1 .op-cata-item .op-cata-msge .op-ttlo { min-height : 1rem; height : 2.5rem; font : 1.5rem/1.9rem Arial, sans-serif; font-weight: bold; color : #111; margin : 0; padding : 6px 2rem; }
.og-cata-d1 .op-cata-item .op-cata-msge .op-ttlo span { min-height : 1rem; height : 2.5rem; font : 1.5rem/1.9rem Arial, sans-serif; font-weight: bold; color : #777; margin : 0; }
.og-cata-d1 .op-cata-item .op-cata-msge .op-sttl { min-height : 1rem; height : 2.0rem; font : 1.5rem/1.9rem Arial, sans-serif; color : #ff6600; margin : 0; padding : 2px 2rem; }
.og-cata-d1 .op-cata-item .op-cata-msge .op-desc { height : 19rem; font : 1.4rem/1.9rem Arial, sans-serif; color : #333; margin : 0; padding : 2rem; }
.og-cata-d1 .op-cata-item .op-cata-msge .op-mass { height : 2.5rem; font : 1.4rem/2.0rem Arial, sans-serif; color : #888; background-color: transparent; margin : 0; padding : 0.2rem 2rem; text-align: right; outline: 0px solid #f50;}
.og-cata-d1 .op-cata-item .op-cata-msge .op-mass a { color : #666; text-decoration: none; text-shadow: 1px 1px 0 rgba(250,250,250,.75);}
.og-cata-d1 .op-cata-item .op-cata-msge .op-mass a:hover { color : #444; border-bottom: 1px dashed #444; box-sizing: border-box; }
.og-cata-d1 * {
z-index: 2;
}
.og-cata-d1 {
/*max-width: 500px;*/
}
@media (min-width: 767px) {
.og-cata-d1 .op-cata-item {
margin-bottom: 30px;
}
}
@media (max-width: 768px) {
.og-cata-d1 {
margin-left: calc(50% - 250px );
}
}
@media (max-width: 510px) {
.og-cata-d1 {
margin-left: auto;
margin-right: auto;
}
}
.op-bc-gris-1 { background-color: #F9F9F9 !important; border-top: 0px solid #EEE; border-bottom: 4px solid #DDD;}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/*
.glyphicon {
position: relative;
top: 1px;
display: inline-block;
font-style: normal;
font-weight: normal;
line-height: 1;
font-family: 'Glyphicons Halflings' !important;
font-size: 1.2rem;
padding-right: 5px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.glyphicon:before {
font-family: 'Glyphicons Halflings' !important;
font-size: 1.2rem;
padding-right: 5px;
}
*/
/*
.glyphicon-map-marker:before {
font-family: 'Glyphicons Halflings' !important;
font-size: 1.2rem;
padding-right: 5px;
}
*/
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* Estilos para HR - V2 */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
hr.op-hr-style-1{
border-top: 1px solid #8c8b8b;
}
hr.op-hr-style-2 {
border-top: 3px double #8c8b8b;
}
hr.op-hr-style-3 {
border-top: 1px dashed #8c8b8b;
}
hr.op-hr-style-4 {
border-top: 1px dotted #8c8b8b;
}
hr.op-hr-style-5 {
background-color: #fff;
border-top: 2px dashed #8c8b8b;
}
hr.op-hr-style-6 {
background-color: #fff;
border-top: 2px dotted #8c8b8b;
}
hr.op-hr-style-7 {
border-top: 1px solid #8c8b8b;
border-bottom: 1px solid #fff;
}
hr.op-hr-style-8 {
border-top: 1px solid #8c8b8b;
border-bottom: 1px solid #fff;
}
hr.op-hr-style-8:after {
content: '';
display: block;
margin-top: 2px;
border-top: 1px solid #8c8b8b;
border-bottom: 1px solid #fff;
}
hr.op-hr-style-9 {
border-top: 1px dashed #8c8b8b;
border-bottom: 1px dashed #fff;
}
hr.op-hr-style-10 {
border-top: 1px dotted #8c8b8b;
border-bottom: 1px dotted #fff;
}
hr.op-hr-style-11 {
height: 6px;
background: url(http://ibrahimjabbari.com/english/images/hr-11.png) repeat-x 0 0;
border: 0;
}
hr.op-hr-style-12 {
height: 6px;
background: url(http://ibrahimjabbari.com/english/images/hr-12.png) repeat-x 0 0;
border: 0;
}
hr.op-hr-style-13 {
height: 10px;
border: 0;
box-shadow: 0 10px 10px -10px #8c8b8b inset;
}
hr.op-hr-style-14 {
border: 0;
height: 1px;
background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
}
hr.op-hr-style-15 {
border-top: 4px double #8c8b8b;
text-align: center;
}
hr.op-hr-style-15:after {
content: '\002665';
display: inline-block;
position: relative;
top: -15px;
padding: 0 10px;
background: #f0f0f0;
color: #8c8b8b;
font-size: 18px;
}
hr.op-hr-style-16 {
border-top: 1px dashed #8c8b8b;
}
hr.op-hr-style-16:after {
content: '\002702';
display: inline-block;
position: relative;
top: -12px;
left: 40px;
padding: 0 3px;
background: #f0f0f0;
color: #8c8b8b;
font-size: 18px;
}
hr.op-hr-style-17 {
border-top: 1px solid #DDD;
text-align: center;
}
hr.op-hr-style-17:after {
content: '§';
display: inline-block;
position: relative;
top: -14px;
padding: 0 10px;
background: transparent;
color: #DDD;
font-size: 18px;
-webkit-transform: rotate(60deg);
-moz-transform: rotate(60deg);
transform: rotate(60deg);
}
hr.op-hr-style-18 {
height: 30px;
border-style: solid;
border-color: #8c8b8b;
border-width: 1px 0 0 0;
border-radius: 20px;
}
hr.op-hr-style-18:before {
display: block;
content: "";
height: 30px;
margin-top: -31px;
border-style: solid;
border-color: #8c8b8b;
border-width: 0 0 1px 0;
border-radius: 20px;
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* Separadores de contenidos (div) */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/*
<!-- CASO 1 -->
<div class="op-triangle-bottomright-gris-1 ">
<div class="op-triangle-bottomright-gris-2 "></div>
</div>
<!-- CASO 2 -->
<div class="op-rectangle-gris-1 ">
<div class="op-rectangle-gris-2 "></div>
</div>
<!-- CASO 3 -->
<div class="op-media-luna-0 ">
<div class="op-media-luna-2 "></div>
<div class="op-media-luna-1 "></div>
</div>
*/
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
.op-media-luna-0 {width: 100%; height: 10px; outline: 0px solid #f50; position: relative;}
.op-media-luna-1 {
width : 800px;
height : 140px;
border-radius : 90%; /* -- W3C Specification -- */
-moz-border-radius : 90%; /* -- Mozilla -- */
-webkit-border-radius : 90%; /* -- WebKit y Safari -- */
box-shadow : 85px 55px 0px 0px #F9F9F9;
-moz-box-shadow : 85px 55px 0px 0px #F9F9F9;
-webkit-box-shadow : 85px 55px 0px 0px #F9F9F9;
border-bottom : 4px solid #DDD;
transform : rotate(-5deg);
-moz-transform : rotate(-5deg);
-webkit-transform : rotate(-5deg);
position : relative;
left : -160px;
top : -125px;
z-index : 105;
opacity: 1;
filter: alpha(opacity=100); /* For IE8 and earlier */
}
.op-media-luna-2 {
width : 800px;
height : 140px;
border-radius : 90%; /* -- W3C Specification -- */
-moz-border-radius : 90%; /* -- Mozilla -- */
-webkit-border-radius : 90%; /* -- WebKit y Safari -- */
box-shadow : 85px 55px 0px 0px #DFDFDF;
-moz-box-shadow : 85px 55px 0px 0px #DFDFDF;
-webkit-box-shadow : 85px 55px 0px 0px #DFDFDF;
border-bottom : 2px solid #DDDDDD;
transform : rotate(-1.5deg);
-moz-transform : rotate(-1.5deg);
-webkit-transform : rotate(-1.5deg);
position : absolute;
left : -240px;
top : -125px;
z-index : 100;
opacity: 1;
filter: alpha(opacity=100); /* For IE8 and earlier */
}
/* ///////////////////////////////////////////////////////////////////////// */
.op-triangle-up-1 { width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 15px solid #999999; position: absolute; top: 15px; right: 0px; z-index: 110; outline: 0px solid #fff; }
.op-triangle-up-2 { width: 0; height: 0; border-left: 3px solid transparent; border-right: 3px solid transparent; border-bottom: 25px solid #DFDFDF; position: absolute; top: -10px; left: -10px; z-index: 110; outline: 0px solid #fff; }
.op-triangle-up-3 { width: 0; height: 0; border-left: 8px solid transparent; border-right: 5px solid transparent; border-bottom: 15px solid #DFDFDF; position: absolute; top: 10px; right: -10px; z-index: 110; outline: 0px solid #fff; }
.op-triangle-down-1 { width: 0; height: 0; border-left: 8px solid transparent; border-right: 5px solid transparent; border-top: 15px solid #DFDFDF; position: absolute; top: -20px; right: -10px; z-index: 106; outline: 0px solid #fff; }
.op-triangle-down-2 { width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 15px solid #FFFFFF; position: absolute; top: 0; left: 50%; z-index: 106; outline: 0px solid #fff; }
.op-infinity {
position: relative;
width: 212px;
height: 100px;
}
.op-infinity:before,
.op-infinity:after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 60px;
height: 60px;
border: 20px solid red;
-moz-border-radius: 50px 50px 0 50px;
border-radius: 50px 50px 0 50px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.op-infinity:after {
left: auto;
right: 0;
-moz-border-radius: 50px 50px 50px 0;
border-radius: 50px 50px 50px 0;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
/* ///////////////////////////////////////////////////////////////////////// */
.op-rectangle-gris-1 {
width: 600px;
height: 60px;
-webkit-transform: rotate(-3deg);
-moz-transform: rotate(-3deg);
transform: rotate(-3deg);
background-color: #CCC;
border-top: 1px solid #EEE;
left: -40px;
bottom: -60px;
position: relative;
z-index: 9;
}
/* ///////////////////////////////////////////////////////////////////////// */
.op-rectangle-gris-2 {
width: 600px;
height: 30px;
-webkit-transform: rotate(1deg);
-moz-transform: rotate(1deg);
transform: rotate(1deg);
background-color: #F9F9F9;
border-top: 0px solid #EEE;
left: 0px;
top: 4px;
position: absolute;
z-index: 9;
outline: 0px solid #f50;
}
/* ///////////////////////////////////////////////////////////////////////// */
.op-triangle-bottomright-gris-1 {
width: 0;
height: 0;
border-top: 0px solid #EEE;
border-bottom: 30px solid #F9F9F9;
border-left: 600px solid transparent;
left: -40px;
bottom: -15px;
position: relative;
z-index: 9;
}
/* ///////////////////////////////////////////////////////////////////////// */
.op-triangle-bottomright-gris-2 {
width: 0;
height: 0;
border-bottom: 50px solid #CCC;
border-left: 600px solid transparent;
left: 0px;
bottom: 10px;
position: absolute;
z-index: 11;
}
/* ///////////////////////////////////////////////////////////////////////// */
.op-trapecio {
width: 100%;
height: 0px;
border-right: 0px solid transparent;
border-left: 10px solid transparent;
border-bottom: 100px solid #428bca;
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* Texto mediante SVG */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/*
<div class="op-text-svg-1">
<svg>
<defs>
<mask id="mask" x="0" y="0" width="100%" height="100%" >
<!-- alpha rectangle -->
<!-- rectángulo alfa -->
<rect id="alpha" x="0" y="0" width="100%" height="100%"/>
<!-- All text that you want -->
<!-- Coloca todo el texto que necesites -->
<text id="title" x="10%" y="0" dy="2.3em">Disfruta la Patagonia</text>
<text id="subtitle" x="50%" y="0" dy="9.8em">Use it please!</text>
</mask>
</defs>
<!-- Apply color here! -->
<!-- Color aquà -->
<rect id="base" x="0" y="0" width="100%" height="50%"/>
</svg>
</div>
*/
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
html .op-text-svg-1 {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizelegibility;
}
/*
html .op-text-svg-1,
body .op-text-svg-1 {
height: 100%;
}
*/
body .op-text-svg-1 {
font-family: 'Open Sans', sans-serif;
}
.op-text-svg-1 {
position: fixed;
top: 0;
left: 0;
width: 100%;
height:180px;
z-index: 10;
}
.op-text-svg-1 svg {
width: 100%;
height: inherit;
}
.op-text-svg-1 svg text {
text-anchor: middle;
}
.op-text-svg-1 svg #alpha {
fill: #666666;
}
.op-text-svg-1 svg #title {
letter-spacing: -2px;
font-size: 2.5em;
font-weight: 800;
}
.op-text-svg-1 svg #subtitle {
letter-spacing: 8px;
font-size: 1.2em;
font-weight: 300;
text-transform: uppercase;
}
.op-text-svg-1 svg #base {
fill: black;
-webkit-mask: url(#mask);
mask: url(#mask);
}
.op-text-svg-1 section.intro {
/*
background: url(imgs/foto-9.jpg) no-repeat top center;
*/
background-size: cover;
position: relative;
width: 100%;
min-height: 100%;
}
/*@keyframes alpha {
50%{fill: #000;}
}*/
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* FADE-IN - Permite hacer fade -in al objeto que se está cargando */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/*
ã¤ãƒ¢ ã‚ãƒã¨ã¦ã® ã¡.ãƒ. (casi) Japonés
⼓⺒ ⼲⼛⼖⺊㮠丂.⼛. (casi) Chino
ΔΣ FΛΓƬΘ Ƨ.Λ. Griego
d3 f4(70 5.4. Hacker
*/
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
.op-fade-in {
-webkit-animation: fadein 2.5s; /* Safari and Chrome */
-moz-animation: fadein 2.5s; /* Firefox */
-ms-animation: fadein 2.5s; /* Internet Explorer */
-o-animation: fadein 2.5s; /* Opera */
animation: fadein 2.5s;
}
@keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
/* Firefox */
@-moz-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
/* Safari and Chrome */
@-webkit-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
/* Internet Explorer */
@-ms-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}​
/* Opera */
@-o-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}​
.op-fade-out {
-webkit-animation: fadeout 2.5s; /* Safari and Chrome */
-moz-animation: fadeout 2.5s; /* Firefox */
-ms-animation: fadeout 2.5s; /* Internet Explorer */
-o-animation: fadeout 2.5s; /* Opera */
animation: fadeout 2.5s;
}
@keyframes fadeout {
from { opacity: 1; }
to { opacity: 0; }
}
/* Firefox */
@-moz-keyframes fadeout {
from { opacity: 1; }
to { opacity: 0; }
}
/* Safari and Chrome */
@-webkit-keyframes fadeout {
from { opacity: 1; }
to { opacity: 0; }
}
/* Internet Explorer */
@-ms-keyframes fadeout {
from { opacity: 1; }
to { opacity: 0; }
}​
/* Opera */
@-o-keyframes fadeout {
from { opacity: 1; }
to { opacity: 0; }
}​
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* PARALLAX */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/*
*/
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
.op-parallax-windowxx {
min-height: 400px;
background: transparent;
}
.op-parallax-container-1 {
min-height: 200px;
max-height: 300px;
width: 100%;
outline: 0px solid #f50;
}
.op-parallax-container-2 {
min-height: 400px;
max-height: 400px;
width: 100%;
outline: 0px solid #f50;
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* PAGINAS DEL PORTAL */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
.op-catalogo-portal { padding-top: 50px; }
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* PAGINA DE CATALOGO DETALLE */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/*
*/
/* ------------------------------------------------------------------------- */
/* CSS - SECCION BANNER */
/* ------------------------------------------------------------------------- */
.op-catalogo-banner {
background-color: #F0F0F0;
background-image: url("../imgs/textura-mapa.jpg");
/*
background-repeat : repeat;
background-position : center top;
*/
padding-top: 30px;
padding-bottom: 50px;
border-bottom: 0px solid #e5e5e5;
/* ???CHF - REVISAR ESTAS DEFINICIONES EN DURO */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
font-family : 'Josefin Sans', verdana, sans-serif;
font-size : 1.8rem;
line-height : 2.2rem;
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
}
.op-catalogo-banner .op-attl { min-height : 1rem; height : auto; font : 1.5rem/1.3rem Arial, sans-serif; color : #ff6600; margin : 0; padding-left: 2rem; padding-right: 2rem; padding-top: 1rem; padding-bottom: 1rem; }
.op-catalogo-banner .op-ttlo { min-height : 100%; height : auto; font : 2.5rem/3.0rem Arial, sans-serif; font-weight: bold; color : #111; margin : 0; padding-left: 2rem; padding-right: 2rem; padding-top: 1rem; padding-bottom: 1rem; display: inline-block; }
.op-catalogo-banner .op-ttlo span { min-height : 100%; height : auto; font : 1.7rem/1.9rem Arial, sans-serif; font-weight: bold; color : #777; margin : 0; }
.op-catalogo-banner .op-sttl { min-height : 2rem; height : auto; font : 1.9rem/2.5rem Arial, sans-serif; color : #ff6600; margin : 0; padding-left: 2rem; padding-right: 2rem; padding-top: 2rem; padding-bottom: 3rem; }
.op-catalogo-banner .op-sttl span { min-height : 1rem; height : auto; font : 1.3rem/2.5rem Arial, sans-serif; font-weight: normal; color : #777; margin-left : 10px; margin-right : 10px; text-decoration: line-through; }
.op-catalogo-banner .op-desc { height : auto; font : 1.6rem/2.0rem Arial, sans-serif; color : #333; background-color: transparent; margin : 0; padding-left: 2rem; padding-right: 2rem; padding-top: 1rem; padding-bottom: 1rem; display: block; }
.op-catalogo-banner .op-mass { height : 2.5rem; font : 1.4rem/2.0rem Arial, sans-serif; color : #888; background-color: transparent; margin : 0; padding : 0.2rem 2rem; text-align: right; outline: 0px solid #f50;}
.op-catalogo-banner .op-mass a { color : #666; text-decoration: none; text-shadow: 1px 1px 0 rgba(250,250,250,.75);}
.op-catalogo-banner .op-mass a:hover { color : #444; border-bottom: 1px dashed #444; box-sizing: border-box; }
/* ------------------------------------------------------------------------- */
/* CSS - SECCION DETALLE */
/* ------------------------------------------------------------------------- */
.op-catalogo-detalle {
background-color: #F9F9F9;
background-image: url("../imgs/textura-mapa.jpg");
padding-top: 30px;
padding-bottom: 50px;
border-bottom: 1px solid #e5e5e5;
}
.op-catalogo-detalle .container-fluid {
margin: 0;
padding: 0;
}
.op-catalogo-detalle .op-container-hover {
position: relative;
margin-top: -400px;
}
.op-catalogo-detalle .op-ttlo-detalle-1 {
background-color: rgba(30,144,235,0.9);
outline : 1px solid rgba(30,144,235,0.9);
color : #fff;
padding : 6px 10px;
}
@media (max-width: 991px) {
.op-catalogo-detalle .op-ttlo-detalle-1 {
margin-bottom: 0;
padding-bottom: 10px;
position: relative;
top: 4px;
}
}
@media (max-width: 768px) {
.op-catalogo-detalle .op-ttlo-detalle-1 {
margin-bottom: 0;
padding-bottom: 10px;
position: relative;
top: 6px;
}
}
.op-catalogo-detalle .op-fondo-1 {
background-color: rgba(30,144,235,0.7);
outline : 1px solid (30,144,235,0.7);
}
.op-catalogo-detalle .op-fondo-2 {
background-color: rgba(245,245,245,1);
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ededed+0,f6f6f6+53,ffffff+100 */
background: #ededed; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VkZWRlZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUzJSIgc3RvcC1jb2xvcj0iI2Y2ZjZmNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #ededed 0%, #f6f6f6 53%, #ffffff 100%); /* FF3.6-15 */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ededed), color-stop(53%,#f6f6f6), color-stop(100%,#ffffff)); /* Chrome4-9,Safari4-5 */
background: -webkit-linear-gradient(top, #ededed 0%,#f6f6f6 53%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
background: -o-linear-gradient(top, #ededed 0%,#f6f6f6 53%,#ffffff 100%); /* Opera 11.10-11.50 */
background: -ms-linear-gradient(top, #ededed 0%,#f6f6f6 53%,#ffffff 100%); /* IE10 preview */
background: linear-gradient(to bottom, #ededed 0%,#f6f6f6 53%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#ffffff',GradientType=0 ); /* IE6-8 */
outline: 0px solid #e1e1e1;
z-index:2;
padding: 40px 70px;
/* ???CHF - REVISAR ESTAS DEFINICIONES EN DURO */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
font-family : 'Josefin Sans', verdana, sans-serif;
/*
font-size : 2rem;
line-height : 2.2rem;
*/
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
/* ???CHF - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - REVISAR - */
}
.op-catalogo-detalle .op-attl { min-height : 1rem; height : auto; font : 1.5rem/1.3rem Arial, sans-serif; color : #ff6600; margin : 0; padding-left: 2rem; padding-right: 2rem; padding-top: 1rem; padding-bottom: 1rem; }
.op-catalogo-detalle .op-ttlo { min-height : 100%; height : auto; font : 2.5rem/3.0rem Arial, sans-serif; font-weight: bold; color : #111; margin : 0; padding-left: 2rem; padding-right: 2rem; padding-top: 1rem; padding-bottom: 1rem; display: inline-block; }
.op-catalogo-detalle .op-ttlo span { min-height : 100%; height : auto; font : 1.7rem/1.9rem Arial, sans-serif; font-weight: bold; color : #777; margin : 0; }
.op-catalogo-detalle .op-sttl { min-height : 2rem; height : auto; font : 1.9rem/2.5rem Arial, sans-serif; color : #ff6600; margin : 0; padding-left: 2rem; padding-right: 2rem; padding-top: 2rem; padding-bottom: 3rem; }
.op-catalogo-detalle .op-sttl span { min-height : 1rem; height : auto; font : 1.3rem/2.5rem Arial, sans-serif; font-weight: normal; color : #777; margin-left : 10px; margin-right : 10px; text-decoration: line-through; }
.op-catalogo-detalle .op-desc { min-height : 2rem; height : auto; font : 1.6rem/2.0rem Arial, sans-serif; color : #333; background-color: transparent; margin : 0; padding-left: 2rem; padding-right: 2rem; padding-top: 1rem; padding-bottom: 1rem; display: block; }
.op-catalogo-detalle .op-mass { min-height : 1rem; height : 2.5rem; font : 1.4rem/2.0rem Arial, sans-serif; color : #888; background-color: transparent; margin : 0; padding : 0.2rem 2rem; text-align: right; outline: 0px solid #f50;}
.op-catalogo-detalle .op-mass a { color : #666; text-decoration: none; text-shadow: 1px 1px 0 rgba(250,250,250,.75);}
.op-catalogo-detalle .op-mass a:hover { color : #444; border-bottom: 1px dashed #444; box-sizing: border-box; }
/* ------------------------------------------------------------------------- */
/* CSS - SECCION TESTIMONIOS */
/* ------------------------------------------------------------------------- */
/*
main_background_v5.png
parallax-background.jpg
*/
.op-catalogo-testimonios {
color : #222;
background-color : #EEE;
background-image : url("../imgs/parallax-background.jpg");
background-repeat : no-repeat;
background-position : center top;
padding-top : 30px;
padding-bottom : 50px;
border-bottom : 0px solid #e5e5e5;
height: auto;
}
.op-catalogo-testimonios .op-catalogo-testimonios-fondo-1 {
padding-left : 2rem;
padding-right : 2rem;
margin-top : 2rem;
padding-bottom : 5rem;
background-color : #FDFDFD;
}
/* ------------------------------------------------------------------------- */
/* CSS - SECCION ITINERARIOS */
/* ------------------------------------------------------------------------- */
/*
main_background_v5.png
parallax-background.jpg
*/
.op-catalogo-itinerarios {
color : #222;
background-color : #F0F0F0;
background-image : url("../imgs/textura-mapa.jpg");
background-repeat : repeat;
background-position : center top;
padding-top : 30px;
padding-bottom : 20px;
border-bottom : 0px solid #e5e5e5;
height: auto;
}
.op-catalogo-itinerarios .op-catalogo-itinerarios-fondo-1 {
padding-left : 2rem;
padding-right : 2rem;
margin-top : 2rem;
padding-bottom : 5rem;
background-color : #FFF;
}
/* ------------------------------------------------------------------------- */
/* CSS - FONT SECCION ITINERARIOS */
/* ------------------------------------------------------------------------- */
.op-catalogo-itinerarios h1, h2, h3, h4 {
font-family: 'Perpetua', sans-serif !important;
}
.op-catalogo-itinerarios h1 { font-size: 4.0rem !important; text-transform: uppercase; }
.op-catalogo-itinerarios h2 { font-size: 3.5rem !important; text-transform: uppercase; }
.op-catalogo-itinerarios h3 { font-size: 3.0rem !important; text-transform: uppercase; }
.op-catalogo-itinerarios h4 { font-size: 2.4rem !important; text-transform: uppercase; }
.op-catalogo-itinerarios .panel-body {
font-family: 'Calibri', sans-serif !important;
}
/* ------------------------------------------------------------------------- */
/* CSS - FONT SECCION TARIFAS */
/* ------------------------------------------------------------------------- */
.op-catalogo-tarifas h1, h2, h3, h4 {
font-family: 'Perpetua', sans-serif !important;
}
.op-catalogo-tarifas h1 { font-size: 4.0rem !important; text-transform: uppercase; }
.op-catalogo-tarifas h2 { font-size: 3.5rem !important; text-transform: uppercase; }
.op-catalogo-tarifas h3 { font-size: 3.0rem !important; text-transform: uppercase; }
.op-catalogo-tarifas h4 { font-size: 2.4rem !important; text-transform: uppercase; }
.op-catalogo-tarifas .panel-body {
font-family: 'Calibri', sans-serif !important;
}
/* ------------------------------------------------------------------------- */
/* CSS - FONT SECCION PREGUNTAS FRECUENTES */
/* ------------------------------------------------------------------------- */
.op-catalogo-preguntas-frecuentes h1, h2, h3, h4 {
font-family: 'Perpetua', sans-serif !important;
}
.op-catalogo-preguntas-frecuentes h1 { font-size: 4.0rem !important; text-transform: none; }
.op-catalogo-preguntas-frecuentes h2 { font-size: 3.5rem !important; text-transform: none; }
.op-catalogo-preguntas-frecuentes h3 { font-size: 3.0rem !important; text-transform: none; }
.op-catalogo-preguntas-frecuentes h4 { font-size: 1.9rem !important; text-transform: none; }
.op-catalogo-preguntas-frecuentes .panel-body {
font-family: 'Calibri', sans-serif !important;
}
/* ------------------------------------------------------------------------- */
/* CSS - SECCION TARIFAS */
/* ------------------------------------------------------------------------- */
/*
main_background_v5.png
parallax-background.jpg
*/
.op-catalogo-tarifas {
color : #222;
background-color : #F0F0F0;
background-image : url("../imgs/textura-mapa.jpg");
background-repeat : repeat;
background-position : center top;
padding-top : 20px;
padding-bottom : 50px;
border-bottom : 0px solid #e5e5e5;
height: auto;
}
.op-catalogo-tarifas .op-catalogo-tarifas-fondo-1 {
padding-left : 2rem;
padding-right : 2rem;
margin-top : 2rem;
padding-bottom : 5rem;
background-color : #FFF;
}
.op-catalogo-tarifas table th { border: 1px solid #EEE; padding: 8px; }
.op-catalogo-tarifas table td { border: 1px solid #EEE; padding: 5px; }
/* ------------------------------------------------------------------------- */
/* CSS - SECCION FORMULARIO */
/* ------------------------------------------------------------------------- */
.op-catalogo-formulario {
color : #222;
background-color : #EEE;
background-image : url("../imgs/bk-alendario.jpg");
background-repeat : no-repeat;
background-position : center top;
padding-top : 30px;
padding-bottom : 50px;
border-bottom : 0px solid #e5e5e5;
height: auto;
}
.op-catalogo-formulario .op-catalogo-formulario-fondo-1 {
padding-left : 2rem;
padding-right : 2rem;
margin-top : 2rem;
padding-bottom : 5rem;
background-color : #FDFDFD;
}
/* ------------------------------------------------------------------------- */
/* CSS - SECCION MAPA */
/* ------------------------------------------------------------------------- */
.op-catalogo-mapa {
margin-top: 0px;
margin-bottom: 0px;
border-bottom: 4px solid #e5e5e5;
background-color: #fff;
}
.op-catalogo-mapa img {
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
border-bottom: 4px solid #e5e5e5;
max-height: 400px;
width: auto !important;
position: relative;
display: block;
}
.op-catalogo-mapa .op-mapa {
outline: 0px solid #f50;
width: 100%;
height: 500px;
display: block;
}
/* ------------------------------------------------------------------------- */
/* CSS - FORMULARIO CONTACTO */
/* ------------------------------------------------------------------------- */
.op-catalogo-formulario-contacto h3 {
font-family: 'Perpetua', sans-serif !important;
font-size: 2.0rem;
padding: 0;
margin: 5px 0 0 0;
text-align: left;
color: #AAA;
text-transform: uppercase;
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
}
/* ------------------------------------------------------------------------- */
/* CSS - PREGUNTAS FRECUENTES */
/* ------------------------------------------------------------------------- */
.op-catalogo-preguntas-frecuentes {
background-color: #DDD;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#eeeeee+0,cccccc+100;Gren+3D */
background: #FFF; /* Old browsers */
margin: 0px;
padding: 0;
padding-bottom: 50px;
}
.op-catalogo-preguntas-frecuentes .panel-group {
margin-bottom: 10px;
}
.op-catalogo-preguntas-frecuentes .panel {
margin-bottom: 5px;
background-color: transparent;
border: 1px solid transparent;
border-radius: 0px;
-webkit-box-shadow: 0 0px 0px rgba(0, 0, 0, .05);
box-shadow: 0 0px 0px rgba(0, 0, 0, .05);
}
.op-catalogo-preguntas-frecuentes .panel-group .panel-heading + .panel-collapse > .panel-body,
.op-catalogo-preguntas-frecuentes .panel-group .panel-heading + .panel-collapse > .list-group {
border-top: 0px solid #CCC;
}
.op-catalogo-preguntas-frecuentes .panel-default {
padding-top: 0px;
border-color: transparent;
border-bottom: 1px solid #CCC;
padding-top: 1rem;
padding-bottom: 1rem;
}
.op-catalogo-preguntas-frecuentes .panel-default > .panel-heading {
color: #444;
font-weight: bold;
background-color: transparent;
border-color: none;
}
.op-catalogo-preguntas-frecuentes .panel-default > .panel-heading a {
text-decoration: none;
font-weight: bold;
/*text-transform: uppercase;*/
}
.op-catalogo-preguntas-frecuentes .panel-default > .panel-heading a:hover {
border-bottom: 1px dashed #333;
}
.op-catalogo-preguntas-frecuentes .panel-default > .panel-heading + .panel-collapse > .panel-body {
border-top-color: #f50;
}
.op-catalogo-preguntas-frecuentes .panel-default > .panel-heading .badge {
color: #f5f5f5;
background-color: #333;
}
.op-catalogo-preguntas-frecuentes .panel-default > .panel-footer + .panel-collapse > .panel-body {
border-bottom-color: none;
}
.op-form-pasajeros .panel-default > .panel-heading.color-azul-1 {
color: #FFF;
font-weight: bold;
background-color: #1E90FF;
border-color: none;
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* Arrow Navigation Style */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/*
*/
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
/*--------------------*/
/* Circle pop */
/*--------------------*/
.color-3 { background: #cc6055; }
.op-nav-circle-1 a {
margin: 0 30px;
width: 50px;
height: 50px;
}
.op-nav-circle-1 a::before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 50%;
background: #fff;
content: '';
opacity: 0;
-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
transition: transform 0.3s, opacity 0.3s;
-webkit-transform: scale(0.9);
transform: scale(0.9);
}
.op-nav-circle-1 .icon-wrap {
position: relative;
display: block;
margin: 10% 0 0 10%;
width: 80%;
height: 80%;
}
.op-nav-circle-1 a.next .icon-wrap {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
.op-nav-circle-1 .icon-wrap::before,
.op-nav-circle-1 .icon-wrap::after {
position: absolute;
left: 25%;
width: 3px;
height: 50%;
background: #fff;
content: '';
-webkit-transition: -webkit-transform 0.3s, background-color 0.3s;
transition: transform 0.3s, background-color 0.3s;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.op-nav-circle-1 .icon-wrap::before {
-webkit-transform: translateX(-50%) rotate(30deg);
transform: translateX(-50%) rotate(30deg);
-webkit-transform-origin: 0 100%;
transform-origin: 0 100%;
}
.op-nav-circle-1 .icon-wrap::after {
top: 50%;
-webkit-transform: translateX(-50%) rotate(-30deg);
transform: translateX(-50%) rotate(-30deg);
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
}
.op-nav-circle-1 a:hover::before {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
.op-nav-circle-1 a:hover .icon-wrap::before,
.op-nav-circle-1 a:hover .icon-wrap::after {
background: #cc6055;
}
.op-nav-circle-1 a:hover .icon-wrap::before {
-webkit-transform: translateX(-50%) rotate(45deg);
transform: translateX(-50%) rotate(45deg);
}
.op-nav-circle-1 a:hover .icon-wrap::after {
-webkit-transform: translateX(-50%) rotate(-45deg);
transform: translateX(-50%) rotate(-45deg);
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* Arrow Navigation Style */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/*
*/
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
/* General button style (reset) */
.op-btn-ecom-1 {
width: calc(100% - 40px);
border: none;
font-size: inherit;
color: inherit;
background: none;
cursor: pointer;
padding: 20px 80px;
display: inline-block;
margin: 10px 20px;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: 700;
outline: none;
position: relative;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
-webkit-border-radius: 50px;
-moz-border-radius; 50px;
border-radius: 50px;
}
.op-btn-ecom-1:after {
content: '';
position: absolute;
z-index: -1;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
/* Pseudo elements for icons */
.op-btn-ecom-1:before {
speak: none;
font-family: 'Glyphicons Halflings';
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
position: relative;
-webkit-font-smoothing: antialiased;
-webkit-border-radius: 50px 0px 0px 50px;
border-radius: 50px 0px 0px 50px;
}
/* General button style (reset) */
.op-btn-ecom-2 {
width: auto;
padding-left: 40px;
padding-right: 40px;
padding-top: 15px;
padding-bottom: 15px;
margin-top: 10px;
margin-right: 20px;
margin-bottom: 10px;
margin-left: 20px;
border: 1px solid #fff;
font-size: inherit;
color: inherit;
background: none;
cursor: pointer;
display: inline-block;
letter-spacing: 1px;
font-weight: 700;
outline: none;
position: relative;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
-webkit-border-radius: 50px;
-moz-border-radius; 50px;
border-radius: 50px;
}
.op-btn-ecom-2:after {
content: '';
position: absolute;
z-index: -1;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
/* Pseudo elements for icons */
.op-btn-ecom-2:before {
speak: none;
font-family: 'Glyphicons Halflings';
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
position: relative;
-webkit-font-smoothing: antialiased;
-webkit-border-radius: 10px 0px 0px 50px;
border-radius: 10px 0px 0px 50px;
}
/* Button 3 */
.op-btn-color-1,
.op-btn-color-1 a {
background-color: rgb(255,255,255);
background-color: rgba(255,255,255,0.2);
color: #fff;
text-decoration: none;
}
.op-btn-color-1:hover,
.op-btn-color-1:hover a {
background-color: rgb(30,144,255);
background-color: rgba(30,144,255,0.7);
text-decoration: none;
color: #fff;
}
.op-btn-color-1:active,
.op-btn-color-1:active a {
background-color: #f58500;
color: #fff;
top: 2px;
}
.op-btn-color-1:before,
.op-btn-color-1:before a {
position: absolute;
height: 100%;
left: 0;
top: 0;
line-height: 3;
font-size: 140%;
width: 60px;
}
/* Button 3a */
.op-btn-color-1a {
padding: 20px 60px 20px 120px;
}
.op-btn-color-1a:before {
background: rgba(0,0,0,0.05);
}
/* Button 3e */
.op-btn-color-1e {
padding: 25px 120px 25px 60px;
overflow: hidden;
}
.op-btn-color-1e:before {
left: auto;
right: 10px;
z-index: 2;
}
.op-btn-color-1e:after {
width: 30%;
height: 200%;
background: rgba(255,255,255,0.1);
z-index: 1;
right: 0;
top: 0;
margin: -5px 0 0 -5px;
-webkit-transform-origin: 0 0;
-webkit-transform: rotate(-20deg);
-moz-transform-origin: 0 0;
-moz-transform: rotate(-20deg);
-ms-transform-origin: 0 0;
-ms-transform: rotate(-20deg);
transform-origin: 0 0;
transform: rotate(-20deg);
}
.op-btn-color-1e:hover:after {
width: 40%;
}
/* Button 4 */
.btn-4 {
-webkit-border-radius: 50px;
border-radius: 50px;
border: 5px solid #DDD;
color: #555;
overflow: hidden;
}
.btn-4:active {
border-color: #FC9026;
color: #FFF;
}
.btn-4:hover {
border-color: #FCAD69;
background: #fcad26;
color: #FFF;
}
.btn-4:before {
position: absolute;
height: 100%;
font-size: 125%;
line-height: 3.5;
color: #fff;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.btn-4:active:before {
color: #17954c;
}
/* Button 4a */
.btn-4a:before {
left: 130%;
top: 0;
}
.btn-4a:hover:before {
left: 80%;
}
/* Button 4b */
.btn-4b:before {
left: -50%;
top: 0;
}
.btn-4b:hover:before {
left: 10%;
}
/* Button 4c */
.btn-4c:before {
left: 70%;
opacity: 0;
top: 0;
}
.btn-4c:hover:before {
left: 80%;
opacity: 1;
}
/* Button 4d */
.btn-4d:before {
left: 30%;
opacity: 0;
top: 0;
}
.btn-4d:hover:before {
left: 10%;
opacity: 1;
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* BOTONES PERSONALIZADOS */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* TABLA MODELO 1 */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/*
<table class="table-fill">
<thead>
<tr>
<th class="text-left">Month</th>
<th class="text-left">Sales</th>
</tr>
</thead>
<tbody class="table-hover">
<tr>
<td class="text-left">January</td>
<td class="text-left">$ 50,000.00</td>
</tr>
<tr>
<td class="text-left">February</td>
<td class="text-left">$ 10,000.00</td>
</tr>
<tr>
<td class="text-left">March</td>
<td class="text-left">$ 85,000.00</td>
</tr>
<tr>
<td class="text-left">April</td>
<td class="text-left">$ 56,000.00</td>
</tr>
<tr>
<td class="text-left">May</td>
<td class="text-left">$ 98,000.00</td>
</tr>
</tbody>
</table>
*/
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
body {
/*
text-rendering: optimizeLegibility;
*/
}
/*
div.table-title {
display: block;
margin: auto;
max-width: 600px;
padding:5px;
width: 100%;
}
*/
/*
.table-title h3 {
color: #fafafa;
font-size: 30px;
font-weight: 400;
font-style:normal;
font-family: "Roboto", helvetica, arial, sans-serif;
text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.1);
text-transform:uppercase;
}
*/
/*** Table Styles **/
.table-fill {
background: white;
border-radius:3px;
border-collapse: collapse;
height: 320px;
margin: auto;
max-width: 600px;
padding:5px;
width: 100%;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
animation: float 5s infinite;
}
.table-fill th {
color:#D5DDE5;;
background:#1b1e24;
border-bottom:4px solid #9ea7af;
border-right: 1px solid #343a45;
font-size:23px;
font-weight: 100;
padding:24px;
text-align:left;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
vertical-align:middle;
}
.table-fill th:first-child {
border-top-left-radius:3px;
}
.table-fill th:last-child {
border-top-right-radius:3px;
border-right:none;
}
.table-fill tr {
border-top: 1px solid #C1C3D1;
border-bottom-: 1px solid #C1C3D1;
color:#666B85;
font-size:16px;
font-weight:normal;
text-shadow: 0 1px 1px rgba(256, 256, 256, 0.1);
}
.table-fill tr:hover td {
background:#4E5066;
color:#FFFFFF;
border-top: 1px solid #22262e;
border-bottom: 1px solid #22262e;
}
.table-fill tr:first-child {
border-top:none;
}
.table-fill tr:last-child {
border-bottom:none;
}
.table-fill tr:nth-child(odd) td {
background:#EBEBEB;
}
.table-fill tr:nth-child(odd):hover td {
background:#4E5066;
}
.table-fill tr:last-child td:first-child {
border-bottom-left-radius:3px;
}
.table-fill tr:last-child td:last-child {
border-bottom-right-radius:3px;
}
.table-fill td {
background:#FFFFFF;
padding:20px;
text-align:left;
vertical-align:middle;
font-weight:300;
font-size:18px;
text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.1);
border-right: 1px solid #C1C3D1;
}
.table-fill td:last-child {
border-right: 0px;
}
.table-fill th.text-left {
text-align: left;
}
.table-fill th.text-center {
text-align: center;
}
.table-fill th.text-right {
text-align: right;
}
.table-fill td.text-left {
text-align: left;
}
.table-fill td.text-center {
text-align: center;
}
.table-fill td.text-right {
text-align: right;
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ACORDEON */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/*
*/
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
.op-back-to-top {
background: rgb(249,198,103);
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y5YzY2NyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmNzk2MjEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(left, rgba(249,198,103,1) 0%, rgba(247,150,33,1) 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(249,198,103,1)), color-stop(100%,rgba(247,150,33,1)));
background: -webkit-linear-gradient(left, rgba(249,198,103,1) 0%,rgba(247,150,33,1) 100%);
background: -o-linear-gradient(left, rgba(249,198,103,1) 0%,rgba(247,150,33,1) 100%);
background: -ms-linear-gradient(left, rgba(249,198,103,1) 0%,rgba(247,150,33,1) 100%);
background: linear-gradient(to right, rgba(249,198,103,1) 0%,rgba(247,150,33,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9c667', endColorstr='#f79621',GradientType=1 );
-webkit-border-radius : 100px 100px 100px 100px; /* -- WebKit y Safari -- */
-moz-border-radius : 100px 100px 100px 100px; /* -- Mozilla -- */
border-radius : 100px 100px 100px 100px; /* -- W3C Specification -- */
border: 5px solid #fff;
z-index: 100;
}
.op-back-to-top.affix-top {
position: absolute; /* allows it to "slide" up into view */
bottom: -82px;
right: 5rem;
}
.op-back-to-top.affix {
position: fixed; /* keeps it on the bottom once in view */
bottom: 60px;
right: 5rem;
}
.op-back-to-top a {
position: relative;
top: 10px;
font-size: 2rem;
width: 50px !important;
height: 50px;
display: block;
text-decoration: none;
color: #FFF;
}
.op-back-to-top a:hover {
}
@media (max-width: 1200px) {
.op-back-to-top.affix-top {
position: absolute; /* allows it to "slide" up into view */
bottom: -82px;
right: 4rem;
}
.op-back-to-top.affix {
position: fixed; /* keeps it on the bottom once in view */
bottom: 18px;
right: 4rem;
}
}
@media (max-width: 991px) {
.op-back-to-top.affix-top {
position: absolute; /* allows it to "slide" up into view */
bottom: -82px;
right: 2rem;
}
.op-back-to-top.affix {
position: fixed; /* keeps it on the bottom once in view */
bottom: 18px;
right: 2rem;
}
}
@media (max-width: 768px) {
.op-back-to-top {
-webkit-border-radius : 10px 0px 0px 10px; /* -- WebKit y Safari -- */
-moz-border-radius : 10px 0px 0px 10px; /* -- Mozilla -- */
border-radius : 10px 0px 0px 10px; /* -- W3C Specification -- */
border: 2px solid #fff;
z-index: 100;
}
.op-back-to-top.affix-top {
position: absolute; /* allows it to "slide" up into view */
bottom: -82px;
right: 0px;
}
.op-back-to-top.affix {
position: fixed; /* keeps it on the bottom once in view */
bottom: 18px;
right: 0px;
}
.op-back-to-top a {
position: relative;
top: 5px;
font-size: 1.5rem;
width: 30px !important;
height: 30px;
}
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/*
*/
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
.op-menu-scrollspy-nav-page {
width: 150px;
left: 3px;
/* background: rgba(30,144,235,0.9); */ /* COLOR 1 - AZUL - */
background: rgba(191,191,191,0.9); /* COLOR 1 - GRIS - */
padding-top: 5px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
border: 10px solid #fff;
z-index: 100;
-webkit-border-radius : 5px !important; /* -- WebKit y Safari -- */
-moz-border-radius : 5px !important; /* -- Mozilla -- */
border-radius : 5px !important; /* -- W3C Specification -- */
-webkit-transition : width .3s ease-out;
-moz-transition : width .3s ease-out;
-o-transition : width .3s ease-out;
transition : width .3s ease-out;
}
.op-menu-scrollspy-nav-page.affix-top {
position: absolute; /* allows it to "slide" up into view */
top: 30%;
right: 5rem;
}
.op-menu-scrollspy-nav-page.affix {
position: fixed; /* keeps it on the bottom once in view */
top: 30%;
right: 5rem;
}
.op-menu-scrollspy-nav-page a {
position: relative;
top: 0px;
font-size: 1.3rem;
width: auto !important;
height: auto;
display: block;
text-decoration: none;
color: #FFF;
-webkit-border-radius : 0px !important; /* -- WebKit y Safari -- */
-moz-border-radius : 0px !important; /* -- Mozilla -- */
border-radius : 0px !important; /* -- W3C Specification -- */
}
.op-menu-scrollspy-nav-page a:hover {
text-decoration: none;
color: #444;
}
.nav-pills>li.active>a,
.nav-pills>li.active>a:focus,
.nav-pills>li.active>a:hover {
color: #fff;
background-color: #888;
}
@media (max-width: 1320px) {
.op-menu-scrollspy-nav-page {
width: 40px;
left: 3px;
border: 5px solid #fff;
padding-top: 0px;
padding-right: 1px;
padding-bottom: 1px;
padding-left: 1px;
margin: 0;
-webkit-border-radius : 100px !important; /* -- WebKit y Safari -- */
-moz-border-radius : 100px !important; /* -- Mozilla -- */
border-radius : 100px !important; /* -- W3C Specification -- */
-webkit-transition : width .2s ease-out;
-moz-transition : width .2s ease-out;
-o-transition : width .2s ease-out;
transition : width .2s ease-out;
}
.op-menu-scrollspy-nav-page a {
font-size: 0rem;
margin: 0;
padding: 0;
}
.op-menu-scrollspy-nav-page a:hover {
color: #444;
background-color: rgba(250,250,250,.4) !important;
-webkit-border-radius : 100px !important; /* -- WebKit y Safari -- */
-moz-border-radius : 100px !important; /* -- Mozilla -- */
border-radius : 100px !important; /* -- W3C Specification -- */
}
.op-menu-scrollspy-nav-page .nav-pills>li.active>a,
.op-menu-scrollspy-nav-page .nav-pills>li.active>a:focus,
.op-menu-scrollspy-nav-page .nav-pills>li.active>a:hover {
text-align: center;
color: #fff;
background-color: #666;
-webkit-border-radius : 100px !important; /* -- WebKit y Safari -- */
-moz-border-radius : 100px !important; /* -- Mozilla -- */
border-radius : 100px !important; /* -- W3C Specification -- */
}
.op-menu-scrollspy-nav-page .nav>li>a {
padding: 5px 10px;
}
.op-menu-scrollspy-nav-page a:focus,
.op-menu-scrollspy-nav-page a:active,
.op-menu-scrollspy-nav-page .nav.nav-pills li.active {
color: #444 !important;
background-color: rgba(160,160,160,.9) !important;
-webkit-border-radius : 100px !important; /* -- WebKit y Safari -- */
-moz-border-radius : 100px !important; /* -- Mozilla -- */
border-radius : 100px !important; /* -- W3C Specification -- */
}
.op-menu-scrollspy-nav-page a:after {
content: attr(data-number);
color: #FFF;
font-size: 1.3rem;
}
}
@media (max-width: 768px) {
.op-menu-scrollspy-nav-page {
display: none;
z-index: 100;
-webkit-animation: width .3s; /* Safari and Chrome */
-moz-animation: width .3s; /* Firefox */
-ms-animation: width .3s; /* Internet Explorer */
-o-animation: width .3s; /* Opera */
animation: width .3s;
}
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
.op-menu-scrollspy-nav-page-azul {
width: 150px;
left: 3px;
background: rgba(30,144,235,0.9); /* COLOR 1 - AZUL - */
padding-top: 5px;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
border: 10px solid #fff;
z-index: 100;
-webkit-border-radius : 5px !important; /* -- WebKit y Safari -- */
-moz-border-radius : 5px !important; /* -- Mozilla -- */
border-radius : 5px !important; /* -- W3C Specification -- */
-webkit-transition : width .3s ease-out;
-moz-transition : width .3s ease-out;
-o-transition : width .3s ease-out;
transition : width .3s ease-out;
}
.op-menu-scrollspy-nav-page-azul.affix-top {
position: absolute; /* allows it to "slide" up into view */
top: 30%;
right: 5rem;
}
.op-menu-scrollspy-nav-page-azul.affix {
position: fixed; /* keeps it on the bottom once in view */
top: 30%;
right: 5rem;
}
.op-menu-scrollspy-nav-page-azul a {
position: relative;
top: 0px;
font-size: 1.3rem;
width: auto !important;
height: auto;
display: block;
text-decoration: none;
color: #FFF;
-webkit-border-radius : 0px !important; /* -- WebKit y Safari -- */
-moz-border-radius : 0px !important; /* -- Mozilla -- */
border-radius : 0px !important; /* -- W3C Specification -- */
}
.op-menu-scrollspy-nav-page-azul a:hover {
text-decoration: none;
color: #444;
}
@media (max-width: 1320px) {
.op-menu-scrollspy-nav-page-azul {
width: 40px;
left: 3px;
border: 5px solid #fff;
padding-top: 0px;
padding-right: 1px;
padding-bottom: 1px;
padding-left: 1px;
margin: 0;
-webkit-border-radius : 100px !important; /* -- WebKit y Safari -- */
-moz-border-radius : 100px !important; /* -- Mozilla -- */
border-radius : 100px !important; /* -- W3C Specification -- */
-webkit-transition : width .2s ease-out;
-moz-transition : width .2s ease-out;
-o-transition : width .2s ease-out;
transition : width .2s ease-out;
}
.op-menu-scrollspy-nav-page-azul a {
font-size: 0rem;
margin: 0;
padding: 0;
}
.op-menu-scrollspy-nav-page-azul a:hover {
color: #444;
background-color: rgba(250,250,250,.4) !important;
-webkit-border-radius : 100px !important; /* -- WebKit y Safari -- */
-moz-border-radius : 100px !important; /* -- Mozilla -- */
border-radius : 100px !important; /* -- W3C Specification -- */
}
.op-menu-scrollspy-nav-page-azul .nav-pills>li.active>a,
.op-menu-scrollspy-nav-page-azul .nav-pills>li.active>a:focus,
.op-menu-scrollspy-nav-page-azul .nav-pills>li.active>a:hover {
text-align: center;
color: #fff;
background-color: #337ab7;
-webkit-border-radius : 100px !important; /* -- WebKit y Safari -- */
-moz-border-radius : 100px !important; /* -- Mozilla -- */
border-radius : 100px !important; /* -- W3C Specification -- */
}
.op-menu-scrollspy-nav-page-azul .nav>li>a {
padding: 5px 10px;
}
.op-menu-scrollspy-nav-page-azul a:focus,
.op-menu-scrollspy-nav-page-azul a:active,
.op-menu-scrollspy-nav-page-azul .nav.nav-pills li.active {
color: #444 !important;
background-color: rgba(250,250,250,.4) !important;
-webkit-border-radius : 100px !important; /* -- WebKit y Safari -- */
-moz-border-radius : 100px !important; /* -- Mozilla -- */
border-radius : 100px !important; /* -- W3C Specification -- */
}
.op-menu-scrollspy-nav-page-azul a:after {
content: attr(data-number);
color: #FFF;
font-size: 1.3rem;
}
}
@media (max-width: 768px) {
.op-menu-scrollspy-nav-page-azul {
display: none;
z-index: 100;
-webkit-animation: width .3s; /* Safari and Chrome */
-moz-animation: width .3s; /* Firefox */
-ms-animation: width .3s; /* Internet Explorer */
-o-animation: width .3s; /* Opera */
animation: width .3s;
}
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* HTML */
/* ------------------------------------------------------------------------- */
/*
*/
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
.op-add-tickets { list-style: none; width: 100px; height: 100%; display: block; outline: 0px solid #f50; padding-left: 0; margin-left: 0;}
.op-add-tickets a { text-decoration: none; color: #666; }
.op-add-tickets a:hover,
.op-add-tickets a:focus { text-decoration: none; color: #FFF; border-color: #222; background-color: #555; }
.op-add-tickets li { float: right; }
.op-add-tickets .op-input-cant { width: 40px; height: 35px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; border: 1px solid #DDD; text-align: center; line-height: 22px; margin-right: 5px;}
.op-add-tickets .op-btn-right { width: 25px; height: 25px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; border: 1px solid #DDD; text-align: center; line-height: 23px; display: block; position: relative; top: 5px; }
.op-add-tickets .op-btn-left { width: 25px; height: 25px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; border: 1px solid #DDD; text-align: center; line-height: 23px; display: block; position: relative; top: 5px; }
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
table.op-table-tickets td { line-height: 20px; min-height: 40px; height: auto; outline: 0px solid #f50; vertical-align: middle !important; }
table.op-table-tickets td { }
table.op-table-tickets td span { }
table.op-table-tickets td .op-ticket-info-1 { width: 100%; font-size: 1.3rem; font-weight: bold; text-align: left; }
table.op-table-tickets td .op-ticket-info-2 { width: auto; font-size: 1.1rem; font-weight: normal; text-align: left; color: #666; }
table.op-table-tickets td .op-ticket-precio { width: 10rem; font-size: 1.2rem; font-weight: normal; text-align: left; color: #444; position: relative; display: inline; float: left; clear: both; }
table.op-table-tickets td .op-ticket-servicio { width: auto; font-size: 1.2rem; font-weight: normal; text-align: left; color: #666; position: relative; display: inline; float: left; }
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
.op-scroll-spy-1 {
-webkit-opacity: .5;
-moz-opacity: .5;
opacity: .5;
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
-webkit-transition : opacity .7s ease-out;
-moz-transition : opacity .7s ease-out;
-o-transition : opacity .7s ease-out;
transition : opacity .7s ease-out;
}
.op-scroll-spy-1:hover {
-webkit-opacity: .99;
-moz-opacity: .99;
opacity: .99;
-webkit-transition : opacity .7s ease-out;
-moz-transition : opacity .7s ease-out;
-o-transition : opacity .7s ease-out;
transition : opacity .7s ease-out;
}
@media (max-width: 991px) {
.op-scroll-spy-1 {
display: none;
}
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
.op-bolsa-ecom a {
height: 50px;
padding-top: 15px;
padding-right: 10px;
padding-bottom: 15px;
padding-left: 10px;
margin-right: 0px;
}
.op-bolsa-ecom .op-badge {
float: left;
margin-left: 5px;
background-color: #f50;
font-size: 1rem;
}
.op-bolsa-ecomxx span.badge::after {
content: attr(data-qty);
}
@media (max-width: 991px) {
.row.op-reset-margin-row {
padding-right: 0px !important;
padding-left: 0px !important;
margin-right: 0px !important;
margin-left: 0px !important;
}
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ESTILO INPUT FORMULARIO PASAJEROS */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
.input {
position: relative;
z-index: 1;
display: inline-block;
margin: .3rem;
max-width: 350px;
width: calc(100% - 2rem);
vertical-align: top;
}
.input__field {
position: relative;
display: block;
float: right;
padding: 0.8em;
width: 60%;
border: none;
border-radius: 0;
background: #f0f0f0;
color: #f50;
font-weight: bold;
font-size: 1.6rem;
-webkit-appearance: none; /* for box shadows to show on iOS */
}
.input__field:focus {
outline: none;
}
.input__label {
/*
display: inline-block;
*/
float: right;
padding: 0 1em 2rem 0;
width: 40%;
color: #6a7989;
font-weight: bold;
font-size: 1.5rem;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.input__label-content {
position: relative;
display: block;
padding: 1.6em 0;
width: 100%;
}
.input__label-content--size-m {
position: relative;
display: block;
padding: 0.8em 0 !important;
width: 100%;
}
/* Hoshi */
.input--hoshi {
overflow: hidden;
}
.input__field--hoshi {
margin-top: 1.4rem;
padding-top: 0.85em;
padding-right: 0.15em;
padding-bottom: 0.70em;
padding-left: 0.15em;
width: 100%;
background: transparent;
color: #595F6E;
}
.input__field--hoshi.input__field--size-m {
margin-top: 0.90rem;
padding-top: 0.75em;
padding-right: 0.15em;
padding-bottom: 0.30em;
padding-left: 0.15em;
width: 100%;
background: transparent;
color: #4169E1;
}
.input__label--hoshi {
position: absolute;
bottom: 0;
left: 0;
padding: 0 0.25em;
width: 100%;
height: calc(100% - 1em);
text-align: left;
pointer-events: none;
}
.input__label-content--hoshi {
position: absolute;
}
.input__label--hoshi::before,
.input__label--hoshi::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: calc(100% - 0px);
padding-bottom: 15px;
border-bottom: 1px solid #B9C1CA;
}
.input__label--hoshi::after {
margin-top: 10px;
border-bottom: 4px solid red;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
-webkit-transition: -webkit-transform 0.3s;
transition: transform 0.3s;
}
.input__label--hoshi-color-1::after {
border-color: hsl(200, 100%, 50%);
}
.input__label--hoshi-color-2::after {
border-color: hsl(160, 100%, 50%);
}
.input__label--hoshi-color-3::after {
border-color: hsl(20, 100%, 50%);
}
.input__field--hoshi:focus + .input__label--hoshi::after,
.input--filled .input__label--hoshi::after {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.input--filled .input__label--hoshi {
color: #888;
font-size: 1.3rem;
}
.input__field--hoshi:focus + .input__label--hoshi .input__label-content--hoshi,
.input--filled .input__label-content--hoshi {
-webkit-animation: anim-1 0.3s forwards;
animation: anim-1 0.3s forwards;
}
@-webkit-keyframes anim-1 {
50% {
opacity: 0;
-webkit-transform: translate3d(2rem, 0, 0);
transform: translate3d(2rem, 0, 0);
}
51% {
opacity: 0;
-webkit-transform: translate3d(-2rem, -40%, 0);
transform: translate3d(-2rem, -40%, 0);
}
100% {
opacity: 1;
-webkit-transform: translate3d(0, -40%, 0);
transform: translate3d(0, -40%, 0);
}
}
@keyframes anim-1 {
50% {
opacity: 0;
-webkit-transform: translate3d(2rem, 0, 0);
transform: translate3d(2rem, 0, 0);
}
51% {
opacity: 0;
-webkit-transform: translate3d(-2rem, -40%, 0);
transform: translate3d(-2rem, -40%, 0);
}
100% {
opacity: 1;
-webkit-transform: translate3d(0, -40%, 0);
transform: translate3d(0, -40%, 0);
}
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ESTILO INPUT FORMULARIO PASAJEROS */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
.op-required-9 {
border: 1px solid #FFB9B0 !important;
background-color: #FFCFBB !important;
}
.op-required-0,
.op-required-1,
.op-required-2,
.op-required-3,
.op-required-4,
.op-required-5,
.op-required-6,
.op-required-7,
.op-required-8 { padding: 1px 2px 1px 2px; margin: 1px 4px 1px 0px; }
.op-required-0 { color: #000000 !important; background: #FFFFFF !important; }
.op-required-1 { color: #FFFFFF !important; background: #4D79FF !important; }
.op-required-2 { color: #FFFFFF !important; background: #AAAAAA !important; }
.op-required-3 { color: #FFFFFF !important; background: #CC0000 !important; }
.op-required-4 { color: #FFFFFF !important; background: #F95602 !important; }
.op-required-5 { color: #FFFFFF !important; background: #000000 !important; }
.op-required-6 { color: #FFFFFF !important; background: #00DAFF !important; }
.op-required-7 { border: 1px solid #F95602 !important; color: #000000 !important; background: #FFECF2 !important; }
.op-required-8 { border: 1px solid #F95602 !important; color: #000000 !important; background: #FFFFFF !important; }
/* ////////////////////////////////////////////////////////////////////////////////////// */
.modal-header h4:after {
content: ' ' attr(data-ttlo) ' ' attr(data-glsa1) ' ' attr(data-pasoactual) ' ' attr(data-glsa2) ' ' attr(data-ttalpasos) ' ';
}
.modal-dialog {
width: auto;
max-width: 1000px;
}
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ESTILO INPUT FORMULARIO PASAJEROS */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ------------------------------------------------------------------------- */
/* CSS */
/* ------------------------------------------------------------------------- */
.op-cale-d1 { /* propiedades de posicionamiento */ position: relative; clear: both; float: left; display: inline-block; height: auto; /* propiedades de tamaño */ }
.op-cale-d1 a { /* propiedades de posicionamiento */ /* propiedades de tamaño */ /* propiedades de tipografÃa */ /* propiedades de visualización */ text-decoration: none; }
.op-cale-d1 a:hover { /* propiedades de posicionamiento */ /* propiedades de tamaño */ /* propiedades de tipografÃa */ /* propiedades de visualización */ }
.op-cale-d1 .op-dia-dd { /* propiedades de posicionamiento */ display: block; width: 100%; height: auto; /* propiedades de tamaño */ }
.op-cale-d1 .op-dia-ddd { /* propiedades de posicionamiento */ display: block; width: 100%; height: auto; /* propiedades de tamaño */ }
.op-cale-d1 .op-mes-ddd { /* propiedades de posicionamiento */ display: block; width: 100%; height: auto; /* propiedades de tamaño */ }
/* COLOR-BLANCO */
/* COLOR-NEGRO */
/* COLOR AZUL */
/* COLOR NARANJO */
/* COLOR ROJO */
/* SIN-COLOR */
.op-cale-d1 { width: 100%; height: auto; }
.op-cale-d1 .op-mes-mm { width: 100%; height: auto; }
.op-cale-d1 .op-dia-dd { width: 100%; height: auto; }
.op-cale-d1 .op-dia-ddd { width: 100%; height: auto; }
.op-cale-d1 .op-ano-aa { width: 100%; height: auto; }
.op-cale-d1 .op-ano-aaaa { width: 100%; height: auto; }
.bg-color-amarillo-0 { background-color: rgb(253,235, 52); } /* amarillo */
.bg-color-amarillo-1 { background-color: rgb(155,143, 28); } /* amarillo */
.bg-color-amarillo-2 { background-color: rgb(191,174, 36); } /* amarillo */
.bg-color-amarillo-3 { background-color: rgb(223,201, 44); } /* amarillo */
.bg-color-amarillo-5 { background-color: rgb(254,239,109); } /* amarillo */
.bg-color-amarillo-6 { background-color: rgb(254,243,157); } /* amarillo */
.bg-color-amarillo-7 { background-color: rgb(255,247,187); } /* amarillo */
.bg-color-amarillo-naranja-0 { background-color: rgb(247,179, 48); } /* amarillo-naranja */
.bg-color-amarillo-naranja-1 { background-color: rgb(140,105, 29); } /* amarillo-naranja */
.bg-color-amarillo-naranja-2 { background-color: rgb(180,130, 36); } /* amarillo-naranja */
.bg-color-amarillo-naranja-3 { background-color: rgb(222,161, 43); } /* amarillo-naranja */
.bg-color-amarillo-naranja-5 { background-color: rgb(250,198, 91); } /* amarillo-naranja */
.bg-color-amarillo-naranja-6 { background-color: rgb(250,213,132); } /* amarillo-naranja */
.bg-color-amarillo-naranja-7 { background-color: rgb(251,225,170); } /* amarillo-naranja */
.bg-color-naranja-0 { background-color: rgb(239,141, 42); } /* naranja */
.bg-color-naranja-1 { background-color: rgb(173, 99, 30); } /* naranja */
.bg-color-naranja-2 { background-color: rgb(177,108, 31); } /* naranja */
.bg-color-naranja-3 { background-color: rgb(209,123, 38); } /* naranja */
.bg-color-naranja-5 { background-color: rgb(242,165, 78); } /* naranja */
.bg-color-naranja-6 { background-color: rgb(247,196,138); } /* naranja */
.bg-color-naranja-7 { background-color: rgb(248,205,156); } /* naranja */
.bg-color-rojo-naranja-0 { background-color: rgb(228, 75, 44); } /* rojo-naranja */
.bg-color-rojo-naranja-1 { background-color: rgb(145, 51, 31); } /* rojo-naranja */
.bg-color-rojo-naranja-2 { background-color: rgb(162, 56, 32); } /* rojo-naranja */
.bg-color-rojo-naranja-3 { background-color: rgb(203, 68, 40); } /* rojo-naranja */
.bg-color-rojo-naranja-5 { background-color: rgb(237,129,106); } /* rojo-naranja */
.bg-color-rojo-naranja-6 { background-color: rgb(243,182,167); } /* rojo-naranja */
.bg-color-rojo-naranja-7 { background-color: rgb(245,189,175); } /* rojo-naranja */
.bg-color-rojo-0 { background-color: rgb(206, 17, 37); } /* rojo */
.bg-color-rojo-1 { background-color: rgb( 91, 15, 15); } /* rojo */
.bg-color-rojo-2 { background-color: rgb(146, 20, 28); } /* rojo */
.bg-color-rojo-3 { background-color: rgb(178, 19, 33); } /* rojo */
.bg-color-rojo-5 { background-color: rgb(226,103,116); } /* rojo */
.bg-color-rojo-6 { background-color: rgb(234,164,171); } /* rojo */
.bg-color-rojo-7 { background-color: rgb(244,199,202); } /* rojo */
.bg-color-rojo-violeta-0 { background-color: rgb(156, 21, 65); } /* rojo-violeta */
.bg-color-rojo-violeta-1 { background-color: rgb( 65, 6, 26); } /* rojo-violeta */
.bg-color-rojo-violeta-2 { background-color: rgb( 97, 14, 40); } /* rojo-violeta */
.bg-color-rojo-violeta-3 { background-color: rgb(121, 18, 50); } /* rojo-violeta */
.bg-color-rojo-violeta-5 { background-color: rgb(182, 84,117); } /* rojo-violeta */
.bg-color-rojo-violeta-6 { background-color: rgb(205,137,162); } /* rojo-violeta */
.bg-color-rojo-violeta-7 { background-color: rgb(221,178,193); } /* rojo-violeta */
.bg-color-violeta-0 { background-color: rgb( 59, 43,117); } /* violeta */
.bg-color-violeta-1 { background-color: rgb( 28, 3, 53); } /* violeta */
.bg-color-violeta-2 { background-color: rgb( 32, 12, 62); } /* violeta */
.bg-color-violeta-3 { background-color: rgb( 52, 36, 83); } /* violeta */
.bg-color-violeta-5 { background-color: rgb(115, 96,161); } /* violeta */
.bg-color-violeta-6 { background-color: rgb(140,123,178); } /* violeta */
.bg-color-violeta-7 { background-color: rgb(172,161,199); } /* violeta */
.bg-color-azul-violeta-0 { background-color: rgb( 71, 86,138); } /* azul-violeta */
.bg-color-azul-violeta-1 { background-color: rgb( 37, 47, 78); } /* azul-violeta */
.bg-color-azul-violeta-2 { background-color: rgb( 48, 58, 97); } /* azul-violeta */
.bg-color-azul-violeta-3 { background-color: rgb( 60, 74,118); } /* azul-violeta */
.bg-color-azul-violeta-5 { background-color: rgb(116,129,167); } /* azul-violeta */
.bg-color-azul-violeta-6 { background-color: rgb(161,168,195); } /* azul-violeta */
.bg-color-azul-violeta-7 { background-color: rgb(188,193,213); } /* azul-violeta */
.bg-color-azul-0 { background-color: rgb( 26, 44,129); } /* azul */
.bg-color-azul-1 { background-color: rgb( 21, 25, 68); } /* azul */
.bg-color-azul-2 { background-color: rgb( 27, 38, 86); } /* azul */
.bg-color-azul-3 { background-color: rgb( 37, 54,111); } /* azul */
.bg-color-azul-5 { background-color: rgb( 73,152,199); } /* azul */
.bg-color-azul-6 { background-color: rgb(165,204,228); } /* azul */
.bg-color-azul-7 { background-color: rgb(218,235,244); } /* azul */
.bg-color-azul-verdoso-0 { background-color: rgb( 21,146,135); } /* azul-verdoso */
.bg-color-azul-verdoso-1 { background-color: rgb( 4, 65, 59); } /* azul-verdoso */
.bg-color-azul-verdoso-2 { background-color: rgb( 8, 89, 83); } /* azul-verdoso */
.bg-color-azul-verdoso-3 { background-color: rgb( 14,114,106); } /* azul-verdoso */
.bg-color-azul-verdoso-5 { background-color: rgb( 73,179,160); } /* azul-verdoso */
.bg-color-azul-verdoso-6 { background-color: rgb(133,206,193); } /* azul-verdoso */
.bg-color-azul-verdoso-7 { background-color: rgb(188,227,222); } /* azul-verdoso */
.bg-color-verde-0 { background-color: rgb( 91,165, 49); } /* verde */
.bg-color-verde-1 { background-color: rgb( 44, 97, 30); } /* verde */
.bg-color-verde-2 { background-color: rgb( 60,120, 38); } /* verde */
.bg-color-verde-3 { background-color: rgb( 75,144, 45); } /* verde */
.bg-color-verde-5 { background-color: rgb(138,192,106); } /* verde */
.bg-color-verde-6 { background-color: rgb(172,210,150); } /* verde */
.bg-color-verde-7 { background-color: rgb(185,216,164); } /* verde */
.bg-color-amarillo-verdoso-0 { background-color: rgb(185,202, 41); } /* amarillo-verdoso */
.bg-color-amarillo-verdoso-1 { background-color: rgb(122,137, 27); } /* amarillo-verdoso */
.bg-color-amarillo-verdoso-2 { background-color: rgb(140,156, 30); } /* amarillo-verdoso */
.bg-color-amarillo-verdoso-3 { background-color: rgb(161,176, 34); } /* amarillo-verdoso */
.bg-color-amarillo-verdoso-5 { background-color: rgb(207,218, 90); } /* amarillo-verdoso */
.bg-color-amarillo-verdoso-6 { background-color: rgb(218,226,125); } /* amarillo-verdoso */
.bg-color-amarillo-verdoso-7 { background-color: rgb(226,233,153); } /* amarillo-verdoso */
.bg-color-blanco-0 { background-color: rgb(225,225,225); } /* amarillo-verdoso */
.bg-color-blanco-1 { background-color: rgb(230,230,230); } /* amarillo-verdoso */
.bg-color-blanco-2 { background-color: rgb(235,235,235); } /* amarillo-verdoso */
.bg-color-blanco-3 { background-color: rgb(240,240,240); } /* amarillo-verdoso */
.bg-color-blanco-5 { background-color: rgb(245,245,245); } /* amarillo-verdoso */
.bg-color-blanco-6 { background-color: rgb(250,250,250); } /* amarillo-verdoso */
.bg-color-blanco-7 { background-color: rgb(255,255,255); } /* amarillo-verdoso */
.bg-color-negro-0 { background-color: #000000; } /* amarillo-verdoso */
.bg-color-negro-1 { background-color: #111111; } /* amarillo-verdoso */
.bg-color-negro-2 { background-color: #222222; } /* amarillo-verdoso */
.bg-color-negro-3 { background-color: #333333; } /* amarillo-verdoso */
.bg-color-negro-5 { background-color: #444444; } /* amarillo-verdoso */
.bg-color-negro-6 { background-color: #555555; } /* amarillo-verdoso */
.bg-color-negro-7 { background-color: #666666; } /* amarillo-verdoso */
.bg-color-blanco-0 { background-color: #FFFFFF; } /* amarillo-verdoso */
.bg-color-blanco-1 { background-color: #F2F2F2; } /* amarillo-verdoso */
.bg-color-blanco-2 { background-color: #F4F4F4; } /* amarillo-verdoso */
.bg-color-blanco-3 { background-color: #F6F6F6; } /* amarillo-verdoso */
.bg-color-blanco-5 { background-color: #F8F8F8; } /* amarillo-verdoso */
.bg-color-blanco-6 { background-color: #FAFAFA; } /* amarillo-verdoso */
.bg-color-blanco-7 { background-color: #FCFCFC; } /* amarillo-verdoso */
.color-negro-0 { color: #000000; } /* amarillo-verdoso */
.color-negro-1 { color: #111111; } /* amarillo-verdoso */
.color-negro-2 { color: #222222; } /* amarillo-verdoso */
.color-negro-3 { color: #333333; } /* amarillo-verdoso */
.color-negro-5 { color: #444444; } /* amarillo-verdoso */
.color-negro-6 { color: #555555; } /* amarillo-verdoso */
.color-negro-7 { color: #666666; } /* amarillo-verdoso */
.color-blanco-0 { color: #FFFFFF; } /* amarillo-verdoso */
.color-blanco-1 { color: #F2F2F2; } /* amarillo-verdoso */
.color-blanco-2 { color: #F4F4F4; } /* amarillo-verdoso */
.color-blanco-3 { color: #F6F6F6; } /* amarillo-verdoso */
.color-blanco-5 { color: #F8F8F8; } /* amarillo-verdoso */
.color-blanco-6 { color: #FAFAFA; } /* amarillo-verdoso */
.color-blanco-7 { color: #FCFCFC; } /* amarillo-verdoso */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* POPOVER */
/* */
/* */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
.popover {max-width:450px;}
.popover table { line-height: 18px !important; height: 50px !important; color: #888; }
.popover table tr { line-height: 18px !important; height: 50px !important; color: #888; }
.popover table tr td { line-height: 18px !important; height: 50px !important; color: #888; }
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* FONT */
/* Se aplican las font para cada elmento del portal */
/* */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////// */
.carousel-caption h1 { font-family: 'Perpetua', sans-serif; }
.carousel-caption h2 { font-family: 'MyriadPro', sans-serif; }
.op-catalogo-detalle .op-ttlo-detalle-1 h2 strong {
font-family: 'Perpetua', sans-serif !important;
text-transform: uppercase;
}
.og-cata-d1 .op-cata-item .op-cata-msge .op-attl { font : 1.9rem/2.1rem 'Perpetua', sans-serif; }
.og-cata-d1 .op-cata-item .op-cata-msge .op-ttlo { font : 2.0rem/2.2rem 'Perpetua', sans-serif; }
.og-cata-d1 .op-cata-item .op-cata-msge .op-ttlo span { font : 1.8rem/1.9rem 'Perpetua', sans-serif; }
.og-cata-d1 .op-cata-item .op-cata-msge .op-sttl { font : 2.0rem/2.1rem 'Perpetua', sans-serif; }
.og-cata-d1 .op-cata-item .op-cata-msge .op-desc { font : 1.6rem/2.0rem 'Calibri', sans-serif; }
.og-cata-d1 .op-cata-item .op-cata-msge .op-mass { font : 1.7rem/1.9rem 'Calibri', sans-serif; }
@media (max-width: 570px) {
.og-cata-d1 .op-cata-item .op-cata-msge .op-attl { font : 1.7rem/1.9rem 'Perpetua', sans-serif; }
.og-cata-d1 .op-cata-item .op-cata-msge .op-ttlo { font : 1.8rem/2.0rem 'Perpetua', sans-serif; }
.og-cata-d1 .op-cata-item .op-cata-msge .op-ttlo span { font : 1.8rem/1.9rem 'Perpetua', sans-serif; }
.og-cata-d1 .op-cata-item .op-cata-msge .op-sttl { font : 1.8rem/1.8rem 'Perpetua', sans-serif; }
.og-cata-d1 .op-cata-item .op-cata-msge .op-desc { font : 1.6rem/2.0rem 'Calibri', sans-serif; }
.og-cata-d1 .op-cata-item .op-cata-msge .op-mass { font : 1.7rem/1.9rem 'Calibri', sans-serif; }
}
/*
.ff-myriadpro { font-family: 'MyriadPro', sans-serif; }
.ff-calibri { font-family: 'Calibri', sans-serif; }
*/