@charset "utf-8"; /* CSS Document */ /*----*****---- << Header >> ----*****----*/ /******** Header Top-Bar ********/ #bbar-wrapper { background: #fff; float:left; font-size: 14px; padding: 10px 0; line-height: 24px; width: 100%; } #bbar-wrapper .contact { font-weight: 500; margin-bottom: 0; } #bbar-wrapper.type2 { line-height: 30px; padding: 8px 0; } #bbar-wrapper.type2.dark { background: #222222; } #bbar-wrapper.type2 p { font-size:14px; line-height: 30px; margin: 0; } #bbar-wrapper.type2 p i { display:inline-block; font-size: 20px; margin: 0 3px 0 0; vertical-align: middle; } #bbar-wrapper .column.alignright { float: right; margin-bottom: 0; text-align: right; } #bbar-wrapper .searchform { border: 1px solid; float:right; margin: 0; width:194px;} #bbar-wrapper.dark .searchform { border-color: #343f4f; } #bbar-wrapper .searchform input[type="text"] { float:right; } #bbar-wrapper .column.alignright a > i { margin: 0 0 0 3px; } #bbar-wrapper.header1 { border-top: 1px solid; padding: 0; } #bbar-wrapper.header1, #bbar-wrapper.header1 p { line-height: 44px; } #bbar-wrapper.header1 .float-left { line-height: normal; } #bbar-wrapper.header1 .float-left .icon { float: left; width: auto; } #bbar-wrapper.header1 .float-left .icon span { border-right: 1px solid; display: block; height: 35px; margin: auto; padding: 5px 20px; width: 35px; } #bbar-wrapper.header1 .float-left .ico-phone { background: url("/css/images/ico-phone.png") no-repeat center center; border-left: 1px solid; } #bbar-wrapper.header1 .float-left .ico-chat { background: url("/css/images/ico-chat.png") no-repeat center center; } #bbar-wrapper.header1 p { font-size: 20px; margin: 0; } #bbar-wrapper.header1 .dt-sc-button { color: #fff; font-size: 15px; line-height: 24px; margin: 0 0 0 15px; padding: 0 20px; text-shadow: none; vertical-align: text-top; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; } #bbar-wrapper.header1 .buttons .dt-sc-button { margin: 0 0 0 8px; } #header-sticky-wrapper { max-width: 100%; } .sticky-wrapper { float: left; height:68px; max-width: 100%; width: 100%; } #header-wrapper, #header-wrapper header { clear: both; float: left; margin: 0; padding: 0; position: relative; width: 100%; z-index: 99999; -webkit-backface-visibility:hidden; } .is-sticky #header-wrapper { z-index: 99999; } .is-sticky #header { padding: 0; box-shadow: 0 0 5px rgba(34,34,34,0.8); -webkit-box-shadow: 0 0 5px rgba(34,34,34,0.8); -moz-box-shadow: 0 0 5px rgba(34,34,34,0.8); -ms-box-shadow: 0 0 5px rgba(34,34,34,0.8); -o-box-shadow: 0 0 5px rgba(34,34,34,0.8); } /******** Logo & Menu Navigation ********/ #logo { font-size:40px; float:left; text-transform:uppercase; width: auto; } #logo a { display: block; float: left; width: 100%; } #logo a, #logo a:hover { color: #fff;} #logo a img { display: inline-block; max-width: 100%; } .main-menuwrapper { display:block; float:right; margin: 0; padding: 0; position:relative; z-index:100;} .main-menuwrapper ul { display:block; float:left; margin: 0; padding: 0; } .main-menuwrapper ul li { margin: 0 5px; padding: 18px 0; display:inline-block; float:left; line-height: 16px; position:relative; text-align:center; } .main-menuwrapper ul li a { float:left; padding: 10px 20px 12px; font-size:14px; color:#fff; text-transform: capitalize; } .main-menuwrapper > ul > li span { display:inline-block; text-align:center; } .main-menuwrapper ul li:hover { cursor: pointer; } .main-menuwrapper > ul > li:last-child { margin-right: 0; } .main-menuwrapper ul ul li { border-bottom: 1px solid rgba(255,255,255, 0.25); clear:both; display: block; float: left; font-size: 12px; padding:0; text-align:left; width:100%; } .main-menuwrapper ul ul li:last-child { border-bottom: none;} .main-menuwrapper ul ul li a { display:block; float:none; padding: 16px 15px 15px; margin: 0; } .main-menuwrapper ul li ul { opacity: 0; filter: alpha(opacity=0); float:left; left: 0; position:absolute; top: 74px; width: 200px; z-index:1; } .main-menuwrapper ul li:hover ul { display:block; } .main-menuwrapper ul ul li ul.secondary { left: 200px; top: 0; } .main-menuwrapper ul ul li:hover ul.secondary { width:100%; } .main-menuwrapper ul ul li.current_page_item ul li a { color:#fff; } .main-menuwrapper ul li .menu-icon, #header.header2 .main-menuwrapper ul li .menu-icon { display: none; } .main-menuwrapper ul ul li:before { content: " "; height: 100%; left: -3px; position: absolute; bottom: 0; top: 0; width: 3px; box-shadow: -6px 0 15px -15px inset; -webkit-box-shadow: -6px 0 15px -15px inset; -moz-box-shadow: -6px 0 15px -15px inset; -ms-box-shadow: -6px 0 15px -15px inset; -o-box-shadow: -6px 0 15px -15px inset; } .main-menuwrapper ul ul li:after { content: " "; height: 100%; position: absolute; bottom: 0; right: -3px; top: 0; width: 3px; box-shadow: 6px 0 15px -15px inset; -webkit-box-shadow: 6px 0 15px -15px inset; -moz-box-shadow: 6px 0 15px -15px inset; -ms-box-shadow: 6px 0 15px -15px inset; -o-box-shadow: 6px 0 15px -15px inset; } .main-menuwrapper > ul > li.hasSubmenu:hover ul li a { float:left; width:100%; } #logo, #header.header2 #logo { margin: 15px 0 0 5px; } #header.header3 #logo { margin: 22px 0 0; width: 32%; } #header.header4 #logo { margin: 35px 0 0; } #header.header2 .main-menuwrapper ul ul li:first-child { border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; -moz-border-radius: 3px 3px 0 0; -ms-border-radius: 3px 3px 0 0; -o-border-radius: 3px 3px 0 0; } #header.header2 .main-menuwrapper ul ul li:last-child { border-radius: 0 0 3px 3px; -webkit-border-radius: 0 0 3px 3px; -moz-border-radius: 0 0 3px 3px; -ms-border-radius: 0 0 3px 3px; -o-border-radius: 0 0 3px 3px; } #header.header2 .main-menuwrapper ul li a { padding: 11px 20px 12px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; } #header.header2 .main-menuwrapper ul ul li a { padding: 16px 15px 15px; } #header.header2 .main-menuwrapper ul > li.hasSubmenu > a { padding: 11px 24px 12px 15px; } #header.header2 .main-menuwrapper > ul > li > ul:before { border-color: rgba(0, 0, 0, 0); border-style: solid; border-width: 0 8px 8px; content: ""; display: inline; left: 15px; position: absolute; top: -8px; width: 0; -webkit-transition: all 750ms linear; -moz-transition: all 750ms linear; -o-transition: all 750ms linear; -ms-transition: all 750ms linear; transition: all 750ms linear; } #header.header3 .main-menuwrapper ul li a, #header.header4 .main-menuwrapper ul li a { padding: 0 18px; text-transform:uppercase; } #header.header3 .main-menuwrapper ul li { margin: 0; padding: 35px 0; } #header.header4 .main-menuwrapper ul li { margin: 0; padding: 45px 0 35px; } #header.header3 .main-menuwrapper > ul > li:hover > a, #header.header3 .main-menuwrapper > ul > li.current_page_item > a { margin:-35px 0; padding:35px 18px; position:relative; } #header.header3 .main-menuwrapper ul ul li, #header.header4 .main-menuwrapper ul ul li { padding: 0; } #header.header3 .main-menuwrapper ul ul li a, #header.header4 .main-menuwrapper ul ul li a { padding: 16px 18px; } #header.header4 .main-menuwrapper > ul > li:hover > a, #header.header4 .main-menuwrapper > ul > li.current_page_item > a { padding:45px 18px 35px; position:relative; margin:-45px 0 -35px; } #header.header4 .main-menuwrapper ul li .menu-icon { clear:both; float:none; display:block; position:relative; left:0; right:0; margin:0 auto; *margin:0; top:-12px; } #header.header2 .main-menuwrapper ul li ul { top: 75px; } #header.header3 .main-menuwrapper ul li ul { top: 86px; } #header.header4 .main-menuwrapper ul li ul { top: 110px; } .main-menuwrapper ul li ul ul.dl-submenu, #header.header2 .main-menuwrapper ul li ul ul.dl-submenu, #header.header3 .main-menuwrapper ul li ul ul.dl-submenu, #header.header4 .main-menuwrapper ul li ul ul.dl-submenu { left: 200px; top: 0; } #header.header3 .main-menuwrapper.nav-line > ul > li:hover > a, #header.header3 .main-menuwrapper.nav-line > ul > li.current_page_item > a, #header.header4 .main-menuwrapper.nav-line > ul > li:hover > a, #header.header4 .main-menuwrapper.nav-line > ul > li.current_page_item > a { background: none; } #header.header3 .main-menuwrapper.nav-line > ul > li:before, #header.header4 .main-menuwrapper.nav-line > ul > li:before { content: ""; height: 5px; opacity: 0; filter: alpha(opacity=0); position: absolute; left: 0; top: 0; width: 100%; } #header.header3 .main-menuwrapper.nav-line > ul > li:hover:before, #header.header3 .main-menuwrapper.nav-line > ul > li.current_page_item:before, #header.header4 .main-menuwrapper.nav-line > ul > li:hover:before, #header.header4 .main-menuwrapper.nav-line > ul > li.current_page_item:before { opacity: 1; filter: alpha(opacity=100); transition: opacity 0.8s ease-out; -webkit-transition:opacity 0.8s ease-out; -moz-transition: opacity 0.8s ease-out; -ms-transition: opacity 0.8s ease-out; -o-transition: opacity 0.8s ease-out; } #header.header2 .main-menuwrapper ul li.hasSubmenu > a, #header.header5 #main-menu ul li.menu-item-simple-parent > a, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a { position: relative; } #header.header2 .main-menuwrapper ul li.hasSubmenu > a:after, #header.header2 .main-menuwrapper ul li.hasSubmenu > a:before, #header.header5 #main-menu ul li.menu-item-simple-parent > a:after, #header.header5 #main-menu ul li.menu-item-simple-parent > a:before, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a:after, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a:before { border-color: #fff rgba(0, 0, 0, 0) rgba(0, 0, 0, 0); border-style: solid; border-width: 4px; content: ""; display: inline; position: absolute; right: 12px; top: 19px; width: 0; } #header.header2 .main-menuwrapper ul li.hasSubmenu > a:before, #header.header5 #main-menu ul li.menu-item-simple-parent > a:before, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a:before { border-width: 2px; right: 14px; z-index: 1; } #header.header2 .main-menuwrapper ul li.hasSubmenu > a:after, #header.header5 #main-menu ul li.menu-item-simple-parent > a:after, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a:after { border-top-color: #fff; } #header.header5 #main-menu ul li.menu-item-simple-parent > a:after, #header.header5 #main-menu ul li.menu-item-simple-parent > a:before, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a:after, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a:before { content: none; } #header.header5 #main-menu { display:block; float:right; margin: 0; padding: 0; position:relative; z-index:100;} #header.header5 #main-menu > ul { display:block; float:left; margin: 0; padding: 0; } #header.header5 #main-menu > ul > li { margin: 0 5px; padding: 10px 0; padding-top:20px; display:inline-block; float:left; line-height: 16px; text-align:center; } #header.header5 #main-menu ul li.menu-item-simple-parent { position: relative; } #header.header5 #main-menu > ul > li > a { float:left; padding: 10px 20px 12px; font-size:14px; color:#fff; text-transform: capitalize; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; text-decoration:none; } #header.header5 #main-menu > ul > li > a > .menu-icon { display: none; } #header.header5 #main-menu ul li:hover { cursor: pointer; } #header.header5 #main-menu > ul > li:last-child { margin-right: 0; } #header.header5 #main-menu ul > ul > li { border-bottom: 1px solid rgba(255,255,255, 0.25); float: left; font-size: 12px; padding:0; position: relative; text-align:left; width:220px; } #header.header5 #main-menu ul ul li:last-child { border-bottom: none; } #header.header5 #main-menu ul li.menu-item-simple-parent ul li a, #header.header5 #main-menu ul li .megamenu-child-container ul.sub-menu > li > ul li a, .megamenu-child-container > ul.sub-menu > ul > li > a { display:block; float:none; margin: 0; padding: 10px; } #header.header5 #main-menu ul li .megamenu-child-container ul.sub-menu > li > ul li a, .megamenu-child-container > ul.sub-menu > ul > li > a { padding: 10px 0; } #header.header5 #main-menu { position: inherit; } #header.header5 #main-menu ul.menu > li > .megamenu-child-container { padding: 10px 0; left: 0; right: 0; width: 100%; } #header.header5 #main-menu ul.menu > li > .megamenu-child-container > ul.sub-menu { display: none; margin: 0 auto; width: 1170px; } #header.header5 #main-menu ul.menu > li > .megamenu-child-container.fullwidth { left: 0; right: 0; width: 100%; } #header.header5 #main-menu ul.menu > li.menu-item-megamenu-parent:hover > .megamenu-child-container > ul.sub-menu { display: block; } #header-wrapper, .is-sticky #header-wrapper, #footer { background: #194703; } /****** New Animated Menu *****/ .main-menuwrapper ul li:hover ul { opacity: 1; filter: alpha(opacity=100); z-index: 1; } .main-menuwrapper ul li ul.dl-submenu, .main-menuwrapper ul ul li ul.dl-submenu { visibility: hidden; z-index: 0; -webkit-perspective: 400px; -moz-perspective: 400px; -ms-perspective: 400px; -o-perspective: 400px; perspective: 400px; } .main-menuwrapper ul li ul.dl-submenu li, .main-menuwrapper ul ul li ul.dl-submenu li { display: none \9; margin: 0; height: 0; opacity: 0; filter: alpha(opacity=0); position: relative; visibility: hidden; z-index: 0; -webkit-transform: rotateY(90deg); -moz-transform: rotateY(90deg); -ms-transform: rotateY(90deg); -o-transform: rotateY(90deg); transform: rotateY(90deg); transition: opacity 0.4s, transform 0.5s; -webkit-transition: opacity 0.4s, -webkit-transform 0.5s; -moz-transition: opacity 0.4s, -moz-transform 0.5s; -ms-transition: opacity 0.4s, -ms-transform 0.5s; -o-transition: opacity 0.4s, -o-transform 0.5s; -webkit-backface-visibility:hidden; } .main-menuwrapper ul li:hover > ul.dl-submenu, .main-menuwrapper ul li:focus > ul.dl-submenu { visibility: visible; } .main-menuwrapper ul li:hover > ul.dl-submenu > li, .main-menuwrapper ul li:focus > ul.dl-submenu > li { display: block \9; height: 100%; opacity: 1; filter: alpha(opacity=100); visibility: visible; width: 100%; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; } .main-menuwrapper ul li ul.dl-submenu li:nth-child(1) { -webkit-transition-delay: 350ms; -moz-transition-delay: 350ms; -ms-transition-delay: 350ms; -o-transition-delay: 350ms; transition-delay: 350ms; } .main-menuwrapper ul li ul.dl-submenu li:nth-child(2) { -webkit-transition-delay: 300ms; -moz-transition-delay: 300ms; -ms-transition-delay: 300ms; -o-transition-delay: 300ms; transition-delay: 300ms; } .main-menuwrapper ul li ul.dl-submenu li:nth-child(3) { -webkit-transition-delay: 250ms; -moz-transition-delay: 250ms; -ms-transition-delay: 250ms; -o-transition-delay: 250ms; transition-delay: 250ms; } .main-menuwrapper ul li ul.dl-submenu li:nth-child(4) { -webkit-transition-delay: 200ms; -moz-transition-delay: 200ms; -ms-transition-delay: 200ms; -o-transition-delay: 200ms; transition-delay: 200ms; } .main-menuwrapper ul li ul.dl-submenu li:nth-child(5) { -webkit-transition-delay: 150ms; -moz-transition-delay: 150ms; -ms-transition-delay: 150ms; -o-transition-delay: 150ms; transition-delay: 150ms; } .main-menuwrapper ul li ul.dl-submenu li:nth-child(6) { -webkit-transition-delay: 100ms; -moz-transition-delay: 100ms; -ms-transition-delay: 100ms; -o-transition-delay: 100ms; transition-delay: 100ms; } .main-menuwrapper ul li ul.dl-submenu li:nth-child(7) { -webkit-transition-delay: 50ms; -moz-transition-delay: 50ms; -ms-transition-delay: 50ms; -o-transition-delay: 50ms; transition-delay: 50ms; } .main-menuwrapper ul li ul.dl-submenu li:nth-child(8) { -webkit-transition-delay: 0s; -moz-transition-delay: 0s; -ms-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; } .main-menuwrapper ul li:hover ul.dl-submenu li:nth-child(1) { -webkit-transition-delay: 0s; -moz-transition-delay: 0s; -ms-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; } .main-menuwrapper ul li:hover ul.dl-submenu li:nth-child(2) { -webkit-transition-delay: 50ms; -moz-transition-delay: 50ms; -ms-transition-delay: 50ms; -o-transition-delay: 50ms; transition-delay: 50ms; } .main-menuwrapper ul li:hover ul.dl-submenu li:nth-child(3) { -webkit-transition-delay: 100ms; -moz-transition-delay: 100ms; -ms-transition-delay: 100ms; -o-transition-delay: 100ms; transition-delay: 100ms; } .main-menuwrapper ul li:hover ul.dl-submenu li:nth-child(4) { -webkit-transition-delay: 150ms; -moz-transition-delay: 150ms; -ms-transition-delay: 150ms; -o-transition-delay: 150ms; transition-delay: 150ms; } .main-menuwrapper ul li:hover ul.dl-submenu li:nth-child(5) { -webkit-transition-delay: 200ms; -moz-transition-delay: 200ms; -ms-transition-delay: 200ms; -o-transition-delay: 200ms; transition-delay: 200ms; } .main-menuwrapper ul li:hover ul.dl-submenu li:nth-child(6) { -webkit-transition-delay: 250ms; -moz-transition-delay: 250ms; -ms-transition-delay: 250ms; -o-transition-delay: 250ms; transition-delay: 250ms; } .main-menuwrapper ul li:hover ul.dl-submenu li:nth-child(7) { -webkit-transition-delay: 300ms; -moz-transition-delay: 300ms; -ms-transition-delay: 300ms; -o-transition-delay: 300ms; transition-delay: 300ms; } .main-menuwrapper ul li:hover ul.dl-submenu li:nth-child(8) { -webkit-transition-delay: 350ms; -moz-transition-delay: 350ms; -ms-transition-delay: 350ms; -o-transition-delay: 350ms; transition-delay: 350ms; } .dl-menuwrapper button, .dl-menuwrapper ul { display/*\**/: none\9; } @media screen and (min-width:0\0) { .dl-menuwrapper button, .dl-menuwrapper ul { display: block; } } /****** Simple Drop Down Menu *****/ #main-menu ul li.menu-item-simple-parent ul, #main-menu ul li.menu-item-simple-parent ul li ul, #main-menu ul li.menu-item-simple-parent ul li ul li ul { text-align:left; } #main-menu ul li.menu-item-simple-parent ul { background: #fff; border-top: 3px solid; display: none; float:left; padding: 10px 0 10px; position: absolute; left: 0; top:68px; width: 220px; z-index:1; box-shadow:0 5px 4px rgba(0, 0, 0, 0.1); -webkit-box-shadow:0 5px 4px rgba(0, 0, 0, 0.1); -moz-box-shadow:0 5px 4px rgba(0, 0, 0, 0.1); -ms-box-shadow:0 5px 4px rgba(0, 0, 0, 0.1); -o-box-shadow:0 5px 4px rgba(0, 0, 0, 0.1); } #main-menu ul li.menu-item-simple-parent ul li { display:block; padding: 0 10px; position:relative; } #main-menu ul li.menu-item-simple-parent ul li a { color: #333334; position:relative; padding:10px 0 10px 10px; font-size:14px; display:block; } #main-menu ul li.menu-item-simple-parent ul li:last-child > a { border:none; } #main-menu ul li.menu-item-simple-parent ul li ul { left:220px; top:-10px; border-top: 0; padding-top:5px; } #main-menu ul li.menu-item-simple-parent:last-child ul, #main-menu ul li.menu-item-simple-parent:nth-child(6) ul, #main-menu ul li.menu-item-simple-parent:nth-child(7) ul { right: 0; left:inherit; } #main-menu ul li.menu-item-simple-parent:last-child ul li ul, #main-menu ul li.menu-item-simple-parent:nth-child(6) ul li ul, #main-menu ul li.menu-item-simple-parent:nth-child(7) ul li ul { right:220px; left:inherit; } #main-menu ul li.menu-item-simple-parent ul li a .fa { margin-right:5px; } /****** Mega Menu *****/ #main-menu ul.menu > li > .megamenu-child-container { display: none; } .megamenu-child-container { background-color: #fff; border-top: 3px solid; padding: 10px 10px 0; position:absolute; top:68px; left: 0; float:left; z-index:99; box-shadow:0 5px 4px rgba(0, 0, 0, 0.1); } .hasImage-bg .megamenu-child-container { /*background-image: url(/css/images/megamenu.png);*/ background-repeat: no-repeat; } .hasImage-bg.right-aligned .megamenu-child-container { background-position: right bottom; } .megamenu-2-columns-group .megamenu-child-container, .megamenu-3-columns-group .megamenu-child-container, .megamenu-4-columns-group .megamenu-child-container { width:100%; } .megamenu-child-container > ul.sub-menu > li { display:inline; float:left; margin: 0 0 0 2%; padding:15px; position: relative; width:220px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; } .megamenu-child-container > ul.sub-menu > li.first { margin-left: 0; } .megamenu-child-container > ul.sub-menu > li:before { border-left: 1px dashed; content: ""; position: absolute; bottom: 0; left: -12px; top: 0; width: 1px; } .megamenu-child-container > ul.sub-menu > li:last-child:after { border-right: 1px dashed; content: ""; position: absolute; bottom: 0; right: 0; top: 0; width: 1px; } .hasImage-bg .megamenu-child-container > ul.sub-menu > li:first-child:before, .hasImage-bg .megamenu-child-container > ul.sub-menu > li:last-child:after { content: none; } .megamenu-2-columns-group .megamenu-child-container > ul.sub-menu > li { width: 48.9%; } .megamenu-3-columns-group .megamenu-child-container > ul.sub-menu > li { width: 31.9%; } .megamenu-4-columns-group .megamenu-child-container > ul.sub-menu > li { width: 23.4%; } .megamenu-5-columns-group .megamenu-child-container > ul.sub-menu > li { width: 18.4%; } .megamenu-2-columns-group .megamenu-child-container > ul.sub-menu > li.menu-item-fullwidth { display:block; width: 470px; } .megamenu-3-columns-group .megamenu-child-container > ul.sub-menu > li.menu-item-fullwidth { display:block; width: 720px; } .megamenu-4-columns-group .megamenu-child-container > ul.sub-menu > li.menu-item-fullwidth { display:block; width: 970px; } .megamenu-child-container > ul.sub-menu { padding: 0; margin: 0; text-align:left; } .megamenu-child-container > ul.sub-menu > li > a, .megamenu-child-container > ul.sub-menu > li > .nolink-menu { text-transform:uppercase; font-weight:300; margin-bottom:20px; display:block; font-size:18px; letter-spacing:1px; } .megamenu-child-container > ul.sub-menu > li a .fa { margin-right:5px; } .megamenu-child-container > ul.sub-menu > li > a .menu-item-description, .menu-item-description { color: #b1b1b1; display:block; font-weight:normal; padding: 0; } .dt-megamenu-custom-content { display: block; padding: 10px 0 0; } .megamenu-child-container ul.sub-menu > li > ul { padding: 0; margin: 0; } .megamenu-child-container ul.sub-menu > li > ul li { display: block; padding: 0; } .megamenu-child-container ul.sub-menu > li > ul li, .megamenu-child-container ul.sub-menu > li > ul li a { clear:both; } .megamenu-child-container ul.sub-menu > li > ul li a { color:#333334; position:relative; padding: 0; font-size:14px; display:block; } .megamenu-child-container ul.sub-menu > li > ul li:last-child a { border:none; } .megamenu-child-container ul.sub-menu > li > ul > li > ul { padding-left:20px; } .megamenu-child-container > ul.sub-menu > li.fulwidth-image-link > .nolink-menu { padding: 0; } .megamenu-child-container > ul.sub-menu > li.fulwidth-image-link ul.sub-menu { padding-top: 0; } .megamenu-child-container > ul.sub-menu > li.fulwidth-image-link img { max-width:100%; } /* New Mega Menu Widget area styles */ .megamenu-child-container > ul.sub-menu > li.fill-two-columns { width: 470px; } .megamenu-child-container > ul.sub-menu > li.fill-three-columns { width: 720px; } .megamenu-child-container > ul.sub-menu > li.fill-four-columns { width: 970px; } .megamenu-2-columns-group .megamenu-child-container > ul.sub-menu > li.fill-three-columns, .megamenu-2-columns-group .megamenu-child-container > ul.sub-menu > li.fill-four-columns { width:480px; } .megamenu-3-columns-group .megamenu-child-container > ul.sub-menu > li.fill-four-columns { width:730px; } .megamenu-4-columns-group .megamenu-child-container ul.sub-menu li.fill-two-columns.menu-item-fullwidth .widget { width: 465px; } .megamenu-4-columns-group .megamenu-child-container ul.sub-menu li.fill-three-columns.menu-item-fullwidth .widget { width: 303px; } .megamenu-3-columns-group .megamenu-child-container ul.sub-menu li.fill-two-columns.menu-item-fullwidth .widget { width: 340px; } /****** Mobile Menu *****/ .dt-menu-toggle { color:#fff; cursor:pointer; display:none; float: left; font-size:16px; font-weight:bold; margin: 10px 0 0; padding:10px 15px; text-transform:uppercase; width: 100%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; } .dt-menu-toggle-icon { background:#ffffff; display:inline-block; float:right; height:2px; margin-top: 12px; position:relative; text-align:left; width:20px; } .dt-menu-toggle-icon:before, .dt-menu-toggle-icon:after { content:""; position:absolute; background:#ffffff; height:2px; width:20px; left: 0; top:-5px; } .dt-menu-toggle-icon:after { top:5px; } .dt-menu-expand { font-size:16px !important; display:none !important; position:absolute !important; right: 0; top: 0; line-height:normal; padding: 0 !important; text-align:center; line-height:37px !important; cursor:pointer; width:37px; height:37px; font-weight:bold; } /*----*****---- << Skin Borders >> ----*****----*/ #main-menu ul li.menu-item-simple-parent ul, .megamenu-child-container, .dt-sc-pr-tb-col:hover:after, .dt-sc-pr-tb-col.selected:after, .sorting-container a.active-sort, .sorting-container a:hover { border-color: #709c07; } .sorting-container a.active-sort:after, .sorting-container a:hover:after, #header.header2 .main-menuwrapper ul li.hasSubmenu:hover > a:before, #header.header2 .main-menuwrapper ul > li.hasSubmenu.current_page_item > a:before, #header.header2 .main-menuwrapper ul > li.hasSubmenu.current_page_ancestor > a:before, #header.header2 .main-menuwrapper ul > li.hasSubmenu.current-menu-item > a:before, #header.header2 .main-menuwrapper ul > li.hasSubmenu.current-menu-ancestor > a:before, #header.header5 #main-menu ul li.menu-item-simple-parent:hover > a:before, #header.header5 #main-menu ul li.menu-item-simple-parent.current_page_item > a:before, #header.header5 #main-menu ul li.menu-item-simple-parent.current_page_ancestor > a:before, #header.header5 #main-menu ul li.menu-item-simple-parent.current-menu-item > a:before, #header.header5 #main-menu ul li.menu-item-simple-parent.current-menu-ancestor > a:before, #header.header5 #main-menu ul li.menu-item-megamenu-parent:hover > a:before, #header.header5 #main-menu ul li.menu-item-megamenu-parent.current_page_item > a:before, #header.header5 #main-menu ul li.menu-item-megamenu-parent.current_page_ancestor > a:before, #header.header5 #main-menu ul li.menu-item-megamenu-parent.current-menu-item > a:before, #header.header5 #main-menu ul li.menu-item-megamenu-parent.current-menu-ancestor > a:before { border-top-color: #709c07; } #header.header2 .main-menuwrapper > ul > li > ul:before { border-bottom-color: #709c07; } .ico-content.type4 .icon span:after { box-shadow: 0 0 0 4px #709c07; -webkit-box-shadow: 0 0 0 4px #709c07; -moz-box-shadow: 0 0 0 4px #709c07; -ms-box-shadow: 0 0 0 4px #709c07; -o-box-shadow: 0 0 0 4px #709c07; } .ico-content-wrapper:hover .ico-content.type1:after { border-bottom-color: #405069; } .ico-content.type1:hover .icon span { border-color: #b7c3d6; } #bbar-wrapper.header1 .dt-sc-button, .main-menuwrapper > ul > li:hover > a, .main-menuwrapper > ul > li.current_page_item > a, .main-menuwrapper ul ul li, .dl-menuwrapper button.dl-active, .dl-menuwrapper ul, #header.header3 .main-menuwrapper.nav-line > ul > li:before, #header.header3 .main-menuwrapper.nav-line > ul > li.current_page_item:before, #header.header4 .main-menuwrapper.nav-line > ul > li:before, #header.header4 .main-menuwrapper.nav-line > ul > li.current_page_item:before, #header.header5 #main-menu > ul > li:hover > a, #header.header5 #main-menu > ul > li > a:hover, #header.header5 #main-menu ul > li.current_page_item > a, #header.header5 #main-menu ul > li.current_page_ancestor > a, #header.header5 #main-menu ul > li.current-menu-item > a, #header.header5 #main-menu ul > li.current-menu-ancestor > a, .dt-menu-toggle, .tweet-box, .ico-content.type4 .icon, input[type=submit], input[type=button], button, .dt-sc-button, .dt-sc-pr-tb-col:hover, .dt-sc-pr-tb-col.selected, .dt-sc-pr-tb-col:hover .dt-sc-buy-now .dt-sc-button, .dt-sc-pr-tb-col.selected .dt-sc-buy-now .dt-sc-button, .sorting-container a.active-sort, .sorting-container a:hover, .sorting-container a.active-sort:hover, .portfolio .image-overlay a, .portfolio:hover .portfolio-detail { background: #709c07; } /*----*****---- << Responsive >> ----*****----*/ @media only screen and (min-width:1601px) and (max-width:1800px) { .hasImage-bg .megamenu-child-container { background-size: 28% auto; } } @media only screen and (min-width:1121px) and (max-width:1600px) { .main-menuwrapper ul > li:last-child ul, .main-menuwrapper ul > li:nth-last-child(2) ul { left: auto; right: 0; } .main-menuwrapper ul > li:last-child > ul:before, #header.header2 .main-menuwrapper > ul > li:last-child > ul:before, .main-menuwrapper ul > li:nth-last-child(2) > ul:before, #header.header2 .main-menuwrapper > ul > li:nth-last-child(2) > ul:before { left: auto; right: 15px; } .hasImage-bg .megamenu-child-container { background-size: 25% auto; } } @media only screen and (min-width:1241px) and (max-width:1440px) { .hasImage-bg .megamenu-child-container { background-image: none; } } /*----*****---- << Desktop >> ----*****----*/ /* Note: Design for a width of 768px, Gutter: 30px, Unit: 32px */ @media only screen and (min-width:960px) and (max-width:1240px) { .container { width:900px; } #primary { width:660px; } #secondary { width: 220px; } .boxed .wrapper, .boxed #header-wrapper { width:940px; } .wrapper, #header-wrapper { width:100%; } img, .aligncenter { height:auto; max-width: 100%; } th { padding:12px 5px; font-size:12px; text-transform:none; } td { padding:10px 5px; font-size:12px; } .preview-section .column { width: 100%; } /*----*****---- << Header >> ----*****----*/ #bbar-wrapper .column.alignright { margin: 0; } #logo, #header.header2 #logo, #header.header3 #logo { margin: 22px 0 0; width: 26%; } #header.header3 #logo { margin: 27px 0 0; } #header.header4 #logo { margin: 39px 0 0; } .main-menuwrapper ul > li:last-child ul { left: auto; right: 0; } .main-menuwrapper ul > li:last-child > ul:before, #header.header2 .main-menuwrapper > ul > li:last-child > ul:before { left: auto; right: 15px; } #header.header2 .main-menuwrapper ul > li.hasSubmenu > a { padding: 11px 24px 12px 14px; } #header.header5 #main-menu ul.menu > li > .megamenu-child-container > ul.sub-menu { width: 900px; } #header.header5 #logo { margin: 22px 0 0 !important; width: 20% !important; } #header.header5 #main-menu > ul > li > a { font-size: 13px; padding: 10px 18px; } #header.header5 #main-menu ul li.menu-item-simple-parent > a:after, #header.header5 #main-menu ul li.menu-item-simple-parent > a:before, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a:after, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a:before { top: 17px; } .main-menuwrapper ul li ul, #header.header2 .main-menuwrapper ul li ul { } .main-menuwrapper ul li ul ul.dl-submenu, #header.header2 .main-menuwrapper ul li ul ul.dl-submenu, #header.header3 .main-menuwrapper ul li ul ul.dl-submenu, #header.header4 .main-menuwrapper ul li ul ul.dl-submenu { left: auto; right: 200px; } #main-menu ul li.menu-item-simple-parent ul { top: 62px; } .megamenu-child-container { top: 72px; } .hasImage-bg .megamenu-child-container { background-image: none; } } /*----*****---- << Tablet (Portrait) >> ----*****----*/ /* Note: Design for a width of 768px, Gutter: 30px, Unit: 32px */ @media only screen and (min-width:768px) and (max-width:959px) { .container { width:710px; } .boxed .wrapper, .boxed #header-wrapper { width:790px; } #primary { width:500px; } /* #primary.with-right-sidebar { margin-right:20px; } #primary.with-left-sidebar { margin-left:20px; }*/ #secondary { width:170px; } /*----*****---- << Header >> ----*****----*/ #bbar-wrapper .column.alignright { margin: 0; } #bbar-wrapper.header1 p { font-size: 16px; } #bbar-wrapper.header1, #bbar-wrapper.header1 p { line-height: 44px; } #logo, #header.header2 #logo, #header.header3 #logo, #header.header4 #logo { margin: 21px 0 0; width: 25%; } #header.header3 #logo { margin: 28px 0 0; } #header.header4 #logo { margin: 39px 0 0; } .main-menuwrapper ul > li { margin: 0 3px; } .main-menuwrapper ul li a, #header.header2 .main-menuwrapper ul li a { font-size:12px; padding: 10px 18px 11px; } #header.header2 .main-menuwrapper ul > li.hasSubmenu > a { padding: 10px 22px 11px 12px } .main-menuwrapper ul li ul, #header.header2 .main-menuwrapper ul li ul { top: 73px; } .main-menuwrapper ul > li:last-child ul, .main-menuwrapper ul > li:nth-last-child(2) ul { left: auto; right: 0; } .main-menuwrapper ul > li:last-child > ul:before, #header.header2 .main-menuwrapper > ul > li:last-child > ul:before, .main-menuwrapper ul > li:nth-last-child(2) > ul:before, #header.header2 .main-menuwrapper > ul > li:nth-last-child(2) > ul:before { left: auto; right: 15px; } #header.header3 .main-menuwrapper ul li a, #header.header4 .main-menuwrapper ul li a { padding: 0 15px; } #header.header3 .main-menuwrapper > ul > li:hover > a, #header.header3 .main-menuwrapper > ul > li.current_page_item > a { padding: 35px 15px; } #header.header4 .main-menuwrapper > ul > li:hover > a, #header.header4 .main-menuwrapper > ul > li.current_page_item > a { padding: 45px 15px 35px; } #header.header4 .main-menuwrapper ul li ul { top: 108px; } #header.header5 #main-menu ul.menu > li > .megamenu-child-container > ul.sub-menu { width: 710px; } #header.header5 #logo { margin: 19px 0 0 !important; width: 18% !important; } #header.header5 #main-menu > ul > li { margin: 0 3px; } #header.header5 #main-menu > ul > li > a { font-size: 12px; padding: 7px 14px 8px; } .main-menuwrapper ul li ul, #header.header2 .main-menuwrapper ul li ul { width: 150px; } .main-menuwrapper ul li ul ul.dl-submenu, #header.header2 .main-menuwrapper ul li ul ul.dl-submenu, #header.header3 .main-menuwrapper ul li ul ul.dl-submenu, #header.header4 .main-menuwrapper ul li ul ul.dl-submenu { left: auto; right: 150px; } .main-menuwrapper ul ul li a, #header.header2 .main-menuwrapper ul ul li a { font-size: 12px; padding: 10px 15px; } .megamenu-child-container > ul.sub-menu > li > a, .megamenu-child-container > ul.sub-menu > li > .nolink-menu { font-size: 12px; } #main-menu ul li.menu-item-simple-parent ul li a, .megamenu-child-container ul.sub-menu > li > ul li a { font-size: 11px; } #main-menu ul li.menu-item-simple-parent ul { top: 57px; } .megamenu-child-container { top: 67px; } .hasImage-bg .megamenu-child-container { background-image: none; } #header.header2 .main-menuwrapper ul li.hasSubmenu > a:after, #header.header2 .main-menuwrapper ul li.hasSubmenu > a:before, #header.header5 #main-menu ul li.menu-item-simple-parent > a:after, #header.header5 #main-menu ul li.menu-item-simple-parent > a:before, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a:after, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a:before { border-width: 4px; right: 10px; top: 18px; } #header.header2 .main-menuwrapper ul li.hasSubmenu > a:before, #header.header5 #main-menu ul li.menu-item-simple-parent > a:before, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a:before { border-width: 2px; right: 12px; } #header.header5 #main-menu ul li.menu-item-simple-parent > a:after, #header.header5 #main-menu ul li.menu-item-simple-parent > a:before, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a:after, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a:before { right: 3px; top: 15px; } #header.header5 #main-menu ul li.menu-item-simple-parent > a:before, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a:before { right: 5px; } /*----*****---- << Side Navigation >> ----*****----*/ .side-nav-container ul li { width:98%; } .side-nav-container ul li a { font-size:11px; } .side-nav-container ul li a i { margin-right:15px; } .side-nav-container ul li a i, .side-nav-container ul li.current_page_item a i:after, .side-nav-container ul li.current_page_item a i span { width: 45px; } /*----*****---- << Mobile (Landscape) >> ----*****----*/ @media only screen and (max-width: 767px) { /*----*****---- << Columns >> ----*****----*/ .column { margin-left:0; } .dt-sc-one-half, .dt-sc-one-third, .dt-sc-two-third, .dt-sc-one-fourth, .dt-sc-three-fourth, .dt-sc-one-fifth, .dt-sc-two-fifth, .dt-sc-three-fifth, .dt-sc-four-fifth, .dt-sc-one-column, .column.no-space.dt-sc-one-half, .column.no-space.dt-sc-one-third, .column.no-space.dt-sc-two-third, .column.no-space.dt-sc-one-fourth, .column.no-space.dt-sc-three-fourth, .column.no-space.dt-sc-one-fifth, .column.no-space.dt-sc-two-fifth, .column.no-space.dt-sc-three-fifth, .column.no-space.dt-sc-four-fifth { width:100%; } /*----*****---- << Miscellaneous >> ----*****----*/ .content-section, .preview-section { width: 100%; } .content-section { position: relative; } .content-section .alignvertical { float: left; margin: 50px 0; position: static; top: auto; transform: none; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; } #bbar-wrapper .searchform { display: inline-block; float: none; } #header { min-height: 62px; height: 100%; } #logo, #header.header2 #logo, #header.header3 #logo, #header.header4 #logo { margin: 9px 0; text-align: center; width: 100%; } #header .container, #logo, #logo a { height: 100%; } .dt-menu-toggle { display:block; } #header.header5 #logo { margin: 20px 0 10px !important; width: 100%; } #header.header5 #main-menu { margin: 0 0 20px; } #main-menu, #main-menu > ul.menu { width:100%; } #main-menu > ul.menu, #header.header5 #main-menu > ul.menu { display:none; box-shadow: 0 0 2px rgba(0,0,0,0.1); } #main-menu > ul.menu > li { position: relative; } #header.header5 #main-menu ul li.menu-item-simple-parent > a:after, #header.header5 #main-menu ul li.menu-item-simple-parent > a:before, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a:after, #header.header5 #main-menu ul li.menu-item-megamenu-parent > a:before { content: none; } #header.header5 #main-menu > ul > li { margin: 0; padding: 0; } .megamenu-child-container ul.sub-menu > li ul .widget { font-weight:normal; text-transform:none; } #main-menu > ul.menu > li { line-height:24px; } #main-menu > ul.menu > li > a, #header.header5 #main-menu > ul > li > a { display:inline-block; line-height:24px; padding: 6px 16px 7px; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; -ms-border-radius:0; -o-border-radius:0; } .megamenu-child-container { box-shadow:none; } .megamenu-child-container > ul.sub-menu > li { margin: 0; } #header.header5 #main-menu ul.menu > li > .megamenu-child-container { opacity: 1; filter: alpha(opacity=100); } #header.header5 #main-menu ul.menu > li > .megamenu-child-container { padding: 0; } #header.header5 #main-menu ul.menu > li > .megamenu-child-container > ul.sub-menu { display: none; } #main-menu ul li.menu-item-simple-parent ul, #main-menu ul.menu > li > .megamenu-child-container > ul.sub-menu { padding: 0; } #main-menu ul.menu > li > .megamenu-child-container { display:block; border:none; padding: 0; } #main-menu ul.menu > li > .megamenu-child-container > ul.sub-menu { float:left; width:100%; } #main-menu ul.menu > li > .megamenu-child-container > .dt-menu-expand { display:none !important; } .megamenu-child-container > ul.sub-menu, .megamenu-child-container > ul.sub-menu ul.sub-menu { display:none; } #main-menu ul li.menu-item-simple-parent ul { box-shadow:none; } #main-menu ul li.menu-item-simple-parent ul li a, .megamenu-child-container > ul.sub-menu > li > a, .megamenu-child-container > ul.sub-menu > li > .nolink-menu, .megamenu-child-container ul.sub-menu > li > ul li a, #header.header5 #main-menu > ul > li > a { font-weight: 300; } #main-menu ul.menu > li, #main-menu ul.menu > li > ul.sub-menu > li, #main-menu ul.menu .megamenu-child-container > ul.sub-menu > li, #header.header5 #main-menu > ul > li { clear:both; padding: 0; text-align:left; width:100%; box-sizing: border-box; } #main-menu { background: none; padding: 0 0 10px 0; } #main-menu > ul.menu > li > a, #header.header4 #main-menu ul.menu > li > a, #header.header5 #main-menu > ul > li > a { display:block; float: none; box-sizing:border-box; } #header.header3 #main-menu ul.menu > li > a { padding:7px 15px; } #main-menu ul.menu li:hover, #main-menu > ul.menu > li:hover > a.dt-menu-expand, #main-menu > ul.menu > li:hover > a.dt-menu-expand:hover, #header.header5 #main-menu > ul > li > a:hover, #header.header5 #main-menu ul > li.current_page_item > a { background:rgba(255, 255, 255, 0.2) !important; } #main-menu ul.menu > li > a i { line-height:24px; } #main-menu ul li.menu-item-simple-parent ul, #main-menu ul li.menu-item-simple-parent ul li ul { left: 0; top: 27px; width: 100%; } .dt-menu-expand { display:block !important; } #header.header5 #main-menu > ul > li:hover > a, #header.header5 #main-menu > ul > li > a:hover { background: none !important; } #main-menu ul.menu .megamenu-child-container ul.sub-menu > li { position:relative; } #main-menu ul li.menu-item-simple-parent ul li ul { border:none; } #main-menu ul li.menu-item-simple-parent ul:before, .megamenu-child-container:before { background:none; } .megamenu-child-container { top:37px; } .megamenu-2-columns-group .megamenu-child-container, .megamenu-3-columns-group .megamenu-child-container, .megamenu-4-columns-group .megamenu-child-container, .megamenu-2-columns-group .megamenu-child-container > ul.sub-menu > li.menu-item-fullwidth, .megamenu-3-columns-group .megamenu-child-container > ul.sub-menu > li.menu-item-fullwidth, .megamenu-4-columns-group .megamenu-child-container > ul.sub-menu > li.menu-item-fullwidth { left: 0 !important; width:100%; } #main-menu ul.menu .megamenu-child-container > ul.sub-menu > li { clear:both; display:block; width:100%; box-sizing:border-box; } #main-menu ul.menu .megamenu-child-container > ul.sub-menu > li > a, #main-menu ul.menu .megamenu-child-container > ul.sub-menu > li > .nolink-menu { background:none; margin-bottom:0px; } #main-menu ul.menu .megamenu-child-container > ul.sub-menu > li > a, #main-menu ul.menu .megamenu-child-container > ul.sub-menu > li > .nolink-menu, #header.header5 #main-menu ul li.menu-item-simple-parent ul li a, #header.header5 #main-menu ul li .megamenu-child-container ul.sub-menu > li > ul li a, .megamenu-child-container > ul.sub-menu > ul > li > a { padding: 10px 15px; } #main-menu ul li.menu-item-simple-parent ul, #main-menu ul.menu > li > .megamenu-child-container, #main-menu ul li.menu-item-simple-parent ul, #main-menu ul li.menu-item-simple-parent ul li ul { position:inherit; top: 0; margin: 0; } #main-menu ul.menu .megamenu-child-container > ul.sub-menu > li > a.dt-menu-expand, #main-menu ul li.menu-item-simple-parent ul li a.dt-menu-expand { background:none; border:none; } #main-menu ul li.menu-item-simple-parent ul { border:none; } #main-menu ul li.menu-item-simple-parent ul li { padding: 0; clear:both; } #main-menu ul li.menu-item-simple-parent ul li ul li a, #main-menu ul li.menu-item-simple-parent ul li a, #header.header5 #main-menu ul li.menu-item-simple-parent ul ul li a, #header.header5 #main-menu ul.menu .megamenu-child-container > ul.sub-menu ul li a { padding-left:25px; } #main-menu ul li.menu-item-simple-parent ul ul ul li a, #header.header5 #main-menu ul.menu .megamenu-child-container > ul.sub-menu ul ul li a { padding-left:35px; } #main-menu ul li.menu-item-simple-parent ul li ul { padding: 0; } .megamenu-child-container > ul.sub-menu > li > a, .megamenu-child-container > ul.sub-menu > li > .nolink-menu { font-size:14px; text-transform: none; } .menu-item-widget-area-container .widget h3.widgettitle { font-size:15px; } #main-menu ul.menu .megamenu-child-container .menu-item-widget-area-container > ul > li.widget { margin: 0 0 20px; padding: 0 15px 0 15px; width:100%; box-sizing:border-box; } .menu-item-widget-area-container ul { margin: 10px 0 0; } #main-menu ul.menu li .menu-item-widget-area-container ul.menu li a { color:#ac9d8e; } #main-menu ul.menu .megamenu-child-container .menu-item-widget-area-container > ul.sub-menu ul.sub-menu li a { padding: 0; } #main-menu ul.menu .megamenu-child-container .menu-item-widget-area-container ul.menu ul.sub-menu { display:block; } #main-menu ul.menu .megamenu-child-container ul.menu ul.sub-menu li a { padding: 0; } #main-menu ul li.menu-item-simple-parent:last-child ul li ul, #main-menu ul li.menu-item-simple-parent:nth-child(6) ul li ul, #main-menu ul li.menu-item-simple-parent:nth-child(7) ul li ul { left: 0; } .megamenu-child-container > ul.sub-menu > li:before, .megamenu-child-container > ul.sub-menu > li:last-child:after { content: none; } .hasImage-bg .megamenu-child-container { background-image: none; } .dl-menuwrapper { margin: 0; position: absolute; right: 0; top: 0; width: 100%; } .dl-menuwrapper button { background: #5d6b81; border: none; cursor: pointer; float:right; height: 62px; margin: 0; outline: none; overflow: hidden; padding: 0; position: relative; text-indent: -900em; width: 70px; } .dl-menuwrapper button:after { background: #fff; content: ''; height: 5px; left: 16%; position:absolute; top: 17px ; width: 68%; box-shadow: 0 12px 0 #fff, 0 24px 0 #fff; -webkit-box-shadow: 0 12px 0 #fff, 0 24px 0 #fff; -moz-box-shadow: 0 12px 0 #fff, 0 24px 0 #fff; -ms-box-shadow: 0 12px 0 #fff, 0 24px 0 #fff; -o-box-shadow: 0 12px 0 #fff, 0 24px 0 #fff; } .page-slider-wrapper h3 { font-size: 18px; line-height: 30px; margin-bottom: 10px; } .slide-nav-control-wrapper ul li a { font-size: 12px; } .slide-nav-control-wrapper ul li a .fa { font-size: 15px; } .slide-controls-wrapper { margin: -98px 0 0; } .slide-controls { max-width: 420px; } .slide-controls li a { font-size: 12px; } .slide-controls li.selected a:after { content: none; } .slide-controls li a { padding: 25px 0; } .slide-detail h3 { font-size: 18px; } .overlay.left-aligned, .overlay.right-aligned { background: rgba(0, 0, 0, 0.55); width: 100%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; } .overlay.left-aligned { padding-right: 20px; } .overlay.right-aligned { padding-left: 20px; } .call-out.type3 .dt-sc-hr-invisible-large { display: none; } .ico-content-wrapper.type2 .ico-content { margin: 0; } .dt-sc-box-content { border-left: 1px solid; } .dt-sc-pricing-table.type2 table { display: block; overflow-x: auto; position: relative; width: auto; } .dt-sc-pricing-table.type2 td.price .dt-sc-button { font-size: 10px; padding: 10px 4px; } .search-prev, .search-next { top: 30%; } .search-next { right: -4px; } .search-prev { left: -4px; } ul.dt-sc-tabs-vertical-frame { padding: 0; } .hr-border-title:after { top: 12px; } .hr-border-title.center:after { content: none; } .blog-entry.single .entry-meta .entry-format { margin-right: 8px; padding: 0 8px 0 0; } .portfolio-carousel .portfolio, .team-carousel .column { margin-right: 0; } /** Footer **/ #footer .widget:before { content: none; } #footer .widget { padding-left: 0; } } /*----*****---- << Mobile (Landscape) >> ----*****----*/ /* Note: Design for a width of 480px */ @media only screen and (min-width: 480px) and (max-width: 767px) { .container { width:420px; } /*.content, .content-main { padding: 100px 0 45px; }*/ .boxed .wrapper, .boxed #header-wrapper { width:100%; } header .container { padding: 0; width:100%; } #header.header5 .container, #header.header5 #main-menu ul.menu > li > .megamenu-child-container > ul.sub-menu { width: 420px; } #primary, #secondary { width:100%; } #primary.with-right-sidebar, #primary.with-left-sidebar { margin-left:0px; margin-right:0px; } #secondary { margin:50px 0 0; } #secondary.left-sidebar, #secondary.right-sidebar { margin:50px 0 0px; } /*----*****---- << Header >> ----*****----*/ #bbar-wrapper .column { margin-bottom: 10px; margin-left: 0; text-align: center; width: 100%; } #bbar-wrapper .column.alignright { display: inline-block; float: none; text-align: center; } #bbar-wrapper.header1 .float-left { line-height: 15px; margin: 0; width: 28%; } #bbar-wrapper.header1 .float-right { text-align: right; width: 66%; } #bbar-wrapper.header1 .float-left .icon { display: inline-block; float: none; } #bbar-wrapper.header1 .float-left .icon span { height: 25px; padding: 15px 15px; width: 25px; } #bbar-wrapper.header1 p { font-size: 13px; line-height: 24px; } #bbar-wrapper.header1 p span { display: inline; } #bbar-wrapper.header1 .dt-sc-button { margin: 0 0 0 5px; font-size: 12px; } #bbar-wrapper.header1 p.buttons { line-height: 56px; } .main-menuwrapper ul { display:none; } .dl-menuwrapper .dl-menu { top: 62px; } /*----*****---- << Miscellaneous >> ----*****----*/ .side-nav-container { margin-bottom: 40px; } .side-nav-content h2 { margin-bottom:-40px; } .intro-text { width:92.8%; } .intro-text h2 { font-size:28px; } .ico-content-wrapper .ico-content.type1:after { bottom:-5px; transform:skewY(1.3deg); -webkit-transform:skewY(1.3deg); -moz-transform:skewY(1.3deg); -ms-transform:skewY(1.3deg); -o-transform:skewY(1.3deg); } .carousel-gallery li .entry-thumb span { bottom:-6px; transform:skewY(1.6deg); -webkit-transform:skewY(1.deg);-moz-transform:skewY(1.deg); -ms-transform:skewY(1.deg); -o-transform:skewY(1.deg); } .ico-content-wrapper.type2 { padding: 5px; } .dt-sc-team { text-align: center; } .dt-sc-team .entry-thumb .profile-image img { max-height:100%; } .dt-sc-team .social-icons { display:inline-block; float:none; text-align:center; } .dt-sc-button.medium { padding:14px 20px; } .progress-bar-wrapper .progress-bar-content { margin-bottom:20px; } .testimonial-content-wrapper { width:78%; margin-bottom:10px; } .dt-sc-testimonial-carousel-wrapper .testimonial-wrapper { padding: 0; } .dt-sc-testimonial-carousel-wrapper .testimonial-wrapper .testimonial-content-wrapper { width: 76%; } ul.dt-sc-tabs-vertical-frame { margin-bottom:20px; width:100%; } .dt-sc-tabs-container.type2 ul.dt-sc-tabs li a { font-size: 15px; padding: 0 15px; } .carousel-arrows { top:-60px; } .carousel-testimonials li { height: 210px; } .portfolio-carousel .portfolio, .team-carousel .column { width: 420px !important; } .partner-carousel li { width: 100px !important; } } /*----*****---- << Mobile >> ----*****----*/ /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ @media only screen and (max-width: 479px) { /*----*****---- << Header >> ----*****----*/ header .container { padding: 0; width:100%;} #header.header5 .container, #header.header5 #main-menu ul.menu > li > .megamenu-child-container > ul.sub-menu { width: 290px; } .boxed #header-wrapper { width:100%; } #bbar-wrapper .column { margin-bottom: 10px; margin-left: 0; text-align: center; width: 100%; } #bbar-wrapper .column.alignright { display: inline-block; float: none; text-align: center; } #bbar-wrapper.header1 .float-left, #bbar-wrapper.header1 .float-right { display: inline-block; float: none; text-align: center; width: 100%; } #bbar-wrapper.header1 .float-left { margin: 10px 0 0; } #bbar-wrapper.header1 .float-left .icon { display: inline-block; float: none; width: 49%; } #bbar-wrapper.header1 .float-left .icon span { width: 100%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; } #bbar-wrapper.header1 p { font-size: 13px; line-height: 24px; } #bbar-wrapper.header1 .float-right span { display: inline-block; } #bbar-wrapper.header1 .dt-sc-button { margin: 10px 0; } #bbar-wrapper.header1 p.buttons .dt-sc-button { margin: 0 0 10px 25px; } #phone-no { float:left; width:100%; text-align:center; } #phone-no span { float:none; } #bbar-wrapper.type2 p { font-size: 12px; } #bbar-wrapper.type2 p.contact i { font-size: 16px; } .searchform { margin-bottom: 10px; width: 100%; } #header { min-height: 52px; height: 100%; } #logo, #header.header2 #logo, #header.header3 #logo, #header.header4 #logo { margin: 7px 0 0; text-align: center; position: relative; width: 82%; z-index: 9; } #header .container, #logo, #logo a { height: 100%; } /** Menu **/ .dl-menuwrapper button { height: 52px; width: 52px; } .dl-menuwrapper button:after { top: 14px ; box-shadow: 0 10px 0 #fff, 0 20px 0 #fff; -webkit-box-shadow: 0 10px 0 #fff, 0 20px 0 #fff; -moz-box-shadow: 0 10px 0 #fff, 0 20px 0 #fff; -ms-box-shadow: 0 10px 0 #fff, 0 20px 0 #fff; -o-box-shadow: 0 10px 0 #fff, 0 20px 0 #fff; } .dl-menuwrapper .dl-menu { top: 52px; } } /*----*****---- << Mobile >> ----*****----*/ /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ @media only screen and (max-width: 319px) { .dt-style-picker-wrapper { display: none; } .container { width:200px; } #header { min-height: 44px; height: 100%; } #logo, #header.header2 #logo, #header.header3 #logo, #header.header4 #logo { margin: 6px 0 0; text-align: center; width: 78%; } #header .container, #logo, #logo a { height: 100%; } #bbar-wrapper.header1 p.buttons .dt-sc-button { margin: 0 0 10px 10px; } #header.header5 .container, #header.header5 #main-menu ul.menu > li > .megamenu-child-container > ul.sub-menu { width: 200px; } /** Menu **/ .dl-menuwrapper button { height: 44px; width: 44px; } .dl-menuwrapper button:after { height: 4px; top: 11px; } .dl-menuwrapper .dl-menu { top: 44px; } .rs-slide1 .blue_small_ubuntu.customin { top: 150px !important; } .rs-slide1 .blue_small_ubuntu.sfr { top: 180px !important; } .rs-slide1 .black { top: 190px !important; } .rs-slide2 .black, .rs-slide3 .black { top: 185px !important; } .slide-controls { max-width: 100%; } .slide-controls li a { font-size: 11px; padding: 10px 15px; } .blog-entry .entry-meta { font-size: 10px; } .dt-sc-one-column.blog-fullwidth .bx-controls-direction a, .dt-sc-one-column.blog-fullwidth.with-sidebar .bx-controls-direction a, .dt-sc-one-column.blog-thumb .bx-controls-direction a, .dt-sc-one-column.blog-thumb.with-sidebar .bx-controls-direction a { top: 24%; } .dt-sc-one-half .blog-entry .bx-controls-direction a, .dt-sc-one-half.with-sidebar .blog-entry .bx-controls-direction a, .dt-sc-one-third .blog-entry .bx-controls-direction a, .dt-sc-one-third.with-sidebar .blog-entry .bx-controls-direction a, .dt-sc-one-fourth .blog-entry .bx-controls-direction a, .dt-sc-one-fourth.with-sidebar .blog-entry .bx-controls-direction a { top: 23%; } ul.commentlist li .comment-details .comment-meta { padding: 0; } .portfolio.dt-sc-one-fourth .image-overlay a, .portfolio.dt-sc-one-third .image-overlay a, .portfolio.dt-sc-one-half .image-overlay a, .portfolio.dt-sc-one-fourth.with-sidebar .image-overlay a, .portfolio.dt-sc-one-third.with-sidebar .image-overlay a, .portfolio.dt-sc-one-half.with-sidebar .image-overlay a { height: 20px; top:36%; width:20px; } .portfolio.dt-sc-one-fourth .image-overlay a span, .portfolio.dt-sc-one-third .image-overlay a span, .portfolio.dt-sc-one-half .image-overlay a span, .portfolio.dt-sc-one-fourth.with-sidebar .image-overlay a span, .portfolio.dt-sc-one-third.with-sidebar .image-overlay a span, .portfolio.dt-sc-one-half.with-sidebar .image-overlay a span { font-size: 14px; height: 20px; line-height: 14px; width: 20px; vertical-align: middle; } .portfolio.dt-sc-one-fourth:hover .image-overlay a.link, .portfolio.dt-sc-one-third:hover .image-overlay a.link, .portfolio.dt-sc-one-half:hover .image-overlay a.link, .portfolio.dt-sc-one-fourth.with-sidebar:hover .image-overlay a.link, .portfolio.dt-sc-one-third.with-sidebar:hover .image-overlay a.link, .portfolio.dt-sc-one-half.with-sidebar:hover .image-overlay a.link { left: 26%; } .portfolio.dt-sc-one-fourth:hover .image-overlay a.zoom, .portfolio.dt-sc-one-third:hover .image-overlay a.zoom, .portfolio.dt-sc-one-half:hover .image-overlay a.zoom, .portfolio.dt-sc-one-fourth.with-sidebar:hover .image-overlay a.zoom, .portfolio.dt-sc-one-third.with-sidebar:hover .image-overlay a.zoom, .portfolio.dt-sc-one-half.with-sidebar:hover .image-overlay a.zoom { right: 26%; } .portfolio-slider-container .bx-controls-direction a { top: 8%; } .ico-content-wrapper .ico-content.type1:after, .carousel-gallery li .entry-thumb span { bottom:-5px; transform:skewY(2.6deg); -webkit-transform:skewY(2.6deg); -moz-transform:skewY(2.6deg); -ms-transform:skewY(2.6deg); -o-transform:skewY(2.6deg); } .portfolio-carousel .portfolio, .team-carousel .column, .partner-carousel li { width: 200px !important; } .page-slider-wrapper .buttons a { font-size: 12px; padding: 11px 14px; } .call-out.type3 .dt-sc-button { font-size: 13px; padding: 21px 25px; } .dt-sc-team.type1 .profile-image { line-height: 0; } .dt-sc-team.type1 .profile-image:before { background-size: 100% 101%; height: 100%; top: 0; bottom: 0; width: 100%; } .dt-sc-team.type1:hover .profile-image:before { animation: none; -webkit-animation: none; -moz-animation: none; -ms-animation: none; -o-animation: none; } .dt-sc-team.type1 .dt-sc-social-icons li a { padding: 8px; } .dt-sc-box-content h2 { padding: 0 0 0 26px; } .dt-sc-domains-list ul li span { font-size: 18px; width: 54%; } .dt-sc-domains-list ul li .dt-sc-button { font-size: 12px; } .newsletter-form input[type="text"], .newsletter-form input[type="email"], .widget .newsletter-form input[type="text"], .widget .newsletter-form input[type="email"] { width: 66%; } .newsletter-container .newsletter-form input[type="submit"] { padding: 10px; } .page_info.main-title { padding: 20px 0; } .page_info.main-title h2 { font-size: 24px; } .page_info h3 span, .page_info h2 span { margin: 0 10px 0 0; padding: 0 5px 0 0; } .page_info.main-title h2 span:after { height: 40px; line-height: 40px; left: -5px; top: 6px; width: 40px; } .page_info h3 span .fa, .page_info h2 span .fa { font-size: 14px; } .page_info.main-title h2 span .fa { font-size: 20px; } }