@import "reset.css";
@import "font-awesome.min.css";
@import "magnific-popup.css";
@import "flexslider.css";

body, html { height: 100%; }
body {
    color: #8c8c8c;
    font: 12px/22px Arial,sans-serif,Tahoma,'MontserratRegular',Roboto,Helvetica;
    background: url('../images/bg-body.jpg') repeat-y center;
}

a {
    color: #f3ac00;
    outline: none;
    text-decoration: none;
}
a:hover {
    color: #c28a04;
}
a:active {
    color: #ccc;
}
a:focus {}

h1 { font-size: 22px; line-height: 24px; }
h2 { font-size: 18px; line-height: 20px; }
h3 { font-size: 14px; line-height: 16px; }

.wrap { width: 1024px; margin: 0 auto; }

/*COMMON
-------------------------------------------------------------*/
footer .wrap,
main .wrap,
section.widgets .wrap,
header .wrap { background-color: #000; padding: 20px; }

/*HEADER
-------------------------------------------------------------*/
header { }
header .wrap { position: relative; }
header .wrap h1 {
    margin-bottom: 10px;
    text-align: center;
}
header .wrap .h1 {
    display: none;
}
header .wrap .h1 p {
    line-height: 16px;
}
header .wrap nav {
    min-height: 20px;
}
header .wrap nav ul {
    list-style: none;
}
header .wrap nav ul li a {
    display: block;
}
header .wrap nav ul ul {
    margin-left: 20px;
}
header .wrap nav #nav-bars {
    font-size: 20px;
    position: absolute;
}
header .wrap .info {
    line-height: 100%;
    text-align: center;
    margin: 15px 0;
}
header .wrap .info ul {
    list-style: none;
}
header .wrap .info ul li {
    display: inline-block;
    margin-right: 5px;
}
header .wrap .info ul li a {
    display: block;
    width: 28px;
    height: 19px;
    text-indent: -99999px;
    background: url('../images/flag.png') no-repeat -28px 0;
}
header .wrap .info ul li:nth-child(2) a {
    background-position: 0 0;
}
header .wrap .info ul li.active:nth-child(1) a {/*,
header .wrap .info ul li:nth-child(1) a:hover {*/
    background-position: -28px 0;
}
header .wrap .info ul li.active:nth-child(2) a {/*,
header .wrap .info ul li:nth-child(2) a:hover {*/
    background-position: 0 0;
}
/*
header .wrap .info ul li:nth-child(3) a {
    width: 12px;
    background-position: -48px 0;
}
header .wrap .info ul li:nth-child(3) a:hover {
    width: 12px;
    background-position: -48px -12px;
}
header .wrap .info ul li:nth-child(4) a {
    width: 12px;
    background-position: -36px 0;
}
header .wrap .info ul li:nth-child(4) a:hover {
    background-position: -36px -12px;
}*/

/*BODY
-------------------------------------------------------------*/
main {}
main .col3 {
    display: none;
}

.box {
    margin-bottom: 15px;
}
.box.links,
.box.counter {
    display: none;
}
.box:last-child {
    margin-bottom: 0;
}
.box h2 {
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 8px;
}
.box .content {
    color: #333;
    line-height: 18px;
    padding: 10px;
    background-color: #f6aa05;
}
.box .content ul {
    list-style: none;
}
.box .content ul li {}
.box .content ul li a {}
.box .content a {
    color: #000;
}
.box.links .content ul li {
    margin-top: 10px;
}
.box.links .content ul li img {
    max-width: 100%;
}
.box .content a:hover {
    color: #fff;
}

.contact-content {
    padding-right: 15px;
}
.contact-content h2,
.contact-content ul li,
.contact-content p {
    margin: 10px 0;
}
.contact-content h2 {
    color: #fff;
}
.contact-content ul {
    list-style: none;
}
.contact-content img {
    width: 100%;
}
.contact-content .img {
    float: left;
    margin-right: 15px;
}
.contact-content .img img {
    height: 75px;
}
.contact-content .beam {
    float: left;
}

.success {
    color: #090;
}
.errors {
    color: #f30;
}

.btn {
    cursor: pointer;
    padding: 8px 14px;
    border: none;
    background-color: #f6aa05;
    color: #000;
    border-radius: 15px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
}
.btn:hover {
    background-color: #222;
    color: #f6aa05;
}

