/* Shared */

.container-header {
    width: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% auto;
    position: relative;
}

.select-selected:after,
.select-selected.select-arrow-active:after,
.select-items div,
.select-selected,
.container-products .devices-details .gadgets .view .view-list,
.container-products .devices-details .gadgets .view .view-grid {
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
}

.container-category .container-list .list-item {
    color: rgb(39, 47, 50);
    cursor: pointer;
}

.container-products .selected-item {
    color: rgb(25, 181, 232) !important;
}

h3 {
    font-family: "Montserrat", sans-serif;
    color: rgb(39, 47, 50);
}

p {
    font-family: 'Comfortaa', cursive;
    color: rgb(116, 116, 116);
}

h5 {
    font-family: "Montserrat";
    color: rgb(39, 47, 50);
}


/* Extra small */

@media (max-width: 575px) {
    button {
        margin-top: 2vw;
    }
    p {
        padding-left: 0.5vw;
        font-size: 3vw;
        margin-bottom: 0;
    }
    h5 {
        font-size: 4vw;
    }
    .container-header {
        height: 30vw;
        background-image: url('images/products/header-mobile-bg.png');
        background-position: bottom;
    }
    .container-products {
        margin-top: 5vw;
        margin-bottom: 5vw;
    }
    .container-products h1 {
        margin-top: 11vw;
        color: #273133;
        text-align: center;
    }
    .container-category {
        margin: 3vw 0 0 0;
        width: 17vw;
        border-right: 1px solid #EEEEEE;
    }
    .container-category h3 {
        color: #7E8282;
    }
    .container-category .container-list {
        list-style-type: none;
        margin-top: 1.5vw;
    }
    .container-category .container-list .list-item {
        padding: 9px 0 0 0;
        font-family: "Comfortaa", cursive;
    }
    .container-products .devices-details {
        margin: 3vw 0 0 0;
        width: 17vw;
        padding-bottom: 20vw;
    }
    .container-products .devices-details h3 {
        color: #7E8282;
    }
    .container-products .devices-details .gadgets .sort {
        position: relative;
    }
    .container-products .devices-details .gadgets .sort select {
        display: none;
    }
    .select-selected {
        background-color: #fff;
    }
    .select-selected:after {
        position: absolute;
        background-image: url('images/products/select/arrowdown.png');
        content: "";
        top: 0.4vw;
        right: 4.5vw;
        width: 1.7vw;
        height: 1.7vw;
    }
    .select-selected.select-arrow-active:after {
        position: absolute;
        background-image: url('images/products/select/arrowup.png');
        top: 0.4vw;
    }
    .select-items div,
    .select-selected {
        background-image: url('images/products/select/first-border.png');
        font-family: "Montserrat";
        color: rgb(39, 47, 50);
        cursor: pointer;
        width: 15vw;
        padding: 0.5vw 0 0 0.9vw;
        font-size: 1vw;
        height: 2.5vw;
        user-select: none;
    }
    .select-items {
        background-color: #fff;
        top: 100%;
        left: 0;
        right: 0;
        width: 15vw;
        z-index: 99;
    }
    .select-hide {
        display: none;
    }
    .container-products .devices-details .gadgets .view .style {
        position: relative;
        display: inline-block;
        width: 6vw;
        height: 6vw;
        float: right;
        margin-left: 10%;
        cursor: pointer;
    }
    .container-products .devices-details .gadgets .view .view-list {
        background-image: url('images/products/grid/view-list.png');
    }
    .container-products .devices-details .gadgets .view .view-grid {
        background-image: url('images/products/grid/view-grid.png');
        filter: grayscale(100%);
    }
    .container-products .devices-details .elements .device-image {
        background-position: center;
        background-repeat: no-repeat;
        background-size: auto 80%;
        border: 1px #7CB5C0 solid;
        border-radius: 15vw;
        width: 30vw;
        margin-top: 3vw;
        height: 30vw;
    }
    .container-products .devices-details .elements .device-info {
        display: table;
        height: 100%;
        margin-top: 1.6vw;
    }
    .container-products .devices-details .elements .device-info div {
        display: table-cell;
        vertical-align: middle;
    }
    .page-navigation {
        top: 0;
        left: 5vw;
        width: 5vw;
        position: absolute;
        height: 100%;
        z-index: 10;
        display: none;
    }
    .page-navigation .icon {
        position: relative;
        width: 1.8vw;
        height: 1.8vw;
        text-align: center;
        line-height: 1.6vw;
        border-radius: 0.9vw;
        font-size: 0.8vw;
    }
    .page-navigation .light {
        color: #FDFDFD;
        border: 1px #FDFDFD solid;
    }
    .page-navigation .light-line {
        color: #FDFDFD;
        border-left: 1px #FDFDFD solid;
    }
    .page-navigation .vert-line {
        width: 1px;
    }
    .page-navigation .home-line {
        margin-top: 0.5vw;
        margin-left: 0.85vw;
        height: 1.5vw;
    }
    .page-navigation .home-icon {
        margin-top: 2vw;
    }
    .page-navigation .dark {
        color: #7CB5C0;
        border: 1px #7CB5C0 solid;
    }
    .page-navigation .dark-line {
        width: 1px;
        height: 12vw;
        margin-top: 1.5vw;
        margin-left: 0.85vw;
        color: #7CB5C0;
        border-right: 1px solid;
    }
    .page-navigation .products-icon {
        margin-top: 1.5vw;
    }
    .page-navigation .dark-line-final {
        height: 55vw;
        margin-top: 1.3vw;
    }
    .devices-details .elements {
        margin-top: 7vw;
    }
}


