.animat-col-title{
    text-align:center
}
.animat-col-title:before{
    content:"";
    width:14px;
    display:block;
    border-bottom:1px solid #383838;
    margin:0 auto 30px
}
.animat-col-title:after{
    content:"";
    width:64px;
    display:block;
    border-bottom:1px solid #20a3f0;
    margin:30px auto 50px;
    text-align:center
}
.animat-col-title h3{
    font-size:30px;
    color:#333333;
    margin:0 0 10px
}
.animat-col01{
    margin:0;
    padding:0;
    overflow:hidden;
    list-style:none;
    text-align:center
}
.animat-col01 li{
    width:25%;
    float:right;
    margin:0;
    height:415px;
    line-height:415px;
    border-top:1px solid #dddddd;
    border-bottom:1px solid #dddddd
}
.animat-col01 li .box{
    padding:0 30px;
    display:inline-block;
    line-height:1.6;
    vertical-align:middle;
    color:#353535
}
.animat-col01 .box .animat01_icon{
    padding-bottom:25px;
    display:inline-block
}
.animat-col01 .box h3{
    color:#353535;
    font-size:25px;
    margin-bottom:20px;
    text-transform:uppercase
}
.animat-col01 .box .btn{
    padding:8px 14px 7px;
    border:1px solid #353535;
    font-size:13px;
    border-radius:0;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    margin-top:50px;
    color:#353535;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.animat-col01 .box .btn:hover{
    background:#353535;
    color:#fff
}
.animat-col01 li.color-01 .box .btn:hover{
    background:#fff
}
.animat-col01 li.color-02 .box .btn:hover{
    background:#fff;
    color:#353535
}
.animat-col01 .box .cont{
    height:0;
    visibility:hidden;
    opacity:0;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.animat-col01 li:hover .box .cont{
    height:140px;
    visibility:visible;
    opacity:1
}
.animat-col01 li.color-01{
    background-color:#20a3f0;
    border:none
}
.animat-col01 li.color-02{
    background-color:#353535;
    border:none
}
.animat-col01 li.color-01 .box,.animat-col01 li.color-02 .box,.animat-col01 li.color-01 .box .fa,.animat-col01 li.color-02 .box .fa,.animat-col01 li.color-01 .box h3,.animat-col01 li.color-02 .box h3{
    color:#FFF
}
.animat-col01 li.color-01 .box .btn,.animat-col01 li.color-02 .box .btn{
    border-color:#FFF;
    color:#FFF
}
@media only screen and (min-width:768px) and (max-width:991px){ 
    .animat-col01 li{
        width:50%
    }
}
@media only screen and (max-width:767px){   
    .animat-col01 li{
        width:100%
    }
}
.animat-col02{
    margin:0;
    padding:0;
    list-style:none
}
.animat-col02 li{
    margin:0;
    padding:130px 0 130px;
    width:20%;
    float:right;
    text-align:center;
    color:#FFF;
    transition:background-color ease-in 200ms;
    -moz-transition:background-color ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:background-color ease-in 200ms;
/* Safari and Chrome */
    -o-transition:background-color ease-in 200ms;
/* Opera */
    -ms-transition:background-color ease-in 200ms;
/* IE9? */
    
}
.animat-col02 li h3{
    color:#FFF;
    margin:0;
    text-transform:uppercase;
    font-size:18px;
    line-height:1.5
}
.animat-col02 li h3 span{
    color:#FFF;
    font-size:13px;
    display:block;
    text-transform:lowercase
}
.animat-col02 .box .animat02_icon{
    display:inline-block;
    padding-bottom:15px
}
.animat-col02 li .dg-btn-1{
    margin-top:40px;
    border:1px solid transparent;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.animat-col02 li.color-01{
    background-color:#f9cf79
}
.animat-col02 li.color-02{
    background-color:#ef8494
}
.animat-col02 li.color-03{
    background-color:#20a3f0
}
.animat-col02 li.color-04{
    background-color:#8d6cc3
}
.animat-col02 li.color-05{
    background-color:#1bbc9b
}
.animat-col02 li:hover{
    background-color:#4e4e4e
}
.animat-col02 li:hover .dg-btn-1{
    background-color:transparent;
    color:#FFF;
    border:1px solid #fff
}
@media only screen and (max-width:767px){   
    .animat-col02 li{
        width:100%
    }
}
.animat-col03{
    margin:0;
    padding:0;
    overflow:hidden;
    list-style:none;
    text-align:center
}
.animat-col03 li{
    width:33.33333%;
    float:right;
    margin:0;
    height:615px;
    line-height:615px
}
.animat-col03 li .box{
    padding:0 30px;
    display:inline-block;
    line-height:1.6;
    vertical-align:middle;
    color:#FFFFFF
}
.animat-col03 .box .animat03_icon{
    display:inline-block;
    padding-bottom:35px
}
.animat-col03 .box h3{
    color:#FFFFFF;
    line-height:1.2;
    font-weight:bold;
    font-size:20px;
    margin-bottom:20px;
    text-transform:uppercase
}
.animat-col03 .box h3:after{
    content:"";
    width:50px;
    display:block;
    border-bottom:2px solid #FFF;
    margin:8px auto 45px
}
.animat-col03 .box .btn{
    padding:0;
    border-radius:0;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    margin-top:10px;
    color:#FFFFFF;
    font-weight:bold;
    font-size:13px;
    text-transform:uppercase
}
.animat-col03 .box .cont{
    height:0;
    visibility:hidden;
    opacity:0;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.animat-col03 li:hover .box .cont{
    height:140px;
    visibility:visible;
    opacity:1
}
.animat-col03 li.color-01{
    background-color:#0b72c2
}
.animat-col03 li.color-02{
    background-color:#20a3f0
}
.animat-col03 li.color-03{
    background-color:#39bff7
}
@media only screen and (max-width:767px){   
    .animat-col03 li{
        width:100%
    }
}
.animat-col04{
    height:418px;
    line-height:418px;
    background:no-repeat center center;
    background-size:cover;
    text-align:center;
    color:#20a3f0;
    position:relative;
    margin: 0 0 25px 0;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.animat-col04:before{
    content:"";
    border:1px solid #919b9c;
    position:absolute;
    top:30px;
    right:30px;
    left:30px;
    bottom:30px;
    opacity:0;
    visibility:hidden;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.animat-col04.bg-left{
    background-image:url(../images/animat-col03-01.jpg)
}
.animat-col04.bg-right{
    background-image:url(../images/animat-col03-02.jpg)
}
.animat-col04 .box{
    line-height:1.8;
    display:inline-block;
    vertical-align:middle
}
.animat-col04 .fa{
    font-size:45px;
    margin-bottom:40px
}
.animat-col04 h3{
    font-size:15px;
    color:inherit;
    margin-bottom:25px;
    text-transform:uppercase;
    font-weight:bold
}
.animat-col04 h3:before{
    content:"";
    border-top:3px solid #20a3f0;
    width:40px;
    display:block;
    margin:auto;
    font-size:15px;
    color:#20a3f0;
    margin-bottom:10px;
    transition:border-color ease-in 200ms;
    -moz-transition:border-color ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:border-color ease-in 200ms;
/* Safari and Chrome */
    -o-transition:border-color ease-in 200ms;
/* Opera */
    -ms-transition:border-color ease-in 200ms;
/* IE9? */
    
}
.animat-col04 .dg-btn-1{
    padding:0 14px !important;
    position:relative;
    height:0;
    line-height:35px;
    border:1px solid #fff !important;
    text-transform:uppercase;
    font-weight:bold;
    visibility:hidden;
    opacity:0;
    z-index:2;
    overflow:hidden;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.animat-col04 .dg-btn-1:before{
    content:"";
    top:0;
    right:0;
    position:absolute;
    background-color:#FFF;
    z-index:-1
}
.animat-col04 .dg-btn-1:hover:before{
    background:transparent !important
}
.animat-col04 .dg-btn-1:hover{
    background:transparent !important;
    color:#fff !important
}
.animat-col04:hover:before{
    opacity:1;
    visibility:visible
}
.animat-col04:hover .dg-btn-1{
    height:34px;
    opacity:1;
    visibility:visible
}
.animat-col04:hover{
    color:#FFF
}
.animat-col04:hover h3:before{
    border-color:#FFF
}
.animat-col05{
    margin:0;
    padding:0;
    list-style:none;
    overflow:hidden
}
.animat-col05 li{
    margin:0;
    padding:0;
    list-style:none;
    float:right;
    width:16.6666666%;
    text-align:center;
    height:420px;
    line-height:420px;
    border-right:1px solid #dddddd;
    border-top:1px solid #dddddd;
    border-bottom:1px solid #dddddd;
    color:#20a3f0;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.animat-col05 li:first-child{
    border-right:none
}
.animat-col05 li .box{
    line-height:1.8px;
    display:inline-block;
    position:relative;
    width:100%
}
.animat-col05 li .fa{
    font-size:35px;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    opacity:1
}
.animat-col05 li .fa.fa-mobile-phone{
    font-size:48px
}
.animat-col05 li h3{
    font-size:15px;
    text-transform:uppercase;
    font-weight:bold;
    visibility:hidden;
    opacity:0;
    color:#fff;
    position:absolute;
    right:0;
    top:5px;
    width:100%;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.animat-col05 li:hover{
    background-color:#20a3f0;
    color:#FFF
}
.animat-col05 li:hover .fa{
    visibility:hidden;
    opacity:0
}
.animat-col05 li:hover h3{
    visibility:visible;
    opacity:1;
    color:#FFF
}
@media only screen and (max-width:767px){   
    .animat-col05 li{
        width:100%
    }
}
.animat-col06{
    height:252px;
    line-height:252px;
    background-color:#20a3f0;
    margin-bottom:25px;
    text-align:center;
    padding:0 20px
}
.animat-col06 .box{
    line-height:1.8;
    display:inline-block;
    vertical-align:middle;
    color:#FFF
}
.animat-col06 .fa{
    font-size:50px;
    width:60px;
    height:60px;
    line-height:60px;
    margin-bottom:10px;
    overflow:hidden;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.animat-col06 h3{
    font-size:15px;
    color:#FFF;
    line-height:1.2;
    font-weight:bold;
    text-transform:uppercase
}
.animat-col06 .btn{
    color:#FFF;
    font-size:13px;
    text-transform:uppercase
}
.animat-col06 .cont{
    height:0;
    overflow:hidden;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.animat-col06:hover .fa{
    height:0
}
.animat-col06:hover .cont{
    height:110px
}
.Animatedcolumns-title01{
    text-align:center;
    margin-bottom:30px
}
.Animatedcolumns-title01 h2{
    font-size:20px;
    color:#333333;
    font-weight:normal;
    line-height:1.2;
    display:inline-block;
    position:relative;
    padding: 0 0 20px 0;
    position:relative;
    margin: 0 0 15px 0
}
.Animatedcolumns-title01 h2:before{
    content:'';
    display:block;
    position:absolute;
    right:50%;
    bottom:0;
    margin-right:-20px;
    width:40px;
    background-color:#20a3f0;
    height:2px
}
@media only screen and (min-width:1600px){  
    .Animatedcolumns-title01 p{
        padding:0 400px
    }
    .animat-col03 li .box .cont{
        padding:0 110px
    }
}
@media only screen and (min-width:1200px) and (max-width:1599px){   
    .Animatedcolumns-title01 p{
        padding:0 250px
    }
    .animat-col03 li .box .cont{
        padding:0 60px
    }
}
@media only screen and (min-width:992px) and (max-width:1199px){    
    .Animatedcolumns-title01 p{
        padding:0 150px
    }
    .animat-col06:hover .cont{
        height:130px
    }
}
@media only screen and (min-width:768px) and (max-width:991px){ 
    .Animatedcolumns-title01 p{
        padding:0 40px
    }
    .animat-col05 li{
        width:33.333333%
    }
}