main .col1 ul.cate {}
main .col1 ul.cate li {
    list-style: none;
}
main .col1 ul.cate li a {
    background-color: #161616;
    display: block;
    padding: 4px 12px;
    margin-bottom: 1px;
    color: #c28a04;
    text-transform: uppercase;
}
main .col1 ul.cate li.active a,
main .col1 ul.cate li a:hover {
    font-weight: bold;
    color: #fff;
    background: rgba(247,173,0,1);
    background: -moz-linear-gradient(top, rgba(247,173,0,1) 0%, rgba(224,161,0,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(247,173,0,1)), color-stop(100%, rgba(224,161,0,1)));
    background: -webkit-linear-gradient(top, rgba(247,173,0,1) 0%, rgba(224,161,0,1) 100%);
    background: -o-linear-gradient(top, rgba(247,173,0,1) 0%, rgba(224,161,0,1) 100%);
    background: -ms-linear-gradient(top, rgba(247,173,0,1) 0%, rgba(224,161,0,1) 100%);
    background: linear-gradient(to bottom, rgba(247,173,0,1) 0%, rgba(224,161,0,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7ad00', endColorstr='#e0a100', GradientType=0 );
}

main .col1 ul.cate ul {
    margin-left: 20px;
}

main .col2 {}
main .col2 h1 {
    color: #f6aa05;
    font-size: 18px;
    font-weight: normal;
    border-bottom: 1px solid #f6aa05;
    padding-bottom: 8px;
    margin-bottom: 8px;
    text-transform: uppercase;
}
main .col2 h1.label {
    margin-top: 15px !important;
}
main .col2 h1.label a {
    background: #f6aa05;
    color: #000;
    display: inline-block;
    padding: 0 10px;
    float: right;
}
main .col2 h1.label a:hover {
    color: #fff;
}
main .col2 .detail img {
    max-width: 100%;
    height: auto;
}


/* gridview */
main .gridview {}
main .gridview ul {}
main .gridview ul li {
    float: left;
    width: 50%;
    list-style: none;
}
main .gridview ul li article {
    margin: 5px 5px 0 0;
    background-color: #141414;
}
main .gridview ul li article .img {
    padding: 5px;
}
main .gridview ul li article .img a {
    display: block;
}
main .gridview ul li article .img a img {
    display: list-item;
    max-width: 250px;
    width: 100%;
}
main .gridview ul li article .info {
    padding: 0 10px;
    text-align: center;
}
main .gridview ul li article .info h2 {
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 6px 10px;
}
main .gridview ul li article .info h3,
main .gridview ul li article .info p {
    margin: 0;
}
main .gridview ul li article .info p.price {
    color: #fff;
}
main .gridview ul li article .info p.price span {
    color: #999;
    text-decoration: line-through;
}

main .product .feature {
    margin-bottom: 5px;
}
main .product .feature img {
    width: 100%;
}
main .product-left {
    margin-bottom: 15px;
}

/* tabs */
ul.tabs-content {}
ul.tabs-content li {
    display: inline-block;
}
ul.tabs-content li a {
    display: block;
    padding: 5px 10px;
    background-color: #222;
    margin-bottom: 5px;
}
ul.tabs-content li a:hover,
ul.tabs-content li.active a {
    color: #000;
    background-color: #f6aa05;
}

.tabs-content-items {
    display: none;
}
.tabs-content-items.active {
    display: block;
}

ul.partner {
    list-style: none;
    padding: 5px 0;
}
ul.partner li {
    line-height: 30px;
    padding: 0 6px;
    background-color: #111;
}
ul.partner li:nth-child(odd) {
    background-color: #222;
}
ul.partner li strong,
ul.partner li span {
    display: block;
    float: left;
    width: 60%;
}
ul.partner li span {
    float: right;
    width: 35%;
    padding-left:5%;
    position: relative;
}
ul.partner li span::before {
    content: " ";
    position: absolute;
    left: 0;
    width: 1px;
    height: 100%;
    background-color: #333;
}
ul.partner li strong {
    color: #fff;
}
ul.partner li:first-child,
ul.partner li:first-child strong {
    text-transform: uppercase;
    background: #f6aa05;
    color: #000;
}

/* pagination */
.pagination {
    margin-bottom: 15px;
}
.pagination a.page {
    color: #f3ac00;
    padding: 5px 12px;
    display: inline-block;
    margin-right: 8px;
}
.pagination a.page:hover,
.pagination a.page.active {
    color: #000;
    background-color: #c28a04;
}
.pagination span.dots {}

section.widgets .wrap {
    color: #fff;
    background-color: #222;
}
section.widgets .wrap ul.tabs {
    list-style: none;
}
section.widgets .wrap ul.tabs li {
    display: inline-block;
}
section.widgets .wrap ul.tabs li a {
    color: #6e6d6d;
    font-weight: bold;
    display: block;
    padding: 0 12px 5px 0;
    text-transform: uppercase;
}
section.widgets .wrap ul.tabs li:last-child a {
    padding-left: 5px;
}
section.widgets .wrap ul.tabs li a:hover,
section.widgets .wrap ul.tabs li.active a {
    color: #fff;
}
section.widgets .wrap .video,
section.widgets .wrap .picture {
    display: none;
}
section.widgets .wrap .video.active,
section.widgets .wrap .picture.active {
    display: block;
}

/*FOOTER
-------------------------------------------------------------*/
footer {
    line-height: 18px;
}
footer .wrap {
    background-color: #121212;
}

/*DESKTOPS
-------------------------------------------------------------*/
@media only screen  and (min-width : 1224px) {

}

/*TABLETS
-------------------------------------------------------------
@media only screen and (min-width: 768px) {*/
    header { margin-top: 50px; }
    header .wrap { min-height: 130px; }
    header .wrap h1 {
        position: absolute;
        bottom: 70px;
        left: 20px;
        z-index: 2;
    }
    header .wrap .h1 {
        left: 170px;
        position: absolute;
        top: 44px;
        display: block;
        font-size: 35px;
        text-transform: uppercase;
        color: #fff;
        font-weight: bold;
        text-align: center;
    }

    /*NAVIGATION
    -------------------------------------------------------------*/
    header .wrap nav {
        position: absolute;
        left: 20px;
        right: 20px;
        bottom: 20px;
        z-index: 1;
        font-weight: bold;
        text-transform: uppercase;
        background: rgba(34,34,34,1);
        background: -moz-linear-gradient(top, rgba(34,34,34,1) 0%, rgba(25,25,25,1) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(34,34,34,1)), color-stop(100%, rgba(25,25,25,1)));
        background: -webkit-linear-gradient(top, rgba(34,34,34,1) 0%, rgba(25,25,25,1) 100%);
        background: -o-linear-gradient(top, rgba(34,34,34,1) 0%, rgba(25,25,25,1) 100%);
        background: -ms-linear-gradient(top, rgba(34,34,34,1) 0%, rgba(25,25,25,1) 100%);
        background: linear-gradient(to bottom, rgba(34,34,34,1) 0%, rgba(25,25,25,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222222', endColorstr='#191919', GradientType=0 );
    }
    header .wrap nav > ul {}
    header .wrap nav > ul > li {
        float: left;
        position: relative;
        z-index: 1;
    }
    header .wrap nav > ul > li > a {
        display: block;
        color: #fff;
    }
    header .wrap nav > ul > li {
        cursor: pointer;
        -webkit-transition: color .3s ease-in, background .3s ease-in;
        -moz-transition: color .3s ease-in, background .3s ease-in;
        -o-transition: color .3s ease-in, background .3s ease-in;
        -ms-transition: color .3s ease-in, background .3s ease-in;
    }
    header .wrap nav > ul > li.active,
    header .wrap nav > ul > li:hover {
        background: rgba(247,173,0,1);
        background: -moz-linear-gradient(top, rgba(247,173,0,1) 0%, rgba(224,161,0,1) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(247,173,0,1)), color-stop(100%, rgba(224,161,0,1)));
        background: -webkit-linear-gradient(top, rgba(247,173,0,1) 0%, rgba(224,161,0,1) 100%);
        background: -o-linear-gradient(top, rgba(247,173,0,1) 0%, rgba(224,161,0,1) 100%);
        background: -ms-linear-gradient(top, rgba(247,173,0,1) 0%, rgba(224,161,0,1) 100%);
        background: linear-gradient(to bottom, rgba(247,173,0,1) 0%, rgba(224,161,0,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7ad00', endColorstr='#e0a100', GradientType=0 );
    }
    header .wrap nav > ul > li.active a,
    header .wrap nav > ul > li:hover a {
        color: #000;
    }

    /* COMMON */
    header .wrap nav ul,
    header .wrap nav ul li {
        margin: 0;
        padding: 0;
    }
    header .wrap nav a {
        padding: 0 12px;
        line-height: 60px;
    }

    /* SUB */
    header .wrap nav ul > li ul {
        position: absolute;
        list-style: none;
        display: block;
    }
    header .wrap nav ul > li ul li {
        position: absolute;
        top: -9999px;
        height: 0px;
        display: block;

        -webkit-transition: height .2s ease-in;
        -moz-transition: height .2s ease-in;
        -o-transition: height .2s ease-in;
        -ms-transition: height .2s ease-in;
    }
    header .wrap nav ul ul {
        margin-left: 0;
    }
    header .wrap nav ul ul li a {
        /*width: 120px;*/
        display: block;
        position: relative;
        line-height: 32px;

        color: #fff;
        background-color: #f7ad00;
        -webkit-transition: color .3s ease-in, background .3s ease-in;
        -moz-transition: color .3s ease-in, background .3s ease-in;
        -o-transition: color .3s ease-in, background .3s ease-in;
        -ms-transition: color .3s ease-in, background .3s ease-in;
    }
    header .wrap nav ul ul li:hover > a,
    header .wrap nav ul ul li a:hover {
        background-color: #facf6a;
    }

    /* DROPDOWN ARROW */
    header .wrap nav > ul > li.dropdown {
        padding-right: 20px;
    }
    header .wrap nav li.dropdown > a::after {
        content: "";
        position: absolute;
        top: 28px;
        right: 15px;
        width: 5px;
        height: 5px;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        border-bottom: 1px solid #fff;
        border-right: 1px solid #fff;
    }
    header .wrap nav ul ul .dropdown a::after {
        top: 13px;
        border-bottom: 0;
        border-right: 1px solid #fff;
        border-top: 1px solid #fff;
    }
    header .wrap nav li.dropdown.active:hover > ul > li,
    header .wrap nav li.dropdown:hover > ul > li {
        height: 32px;
        position: relative;
        top: auto;
    }


    main .col1 ul.cate li {
        position: relative;
    }
    main .col1 ul.cate ul {
        position: absolute;
        top: 0;
        left: 100%;
        margin-left: 1px;
        width: 200px;
        display: none;
    }
    main .col1 ul.cate li:hover ul {
        display: block;
    }

    /*
    header .wrap nav {
        position: absolute;
        left: 20px;
        right: 20px;
        bottom: 20px;
        z-index: 1;
        background: rgba(34,34,34,1);
        background: -moz-linear-gradient(top, rgba(34,34,34,1) 0%, rgba(25,25,25,1) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(34,34,34,1)), color-stop(100%, rgba(25,25,25,1)));
        background: -webkit-linear-gradient(top, rgba(34,34,34,1) 0%, rgba(25,25,25,1) 100%);
        background: -o-linear-gradient(top, rgba(34,34,34,1) 0%, rgba(25,25,25,1) 100%);
        background: -ms-linear-gradient(top, rgba(34,34,34,1) 0%, rgba(25,25,25,1) 100%);
        background: linear-gradient(to bottom, rgba(34,34,34,1) 0%, rgba(25,25,25,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222222', endColorstr='#191919', GradientType=0 );
    }
    header .wrap nav ul li {
        float: left;
        margin-right: 1px;
    }
    header .wrap nav ul li a {
        padding: 10px 20px;
        text-transform: uppercase;
        color: #fff;
        font-weight: bold;
    }
    header .wrap nav ul li a:hover,
    header .wrap nav ul li.active a {
        background: rgba(247,173,0,1);
        background: -moz-linear-gradient(top, rgba(247,173,0,1) 0%, rgba(224,161,0,1) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(247,173,0,1)), color-stop(100%, rgba(224,161,0,1)));
        background: -webkit-linear-gradient(top, rgba(247,173,0,1) 0%, rgba(224,161,0,1) 100%);
        background: -o-linear-gradient(top, rgba(247,173,0,1) 0%, rgba(224,161,0,1) 100%);
        background: -ms-linear-gradient(top, rgba(247,173,0,1) 0%, rgba(224,161,0,1) 100%);
        background: linear-gradient(to bottom, rgba(247,173,0,1) 0%, rgba(224,161,0,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7ad00', endColorstr='#e0a100', GradientType=0 );
    }
    */


    header .wrap .info {
        position: absolute;
        right: 20px;
    }

    footer .wrap .f1 {
        margin: 10px 15px 0 0;
    }
    footer .wrap .f1,
    footer .wrap .f2 {
        float: left;
    }

    /*BODY
    -------------------------------------------------------------*/
    main .col1 {
        float: left;
        width: 20%;
    }
    main .col2 {
        float: left;
        width: 60%;
    }
    main .col2 .col21 {
        padding: 0 15px;
    }
    main .col3 {
        display: block;
        float: left;
        width: 20%;
    }
    main .col3 .listview-single-image {
        overflow: hidden;
    }
    main .col3 .listview-single-image li {
        list-style: none;
        margin-top: 15px;
    }

    .box.links,
    .box.counter {
        display: block;
    }

    main .gridview ul li {
        width: 33%;
    }
/*}*/

@media only screen and (min-width: 480px) {
}

/*PHONES
-------------------------------------------------------------*/
@media only screen and (max-width: 767px) {
}