@media print {
    body{
        width: 21cm;
        height: 29.7cm;
        margin: 0 0 0 0; 
        /* change the margins as you want them to be. */
   } 
   .container{
    width: 960px;
   }
   .row{
    width:920px;
   }
}
@font-face {
    font-family: OpenSans-Regular;
    src: url(../fonts/OpenSans/OpenSans-Regular.ttf);
}
@font-face {
    font-family: OpenSans-Medium;
    src: url(../fonts/OpenSans/OpenSans-Medium.ttf);
}
@font-face {
    font-family: OpenSans-SemiBold;
    src: url(../fonts/OpenSans/OpenSans-SemiBold.ttf);
}
@font-face {
    font-family: OpenSans-Bold;
    src: url(../fonts/OpenSans/OpenSans-Bold.ttf);
}
@font-face {
    font-family: OpenSans-Light;
    src: url(../fonts/OpenSans/OpenSans-Light.ttf);
}
@page {
  header: page-header;
  footer: page-footer;
}

/**** REPEATEDLY USED CSS ****/
/* HEAD */

.green-block{
    background-color: #2db72d;
    min-width: 7px;
    margin-right: 7px;
    margin-left: -12px;
    display: inline-block;
}
.gray-block{
    display: flex;
    align-items: center;
    font-family: OpenSans-Medium;
    width: 930px;
    background-color: #efefef;
    clip-path: polygon(0 0, 100% 0%, 96% 100%, 0% 100%);
}
.head{
    background-color: #f9f9f9;
    display: flex;
    flex-flow: row;
    position: relative;
    height: 70px;
    margin-top:20px;
    margin-bottom: 40px;
    margin-right: -12px;
}
.head-title{
    font-size: 22px;
    margin-left: 15px;
}
.head-end-title{
    position: absolute;
    right: 30px;
    top: 38%;
}
.head-end-logo{
    position: absolute;
    right: 30px;
    top: 30%;
}


/* HEAD */

/* SALVAGE INFORMATION */

.salvage-head{
    font-family: OpenSans-Medium;
    height: 70px;
    color: #6d6d6d;
    font-size: 12px;
    padding-left: 15px;
    border-bottom: 1px solid #919191;
}
.salvage-body{
    font-family: OpenSans-Medium;
    height: 80px;
    font-size: 15px;
    padding-left: 15px;
}
.salvage-body:nth-child(even) {
    background-color: #f9f9f9;
}
.sal-color{
    background-color: #f9f9f9;
}



/* SALVAGE INFORMATION */

/* VEHICLE SPECIFICATIONS */

.spec-row{
    height:50px;
    border-radius: 6px 6px;
}

.spec-row:nth-child(even) {
    background-color: #efefef;
}
.spec-color{
    background-color:#efefef;
}

.spec-icon{
    text-align:center;
    font-size: 20px;
}
.vehicle-specification{

    position: relative;
}
.margin-b-minus-35{
    position: absolute;
    top: 0;
}
@media print {
    
}

/* VEHICLE SPECIFICATIONS */
/**** REPEATEDLY USED CSS ****/

body{
    font-family: OpenSans-Regular;
}

.rtl{
    direction: rtl;
}

/* FIRST ROW */

.first-row{
    height: 300px;
}
.line{
    line-height: 0.5;
}
.gray{
/*    background-color: white;*/
    display: inline-block;
}
.gray img{
    width: 250px;
    align-content: center;
}
@media print {
    .first-row{
        height: 200px;
    }
}

/* FIRST ROW */



/* BOX */

.box-row a{
    display: inline-block;
}

.icon-div{
    position: relative;
}
.error-icon{
    font-size: 35px;
    color: #b21515;
    position: absolute;
    top: 0;
    right: 22px;
}
.box{
    background-color: #f2f2f2;
    height: 230px;
    width: 18%;
    display:flex;
    justify-content:center;
    text-align:center;
    line-height: 0.5;
}

.red-border{
    border: 2px solid #b21515;
}
.box-margin:not(:first-child){
    margin-left: 2.5%;
}
.box-icon{
    font-size:75px;
    margin-top: 30px;
    margin-bottom: 20px;
    
}


/* BOX */


/* INSURANCE RECORD */

.ins-height{
    height: 100px;
}

/* INSURANCE RECORD */

/* ODOMETER ERROR */

.odometer-error{
    margin-top: 3px;
    margin-right: 5px;
    font-size: 17px;
    color: #b21515;
}

/* ODOMETER ERROR */


/* TITLE BRAND INFO */

.question-icon{
    color: #d6d6d6;
}
.check-icon{
    font-size: 17px;
    color: #43b200;
}

/* TITLE BRAND INFO */

/* RECALLS */

.margin-minus-75{
    margin-top: -75px;
}

.flex-align{
    display: flex;
    align-items: center;
}

/* RECALLS */




/*  MEDIA PRINT  */


@media print {
    .gray-block{
        width: 550px;
    }
    .head-title{
        font-size: 17px;
    }




    .box{
        background-color: #f2f2f2;
        height: 130px;
        width: 18%;
        font-size: 10px;
    }
    .box-icon{
        font-size:40px;
    }
    .error-icon{
        font-size: 18px;
        top: 16px;
        right: 18px;
    }


    .spec-row{
        font-size: 12px;
    }

    .salvage-head{
        border-bottom: 2px solid #919191;
    }  
    .float{
        display: none;
    } 
    .my-float{
    display: none;
}
}
.float{
    position:fixed;
    width:60px;
    height:60px;
    bottom:40px;
    right:40px;
    background-color: red;
    color:#FFF;
    border-radius:50px;
    text-align:center;
    box-shadow: 2px 2px 3px #999;
}

.my-float{
    margin-top:22px;
}