@charset "UTF-8";
/*
Theme Name: olo ver2
Theme URI: 
Author: OLO
Author URI: olo
Description: 
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: 
*/
/* 

* {
  background: #000 !important;
  color: #0f0 !important;
  outline: solid #f00 1px !important;
}

 */
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

body {
  line-height: 1;
  background-color: #ededed;
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* remember to define focus styles!  */
/* construct  */
.cf:before,
.cf:after {
  content: " "; /* 1 */
  display: table; /* 2 */
}

.cf:after {
  clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf {
  *zoom: 1;
}

html {
  box-sizing: border-box;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

body {
  box-sizing: inherit;
  font-size: 100%;
  position: relative;
  font-family: "Open Sans", sans-serif;
  -webkit-font-smoothing: subpixel-antialiased;
}

a {
  text-decoration: none;
}

li {
  list-style: none;
}

.img,
.rimg {
  width: 100%;
  height: auto;
}

.p1 {
  padding: 1em;
}

.p2 {
  padding: 0em 2em 0em 2em;
}

.mh {
  min-height: 800px;
}

.mt6 {
  margin-top: 6em;
}

.grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-flow: dense;
}

.span2 {
  grid-column-end: span 2;
  grid-row-end: span 2;
}

.ponukatitle {
  font-size: 1.2em;
  color: #5b6165;
  font-weight: 600;
  margin-bottom: 1em;
}

.main-img {
  width: 100%;
  height: auto;
}

/* construct  */
#container {
  width: 100%;
}

.fw {
  width: 100%;
}

.col-16 {
  max-width: 1600px;
  margin: 0 auto 0;
}

.col-8 {
  width: 50%;
  float: left;
}

.col-4 {
  width: 20%;
  float: left;
}

.col-2 {
  width: 50%;
  float: left;
  padding: 1em;
}

.third {
  width: 33.3333333333%;
  float: left;
  padding: 1em 1em 1em 1em;
}

/* header  */
.con {
  background: green;
  max-width: 1600px;
  margin: 0 auto 0;
}

.absolute {
  position: absolute;
}

.header {
  position: absolute;
  padding: 1em;
  max-width: 1600px;
  width: 100%;
  padding: 1em 1em 0em 1em;
  z-index: 100;
}

.image_full {
  z-index: 10;
}

.arrow-down {
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #fff;
  margin-left: 1em;
}

/* search  */
.search_btn {
  vertical-align: top;
  text-indent: -9999px;
  background: url("http://localhost/sharp/wp-content/themes/sharp_1/img/mag.svg") no-repeat;
  border: none;
  width: 1.4em;
  height: 1.4em;
  padding: 0px;
  margin: 0px;
  cursor: pointer;
}

.s {
  width: 10em;
  height: 1.2em;
  font-size: 1em;
  margin: 0px;
  padding: 0px;
  color: #404040;
  border: none;
  border-bottom: 1px solid #323132;
  margin-right: 1em;
}

.searchform {
  display: inline-block;
  float: right;
  margin: 0.9em 0em 0em 3em;
}

/* logo  */
.logo_stimba {
  display: inline-block;
  float: left;
  width: 10em;
  height: auto;
}

.logo_con {
  width: 13em;
  display: inline-block;
  float: left;
  height: auto;
  margin-top: 1.5em;
  padding-left: 1em;
  margin-bottom: 1.5em;
}

/* menu  */
nav.main_menu {
  display: inline-block;
  float: right;
  position: relative;
  height: auto;
  margin-top: 1.5em;
}

.main_menu ul {
  display: inline-block;
  margin-top: 0.8em;
  margin-bottom: 0.5em;
}

.main_menu a {
  font-family: "myriad-pro-semi-condensed", sans-serif;
  font-weight: 600;
  color: #5b6165;
  font-size: 1.1em;
}

.main_menu a:hover {
  color: #000;
}

.main_menu li {
  display: inline-block;
  float: left;
  list-style: none;
  padding: 0em 1em 0em 1em;
  font-size: 1.2em;
}

.topmenu {
  border-bottom: 4px solid #ed1c24;
}

.supertopmenu {
  background-color: #d1d2d4;
}

.supertopmenu nav {
  float: right;
  padding-right: 0.6em;
}

.supertop_menu li {
  display: inline-block;
  list-style: none;
  padding: 0em 1em 0em 1em;
  font-size: 0.8em;
}

.supertop_menu ul {
  display: inline-block;
  margin-top: 0.4em;
  margin-bottom: 0.4em;
}

.supertop_menu a {
  font-family: "myriad-pro-semi-condensed", sans-serif;
  font-weight: 400;
  color: #5b6165;
  font-size: 1.1em;
  text-transform: uppercase;
}

.supertop_menu a:hover {
  color: #000;
}

.current-menu-item a {
  color: #000;
}

.dgreystripe {
  background-color: #5b6165;
  text-align: center;
}

.bggreystripe {
  background-color: #ededed;
}

.lgreystripe {
  background-color: #ededed;
}

.lgreystripe .copytext {
  font-family: "Open Sans", sans-serif;
  font-weight: 600;
  font-size: 1.2em;
  line-height: 1.8em;
  padding: 1em 0em 1em 0em;
  color: #5b6165;
  padding: 2em;
  text-align: right;
}

.dgreystripe img {
  border: 0px;
  margin: 0px;
  padding: 0px;
  border: none;
  width: 12%;
  height: auto;
}

.sectionheader {
  font-family: "Open Sans", sans-serif;
  font-weight: 600;
  color: #5b6165;
  font-size: 1.6em;
  padding: 1em 0em 1em 0em;
}

.center {
  text-align: center;
}

.bggreystripe .sectionheader {
  padding: 2em 0em 1em 0em;
}

.dgreystripe .sectionheader {
  color: #ededed;
}

/* main_img  */
.text_main {
  display: block;
  position: absolute;
  bottom: 8em;
  left: 2em;
}

/* footer  */
.footer_con {
  background-color: #d1d2d4;
}

/* footer nav  */
.nav_footer {
  padding: 0em 1em 1em 0em;
}

.nav_footer li {
  display: inline-block;
  float: right;
  padding: 0em 1em 0em 0em;
  width: 100%;
  border-bottom: 1px dotted #5b6165;
  margin-bottom: 0.2em;
}

h1.widget-title {
  color: #5b6165;
  padding-bottom: 1em;
  font-weight: 600;
}

.nav_footer li a {
  font-size: 0.9em;
  color: #5b6165;
  padding: 0.3em 0em 0.4em 0em;
  display: inline-block;
  width: 100%;
  float: left;
}

.nav_footer li a:hover {
  color: #000;
}

.footer_nav_con {
  background-color: #5b6165;
}

.logo_w {
  width: 5em;
  height: auto;
  display: inline-block;
  float: left;
  margin-top: 0.4em;
  padding-right: 2em;
}

.footer_copy {
  color: #fff;
  font-size: 0.9em;
  padding-top: 0.3em;
  display: inline-block;
  float: right;
}

.pad2 {
  padding: 2em;
}

.pad1 {
  padding: 1em;
}

/* product_list  */
.pro_con {
  width: 33.3333333333%;
  float: left;
  padding: 1em 0.5em 0em 0.5em;
  margin-bottom: 1em;
  overflow: hidden;
}

.pro_con a:hover {
  border-bottom: 2px solid #ed1c24;
}

.proname,
.mach-header {
  font-size: 1.4em;
  padding: 0em 1em 0.2em 1em;
  color: #5b6165;
  font-weight: 600;
}

.mach-header {
  padding: 1em 0em 0.5em 0em;
  line-height: 1.4em;
}

.logaref {
  margin-bottom: 1em;
}

.logaref img {
  width: 12%;
}

.mach-con {
  margin-top: 1em;
  margin-bottom: 1em;
}

.mach-text,
.rob-text,
.page_content p,
.robotpopis {
  padding: 0em 0em 0.5em 0em;
  color: #5b6165;
  font-size: 1em;
  line-height: 1.4em;
}

.rob-text,
.robotpopis {
  font-size: 0.9em;
  line-height: 1.4em;
}

.robotpopis {
  text-align: right;
  margin: 1em 2em 0em 0em;
  padding: 0em;
}

.page_content table {
  margin-top: 2em;
}
.page_content td {
  padding: 0.5em;
  font-size: 1em;
  line-height: 1.6em;
  color: #5b6165;
  vertical-align: top;
}
.page_content td:nth-child(2n) {
  width: 70%;
}

.pro_desc {
  font-size: 1em;
  padding: 0em 1.5em 0em 1.5em;
  color: #5b6165;
  font-weight: 600;
  line-height: 1.2em;
}

.pro_con img {
  margin-top: 1em;
  width: 220px;
  height: auto;
}

.proname_con {
  width: 100%;
  padding: 0em;
  bottom: 3em;
  right: 0em;
  text-align: right;
  margin-bottom: 1em;
}

.grey {
  background-color: #ededed;
}

.contacts p {
  font-size: 0.9em;
  color: #5b6165;
  line-height: 1.6em;
}

.contacts a {
  font-size: 0.9em;
  color: #5b6165;
}

.contacts a:hover {
  color: #ed1c24;
}

.p-tb-2 {
  padding: 2em 0em 2em 0em;
}

/* RS  */
.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
}

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 2ô;
}

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
}

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
}

