﻿
/*-------------- why osiz page ---------------*/
.whybottom_box {
    padding: 30px 10px;
    background-color: #ddd;
    text-align: center;
    position: relative;  
    z-index: 0;  
    margin: 15px 0;
    min-height: 400px;
}
.whybottom_box:after {
    position: absolute;
    width: 0%;
    height: 0%;
    top:0;
    left: 0;
    content: "";
    z-index: -1;
    background-color: rgba(0,0,0,0.05);   
}
.whybottom_box:before {
    position: absolute;
    width: 0%;
    height: 0%;
    bottom:0;
    right: 0;
    content: "";
    z-index: -1;
    background-color: rgba(0,0,0,0.05);    
}
.whybottom_box:hover:after, .whybottom_box:hover:before {
    width: 100%;
    height: 100%;  
}
.whybottom_box1 {
    background-color:#3bbeb0;
}
.whybottom_box2 {
    background-color:#3bb1d9;
}
.whybottom_box3 {
    background-color:#4b8cdc;
}
.whybottom_box4 {
    background-color:#7277d5;
}
.whybottom_box5 {
    background-color:#3bb85d;
}
.whybottom_box6 {
    background-color:#7cc543;
}
.whybottom_box7 {
    background-color:#b7cb4a;
}
.whybottom_box8 {
    background-color:#e8bb60;
}
.whybottom_box9 {
    background-color:#d9434e;
}
.whybottom_box10 {
    background-color:#da4d43;
}
.whybottom_box11 {
    background-color:#e7663f;
}
.whybottom_box12 {
    background-color:#f89433;
}
.whybottom_box h3 {
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    line-height: 18px;
    margin: 0;
    text-transform: uppercase;
}
.whybottom_box p {
    font-size: 14px;
    line-height: 25px;
    color: #fff;
    margin: 0;
}
.whybottom_box .inr_img {
    width: 83px;
    height: 83px;
    line-height: 80px;
    margin:20px auto;
    background-color: #fff;
    text-align: center;
    display: block;
    position: relative;
    z-index: 0;
    border-radius: 100%;
    -o-border-radius: 100%;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    -ms-border-radius: 100%;
}
.whybottom_box .inr_img:after {
    width: 100%;
    height: 100%;
    position: absolute;
    top:0;
    left: 0;
    content: "";
    box-shadow:0 0 0 10px rgba(0,0,0,0.1);
    z-index: -1;
    transform: scale(1.2);
    -o-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    border-radius: 100%;
    -o-border-radius: 100%;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    -ms-border-radius: 100%;
    opacity: 0;
    -o-opacity: 0;
    -webkit-opacity: 0;
    -moz-opacity: 0;
    -ms-opacity: 0;
}
.whybottom_box:hover .inr_img:after {
    transform: scale(1);
    -o-transform: scale(1);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    opacity: 1;
    -o-opacity: 1;
    -webkit-opacity: 1;
    -moz-opacity: 1;
    -ms-opacity: 1;
}
.whybottom_box .inr_img .img_box {
    background-image: url("../oimages/why_osiz_icons.png");
    background-position: 0 -2px;
}
.whybottom_box:hover .inr_img .img_box {
    transform: rotate(360deg);
}
.whybottom_box1 .inr_img .img_box {
    background-position: 0 -2px;
    height: 42px;
    width: 39px;
}
.whybottom_box2 .inr_img .img_box {
    background-position: -52px -8px;
    height: 36px;
    width: 39px;
}
.whybottom_box3 .inr_img .img_box {
    background-position: -102px -4px;
    height: 43px;
    width: 39px;
}
.whybottom_box4 .inr_img .img_box {
    background-position: -151px -4px;
    height: 42px;
    width: 39px;
}
.whybottom_box5 .inr_img .img_box {
    background-position: -192px -1px;
    height: 42px;
    width: 45px;
}
.whybottom_box6 .inr_img .img_box {
    background-position: -248px -6px;
    height: 30px;
    width: 46px;
}
.whybottom_box7 .inr_img .img_box {
    background-position: -309px -6px;
    height: 36px;
    width: 36px;
}
.whybottom_box8 .inr_img .img_box {
    background-position: -367px -6px;
    height: 42px;
    width: 38px;
}
.whybottom_box9 .inr_img .img_box {
    background-position: 190px -3px;
    height: 40px;
    width: 41px;
}
.whybottom_box10 .inr_img .img_box {
    background-position: 137px -2px;
    height: 42px;
    width: 41px;
}
.whybottom_box11 .inr_img .img_box {
    background-position: 90px -2px;
    height: 42px;
    width: 40px;
}
.whybottom_box12 .inr_img .img_box {
    background-position: 40px -2px;
    height: 42px;
    width: 40px;
}
.hgt_400 {
     height: 400px !important;
}