@font-face {
font-family: 'sansz';
    src: url('fonts/IRANSansWeb.woff') format('woff'); 
}

@font-face {
font-family: 'sanszbold';
    src: url('fonts/IRANSansWeb_Bold.woff') format('woff');
}

blockquote,body,dd,div,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,hr,html,input,li,ol,p,pre,ul{font-family:sansz;margin:0;padding:0}address,caption,cite,code,em,h1,h2,h3,h4,h5,h6,pre,strong,th{font-size:1em;font-weight:400;font-style:normal}ol,ul{list-style:none;padding-inline-start:0}.clear{clear:both;height:0}.clearright{clear:right}.clearleft{clear:left}.clear4{clear:both;height:4px}.clear6{clear:both;height:6px}.clear8{clear:both;height:8px}.clear10{clear:both;height:10px}.clear20{clear:both;height:20px}.clear32{clear:both;height:32px}.clear40{clear:both;height:40px}.clear60{clear:both;height:60px}

a {
    text-decoration: none;
}

img {
    width:100%;
}
body {
    background-color: #f2f2f2;
    direction: rtl;
}
.container {
    min-height:800px;
    width: 1100px;
    margin:0 auto;
    background-color: #eee;
}
.container .top {
    width:100%;
    padding:16px 0 0 0;
    margin-bottom: 32px;
    border-bottom: 8px solid #fff;
    position: relative;
    background: rgb(234,234,234);
    background: linear-gradient(60deg, rgba(234,234,234,1) 0%, rgba(213,213,213,1) 43%, rgba(238,238,238,1) 100%);
}

.container .top .logo {
    margin:0 auto;
    width:84%;
    max-width: 512px;
}

.container .top .menu{
    width:100%;
    min-height:46px;
    background: linear-gradient(60deg, rgb(129, 129, 129) 0%, rgba(100,100,100,1) 43%, rgba(140,140,140,1) 100%);
    padding-top:4px;
}

.container .top .items {
    width:310px;
    margin: 2px auto;
}

.container .top .items .item {
    float: right;
    border-left:1px solid #999;
    height:28px;
    padding:4px 6px;
}

.container .top .items .item a {
    color:#fff;
}

.container .body {
    width:98%;
    padding:16px 2%;
    font-size: 15px;
}

.container .body .part1 {
    width:46%;
    float: right;
}

.container .body .part1 .title {
    font-family: sanszbold;
    font-size:23px;
    color: rgb(30, 64, 116);
}

.container .body .part1 .title2 {
    font-family: sanszbold;
    font-size:18px;
    color: rgb(30, 64, 116);
    margin-top:24px;
}

.container .body .part1 ul {
    margin-top:12px;
    list-style: square;
    margin-right:18px;
}

.container .body .part1 ul li {
    list-style-type: circle;
    border-bottom:1px dotted #c8c8c8;
    padding:8px 0;

}

.container .body .part2 {
    width:44%;
    float: left;
    margin-left:2%;
}

.container .body .part2 .userform {
    width:96%;
    padding:0 2%;
    border-radius: 8px;
    background: rgb(154,154,154);
    background: linear-gradient(60deg, rgba(154,154,154,1) 0%, rgba(170,170,170,1) 100%);
    min-height: 150px;
}

.container .body .part2 .userform .left{
    width:128px;
    float: left;
    padding-right:8px;
    border-right: 1px solid #fff;
    min-height: 150px;
    padding:8px;
}

.container .body .part2 .userform .left .title{
    text-align: center;
    margin-top:-12px;
    color: rgb(30, 64, 116);
}

.container .body .part2 .userform .right{
    width:calc(100% - 178px);
    float: left;
    margin-right:20px;
}

.container .body .part2 .userform .right form {
    margin-top: 16px;
}

.container .body .part2 .userform .right input {
    width:76%;
    height:26px;
    direction: ltr;
    padding:4px 8px;
    margin:0 auto 10px auto;
    border:1px solid #888;
    border-radius: 4px;
    text-align: center;
}

.container .body .part2 .userform .right .submit {
    width: calc(76% + 18px);
    height: 32px;
}

.container .body .part2 .contact {
    margin-top:32px;
    width: 100%;
}


.container .body .part2 .contact .title {
    color: rgb(30, 64, 116);
    font-family: sanszbold;
    font-size: 23px;
}

.container .body .part2 .address {
    margin:12px 0;
    color:#333;
}

.container .body .part2 .contact .item {
    border-top:1px solid #ddd;
    margin-top:6px;
    padding-top:4px;
    width: 100%;
}

.container .body .part2 .contact .item .icon {
    float:left;
    width:32px;
}

.container .body .part2 .contact .item .ititle {
    float:left;
    margin:6px 0 0 4px;
}

.container .body .part2 .contact .item .ititle span {
    color:#777;
}

.footer {
    width: 1100px;
    margin:0 auto;
    min-height:220px;
    background-color: #555;
    margin-top:32px;
    border-top:12px solid #fff;
}

.footer .left{
    width:360px;
    margin:24px 0 16px 16px;
    float: left;
    text-align: left;
    font-size: 13px;
}

.footer .left .title {
    font-family: sanszbold;
    color:#fff;
    font-size: 15px;
}

.footer .left .txt {
    color:#aaa;
}

.footer .right{
    width:188px;
    margin:24px 16px 16px 0;
    float: right;
}

.footer .right .copyright {
    font-size: 13px;
    color:#fff;
    width: 100%;
    text-align: center;
}


@media screen and (max-width:450px){
    .container {
        width: 96%;
        margin:0 auto;
    }
    .container .body .part1 {
        width:100%;
        float: none;
    }
    .container .body .part2 {
        width:100%;
        float: none;
        margin-left:0;
        margin-top:48px;
    }
    .footer {
        min-height:440px;
        width: 100%;
    }
    .footer .left{
        width:92%;
        margin:24px auto;
        float: none;
    }
    .footer .right{
        width:188px;
        margin:10px auto 16px auto;
        float: none;
    }
}