

/***

====================================================================
  Reset
====================================================================

 ***/
* {
  margin:0px;
  padding:0px;
  border:none;
  outline:none;
}


/***

====================================================================
  Global Settings
====================================================================

 ***/


body {
  font-size:15px;
  color:#848484;
  line-height:26px;
  font-weight:400;
  background:#ffffff;
  font-family: 'Open Sans', sans-serif;
  background-size:cover;
  background-repeat:no-repeat;
  background-position:center top;
  -webkit-font-smoothing: antialiased;
}

  @media (min-width:1200px) {
  .container {
    max-width: 1170px;
    padding: 0px;
  }
}

.boxed_wrapper{
  position: relative;
  overflow-x: hidden;
  margin: 0 auto;
  width: 100%;
  min-width: 300px;
}


a{
  text-decoration:none;
  position: relative;
  font-size: 15px;
  font-family: 'Open Sans',sans-serif;
  line-height: 26px;
  font-weight: 400;
  cursor:pointer;
  color:#848484;
  transition: all 500ms ease;
}

a:hover{
  text-decoration:none;
  outline:none;
  color: #ff0000;
}

input,button{
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
  font-size: 15px;
}

input,button,select,textarea {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 15px;
}

ul,li{
  list-style:none;
  padding:0px;
  margin:0px;
}

input{
  transition: all 500ms ease;
}
button:focus,
input:focus{
  outline: none;
  box-shadow: none;
  transition: all 500ms ease;
}

p{
  position: relative;
  font-size: 15px;
  font-family: 'Open Sans', sans-serif;
  line-height: 26px;
  font-weight: 400;
  color: #848484;
  margin-bottom: 10px;
  font-style: normal;
  transition: all 500ms ease;
}

h1,h2,h3,h4,h5,h6 {
    position: relative;
    font-family: 'Hind', sans-serif;
    font-weight: 400;
    margin-bottom: 0px;
    color: #222222;
    transition: all 500ms ease;
}

h5 {
  position:relative;
  font-family: 'Hind', sans-serif;
  font-weight: 400;
  margin-bottom: 0px;
  color: #222222;
  transition: all 500ms ease;
}
h5{
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
}

.centred{
  text-align: center;
}

figure{
  margin: 0px;
}

/** button **/

.scroll-top {
  width: 60px;
  height: 60px;
  line-height: 50px;
  position: fixed;
  bottom: 105%;
  right: 50px;
  font-size: 24px;
  border-radius: 50%;
  z-index: 99;
  color: #ffffff;
  text-align: center;
  cursor: pointer;
  background: #ff0000;
  transition: all 500ms ease;
}
.scroll-top:hover{
  background: #1c2026;
}

.scroll-top.open {
    bottom: 30px;
}

.scroll-top span{
  color: #fff;
}
.scroll-top:after {
  position: absolute;
  z-index: -1;
  content: '';
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 1;
  background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%);
  background: -webkit-radial-gradient(center ellipse, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%);
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%);
}

.main-header{
  position:relative;
  left:0px;
  top:0px;
  z-index:999;
  width:100%;
  transition:all 500ms ease;
  -moz-transition:all 500ms ease;
  -webkit-transition:all 500ms ease;
  -ms-transition:all 500ms ease;
  -o-transition:all 500ms ease;
}
.sticky-header{
  position:fixed;
  opacity:0;
  visibility:hidden;
  background: #ffffff;
  left:0px;
  top:0px;
  border-bottom: 1px solid #e0e0e0;
  width:100%;
  z-index:0;
  transition:all 500ms ease;
  -moz-transition:all 500ms ease;
  -webkit-transition:all 500ms ease;
  -ms-transition:all 500ms ease;
  -o-transition:all 500ms ease;
}

.fixed-header .sticky-header {
    z-index: 999;
    opacity: 1;
    visibility: visible;
    -ms-animation-name: fadeInDown;
    -moz-animation-name: fadeInDown;
    -op-animation-name: fadeInDown;
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
    -ms-animation-duration: 500ms;
    -moz-animation-duration: 500ms;
    -op-animation-duration: 500ms;
    -webkit-animation-duration: 500ms;
    animation-duration: 500ms;
    -ms-animation-timing-function: linear;
    -moz-animation-timing-function: linear;
    -op-animation-timing-function: linear;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -ms-animation-iteration-count: 1;
    -moz-animation-iteration-count: 1;
    -op-animation-iteration-count: 1;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
}