/* Small */

@media (min-width: 576px) and (max-width: 767px) {
    button {
        margin-top: 2vw;
        font-size: 2.5vw;
    }
    p {
        padding-left: 0.5vw;
        font-size: 2.5vw;
        margin-bottom: 0;
    }
    h5 {
        font-size: 3.5vw;
    }
    .container-header {
        height: 30vw;
        background-image: url('images/products/header-mobile-bg.png');
        background-position: bottom;
    }
    .container-products {
        margin-top: 5vw;
        margin-bottom: 5vw;
    }
    .container-products h1 {
        margin-top: 11vw;
        color: #273133;
        text-align: center;
    }
    .container-category {
        margin: 3vw 0 0 0;
        width: 17vw;
        border-right: 1px solid #EEEEEE;
    }
    .container-category h3 {
        color: #7E8282;
    }
    .container-category .container-list {
        list-style-type: none;
        margin-top: 1.5vw;
    }
    .container-category .container-list .list-item {
        padding: 9px 0 0 0;
        font-family: "Comfortaa", cursive;
    }
    .container-products .devices-details {
        margin: 3vw 0 0 0;
        width: 17vw;
        padding-bottom: 20vw;
    }
    .container-products .devices-details h3 {
        color: #7E8282;
    }
    .container-products .devices-details .gadgets .sort {
        position: relative;
    }
    .container-products .devices-details .gadgets .sort select {
        display: none;
    }
    .select-selected {
        background-color: #fff;
    }
    .select-selected:after {
        position: absolute;
        background-image: url('images/products/select/arrowdown.png');
        content: "";
        top: 0.4vw;
        right: 4.5vw;
        width: 1.7vw;
        height: 1.7vw;
    }
    .select-selected.select-arrow-active:after {
        position: absolute;
        background-image: url('images/products/select/arrowup.png');
        top: 0.4vw;
    }
    .select-items div,
    .select-selected {
        background-image: url('images/products/select/first-border.png');
        font-family: "Montserrat";
        color: rgb(39, 47, 50);
        cursor: pointer;
        width: 15vw;
        padding: 0.5vw 0 0 0.9vw;
        font-size: 1vw;
        height: 2.5vw;
        user-select: none;
    }
    .select-items {
        background-color: #fff;
        top: 100%;
        left: 0;
        right: 0;
        width: 15vw;
        z-index: 99;
    }
    .select-hide {
        display: none;
    }
    .container-products .devices-details .gadgets .view {}
    .container-products .devices-details .gadgets .view .style {
        position: relative;
        display: inline-block;
        width: 6vw;
        height: 6vw;
        float: right;
        margin-left: 10%;
        cursor: pointer;
    }
    .container-products .devices-details .gadgets .view .view-list {
        background-image: url('images/products/grid/view-list.png');
    }
    .container-products .devices-details .gadgets .view .view-grid {
        background-image: url('images/products/grid/view-grid.png');
        filter: grayscale(100%);
    }
    .container-products .devices-details .elements .device-image {
        background-position: center;
        background-repeat: no-repeat;
        background-size: auto 80%;
        border: 1px #7CB5C0 solid;
        border-radius: 15vw;
        width: 30vw;
        margin-top: 3vw;
        height: 30vw;
    }
    .container-products .devices-details .elements .device-info {
        display: table;
        height: 100%;
        margin-top: 1.6vw;
    }
    .container-products .devices-details .elements .device-info div {
        display: table-cell;
        vertical-align: middle;
    }
    .page-navigation {
        display: none;
    }
    .devices-details .elements {
        margin-top: 7vw;
    }
}


