@font-face {
	font-family: IRANSans;
	font-style: normal;
	font-weight: normal;
	src: url('../fonts/eot/IRANSansWeb(FaNum).eot');
	src: url('../fonts/eot/IRANSansWeb(FaNum).eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
		 url('../fonts/woff2/IRANSansWeb(FaNum).woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
		 url('../fonts/woff/IRANSansWeb(FaNum).woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
		 url('../fonts/ttf/IRANSansWeb(FaNum).ttf') format('truetype');
}


body
{
    font-family: 'Roboto', sans-serif;
}

a {
    color:#999;
}

a:hover,a:focus {
    color:#666;
    text-decoration:none;
}


.grayscale {
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
       -webkit-transition: all .5s;
    transition: all .5s;
}

.grayscale:hover {
  filter: none;
  -webkit-filter: grayscale(0%);
}

.colorscale {
    filter: none;
    -webkit-filter: grayscale(0%);
    -webkit-transition: all .5s;
    transition: all .5s;
}

.colorscale:hover {
      filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
}
/*BOOTSTRAP CUSTOM STYLES*/

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    padding: 0px;
}


.row {
    margin: 0;
    padding: 0;
}


.btn-default {
    color: #fff;
    background-color:#3996bb;
    border: 1px solid #3996bb;
}

    .btn-default:hover,
    .btn-default:focus,
    .btn-default:active,
    .btn-default.active,
    .open > .dropdown-toggle.btn-default {
        color: #3996bb;
        background-color: #fff;
        border-color: #3996bb;
    }

.btn-primary {
    color: #3996bb;
    background-color:#fff;
    border: 1px solid #3996bb;
}

    .btn-primary:hover,
    .btn-primary:focus,
    .btn-primary:active,
    .btn-primary.active,
    .open > .dropdown-toggle.btn-primary {
        color: #fff;
        background-color: #3996bb;
        border-color: #3996bb;
    }





/*CHANGE MENU BREAKPOINT____________*/


@media (max-width: 1023px) {
    .navbar-header {
        float: none;
    }
    .navbar-toggle {
        display: block;
    }
    .navbar-collapse {
        border-top: none;
        box-shadow: none;
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
            padding-bottom: 15px;

    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .navbar-text {
        float: none;
        margin: 15px 0;
    }
    /* since 3.1.0 */
    .navbar-collapse.collapse.in { 
        display: block!important;
    }
    .collapsing {
        overflow: hidden!important;
    }

    
    .navbar-nav .open .dropdown-menu {
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
}

/*MENU______________*/



.navbar
{
    min-height: initial;


}

.nav > li > a {
    position: relative;
    display: block;
    padding: 10px 30px 10px 0;
    font-weight:bold
}

@media (max-width: 1199px) {
    .nav > li > a {
        padding: 10px 20px 10px 0;
    }
}
.navbar-nav {
    margin: 0;

}


.navbar-default
{
    background-color: transparent;
    margin-bottom:0px;
    border:none;
    position:relative
}



.navbar-collapse {
    padding-right: 0;
    padding-left: 0;
    border-top: none;
    -webkit-box-shadow: none;
    box-shadow: none;

}


    .navbar-default .navbar-nav > li > a {
        color: #666;
    }

    .navbar-default .navbar-nav>li>a:hover, 
    .navbar-default .navbar-nav>li>a:focus {
    color: #009BA7;
    background-color: transparent;
}

    .navbar-default .navbar-nav>.open>a, 
    .navbar-default .navbar-nav>.open>a:hover, 
    .navbar-default .navbar-nav>.open>a:focus ,
    
    .navbar-default .navbar-nav>.active>a, 
    .navbar-default .navbar-nav>.active>a:hover, 
    .navbar-default .navbar-nav>.active>a:focus{
    background-color: transparent;
    color: #009BA7;
}



@media (min-width: 768px) {
    .navbar-nav > li > a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
}


.navbar-toggle {
   position: absolute;
    right: 0;
    top: -82px;
    margin-right: 0;
    padding: 9px 10px;
    margin-top: 0;
    margin-bottom: 0;
    background-color: transparent;
    background-image: none;
    border: none;
    border-radius: 0;
}


.dropdown-menu {

    padding: 5px;
    margin: 0;
    left:-15px;
    font-size: 14px;

    background-color: #eee;
    border: none;

    -webkit-box-shadow: none;
    box-shadow: none;

}
.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus {
    text-decoration: none;
    color: #009BA7;
    background-color: transparent;
}
.dropdown-menu>li>a {
    display: block;
    padding: 5px 10px;
    clear: both;

    color: #666;

}


.navbar-default .navbar-toggle .icon-bar {
    background-color: #009BA7;
}

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background-color: #009BA7;
}
.navbar-default .navbar-toggle:hover .icon-bar, 
.navbar-default .navbar-toggle:focus .icon-bar{
    background-color: #fff;
}

.navbar-default .navbar-toggle {
    border-color: transparent;
}

/*HEADER _______________________________*/

.main-container {
    width: 100%;
    max-width: 1600px;
    padding: 0 40px;
}
@media (max-width: 767px) {
    .main-container {
        padding: 0 15px;
    }
}
.header-row{
    margin-top:40px;
    position:relative; 
    min-height:170px;

}
    .header-row .logo {
        width: 200px;
        position: absolute;
        text-align:center;
        left: 0;
        top: 0;

        z-index:99
    }

    .header-row .logo img {
        width: 100%;
        max-width:200px;

    }

    .header-row .right {
        position: absolute;
        right: 0;
        top: 0;
        width: 200px;
    }

    .header-row .right input {
        width:100%;
        outline:0;
        border:1px solid #ddd;
        padding:2px 4px;
        padding-right:25px;
        font-size:12px;
    }
    .header-row .right input:focus {
          border:1px solid #999;
    }

    .header-row .right a {
        position:absolute;
        top:2px;
        right:4px;
        font-size:16px;
        color:#aaa
    }

    .header-row .right a:hover,
    .header-row .right a:focus  {
        color:#666;
        text-decoration:none;
    }
    .header-row .menu-col {
        width: 100%;
        position: absolute;
        bottom: 0;
        left: 0;
        padding-left: 240px;
        z-index:98
    }

    .header-row .main-menu-row {
        border:1px solid #aaa;
        border-width:1px 0
    }


@media(max-width:1023px) {
    .header-row .logo {

          position: relative;
            z-index:100
    }
    
        .header-row .right {
          position: relative;
    width: 100%;
    top: 0;
    margin:15px 0;
    z-index: 100;

    }
    .header-row .menu-col {
        position: relative;
        padding-left:0;
    }
}

@media(max-width:767px) {

        .header-row  {

       margin-top:20px;
       min-height:initial
    }
    .header-row .logo {

        width:123px
    }


}
ul.menu-ul{
    list-style:none;
        margin: 0;
    padding: 0;
    float:left
}
ul.menu-ul li{
  display:inline-block;
  padding:0 40px 0 0 ;
  position:relative
}



ul.menu-ul li:after{
 content:'|';
  font-size:12px;
 position:absolute;
    right: 20px;
    top: 4px;
    color: #999;

}

ul.menu-ul li:last-child:after{
 content:none;

}
ul.menu-ul li a{
display:block;
  padding:5px 10px;
  padding-left:0;
  font-size:12px;
  color:#999;
}
ul.menu-ul li a:hover{

  color:#666;
}

@media(max-width:767px) {
    ul.menu-ul li {
        padding: 0 0 0 0;
    }



        ul.menu-ul li:after {
            content: none;
        }
}

a.lang {
    font-family:IRANSans;
    font-size:12px;
    float:right;
   color:#999;
   padding:5px;
   padding-right:0
}
a.lang:hover ,
a.lang:focus {

   text-decoration:none;
      color:#666;
}
  






/*footer STYLES _________________*/



footer
{
    padding:10px 0
}


.footer-cr {
      padding:5px 0;
      text-align:right;
      font-size:12px;
      color:#999
}
.footer-sn {
    padding:0;
      text-align:left;
}
.footer-sn a{
  font-size:19px;
  color:#999;
  display:inline-block;
  margin-right:25px;

}
.footer-sn a:hover,
.footer-sn a:focus{
  color:#666;
 text-decoration:none;

}
@media(max-width:767px) {
   .footer-cr ,.footer-sn {
      text-align:left;
}

}





.inner-row{
    padding:0 100px;
    padding-top:20px;
}

     @media (max-width: 1023px) {
      .inner-row{
    padding:0;
        padding-top:20px;
}
}
/*INDEX PAGE ____________________________*/

.modal-open .modal {
   display: flex;
    justify-content: center;
    align-items: center;
}

@media (min-width: 768px) {
    .modal-dialog {
        width: 400px;

    }
}
.modal-content {
    position: relative;
    background-color: #009BA7;
    border: none;
    border-radius: 12px;
    -webkit-box-shadow: 0 3px 9px rgba(0,0,0,0.5);
    box-shadow: 0 3px 9px rgba(0,0,0,0.5);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    outline: 0;

    min-height:400px;
    display:flex;
    align-items: flex-end;
}

.modal-body {
    position: relative;
    padding: 50px;
    color:#fff;

}
.modal-body .big{
     font-size:60px;
     line-height:60px;
     margin:0;
}
.modal-body .small{
     font-size:40px;
      line-height:40px;
      margin:0;
}

.modal-content  .close{
    position:absolute;
    z-index:100;
    top:10px;
    left:10px;
    color:#Fff;
    font-size:30px;
    background-color:transparent;
    border:none;
    outline:0;
}


@media (max-width: 767px) {

    .modal-content {
    min-height:initial;

}

    .modal-body {
    padding: 20px;
    padding-top:40px;


}
.modal-body .big{
     font-size:40px;
     line-height:40px;
     margin:0;
}
.modal-body .small{
     font-size:20px;
      line-height:20px;
      margin:0;
}
.modal-content  .close{

    top:5px;
    left:5px;

    font-size:15px;

}

}





.grid-row{

    margin:0 -10px
}

    .grid-row .grid {
        border: 10px solid #fff;
        padding:20px;

        display: -webkit-flex;
        display:flex;
        
        -webkit-justify-content: flex-end;
        justify-content: flex-end;

       -webkit-flex-direction: column;
        flex-direction: column;



        background-position:center;
        background-size:cover;
        color:#fff;
        width: 100%;
        float: left;
        height: 15vw;
        max-height:240px;

        font-weight:bold;

    }

.grid-row .grid.h2{
    height:30vw;
       max-height:480px;
}
.grid-row .grid.h3{
    height:45vw;
       max-height:720px;
}


.grid-row .grid.w1{
    width:66%;
}
.grid-row .grid.w2{
    width:34%;
}

.grid-row .grid .big{

  font-size:60px;
          line-height:60px;
}
.grid-row .grid .small{
   
  font-size:30px;
    line-height:30px;
}


@media(max-width:1023px) {

            .grid-row .grid .big {
            font-size: 40px;
            line-height: 40px;
        }

        .grid-row .grid .small {
            font-size:20px;
            line-height: 20px;
        }
}

@media(max-width:767px) {

    .grid-row .grid {
        height: 30vw;
    }

        .grid-row .grid.h2 {
            height: 60vw;
        }

        .grid-row .grid.h3 {
            height: 90vw;
        }

        .grid-row .grid .big {
            font-size: 24px;
            line-height: 24px;
        }

        .grid-row .grid .small {
            font-size: 16px;
            line-height: 16px;
        }
}




.slider-col {
    margin-bottom:10px;
}



.slider-item {
    background-size: cover;
    background-position: center;

}

.slider-item img{
  width:100%;

}

    .slider-item .caption {
        position: absolute;
        /*background-color: rgba(0,0,0,0.3);*/
        width: 40%;
        text-align: left;
        left: 0;
    bottom: 0;
        padding: 40px;
        color: #fff;
    }
    .slider-item .caption h1,
    .slider-item .caption h2,
    .slider-item .caption h3{
       font-size:60px;
       line-height:60px;
       padding:10px 0;
       margin:0;
       text-shadow:2px 2px 2px rgba(0,0,0,0.5)

    }
      .slider-item .caption p{
        font-size:30px;
        padding:0;
        margin:0;
         text-shadow:2px 2px 2px rgba(0,0,0,0.5)
    }

     @media (max-width: 1199px) {
        .slider-item .caption {
        width: 75%;
    }


            .slider-item .caption h1,
    .slider-item .caption h2,
    .slider-item .caption h3{
       font-size:40px;
       line-height:40px;

    }
      .slider-item .caption p{
        font-size:20px;

    }
}
     @media (max-width: 767px) {
        .slider-item .caption {
        width: 100%;
        padding:20px;


    }

            .slider-item .caption h1,
    .slider-item .caption h2,
    .slider-item .caption h3{
       font-size:20px;
       line-height:20px;


    }
      .slider-item .caption p{
        font-size:14px;

    }
}



     /*PRODUCTS_____________*/

 .pr-thumb-row{
         margin:0 -10px;
     }  
     .pr-thumb{
         padding:10px;
         text-align:center;
         /*opacity:0.79;*/
         transition:all 0.52s;
     }   


 .pr-thumb-row:hover .pr-thumb{
         opacity:0.79;
     }   
  .pr-thumb-row .pr-thumb:hover{
         opacity:1;
     }

     .pr-thumb:hover{

         opacity:1;
     }   
       .pr-thumb img{
           width:100%;
           margin-bottom:10px;
     }   
             .pr-thumb a{
        color:#666;
     }          .pr-thumb a:hover{
        color:#333;
     }
         .pr-thumb .head{
         margin:0; 
         padding:0;
         font-size:14px;
         font-weight:normal;
     }

         .pr-thumb .sale{
       display:none;
     }
         .pr-thumb.pr-sale .sale{
       display:flex;
       align-items:center;
       justify-content:center;

       position:absolute;
       bottom:50px;
       font-size:36px;
       font-weight:bold;
       right:20px;
       background-color:#009BA7;
       width:120px;
       height:120px;
       color:#fff;
       border-radius:50%;
     }


              /*PRODUCT_____________*/
.pr-row {
    padding-left: 140px;
}
@media (max-width: 1023px) {
    .pr-row {
        padding-left: 0px;
    }
}

@media (max-width: 767px) {
    .pr-row {
        padding-left: 0;
    }
}

.pr-info{
    padding-bottom:20px;
    padding-left:40px;
    font-size:14px;  color:#666;
    letter-spacing:1px;
}
.pr-info .back{
        margin-bottom:80px;
        display:block;
            font-size:12px;
}
.pr-info .head,
.pr-gallery .head{
    font-size:14px;
    padding:0;
    margin:0;
    margin-bottom:10px;

}



.pr-gallery{
    padding:10px 0
}

@media (max-width: 767px) {
   .pr-info{

    padding-left:0;

}
}





.sug-slider-row {
        margin:20px -10px 10px -10px;
        font-size:14px;
}
.sug-slider-row .ttl{
       display:block;
       padding:0 10px;
}

.multi-slider {

}
.multi-slider .slider-item{
 padding:10px;

   
}



.page-info{
    padding-bottom:20px;
    padding-left:40px;
    font-size:14px;  color:#666;
    letter-spacing:1px;
    color:#666;
}
@media (max-width: 767px) {
   .page-info{

    padding-left:0;

}
}
.page-info .head{
    font-size:14px;
    padding:0;
    margin:0;

}
.page-info div.body{
    
    margin-top:10px;
}

.maininfo .tags:after {
content:',';
margin-right:-3px;
}
.maininfo .tags:last-child:after {
content:'';
margin-left:-5px;
}