.header-top{
  position: relative;
  width: 100%;
  background: #f7f5f5;
  padding: 5px 0px 5px 0px;
}
.header-top .top-left{
  position: relative;
  float: left;
}
.header-top .top-right{
  position: relative;
  float: right;
  margin-top: 3px;
}


.header-bottom{
  position: relative;
  background: #ffffff;
}
.header-bottom .menu-area{
  position: relative;
  float: left;
}

.main-menu{
  position: relative;
  display: block;
}
.main-menu .navbar-collapse{
  padding:0px;
}

.main-menu .navigation > li{
  position:relative;
  float:left;
  margin-right: 42px;
}
.main-header .menu-column{
  padding: 0px;
}
.main-menu .navigation > li > a{
  position:relative;
  display:block;
  font-size:16px;
  font-family: 'Open Sans', sans-serif;
  color:#222222;
  line-height:30px;
  font-weight:400;
  opacity:1;
  text-transform:capitalize;
  padding: 17px 18px 19px 0px;
  letter-spacing: 1px;
  transition:all 500ms ease;
  -moz-transition:all 500ms ease;
  -webkit-transition:all 500ms ease;
  -ms-transition:all 500ms ease;
  -o-transition:all 500ms ease;
}

.main-menu .navigation > li.current > a, .main-menu .navigation > li:hover > a, .main-menu .navbar-collapse > ul li.current.dropdown .dropdown-btn, .main-menu .navbar-collapse > ul li.dropdown:hover .dropdown-btn {
    color: #ff0000;
}
.main-menu .navigation > li:hover > a{
  color: #ff0000;
}
.navbar-header {
  display: none;
}

.sticky-header .main-menu .navigation > li{
  margin: 0px;
}
.sticky-header .main-menu .navigation > li > a{
  padding: 14px 30px 16px 30px;
}
.sticky-header .main-menu .navigation > li > a{
  color: #222222;
}
.sticky-header .main-menu .navigation > li.current > a, .sticky-header .main-menu .navigation > li:hover > a {
    background: #ff0000;
    color: #ffffff;
}
.sticky-header .main-menu .navigation > li:hover > a{
  background: #ff0000;
  color: #ffffff;
}
.sticky-header .logo-box{
  margin-top: 11px;
}
.sticky-header .menu-area{
  padding: 0px;
  margin: 0px;
  border: none;
}

.main-footer{
  position: relative;
  background: #22262e;
  color: #d4dae3;
  padding: 30px 0px 10px 0px;
}
.main-footer .widgets-section{
  position: relative;
}
.main-footer .widgets-section:before{
  position: absolute;
  content: '';
  background: url(../images/background/footer-pattern.webp);
  left: 40%;
  top: -45px;
  width: 100%;
  height: 100%;
  min-height: 322px;
  background-repeat: no-repeat;
  animation-name: float-bob;
  animation-duration: 45s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -webkit-animation-name: float-bob;
  -webkit-animation-duration: 45s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -moz-animation-name: float-bob;
  -moz-animation-duration: 45s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: float-bob;
  -ms-animation-duration: 45s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: float-bob;
  -o-animation-duration: 45s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear;
}
.main-footer .logo-widget{
  margin-top: -12px;
}
.main-footer .logo-widget .footer-logo{
  position: relative;
  margin-bottom: 11px;
}
.main-footer .logo-widget .text{
  margin-bottom: 36px;
}
.main-footer .logo-widget .footer-social li{
  position: relative;
  float: left;
  margin-right: 12px;
}
.main-footer .logo-widget .footer-social li:last-child{
  margin-right: 0px;
}
.main-footer .logo-widget .footer-social li a{
  position: relative;
  display: inline-block;
  font-size: 14px;
  color: #ffffff;
  width: 47px;
  height: 47px;
  line-height: 47px;
  background: #2f333b;
  text-align: center;
  border-radius: 50%;
}
.main-footer .logo-widget .footer-social li a:hover{
  background: #ff0000;
}
.footer-title{
  position: relative;
  font-size: 20px;
  font-family: 'Hind', sans-serif;
  font-weight: 500;
  letter-spacing: 1px;
  line-height: 30px;
  color: #ffffff;
  margin-bottom: 31px;
}
.main-footer .link-widget{
  margin-left: 70px;
}
.main-footer .newsletter-widget .text{
  margin-bottom: 26px;
  line-height: 24px;
}
.main-footer ::-webkit-input-placeholder { /* Chrome */
  color: #d4dae3;
}
.main-footer :-ms-input-placeholder { /* IE 10+ */
  color: #d4dae3;
}
.main-footer ::-moz-placeholder { /* Firefox 19+ */
  color: #d4dae3;
}
.main-footer :-moz-placeholder { /* Firefox 4 - 18 */
  color: #d4dae3;
}
.main-footer .newsletter-widget .footer-title{
  margin-bottom: 30px;
}