.text-box {
  font-weight: 600;
  font-size: 2em;
  text-align: right;
  color: #5b6165;
  line-height: 1.6em;
}

.text-box_con {
  position: absolute;
  bottom: 10%;
  right: 20%;
  display: inline-block;
  z-index: 300;
  width: 50%;
  height: auto;
}

.bggreystripe .text-box_con {
  position: absolute;
  bottom: 4em;
  right: 2em;
  display: inline-block;
  z-index: 300;
  width: 50%;
  height: auto;
}

.rbluestripe {
  background-color: #559fd3;
}

.days {
  font-size: 3em;
  color: #fff;
  font-weight: 600;
  text-align: right;
  border-right: 3px solid #fff;
  line-height: 2em;
  padding: 0em 1em 0em 1em;
}

.prie {
  font-size: 2em;
  color: #fff;
  font-weight: 600;
  line-height: 1.6em;
  text-align: left;
}

.relative {
  position: relative;
}

.red {
  font-size: 1.6em;
  color: #ed1c24;
}

.redtext {
  color: #ed1c24;
}

.page_content {
  margin: 2em 1em 1em 1em;
}

.page_content ul {
  padding: 0em 1em 1em 1em;
  color: #5b6165;
  font-size: 0.9em;
  line-height: 1.2em;
}