/* Medium */

@media (min-width: 768px) and (max-width: 991px) {
    button {
        margin-top: 2vw;
    }
    p {
        padding-left: 0.5vw;
        font-size: 1.5vw;
        margin-bottom: 0;
    }
    h5 {
        font-size: 2.5vw;
    }
    .container-header {
        height: 30vw;
        background-image: url('images/products/header-mobile-bg.png');
        background-position: bottom;
    }
    .container-products {
        margin-top: 5vw;
        margin-bottom: 5vw;
    }
    .container-products h1 {
        margin-top: 11vw;
        color: #273133;
        text-align: center;
    }
    .container-category {
        margin: 3vw 0 0 0;
        width: 17vw;
        border-right: 1px solid #EEEEEE;
    }
    
    .container-category h3 {
        color: #7E8282;
    }
    .container-category .container-list {
        list-style-type: none;
        margin-top: 1.5vw;
    }
    .container-category .container-list .list-item {
        padding: 9px 0 0 0;
        font-family: "Comfortaa", cursive;
    }
    .container-products .devices-details {
        margin: 3vw 0 0 0;
        width: 17vw;
        padding-bottom: 20vw;
    }
    .container-products .devices-details h3 {
        color: #7E8282;
    }
    .container-products .devices-details .gadgets .sort {
        position: relative;
    }
    .container-products .devices-details .gadgets .sort select {
        display: none;
    }
    .select-selected {
        background-color: #fff;
    }
    .select-selected:after {
        position: absolute;
        background-image: url('images/products/select/arrowdown.png');
        content: "";
        top: 0.4vw;
        right: 4.5vw;
        width: 1.7vw;
        height: 1.7vw;
    }
    .select-selected.select-arrow-active:after {
        position: absolute;
        background-image: url('images/products/select/arrowup.png');
        top: 0.4vw;
    }
    .select-items div,
    .select-selected {
        background-image: url('images/products/select/first-border.png');
        font-family: "Montserrat";
        color: rgb(39, 47, 50);
        cursor: pointer;
        width: 15vw;
        padding: 0.5vw 0 0 0.9vw;
        font-size: 1vw;
        height: 2.5vw;
        user-select: none;
    }
    .select-items {
        background-color: #fff;
        top: 100%;
        left: 0;
        right: 0;
        width: 15vw;
        z-index: 99;
    }
    .select-hide {
        display: none;
    }
    .container-products .devices-details .gadgets .view {}
    .container-products .devices-details .gadgets .view .style {
        position: relative;
        display: inline-block;
        width: 6vw;
        height: 6vw;
        float: right;
        margin-left: 10%;
        cursor: pointer;
    }
    .container-products .devices-details .gadgets .view .view-list {
        background-image: url('images/products/grid/view-list.png');
    }
    .container-products .devices-details .gadgets .view .view-grid {
        background-image: url('images/products/grid/view-grid.png');
        filter: grayscale(100%);
    }
    .container-products .devices-details .elements .device-image {
        background-position: center;
        background-repeat: no-repeat;
        background-size: auto 80%;
        border: 1px #7CB5C0 solid;
        border-radius: 15vw;
        width: 30vw;
        margin-top: 3vw;
        height: 30vw;
    }
    .container-products .devices-details .elements .device-info {
        display: table;
        height: 100%;
        margin-top: 1.6vw;
    }
    .container-products .devices-details .elements .device-info div {
        display: table-cell;
        vertical-align: middle;
    }
    .page-navigation {
        display: none;
    }
    .devices-details .elements {
        margin-top: 7vw;
    }
}


/* Large */

