/* Large Devices, Wide Screens */ @media (min-width: 1200px) { p.head-text { font-size: 21px; margin-top:33px; } } @media (max-width: 1200px) { ul.department-list li a { font-size: 17px; padding: 6px 15px; } .homepage-history-outer .row { display: flex; align-items: center; } .history-image { position: relative; top: 0; } } /* Medium Devices, Desktops */ @media (min-width: 992px) and (max-width: 1199px) { p.head-text { font-size: 18px; margin-top:33px; } .col-md-quantity { width: 20%; float: left; } .nav>li>a { padding: 10px 5px; font-size: 15px; } .homepage-points .homepage-points-left .homepage-points-text-container { width: 485px; // half of .container 970px } .feature-portal h3 { font-size: 20px; } } @media (max-width: 991px) { .news-icon { padding-bottom: 10px; } .homepage-points .homepage-points-left { width: 100%; .homepage-points-text-container { width: 750px; float: none; margin: 0 auto; } } .homepage-points .homepage-points-right { width: 0; } .header-search { float: none; display: flex; align-items: normal; } .header-search { .btn-primary { flex: 1 1 content; margin-left: 5px; } .form-group { width: 100%; .search-box { width: 100%; } } } } /* Small Devices, Tablets */ @media (min-width: 769px) and (max-width: 991px) { #search-button { margin-top: 30px; } .col-sm-custom-tabs { width: 72.6%; float: left; } .col-sm-search { width: 61.666667%; float: left; } .ele-prod-heading { padding-top: 20px; } .nav > li > a { padding: 5px; font-size: 14px; } .product-main-image { margin-left: 100px; overflow: hidden; } p.head-text { font-size: 18px; margin-top: 26px; } .contact-form { margin-top: -10px; } .sm-padding-top { padding-top: 60px; } .footer-block p { font-size: 15px; } .footer-bg2 { padding-top: 5px; } } @media (min-width: 767px) { .adding-item{ text-align: center; } .ele-side-menu-container{ margin-bottom:15px; } } @media (min-width: 768px){ .navbar .nav > li { height:auto; vertical-align: middle; } .product-small-images { height: 55px; overflow: hidden; } } /* Extra Small Devices Phones */ @media (max-width: 767px) { .logo-block { position: absolute; z-index: 100; } .ele-header-logo { padding-top:13px; margin: 0; max-width: 150px; } .header-search { float: none; display: flex; align-items: baseline; padding-top: 10px; padding-bottom: 0; } .header-search { .btn-primary { flex: 1 1 content; margin-left: 5px; } .form-group { width: 100%; } } .toolbar-buttons { text-align: right; } .page-header { margin-top: 0; margin-bottom: 0; padding-bottom: 0; } p.head-text { margin-top: 0px; text-align: center; } .ele-menu-links-container { margin-left: 0px; } .nav-justified.ele-menu-links-container > li > a { text-align: left; border-bottom: 1px solid #FFF; } .nav-justified.ele-menu-links-container > li.dropdown > a.dropdown-toggle:after { font-family: 'Glyphicons Halflings'; content: "\e080"; float: right; color: #FFF; } .nav-justified.ele-menu-links-container > li.dropdown.open > a.dropdown-toggle:after { content: "\e114"; } .nav-fix .open .dropdown-menu { text-align: left; } .navbar-toggle .icon-bar { background-color: #FFF; } .navbar-toggle { border: none; background: transparent !important; margin: 0; } .navbar-toggle:hover { background: transparent !important; } .navbar-default .navbar-toggle .icon-bar { width: 22px; transition: all 0.2s; background-color: #FFF; } .navbar-toggle .top-bar { transform: translateX(3px) rotate(45deg); transform-origin: 10% 10%; } .navbar-toggle .middle-bar { opacity: 0; } .navbar-toggle .bottom-bar { transform: translateX(3px) rotate(-45deg); transform-origin: 10% 90%; } .navbar-toggle.collapsed .top-bar { transform: rotate(0); } .navbar-toggle.collapsed .middle-bar { opacity: 1; } .navbar-toggle.collapsed .bottom-bar { transform: rotate(0); } .footer-top { flex-wrap: wrap; } .footer-top h4 { padding-bottom: 10px; } .footer-block { padding: 10px 0; width: 100%; } .footer-links li { display: block; } .footer-links li+li:before { content:''; padding:0; } .footer-bg3 .right-logo img { margin: 0 auto; } .nav-fix .open .dropdown-menu { position: static; float: none; width: auto; margin-top: 0; text-align: left; background-color: transparent; } .dropdown-menu, .navbar .nav > li.open { background-color: transparent; } .nav .open > a, .nav .open > a:focus, .nav .open > a:hover { background-color: transparent; } .navbar .nav>li.open>a { color:#FFF; border-bottom: 0; &:hover { color: @siteBlack; background-color: transparent; } } .dropdown-menu > li > a:hover { color: #333; } .homepage-intro { h1 { font-size: 30px; line-height: 40px; } p { font-size: 16px; } } .center p.ele-margin-top-10 { margin-right: 18px; } .col-xs-btn { width: 100%; float: left; padding-top: 13px; } .col-xs-quantity { padding-left: 35px; min-width: 130px; } .model-description { margin-top: 50px; } .xs-margin-btn { margin: 15px 0px 40px 0px; } .xs-margin-top { margin-top: 30px; } .payment-methods img { height: 30px; } .btn-xs-block { width: 100%; } .col-sm-search { padding-bottom: 12px; } .stories-name, .story-name { margin-top: 50px; } p.head-text { font-size: 16px; margin-top: 26px; } ul.department-list li a { font-size: 16px; padding: 6px 12px; } .product-main-image { /* max-height: 250px;*/ overflow: hidden; } .product-small-images { max-height: 200px; max-width: 200px; overflow: hidden; } .product-tab-image { max-height: 200px; max-width: 200px; overflow: hidden; } .homepage-points .homepage-points-left .homepage-points-text-container { width: 100%; padding-left: 15px; padding-right: 15px; } } @media (min-width: 551px ) { .custom-save-class { text-align: center; } .custom-small-class1 { float: right !important; text-align: inherit; } } @media (max-width: 550px ) { .custom-save-class { width: 100%; text-align: left; margin-left:20px; } .custom-small-class { width: 100%; float: left !important; text-align: inherit; } .custom-small-class1 { float: left !important; text-align: inherit; } } @media (max-width: 540px) { .ecommerce-tools{ margin-top:0px; } p.head-text{ display:none; } .ele-footer-social-button { margin-right:18px; margin-left:-20px } } @media (max-width: 480px) { .logo-block { position:relative; } .ele-header-logo { margin:0 auto 10px; } .toolbar-buttons { text-align:center; } .ecommerce-tools { justify-content:center; } ul.department-list { columns: 1; } .feature-portal { width:100%; } div.category-item { width:100%; } } @media (max-width: 400px) { .contact-label { display:none; } } @media (max-width: 360px) { } @media (max-width: 320px) { }