.page_content li {
  padding: 0em 0em 0.2em 0em;
  list-style-type: disc;
}

/* mailchimp  */
.pagetitle {
  font-size: 1.6em;
  color: #ed1c24;
  font-weight: 600;
  margin-bottom: 0em;
}

.ponuka_button {
  margin: 1em 0em 1em 0em;
  display: inline-block;
  float: left;
  background-color: #ed1c24;
  border: none;
  padding: 1em;
  cursor: pointer;
}

.ponuka_button:hover {
  background-color: #5b6165;
}

/* robots-details  */
.robots-details h1 {
  font-size: 2em;
  color: #323132;
  font-weight: 600;
  text-align: left;
  padding: 1em 0em 1.5em 0em;
}

.mach-details h1 {
  font-size: 2em;
  color: #323132;
  font-weight: 600;
  text-align: right;
  padding: 1em 0em 1.5em 0em;
}

.robots-details ul {
  color: #323132;
  font-weight: 600;
  text-align: left;
  padding: 0em 0em 1em 0em;
}

.robots-details li {
  padding: 0em 0em 0.5em 0em;
}

.robots-details p {
  font-size: 0.9em;
  line-height: 1.4em;
  padding: 0em 0em 0.5em;
  color: #5b6165;
}

.mach-details p {
  font-size: 0.9em;
  line-height: 1.6em;
  padding: 0em 0em 0.5em 0.5em;
  text-align: left;
  color: #5b6165;
}

