/*
Theme Name: Summutiabi
Theme URI: www.summutiabi.ee
Description: Veebiks
Author: Rando Rooberg | Veebiks kiired ja vihased kodulehed ja e-poed
Author URI: https://www.veebiks.ee
Version: 1.0
License: Veebiks | Kopeerimine ja jagamine keelatud
*/

* { box-sizing: border-box;}
body {background-color: #ffffff; font-size: 1rem; line-height: 2; color: #1D1D1D000; font-family: "Montserrat", sans-serif; font-style: normal; font-optical-sizing: auto; font-weight: 400;  }

img {max-width: 100%; height: auto;}

img.alignright {float:right; margin:0 0 1rem 1rem}
img.alignleft {float:left; margin:0 1rem 1rem 0}
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
a img.alignright {float:right; margin:0 0 1rem 1rem}
a img.alignleft {float:left; margin:0 1rem 1rem 0}
a img.aligncenter {display: block; margin-left: auto; margin-right: auto}

.table_wrapp {overflow: auto;}
table {border-collapse: collapse; width: 100%; margin-top: 1rem;}
table td, table th {border: 0.063rem solid #213540; padding: 0.5rem;}
table th {padding: 0.938rem 0.625rem!important; text-align: left; border: 0.063rem solid #213540!important; background-color: #213540; color: #ffffff;}

iframe, video  {width: 100%; margin: 0; padding: 0;}
object {min-height: 75rem;}

strong {font-weight: 800;}

label {font-weight: 800;}
input, select, textarea {width: 100%!important; padding: 1.5rem 1rem!important; border: none; box-sizing: border-box!important; margin-bottom: 0.625rem!important; -webkit-appearance: none; border-radius: 0;}
input[type=submit] {background-color: #0191DA!important; font-weight: 700!important; color: #ffffff!important; border: none!important; width: 30%!important; float: right!important; cursor: pointer; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-appearance: none; border-radius: 0;}
input[type=submit]:hover {background-color: #000000!important; color: #ffffff!important;} 
textarea {height: 12.9rem;}

input:focus, select:focus, textarea:focus, option:focus {outline: none!important;}

button {background-color: #0191DA; font-weight: 700; margin: 0!important; color: #ffffff; cursor: pointer; -webkit-transition-duration: 0.5s; transition-duration: 0.5s;}
button:hover {background-color: #000000; color: #ffffff;}

form.invalid input.wpcf7-not-valid, select.wpcf7-not-valid, textarea.wpcf7-not-valid {border:0.3rem solid #FF0000!important; }
.wpcf7-not-valid-tip {display: none!important;}
.wpcf7-response-output {width: 100%!important; margin: -2.25rem 0 0 0!important;}

.is-layout-flex {margin-top: -0.75rem;}

h1, h2, h3, h4, h5, h6 {color: #000000; line-height: 1.2; font-weight: 800;}

h1 { font-size: 2.5rem;}
h2 { font-size: 2rem;}
h3 { font-size: 2rem;}
h4 { font-size: 2rem; }
h5 { font-size: 1.5rem; }
h6 { font-size: 1.2rem; }

a {color: #0191DA; font-weight: 600; text-decoration: none; -webkit-transition-duration: 0.5s; transition-duration: 0.5s;}
a:hover {color: #000000; text-decoration: underline; }

.container { width: 75rem; max-width: 100%; padding: 0;}

#header {width: 100%;}
#header .container {position: relative; display: flex; flex-wrap: wrap; align-items: center;}

#top-header {display: flex; justify-content: center; background-color: #213540; font-weight: 600; color: #ffffff; padding: 1rem 0; font-size: 0.85rem;}
#bottom-header {display: flex; justify-content: center; background-color: #F9F9F9;}

#header-slogan a {color: #ffffff; text-decoration: underline;}
#header-slogan a:hover {color: #0191DA;}

#lang-sw {margin-left: auto;}
#lang-sw ul {padding: 0; margin: 0; list-style: none;}
#lang-sw ul li {display: inline-block; margin-left: 0.5rem;}
#lang-sw ul li a {color: #ffffff;}
#lang-sw ul li a:hover {color: #0191DA;}

#lang-sw-mob {display: none;}

#logo {position: relative; padding: 0.938rem 0 0 0;}
#logo img, #logo-mob img {max-width: 9rem; }

#logo-mob {display: none;}	

#navigation {margin-left: auto;}
#navigation ul {padding: 0; margin: 0; list-style: none;}
#navigation ul li {display: inline-block;}
#navigation ul li a {text-decoration: none; padding: 0.5rem 0 0.5rem 0.5rem; color: #000000; font-size: 1rem; font-weight: 500; -webkit-transition-duration: 0.5s; transition-duration: 0.5s;}
#navigation ul li a:hover {text-decoration: none; color: #0191DA;}
#navigation .current-menu-item a {color: #0191DA; font-weight: 600;}

.sub-menu {display: none; position: absolute; z-index: 2; padding: 0!important;}
.sub-menu li {display: block!important; margin: 0;}
.sub-menu li a {display: block; padding: 0.313rem 0!important; font-weight: 400!important; font-size: 1rem!important;}
.sub-menu li a:hover {text-decoration: underline!important;}
#navigation .current-menu-item .sub-menu li a {color: #000000;}
.menu-item-has-children:hover .sub-menu {display: block;}
.sub-menu-inner {background-color: #F9F9F9; margin-top: 2.2rem; min-width: 10rem; padding: 0.575rem; margin-left: 0;}

.btn-close {display: none;}

#frontpage-hero {display: flex; justify-content: center; width: 100%; min-height: 37.5rem; position: relative; background: url(images/line.png); background-color: rgba(0, 0, 0, 0.5); }
#frontpage-hero .container {position: relative; display: flex; flex-wrap: wrap; align-items: center;}

#video-block {position: relative; width: 100%; min-height: 37.5rem;}
.videoContainer {position: absolute; width: 100%; height: 100%; background-color:rgba(0,0,0,0.9); top: 0; right: 0; bottom: 0; left: 0;}
.videoContainer video, .videoContainer img {object-fit: cover; height: 100%!important; width: 100%!important;}

#front-search-desc {color: #ffffff; width: 49%;}
#front-search-desc h2 {color: #ffffff;}
#front-search-desc a:hover {color: #ffffff;}
.look-me {font-size: 1.2rem; font-weight: 800; color: #FF0000;}

#front-search {width: 49%; margin-left: auto;}
#front-search form {display: flex;}
#front-search input {padding: 2rem 1rem!important; background-color: #fafafa;}

#page {display: flex; justify-content: center; flex-wrap: wrap; width: 100%; margin: 0 0 3rem 0;}
#page-title {padding: 8rem 0; margin: 0 0 3rem 0; background-color: #213540; width: 100%;}
#page-title h1 {margin: 0; color: #ffffff; text-align: center;}

#stock-search-result {display: flex; justify-content: center; width: 100%; padding: 2rem 0;}
#stock-search-result .container {position: relative;}
#stock-search-result h2 {margin-top: 0;}

.language-et .outstock span, .language-et .instock span, .language-en .outstock span, .language-en .instock span, .language-ru .outstock span, .language-ru .instock span {display: none;}
.language-et .outstock:after {content: 'Laost otsas'; font-weight: 700; color: red;}
.language-et .instock:after {content: 'Laos olemas'; font-weight: 700; color: green;}

.language-en .outstock:after {content: 'Out of stock'; font-weight: 700; color: red;}
.language-en .instock:after {content: 'In stock'; font-weight: 700; color: green;}

.language-ru .outstock:after {content: 'Нет на складе'; font-weight: 700; color: red;}
.language-ru .instock:after {content: 'B наличии'; font-weight: 700; color: green;}

#bottom-cta {display: flex; justify-content: center; width: 100%; padding: 2rem 0 3rem 0; background-color: #F9F9F9;}
#bottom-cta label {color: #213540;}
#bottom-cta h2 {color: #FF0000; margin-bottom: 2rem;}
#bottom-cta form {display: flex; flex-wrap: wrap;}
#bottom-cta input, #bottom-cta textarea {background-color: #D0D0D0; border: 0.3rem solid #D0D0D0;}
.left-side-push {width: 49%;}
.right-side-push {width: 49%; margin-left: auto;}
#bottom-cta form .wpcf7-submit {width: 100%!important; margin-top: 1.4rem; border: 0.3rem solid #0191DA!important; padding: 1.5rem 1rem!important;}
#bottom-cta form .wpcf7-submit:hover {border: 0.3rem solid #000000!important;}

#footer {display: flex; justify-content: center; background-color: #213540; border-bottom: 0.625rem solid #0191DA; color: #ffffff; margin-top: -1.5rem; padding: 2rem 0 1rem 0;}
#footer .container {display: flex;}

#contact-info p {line-height: 1; font-size: 0.85rem;}
#contact-info a {color: #ffffff; text-decoration: underline;}
#contact-info a:hover {color: #0191DA;}

#awards {margin-left: auto;}
#awards img {height: 7rem;}

@media (max-width: 1280px) {
.container {padding: 0 0.625rem; overflow: hidden;}
.menuicon {cursor: pointer; margin-left: auto;}
.bar1, .bar2, .bar3 {width: 40px; height: 4px; background-color: #0191DA; margin: 7px 0;}
.change .bar1 {opacity: 0;}
.change .bar2 {}
.change .bar3 {opacity: 0; }

#logo-mob {display: block; margin-top: 1.25rem; margin-left: 0.625rem;}

.btn-close {display: block; font-size: 5rem; cursor: pointer; position: absolute; top: -2rem; right: 0.625rem; color: #000000;}

#navigation {background-color: #F9F9F9; display: none; position: fixed; z-index: 1; left: 0; top: 0; bottom: 0; overflow-y: auto; overflow-x:hidden; transition: 0.5s;}
#navigation ul li {width: 100%; position: relative;}
#navigation ul li a{width: 100%; color: #000000; display: inline-block; padding: 0.625rem 0; font-weight: 600;}
#navigation ul li a:hover {color: #000000;}
.menu-item-has-children:hover .sub-menu {display: none;}
.navigation-active {display: block!important; width: 100%!important;}
#navigation-inside {margin: 1rem 0 0 0.625rem;}
#navigation .current-menu-item a {color: #000000; font-weight: 600;}

#navigation .with_sub {display: block!important;}
#navigation .with_sub:after {content: '\002B'; color: #000000; padding: 0 0.938rem; cursor: pointer; position: absolute; font-weight: bold; font-size: 2rem; top: -0.45rem; right: 0;}
#navigation .sub-menu-opened:after {content: '\002D'!important; top: -0.45rem; right: 0.063rem;}

.sub-menu {position: relative; z-index: 1;}
.sub-menu-inner {margin: 0; padding: 0; min-width: initial; background-color: transparent;}

#lang-sw-mob {display: block; margin-top: 3.5rem; text-align: center;}
#lang-sw-mob p {margin-bottom: 0; font-weight: 800;}
#lang-sw-mob ul li {width: auto; margin-left: 1rem;}
#lang-sw-mob ul li:first-of-type {margin-left: 0;}

table {margin: 1rem 0;}	
.is-layout-flex {margin-top: 0;}
.is-layout-flow {margin-top: -3.5rem!important;}
.is-layout-flow:first-of-type {margin-top: 0!important;}
	
#page {margin: 0;}
#page-title {width: 100vw; padding: 4rem 0; margin-left: -0.625rem; margin-right: -0.625rem; margin-bottom: 0;}

}

@media (max-width: 1050px) {
#awards {margin-left: auto;}
#awards img {height: 4rem;}
}

@media (max-width: 850px) {
#front-search-desc {width: 100%;}
#front-search {width: 100%; margin-top: -10rem;}
#front-search input {padding: 1.75rem 1rem!important;}
#front-search input[type=submit] {width: 45%!important;}

.left-side-push {width: 100%;}
.right-side-push {width: 100%;}
#bottom-cta {padding-bottom: 0; padding-top: 1rem;}
#bottom-cta form .wpcf7-submit {margin: 0;}
#bottom-cta input, #bottom-cta textarea {padding: 1rem!important;}
#bottom-cta textarea {height: 10rem;}
#bottom-cta h2 {margin-bottom: 1rem;}
	
#stock-search-result {padding: 2rem 0;}
	
.wpcf7-response-output {margin: -2rem 0 3.5rem 0!important;}
}

@media (max-width: 785px) {
#header-slogan {width: 100%; text-align: center; font-size: 0.5rem}
#lang-sw {display: none;}
#logo img, #logo-mob img {max-width: 7rem; }	
#footer .container {flex-wrap: wrap;}
#awards {width: 100%;}
}

@media (max-width: 400px) {
#bottom-cta h2 {font-size: 1.75rem;}
#contact-info p {font-size: 0.65rem;}
}