@charset "utf-8";
/*-------------------------------------------*/
/* BASIC SETUP */
/*-------------------------------------------*/

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, 
body {
    background-color: #fff;
    color: #555;
    font-family: 'BYekan', 'Arial', sans-serif;
    font-weight: 300;
    font-size: 19px;
    text-rendering: optimizeLegibility; 
    overflow-x: hidden;
}

.clearfix:after {
   content: "."; 
   display: block; 
   height: 0; 
   clear: both; 
   visibility: hidden;
}

.clearfix {display: inline-block;}

* html .clearfix {height: 1%;}
.clearfix {display: block;}

* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

/*-------------------------------------------*/
/* REUSABLE COMPONENTS */
/*-------------------------------------------*/

.row {
    max-width: 1140px;
    margin: 0 auto;
}


.box {
    padding: 1%;
}

.col {
    display: inline-block;
    vertical-align: top;
}

*:focus {
    outline: none;
}

.triangle {
    clear: none;
    top: 0;
    margin: 0 auto;
    text-align:center;
    width: 0;
    height: 0;
    border-top: 30px solid #181A1C;
    border-left: 585px outset transparent;
    border-right: 585px outset transparent;
    position: relative;
}

.triangle-bright {
    border-top: 30px solid #FECE1A;
}

.triangle-dark {
    border-top: 30px solid #181A1C;
}

.triangle-box {
    width: 100%;
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
}

.section-with-triangle { padding-top: 110px; }

.section-descript {
    background-size: cover;
    background-position: center;
}

.section-descript p {
    color: #fff;
}

.section-descript .left-col {
    text-align: left;
}

.section-descript.fixed-background {
    background-attachment: fixed;
}

.dark-masked-box { background-color: rgba(24, 26, 28, 0.85); }

.max-line-width { max-width: 800px;}