a.ponuka {
  color: #fff;
  font-weight: 600;
}

a.ponuka:hover {
  color: #5b6165;
}

form {
  width: 100%;
}

.third input[type=email] {
  border: none;
  background-color: #d1d2d4;
  padding: 0.3em;
  color: #5b6165;
  margin: 0px;
  float: left;
  width: 65% !important;
  line-height: 1.6em;
  text-align: center;
  border: 1px solid #5b6165;
}

.third input[type=submit] {
  border: 0px;
  background-color: #5b6165;
  font-weight: 600;
  padding: 0.3em;
  color: #fff;
  margin: 0px;
  text-transform: uppercase;
  float: left;
  width: 35%;
  line-height: 1.6em;
  cursor: pointer;
}

.mc4wp-form input[type=email] {
  width: 65% !important;
}

.mc4wp-form button,
.mc4wp-form input[type=button],
.mc4wp-form input[type=submit] {
  width: 35%;
}

.mc4wp-form label {
  color: #5b6165;
  font-size: 0.8em;
}

.mc4wp-form {
  margin: 0em !important;
}

/* table  */
table.spec {
  width: 100%;
  font-size: 0.9em;
  line-height: 1.4em;
  color: #5b6165;
}

table.spec td {
  padding: 0.5em;
}

table.spec td:nth-child(1) {
  width: 40%;
  font-weight: 600;
}

table.spec tr:nth-child(odd) {
  background: #dadbdd;
}

table.spec caption {
  font-size: 1.2em;
  font-weight: 600;
  text-align: left;
  padding: 1em 0.5em 1em 0.5em;
}

table.stroj {
  width: 100%;
  font-size: 0.9em;
  line-height: 1.4em;
  color: #5b6165;
}

table.stroj td {
  padding: 0.5em;
}

table.stroj td:nth-child(1) {
  width: 50%;
  font-weight: 600;
}

table.stroj tr:nth-child(odd) {
  background: #dadbdd;
}

table.stroj caption {
  font-size: 1.2em;
  font-weight: 600;
  text-align: left;
  padding: 1em 0.5em 1em 0.5em;
}

/* video  */
.videoWrapper-10 {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  padding-top: 25px;
  height: 0;
}

.videoWrapper-10 iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.videobox {
  background-color: #000;
  height: 100%;
}

/* kontakty  */
.kontakty input[type=submit] {
  border: 0px;
  background-color: #5b6165;
  font-weight: 600;
  padding: 0.3em;
  color: #fff;
  margin: 0px;
  text-transform: uppercase;
  float: left;
  width: 35%;
  line-height: 1.6em;
  cursor: pointer;
  margin-top: 2em;
}
.kontakty textarea {
  width: 100%;
  background-color: #ededed;
  border: none;
  padding: 1em;
}
.kontakty label {
  color: #5b6165;
  font-size: 0.9em;
  margin: 1.5em 0em 0.5em 0em;
  display: inline-block;
}
.kontakty input {
  background-color: #ededed;
  border: none;
  padding: 1em;
  width: 100%;
}

