﻿@import url("css/all.css");

/*@font-face {
            font-family: 'Yekan';
            src: url('fonts/YekanWeb-Regular.eot') format('embedded-opentype'), url('fonts/YekanWeb-Regular.woff') format('woff'), url('fonts/YekanWeb-Regular.ttf') format('truetype');
            font-weight: normal;
            font-style: normal;
        }*/
@font-face {
font-family: 'BNazanin';
src:
     /*url('http://fontonline.ir/fonts/BNazanin.eot?#') format('eot'),
url('fonts/BNazanin.ttf') format('truetype'),*/
url('fonts/BNazanin.woff') format('woff');
}

        html, body {
            margin: 0;
            padding: 0;
            width: 100%;
            height: 100%;
        }

        body {
            font-family: 'BNazanin','Yekan',Tahoma;
            /*background: #000;
            color: white;*/
            font-size: 18px;
            /*overflow-y: hidden;*/
            overflow-x: hidden;
            line-height:2em;
            
    background-size: 105px 105px;
    background-repeat: repeat;
    background-image: url(images/project_papper.png);

        }
        .wrapper{width:1170px;  margin:0 auto; box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.3); background-color:#fff;}

.cycle-slideshow img{ max-width:100%;}
 
        a{ text-decoration:none;}

        .btnClose{ position:absolute; top:0; left:0;}
   
        /*text pages*/
        .textM{margin-top:55px; direction:rtl; text-align:right; background-color:#fff; color:#000; min-height:500px; }
        .textMIn{ margin:0 10px 0; padding:20px 0 10px;}

         .boldS {
            font-weight: bold;
        }

        .op5 {
            opacity: 0.5;
        }

        .op1 {
            opacity: 1;
        }

        .sm {
            display: inline-block;
            margin: 0 5px;
        }

        .fa {
            cursor: pointer;
        }

       
        /*menu*/
        #divMenu{  /*text-shadow: 2px 2px #000;*/
             padding: 10px; position: fixed; top: 0; left: 0; right: 0; z-index: 100;             
        }

        
        #divMenu a:hover{color:red;}

        .divMenuContent {
            display: none;
            direction: rtl;
            /*width: 100%;*/
            width:450px;
            margin: 0 auto;
            position:absolute;
            right:0px;
            top:20px;
        }
        .divMenuContent li{ padding:5px;font-weight: bold; font-size: 22px;}
        .divMenuContent a{transition: color 0.3s ease, font-weight 0.3s ease, background 0.3s ease; cursor:pointer;}

.menuItem {
    position: relative;
    display:inline-block;
}
        .menuItem , #divMenu a{transition: color 0.3s ease, font-weight 0.3s ease, background 0.3s ease; cursor:pointer;}
        .menuItem:hover{color:red;}

        .divMenuInner{max-width: 1000px; margin: 0 auto; font-weight: bold; font-size: 22px;}

        .d11{/*background-image:url(Images/bg_10.jpg);*/ }

    #mySidebarOpenBtn, #mySidebarCloseBtn {
        display: none;
    }
    .itemAA{float:right; width:25%;}

/*********   Default.css   *************************/

      

        .cycle-slideshow {
            width: 100%;
            height: 100%;
        }

        .spanslideshow {
            display: inline-block;
            width: 100%;
            height: 100%;
            background-size: cover;
            background-position: 50% 50%;
            background-repeat: none;
        }

        .cycle-slide-active {
            -webkit-animation: imageAnimation 6s linear /*infinite*/ 0s;
            -moz-animation: imageAnimation 6s linear /*infinite*/ 0s;
            -o-animation: imageAnimation 6s linear /*infinite*/ 0s;
            -ms-animation: imageAnimation 6s linear /*infinite*/ 0s;
            animation: imageAnimation 6s linear /*infinite*/ 0s;
        }

        .imgD{
            max-width:100%;
        }

        @keyframes imageAnimation {
            0% {
                animation-timing-function: ease-in;
            }

            38% {
                transform: scale(1.05);
                animation-timing-function: ease-out;
            }

            75% {
                transform: scale(1.1);
            }

            100% {
                transform: scale(1.1);
            }
        }



