/* ///////////////////////////////////////////////////////////////*/
/* ///////////////////    < Header and dropdown >    /////////////*/
/* ///////////////////////////////////////////////////////////////*/
header {
clear: both;
width: 100%;
z-index: 90;
box-sizing:border-box;
}
.boxed header{
position: relative;
}
.boxed #shadow.enable header{
-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.26);
-moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.26);
box-shadow: 0 0 20px rgba(0, 0, 0, 0.26);
}
#padding-top{
width:100%;
position:relative;
top:0;
}
#shadow{
position: fixed;
width: 100%;
left: 0;
z-index: 100;
top: 0px;
}
#shadow.none{
-webkit-box-shadow:none;
-moz-box-shadow:none;
box-shadow:none;
}
#shadow.enable{
-webkit-box-shadow:0 0 20px rgba(0, 0, 0, 0.26);
-moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.26);
box-shadow: 0 0 20px rgba(0, 0, 0, 0.26);
}
.header-menu-container {
position: relative;
margin: 0 auto;
height:100%;
box-sizing: border-box;
padding:0;
}
.header-menu-container.centered{
width: 1140px;
}
.header-menu-container.fullwidth{
width: 100%;
padding-left: 1%;
}
header a{
color: #fff;
}
header a:visited{
color: #fff;
}
header .no-menu{
float: right;
display: block;
margin-right: 1em;
position: relative;
}
header em{
float: left;
font-style:normal;
margin-left: 5px;
font-weight:300;
}
header .logo {
top: 0;
float:left;
z-index: 100;
overflow:hidden;
position: relative;
-webkit-transition: margin 0.3s linear;
-moz-transition: margin 0.3s linear;
-o-transition: margin 0.3s linear;
-ms-transition: margin 0.3s linear;
transition: margin 0.3s linear;
}
header .logo img{
position:relative;
width:100%;
height:auto;
max-width:none;
}
#main-menu {
float: right;
position: relative;
width: auto;
z-index: 777;
height: 100%;
}
#main-menu>li {
cursor: pointer;
z-index: 100;
float: left;
height: 100%;
position: relative;
text-align: center;
}
#main-menu li{
-webkit-transition: background 0.3s ease-out, border-color 0.3s ease-out;
-moz-transition: background 0.3s ease-out, border-color 0.3s ease-out;
-o-transition: background 0.3s ease-out, border-color 0.3s ease-out;
transition: background 0.3s ease-out, border-color 0.3s ease-out;
}
#main-menu>li:first-child,
#main-menu>li:first-child a {
border-left: 0;
}
#main-menu>li a{
display:block;
height:100%;
width:100%;
text-transform:uppercase;
}
#main-menu li a{
overflow: hidden;
}
#main-menu>li>a>span.title{
letter-spacing: 1px;
}
#main-menu.text_only>li>a>i{
margin-right:3px;
}
#main-menu>li>a>i{
position: relative;
top: 1px;
}
#main-menu>li:hover i,
#main-menu>li:focus i,
#main-menu>li ul.sub-menu>li:hover i,
#main-menu>li ul.sub-menu>li:focus i{
opacity:1;
}
#main-menu ul.sub-menu .icon-plus{
position: absolute;
font-size: 9px;
right: 2.55em;
top: 0.3em;
opacity: 0.9;
}
body.boxed #main-menu ul.sub-menu .icon-plus{
right: 2.52em;
}
#main-menu ul.sub-menu ul.sub-menu .icon-plus{
font-size: 7px;
}
#main-menu.icons_only>li>a>span.title{
display:none;
}