.kontakty table {
  margin-top: 2em;
  margin-bottom: 2em;
  color: #5b6165;
  font-size: 0.9em;
  width: 50%;
  display: inline-block;
  float: left;
  padding: 0em 1em 0em 1em;
}
.kontakty td {
  padding: 0.5em 0em 0.2em 0em;
}
.kontakty a {
  color: #ed1c24 !important;
  font-weight: 900;
}
.kontakty tr:first-child {
  font-size: 1.3em;
  font-weight: 900;
  margin: 0.5em 0em 2em 0em !important;
}

table.cnc {
  width: 100%;
  margin-bottom: 4em;
}

table.sustruh {
  width: 100%;
  margin-bottom: 4em;
}

table.sustruh caption {
  font-weight: 600;
  font-size: 1.4em;
  line-height: 2em;
  color: #5b6165;
  border-bottom: 1px solid #d1d2d4;
}
table.sustruh td {
  padding: 1em 0.5em 1em 0.5em;
  vertical-align: middle;
  border-bottom: 1px solid #d1d2d4;
  color: #5b6165;
}
table.sustruh th {
  text-align: left;
  padding: 1em 0.5em 1em 0.5em;
  font-weight: 600;
  font-size: 1.1em;
  line-height: 1.2em;
  color: #5b6165;
  border-bottom: 1px solid #d1d2d4;
}
table.sustruh td:first-child {
  font-weight: 600;
}
table.cnc .img_table {
  height: 4em;
  width: auto;
}
table.cnc caption {
  font-weight: 600;
  font-size: 1.4em;
  line-height: 2em;
  color: #5b6165;
  border-bottom: 1px solid #d1d2d4;
}
table.cnc td {
  padding: 0.5em;
  vertical-align: middle;
  border-bottom: 1px solid #d1d2d4;
}
table.cnc tr:hover {
  background-color: #d1d2d4;
}
table.cnc a {
  color: #5b6165;
}
table.cnc .fototd {
  width: 10%;
}
table.cnc .mach_name {
  width: 40%;
  font-weight: 600;
  font-size: 1.2em;
  line-height: 1.3em;
  color: #5b6165;
}
table.cnc .mach_desc {
  width: 50%;
  font-size: 1em;
  line-height: 1.2em;
}

.product_contain a {
  border-bottom: 2px solid #d1d2d4;
}

.product_contain a:hover {
  background-color: #d1d2d4;
  border-bottom: 2px solid #ed1c24;
}

.ur-robot-select {
  width: 60%;
  height: auto;
}

.ipa {
  padding: 1em 0em 1em 0em;
}

.ipa .ipatextcon {
  display: inline-block;
  width: 100%;
  z-index: 500;
  color: #000;
  top: 4em;
  left: 0em;
  position: absolute;
  text-align: center;
}
.ipa h2.ipa {
  font-size: 1.5em;
  font-weight: bold;
  padding: 0em;
}
.ipa h1.ipa {
  font-size: 3em;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 0.5em;
}
.ipa .date {
  font-size: 1.1em;
  font-weight: bold;
  padding-bottom: 2em;
}
.ipa a {
  font-weight: bold;
  color: #000;
}
.ipa a:hover {
  font-weight: bold;
  color: #5b6165;
}

body {
  min-height: 100vh;
  background: #ededed;
}

.video-list {
  min-height: 30em;
  padding-bottom: 3em;
}

.over {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background: rgba(100, 100, 100, 0.6);
  text-align: center;
}

.over i {
  color: rgba(255, 255, 255, 0.6);
  font-size: 6em;
  padding-top: 0.2em;
}

.over i:hover {
  color: rgba(255, 255, 255, 0.8);
}

.tag-con {
  width: 100%;
}

.tag {
  font-size: 0.7em;
  display: inline-block;
  float: left;
  padding: 0.5em;
  margin: 0em;
  color: #5b6165;
}

.video {
  background-color: none;
  height: 100%;
}

#Container .mix {
  display: none;
}

#Container .col-4 {
  padding: 0em;
}

.mix {
  height: auto;
}

.container {
  line-height: 0px;
  font-size: 0px;
}