@media (min-width: 992px) and (max-width: 1199px) {
    button {
        border-radius: 22px;
        width: 15vw;
        font-size: 1vw;
    }
    p {
        font-size: 0.7vw;
        padding-left: 0.5vw;
    }
    h5 {
        font-size: 1.1vw;
    }
    .container-header {
        height: 14vw;
        background-image: url('images/products/background.png');
    }
    .container-products {
        margin-top: 5vw;
        margin-bottom: 5vw;
    }
    .container-products h1 {
        margin-left: 10vw;
        margin-top: 3vw;
        color: #273133;
        font-size: 4.5vw;
    }
    .container-category {
        margin: 3vw 0 0 0;
        width: 17vw;
        border-right: 1px solid #EEEEEE;
    }
    .container-category h3 {
        font-size: 2vw;
        color: #7E8282;
    }
    .container-category .container-list {
        list-style-type: none;
        margin-top: 1.5vw;
    }
    .container-category .container-list .list-item {
        padding: 9px 0 0 0;
        font-family: "Comfortaa", cursive;
        font-size: 1vw;
    }
    .container-products .devices-details {
        margin: 3vw 0 0 0;
        height: 40vw;
        width: 17vw;
    }
    .container-products .devices-details h3 {
        font-size: 2vw;
        color: #7E8282;
    }
    .container-products .devices-details .gadgets .sort {
        position: relative;
    }
    .container-products .devices-details .gadgets .sort select {
        display: none;
    }
    .select-selected {
        background-color: #fff;
    }
    .select-selected:after {
        position: absolute;
        background-image: url('images/products/select/arrowdown.png');
        content: "";
        top: 0.4vw;
        right: 4.5vw;
        width: 1.7vw;
        height: 1.7vw;
    }
    .select-selected.select-arrow-active:after {
        position: absolute;
        background-image: url('images/products/select/arrowup.png');
        top: 0.4vw;
    }
    .select-items div,
    .select-selected {
        background-image: url('images/products/select/first-border.png');
        font-family: "Montserrat";
        color: rgb(39, 47, 50);
        cursor: pointer;
        width: 15vw;
        padding: 0.5vw 0 0 0.9vw;
        font-size: 1vw;
        height: 2.5vw;
        user-select: none;
    }
    .select-items {
        background-color: #fff;
        top: 100%;
        left: 0;
        right: 0;
        width: 15vw;
        z-index: 99;
    }
    .select-hide {
        display: none;
    }
    .container-products .devices-details .gadgets .view {}
    .container-products .devices-details .gadgets .view .style {
        position: relative;
        display: inline-block;
        width: 3vw;
        height: 3vw;
        float: right;
        margin-left: 6%;
        cursor: pointer;
    }
    .container-products .devices-details .gadgets .view .view-list {
        background-image: url('images/products/grid/view-list.png');
    }
    .container-products .devices-details .gadgets .view .view-grid {
        background-image: url('images/products/grid/view-grid.png');
        filter: grayscale(100%);
    }
    .container-products .devices-details .elements .device-image {
        background-position: center;
        background-repeat: no-repeat;
        background-size: auto 80%;
        border: 1px #7CB5C0 solid;
        border-radius: 8vw;
        width: 13vw;
        margin-top: 3vw;
        height: 13vw;
    }
    .container-products .devices-details .elements .device-info {
        display: table;
        height: 100%;
        margin-top: 1.6vw;
    }
    .container-products .devices-details .elements .device-info div {
        display: table-cell;
        vertical-align: middle;
    }
    .page-navigation {
        top: 0;
        left: 5vw;
        width: 5vw;
        position: absolute;
        height: 100%;
        z-index: 10;
    }
    .page-navigation .icon {
        position: relative;
        width: 1.8vw;
        height: 1.8vw;
        text-align: center;
        line-height: 1.6vw;
        border-radius: 0.9vw;
        font-size: 0.8vw;
    }
    .page-navigation .light {
        color: #FDFDFD;
        border: 1px #FDFDFD solid;
    }
    .page-navigation .light-line {
        color: #FDFDFD;
        border-left: 1px #FDFDFD solid;
    }
    .page-navigation .vert-line {
        width: 1px;
    }
    .page-navigation .home-line {
        margin-top: 0.5vw;
        margin-left: 0.85vw;
        height: 1.5vw;
    }
    .page-navigation .home-icon {
        margin-top: 2vw;
    }
    .page-navigation .dark {
        color: #7CB5C0;
        border: 1px #7CB5C0 solid;
    }
    .page-navigation .dark-line {
        width: 1px;
        height: 12vw;
        margin-top: 1.5vw;
        margin-left: 0.85vw;
        color: #7CB5C0;
        border-right: 1px solid;
    }
    .page-navigation .products-icon {
        margin-top: 1.5vw;
    }
    .page-navigation .dark-line-final {
        height: 55vw;
        margin-top: 1.3vw;
    }
}


/* Extra large */