#main-menu>li ul.sub-menu>li{
position:relative;
width: 100%;
top:0;
margin:0;
text-align: left;
font-size: 0.9em;
}
#main-menu>li ul.sub-menu>li>a{
font-weight: 300;
text-transform: none;
letter-spacing: 1px;
font-size: 11px;
font-size: 11.2px;
text-transform:uppercase;
cursor:pointer;
}
#main-menu>li ul.sub-menu ul.sub-menu>li>a{
font-size: 10px;
}
#main-menu>li ul.sub-menu>li>a>span.title{
margin-left:19px;
bottom: -0.1em;
position: relative;
}
#main-menu>li ul.sub-menu>li a{
line-height: 50px;
}
#main-menu>li ul.sub-menu.visible{
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
filter: alpha(opacity=90);
-moz-opacity: 0.90;
-khtml-opacity: 0.90;
opacity:0.90;
}
#main-menu li ul.sub-menu{
min-width: 200px;
opacity: 0;
position: absolute;
visibility: hidden;
right: 2em;
box-shadow: 0 5px 15px rgba(0,0,0,.2);
-webkit-transition: right 0.2s ease-in-out, left 0.2s ease-in-out, opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
-moz-transition: right 0.2s ease-in-out, left 0.2s ease-in-out, opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
-o-transition: right 0.2s ease-in-out, left 0.2s ease-in-out, opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
transition: right 0.2s ease-in-out, left 0.2s ease-in-out, opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}
#main-menu li:hover > ul,
#main-menu li:focus > ul{
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
-moz-opacity: 1;
-khtml-opacity: 1;
opacity: 1;
visibility: visible;
right: 0; 
z-index: 111;
}
body.dropdown_right_left #main-menu>li>ul,
body.dropdown_right_right #main-menu>li>ul{
left: -2em;
}
body.dropdown_right_left #main-menu>li:hover > ul,
body.dropdown_right_left #main-menu>li:focus > ul,
body.dropdown_right_right #main-menu>li:hover > ul,
body.dropdown_right_right #main-menu>li:focus > ul{
left: 0;
}
body.dropdown_left_left #main-menu>li>ul,
body.dropdown_left_right #main-menu>li>ul{
right: 2em;
}
body.dropdown_left_left #main-menu>li:hover > ul,
body.dropdown_left_left #main-menu>li:focus > ul,
body.dropdown_left_right #main-menu>li:hover > ul,
body.dropdown_left_right #main-menu>li:focus > ul{
right: 0;
}
body.dropdown_right_left #main-menu li > ul ul.sub-menu,
body.dropdown_left_left #main-menu li > ul ul.sub-menu{
right: 90%;
}
body.dropdown_right_left #main-menu li > ul li:hover ul,
body.dropdown_right_left #main-menu li > ul li:focus ul,
body.dropdown_left_left #main-menu li > ul li:hover ul,
body.dropdown_left_left #main-menu li > ul li:focus ul{
right: 100%;
}
body.dropdown_right_right #main-menu li > ul ul.sub-menu,
body.dropdown_left_right #main-menu li > ul ul.sub-menu{
left: 90%;
}
body.dropdown_right_right #main-menu li > ul li:hover ul,
body.dropdown_right_right #main-menu li > ul li:focus ul,
body.dropdown_left_right #main-menu li > ul li:hover ul,
body.dropdown_left_right #main-menu li > ul li:focus ul{
left: 100%;
}
#main-menu li ul.sub-menu>li>ul.sub-menu>li:first-child>a{
border-top-width:2px;
margin-top:-1px;
}
#main-menu li ul.sub-menu>li:first-child>ul.sub-menu>li:first-child>a{
margin-top:0;
}
#main-menu>li>ul.sub-menu>li:first-child>ul.sub-menu>li:first-child a{
border-top-width:1px;
margin-top:0;
}
#main-menu li > ul li:hover ul{
right: 100%;
}
#main-menu li > ul ul.sub-menu{
top: 0;
right: 90%;
box-shadow: 0 5px 15px rgba(0,0,0,.2);
}
#main-menu>li.active {
background: #0faec5;
}
#main-menu>li.icon-menu>a>i {
background: url(../images/icons/i-menu.png) 0 0 no-repeat;
width: 16px;
height: 16px;
position: absolute !important;
right: 20px;
top: 19px;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: all 250ms ease-out 0s;
-moz-transition: all 250ms ease-out 0s;
-o-transition: all 250ms ease-out 0s;
transition: all 250ms ease-out 0s;
}
#main-menu>li.icon-menu>a>i.open {
background-position: 0 -16px;
-webkit-transform: rotate(-180deg);
-moz-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
-webkit-transition: all 250ms ease-out 0s;
-moz-transition: all 250ms ease-out 0s;
-o-transition: all 250ms ease-out 0s;
transition: all 250ms ease-out 0s;
}
/*dropdown*/
.dropdown-content-container{
position:relative;
width:100%;
box-sizing: border-box;
}
.dropdown-content-container .dropdown{
max-height:0px;
color: #fff;
overflow: hidden;
background: #040404;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
filter: alpha(opacity=90);
-moz-opacity: 0.90;
-khtml-opacity: 0.90;
opacity: 0.90;
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
}
.dropdown .drop_box_wrapper {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
-moz-opacity: 0;
-khtml-opacity: 0;
opacity: 0;
border-top: 1px solid #111;
-webkit-transition: all 1.2s ease-out;
-moz-transition: all 1.2s ease-out;
-o-transition: all 1.2s ease-out;
-ms-transition: all 1.2s ease-out;
transition: all 1.2s ease-out;
}
.dropdown .drop_box_wrapper.visible {
display: block;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
-moz-opacity: 1;
-khtml-opacity: 1;
opacity: 1;
}
.dropdown#dropdown-colors{
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
}
.dropdown-slider .viewport {
margin-left: 60px;
margin-right: 60px;
position: relative;
overflow: hidden;
}
.dropdown-slider .content-wrapper {
white-space: nowrap;
position: relative;
display: inline;
width: auto;
left: 0;
-webkit-transition: left 0.6s ease-out;
-moz-transition: left 0.6s ease-out;
-o-transition: left 0.6s ease-out;
-ms-transition: left 0.6s ease-out;
transition: left 0.6s ease-out;
}