.mix a {
  line-height: 0px;
  font-size: 0px;
}

.mix h2 {
  font-weight: bold;
  font-size: 1.1em;
  line-height: 1.2em;
  padding-top: 0.5em;
  padding-bottom: 0.2em;
  color: #5b6165;
}

.mix p {
  color: #5b6165;
  font-size: 0.9em;
  line-height: 1.4em;
  text-align: left;
  padding-bottom: 0.5em;
}

.filter {
  font-size: 0.8em;
  display: inline-block;
  float: left;
  padding: 0.5em;
  margin: 0em;
  background-color: #d1d2d4;
  font-weight: bold;
  color: #5b6165;
  cursor: pointer;
}

.kat {
  display: inline-block;
  float: left;
  padding: 0.5em;
  margin-right: 1em;
  margin-bottom: 0em;
  background-color: none;
  font-weight: bold;
  color: #5b6165;
}

.filters .active {
  background-color: #5b6165;
  color: #ededed;
}

.header-con {
  background-color: #ededed;
  padding: 4em 2em 4em 2em;
  width: 100%;
  display: grid;
  grid-template-columns: 2fr 1fr;
}
.header-con a {
  color: #5b6165;
}
.header-con h1 {
  font-size: 1.5em;
  font-weight: 700;
  padding-bottom: 0.5em;
}
.header-con h3 {
  font-size: 1em;
}
.header-con .head-contacts {
  text-align: right;
  padding-top: 0.5em;
}
.header-con .head-contacts a {
  width: 100%;
  display: inline-block;
  float: right;
  font-size: 0.8em;
  padding-bottom: 1em;
}

.p-img-full {
  width: 100%;
  height: auto;
  line-height: 0px;
}

.port-heading h2 {
  font-size: 1.1em;
  font-weight: 700;
  padding-bottom: 0.5em;
  color: #5b6165;
}

.p-fullimg-con {
  line-height: 0px;
}

.img-meta {
  color: #ededed;
  position: absolute;
  bottom: 0px;
}

.img-title {
  font-size: 0.7em;
  padding-bottom: 0.5em;
}

.img-caption {
  font-size: 0.8em;
}

.video-list {
  padding: 0em 0em 0em 0em;
}

.portfolio-head {
  max-width: 1400px;
  margin: 0 auto 0;
  display: grid;
  grid-template-columns: 1fr;
  padding: 1em;
}
.portfolio-head a {
  margin: 0 5px;
  padding: 1em 1.5em 0em 0em;
  cursor: pointer;
  font-size: 1em;
  color: #9d9d9d;
}
.portfolio-head a:hover {
  color: #5b6165;
}

.video-con {
  padding-top: 2em;
  max-width: 1400px;
  margin: 0 auto 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2em;
}

.portfolio-n {
  background-color: #ededed;
  max-width: 1400px;
  margin: 0 auto 0;
  padding: 1em;
  display: grid;
  grid-template-columns: 1fr 1fr;
  /* Target the img inside picture */
}
.portfolio-n picture {
  display: block; /* picture is inline by default */
  width: 100%;
  margin: 0 auto;
}
.portfolio-n picture img {
  width: 100%;
  height: auto;
  display: block;
}
.portfolio-n picture.full {
  /* styles for full-width images */
}
.portfolio-n picture.caption-span {
  grid-column: 1/-1; /* Spans all columns */
}

.portfolio-items h3 {
  padding-top: 0.5em;
  font-size: 1.1em;
}

.portfolio-tags .tag {
  padding: 10px 10px 0px 0px;
  border-radius: 3px;
  font-size: 0.9em;
}

.portfolio-items {
  padding: 0em 2em 2em 2em;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 2em;
}

.mix img {
  width: 100%;
  height: auto;
  display: block;
}

.portfolio-filters {
  padding: 20px;
  text-align: center;
}