.footer-bottom{
  position: relative;
  background: #1c2026;
  color: #d4dae3;
  padding: 20px 0px 19px 0px;
}
.footer-bottom .copyright{
  font-weight: 500;
}
.footer-bottom .copyright a{
  color: #ff0000;
  font-weight: 500;
}
.footer-bottom .copyright a:hover{
  color: #d4dae3;
}

.page-title{
  position: relative;
  width: 100%;
  padding: 5px 0px;
}
.page-title:before{
  position: absolute;
  content: '';
  background: rgba(20, 22, 26, 0.50);
  width: 100%;
  height: 100%;
  left: 0px;
  top: 0px;
}
.page-title .content-box{
  position: relative;
  display: inline-block;
  background: rgba(255, 0, 0, 0.80);
  padding: 0px 20px 0px 20px;
}
.page-title .content-box .title{
  position: relative;
  font-size: 34px;
  line-height: 45px;
  font-family: 'Hind', sans-serif;
  color: #ffffff;
  font-weight: 500;
  border-bottom: 1px solid #ffffff;
  padding-bottom: 6px;
  margin-bottom: 12px;
}

.articles-section{
  position: relative;
  padding: 120px 0px 90px 0px;
}
.articles-section .products-discription .custom-tab-title{
  margin-bottom: 50px;
}
.articles-section .products-discription .custom-tab-title li{
  position: relative;
  display: inline-block;
  font-size: 15px;
  font-family: 'Hind', sans-serif;
  font-weight: 600;
  color: #222222;
  border: 1px solid #e5e5e5;
  padding: 7px 27px 5px 28px;
  margin: 0px 3px;
  cursor: pointer;
  transition: all 500ms ease;
}

.articles-section .products-discription .custom-tab-title li.active {
    border: 1px solid #ff0000;
    background: #ff0000;
    color: #ffffff;
}

.articles-section .tab-details-content .single-tab-content .single-item{
  position: relative;
  display: block;
  background: #f7f5f5;
  padding: 36px 40px 34px 40px;
  margin-bottom: 30px;
}
.articles-section .tab-details-content .single-tab-content h5{
  display: block;
  margin-bottom: 12px;
}
.articles-section .tab-details-content .single-tab-content span{
  color: #ff0000;
}
.articles-section .tab-details-content .single-tab-content .text{
  position: relative;
  font-size: 14px;
  line-height: 22px;
  margin-bottom: 14px;
}
.articles-section .tab-details-content .single-tab-content .lower-content .text{
  margin-bottom: 0px;
  float: left;
}
.articles-section .tab-details-content .single-tab-content .lower-content .link{
  position: relative;
  float: right;
  margin-top: -24px;
}
.articles-section .tab-details-content .single-tab-content .lower-content .link a{
  position: relative;
  display: inline-block;
  font-size: 15px;
  font-weight: 400;
  font-family: 'Hind', sans-serif;
  color: #ffffff;
  background: #ff0000;
  padding: 7px 23px 6px 24px;
}
.articles-section .tab-details-content .single-tab-content .lower-content .link a:hover{
  background: #222222;
}
.articles-section .tab-details-content .single-tab-content .lower-content .link i:before{
  font-size: 15px;
  margin-right: 8px;
}


@media all and (max-width: 600px) {

   #logo_left {
    margin-left: 0%;
    position: absolute;

  }

  #logo_right
  {
    margin-right: 0%;
  }


}

#p, #n
{
  border: 0;
  width: 85%;
  padding-left: 5px;


}

#area_display
{
  width: 100%;
  height: 10%;


}
#area_display2
{
  width: 100%;
  height: 50%;

}

@media all and (max-width: 1000px)
{
  #logo_left {
    margin-left: 0%;
    position: absolute;

  }

  #logo_right
  {
    margin-right: 0%;
  }


}