.bright-color {color: #FECE1A;}

.dark-color {color: #181A1C;}

.white-color {color: #fff;}

a.isDisabled {
  color: currentColor;
  cursor: not-allowed;
  opacity: 0.5;
  text-decoration: none;
}

.space-after-head {
    width: 100%;
    height: 20px;
    background-color: #181A1C; 
}

/* ------- Animations -------- */

.zoom-in {
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
    -webkit-transition: all 250ms ease;
    transition: all 250ms ease;
}

.zoom-in:hover {
    -webkit-transform: scale(1.1, 1.1);
            transform: scale(1.1, 1.1);
}

/* ------- HEADINGS -------- */

h1, h2, h3, h4
{
    margin: 0;
}

h1 {
    margin-top: 20px; 
    color: #fff;
    font-size: 240%;
    font-weight: 100;
    /* word-spacing: 4px; change the font then fix it */
    word-spacing: -1px;
}

h3 {
    margin-top: 0;
    margin-top: 10px; 
    color: #181a1c;
    font-size: 160%;
    font-weight: 200;
    word-spacing: px;
}


.h2-underlined-dark,
.h2-underlined-bright,
.h2-underlined-red  {
    padding-top: 18px; 
    font-size: 160%;
    word-spacing: 2px;
    text-align: center;
    margin-bottom: 40px;
    font-weight: 100;
    line-height: 4px;
}

.h2-underlined-dark:after, 
.h2-underlined-bright:after,
.h2-underlined-red:after  {
    display: block;
    height: 2px;
    content: " ";
    width: 100px;
    margin: 0 auto;
    margin-top: 50px;
}

.h2-underlined-bright { color: #FECE1A; }
.h2-underlined-dark { color: #181A1C; }
.h2-underlined-red { color: #ff0000; }

.h2-underlined-bright:after { background-color: #FECE1A; }
.h2-underlined-dark:after { background-color: #181A1C; }
.h2-underlined-red:after { background-color: #ff0000; }


h3 {
    font-size: 110%;
    margin-bottom: 15px;
}

/* ------- PARAGRAPHS -------- */

p {
    text-align: justify;
    line-height: 145%;
}

p.not-first-p {
    padding-top: 10px; 
}

.box p {
    font-size: 90%;
    line-height: 145%;
}

section {
    padding: 80px 0; 
    margin: 0;
} 

.section-bright {
    background-color: #FECE1A;
}

.section-dark {
    background-color: #181a1c;
}

/* ------- ICONS -------- */

.icon-small {
    display: inline-block;
    width: 30px;
    text-align: l;
    color: #FECE1A;
    font-size: 120%;
    margin-left: -5px;    
    line-height: 120%;
    vertical-align: middle;
}

.English {font-family: 'Arial';}

/* ------- LINKS -------- */

.bright-link {
    color: #ebce5e;
}
.dark-link {
    color: #636464;
}

.white-link,
.white-to-bright-link {
    color: #fff;
}

.bright-link:link,
.bright-link:visited, 
.dark-link:link,
.dark-link:visited,
.white-link:link,
.white-link:visited,
.white-to-bright-link:link,
.white-to-bright-link:visited {
    text-decoration: none;
    -webkit-transition: color 0.3s;
    transition: color 0.3s;
    padding-bottom: 1px; 
}

.bright-link:active,
.bright-link:hover {
    color: #FECE1A;
}

.dark-link:active,
.dark-link:hover {
    color: #181A1C;
}

.white-link:active,
.white-link:hover {
    color: #555;
}

.white-to-bright-link:active,
.white-to-bright-link:hover {
    color: #fcd84f;
}

/* ------- BUTTONS -------- */

button { 
    font-family: 'BYekan', 'B Nazanin', 'Arial', sans-serif;
    font-weight: 300;
    font-size: 100%;
}

.btn, 
input[type="submit"],
input[type="button"] {
    display: inline-block;
    padding: 15px 30px; 
    text-decoration: none;
    margin: 5px auto;   
    cursor: pointer;
}

.btn-ghost-dark,
.btn-ghost-bright,
input[type="submit"],
input[type="button"]{
    border: 1px solid #181a1c; 
}


.btn-ghost-dark:link, 
.btn-ghost-bright:link,
.btn-ghost-dark:visited,
.btn-ghost-bright:visited,
input[type="submit"],
input[type="button"] {
    -webkit-transform: background-color 0.5s, color 0.5s;
            transform: background-color 0.5s, color 0.5s;
    color: #181a1c; 
}

.btn-ghost-dark:link, 
.btn-ghost-dark:visited,
input[type="submit"],
input[type="button"] {
    background-color: transparent;
}

.btn-ghost-bright:link, 
.btn-ghost-bright:visited {
    background-color: #FECE1A;
}

.btn-ghost-dark:hover, 
.btn-ghost-dark:active,
input[type="submit"]:hover,
input[type="submit"]:active,
input[type="button"]:hover,
input[type="button"]:active {
    color: #fff;
    background-color: #181a1c;
}

.btn-ghost-bright:hover, 
.btn-ghost-bright:active {
    background-color: #fff;
}

/*-------------------------------------------*/
/* map and contact us */
/*-------------------------------------------*/

.map-box {
    width: 100%;
    height: 480px;
    position: relative;
}

.map {
    width: 100%;
    height: 480px;
    z-index: 0;
    position: relative;
}

.contact-us-box {
    position: absolute;
    top: 0;
    right: 0;
    background-color: rgba(24, 26, 28, 0.8);
    z-index: 10;
    height: 480px;
    padding-top: 18px;
    width: 50%;
}


.seperated-contact-us {
    display: none;
}

.seperated-contact-us .location {
    width: 90%;

}

.inline-contact-us .location {
    width: 80%; 
}

.location {
    margin: 0 auto;
    background-color: #efeded;
    border-radius: 5px;
    box-shadow: #a8a8a8 0px 2px 2px 0px;
}

.location h3 {
    display: inline-block;
    font-size: 100%;
    text-align: justify;
    letter-spacing: px;
    line-height: 1.4;
    color: #181a1c;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
}

.location h2 {
    padding: 20px 30px;
    text-align: center;
    color: #FECE1A;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
}

.contact-details-box {
    padding: 25px 30px 20px 30px;
}

.contact-us {
    border-bottom: 1px; 
    border-bottom-color: #d8d8d8;
    border-bottom-style: solid;
    padding: 10px 0px;
    width: 100%;
    background-color: #e0e0e0;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.contact-details {
    margin-top: -6px;
}

.side-by-side {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.side-by-side i {
    margin-left: 15px;
    padding-top: 6px;
}

.contact-details h3:first-of-type {
    color: #FECE1A;
}

.contact-us-img-box {
    text-align: center;
}

.contact-us-img-box img {
    width: 100%;
    height: auto;
}

.location i {
    text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
}

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

.form-message  {
    width: 50%;
    display: block;
    margin: 0px auto;
    margin-top: 0px!important;
    margin-bottom: 20px;
    border-radius: 10px ;
    color: white;
    padding: 30px;
    text-align: center;
}
.form-message.ok {
    background-color: #00ff00;
}

.form-message.nok {
    background-color: #ff0000;
}
.section-message-form { 
    position: relative;
    padding-top: 80px; 
}

.section-message-form .triangle-box { display: none; }

.contact-form {
    width: 70%;
    margin: 0 auto;
}

input[type="text"],
input[type="email"],
input[type="number"],
textarea {
    padding: 7px;
    border-radius: 3px; 
    border: 1px solid #ccc;
}

input[type="text"],
input[type="email"],
input[type="number"],
textarea {
    width: 100%;
}

.contact-form input[type="email"],
.contact-form input[type="text"] { height: 40px;}


input[type="email"] {
    direction: ltr; 
}

textarea {
     height: 150px;
}

label {
    color: #181a1c;
    padding-right: 150px;
}


.frm {
    background-color: #181a1c;
    width: 90%;
    height: 90%;
    padding-top: 50px;
}

.field-validation-error span { 
    color: #ff0000;
    font-size: 80%;
}

.loading { text-align: center; }

/*-------------------------------------------*/
/* section About Calibration */
/*-------------------------------------------*/
.section-about-calibration p {color: #fff;}

.section-about-calibration h3 {color: #FECE1A}

.section-about-calibration {
    background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.9)), url(../../img/lab4.jpg);
    background-image: linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.9)), url(../../img/lab4.jpg);
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}


/*-------------------------------------------*/
/* _MessageRecievedPartial view */
/*-------------------------------------------*/
.message-recieved { text-align: center; }

/*-------------------------------------------*/
/* _PtherToolsPartial view */
/*-------------------------------------------*/

.section-circular-link { position: relative; }

.section-circular-link img {
    border-radius: 500px;
    width: 120px; 
    height: 120px;      
    border-width: 2px; 
    border-color: #181A1C;
    border-style: solid;     
    vertical-align: middle;
    margin-bottom: 10px;
}

.section-circular-link li {
    list-style: none; 
    text-align: center; 
}

.section-circular-link li:not(:last-child) { padding-bottom: 30px; }

.section-circular-link li p { 
    display: inline-block; 
    padding-right: 10px;
    text-align: center;
}

.calculator-h2 { margin-bottom: 60px; }

/*----------------------------------------------------------------*/
/* Error Pages: NotFound view and InternalServerError View        */
/*----------------------------------------------------------------*/

.section-404,
.section-500 {
     background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.9)), url(../../img/404-gif.gif);
    background-image: linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.9)), url(../../img/404-gif.gif);
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

.section-404 {
    background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.9)), url(../../img/404-gif.gif);
    background-image: linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.9)), url(../../img/404-gif.gif);
}

.section-500 {
    background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.9)), url(../../img/500.gif);
    background-image: linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.9)), url(../../img/500.gif);
}

