/*----------------------------------------------------------------------------- STYLE CONFIGURATION FROM ESCALATIOJNTHEME Screen Stylesheet version: 1.0 date: 27.02.2012 author: themepunch email: support@themepunch.com website: http://www.themepunch.com -----------------------------------------------------------------------------*/ /********************************************* TABLE OF CONTENT BASICS cONTENT BACKGROUNDS TOP SOCIAL CONTAINER TOOLTIP HEADER AND NAVIGATION QUOTES DIVIDER WP-CORE EXPAND / COLLAPSE SIDEBARS BLOG FOOTER TWIITER BANENR SALOON BANNER KEN BURN *********************************************/ /*********************** - BASICS - ***********************/ html { width: 100%; margin: 0px; overflow-x:hidden; padding: 0;} .body { margin:0px;} .container { z-index:10;} ol, ul { list-style: none; } a, a:visited { cursor:pointer; text-decoration:none; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.8s ease-out; -ms-transition: all 0.3s ease-in-out; color:#222222; } a:hover { text-decoration: none; cursor: pointer;color:#67cc23; } a:focus { outline: none; } .contentbox a, .contentbox a:visited { cursor:pointer; text-decoration:none; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.8s ease-out; -ms-transition: all 0.3s ease-in-out; color:#222222; font-weight:bold;text-decoration:underline; } .contentbox a:hover { text-decoration: none; cursor: pointer;color:#67cc23; } .contentbox a:focus { outline: none; } .clear{ clear:both;} p {margin: 0 0 20px 0;} blockquote{ border-left: 1px solid #222; padding-left: 10px; } body { font-size:12px; line-height:20px !important; color:#222222; font-family:Arial; background-color: #ffffff } h1 { color:#111; font-family:Arial; font-size: 32px; line-height:36px; margin-bottom:10px; font-weight:bold; letter-spacing:-1px;} h2 { color:#111; font-family:Arial; font-size: 28px; line-height:30px; margin-bottom:10px; font-weight:bold; letter-spacing:-1px;} h3 { color:#111; font-family:Arial; font-size: 24px; line-height:24px; margin-bottom:10px; font-weight:bold; letter-spacing:-1px;} h4 { color:#111; font-family:Arial; font-size: 20px; line-height:22px; margin-bottom:10px; font-weight:bold; letter-spacing:-1px;} h5 { color:#111; font-family:Arial; font-size: 16px; line-height:20px; margin-bottom:10px; font-weight:bold; letter-spacing:-1px;} h6 { color:#111; font-family:Arial; font-size: 13px; line-height:18px; margin-bottom:10px; font-weight:bold; letter-spacing:-1px;} @media only screen and (min-width: 768px) and (max-width: 959px) { h5 { margin-bottom:10px; } } @media only screen and (min-width: 480px) and (max-width: 767px) { h5 { margin-bottom:10px; } } @media only screen and (min-width: 0px) and (max-width: 479px) { h3 { font-size: 16px; } h5 { font-size: 14px; margin-bottom:10px; } } .centerme { margin-left:auto;margin-right:auto; } .content { padding-top: 20px; } .leftfloat {float:left !important;} .rightfloat { float: right !important;} /*************************************** - THE BACKGROUNDS - ****************************************/ #footer_bg { width:100%; background-color:#090909; background-image:url(); margin-left:auto; margin-right:auto; position:absolute; z-index:3;} #topholder_bg { width:100%; height:60px; position:absolute; top:0px; z-index:2; } #bottomholder_bg { width:100%; height:80px; margin-top:-70px; background-color:white; position:relative; z-index:2; } @media only screen and (min-width: 480px) and (max-width: 767px) { #topholder_bg { height:90px;} #bottomholder_bg { height:90px; margin-top:-90px;} } @media only screen and (min-width:350px) and (max-width: 479px) { #topholder_bg { height:90px;} #bottomholder_bg { height:110px; margin-top:-110px;} } @media only screen and (min-width:0px) and (max-width: 349px) { #topholder_bg { height:90px;} #bottomholder_bg { height:110px; margin-top:-110px;} } .footer_container { background-color:#222; width:100%; position:relative;z-index:5;} /************************************************** - TOP & BOTTOM - CONTAINER WITH SOCIALS - ****************************************************/ #topwrapper, #bottomwrapper { width:100%; position:relative;z-index:15;} #bottomwrapper { position:relative;} #topwrapper .cont, #bottomwrapper .cont { max-width:940px; position:relative; z-index:100; margin:auto;} #topwrapper .expandable, #bottomwrapper .expandable { height:60px; position:relative; z-index:30;background-color:white;} #topwrapper .info, #bottomwrapper .info { font-family:Arial; font-size:; color:#666; padding-top:24px;} #topwrapper .info a, #bottomwrapper .info a { margin-left:20px; } #topwrapper .expander { background:url(https://www.drive4d.com/wp-content/themes/escalation/images/tiles/top_arrow_expanded.png) no-repeat top center; width:100%; height:10px; left:0px; z-index:50; cursor:pointer;} #bottomwrapper .expander { background:url(https://www.drive4d.com/wp-content/themes/escalation/images/tiles/footer_arrow_expanded.png) no-repeat top left; width:21px; height:10px; left:50%; right:50%; top:0px; position:absolute; z-index:5000; cursor:pointer; margin-left:-9px; } #topwrapper .expander.selected { background:url(https://www.drive4d.com/wp-content/themes/escalation/images/tiles/top_arrow_collapsed.png) no-repeat top; height:14px; } #bottomwrapper .expander.selected { background:url(https://www.drive4d.com/wp-content/themes/escalation/images/tiles/footer_arrow_collapsed.png) no-repeat top center; top:-14px; height:14px; width:100%;left:0px;margin-left:0px; } /************************************ - SOCIAL WRAPPER - *************************************/ .social_wrapper { position:relative; height:30px; margin-top:36px; float:right;} .social_wrapper .social { float:left; margin-left:5px; cursor:pointer;} .social_wrapper .social:first-child { margin-left:0px;} .social { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.8s ease-out; -ms-transition: all 0.3s ease-in-out; } .social:hover { background-position:top right;} @media only screen and (min-width: 768px) and (max-width: 959px) { #topwrapper .info, #bottomwrapper .info { margin-left:10px;} #topwrapper .cont, #bottomwrapper .cont { max-width:768px;} .social_wrapper { margin-right:10px;} #topwrapper .expander { right:10px;} } @media only screen and (min-width: 480px) and (max-width: 767px) { #topwrapper .cont, #bottomwrapper .cont { max-width:430px;} #topwrapper .info, #bottomwrapper .info { padding-top:5px;text-align:center;} .social_wrapper { position:relative; height:30px; margin-top:8px;margin-left:auto;margin-right:auto;width:280px;float:none;} #topwrapper .expandable { height:90px;} #bottomwrapper .expandable { height:70px;} #bottomwrapper .expandable { padding-top:10px; padding-bottom:10px;} #topwrapper .expandable { margin-top:-1px;} } @media only screen and (min-width: 0px) and (max-width: 479px) { #topwrapper .cont, #bottomwrapper .cont { max-width:310px;} #topwrapper .info, #bottomwrapper .info { padding-top:5px;text-align:center;} .social_wrapper { position:relative; height:30px; margin-top:8px;margin-left:auto;margin-right:auto;width:280px;float:none;} #topwrapper .expandable, #bottomwrapper .expandable { height:90px;} #bottomwrapper .expandable { padding-top:10px; padding-bottom:10px;} #topwrapper .expandable { margin-top:-1px;} } /******************************* - MENU / HEAD - ********************************/ #sitetitle { position:relative; margin-left:0px; margin-top:6px; /*margin-bottom:40px;*/ } #sitetitle h1 { font-family:Arial; color:#000; font-weight:bold; letter-spacing:-1px; font-size:24px; line-height:35px; margin-bottom:7px !important; } #sitetitle span { font-family:Arial; color:#000; font-weight:bold; letter-spacing:-1px; font-size:24px; padding:10px 20px; background-color:RGBA(255,255,255,0.2); line-height:35px; } #sitetitle_dummy { height:10px;width:1px; } .header { margin-left:auto; margin-right:auto; } #nav { float:left; position:relative; z-index:1000; height:auto; margin-top:37px; font-size:12px !important; font-family:Arial; color:#fff; font-weight:bold; } #nav a { color:#fff ; padding:8px 15px 8px 15px; } /*.menubg { z-index:9; position:absolute;background:#666;top:0px;left:0px;width:100%;height:100%;position:absolute;border-bottom:1px solid #333;}*/ .submenubg { z-index:1; position:absolute;background:#333;top:0px;left:0px;width:100%;height:100%;position:absolute; -webkit-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.5);box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.2); } #nav ul { list-style:none; position:relative;} #nav ul>li { float:left; position:relative; z-index:10; cursor:pointer; line-height:30px; } #nav >ul>li { background:url(https://www.drive4d.com/wp-content/themes/escalation/images/tiles/mainmenuselect.png) repeat-x 0px 30px; background-color:#666; -webkit-transition: background-position 0.2s ease-out; -moz-transition: background-position 0.2s ease-out; -o-transition: background-position 0.2s ease-out; -ms-transition: background-position 0.2s ease-out; } #nav >ul>li:hover, #nav >ul>li.current-menu-item, #nav >ul>li.current-menu-parent, #nav >ul>li.current_page_ancestor { background:url(https://www.drive4d.com/wp-content/themes/escalation/images/tiles/mainmenuselect.png) repeat-x 0px 0px ; border-top:4px solid #67cc23;margin-top:-4px; background-color:#666; } #nav ul li ul a { padding:10px 60px 10px 0px; font-size:11px !important; } #nav ul li:first-child { margin-left:0px;} #nav ul>li:last-child { margin-right:0px;} #nav >ul>li>ul { display:none; top: 24px; width:200px; left: -30px; position:absolute; z-index:8;} #nav ul li ul li { margin-left:0px !important; margin-right:0px !important;clear:both; padding:0px 15px 0px 15px; font-weight:normal;font-size:12px;font-family:arial; border-bottom:1px solid #222; border-top:1px solid #444; width:170px; margin-bottom:0px; line-height:30px; height:30px; background:#333; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; } #nav ul li ul li a { -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; } #nav ul li ul li:hover { background:#67cc23;} #nav ul li ul li:hover a { color:#333333;} #nav ul li ul li:first-child { clear:both; border-top:none;} #nav .last { clear:both; border-bottom:none;} #nav ul li ul li ul { position:absolute; display:none; top:-6px;left:170px;padding:0px 1px; width:200px;} #nav ul li ul li:hover ul { display:block;} #nav ul li ul li ul li:hover { background:#67cc23;} #nav ul li ul li ul li { margin-left:0px !important; margin-right:0px !important;clear:both; padding:0px 15px 0px 15px; font-weight:normal;font-size:12px;font-family:arial; border-bottom:1px solid #222; border-top:1px solid #444; width:170px; margin-bottom:0px; line-height:30px; background:#333; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; } #nav ul li ul li ul li a { color:#fff !important;} #nav ul li ul li ul li:hover a { color:#333 !important;} .logo{ background:url(https://drive4d.com//wp-content/uploads/2012/12/4dlogo_h70.png) no-repeat; width:218px; height:69px; float:left; z-index:50; position:relative;} #responsive-menu {display:none;height:40px;overflow:visible;position:relative; margin-bottom:35px; z-index:99999;} #responsive-menu select { font-size:13px;width:100%;padding:10px;color:#999;border:none;background:#111; margin-top:20px;} #responsive-menu select.apple { color:#333;background-color:rgba(255,255,255,0.75);} #responsive-menu select option { padding-left:15px;} #responsive-menu select option:first-child { margin-top:15px;} #responsive-menu select option:last-child { margin-bottom:15px;} @media only screen and (min-width: 768px) and (max-width: 959px) { #responsive-menu { display:none;} #nav {display:block} #sitetitle {} } @media only screen and (min-width: 480px) and (max-width: 767px) { #nav { display:none} #responsive-menu { display:block;} #responsive-menu select { opacity:0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter: alpha(opacity=0);-moz-opacity: 0;-khtml-opacity: 0;opacity: 0;} #responsive-menu-button { color:#fff; font-size:12px; font-family:Arial; padding:10px;position:relative;background:url(https://www.drive4d.com/wp-content/themes/escalation/images/selectnav_420.png) no-repeat;width:420px;height:20px;margin-bottom:-60px;} #sitetitle { margin-top:15px !important;} } @media only screen and (min-width: 0px) and (max-width: 479px) { #nav {display:none} #responsive-menu-button { color:#fff; font-size:12px; font-family:Arial; padding:10px;position:relative;background:url(https://www.drive4d.com/wp-content/themes/escalation/images/selectnav_300.png) no-repeat;width:280px;height:20px;margin-bottom:-60px;} #responsive-menu { display:block;} #responsive-menu select { opacity:0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter: alpha(opacity=0);-moz-opacity: 0;-khtml-opacity: 0;opacity: 0;} #sitetitle { margin-top:15px !important;} } /******************************** - QUOTES - ********************************/ .quotes_background { width:100%; height:92px; background-color:rgba(255,255,255,0.20); position:relative;z-index:2;} #quotes_carousel { height: 92px; overflow: hidden; position: relative; width:100%; z-index:50; margin-top:-92px;} #quotes_carousel li { display:none; position:absolute; width:100%; height:92px;} .quote { font-family:Arial; font-size:25px; color:#333; position:relative; text-align:center; width:100%; letter-spacing:-1px;font-weight:bold; } @media only screen and (min-width: 768px) and (max-width: 959px) { } @media only screen and (min-width: 480px) and (max-width: 767px) { #quotes_carousel { height:90px;margin-bottom:70px;} /*margin-top:32px;*/ .quote { font-size:18px; line-height:25px;} } @media only screen and (min-width: 0px) and (max-width: 479px) { #quotes_carousel { height:90px; z-index:50; margin-bottom:70px;} /*margin-top:25px;*/ .quote { font-size:18px; line-height:25px;} } /******************************* - DIVIDER - ********************************/ .titledivider { position:relative;background-color:#333; padding:9px 0px 2px 0px; height: 29px; margin-bottom:1px; } .titledivider h3 { padding-left:15px; font-weight:bold !important; color:#fff;} .divide50 { height:50px;} .divide40 { height:50px;} .divide30 { height:30px;} .divide20 { height:20px;} .divide15 { height:15px;} .divide10 { height:10px;} .divide5 { height:5px;} .space70 { margin-bottom:50px; width:100%; } .space50 { margin-bottom:50px; width:100%; } .space20 { height:20px;width:100%;} /*THE LAST EXPANDABLE PART SHOULD HAVE AN OTHER MARGIN BOTTOM*/ .last.expandable .space70,.last.expandable .space50 {margin-bottom:0px;} .last.expandable .portfolio.last {margin-bottom:-70px} .expandable_fclass { margin-bottom:70px;} @media only screen and (min-width: 768px) and (max-width: 959px) { } @media only screen and (min-width: 480px) and (max-width: 767px) { .titledivider.columns.sixteen { margin-bottom:25px; } .space70 { margin-bottom:50px !important; } .space50 { margin-bottom:50px !important; } .lastexpandable .space70 {margin-bottom:0px !important;} } @media only screen and (min-width: 0px) and (max-width: 479px) { .titledivider.columns.sixteen { margin-bottom:25px; } .space70 { margin-bottom:50px !important; } .space50 { margin-bottom:50px !important; } .lastexpandable .space70 {margin-bottom:0px !important;} } /******************************** - PAGINATION - *********************************/ .pagination a, .pagination a:link, .pagination a:visited { font-family: Arial, sans-serif; float: left; height: 30px; line-height: 30px; font-size: 12px; border:none; font-weight:100; color: #fff !important; padding: 0 10px 0 10px; line-height: 29px; height: 29px; font-weight:bold; text-align: center; background-color:#000; text-decoration: none; border:none; -webkit-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.5);box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.2); -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; margin-right:1px; } .pagination a:hover, .pagination a.actpage { background:#67cc23;; color:#000 !important; } .pagination a.actpage { cursor:default !important;} .nextprevcat {color:555;} /******************************* - PORTFOLIO - ********************************/ .portfolio_filter { position:relative;background-color:#333; font-family:Arial; font-size: 18px; padding:0px 0px 10px 0px; margin-bottom:25px; letter-spacing:-1px;} .portfolio_filter ul li { float:left; padding-left:15px; margin-top:10px;} .portfolio_filter a, .portfolio_filter a:visited { padding-left:15px; font-weight:bold !important; color:#fff !important; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.8s ease-out; -ms-transition: all 0.3s ease-in-out; } .portfolio_filter a:first-child { padding-left:5px;} .portfolio_div { position:relative;height:auto; overflow:hidden;} .titledivider h3 { } .eight .portfolio_image { position:relative; width:100%; margin-bottom: -6px;max-height:100%} .four .portfolio_image { position:relative; width:100%; margin-bottom: -6px;} .killerclear { height:1px;} @media only screen and (min-width: 768px) and (max-width: 959px) { .eight .portfolio_image { position:relative; width:100%; margin-bottom: -6px;height:auto;max-height:100%;} .four .portfolio_image { position:relative; width:100%; margin-bottom: -6px;height:auto;max-height:100%;} } @media only screen and (min-width: 480px) and (max-width: 767px) { .nopadding { padding-bottom:0px !important; } .portfolio .alpha { margin-bottom:25px !important;} .portfolio .omega { margin-bottom:25px !important;} } @media only screen and (min-width: 0px) and (max-width: 479px) { .nopadding { padding-bottom:0px !important; } .portfolio .alpha { margin-bottom:25px !important;} .portfolio .omega { margin-bottom:25px !important;} } .nopadding { padding-bottom:0px !important; } /********************************* - COMMENT LISTS - **********************************/ .commentlist li { margin-bottom:1px;} .dividertitle { margin-bottom:0px !important;} .commentwrap { padding:20px; background:rgba(255,255,255,0.2); position:relative; } .commentwrap h5 { margin-bottom:5px;} .commentwrap .replylink a { margin-top:0px !important;} .commentwrap .timestamp span { font-size:11px;color:#fff; background-color:#666; padding:3px 5px; margin-right:1px; margin-top:0px; margin-bottom:1px; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; } .commentlist .depth-1 { width:100%; float:right; } .commentlist .depth-2 { width:98.5%; float:right;} .commentlist .depth-3 { width:97%; float:right; } .commentlist .depth-4 { width:95.5%; float:right; } .commentlist .depth-5 { width:94%; float:right; } .commentlist .depth-1 .commentwrap p { float:left; width:81%;} .commentlist .depth-2 .commentwrap p { float:left; width:80%;} .commentlist .depth-3 .commentwrap p { float:left; width:79%;} .commentlist .depth-4 .commentwrap p { float:left; width:78%;} .commentlist .depth-5 .commentwrap p { float:left; width:76%;} .commentlist ul, .commentlist ol { font-size: 100%; } .posterpic { width:80px !important;height:80px !important;float:left; margin-right:20px;} .posterpic img { width:100%;margin-bottom:-6px} .commentwrap .replylink { position:absolute; right:20px;top:20px;} .postertext {overflow:auto;} @media only screen and (min-width: 768px) and (max-width: 959px) { .commentlist .depth-1 .commentwrap p { float:left; width:76%;} .commentlist .depth-2 .commentwrap p { float:left; width:75%;} .commentlist .depth-3 .commentwrap p { float:left; width:73%;} .commentlist .depth-4 .commentwrap p { float:left; width:71%;} .commentlist .depth-5 .commentwrap p { float:left; width:69%;} } @media only screen and (min-width: 480px) and (max-width: 767px) { .posterpic {width:50px; height:50px;} .commentlist .depth-1 .commentwrap p { float:left; width:78%;} .commentlist .depth-2 .commentwrap p { float:left; width:77%;} .commentlist .depth-3 .commentwrap p { float:left; width:74%;} .commentlist .depth-4 .commentwrap p { float:left; width:72%;} .commentlist .depth-5 .commentwrap p { float:left; width:71%;} } @media only screen and (min-width: 0px) and (max-width: 479px) { .posterpic {display:none;} .commentlist .depth-1 .commentwrap p { float:left; width:100%;} .commentlist .depth-2 .commentwrap p { float:left; width:100%;} .commentlist .depth-3 .commentwrap p { float:left; width:100%;} .commentlist .depth-4 .commentwrap p { float:left; width:100%;} .commentlist .depth-5 .commentwrap p { float:left; width:100%;} } /******************************* - WP CORE STYLES - ********************************/ .alignnone { margin: 5px 20px 20px 0;} .aligncenter, div.aligncenter { display:block; margin: 5px auto 5px auto;} .wp-caption { background: #fff; border: 1px solid #f0f0f0; max-width: 96%; /* Image does not overflow the content area */ padding: 5px 3px 10px; text-align: center;} .wp-caption.alignnone { margin: 5px 20px 20px 0; } .wp-caption.alignleft { margin: 5px 20px 20px 0; } .wp-caption.alignright { margin: 5px 0 20px 20px; } .wp-caption img { border: 0 none; height: auto; margin:0; max-width: 98.5%; padding:0; width: auto;} .wp-caption p.wp-caption-text { font-size:11px; line-height:17px; margin:0; padding:0 4px 5px; } img.size-auto, img.size-large, img.size-full, img.size-medium { max-width: 100%; height: auto;} .alignleft, img.alignleft { display: inline; float: left; margin-right: 20px; margin-top: 0px;} .alignright, img.alignright { display: inline; float: right; margin-left: 20px; margin-top: 0px;} .aligncenter, img.aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto;} img.alignleft, img.alignright, img.aligncenter { margin-bottom: 20px;} .bordered { } .bypostauthor {} .sticky{} .gallery-caption{} /*************************************** - COLLAPSE / EXPAND BUTTONS - ****************************************/ .collapse { margin-top:-8px; width:40px; height:40px; background:url(https://www.drive4d.com/wp-content/themes/escalation/images/tiles/collapse_arrow.png) top left; cursor:pointer; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; } .expand { margin-top:-8px; width:40px; height:40px; background:url(https://www.drive4d.com/wp-content/themes/escalation/images/tiles/collapse_arrow.png) top right; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; cursor:pointer;} .collapse:hover { background-position:bottom left; } .expand:hover { background-position:bottom right; } /******************************* - SIDEBAR - ********************************/ .sidebar { margin-top:0px;} .sidebar .widget { font-size:12px;float: left; margin-bottom: 25px; width: 100%; } .sidebar .widget.last { margin-bottom:0px;} .sidebar .widget h5 { color: #fff; line-height: 20px; margin-bottom: 23px; position:relative; } .sidebar .widget ul li { margin-bottom: 2px; } .sidebar .widget ul { margin-bottom: 0; } .sidebar h5 { margin-top:40px; background-color:#222; padding:4px 15px 5px 20px; margin-bottom:20px; margin-left:-20px; margin-right:-20px; } .sidebar h5:first-child { margin-top:0px;} .sidebar #twitter_feed_icon { width: 24px; height: 24px; float: left; margin-right: 8px;} .sidebar,sidebar p { font-size:12px; } .sidebar a, .sidebar a:visited { color:#000; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.8s ease-out; -ms-transition: all 0.3s ease-in-out; } .sidebar a:hover { color:#555; } .sidebar .blogdetail a, .sidebar .blogdetail a:visited, .sidebar .twitter_reader_list a, .sidebar .twitter_reader_list a:visited { font-weight:bold; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.8s ease-out; -ms-transition: all 0.3s ease-in-out; } .sidebar p { margin-bottom:0 !important; } .sidebar .widget li { font-size:12px; color:#000; border-bottom:1px solid #fff; padding:3px 0px 3px 0px;} .sidebar .widget ul { border-top:1px solid #fff;} .home .widget {margin-bottom:0px;} .lite_sidebar #quickcontact .InputBox, .lite_sidebar #quickcontact .TextBox { width:174px !important;} @media only screen and (min-width: 480px) and (max-width: 767px) { .widget { margin-bottom:60px !important;} } @media only screen and (min-width: 0px) and (max-width: 479px) { .widget { margin-bottom:60px !important;} } /******************************** - FOOTER - *********************************/ #footer { margin-top:95px; font-size:12px !important;} .footer_wrap { padding:8px 0px 8px 0px;} #footer h5, #footer h3 { position:relative;color:#fff; margin-bottom:20px;} #footer h6 { color:#fff;} #footer #twitter_feed_icon { width: 24px; height: 24px; float: left; margin-right: 8px;} #footer, #footer p { font-size:12px; color:#fff; } #footer p { margin-bottom:0 !important; } #footer .widget a, #footer .widget a:visited { color: #67cc23 !important; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; } #footer .widget a:hover { color: #999 !important;} #footer .widget li { font-size:12px; color:#fff>; border-bottom:1px solid #131313; padding:3px 0px 3px 0px;} #footer .widget ul { border-top:1px solid #131313;} #footer .widget .topline, #footer .widget .topline:link, #footer .widget .topline:visited { color:#fff !important; font-weight:bold;-webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.8s ease-out; -ms-transition: all 0.3s ease-in-out; } #footer .widget .topline:hover { color:#999 !important; font-weight:bold; } #footer .widget .blog_miniimagewrap { margin-top:5px;} #footer .widget .buttondark:link, #footer .widget .buttondark:visited { color:#000 !important; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.8s ease-out; -ms-transition: all 0.3s ease-in-out; } #footer .widget .buttondark:hover { color:#fff !important;} #footer .widget { border-right:1px solid #151515; border-left:1px solid #333; padding:0px 20px; width:200px; height:100%} #footer .widget:first-child { border-left:none; padding-left:0px;} #footer .widget.omega { border-right:none; padding-right:0px;} #footer .four.columns { margin-left:0px !important; margin-right:0px !important; } @media only screen and (min-width: 768px) and (max-width: 959px) { #footer .widget { width:150px; } } @media only screen and (min-width: 480px) and (max-width: 767px) { #footer .widget { width:420px; padding:0px; margin:0px; border:none;} } @media only screen and (min-width: 0px) and (max-width: 479px) { #footer .widget { width:300px; padding:0px; margin:0px; border:none;} } /******************************* - TWITTER Widget - ********************************/ .twitter_reader_list { overflow:hidden; border:0 !important;} .twitter_reader_quote { float:left;} .twitter_reader_list li { list-style-type:none; text-align: left; margin-bottom: 10px !important; border-bottom:0 !important; padding-left: 0px; } /* Last LI element in column has no dividing line build by border-bottom */ .twitter_reader_list li.last { margin-bottom: 0 !important; } .twitter_reader_list li a { text-decoration: none;} .twitter_reader_list span { color:#fff; font-weight: bold;} .twitter_reader_list li span { color:#555;} #footer .twitter_reader_list { margin-top:-3px;} /******************************* - MINIGAL Widget - ********************************/ /*.mini_gallery li img{ padding: 4px; background-color: ; border: 1px solid ; }*/ .minigal_div { position:relative;height:auto; float:left; } .minigal_div { margin-bottom:4px !important;margin-right:4px !important; } .minigal_div.verylast { margin-bottom:0px !important; } .minigal .verylast { margin-bottom:0; } .minigal img { margin-bottom: -6px; } @media only screen and (min-width: 480px) and (max-width: 767px) { .minigal_div { margin-left: 6px; margin-right:0px; } } .download_link { padding-top: 20px;clear: both; } .download_link img { margin-bottom : 0 !important; } /********************************** - BUTTONS & BANNER BUTTONS- ***********************************/ /** DARK BUTTONS **/ .tpbutton, .submitbutton, .dark .kb-button, .buttondark, buttondark a { font-family: Arial, sans-serif; float: left; height: 30px; line-height: 30px; font-size: 12px; border:none; font-weight:100; } #commentfields .submitbutton, .tpbutton:link, .tpbutton:visited, .tpbutton, .dark .kb-button:link, .buttondark:link, .dark .kb-button:visited , .buttondark:visited, buttondark a:link, buttondark a:visited { color: #000 !important; padding: 0 20px 0 20px; line-height: 29px; height: 29px; font-weight:bold; text-align: center; background:#67cc23; text-decoration: none; border:none; -webkit-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.5);box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.2); -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; } #commentfields .submitbutton, #quickcontact .buttondark, #contactus .buttondark { margin-top:10px; } .tpbutton:hover, .dark .kb-button:hover, .buttondark:hover, .buttondark a:hover, .dark .comment-reply-link:hover { text-decoration: none; border:none; color:#fff !important;border:none; background-color:#000; } /** LIGHT BUTTONS OLD .light .kb-button , .buttonlight { color:#fff !important; font-family: Arial, sans-serif; float: left; height: 31px; line-height: 30px; font-size: 12px; } .light .kb-button:link, .buttonlight:link, .light .kb-button:visited, .buttonlight:visited { color: #333 !important; padding: 0 20px 0 20px; text-align: center; background: url('https://www.drive4d.com/wp-content/themes/escalation/images/button/button_light.png') repeat-x center top; text-decoration: none; border:none; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.8s ease-out; -ms-transition: all 0.3s ease-in-out; } .light .kb-button:hover, .buttonlight:hover, .light .comment-reply-link:hover { background-position:bottom; text-decoration: none; color: #000 !important;border:none; font-weight:100;} */ /** LIGHT BUTTONS **/ .buttonlight, .buttonlight a { font-family: Arial, sans-serif; float: left; height: 30px; line-height: 30px; font-size: 12px; border:none; font-weight:100; } .buttonlight:link, .buttonlight:visited, .buttonlight a:link, .buttonlight a:visited { color: #fff !important; padding: 0 20px 0 20px; line-height: 29px; height: 29px; font-weight:bold; text-align: center; background:#000; text-decoration: none; border:none; -webkit-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.5);box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.2); -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; } .buttonlight:hover, .buttonlight a:hover { text-decoration: none; border:none; color:#000 !important;border:none; background-color:#67cc23; } .replylink a {margin-top:30px;} /****************************** - TEXT STYLES - *******************************/ .texthighlight { background:#67cc23; color:#000; padding-left: 5px; padding-right: 5px; padding-top: 2px; padding-bottom: 2px; } .texthighlight_black { background:#000; color:#fff; padding-left: 5px; padding-right: 5px; padding-top: 2px; padding-bottom: 2px; } /****************************** - INPUTBOX - *******************************/ #quickcontact { padding-top:5px;} #search .InputBox, #commentfields .InputBox, #commentfields .TextBox, #contactus .InputBox, #contactus .TextBox , #quickcontact .InputBox, #quickcontact .TextBox { width:214px; float:left; border:1px solid #fff; background-color:RGBA(255,255,255,0.20); padding-left:10px; color:#000;} #footer #quickcontact .InputBox, #footer #quickcontact .TextBox { background:#191919; color:#fff; border-color:#333;} #contactus .TextBox { min-height:140px; } #quickcontact .TextBox { min-height: 100px;} #search .Button { float:left; position:relative; margin-left:-28px; background:url(https://www.drive4d.com/wp-content/themes/escalation/images/tiles/lupe.png) no-repeat top ;width:13px;height:17px;border:none; margin-top:10px; } #search .Button:hover { background-position:bottom;} #search input { margin-bottom: 0; padding-bottom: 8px; } .sixteen #commentfields .InputBox, .sixteen #contactus .InputBox { float:left;width:290px !important;margin-right:10px;} .eleven #commentfields .InputBox, .eleven #contactus .InputBox { float:left;width:194px !important;margin-right:10px;} .sixteen #commentfields .TextBox,.sixteen #contactus .TextBox { width: 922px; } .eleven #commentfields .TextBox ,.eleven #contactus .TextBox { width: 634px; } #commentfields .InputBox.last,.sixteen #contactus .InputBox.last,#quickcontact .InputBox.last { margin-right:0;} @media only screen and (min-width: 768px) and (max-width: 959px) { .sixteen #commentfields .InputBox,.sixteen #contactus .InputBox { float:left;width:226px !important;margin-right:10px;} .eleven #commentfields .InputBox,.eleven #contactus .InputBox { float:left;width:146px !important;margin-right:10px;} .sixteen #commentfields .TextBox,.sixteen #contactus .TextBox,.sixteen #quickcontact .TextBox { width:729px;} .eleven #commentfields .TextBox { width:490px;} #commentfields .InputBox.last, #contactus .InputBox.last, #quickcontact .InputBox.last { margin-right:0;} #search .InputBox { width:176px;} .sixteen #quickcontact .InputBox, .sixteen #quickcontact .TextBox { width:156px; } } @media only screen and (min-width: 480px) and (max-width: 767px) { .sixteen #commentfields .InputBox,.sixteen #contactus .InputBox,.sixteen #quickcontact .InputBox { float:none;width:403px !important;margin-right:0;} .eleven #commentfields .InputBox,.eleven #contactus .InputBox { float:none;width:403px;margin-right:0;} .sixteen #commentfields .TextBox, .sixteen #contactus .TextBox, .eleven #commentfields .TextBox, .eleven #contactus .TextBox,.sixteen #quickcontact .TextBox, .eleven #quickcontact .TextBox, #search .InputBox { width:403px !important;} } @media only screen and (min-width: 0px) and (max-width: 479px) { .eleven #commentfields .InputBox, .sixteen #commentfields .InputBox ,.eleven #contactus .InputBox, .sixteen #contactus .InputBox,.sixteen #quickcontact .InputBox { float:none;width:285px !important;margin-right:0;} .sixteen #commentfields .TextBox, .eleven #commentfields .TextBox,.sixteen #contactus .TextBox,.sixteen #quickcontact .TextBox, .eleven #contactus .TextBox, #search .InputBox { width:285px !important;} } /********************************* - BLOG - **********************************/ .eight .blog_imagewrap {width:120px;margin-right:20px;float:left;} .eight .blog_detailswrap {width:320px;float:left; } .blog_detailswrap h5 { margin-top:2px; } .blog_detailswrap p { margin-bottom:10px;} .blog .topline a, .blog .topline a:visited { color:#000; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.8s ease-out; -ms-transition: all 0.3s ease-in-out; } .blog h3.topline { margin-top:0px;} @media only screen and (min-width: 768px) and (max-width: 959px) { .eight .blog_imagewrap {width:90px;margin-right:20px;float:left;} .eight .blog_detailswrap {width:250px;float:left;margin-top:-6px;} } @media only screen and (min-width: 480px) and (max-width: 767px) { .eight .blog_imagewrap { width:110px;margin-right:20px;float:left;} .eight .blog_detailswrap { width:290px;float:left;margin-top:-6px;} .eight, .eleven { margin-bottom:40px !important;} .four { margin-bottom:25px !important;} .eight:last-child, .four:last-child, .eleven:last-child { margin-bottom:0px !important;} } @media only screen and (min-width: 0px) and (max-width: 479px) { .eight .blog_imagewrap {width:60px;margin-right:20px;float:left;} .eight .blog_detailswrap {width:220px;float:left;margin-top:-6px;} .eight , .eleven { margin-bottom:40px !important;} .four { margin-bottom:25px !important;} .eight:last-child, .four:last-child { margin-bottom:0px !important;} } .blog h3 { margin-top:15px;margin-bottom:10px;} .noblog h3 { margin-top:0px;} .blogimage, .blog_image { width:100%; margin-bottom:-6px;} .blogbanner_wrap {position:relative;width:100%;height:auto;} .sixteen .blogbannercontainer { max-width:960px; height:320px; background-color:#111; position:relative; overflow:visible;} .eleven .blogbannercontainer { max-width:640px; height:200px; background-color:#111; position:relative; overflow:visible;} .blogbannercontainer ul >li { visibility:hidden;} .blogbanner_wrap .slide_mainmask {top: 5px !important; left: 5px !important;} /** BLOGPOSTS **/ .blogposts { margin-top:10px;} .blogposts p { font-size:12px; line-height:20px !important; color:#222222; } .blogdetail { margin-left:10px;} .blogdetail_nopic { margin-left:0;margin-right:0;} .blogdetail.right { margin-right:10px;} #footer .blogdetail p, .sidebar .blogdetail p { color:#555; font-weight:bold;} .blogposts .blog_miniimagewrap { width:50px;height:50px;float:left;margin-right: 10px; } .blog_miniimagewrap { width:50px;height:50px; } .blogposts .bordered { } /** SMALL ICONS FOR BLOGS **/ .blog { color:#222222; font-size:12px !important; line-height:20px !important; font-family:Arial;} .blogdate, .bloguser,.blogtags, .blogcomment, .blogcategory { font-size:11px;color:#fff; float:left; background-color:#666; padding:0px 5px; margin-right:1px; margin-top:0px; margin-bottom:1px; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; cursor:pointer; } .blogdate { cursor:default;} .bloguser:hover,.blogtags:hover, .blogcomment:hover, .blogcategory:hover { background-color:#000; cursor:pointer; } .blogdate a:link, .blogdate a:visited, .bloguser a:link, .bloguser a:visited, .blogtags a:link, .blogtags a:visited, .blogcomment a:link, .blogcomment a:visited, .blogcategory a:link, .blogcategory a:visited { color:#fff; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.8s ease-out; -ms-transition: all 0.3s ease-in-out; } .blogdate a:hover, .bloguser a:hover, .blogtags a:hover, .blogcomment a:hover, .blogcategory a:hover { color:#fff;} .blogdivider { border-top:1px solid #1e1e1e; border-bottom:1px solid #0e0e0e;margin-top:40px;margin-bottom:40px;} .blogarchiv { font-size:11px; color:#777; border-bottom:1px solid #131313; padding:3px 0px 3px 0px;} .blogarchiv.first { border-top:1px solid #131313;} /** SOCIAL SHARES **/ .socialshare_wrap { cursor:pointer; color:#fff; font-size:12px; font-family:Arial; padding:9px 15px 9px 15px; background-color:#666; margin-top:-10px; opacity:0; filter: alpha(opacity=0); -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; } .socialshares { float:left; line-height:22px;} .socialexpander { cursor:pointer; background:url(https://www.drive4d.com/wp-content/themes/escalation/images/tiles/share_plusminus.png) no-repeat top; width:12px; height:12px; float:left; margin:5px 10px 0px 0px ; opacity:1; filter: alpha(opacity=100); -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; } .socialshare_wrap:hover .socialexpander { opacity:0.2; filter: alpha(opacity=20); -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=20)"; } .socialexpander.selected { background-position:bottom;} .sharings { float:left;margin-left:15px;margin-top:1px;} .shgoogleplus { width:50px; height:20px;margin-right: 10px;} .shfacebook { width:75px; height:20px} .shtwitter { width:77px; height:20px;} @media only screen and (min-width: 768px) and (max-width: 959px) { } @media only screen and (min-width: 480px) and (max-width: 767px) { .sharings { clear:both; margin-left:0px;} .shgoogleplus { height:25px; margin-top:10px;} .shfacebook { height:25px;margin-top:10px;} .shtwitter { height:25px;margin-top:10px;} } @media only screen and (min-width: 0px) and (max-width: 479px) { .sharings { clear:both; margin-left:0px;} .shgoogleplus { height:25px; margin-top:10px;} .shfacebook { height:25px;margin-top:10px;} .shtwitter { height:25px;margin-top:10px;} } /***************************************** - RESPONSIVE VIDEO CONTAINER - ******************************************/ .eleven .video-container { position: relative; padding-bottom: 56.25%; padding-top: 10px; height: 0; overflow: hidden;} .sixteen .video-container { position: relative; padding-bottom: 56.25%; padding-top: 10px; height: 0; overflow: hidden;} .eleven .video-wrapper { width: 650px; max-width: 100%; } .sixteen .video-wrapper { width: 940px; max-width: 100%; } .video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%;} .video-container_master {margin-bottom:20px;} .sidebar .video-container_master {margin-bottom:0;} .sixteen .html5video { width:940px; height:523px} .sixteen .html5audio { width:940px; height:auto;} .eleven .html5video { width:650px; height:353px} .eleven .html5audio { width:650px; height:auto;} @media only screen and (min-width: 768px) and (max-width: 959px) { .sixteen .html5video { width:748px; height:413px} .sixteen .html5audio { width:748px;} .eleven .html5video { width:508px; height:277px} .eleven .html5audio { width:508px;} } @media only screen and (min-width: 480px) and (max-width: 767px) { .sixteen .html5video { width:420px; height:230px} .sixteen .html5audio { width:420px; } .eleven .html5video { width:420px; height:230px} .eleven .html5audio { width:420px; } } @media only screen and (min-width: 0px) and (max-width: 479px) { .sixteen .html5video { width:300px; height:163px} .sixteen .html5audio { width:300px; } .eleven .html5video { width:300px; height:163px} .eleven .html5audio { width:300px; } } audio {width:100% !important;} .mejs-controls .mejs-time-rail .mejs-time-loaded , .mejs-controls .mejs-time-rail .mejs-time-loaded, .mejs-controls .mejs-time-rail .mejs-time-loaded { background: #67cc23 !important;} .html5audio .mejs-container {width:100% !important;} /*************************************/ /* TEASER */ /*************************************/ .teaser_div { position:relative;height:auto;} .teaser_image { width:100%; margin-bottom: -6px;} .darker_overlay { width:100%;height:100%;background:rgba(103,204,35,0.5); position:absolute;z-index:10;} .hover_plus { margin-left:-18px !important;margin-top:-18px !important;width:36px;height:36px;background:url(https://www.drive4d.com/wp-content/themes/escalation/images/tiles/plus_link.png) no-repeat top left; position:absolute;top:50%;left:50%;z-index:20;} .hover_link { margin-left:-18px;margin-top:-18px;width:36px;height:36px;background:url(https://www.drive4d.com/wp-content/themes/escalation/images/tiles/plus_link.png) no-repeat bottom left;position:absolute;top:50%;left:50%;z-index:20; } .teaser_title { font-size:11px; font-family:Arial; font-weight:bold;background:url(https://www.drive4d.com/wp-content/themes/escalation/images/bg/black50.png) repeat; color:#fff; text-align:center; width:100%; padding:3px 3px 3px 3px; position:absolute;bottom:0px;z-index:20;} @media only screen and (min-width: 768px) and (max-width: 959px) { .teaser_image { width:100%; margin-bottom: -5px;} } @media only screen and (min-width: 480px) and (max-width: 767px) { .teaser_image { width:100%; margin-bottom: -6px;} } @media only screen and (min-width: 0px) and (max-width: 479px) { .teaser_image { width:100%; margin-bottom: -6px;} } @media only screen and (min-width: 480px) and (max-width: 767px) { .teaser .alpha { margin-bottom:25px !important;} .teaser .omega { margin-bottom:25px !important;} .teaser .verylast { margin-bottom:0px !important;} } @media only screen and (min-width: 0px) and (max-width: 479px) { .teaser .alpha { margin-bottom:25px !important;} .teaser .omega { margin-bottom:25px !important;} .teaser .verylast { margin-bottom:0px !important;} } .teaser .alpha { clear:both; } .teaser .omega { } /********************************************************************** - BANNERS - **********************************************************************/ /************************************ - DARK-LIGHTBOX STYLE - ************************************/ .dark-lightbox.overlay{ background-color:#000; z-index:999990; position:fixed; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter: alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; } .dark-lightbox.loader{ width:64px; height:64px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; margin-left:-32px; margin-right:-32px; position:fixed; z-index:999991; background:url(https://www.drive4d.com/wp-content/themes/escalation/images/loader/preloader.gif) no-repeat 50% 50%; /*width:32px; height:32px; left:50%; top:50%; z-index:9999; background-color: #000; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 10px; margin-left: -21px; margin-top:-21px;*/ } .dark-lightbox.lightboxitem{ position:fixed; width:300px; height:auto; background-color:#111; border:1px solid #1e1e1e; padding:4px; z-index:999992; } .dark-lightbox.infofield{ padding-top:10px; padding-bottom:10px; padding-left:10px; padding-right:10px; line-height:15px; } .dark-lightbox.infofield .title{ font-family: Arial, sans-serif; font-size: 12px; font-weight: normal; color:#555; float:left; margin-right:10px; margin-bottom:10px; font-weight:bold; } .dark-lightbox.infofield .pageofformat{ font-family: Arial, sans-serif; font-size: 12px; font-weight: normal; color:#555; float:right; margin-bottom:10px; } .dark-lightbox.infofield .lightboxsocials{ float:left; } .dark-lightbox.infofield .lightboxsocials .twitter, .dark-lightbox.infofield .lightboxsocials .facebook, .dark-lightbox.infofield .lightboxsocials .googleplus { float:left; margin-bottom:10px; height:25px; width:120px; overflow:hidden; } .dark-lightbox.description{ clear:both; font-family: Arial, sans-serif; font-size: 12px; font-weight: normal; color:#555; margin-bottom:10px; } .dark-lightbox.leftbutton{ width:9px; height:16px; float:right; margin-right:10px; cursor:pointer; background:url('https://www.drive4d.com/wp-content/themes/escalation/images/button/arrowleft.png') no-repeat top; } .dark-lightbox.rightbutton{ width:9px; height:16px; float:right; margin-left:10px; cursor:pointer; background:url('https://www.drive4d.com/wp-content/themes/escalation/images/button/arrowright.png') no-repeat top; } .dark-lightbox.closebutton{ width:30px; height:30px; right:10px; top:10px; position:absolute; cursor:pointer; background:url('https://www.drive4d.com/wp-content/themes/escalation/images/button/close_dark.png') no-repeat top; } .dark-lightbox.leftbutton:hover, .dark-lightbox.rightbutton:hover, .dark-lightbox.closebutton:hover{ background-position:bottom; } @media only screen and (min-width: 768px) and (max-width: 959px) { } @media only screen and (max-width: 767px) { } @media only screen and (min-width: 480px) and (max-width: 767px) { } @media only screen and (min-width: 0px) and (max-width: 479px) { } /************************************ - CONTACT - ************************************/ #googlemap { width: 100%; height: 250px; float: left; } .errormessage, .sendingmessage, .successmessage { float: left !important; color: #000; font-size: 12px; line-height: 30px; text-decoration: none; display: none; margin-left: 20px;} #quickcontact .successmessage,#quickcontact .sendingmessage,#quickcontact .errormessage { margin-left:0 !important; } message { color: #000 !important; } input[type="text"].formerror, textarea.formerror { border: 1px solid #000 !important; } #footer .errormessage, #footer .sendingmessage,#footer .successmessage { color: #fff; } #footer input[type="text"].formerror, textarea.formerror { border: 1px solid #fff !important; } /************************************ - CONTENT SHORTCODES - ************************************/ .contentdivider { width: 100%; height: 0; border-bottom: 1px solid #ddd; margin-bottom: 20px; } .one_half { width: 48%; } .one_third { width: 30.66%; } .two_third { width: 65.33%; } .one_fourth { width: 22%; } .one_fifth { width: 16.8%; } .one_sixth { width: 13.33%; } .one_half, .one_third, .two_third, .one_fourth, .one_fifth, .one_sixth { margin-right: 4%; margin-bottom: 0px; float: left; } .lastcolumn { margin-right: 0!important; clear: right; } @media only screen and (max-width: 767px) { .one_half, .one_third, .two_third, .one_fourth, .one_fifth, .one_sixth { width: 100%; } } @media only screen and (min-width: 480px) and (max-width: 767px) { .one_half, .one_third, .two_third, .one_fourth, .one_fifth, .one_sixth { margin-bottom: 20px; } .one_half.lastcolumn, .one_third.lastcolumn, .two_third.lastcolumn, .one_fourth.lastcolumn, .one_fifth.lastcolumn, .one_sixth.lastcolumn { margin-bottom: 0px; } } @media only screen and (min-width: 0px) and (max-width: 479px) { .one_half, .one_third, .two_third, .one_fourth, .one_fifth, .one_sixth { margin-bottom: 20px; } .one_half.lastcolumn, .one_third.lastcolumn, .two_third.lastcolumn, .one_fourth.lastcolumn, .one_fifth.lastcolumn, .one_sixth.lastcolumn { margin-bottom: 0px; } } /* #Tabs (activate in tabs.js) ================================================== */ .sidebar ul.tabs { display: block; margin: 0 0 20px 0; padding: 0; border-bottom: solid 1px #fff; border-top: 0 !important; font-size:12px; } .sidebar ul.tabs li { display: block; width: auto; height: 30px; padding: 0 !important; float: left; margin-bottom: 0 !important; border-bottom:0 !important;} .sidebar ul.tabs li a { display: block; text-decoration: none; width: auto; height: 29px; padding: 0px 20px; line-height: 30px; border: solid 1px #fff; border-width: 1px 1px 0 0; margin: 0; background: rgba(255,255,255,0.2); font-size: 13px; } .sidebar ul.tabs li a.active { background: rgba(255,255,255,0.2); height: 30px; position: relative; border-left-width: 1px; margin: -8px 0 0 -1px; padding-top:4px; padding-bottom:4px; color: #000; } .sidebar ul.tabs li:first-child a.active { margin-left: 0; } .sidebar ul.tabs li:first-child a { border-width: 1px 1px 0 1px; } .sidebar ul.tabs li:last-child a { } .sidebar ul.tabs-content { margin: 0; display: block; border-top:0 !important; } .sidebar ul.tabs-content > li { display:none; } .sidebar ul.tabs-content > li.active { display: block; border-bottom:0 !important; font-size:12px !important;} /* Clearfixing tabs for beautiful stacking */ .sidebar ul.tabs:before, .sidebar ul.tabs:after { content: '\0020'; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; } .sidebar ul.tabs:after { clear: both; } .sidebar ul.tabs { zoom: 1; } @media only screen and (min-width: 480px) and (max-width: 767px) { .widget { margin-bottom:60px !important;} #tp_escalation_home_content .space70 { margin-bottom:0px !important;} } @media only screen and (min-width: 0px) and (max-width: 479px) { .widget { margin-bottom:60px !important;} #tp_escalation_home_content .space70 { margin-bottom:0px !important;} } /********************************************************************************************* - SET THE SCREEN SIZES FOR THE BANNER IF YOU WISH TO MAKE THE BANNER RESOPONSIVE - **********************************************************************************************/ .tp-simpleresponsive .caption { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; position:absolute; } /****************************** - SHADOWS - ******************************/ .tp-bannershadow { position:absolute; margin-left:auto; margin-right:auto; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -o-user-select: none; } .tp-bannershadow.tp-shadow1 { background:url(../assets/shadow1.png) no-repeat; background-size:100%; width:890px; height:30px; bottom:-30px;} .tp-bannershadow.tp-shadow2 { background:url(../assets/shadow2.png) no-repeat; background-size:100%; width:890px; height:60px;bottom:-60px;} .tp-bannershadow.tp-shadow3 { background:url(../assets/shadow3.png) no-repeat; background-size:100%; width:890px; height:60px;bottom:-60px;} /************************ - NAVIGATION - *************************/ /** BULLETS **/ .tp-bullets { z-index:100; position:absolute; bottom:10px; } .tp-bullets.simplebullets { bottom:10px;} .tp-bullets.simplebullets.navbar { bottom:-20px; background:url(../assets/navigdots_bgtile.png); height:35px; padding:0px 0px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px ;margin-top:-17px;} .tp-bullets.simplebullets .bullet { cursor:pointer; position:relative; background:url(../assets/bullets.png) no-Repeat bottom left; width:23px; height:23px; margin-right:0px; float:left; margin-top:-12px;} .tp-bullets.simplebullets .bullet.last { margin-right:0px;} /** SQUARE BULLETS **/ .tp-bullets.simplebullets.square .bullet { cursor:pointer; position:relative; background:url(../assets/bullets2.png) no-Repeat bottom left; width:19px; height:19px; margin-right:0px; float:left; margin-top:-10px;} .tp-bullets.simplebullets.square .bullet.last { margin-right:0px;} /** navbar NAVIGATION VERSION **/ .tp-bullets.simplebullets.navbar .bullet { cursor:pointer; position:relative; background:url(../assets/navigdots.png) no-Repeat bottom left; width:15px; height:15px; margin-left:5px !important; margin-right:5px !important;float:left; margin-top:10px;} .tp-bullets.simplebullets.navbar .bullet.first { margin-left:30px !important;} .tp-bullets.simplebullets.navbar .bullet.last { margin-right:30px !important;} .tp-bullets.simplebullets .bullet:hover, .tp-bullets.simplebullets .bullet.selected { background-position:top left; } /************************************* - TP ARROWS - **************************************/ .tp-leftarrow { z-index:100;cursor:pointer; position:relative; background:url(../assets/arrow_left.png) no-Repeat top left; width:26px; height:26px; margin-right:0px; float:left; margin-bottom:-2px; } .tp-rightarrow { z-index:100;cursor:pointer; position:relative; background:url(../assets/arrow_right.png) no-Repeat top left; width:26px; height:26px; margin-right:0px; float:left; margin-bottom:-2px;} .tp-leftarrow.navbar { z-index:100;cursor:pointer; position:relative; background:url(../assets/arrowleft.png) no-Repeat top left; width:9px; height:16px; float:left; margin-right:-20px; margin-bottom:10px;} .tp-rightarrow.navbar { z-index:100;cursor:pointer; position:relative; background:url(../assets/arrowright.png) no-Repeat top left; width:9px; height:16px; float:left; margin-left:-20px; margin-bottom:10px;} .tp-leftarrow.navbar.thumbswitharrow { margin-right:10px; } .tp-rightarrow.navbar.thumbswitharrow { margin-left:0px; } .tp-leftarrow.square { z-index:100;cursor:pointer; position:relative; background:url(../assets/arrow_left2.png) no-Repeat top left; width:12px; height:17px; float:left; margin-right:0px; margin-bottom:1px;} .tp-rightarrow.square { z-index:100;cursor:pointer; position:relative; background:url(../assets/arrow_right2.png) no-Repeat top left; width:12px; height:17px; float:left; margin-left:0px; margin-bottom:1px;} .tp-leftarrow.large { z-index:100;cursor:pointer; position:relative; background:url(../assets/arrow_large_left.png) no-Repeat top left; width:46px; height:46px; margin-left:20px; margin-top:-23px; } .tp-rightarrow.large { z-index:100;cursor:pointer; position:relative; background:url(../assets/arrow_large_right.png) no-Repeat top left; width:46px; height:46px; margin-left:-20px; margin-top:-23px; } .tp-leftarrow:hover, .tp-rightarrow:hover { background-position:bottom left; } /**************************************************************************************************** - TP THUMBS - ***************************************************************************************************** - tp-thumbs & tp-mask Width is the width of the basic Thumb Container (500px basic settings) - .bullet width & height is the dimension of a simple Thumbnail (basic 100px x 50px) *****************************************************************************************************/ .tp-bullets.tp-thumbs { z-index:100; position:absolute; width:500px;height:50px; /* THE DIMENSIONS OF THE THUMB CONTAINER */ } .fullwidthbanner-container .tp-thumbs { padding:2px;} .tp-bullets.tp-thumbs .tp-mask { width:500px; height:50px; /* THE DIMENSIONS OF THE THUMB CONTAINER */ overflow:hidden; position:relative;} .tp-bullets.tp-thumbs .tp-mask .tp-thumbcontainer { width:5000px; position:absolute;} .tp-bullets.tp-thumbs .bullet { width:100px; height:50px; /* THE DIMENSION OF A SINGLE THUMB */ cursor:pointer; overflow:hidden;background:none;margin:0;margin-left:1px;float:left; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); -moz-opacity: 0.5; -khtml-opacity: 0.5; opacity: 0.5; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; } .tp-bullets.tp-thumbs .bullet:hover, .tp-bullets.tp-thumbs .bullet.selected { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=1); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1;} .tp-thumbs img { width:100%; } /************************************ - TP BANNER TIMER - *************************************/ .tp-bannertimer { width:100%; height:10px; background:url(../assets/timer.png);position:absolute; z-index:200;} /*************************************** - RESPONSIVE SETTINGS - ****************************************/ @media only screen and (min-width: 768px) and (max-width: 959px) { } @media only screen and (min-width: 480px) and (max-width: 767px) { .responsive .tp-bullets.tp-thumbs { width:300px !important; height:30px !important;} .responsive .tp-bullets.tp-thumbs .tp-mask { width:300px !important; height:30px !important;} .responsive .tp-bullets.tp-thumbs .bullet { width:60px !important;height:30px !important;} } @media only screen and (min-width: 0px) and (max-width: 479px) { .responsive .tp-bullets { display:none} .responsive .tparrows { display:none;} } /********************************************* - BASIC SETTINGS FOR THE BANNER - ***********************************************/ .tp-simpleresponsive img { -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -o-user-select: none; } .tp-simpleresponsive ul { list-style:none; padding:0; margin:0; } .tp-simpleresponsive >ul li{ list-stye:none; position:absolute; visibility:hidden; } /* CAPTION SLIDELINK **/ .caption.slidelink a div { width:10000px; height:10000px; } .tp-loader { background:url(../assets/loader.gif) no-repeat 10px 10px; background-color:#fff; margin:-22px -22px; top:50%; left:50%; z-index:10000; position:absolute;width:44px;height:44px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; } /*********************************************************** - LITE CONAINER& SETTINGS TO LITE CONTAINERS - ************************************************************/ .lite_container { background-color:rgba(255,255,255,0.20); padding:25px 0px 30px;} .lite_container.notopmargin { margin-top:0px !important;} .lite_container .padding20 { padding:0px 20px;} .lite_sidebar { background-color:rgba(255,255,255,0.20); padding:0px 20px 25px; } #search-2 .lite_sidebar { padding:0; background-color:transparent;} .blog .lite_container { padding:25px 20px 30px; } /*** - CONTENT LITE BOX IN BG - ***/ .lite_content.sixteen.columns { width:900px !important; margin-left:0px;} .lite_content.eleven.columns { width:610px !important; margin-left:0px;} .lite_container.eleven { width:650px; float:left;} @media only screen and (min-width: 768px) and (max-width: 959px) { .lite_content.sixteen.columns { width:708px !important; margin-left:0px;} .lite_content.eleven.columns { width:478px !important; margin-left:0px;} .lite_container.eleven { width:518px; float:left;} } @media only screen and (min-width: 480px) and (max-width: 767px) { .lite_content.sixteen.columns { width:380px !important; margin-left:0px;} .lite_content.eleven.columns { width:380px !important; margin-left:0px;} .lite_container.eleven { width:420px; float:left;} } @media only screen and (min-width: 0px) and (max-width: 479px) { .lite_content.sixteen.columns { width:260px !important; margin-left:0px;} .lite_content.eleven.columns { width:260px !important; margin-left:0px;} .lite_container.eleven { width:300px; float:left;} } /***** 1PX Spaces Extra *******/ .portfolio .four.columns, .blog.four.columns { width:234px; margin-right:0px;margin-left:1px;} .portfolio .eight.columns, .teaser .eight.columns { width:469px; margin-right:0px;margin-left:1px;} .sidebar.blog.four.columns { width:230px; margin-left:10px;} .portfolio .four.columns.alpha, .portfolio .eight.columns.alpha, .teaser .eight.columns.alpha { margin-left:0px;} .portfolio_filter { margin-bottom:1px !important; } .teaser .four.columns.alpha { margin-left:0px !important;} .onetopcorrection h5 a, .onetopcorrection h5 a:visited .withsidebar h5 a, .withsidebar h5 a:visited { color:#000; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.8s ease-out; -ms-transition: all 0.3s ease-in-out; } .withsidebar h5 a:hover, .onetopcorrection h5 a:hover { color:#000;} .onetopcorrection { margin-top:-1px; } /********************************************************************************************************** - RESPOSNIVE SIDEBAR AND TEASER SETTINGS (ADD ONS FOR 1PX and 25PX Vertical Positions, etc.. ) - ***********************************************************************************************************/ @media only screen and (min-width: 959px) { .withsidebar .sixteen.columns { width:650px; margin-top:-1px;} .withsidebar .eight.columns, .withsidebar .alpha.eight.columns, .withsidebar .eight .blog_imagewrap { width:324px;} .withsidebar .teaser .eight.columns .blog_detailswrap { width:324px; clear:both;} .lite_container .eight.columns.alpha { padding:0px 0px 0px 20px; width:440px;} .teaser .eight.columns .blog_imagewrap { margin-right:1px;} .lite_container .eight.columns.omega { padding:0px 20px 0px 0px; width:440px;} .lite_container .eight .blog_detailswrap { width:300px;} .teaser .eight.columns .blog_detailswrap { width:348px;} .teaser .eight.columns { margin-top:1px;} .container .eleven.columns { width: 650px; margin-right:0px; } .sidebar.offset-by-one { padding-left:50px !important; } .sidebar .minigal .minigal_div, #footer .minigal .minigal_div { width:93px;} .sidebar .minigal img, #footer .minigal img { width:100%; } .sidebar .minigal .lastcolumn #footer .minigal .lastcolumn { margin-right:0px;} } @media only screen and (min-width: 768px) and (max-width: 959px) { .withsidebar .sixteen.columns { width:508px; margin-top:-1px; } .withsidebar .eight.columns { float:left;} .withsidebar .eight.columns, .withsidebar .alpha.eight.columns, .withsidebar .eight .blog_imagewrap { width:253px !important;} .withsidebar .teaser .eight.columns .blog_detailswrap, .withsidebar .teaser .eight.columns.omega .blog_detailswrap { width:253px !important; clear:both;} .portfolio .four.columns, .blog.four.columns { width:186px; margin-right:0px;margin-left:1px;} .portfolio .eight.columns { width:373px; margin-right:0px;margin-left:1px;} .portfolio .four.columns.alpha, .portfolio .eight.columns.alpha { margin-left:0px;} .portfolio_filter { margin-bottom:1px !important; } .sidebar.blog.four.columns { width:192px; margin-left:10px;} .teaser .eight.columns { width:373px; margin-left:1px;margin-top:1px;} .teaser .eight .blog_imagewrap { margin-right:1px;} .teaser .eight.columns .blog_detailswrap { width:282px; margin-top:0px;} .sidebar.offset-by-one { padding-left:28px !important; } .lite_sidebar #quickcontact .InputBox, .lite_sidebar #quickcontact .TextBox { width:135px !important;} .sidebar .minigal .minigal_div { width:74px;} .sidebar .minigal img { width:100%; } .sidebar .minigal .lastcolumn { margin-right:0px;} #footer .minigal .minigal_div { width:73px;} #footer .minigal img { width:100%; } #footer .minigal .lastcolumn { margin-right:0px;} } @media only screen and (min-width: 480px) and (max-width: 767px) { .withsidebar .sixteen.columns { width:420px; margin-top:-1px; } .withsidebar .eight.columns { float:left;} .withsidebar .alpha.eight.columns { margin-top:25px;} .withsidebar .eight.columns, .withsidebar .alpha.eight.columns, .withsidebar .eight .blog_imagewrap { width:420px !important;} .withsidebar .teaser .eight.columns .blog_detailswrap, .withsidebar .teaser .eight.columns.omega .blog_detailswrap { width:420px !important; clear:both;} .blog.four.columns { width:420px; margin-right:0px;margin-left:1px;} .portfolio .four.columns, .portfolio .eight.columns { width:420px; margin-right:0px;margin-left:1px;} .portfolio .four.columns.alpha, .portfolio .eight.columns.alpha { margin-left:0px;} .portfolio_filter { } .sidebar.blog.four.columns { width:420px; margin-left:0px;} #footer.blog.four.columns { width:420px; margin-left:0px;} .teaser .eight .blog_imagewrap { margin-right:1px;} .teaser .eight.columns .blog_detailswrap { width:309px; margin-top:0px;} .sixteen.columns.blog .blog .divide40 { height:25px; } /*.portfolio .alpha { margin-bottom:0px !important; }*/ .topinfowrapper div { width:100%;} .onetopcorrection .eight.columns.alpha.blog { margin-top:25px;} .sidebar .minigal .minigal_div { width:91px; margin:0px 4px 0px 0px !important; } .sidebar .minigal .minigal_div.verylast { margin:0px !important;} .sidebar .minigal img { width:91px; } .sidebar .minigal .lastcolumn { margin-right:0px;} #footer .minigal .minigal_div { width:91px; margin:0px 4px 0px 0px !important; } #footer .minigal .minigal_div.verylast { margin:0px !important;} #footer .minigal img { width:91px; } #footer .minigal .lastcolumn { margin-right:0px;} .hometeaser .four.columns.alpha { margin-bottom:25px !important;} .hometeaser .four.columns.verylast { margin-bottom:0px !important;} .sidebar { margin-bottom:0px !important; margin-top:50px !important;} .widget:last-child { margin-bottom:0px !important; } .eleven.columns { margin-bottom:0px !important; } .nomarginbottom { margin-bottom:0px !important; } .commentlist { margin-top:25px; } .lite_sidebar #quickcontact .InputBox, .lite_sidebar #quickcontact .TextBox { width:363px !important; } } @media only screen and (min-width: 0px) and (max-width: 479px) { .withsidebar .sixteen.columns { width:300px; margin-top:-1px; } .withsidebar .eight.columns { float:left;} .withsidebar .alpha.eight.columns { margin-top:25px;} .withsidebar .eight.columns, .withsidebar .alpha.eight.columns, .withsidebar .eight .blog_imagewrap { width:300px !important;} .withsidebar .teaser .eight.columns .blog_detailswrap, .withsidebar .teaser .eight.columns.omega .blog_detailswrap { width:300px !important; clear:both;} .blog.four.columns { width:300px; margin-right:0px;margin-left:1px;} .portfolio .four.columns, .portfolio .eight.columns { width:300px; margin-right:0px;margin-left:1px; } .portfolio .four.columns.alpha, .portfolio .eight.columns.alpha { margin-left:0px;} .portfolio_filter { margin-bottom:1px !important; margin-top:40px !important;} .sidebar.blog.four.columns { width:300px; margin-left:0px;} #footer.blog.four.columns { width:300px; margin-left:0px;} .teaser .eight .blog_imagewrap { margin-right:1px;} .teaser .eight.columns .blog_detailswrap { width:238px; margin-top:0px;} .sixteen.columns.blog .blog .divide40 { height:25px; } .portfolio .alpha { margin-bottom:25px !important; } .topinfowrapper div { width:100%;} .onetopcorrection .eight.columns.alpha.blog { margin-top:25px;} .sidebar .minigal .minigal_div { width:126px; margin:0px 4px 4px 0px !important; } .sidebar .minigal .minigal_div.verylast { margin:0px !important;} .sidebar .minigal img { width:126px; } .sidebar .minigal .lastcolumn { margin-right:0px;} #footer .minigal .minigal_div { width:126px; margin:0px 4px 4px 0px !important; } #footer .minigal .minigal_div.verylast { margin:0px !important;} #footer .minigal img { width:126px; } #footer .minigal .lastcolumn { margin-right:0px;} .hometeaser .four.columns.alpha { margin-bottom:25px !important;} .hometeaser .four.columns.verylast { margin-bottom:0px !important;} .sidebar { margin-bottom:0px !important; margin-top:50px !important; } .widget:last-child { margin-bottom:0px !important; } .eleven.columns { margin-bottom:0px !important; } .nomarginbottom { margin-bottom:0px !important; } .commentlist { margin-top:25px; } .lite_sidebar #quickcontact .InputBox, .lite_sidebar #quickcontact .TextBox { width:243px !important; } } /****************** EXTRA JUSTIFY ************************/ .eight.columns.omega.blog.verylast { margin-bottom:0px;} .nobottommargin { margin-bottom:1px !important;} .sidebar.leftfloat { margin-left:0px !important;} #comments.expandable { margin-top:-4px;} #respond { height:10px;} .sidebar .blogdetail .topline:link, .sidebar .blogdetail .topline:visited, .sidebar .blogdetail .topline { color:#000; font-weight:bold; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.8s ease-out; -ms-transition: all 0.3s ease-in-out; } .sidebar .blogdetail .topline:hover { color:#555; } .stretchedbg { height: 100%; left: 0; position: fixed; top: 0; width: 100%; } #sitetitle_dummy { height:0px !important;}