/* CSS Document */ body { color: #444444; background-color: #000; margin: 0; padding: 0; background-image: url(../images/andean-background.png); } #label-slideshow > span { /*font-weight: bold; color: #FF3300;*/ font-style: italic; letter-spacing: 2px; } #mobile-nav-menu > ul:focus > li { background-color: #FFFFFF; color: #ffffff; margin: 0px 0px 0px -285px; overflow: hidden; list-style: none; border-left: 6px solid #bbbbbb; } #peruvian-swirls { position: absolute; top: 17px; right: 50px; padding: 0px; z-index: 4000; font-weight: bold; } .contentWrapper { position: relative; background-color: #ffffff; margin: 0 auto; overflow: hidden; } #andean-logo-main { width: 100%; } #slider-front-page { height: 420px; width: 100%; background-color: #666; margin: auto; overflow: hidden; position: relative; background-size: contain; } h1 span.red { color: #BC4324 } h1 span.gray { color: #54809B } img { border: none; } .right10px { margin-left: 10px !important; } .noBottom18 { font-size: 18px; margin-bottom: 0 !important; font-weight: normal !important; } .uLine { text-decoration: underline; } .size14 { font-size: 14px !important; } .hRed { color: #FF3300; } h2.hRed { font-size: 18px; margin: 0px; padding: 0; } #contact-column { font-size: 13px; } address { font-style: normal !important; } email { display: inline-block; } a { text-decoration: none; } .largeUL { font-size: 14px !important; } .aLft { text-align: left; } .aRgt { text-align: right } .aCtr { text-align: end; } body, select, option, input, textarea { font-family: 'Roboto', serif, Arial, Helvetica, sans-serif; } select, option, input, textarea, ul { border: 0; padding: 0; margin: 0; border-style: solid; border-color: #444444; } .insideWrapper { margin: 0 50px; } #header { height: 224px; position: relative; } #navMenu { position: absolute; left: 302px; bottom: 0px; font-size: 11px !important; height: 20px; width: 697px; z-index: 5000; } #navMenu #redLine { background-color: #FF3300; height: 5px; } #navMenu > ul { display: block; list-style: none; border: 0; padding: 0; margin: 0; border-style: solid; border-color: #FFF; height: 20px; font-weight: bold; /*overflow:hidden;*/ } /*#navMenu > ul:hover { overflow:visible;}*/ #navMenu > ul > li { display: inline-block; text-transform: uppercase; height: 20px; background-image: url(../images/menu-selection.png); background-position: bottom; background-repeat: repeat-x; overflow: hidden; text-align: center; line-height: 15px; vertical-align: text-bottom; } #navMenu > ul > li:hover { overflow: visible; background-color: #FF3300; height: 20px; position: relative; } #navMenu > ul > li > a { text-decoration: none; display: inline-block; color: #000000; } .touch { background-color: #099 !important; } #navMenu .liActive { overflow: visible; background-color: #FF3300; height: 20px; position: relative; top: -8px; } #navMenu .liActive ul { height: 45px; position: absolute; top: 10px; } #navMenu li { display: inline-block; list-style: none; border: 0; padding: 0; margin: 0; font-size: 11px !important } #navMenu ul > li > ul { display: block; list-style: none; border-width: 5px 0 0 0; border-color: #FF3300; border-style: solid; padding: 0; margin: 10px 0 0 0; height: 0px; width: 697px; overflow: hidden; background-color: #202020; text-align: left; } #navMenu ul > li:hover > ul { height: 45px; position: absolute; top: 10px; } #navMenu ul > li > ul li { color: #ffffff; overflow: hidden; border-style: solid; border-width: 0; border-color: #fff; height: 25px; margin-top: 10px; border-width: 0 1px 0 0 !important; } #navMenu ul > li > ul li a { color: #ffffff; text-decoration: none; padding: 5px 13px; display: inline-block; } #navMenu ul > li > ul li a:hover { background-color: #333; } #nav-natural-stone { width: 93px; text-align: left !important; } #nav-products { width: 68px; } #nav-products > ul { margin-left: -95px !important; } #nav-project-photos { width: 64px; } #nav-project-photos > ul { margin-left: -166px !important; } #nav-company { width: 63px; } #nav-company > ul { margin-left: -233px !important; } #nav-brochure { width: 70px; } #nav-brochure > ul { margin-left: -302px !important; } #nav-news-and-events { width: 95px; } #nav-news-and-events > ul { margin-left: -375px !important; } #nav-asc-real-estate { width: 105px; } #nav-asc-real-estate > ul { margin-left: -473px !important; } #nav-more { width: 45px; } #nav-more > ul { margin-left: -516px !important; } #nav-contact { width: 60px; } #nav-blog { width: 50px; } /* start front page specific */ #slider-front-page img { position: absolute; top: 0; left: 0; } #column-holder { position: relative; } #news-flash-front-page { margin: 0px 0 5px 0; } #news-flash-front-page li { margin: 0px 0 14px 0; } /* end front page specific */ .noList { list-style: none; list-style-image: none; } .BtnBlack { font-size: 14px; background-color: #202020; text-transform: uppercase; display: inline-block; color: #FFFFFF; } .BtnBlack a { color: inherit !important; text-decoration: none; padding: 6px 9px; display: inline-block; } /*gallery pages*/ #left-column-gallery { width: 290px; margin: 40px 80px 100px 50px; display: inline-block; float: left; } #left-column-gallery h1 { text-transform: capitalize; } #left-column-frontpage h1 { text-transform: capitalize; } #wide-column-gallery { width: 600px; margin: 40px 0px 20px 0px; display: inline-block; } .thumbnail { width: 186px; background-position: center; height: 95px; background-color: #CCC; margin: 0 7px 7px 0px; display: inline-block; overflow: hidden; position: relative; cursor: pointer; } .thumbnail-text { color: #FFF; background-color: #000; height: 18px; font-size: 10px; width: 176px; overflow: hidden; padding: 5px; margin: 67px 0 0 0; line-height: 19px; position: absolute; z-index: 10; bottom: 6px; } .thumbnail-large { width: 250px; height: 150px; background-color: #CCC; margin: 0 7px 7px 0px; display: inline-block; overflow: hidden; position: relative; cursor: pointer; } .thumbnail-text-large { color: #FFF; background-color: #000; height: 18px; font-size: 12px; width: 250px; overflow: hidden; padding: 5px; margin: 67px 0 0 0; line-height: 19px; } #wide-column-text { width: 550px; margin: 40px 50px 20px 0px; display: inline-block; } /* full-view-gallery */ #full-view-gallery { position: absolute; width: 100%; min-height: 350px; /*background-color:#09F;*/ z-index: 6000; top: 0px; } #holder-photo { width: 100%; min-height: 350px; margin: 0 auto; position: relative; } #holder-photo > div { position: absolute; } #holder-photo > div#this-photo { top: 0; right: 0; bottom: 0; left: 0; margin: 10px auto; } #prev-photo { width: 50px; /*background-color:#936;*/ left: 25px; cursor: pointer; min-height: 350px; } #this-photo { width: 100%; position: absolute; left: 38px; z-index: 100; overflow: hidden; text-align: center; border: solid #FFF 0px; } #the-image { } #next-photo { width: 50px; /*background-color:#396;*/ right: 25px; cursor: pointer; min-height: 350px; } #next-photo .nav-photo { margin: 0 0 0 24px; } .nav-photo { position: absolute; top: 150px; height: 31px; width: 26px; z-index: 100; } #galSpacer { /*height: 270px;*/ } #close-photo { font-size: 30px; font-weight: bold; z-index: 2000; cursor: pointer; padding: 15px 10px; line-height: 20px; width: 30px !important; height: 25px !important; text-align: center; background-color: #000; color: #fff; } #close-photo:hover { background-color: #900; } #andean-stone-company-gray { position: absolute; bottom: 60px; right: 60px; font-size: 30px; font-weight: bold; z-index: 2000; width: 302px; height: 60px !important; } .gallery-text { position: absolute; bottom: 0px; right: 0px; font-size: 16px; font-weight: bold; z-index: 1000; width: 100%; height: 25px !important; overflow: hidden; padding: 10px 5px; color: #FFF; background-color: #000; !important; text-align: center; } #gallery-holder { position: absolute; left: 0px; right: 0px; width: 100%; height: 100%; } /* fotter */ #footerArea { overflow: hidden; position: relative; } #copyright { font-size: 12px; color: #545454; text-align: center; margin: 10px; } #information-contact-form-box { background-color: #202020; color: #FFF; padding: 15px 20px; margin: 0 50px 0 0; } label { display: block; padding: 5px 3px; position: relative; } #information-contact-form-box input { width: 372px; height: 19px; padding: 4px; } #information-contact-form-box input[type="submit"] { width: 372px; height: 27px !important; padding: 4px; } #information-contact-form-box textarea { width: 372px; height: 140px; min-height: 140px; max-height: 140px; padding: 4px; } #information-contact-form-box label span { display: inline-block; width: 120px; } .inline-image { border-width: 0 0 5px 0; border-color: #FF3300; border-style: solid; } .video-separator { margin: 0px 0 40px 0; overflow: hidden; } .justified-list li span { display: inline-block; width: 180px; } .justified-list-short li span { display: inline-block; width: 120px; } @media only screen and (min-width: 1024px) { p, ul, ol { font-size: 13px; } #label-slideshow { font-family: 'Roboto', serif, Arial, Helvetica, sans-serif; white-space: pre; /*background-color: #303030;*/ position: absolute; bottom: 20px; right: 20px; padding: 10px 20px; color: #000000; font-weight: bold; text-shadow: #ffffff 1px 0 10px, #ffffff 1px 0 4px, #ffffff 1px 0 4px; z-index: 8000 } #close-photo { position: absolute; top: 20px; right: 20px; } .nav-photo { display: none; } .contentWrapper { width: 1024px; } #left-column-frontpage { width: 550px; margin: 40px 80px 100px 50px; display: inline-block; } #middle-column-frontpage-red-line { width: 5px; margin: 40px 0px 20px 650px; position: absolute; top: 0; background-color: #FF3300; height: 80%; } #right-column-frontpage { width: 285px; margin: 40px 0px 20px 690px; position: absolute; top: 0; } #socialLinks { margin: 0 0 50px 50px; } #andean-stone-logo { position: absolute; top: 12px; left: 50px; /*4.5%*/ } } @media only screen and (min-width: 900px) and (max-width: 1023px) { p, ul, ol { font-size: 16px; } #label-slideshow { font-family: 'Roboto', serif, Arial, Helvetica, sans-serif; white-space: pre; /*background-color: #303030;*/ position: absolute; bottom: 20px; right: 20px; font-size: 14px; font-weight: bold; padding: 10px 20px; color: #000000; text-shadow: #ffffff 1px 0 10px, #ffffff 1px 0 4px, #ffffff 1px 0 4px; z-index: 8000 } #close-photo { position: fixed; top: 5px; left: 10px; } #andean-stone-logo { position: absolute; top: 12px; left: 50px; /*4.5%*/ } #left-column-frontpage { width: 50%; margin: 40px 30px 100px 50px; padding-right: 30px; display: inline-block; border-right: #FF3300 solid 5px; } #middle-column-frontpage-red-line { display: none; visibility: hidden; } #right-column-frontpage { width: 30%; margin: 40px 0px 20px 0px; display: inline-block; } } @media only screen and (max-width: 760px) { #mobile-element { display: none; } #navMenu > ul > li { height: 20px !important; } } @media only screen and (min-width: 391px) and (max-width: 899px) { p, ul, ol { font-size: 15px; } #label-slideshow { font-family: 'Roboto', serif, Arial, Helvetica, sans-serif; white-space: pre; position: absolute; bottom: 20px; left: 20px; font-size: 16px; font-weight: bold; padding: 0; color: #000000; text-shadow: #ffffff 1px 0 10px, #ffffff 1px 0 4px, #ffffff 1px 0 4px; z-index: 8000 } #close-photo { position: fixed; top: 5px; left: 10px; } #peruvian-swirls { position: absolute; top: 17px; right: 50px; padding: 0px; z-index: 4000; font-weight: bold; } #andean-stone-logo { position: absolute; top: 12px; left: 20px; /*4.5%*/ width: 88%; max-width: 442px; } #left-column-frontpage { margin: 40px 30px 100px 50px; display: block; border-right: #FF3300 solid 0px; } #middle-column-frontpage-red-line { display: none; visibility: hidden; } #right-column-frontpage { margin: 40px; display: block; } #socialLinks { text-align: center; margin-bottom: 50px; } } @media only screen and (max-width: 390px) { p, ul, ol { font-size: 15px; } #label-slideshow { display: none; visibility: hidden; } /* #label-slideshow { font-family: 'Roboto', serif, Arial, Helvetica, sans-serif; white-space: pre; position: absolute; bottom: 10px; left: 10px; font-size: 13px; font-weight: bold; padding: 0; color: #000000; /*text-shadow: #ffffff 1px 0 4px, #ffffff 1px 0 4px, #ffffff 1px 0 4px;* / z-index: 8000 } */ #close-photo { position: fixed; top: 5px; left: 10px; } #andean-stone-logo { width: 80%; display: block; margin: 80px auto 10px auto; } #header { height: 144px; position: relative; } #left-column-frontpage { margin: 40px 30px 100px 50px; display: block; border-right: #FF3300 solid 0px; } #middle-column-frontpage-red-line { display: none; visibility: hidden; } #socialLinks { text-align: center; margin-bottom: 50px; } } #mobile-nav-menu { visibility: hidden; display: none; overflow: hidden; } @media (min-width: 0px) and (max-width: 1000px) { #label-slideshow { font-family: 'Roboto', serif, Arial, Helvetica, sans-serif; white-space: pre; position: absolute; z-index: 8000 } #peruvian-swirls { position: absolute; top: 17px; right: 80px; padding: 0; z-index: 4000; font-weight: bold; } #navMenu { visibility: hidden; display: none; overflow: hidden; height: 0px; width: 0px; } #mobile-nav-menu { background-color: #ffffff; display: block; visibility: visible; height: 0px; width: 0px; padding: 0px; position: relative; top: 100px; } #mobile-nav-menu > ul > li > a { display: block; width: 170px; } #mobile-nav-menu > ul { position: fixed; top: 5px; right: 5px; display: initial; visibility: visible; width: 46px; height: 46px; padding: 0; background: #f1f1f1; overflow: hidden; z-index: 9999; outline-color: gray; } #mobile-nav-menu > ul:before { font-family: FontAwesome; content: '\f0c9'; font-size: 30px; padding: 0 0 0 10px; line-height: 46px; vertical-align: middle; } #mobile-nav-menu > ul, #mobile-nav-menu > ul li { list-style: none; list-style-image: none; list-style-type: none; float: none; } #mobile-nav-menu ul:focus { overflow: visible; } #mobile-nav-menu > ul:focus li a { display: block; padding: 3px 8px; text-transform: capitalize; } #mobile-nav-menu > ul:focus li li a { font-size: 12px; color: #000000; } #mobile-nav-menu > ul:focus > li > a { font-weight: bold; text-transform: uppercase; padding: 6px 8px; border: solid 0px #FF3300; color: #444444 } #mobile-nav-menu ul ul { margin-left: 3px; } #mobile-nav-menu > ul:focus li li { display: inline-block; padding: 2px 2px; margin: 0 2px 2px 0; background-color: #efefef; /*border-radius: 10px;*/ text-transform: capitalize; } #mobile-nav-menu > ul:focus li:hover { background-color: #ffffff; /*border-left: 6px solid #ffffff;*/ } #mobile-nav-menu > ul:focus li:hover a span { color: #0066CC; } #mobile-nav-menu > ul:focus > li:first-child a { /*padding-top: 6px;*/ } #mobile-nav-menu > ul:focus > li:last-child a { padding-bottom: 8px; } #mobile-nav-menu > ul:focus a span { color: #f1f1f1; } #mobile-nav-menu > ul > li li.active-nav { background-color: #000000; } #mobile-nav-menu > ul > li li.active-nav a { color: #ffffff; } #mobile-nav-menu > ul > li.active-nav { border-left: 6px solid #ff5500; } #mobile-nav-menu ul li.active-nav > a { color: #ff5500; } #mobile-nav-menu ul li.active-nav:hover a { color: #ffffff; } #left-column-frontpage { margin: 20px 40px; display: block; } #left-column-frontpage p { text-align: justify } #right-column-frontpage { margin: 40px auto; display: block; } #right-column-frontpage h1 { text-align: center; } #right-column-frontpage img.size-medium { width: 90%; height: auto; } #left-column-gallery { width: auto; margin: 0; padding: 40px; display: block; float: none; } #left-column-gallery p { text-align: justify; } #left-column-gallery img { display: block; margin: 10px auto; } #wide-column-text { width: auto; margin: 0; padding: 40px; display: block; } #wide-column-text p { text-align: justify; } #wide-column-text img { width: 100%; } #wide-column-text iframe { width: 100%; } #wide-column-gallery { width: auto; margin: 0; padding: 40px; display: block; text-align: center; } #wide-column-gallery p { text-align: justify; } #wide-column-gallery iframe { width: 100%; } /* #video-separator*/ #information-contact-form-box { background-color: #202020; color: #FFF; padding: 15px 20px; margin: 0; } #information-contact-form-box input[type="submit"] { display: block; width: 100%; margin: 0 auto; } #information-contact-form input { display: block; width: 95%; margin: 0 auto; } #information-contact-form textarea { display: block; width: 95%; margin: 0 auto; } } .edit-button { background-color: green; color: white; display: inline-block; padding: 3px 6px; position: absolute; }