.portfolio-filters {
  padding: 2em;
  display: flex;
}
.portfolio-filters a {
  margin: 0 5px;
  padding: 1em 1.5em 0em 0em;
  cursor: pointer;
  font-size: 0.8em;
  color: #9d9d9d;
}
.portfolio-filters a:hover {
  color: #5b6165;
}
.portfolio-filters a.mixitup-control-active {
  color: #5b6165;
}

.portfolio-tags {
  margin: 10px 0;
}

.portfolio-tags .tag {
  display: inline-block;
  background: #f0f0f0;
  padding: 4px 16px 4px 0px;
  margin: 0 4px 4px 0;
  border-radius: 3px;
  font-size: 0.9em;
}

.portfolio-tags strong {
  margin-right: 8px;
}

@media (max-width: 1200px) {
  .ipa .ipatextcon {
    top: 2em;
    font-size: 0.9em;
  }
  .portfolio-items {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 950px) {
  .logo_con {
    width: 100%;
    margin-bottom: 0em;
  }
  nav.main_menu {
    margin-top: 0.5em;
  }
  .text-box {
    font-size: 1.6em;
  }
  .portfolio-n {
    grid-template-columns: 1fr;
  }
  .video-con {
    grid-template-columns: 1fr;
  }
  .portfolio-items {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 800px) {
  .grid {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
  .logo_con {
    width: 100%;
    margin-bottom: 0em;
  }
  nav.main_menu {
    margin-top: 0.5em;
  }
  .product_contain_img {
    width: 60%;
  }
  .ipa .date {
    padding-bottom: 0.5em;
  }
  .ipa .ipatextcon {
    top: 1em;
    font-size: 0.8em;
  }
}
@media (max-width: 750px) {
  body {
    font-size: 0.9em;
  }
  .logo_con {
    width: 100%;
    margin-bottom: 0em;
  }
  .pro_con img {
    width: 80%;
  }
  .col-4 {
    width: 50%;
  }
}
@media (max-width: 700px) {
  .video-list .col-8 {
    width: 100%;
  }
  .header-con .col-8 {
    width: 50%;
  }
  .port-img-con .col-8 {
    width: 100%;
  }
  .logaref img {
    width: 20%;
  }
}
@media (max-width: 600px) {
  .text-box {
    font-size: 1.3em;
  }
}
@media (max-width: 550px) {
  .grid {
    grid-template-columns: 1fr 1fr;
  }
  body {
    font-size: 0.8em;
  }
  .ipa {
    background-color: #faea27;
  }
  .ipa .ipatextcon {
    padding: 1em 0em 2em 0em;
    position: relative;
  }
  .pro_con {
    width: 100%;
    padding: 1em 0em 0em 0em;
  }
  .pro_con img {
    height: auto;
    width: 30%;
    display: inline-block;
    float: left;
  }
  .proname_con {
    width: 50%;
    display: inline-block;
    float: right;
  }
  .grey {
    height: auto;
    min-height: auto;
  }
  .third {
    width: 100%;
  }
  .proname_con {
    margin-top: 0.5em;
  }
}
@media (max-width: 400px) {
  body {
    font-size: 0.7em;
  }
  .pro_con img {
    height: auto;
    width: 50%;
  }
  .proname_con {
    width: 50%;
  }
  .grey {
    height: auto;
    min-height: auto;
  }
  .rslides {
    display: none;
  }
  .text-box {
    display: none;
  }
  .main_menu {
    display: none !important;
  }
  .logo_con {
    margin-bottom: 1em;
  }
  .logo_stimba {
    width: 16em;
  }
  .col-8 {
    width: 100%;
  }
  .col-4 {
    width: 50%;
  }
}
@media (max-width: 300px) {
  .proname_con {
    width: 100%;
    float: left;
    text-align: left;
    margin-top: 0em;
  }
  .grey {
    height: auto;
    min-height: auto;
  }
  .logaref img {
    width: 40%;
  }
}