@media (min-width: 1200px) {
    button {
        border-radius: 22px;
        width: 15vw;
        font-size: 1vw;
    }
    p {
        font-size: 0.7vw;
        padding-left: 0.5vw;
    }
    h5 {
        font-size: 1.1vw;
    }
    .container-header {
        height: 14vw;
        background-image: url('images/products/background.png');
    }
    .container-products {
        margin-top: 5vw;
        margin-bottom: 5vw;
    }
    .container-products h1 {
        margin-left: 10vw;
        margin-top: 3vw;
        color: #273133;
        font-size: 4.5vw;
    }
    .container-category {
        margin: 3vw 0 0 0;
        width: 17vw;
        border-right: 1px solid #EEEEEE;
    }
    .container-category h3 {
        font-size: 2vw;
        color: #7E8282;
    }
    .container-category .container-list {
        list-style-type: none;
        margin-top: 1.5vw;
    }
    .container-category .container-list .list-item {
        padding: 9px 0 0 0;
        font-family: "Comfortaa", cursive;
        font-size: 1vw;
    }
    .container-products .devices-details {
        margin: 3vw 0 0 0;
        height: auto;
        width: 17vw;
    }
    .container-products .devices-details h3 {
        font-size: 2vw;
        color: #7E8282;
    }
    .container-products .devices-details .gadgets .sort {
        position: relative;
    }
    .container-products .devices-details .gadgets .sort select {
        display: none;
    }
    .select-selected {
        background-color: #fff;
    }
    .select-selected:after {
        position: absolute;
        background-image: url('images/products/select/arrowdown.png');
        content: "";
        top: 0.4vw;
        right: 4.5vw;
        width: 1.7vw;
        height: 1.7vw;
    }
    .select-selected.select-arrow-active:after {
        position: absolute;
        background-image: url('images/products/select/arrowup.png');
        top: 0.4vw;
    }
    .select-items div,
    .select-selected {
        background-image: url('images/products/select/first-border.png');
        font-family: "Montserrat";
        color: rgb(39, 47, 50);
        cursor: pointer;
        width: 15vw;
        padding: 0.5vw 0 0 0.9vw;
        font-size: 1vw;
        height: 2.5vw;
        user-select: none;
    }
    .select-items {
        background-color: #fff;
        top: 100%;
        left: 0;
        right: 0;
        width: 15vw;
        z-index: 99;
    }
    .select-hide {
        display: none;
    }
    .container-products .devices-details .gadgets .view {}
    .container-products .devices-details .gadgets .view .style {
        position: relative;
        display: inline-block;
        width: 2vw;
        height: 2vw;
        float: right;
        margin-left: 2%;
        cursor: pointer;
    }
    .container-products .devices-details .gadgets .view .view-list {
        background-image: url('images/products/grid/view-list.png');
    }
    .container-products .devices-details .gadgets .view .view-grid {
        background-image: url('images/products/grid/view-grid.png');
        filter: grayscale(100%);
    }
    .container-products .devices-details .elements .device-image {
        background-position: center;
        background-repeat: no-repeat;
        background-size: auto 80%;
        border: 1px #7CB5C0 solid;
        border-radius: 8vw;
        width: 13vw;
        margin-top: 3vw;
        height: 13vw;
    }
    .container-products .devices-details .elements .device-info {
        display: table;
        height: 100%;
        margin-top: 1.6vw;
    }
    .container-products .devices-details .elements .device-info div {
        display: table-cell;
        vertical-align: middle;
    }
    .page-navigation {
        top: 0;
        left: 5vw;
        width: 5vw;
        position: absolute;
        height: 100%;
        z-index: 10;
    }
    .page-navigation .icon {
        position: relative;
        width: 1.8vw;
        height: 1.8vw;
        text-align: center;
        line-height: 1.6vw;
        border-radius: 0.9vw;
        font-size: 0.8vw;
    }
    .page-navigation .light {
        color: #FDFDFD;
        border: 1px #FDFDFD solid;
    }
    .page-navigation .light-line {
        color: #FDFDFD;
        border-left: 1px #FDFDFD solid;
    }
    .page-navigation .vert-line {
        width: 1px;
    }
    .page-navigation .home-line {
        margin-top: 0.5vw;
        margin-left: 0.85vw;
        height: 1.5vw;
    }
    .page-navigation .home-icon {
        margin-top: 2vw;
    }
    .page-navigation .dark {
        color: #7CB5C0;
        border: 1px #7CB5C0 solid;
    }
    .page-navigation .dark-line {
        width: 1px;
        height: 12vw;
        margin-top: 1.5vw;
        margin-left: 0.85vw;
        color: #7CB5C0;
        border-right: 1px solid;
    }
    .page-navigation .products-icon {
        margin-top: 1.5vw;
    }
    .page-navigation .dark-line-final {
        height: auto;
        margin-top: 1.3vw;
    }
}