/* Theme Name: Otodoo Responsive Theme URI: https://www.otodoo.com Description: Otodoo Responsive est un thème pour WordPress utilisant un système de bloc. Author: Fred Jaillet Author URI: http://www.fredjaillet.com Version: 3.0.0 Tags: responsive, html5, css3, jquery License: GNU General Public License License URI: http://www.opensource.org/licenses/gpl-license.php */ /*RESET*/ html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,figure,footer,header,hgroup,menu,nav,section,menu,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}ol,ul{list-style:none}article,aside,figure,footer,header,hgroup,nav,section{display:block}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}ins{background-color:#ff9;color:#000;text-decoration:none}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:700}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted #000;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}table{font-size:inherit;font:100%}html{-webkit-font-smoothing:antialiased;overflow-y:scroll}input[type=text],textarea,select{outline:none}label,input[type=button],input[type=submit],button{cursor:hand;cursor:pointer;}a:hover,a:active{outline:none}.ie7 img{-ms-interpolation-mode:bicubic}pre{padding:15px;white-space:pre;white-space:pre-wrap;white-space:pre-line;word-wrap:break-word}*{padding:0;margin:0}img{max-width:100%;vertical-align:middle;height:auto;width:auto;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} /*COMMON*/ * { outline:none} * { box-sizing: border-box} html, body { height: 100%; width:100%} body{font-size:18px; font-weight:500; background:#424242; font-family: 'Rajdhani', sans-serif; color:#424242} /*SECTION*/ .wrap { position:relative} .row { position:relative; margin:0px auto; padding:40px 20px; max-width:1180px} .row:after { content:""; display:table; clear:both; overflow:visible} @media only screen and (max-width : 980px) { body{font-size:16px } .row { padding:10px} #breadcrumb .row { padding:10px} } /*HEADER*/ #header { background:#fff; position:absolute; top:0; left:0; right:0; z-index:9999 } #header .row { padding: 10px; max-width: 1200px} /*LOGO*/ .logo-header { background:#fff; padding:35px 15px 15px 15px; position:absolute; top:0; left:0 } /*SEARCH*/ .search-header { width:210px; background:#cde4a7; padding:8px 15px 8px 15px; position:absolute; top:0; right:0 } .searchform { display: flex} .searchform input[type=search] { width: 100%; vertical-align:middle; background:#fff; color:#4e5152; padding:4px; font-size:14px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border:1px solid #ddd} .searchform input[type=search]:hover { border:1px solid #18703F} .searchform input.submit { vertical-align:middle; padding-top:4px; margin-left:5px; height:24px} .searchform ::-webkit-input-placeholder { color: #666} .searchform :-moz-placeholder { color: #666; opacity: 1} .searchform ::-moz-placeholder { color: #666; opacity: 1} .searchform :-ms-input-placeholder { color:#666} /*NAVBAR*/ .menu-header { padding-right:210px; float:right; font-size:0 } .menu-header li {display: inline-block; margin-right:15px; text-transform: uppercase; vertical-align:middle; font-size:17px; position: relative; z-index:9999;} .menu-header li:last-child { margin-right:0 } .menu-header li a { display: inline-block; text-decoration:none; color:#424242} .menu-header li:hover > a { color:#82bb23 } .toggle-menu { display:none} @media only screen and (max-width : 780px) { .logo-header { padding:5px; top:0 } .logo-header img { height:67px } .menu-header, .search-header { display:none} #header { top:0 } #header .row { padding: 0 } .toggle-menu { display:block; font-size:0; cursor: pointer; position: absolute; top: 38px; right:10px; z-index:3} .toggle-menu:before { display:inline-block; color:#424242; vertical-align:middle; font: normal 18px 'FontAwesome'; content: '\f0c9'} .menu-open .toggle-menu:before { display:inline-block; vertical-align:middle; font: normal 18px 'FontAwesome'; content: '\f00d'} .menu-open #header { position:fixed; top:0; left:0; right:0; bottom:0; background:#fff; z-index:9999} .menu-open .menu-header { padding-right:0; display:block; float:none; padding-top:200px } .menu-open .menu-header li { display:block; font-size:20px; text-align:center; margin-right:0; padding-bottom:12px} .menu-open .toggle-menu { top:38px} .menu-open .searchbutton { display:none} body.menu-open { overflow:hidden} } /*BANNER*/ #banner { height:134px; background:url(media/back_concrete.jpg) center center no-repeat; background-size: cover} @media only screen and (max-width : 780px) { #banner { height:80px; background:#fff } } /*SLIDER*/ #slider { height:560px } #slider .flexslider { position:absolute; width: 100%; height: 560px} #slider .slides { width: 100%; height: 100% !important} #slider .slides li { position:relative; width: 100%; height: 100% !important; background-size: cover; background-repeat:no-repeat; background-position:top center } /*content*/ #slider .slider-inside { position:relative; height:560px; margin:0px auto; max-width:1140px} #slider .slider-inside-content { position:absolute; padding:30px 360px 30px 30px; bottom:0; vertical-align: bottom; background:rgba(130,187,35,0.75)} #slider .slider-inside-content h1.entry-title { color:#fff; font-size:48px; margin-bottom:0 } #slider .slider-inside-content p { color:#fff; font-size:19px } #slider .slider-inside-content img { position:absolute; bottom:20px; right:20px } /*arrow*/ #slider .flex-direction-nav a { background:rgba(26,26,26,0.5); z-index:9997; color:#fff; width:17px; position: absolute; margin-top:-53px; top: 50%} #slider .flex-direction-nav a:hover { color:#ccc } #slider .flex-direction-nav a.flex-prev { left: 0; padding:40px 25px 40px 10px; text-align:center} #slider .flex-direction-nav a.flex-next { right: 0; padding:40px 20px 40px 15px;text-align:center} #slider .flex-direction-nav a:before { font-family: "FontAwesome"; font-size: 24px; display: inline-block } #slider .flex-direction-nav a.flex-next:before { content: "\f105" } #slider .flex-direction-nav a.flex-prev:before { content: "\f104" } #slider .flex-direction-nav a span { display:none } @media only screen and (max-width : 980px) { #slider .slider-inside-content h1.entry-title { font-size:32px } } @media only screen and (max-width : 680px) { #slider .slider-inside-content { padding:30px } #slider .slider-inside-content h1.entry-title {font-size:24px } #slider .slider-inside-content p { font-size:15px } #slider .slider-inside-content img { display:none } } /*BREADCRUMB*/ #breadcrumb { background:#fff} #breadcrumb .row { padding:20px 20px 0 20px} #breadcrumbs { color:#666; font-size:14px } #breadcrumbs a { color: #666; text-decoration:none} #breadcrumbs a:hover { color: #333} @media only screen and (max-width : 980px) { #breadcrumb .row { padding:10px} } /*CONTAINER*/ #container { background:#fff } /*COLUMN*/ .column { display: flex } .column .column-main { flex: 1 0 0px; margin-right:39px } .column .column-aside { flex: 0 0 400px; padding:87px 20px 0 40px; border-left:1px solid #efefef} .column .column-aside h3 { padding-bottom:10px; text-align: center; font-weight:700; font-size:700; text-transform:uppercase } @media only screen and (max-width : 780px) { .column { display: block } .column .column-main, .column .column-aside { flex: 0 100%; margin:0; padding:0; border:none } .column .column-aside { margin-top:20px } } /*GALLERY*/ .grid-gallery { margin:30px -10px; font-size:0 } .grid-gallery li { font-size:16px; display: inline-block; width:33.33% } .grid-gallery li article { margin:10px; border:solid 10px #efefef } @media only screen and (max-width : 780px) { .grid-gallery li { width:50% } } @media only screen and (max-width : 480px) { .grid-gallery li { width:100% } } /*PRODUCT*/ #product { background:#fff} #product .row { padding:100px 20px 60px 20px} .grid-product { padding-top:30px; margin:-10px; font-size:0; text-align:center} .grid-product > li { display:inline-block; position:relative; vertical-align:middle; width:50%; font-size:16px } .grid-product > li article { -webkit-border-radius: 10px; min-height: 168px; border-radius: 10px; position:relative; margin:10px; padding:20px} .grid-product > li a { text-decoration: none} .grid-product > li:first-child article { background:#cde4a7 } .grid-product > li:last-child article { background:#cfcfce } .grid-product > li article img { position:absolute; bottom:20px; left:20px; width:200px} .grid-product > li article h3.entry-title { padding-left:200px; color:#58585a; font-weight:400; text-transform: uppercase; font-size:50px } .grid-product > li:first-child article h3.entry-title { padding-top:32px } @media only screen and (max-width : 680px) { #product .row { padding:10px} .grid-product > li article img { position:relative; bottom:auto; left:auto; width:100px} .grid-product > li { display:block; width:100% } .grid-product > li article h3.entry-title { padding-left:0; padding-top:10px;font-size:30px } .grid-product > li:first-child article h3.entry-title { padding-top:0 } .grid-product > li article { padding:10px } .grid-product > li article h3 { font-size:13px } .grid-product > li article { min-height: auto } } /*LIST PRODUCT*/ .grid-productlist { margin-top:30px; border-top:1px solid #424242} .grid-productlist > li { display:block; width:100%; font-size:16px } .grid-productlist > li article { border-bottom:1px solid #424242; position:relative; overflow: hidden; padding:20px 0} .grid-productlist > li article img { height:150px; float:left; margin-right:30px } .grid-productlist > li article h3 { color:#424242; font-weight:400; font-size:35px } .grid-productlist > li article h3 a { text-decoration: none; color:#424242} .grid-productlist > li article h3 a:hover { text-decoration: none; color:#424242} .grid-productlist .entry-link { margin-top:10px; text-align:right} .grid-productlist .entry-link a { -webkit-border-radius: 10px; border-radius: 10px; display:inline-block; background:#cde4a7; text-decoration:none; font-size:15px; border:1px solid #cde4a7; color:#424242; padding:5px 15px} .grid-productlist .entry-link a:hover { border:1px solid #424242; background:#424242; color:#cde4a7} @media only screen and (max-width : 680px) { .grid-productlist > li article img { height:auto; float:left; width:100%; margin-right:0 } } /*BLOG*/ .grid-blog { margin-top:30px; border-top:1px solid #424242} .grid-blog > li { display:block; width:100%; font-size:16px } .grid-blog > li article { border-bottom:1px solid #424242; position:relative; overflow: hidden; padding:20px 0} .grid-blog > li article img { height:150px; float:left; margin-right:30px } .grid-blog > li article h3 { color:#424242; font-weight:400; font-size:35px } .grid-blog > li article h3 a { text-decoration: none; color:#424242} .grid-blog > li article h3 a:hover { text-decoration: none; color:#424242} .grid-blog .entry-summary { margin-top:20px; font-weight:500; line-height: 1.5em } .grid-blog .entry-link { margin-top:10px; text-align:right} .grid-blog .entry-link a { -webkit-border-radius: 10px; border-radius: 10px; display:inline-block; background:#cde4a7; text-decoration:none; font-size:15px; border:1px solid #cde4a7; color:#424242; padding:5px 15px} .grid-blog .entry-link a:hover { border:1px solid #424242; background:#424242; color:#cde4a7} @media only screen and (max-width : 680px) { .grid-blog > li article img { height:auto; float:left; width:100%; margin-right:0 } } /*FOOTER CONTACT*/ #footercontact { background:#f5a710; text-align: center } #footercontact .row { padding:50px 20px } #footercontact p { font-size:24px; color:#fff; text-transform: uppercase; margin-bottom:20px } #footercontact img { width:90px} @media only screen and (max-width : 680px) { #footercontact .row { padding:10px } } /*FOOTER*/ #footer { background: #424242} #footer .row { padding:50px 20px } .grid-widget-footer { font-size:0} .grid-widget-footer > li { font-size:15px; text-align: center; display: inline-block; vertical-align:middle; width:33.33% } .grid-widget-footer > li article { backgound:pink } .grid-widget-footer > li article img { width: 311px } .grid-widget-footer > li article p { padding-top:10px; color:#fff; font-size:20px; line-height:1.4em} .grid-widget-footer > li article a { color:#fff; text-decoration: none } .grid-widget-footer > li article a:hover { color:#efefef } .widget_media_image { adding-top:30px} @media only screen and (max-width : 980px) { #footer .row { padding:10px } #menu-footer li { display: block; width:100% } .grid-widget-footer > li { text-align: center; display: block; width:100%; margin-bottom:20px } .grid-widget-footer > li:last-child { margin-bottom:0 } .grid-widget-footer > li article { border-right:0; padding:0 !important } .grid-widget-footer > li:nth-child(2) { display:none } } /*SOCIAL*/ .menu-social { padding-top:15px; font-size:0 } .menu-social li { cursor:pointer; display:inline-block; margin-right:10px; font-size:12px; height:47px; width:47px; vertical-align:middle} .menu-social li:last-child { margin-right:0} .menu-social li span { display:none} .menu-social li a:before { vertical-align: middle; display:inline-block; height:47px; width:47px } .menu-social li.facebook a:before { content: url(media/facebook.svg)} .menu-social li.twitter a:before { padding-top:5px;content: url(media/twitter.svg)} .menu-social li.youtube a:before { content: url(media/youtube.svg)} .menu-social li.linkedin a:before { content: url(media/linkedin.png); width:47px} /*COPYRIGHT*/ #copyright { background:#424242 } #copyright .row { padding:20px } #copyright .menu-copyright { text-align:left; font-size:0; color:#fff; float:left } #copyright .menu-copyright li { display:inline-block; font-size:14px } #copyright .menu-copyright li:after { content:"\2022"; font-weight: 700; color:#fff; padding:0 6px } #copyright .menu-copyright li:last-child:after { content:" "; padding:0 } #copyright .menu-design { float:right; text-align: right; color:#fff; font-size:14px } #copyright a { color:#fff; text-decoration:none } #copyright a:hover { color:#ccc} @media only screen and (max-width : 680px) { #copyright .menu-copyright { float:none; text-align:center} #copyright .menu-copyright > li { display:block; margin-right:0; margin-bottom:5px} #copyright .menu-copyright li:after { content:" "; padding:0 } #copyright .menu-design { float:none; text-align:center } } /*RELATED*/ #related { background:#efefef; text-align: center } #related .row { padding:40px 20px } #related h2 { color:#82bb23; font-weight: 400; font-size:40px; position:relative } .grid-related { font-size:0; text-align:center} .grid-related > li { display:inline-block; position:relative; vertical-align:top; width:33.3333%; font-size:16px } .grid-related > li article { position:relative; padding:20px; overflow:hidden} .grid-related > li article h3 { font-size: 22px; color:#000; font-weight:400; margin:10px 0} .grid-related .entry-summary { margin-top:20px; font-weight:500; line-height: 1.5em } .grid-related .entry-link { margin-top:10px; text-align:center} .grid-related .entry-link a { -webkit-border-radius: 10px; border-radius: 10px; display:inline-block; background:#cde4a7; text-decoration:none; font-size:15px; border:1px solid #cde4a7; color:#424242; padding:5px 15px} .grid-related .entry-link a:hover { border:1px solid #424242; background:#424242; color:#cde4a7} @media only screen and (max-width : 980px) { .grid-related > li { width: 50% !important} } @media only screen and (max-width : 780px) { #related { text-align: center } #related .row { padding:10px } .grid-related > li { width: 100% !important} .grid-related > li article { padding:10px} .grid-related > li article h3 { font-size: 19px; margin-bottom:10px} .grid-related .entry-summary { margin-top:0 } } /*SEARCH*/ .searchresult { margin-bottom:20px} .grid-search { margin-top:24px} .grid-search li { overflow:hidden; padding:20px 0; border-top:1px solid #424242} .grid-search li:last-child { border-bottom:1px solid #424242 } .grid-search li img { float:left; margin-right:24px} .grid-search li h3 { font-size: 30px; font-weight:500; color:#424242} .grid-search li .entry-type-post { padding-bottom: 5px; color:#82bb23 } .grid-search li .entry-summary { padding-top: 5px } .grid-search li span { padding-right:6px} .grid-search li a { color:#000; text-decoration:none} .grid-search li a:hover { color:#1f497d; text-decoration:none} .grid-search li .entry-linked a { color: #82bb23 !important; font-size:14px; font-style: italic; text-decoration: none} .grid-search li .entry-linked a:hover { text-decoration: underline !important} /*SINGLE*/ .entry-meta { padding-bottom:10px } .entry-meta span { margin-right:16px; color:#999; font-size:12px} .entry-meta span:last-child { margin-right: 0} .entry-meta span a { color:#999; text-decoration: none} .entry-meta span a:hover { color:#999; text-decoration: underline} .entry-meta-date:before { content: '\f017'; font-family: "FontAwesome"; display: inline-block; margin-right: 5px; font-size:15px } .entry-meta-category:before { content: '\f115'; font-family: "FontAwesome"; display: inline-block; margin-right: 5px; font-size:15px } /*TAG*/ .entry-tag { margin-top:20px; position: relative; display: inline-block; height: 24px; margin-left: 12px; margin-right:6px; margin-bottom:6px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; padding: 0 8px 0 12px; background-color: #ccc; color: #333; font-size: 14px; text-transform:uppercase; line-height: 24px; text-decoration: none; zoom: 1} .entry-tag:hover { background:#82bb23; color:#fff} .entry-tag-arrow { content: ""; position: absolute; top: 0; left: -12px; width: 0; height: 0; border-color: transparent #ccc transparent transparent; border-style: solid; border-width: 12px 12px 12px 0} .entry-tag:hover .entry-tag-arrow { border-color: transparent #82bb23 transparent transparent;} .entry-tag-bullet { content: ""; position: absolute; top: 10px; left: 0; float: left; width: 4px; height: 4px; border-radius: 2px; background-color: #fff} /*PAGINATION*/ .entry-pagination { margin-top: 20px; padding-top:12px; font-size:0 } .entry-pagination li { display:inline-block; margin-right:3px; vertical-align:middle; font-weight:500; font-size:14px} .entry-pagination li:last-child { font-weight:500; display:inline-block; padding:6px 12px; float: right; margin-right:0} .entry-pagination li.current { display:inline-block; padding:6px 12px; color:#fff; background:#82bb23} .entry-pagination li a { display:inline-block; padding:6px 12px; text-decoration:none; text-transform:uppercase; color:#fff; background: #424242} .entry-pagination li a:hover { color:#fff; background:#82bb23} @media only screen and (max-width : 580px) { .entry-pagination li { font-size:13px } .entry-pagination li:last-child { padding:3px 6px } .entry-pagination li.current { padding:3px 6px } .entry-pagination li a { padding:3px 6px } } /*RICHTEXT*/ h1.entry-title { font-size:60px; font-weight:500; color:#82bb23; margin-bottom:10px} h2.entry-title { font-size:35px; font-weight:500; margin-bottom:10px} .entry-content a { color:#82bb23; text-decoration:none} .entry-content a:hover { color:#82bb23; text-decoration:underline} .entry-content h2 { font-size: 35px; font-weight:500; margin-bottom:10px} .entry-content h3 { font-size: 28px; font-weight:600; margin-bottom:10px} .entry-content h4 { font-size: 23px; font-weight:600; margin-bottom:10px} .entry-content h5 { font-size: 20px; font-weight:600; color:#82bb23; margin-bottom:10px} .entry-content h6 { font-size: 18px; font-weight:600; margin-bottom:10px} .entry-content p { padding-bottom:10px; text-align: justify; line-height:1.4em; font-weight: 500} .entry-content p:last-child { padding:0 } .entry-content > ul { margin-bottom:10px} .entry-content > ul > li { padding-left:10px; list-style:none; line-height:1.4em} .entry-content > ul > li:before { color:#82bb23; margin-right:5px; font-weight: 700; padding-bottom:0; vertical-align:bottom; display:inline-block; content: "•"; font-size:35px} .entry-content > ol { margin:0 0 10px 10px} .entry-content > ol > li { list-style:decimal; margin-left:10px; line-height:1.4em} .entry-content blockquote { margin:20px 0 30px 0; background:#f1f1f1; text-align:center !important; font-size:20px; padding:30px} .entry-content blockquote p { padding-bottom:0; color: #333; line-height:1.4em} .entry-content .alignleft { float:left; margin-right:20px; padding-top:4px; margin-bottom:16px} .entry-content .alignright { float:right; margin-left:20px; padding-top:4px; margin-bottom:16px} .entry-content .aligncenter { margin:0 auto 30px; display:block } .entry-content a[href$=".pdf"] { color:#82bb23; background-image: url(media/pdf.svg); background-position: center left; background-repeat: no-repeat; padding-left: 20px; height: 20px; display: inline-block } .entry-content a[href$=".pdf"]:hover { text-decoration: underline; color:#82bb23 } @media only screen and (max-width : 680px) { h1.entry-title { font-size:40px } .entry-content h2 { font-size: 24px } .entry-content h3 { font-size: 20px } .entry-content h4 { font-size: 16px } .entry-content h5 { font-size: 16px } .entry-content h6 { font-size: 15px } .entry-content img.alignleft, .entry-content img.alignright { width:100%; margin:0} } /*CONTACT*/ #contact { background:#fff } /*FORM CONTACT*/ div.wpcf7 { padding:0} div.wpcf7-response-output { font-size: 13px!important; text-align: center; padding:10px} textarea.wpcf7-not-valid, input.wpcf7-not-valid { border:1px solid #F00!important} .wpcf7-validation-errors, .wpcf7-mail-sent-ng { border:1px solid red!important; color:red} .wpcf7-mail-sent-ok { border:1px solid green!important; color:green} span.wpcf7-not-valid-tip { color: #f00; font-size: 10px !important; text-transform:uppercase; font-weight:normal !important; display: block} div.wpcf7 .screen-reader-response { display: none } .wpcf7 label { font-size:15px !important; text-align:center !important; text-transform:uppercase; font-weight:500} .wpcf7 label em { color:red; padding-left:6px; font-style:normal} .wpcf7 input[type=text], .wpcf7 input[type=email] { margin:5px 0; width: 100%; background:#fff; color:#000; padding: 5px; font-family:Tahoma,Geneva,sans-serif; font-size:13px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border:1px solid #ddd} .wpcf7 input[type=text]:hover, .wpcf7 input[type=email]:hover, .wpcf7 textarea:hover { border:1px solid #82bb23 } .wpcf7 textarea { margin-top:5px; width: 100%; background:#fff; resize: none; color:#000; padding:5px; font-family:Tahoma,Geneva,sans-serif; font-size:13px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border:1px solid #ddd} .wpcf7 input[type=submit]{ transition: all 0.5s ease; width:100%; display:block; text-align:center !important; background:#82bb23; text-transform:uppercase; color:#fff; padding: 5px 20px; font-family:Tahoma,Geneva,sans-serif; font-size:16px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border:1px solid #82bb23} .wpcf7 input[type=submit]:hover { background:#424242; border:1px solid #424242; color:#fff} .wpcf7 span:last-child { width:100%; display:inline-block; text-align:center} /*COLORBOX*/ #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0) } #cboxWrapper {max-width:none;} #cboxOverlay{position:fixed; width:100%; height:100%;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative;} #cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;} #cboxTitle{margin:0} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} .cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;} .cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;} #colorbox, #cboxContent, #cboxLoadedContent { -moz-box-sizing:content-box; -webkit-box-sizing:content-box; box-sizing:content-box } #cboxOverlay{background:rgba(3,3,3,0.7); opacity: 0.9; filter: alpha(opacity = 90);} #colorbox{outline:0;} #cboxTopLeft{width:25px; height:25px; background:url(media/colorbox/border1.png) no-repeat 0 0;} #cboxTopCenter{height:25px; background:url(media/colorbox/border1.png) repeat-x 0 -50px;} #cboxTopRight{width:25px; height:25px; background:url(media/colorbox/border1.png) no-repeat -25px 0;} #cboxBottomLeft{width:25px; height:25px; background:url(media/colorbox/border1.png) no-repeat 0 -25px;} #cboxBottomCenter{height:25px; background:url(media/colorbox/border1.png) repeat-x 0 -75px;} #cboxBottomRight{width:25px; height:25px; background:url(media/colorbox/border1.png) no-repeat -25px -25px;} #cboxMiddleLeft{width:25px; background:url(media/colorbox/border2.png) repeat-y 0 0;} #cboxMiddleRight{width:25px; background:url(media/colorbox/border2.png) repeat-y -25px 0;} #cboxContent{background:#fff; overflow:hidden;} .cboxIframe{background:#fff;} #cboxError{padding:50px; border:1px solid #ccc;} #cboxLoadedContent{margin-bottom:20px;} #cboxTitle{position:absolute; bottom:0px; left:0; text-align:center; width:100%; color:#999; display:none !important} #cboxCurrent{position:absolute; bottom:0px; left:100px; color:#999;} #cboxLoadingOverlay{background:#fff url(media/colorbox/loading.gif) no-repeat 5px 5px;} #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; } #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;} #cboxSlideshow{position:absolute; bottom:0px; right:42px; color:#444;} #cboxPrevious{position:absolute; bottom:0px; left:0; color:#444;} #cboxNext{position:absolute; bottom:0px; left:63px; color:#444;} #cboxClose{position:absolute; bottom:0; right:0; display:block; text-transform:uppercase; color:#e2001a} #cboxClose:before { display:inline-block; vertical-align:bottom; font: normal 18px 'FontAwesome'; content: '\f00d'} .cboxIE #cboxTopLeft, .cboxIE #cboxTopCenter, .cboxIE #cboxTopRight, .cboxIE #cboxBottomLeft, .cboxIE #cboxBottomCenter, .cboxIE #cboxBottomRight, .cboxIE #cboxMiddleLeft, .cboxIE #cboxMiddleRight { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)}