/*------------------------------------
Table of Content

1. reset
2. tb menu
3. sub menu
4. mega menu
5. grid
6. dark dropdown menu
7. light dropdown menu
8. light dropdown hover
9. fixed width menu
10. float menu
11. center align menu
12. dark menu
13. background image menu
14. image grid menu
15. contact form
------------------------------------*/

/*------------------------------------
    reset
------------------------------------*/

/*body { margin: 0; padding: 0; font-family: 'Source Sans Pro', sans-serif; overflow-x: hidden; background: #ccc; text-rendering:optimizeLegibility;  -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; }*/

/*a, a:hover { text-decoration: none; color: #222; -webkit-transition: all 0.3s ease;  -moz-transition: all 0.3s ease; transition: all 0.3s ease; }*/

/*.wrapper{width: 1170px; margin: 0 auto; position: relative;}*/

.pull-right {float: right;}

.pull-left {float: left;}

.tb-logo {float: left; font-size: 20px; color: #222; margin-top: 15px; margin-right: 20px;}

.tb-container {

}

/*------------------------------------
    tb menu
------------------------------------*/

#tb-menu { position: relative; z-index: 1200; }

.tbmenu , .tbmenu ul{  padding: 0; margin: 0; list-style: none; font-size: 14px; }

.tbmenu > li { float: left;  padding: 0 20px; }

.tbmenu > li.menu-right {   }

.tbmenu li li{  position: relative; }

.tbmenu li > a {  display: block }

.tbmenu a i { padding-right: 10px }

.tbmenu .search a i,
.tbmenu a i.arrow { padding-right: 0px }

.tbmenu > li > a > i.arrow { margin-left: 10px;  margin-top: 3px; }

.tbmenu a { text-decoration: none; color: #222; }

.tbmenu > li > a  {  padding: 20px 0; }

.tbmenu > li  { padding: 0 20px; }

.tbmenu > li > a:hover, .tbmenu > li.active > a {color: #000;}


/*------------------------------------
    sub menu
------------------------------------*/

.tbmenu ul { display: none; position: absolute; width: 190px; z-index: 1300; }

.tbmenu > li.menu-right > ul ul {left: -190px}

.tbmenu ul a{ padding: 10px 20px;  color: #222; }

.tbmenu li:hover > ul { display: block; }

.tbmenu ul ul { top:0px; left: 190px; }


.tbmenu > li.menu-right > ul,
.tbmenu > li.menu-right > div {
    /*right: 0px;*/
}


.container-fluid .tbmenu > li.menu-right > ul,
.container-fluid .tbmenu > li.menu-right > div {
    right: 0px;
}

.tbmenu li a i.arrow { float: right; margin-top: 3px;}

.tbmenu li.search a i.arrow {  display: none; }



.tbmenu ul a:hover, .mega-menu ol li a:hover {  background: rgba(255,255,255,.1); }


/*------------------------------------
    mega menu
------------------------------------*/

.tbmenu li > div {   padding: 10px; }

.mega-menu ol { list-style: none; padding-left: 0; }

.mega-menu ol li a { padding: 10px 20px; color: #222; }

.mega-menu h1, .mega-menu h2, .mega-menu h3, .mega-menu h4, .mega-menu h5, .mega-menu h6, .mega-menu p { padding-left: 20px; font-weight: normal; }

.tbmenu .full-nav, .tbmenu .half-nav, .tbmenu .quarter-nav { display: none; position: absolute; z-index: 1300; }

.tbmenu > li:hover > div {  display: block;  }

.tbmenu .full-nav  { width: 100%; left: 0; right: 0; }
.tbmenu .half-nav  { width: 50%; left: auto; right: auto; }
.tbmenu .quarter-nav  { width: 25%; left: auto; right: auto; }

.tbmenu li.menu-right .half-nav  { width: 50%; left: auto; right: 0; }
.tbmenu li.menu-right .quarter-nav  { width: 25%; left: auto; right: 0; }

.tbmenu li > div input { border-radius: 0;  box-shadow: none;  border: none; }

.tbmenu.light-sub-menu input {border: 1px solid #ddd}

.tbmenu li > div input:focus,
.tbmenu.light-sub-menu input:focus {box-shadow: none}

.light-sub-menu .mega-menu li a span, .dark-sub-menu .mega-menu li a span {display: block; color: #bbbbbb; font-size: 12px }

.light-sub-menu .mega-menu li a:hover span, .dark-sub-menu .mega-menu li a:hover span  { color: #fff;  }

.light-sub-menu .mega-menu li a span,
.light-sub-menu .mega-menu li a:hover span,
.dark-sub-menu .mega-menu li a span { -webkit-transition: all 0.3s ease;  -moz-transition: all 0.3s ease; transition: all 0.3s ease; }


/*------------------------------------
    grid
------------------------------------*/

.tbmenu .col1, .tbmenu .col2, .tbmenu .col3, .tbmenu .col4, .tbmenu .col5, .tbmenu .col6 {  float: left; }

.mega-menu .col1 { width: 100%; }
.mega-menu .col2 { width: 50%; }
.mega-menu .col3 { width: 33.33%; }
.mega-menu .col4 { width: 25%; }
.mega-menu .col5 { width: 20%; }
.mega-menu .col6 { width: 16.66%; }


.grid .col1,
.grid .col2,
.grid .col3,
.grid .col4,
.grid .col5,
.grid .col6 { display: inline-block;  margin-right: 1%;  padding: 5px }


.grid.gray .col1,
.grid.gray .col2,
.grid.gray .col3,
.grid.gray .col4,
.grid.gray .col5,
.grid.gray .col6 {background: #ddd; }


.grid .mega-menu .col1 { width: 99%; }
.grid .mega-menu .col2 { width: 49%; }
.grid .mega-menu .col3 { width: 32.33%; }
.grid .mega-menu .col4 { width: 24%; }
.grid .mega-menu .col5 { width: 19%; }
.grid .mega-menu .col6 { width: 15.66%; }

.menu-row {
    margin-bottom: 10px;
    width: 100%;
    display: inline-block;
    margin-left: .5%;
}

.menu-row:last-child {margin-bottom: 0}



/*------------------------------------
    dark dropdown menu
------------------------------------*/

.dark-sub-menu  ul, .dark-sub-menu li > div {  background: #222; }

.dark-sub-menu ul a,
.dark-sub-menu li > div a,
.dark-sub-menu li > div h1,
.dark-sub-menu li > div h2,
.dark-sub-menu li > div h3,
.dark-sub-menu li > div h4,
.dark-sub-menu li > div h5,
.dark-sub-menu li > div h6,
.dark-sub-menu li > div p { color: #fff; }

/*------------------------------------
    light dropdown menu
------------------------------------*/

.light-sub-menu  ul, .light-sub-menu li > div {  background: #fff;  box-shadow: 0  0 1px #d1d1d1; }


.light-sub-menu ul a,
.light-sub-menu li > div a,
.light-sub-menu li > div h1,
.light-sub-menu li > div h2,
.light-sub-menu li > div h3,
.light-sub-menu li > div h4,
.light-sub-menu li > div h5,
.light-sub-menu li > div h6,
.light-sub-menu li > div p { color: #222; }

.light-sub-menu ul a:hover,
.light-sub-menu ol li a:hover { color: #fff; }

/*------------------------------------
    light dropdown hover
------------------------------------*/

.light-sub-menu ul a:hover,
.light-sub-menu ol li a:hover { color: #fff;  background: #222;}



/*------------------------------------
    fixed width menu
------------------------------------*/

.container header {  display: inline-block; width: 100%;  }

.container header .tb-logo {  margin-left: 20px; }

.container header .nav-btn {margin-right: 20px}



/*------------------------------------
    float menu
------------------------------------*/

.container header.float-menu {  display: inline-block; width: 100%;  margin-top: 50px;  }

.container header.float-menu .tb-logo {  margin-left: 20px; }

.container header.float-menu .nav-btn {margin-right: 20px}



/*------------------------------------
    center align menu
------------------------------------*/


.center-menu {text-align: center}

.center-menu .center-logo, .center-menu .tbmenu {display: inline-block;}

.center-menu .tbmenu ul, .center-menu .tbmenu li > div { text-align: left!important; }


.no-bg {background: none}


/*------------------------------------
    dark menu
------------------------------------*/


.dark-menu {background: #000}

.dark-menu a {color: #fff}


/*------------------------------------
    background image menu
------------------------------------*/

.menu-bg {
    background-image: url(../img/mega-img.png) !important;
    background-repeat: no-repeat !important;
    background-position: bottom right !important;
    background-size: auto !important;
}


/*------------------------------------
    image grid menu
------------------------------------*/

.grid .mega-menu .col1 img ,
.grid .mega-menu .col2 img ,
.grid .mega-menu .col3 img ,
.grid .mega-menu .col4 img ,
.grid .mega-menu .col5 img ,
.grid .mega-menu .col6 img { width: 100%; height: auto; margin-bottom: 10px; }


/*------------------------------------
    contact form
------------------------------------*/

.contact-form { padding: 0 20px;}

.contact-form input, .contact-form textarea {
    background: #fff;
    width: 100%;
    display: inline-block;
    margin-bottom: 10px;
    height: 35px;
    padding-left:10px;
    padding-right:10px;
    border: 1px solid #ddd;
    color: #222;
}

input[type=checkbox] {width: auto; height: auto; margin-right: 10px; float: left;}

.contact-form input:focus, .contact-form textarea:focus {outline: 0}

.contact-form textarea {height: 150px}

.tb-btn {padding: 10px 20px; border: none}