.img-404 { 
    width: 100%; 
    height: auto; 
}
 
.section-404 .descript, 
.section-500 .descript { 
    color: #fff; 
    border: 2px solid #FECE1A;
    border-radius: 5px;
    padding: 20px;
    background-color: rgba(0, 0, 0, 0.7);
}

/*-------------------------------------------*/
/* Media Queries */
/*-------------------------------------------*/

/* big tablet to 1200px (widths smaller than the 1140px row)   */
@media only screen and (max-width: 1200px) {

    .row { padding: 0 2%; }

    .contact-form { width: 80%; }
    
    label { padding-right: 135px; }
}

/* Small phones from: 768 to 1023px */
@media only screen and (max-width: 1023px) {

    .contact-form input[type="email"],
    .contact-form input[type="text"] { height: 35px;}

    body { font-size: 18px;}

    section { padding: 40px 0;}
    
    .h2-underlined-dark:after,
    .h2-underlined-bright:after,
    .h2-underlined-red:after  {
        margin-top: 40px;
    }

     .map-box {
        width: 100%;
        height: auto;
        position: relative;
    }

    .map {
        width: 100%;
        height: 300px;
        z-index: 0;
        position: relative;
    }

    .contact-us-box {
       position: relative;
        height: auto;
        padding-top: 40px;
        padding-bottom: 40px;
        width: 100%;
        background-color: #181a1c;
    }
    
    .seperated-contact-us {display: block;}
    
    .inline-contact-us {display: none;}

    .btn, 
    input[type="submit"],
    input[type="button"] {
        padding: 13px 25px; 
    }

    .section-message-form .triangle-box { display: block;}
        
    .contact-form { width: 90%; }
    
    label { padding-right: 120px; }

    .section-with-triangle { padding-top: 70px; }
}