/*چهار دکمه فوت آسم*/
.btnFAD { margin:5px 0;}
.btnFAD .w3-container{ text-align:center; display:inline-block;}
.btnFA{ text-decoration:none;}
.btnFA :hover { text-decoration:underline;}
.btnF{ font-size:2em;}
.btnF .fa-stack-1x{color:white;}
.btnF .fa-stack-1x:hover{color:#92ae0a; font-size:1.1em;}


.div675{ padding:20px 0;}
.div675I{ text-align:center;} 

.footerI{background-color: #e6e2d9;}
    .footerI h2 {
            color: #819B07 !important;
    }


    /***************/
    .sarmad-btn{
    width:100px;
    background:#00ff00;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    padding:8px 30px;
    text-align: center;
    font-family:tahoma;
        margin: 10px;
    top: 10px;
        border:0;
    height: 33px;
    background:#d85ab3;
    color:#fff;
    left:-157px;
}
.sarmad-btn:hover{
    cursor:pointer
}
.contact-us input.entry,textarea.entry{
    text-align:right;
    height:25px;
    width:243px;
    background:#6db9e3;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    border-top:1px solid #64aad1;
    border-right:1px solid #9bd7ef;
    border-bottom:1px solid #9bd7ef;
    border-left:1px solid #64aad1;
    margin-bottom:4px;
    font-family:tahoma;
    color:#fff;
    padding:0 5px;
}
.contact-us #response{

}
.contact-us textarea{
    height:65px;
}
 
/************/



/*********************/
.icon_wrapper {
    border-color: #f8f8f8;
    transition: background-color .3s ease-in-out;
    background-color: #eee;
    box-shadow: inset 0 0 7px 0 rgba(0,0,0,.08);
    width: 110px;
    height: 110px;
    text-align: center;
    line-height: 110px;
    font-size: 50px;
    position: relative;
    overflow: hidden;
    margin: 0 auto 15px;
    border-width: 8px;
    border-style: solid;
    display: block;
    -webkit-border-radius: 100%;
    border-radius: 100%;
}
 .icon_box{
     margin:15px 0 10px;
 }
 .icon_box:hover .icon_wrapper:before, 
	.icon_box a:hover .icon_wrapper:before { 
		background-color: #2991d6;
	}	
 .icon_box .desc_wrapper {
    text-align: center;
}

.desc_wrapper{ }
.desc_wrapper h4{ }
 


/********    tablet and mobiles  ************************************/
@media screen and (max-width: 800px) and (min-width: 480px) {
    #divMenu {
    }
        #divMenu a {
            /*color: #000;*/
        }
        .wrapper{width:100%;}
    h4 {
        font-size: 17px;
    }
     .menuItem {
       font-size:16px;
    }

        .sm {
       margin:0;
    }

    .divMain {
        width: 97%;
        margin: 0 auto;
    }

    .divMenuInner {
        font-size: 20px;
        width: 100%;
    }

    .itemAA {
        width: 33%;
    }
    .fa-2x{font-size:1em;}
}

@media screen and (max-width: 480px) {
    #divMenu {
    }
    .wrapper{width:100%;}
    h4 {
        font-size: 17px;
    }

    .sm {
        margin: 0 2px;
    }

    #mySidebar {
        display: none;
        position: relative;
        -webkit-animation-name: animateright;
        -webkit-animation-duration: 0.4s;
        animation-name: animateright;
        animation-duration: 0.4s;
        width: 200px;
        right: 0;
        box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12) !important;
        float: right !important;
        background-color:#fff;
        color: #000;
    }

  

    #mySidebarOpenBtn, #mySidebarCloseBtn {
        display: inline;
    }

    .menuItem {
        display: block;
        text-align: right;
    }

    .sm {
        display: none;
    }

    .divMenuInner {
        font-size: 16px;
        padding: 3px;
        width: 100%;
    }

    .itemAA {
        width: 50%;
    }
    .fa-2x{font-size:1em;}
	
    .btn__container {font-size:7px;}
    .btn__container span{ display:none;}
}



/*************  instagram telegram**********************************************/

.topcorner{
  
  }

.btn__container {
  justify-content: center;
  align-items: center;
}
.btn {
border-radius: 5px;
  background-color: #fff;
  margin: 5px;
  text-decoration: none;
  color: #c71e7e;
  transition: all 0.2s ease-in-out;
 
}
 .btn  i {
    color: #df3796;
    font-size: 20px;
    padding-right: 10px;
    transition: all 0.3s ease-in-out;
  }
 .btn  span {
    font-family: "Roboto", sans-serif;
    align-self: center;
    transform: translateX(0px);
    transition: all 0.1s ease-in-out;
    opacity: 1;
  }

 .btn :hover {
    transform: scale(1.1);
    background: linear-gradient(to right, #ff3019 0%, #c90477 100%);
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1);
}
  .btn :hover    i {
      transform: translateX(45px);
      padding-right: 0;
      color: #fff;
    }
   .btn :hover   span {
      transform: translateX(30px);
      opacity: 0;
    }
  
 .btn :active {
    transform: scale(1);
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
  }


.btn-f {
border-radius: 5px;
  background-color: #fff;
  margin: 5px;
  text-decoration: none;
  color: #286ed6;
  transition: all 0.2s ease-in-out;
}
 .btn-f i {
    color: #286ed6;
    font-size: 20px;
    padding-right: 10px;
    transition: all 0.3s ease-in-out;
  }
 .btn-f span {
    font-family: "Roboto", sans-serif;
    align-self: center;
    transform: translateX(0px);
    transition: all 0.1s ease-in-out;
    opacity: 1;
  }

  .btn-f :hover {
    transform: scale(1.1);
    background-color: #286ed6;
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1);
    i {
      transform: translateX(45px);
      padding-right: 0;
      color: #fff;
    }
    span {
      transform: translateX(30px);
      opacity: 0;
    }
  }
  .btn-f :active {
    transform: scale(1);
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
  }




/*******************************************/
       
    

    
       