.dropdown .drop_box_wrapper .dropdown-slider .controls{
visibility: hidden;
}
.dropdown .drop_box_wrapper.visible .dropdown-slider .controls{
visibility: visible;
}
.dropdown-slider .controls .prev,
.dropdown-slider .controls .next {
width:55px;
position: absolute;
}
.dropdown-slider .controls .prev a,
.dropdown-slider .controls .next a{
display: block;
width: 100%;
height: 100%;
}
.dropdown-slider .controls i{
position: absolute;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
filter: alpha(opacity=80);
-moz-opacity: 0.8;
-khtml-opacity: 0.8;
opacity:0.8;
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
-ms-transition: all 0.2s linear;
transition: all 0.2s linear;
}
.dropdown-slider .controls .prev{
left:0;
}
.dropdown-slider .controls .next{
right:0;
}
.dropdown-slider .controls .next i{
right: 15px;
}
.dropdown-slider .controls .prev i{
left: 15px;
}
.dropdown-slider .controls .prev:hover i,
.dropdown-slider .controls .prev:focus i,
.dropdown-slider .controls .next:hover i,
.dropdown-slider .controls .next:focus i{
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
-moz-opacity: 1;
-khtml-opacity: 1;
opacity:1;
}
.dropdown div.item {
position: relative;
margin: 0 2% 0 0;
display: inline-block;
}
.dropdown div.item div.item-height {
padding-bottom: 100%;
}
.dropdown div.item span.overlay_effect {
position: absolute;
z-index: 5;
top: 0;
left: 0;
width: 100%;
height: 100%;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
filter: alpha(opacity=20);
-moz-opacity: 0.20;
-khtml-opacity: 0.20;
opacity: 0.20;
background: url(../images/overlay.png) no-repeat scroll top right transparent;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;
-ms-transition: all 0.4s ease-out;
transition: all 0.4s ease-out;
}
.dropdown div.item:hover span.overlay_effect{
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
-moz-opacity: 1;
-khtml-opacity: 1;
opacity:1;
}
.dropdown-content-container #dropdown-menu{
-webkit-transition: all 0.8s ease-out;
-moz-transition: all 0.7s ease-out;
-o-transition: all 0.7s ease-out;
-ms-transition: all 0.7s ease-out;
transition: all 0.8s ease-out;
}
.dropdown-content-container #dropdown-menu.open{
max-height: 700px;
}
#dropdown-menu ul li{
position: relative;
width: 100%;
height: 79px;
border-bottom: 1px solid #111;
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
}
#dropdown-menu ul li a{
padding: 30px 0 27px 0;
position: absolute;
width: 100%;
text-align: center;
font-size: 1em;
font-weight: 300;
letter-spacing: 1px;
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
}
#dropdown-menu ul li a span{
text-transform: uppercase;
font-size: 0.9em;
}
#dropdown-menu ul.sub-menu li:hover,
#dropdown-menu ul.sub-menu li:focus{
background-color: #0fa8bf;
}
#dropdown-menu ul li i{
margin:5px;
}
.dropdown .top_margin {
margin-top: 12px;
}
form.search_form {
white-space: nowrap;
overflow: hidden;
}
form.search_form input.search {
border: 1px solid #424242;
background-color: #444444;
letter-spacing: 0.06em;
font-weight: 300;
font-size: 1em;
color: #fff;
line-height: 1.4em;
margin-top: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
-o-border-radius: 0;
border-radius: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
-o-box-shadow: none;
box-shadow: none;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box; 
-webkit-transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
-ms-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
}
form.search_form input.search:focus{
background-color: #333333;
border-color: #333333;
}
form.search_form button {
height: 45px;
width: 45px;
color: #fff;
font-size: 0.6em;
margin-top: 0;
font-weight: 400;
letter-spacing: 0;
cursor: pointer;
text-transform: none;
padding: 0 1.8em;
background: #1c1c1c;
position: absolute;
cursor: pointer;
border-color: #1c1c1c;
border-style: solid;
-webkit-border-radius: 0;
-moz-border-radius: 0;
-o-border-radius: 0;
border-radius: 0;
border-width: 1px 1px 1px 1px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
transition: all 0.3s ease;
}
form.search_form button:hover{
background:#0faec5;
}
.dropdown-content-container #dropdown-search {
height: 70px;
right: 0px;
position: absolute;
}
.dropdown-content-container .drop_position_wrapper{
margin: 0 auto;
height: auto;
position: relative;
}
#dropdown-search{
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
transition: all 0.5s ease-out;
}
.dropdown-content-container #dropdown-search.open{
max-height:90px;
}
form.search_form input.search {
padding: 11px 15px 10px 14px;
width: 85%;
}
/*       Media */