/* Small phones to small tablests from: 481 to 767 */
@media only screen and (max-width: 767px) {

    .contact-form input[type="email"],
    .contact-form input[type="text"] { height: 30px;}

    body { font-size: 16px;}
        
    section { padding: 30px 0;}
    
    .row { 
        padding: 0 4%;
        width: 100%;
    }
    
    .col { margin: 0px 0px 1% 0px}

    .contact-us-box {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .contact-us-img-box img, 
    .seperated-contact-us .location {
        width: 60%;
        min-width: 430px;
    }

        .contact-us {
        padding: 0px 0px;
    }
    
    .contact-details-box {
        padding: 15px 25px 15px 25px;

    }   
    
    .contact-details h3 {
        margin: 8px 1px;
    }
    
    .location {
        margin-top: -5px;
    }
    
    .h2-underlined-dark:after,
    .h2-underlined-bright:after,
    .h2-underlined-red:after  {
        margin-top: 40px;
        margin-bottom: 10px;
    }
    
    .h2-underlined-dark,
    .h2-underlined-bright,
    .h2-underlined-red  {
        margin-bottom: 20px;
    }
        
    .contact-form { width: 100%; }
    
    label { padding-right: 70px; }
 
    .section-descript .left-col {
        text-align: center;
    }

    .section-with-triangle { padding-top: 60px; }

}

/* Small phones from: 0 to 480px */
@media only screen and (max-width: 480px) {
    
    .contact-form input[type="email"],
    .contact-form input[type="text"] { height: 25px;}

    section,
    .section-with-triangle { padding: 25px 0;}
            
    .col {margin: 0;}
    
    body { font-size: 14px;}
    
    .triangle { display: none; }
    
    .contact-us-box {
        padding-top: 25px;
        padding-bottom: 25px;
    }

    .contact-us-img-box img, 
    .seperated-contact-us .location {
        width: 80%;
        min-width: 230px;
    }

        .contact-us h2 {
        padding: 10px 0px;
    }
    
    .contact-details-box {
        padding: 10px 15px 10px 15px;
    }   
    
    .contact-details h3 {
        margin: 7px 0px;
    }

    .location {
        margin-top: 1px;
    }
           
    form .span-1-of-3  {display: none;}
    
    form .span-2-of-3  {margin-bottom: 5px;}
    
    .submit-col {
        text-align: center;
    }
    
    .btn, 
    input[type="submit"],
    input[type="button"] {
        padding: 8px 18px; 
    }
 
    .h2-underlined-dark:after,
    .h2-underlined-bright:after,
    .h2-underlined-red:after  {
        margin-top: 30px;
        margin-bottom: -5px;
    }

    .section-circular-link li:not(:last-child) { padding-bottom: 20px; }

}