@media only screen 
and (min-width: 1360px){
}
@media only screen 
and (max-width : 1359px) 
and (min-width: 1224px){
}
@media only screen 
and (min-width : 1224px) {
.dropdown .viewport {
margin-top: 45px;
}
.dropdown div.item {
width: 80px;
}
.dropdown-slider .controls .prev,
.dropdown-slider .controls .next{
height:80px;
top:45px;
}
.dropdown-content-container #dropdown-colors{
height:150px;
}
.dropdown-content-container #dropdown-colors.open{
max-height:155px;
}
.dropdown-slider .controls i{
font-size: 1.5em;
top: 23px;
}



}
@media only screen 
and (max-width: 1223px){

}
@media only screen 
and (max-width: 1223px) 
and (min-width: 1140px){
}
@media only screen 
and (min-width: 1140px){
.dropdown-content-container .drop_position_wrapper {
width: 1140px;
}
header em{
font-size: 1em;
line-height: 1.5em;
margin-top: 30px;
}
header .logo.smooth{
margin-left: 0;
}
header .logo {
margin-left: 15px;
}
}
@media only screen 
and (max-width: 1149px){
.header-menu-container {
width: 100% !important;
}
}
@media only screen 
and (max-width: 1139px){
.dropdown-content-container .drop_position_wrapper {
width: 100%;
}
header em{
display:none;
}
}
@media only screen 
and (max-width: 1139px)
and (min-width: 768px){
header .logo {
margin-left: 25px;
}

}
@media only screen 
and (max-width: 1223px) 
and (min-width: 768px){
header .logo {
position: relative;
float: left;
}
.dropdown-content-container #dropdown-colors{
height:130px;
}
.dropdown-content-container #dropdown-colors.open{
max-height:135px;
}
.dropdown .viewport {
margin-top: 43px;
}
.dropdown div.item{
width: 64px;
}
.dropdown-slider .controls .prev,
.dropdown-slider .controls .next{
height:64px;
top:43px;
}
.dropdown-slider .controls i{
top: 18px;
}
.dropdown-slider .controls i{
font-size: 1.4em;
}
}
@media only screen 
and (max-width: 1223px) 
and (min-width: 960px){

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

}
@media only screen 
and (max-width: 959px){

}
@media only screen 
and (max-width: 959px) 
and (min-width: 768px){

}
@media only screen 
and (max-width: 960px){

}
@media only screen 
and (min-width: 768px){
header {
height:70px;
}
#padding-top{
height:70px;
}
#main-menu>li a{
line-height:70px;
}
header .logo{
margin-top:17px;
height: auto;
}
header .logo a{
display:block;
}
header .logo img {
position:relative;
display: block;
}
#main-menu>li {
width: 70px;
}
#main-menu.icons_only>li>a>i{
font-size: 1.1em;
}
#main-menu>li{
display:block;
}
#dropdown-menu{
display:none;
}
form.search_form {
margin: 0 21px;
}
body.boxed.scroll-enabled .dropdown-content-container #dropdown-search{
margin-right:15px
}
.dropdown-content-container #dropdown-search{
width: 355px;
}
header .no-menu{
top: 2.1em;
font-size: 0.85em;
}
#main-menu>li>a>span.title{
font-size: 0.7em;
}
#main-menu>li.hide-big{
display:none;
}
}
@media only screen 
and (max-width: 767px){
header {
height:55px;
}
#padding-top{
height: 55px;
}
#main-menu>li a{
line-height:55px;
}
header .logo{
margin-top: 14px;
position: relative;
height: auto;
float: left;
left: auto;
top: auto;
margin-left: 3px;
}
#main-menu>li{
width: 56px;
}
#main-menu.icons_only>li>a>i{
font-size: 0.95em;
}
.dropdown div.item{
width: 50px;
}
.dropdown-slider .controls .prev,
.dropdown-slider .controls .next{
height:50px;
top:30px;
}
.dropdown-slider .controls i{
top: 13px;
font-size: 1.2em;
}
#main-menu>li{
display:none;
}
#main-menu>li.show-small{
display:block;
}
#dropdown-menu{
display:block;
}
form.search_form {
position: relative;
margin: 0 auto;
}
form.search_form button {
position: absolute;
right: 0;
}
.dropdown-content-container #dropdown-search {
width: 100%;
}
form.search_form input.search {
padding: 11px 55px 10px 14px;
width: 100%;
}
header .no-menu{
top: 1.7em;
font-size: 0.8em;
}
#main-menu>li>a>span.title{
font-size: 0.6em;
}
}
@media only screen 
and (max-width: 767px) 
and (min-width: 480px){
header .logo{
margin-left: 23px;
}
.dropdown-content-container #dropdown-colors{
height:100px;
}
.dropdown-content-container #dropdown-colors.open{
max-height:105px;
}
.dropdown .viewport {
margin-top: 30px;
}


}
@media only screen 
and (max-width: 767px) 
and (min-width: 320px){
form.search_form{
width: 96%;
}
}
@media only screen 
and (max-width: 767px) 
and (min-width: 640px){

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

}
@media only screen 
and (max-width: 639px) 
and (min-width: 480px){
}
@media only screen 
and (max-width: 479px){
header .logo{
margin-left: 18px;
width: 45px !important;
}
.dropdown-content-container #dropdown-colors{
height:80px;
}
.dropdown-content-container #dropdown-colors.open{
max-height:85px;
}
.dropdown .viewport {
margin-top: 15px;
}
.dropdown-slider .controls .prev,
.dropdown-slider .controls .next{
top:15px;
}
}
@media only screen 
and (max-width: 479px) 
and (min-width: 320px){
header .logo{
margin-left: 18px;
}

}
@media only screen 
and (max-width: 319px){
form.search_form{
width: 94%;
}
}
/* ///////////////////////////////////////////////////////////////*/
/* ////////////////     < /Header and dropdown >     /////////////*/
/* ///////////////////////////////////////////////////////////////*/