/* CSS Document */

@import url(navigation.css);
@import url(font-awesome/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700);
@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900);
@import url(https://fonts.googleapis.com/css?family=Lato:400,100,100italic,300,300italic,400italic,700,700italic,900,900italic);
@import url(https://fonts.googleapis.com/css?family=Bubblegum+Sans);
@import url(https://fonts.googleapis.com/css?family=Playfair+Display|Raleway);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic);


html { margin: 0; padding: 0; height:100%;}
body{ margin:0; padding:0;  line-height: 16px; font-family: Comic Sans MS; font-size: 12px; background:#fff; height:100%;}

/* style="line-height: 16px; font-family: Comic Sans MS; font-size: 13px;" */
/*	--------------------------------------------------
Global Reset & Standards
-------------------------------------------------- */

div, p, ul, ol, li, h1, h2, h3, h4, h5, h6, form, input, textarea, select, nav, img {padding:0; margin:0;}
img{border:0;}
ol, ul { list-style: none; }

*{
-webkit-transition: color .2s ease;
-moz-transition: color .2s ease;
-ms-transition: color .2s ease;
-o-transition: color .2s ease;
transition: color .2s ease;

-webkit-transition: background-color 1s;
-moz-transition: background-color 1s;
-o-transition: background-color 1s;
-ms-transition: background-color 1s;
transition: background-color 1s;
}
*:hover{
-webkit-transition: color .2s ease;
-moz-transition: color .2s ease;
-ms-transition: color .2s ease;
-o-transition: color .2s ease;
transition: color .2s ease;

-webkit-transition: background-color 1s;
-moz-transition: background-color 1s;
-o-transition: background-color 1s;
-ms-transition: background-color 1s;
transition: background-color 1s;
}

a{color:#e51e25; text-decoration:none;
-webkit-transition: background-color 1s;
-moz-transition: background-color 1s;
-o-transition: background-color 1s;
-ms-transition: background-color 1s;
transition: background-color 1s;
}
a:hover{text-decoration:underline;
-webkit-transition: background-color 1s;
-moz-transition: background-color 1s;
-o-transition: background-color 1s;
-ms-transition: background-color 1s;
transition: background-color 1s;
}

.left {float:left;}
.right {float:right;}

.aln-cntr{text-align:center; margin:0 auto 20px; display:block;}
.aln-cntr > img{max-width:100%;}
.clear {clear:both;font-size:0;line-height:0;}
.bordr-none{border:none!important;}

ul.bull{list-style-type:none; float:left; margin:0 0 15px 0; clear:both;}
ul.bull li{float:left; clear:both; background:url('../images/bull.png') no-repeat 0 2px; padding-left:25px; margin-bottom:15px; /*text-align:justify;*/}

ol{list-style-type:none; display:block; margin:0 0 15px 0;}
ol li{ display:block;  clear:both; background:url('../images/bull.png') no-repeat 0px 3px; padding-left:22px; margin-bottom:8px; text-align:justify;}

.mrgn-top0{margin-top:0!important;}

.red{color:red;}

h1, h2, h3, h4, h5, h6{line-height:100%; font-family: 'Raleway', sans-serif;}

hr{height:10px; display:block; overflow:hidden; width:100%; background:transparent; border:none; margin:0 0 50px;
-webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.07);
-moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.07);
box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.07);
}

.alt-rgt{ float:right; padding-left:25px;}




@font-face{font-family:'attack of the cucumbers';src:url('./font/attack of the cucumbers.ttf');}


/*	--------------------------------------------------
Global Reset & Standards
-------------------------------------------------- */

.wrap{width:1200px; margin:0 auto; position:relative; clear:both;}

.inner-wrap{display:block; padding:2%; clear:both; overflow:hidden;}

/*--------------For Intro--------------------------------*/

.top-header-area{ background:#fff url(../images/header-bg.jpg) repeat; width:100%; margin:0 auto; text-align:center; display:block; }
.top-header-area > div > div{ display:inline-block; margin-left:-4px; margin:0 auto; vertical-align:top; position:relative; }

.navigation-area{ float:right; padding:0 20px 0 0; position:relative; z-index:101; text-align:center; }
.navigation-area h1{ font-family: 'Playfair Display', serif; font-weight:500; padding-top:15px; font-size:48px; line-height:1.1;}
.navigation-area h1 span{ color:#ad1744}

.logo-main{margin:0; display:block; float: left}
.logo-main img{ max-width:100%;}


.welcome-area{ background:#fff; display:block; text-align:center; margin:0 auto; padding:14px 0; width:100% }
.welcome-area h2{ display:block; clear:both; font-size:34px; font-family: 'attack of the cucumbers'; color:#434343; padding-bottom:10px;  position: relative;}
.welcome-area h2 span{ font-weight:100 }
.welcome-area a{display: inline-block; clear:both; line-height:1.6; border-radius:10px; font-size:16px; padding:10px 40px; margin-top:0; font-weight:600; color:#fff; background:#dda601; }
.welcome-area a:hover{color:#fff; background:#000; }


.welcome-area-top{ background:#fff; display:block; text-align:center; margin:0 auto; padding:14px 0; width:50%; font-family:inherit}
.welcome-area-top h2{ font-size: 34px; font-family:'attack of the cucumbers';, sans-serif;color: #434343;padding-bottom: 10px;}
.welcome-area-top h2 span{ font-weight:100;}
.welcome-area-top a{display: inline-block; clear:both; line-height:1.6; border-radius:10px; font-size:16px; padding:10px 40px; margin-top:0; font-weight:600; color:#fff; background:#dda601; }
.welcome-area-top a:hover{color:#fff; background:#000; }

.welcome-area-top1{ display:block; text-align:center; margin:0 auto; padding:14px 0; width:50%; font-family:inherit}
.welcome-area-top1 h2{ font-size: 34px; font-family:'attack of the cucumbers';, sans-serif;color: #434343;padding-bottom: 10px;}
.welcome-area-top1 h2 span{ font-weight:100;}
.welcome-area-top1 a{display: inline-block; clear:both; line-height:1.6; border-radius:10px; font-size:16px; padding:10px 40px; margin-top:0; font-weight:600; color:#fff; background:#dda601; }
.welcome-area-top1 a:hover{color:#fff; background:#000; }

.banner-area{position:relative; display:block; clear:both; padding-top:0px; }
.banner-area img{float:left; width:100%;}
.banner-area:after{display:block; text-align:center; position:absolute; content:url("../images/banner-bottom-shadow.html"); bottom:-21px; width:100%; z-index:100;}




/*---------------------For Intro-------------------------*/



.header-outer{width:100%; float:left; padding:10px 0;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e6e8e8+0,feffff+100 */
background: rgb(230,232,232); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(230,232,232,1) 0%, rgba(254,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(230,232,232,1) 0%,rgba(254,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(230,232,232,1) 0%,rgba(254,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6e8e8', endColorstr='#feffff',GradientType=0 ); /* IE6-9 */
}

.logo{padding:0 10px; float:left;}
.logo img{ max-width:100%; }

.top-socil-icons-1{float: left;margin: 30px 00px 0px 450px;}

.top-socil-icons{float:right;}
.top-socil-icons li{ display:inline-block; text-align:center; margin:20px 5px 0;}
.top-socil-icons li a{display:block; overflow:hidden; width:44px; height:44px; background:#fff; text-align:center; color:#3b5998;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;}
.top-socil-icons li a i{line-height:44px; font-size:22px;}
.top-socil-icons li:nth-child(2) a{color:#ef5d36;}
.top-socil-icons li:nth-child(3) a{color:#c92328;}
.top-socil-icons li a:hover{background:#3b5998; color:#fff;}
.top-socil-icons li:nth-child(2) a:hover{background:#ef5d36;}
.top-socil-icons li:nth-child(3) a:hover{background:#c92328;}


.header-navigation{z-index:200; position:relative; text-align:left; display:block; clear:both; float:left; width:100%; padding:5px; background:#fff;  box-sizing:border-box; top:28px; margin-top:-10px;
-webkit-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.4);
-moz-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.4);
box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.4);
}

.callus-box{position:absolute; top:-15px; right:0; background:#f8ee26; display:block; padding:0 10px; font-family: 'Conv_texgyreadventor-regular'; font-size:14px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
}
.callus-box:before{position:absolute; left:-40px; border-right:20px #a9a43f solid; border-left:20px transparent solid; border-top:20px transparent solid; display:block; content:"";}
.callus-box li{display:block; float:left; border-left:1px #e3bb00 solid; border-right:1px #ffff98 solid;}
.callus-box li:first-child{border-left:none;}
.callus-box li:last-child{border-right:none;}
.callus-box li a{display:block; padding:0 10px; height:72px; text-align:center; color:#302f15;}
.callus-box li a:hover{text-decoration:none;}
.callus-box li a i{display:block; clear:both; color:#888431; font-size:20px; padding:10px 0 4px;}
.callus-box li a:hover i{color:#383615;}

/* ----------------------- Banner Area Start ----------------------- */

/*.banner-area{display:block; clear:both; position:relative; margin-bottom:30px;}
.banner-area:after{display:block; text-align:center; position:absolute; content:url("../images/banner-bottom-shadow.png"); bottom:-21px; width:100%; z-index:100;}*/

.welcome{display:table; padding:20px 0 30px;}
.welcome > div{display:table-cell; vertical-align:top;}
.welcome > div h2{display:block; margin-bottom:25px; font-size:48px; line-height:1; color:#3d3d3d;}
.welcome > div h2 span{font-size:28px; color:#e51e25; font-family: 'Conv_texgyreadventor-regular'; font-weight:normal;}
.welcome > div p{text-align:justify; font-size:12px;}
.welcome > div:last-child{padding:0 0 0 25px;}

.index-product-area{display:block; overflow:hidden; clear:both; border-top:1px #ddd solid; padding:25px 0 35px; text-align:center;}
.index-product-area > .carousel-area{display:block; overflow:hidden; padding:0 30px 35px; box-sizing:border-box;}
.index-product-area h2{font-size:30px; font-weight:normal; line-height:1.3; display:block; margin-bottom:25px; font-family:'attack of the cucumbers'; text-align:left; }

.yellow-bnt{width:120px; text-align:center; padding:8px 20px; background:#febd11; color:#fff; text-transform:uppercase; font-size:15px; font-weight:600; clear:both; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; }
.yellow-bnt:hover{text-decoration:none; background:#e51e25;}

.ind-why-us{text-align:center; color:#fff; font-size:18px; line-height:1.3; font-weight:300;}
.ind-why-us h3{font-size:48px; line-height:1.2; margin-bottom:30px; display:block;}
.ind-why-us p{display:block; margin-bottom:35px;}
ul.why-us{display:block; overflow:hidden; text-align:left;}
ul.why-us li{border-style:solid; border-width:1px 0; border-color:rgba(255,255,255,0.2); position:relative; width:23%; margin:0 1%; float:left; padding:10px 0 10px 30px; box-sizing:border-box; font-size:20px; line-height:1.5;}
ul.why-us li strong{font-weight:700; color:#f8ee26;}
ul.why-us li:before{position:absolute; left:10px; top:10px; display:block; content:"\f101"; font-family:'FontAwesome'; color:#fff;}

.why-us-area{background:#335178; color:#fff; padding:45px 2%; clear:both; border:1px #000 solid;}

.three-circle-area{padding:35px 0;}
.three-circle-area ul{text-align:center; display:table; width:100%;}
.three-circle-area ul li{display:table-cell; width:33.33%;}
.three-circle-area ul li span{width:177px; height:170px; box-sizing:border-box; padding-right:10px; margin-bottom:10px; position:relative; display:inline-block; background:transparent url('../images/green-cicle.png') no-repeat center center; vertical-align: middle; text-shadow:1px 1px 1px rgba(0,0,0,0.5); }
.three-circle-area ul li:nth-child(2) span{background-image:url('../images/yellow-circle.png');}
.three-circle-area ul li:nth-child(3) span{background-image:url('../images/blue-circle.png');}
.three-circle-area ul li:nth-child(3) span:before{content:""; position:absolute; display:block; font-size:18px; right:46px; top:-32px;}
.three-circle-area ul li p{font-size:18px; line-height:1.4;}
.three-circle-area ul li p small{font-size:14px;}

.three-circle-area ul li span img{ padding-top:28px; }

.clientele-logos{display:block; padding:40px 0 30px; background:#dfdedf; overflow:hidden; text-align:center;}
.clientele-logos img{margin:0 10px; display:inline-block;
-webkit-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3);
box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3);
}


.footer-button-area{display:block; overflow:hidden; padding:40px 0; background:#232323; clear:both}
.footer-button-area ul{display:table; width:100%;}
.footer-button-area ul li{display:table-cell; width:33.33%; box-sizing:border-box; padding:0 15px;}
.footer-button-area ul li a{border:1px rgba(255,255,255,0.2) solid; display:block; overflow:hidden; padding:5px; color:#fff; font-size:17px; font-weight:500; line-height:33px; text-transform:uppercase;}
.footer-button-area ul li a span{background:#eb1f28; display:block; float:left; margin-right:10px; padding:8px;}
.footer-button-area ul li a:hover{text-decoration:none; background:#eb1f28;}
.footer-button-area ul li a:hover span{background:#fff; color:#eb1f28;}


.footer-button-area1 table{border-collapse: collapse; width: 100%;border-bottom: 0px solid #999;} 
.footer-button-area1 td {padding: 7px 10px; border: 0px; text-align:center;}
.footer-button-area1 p{border:3px solid #000; border-radius: 25px; text-align:center;padding: 7px 10px; }


/* ------------- Footer --------------- */
.footer-area{ display:block; overflow:hidden; padding:15px 0; background:#383838; text-align:center;}
.footer-area > div div{display:block; overflow:hidden; padding:0 0 15px; margin-bottom:15px; border-bottom:1px #4e4e4e solid; position:relative;}
.footer-area > div div > img{float:left; filter: grayscale(1);}

.footer-area > div div ul{float:right;}
.footer-area > div div ul li{display:inline-block; font-size:20px; margin:35px 0 0 5px;}
.footer-area > div div ul li a{display:block; width:35px; height:35px; border:1px #306abe solid; color:#306abe;}
.footer-area > div div ul li a i{line-height:35px;}
.footer-area > div div ul li:nth-child(2) a{border:1px #ff4c1c solid; color:#ff4c1c;}
.footer-area > div div ul li:nth-child(3) a{border:1px #ff2c32 solid; color:#ff2c32;}
.footer-area > div div ul li a:hover{background:#232323;}

.footer-area > div div > a{position:absolute; text-align:center; width:120px; height:120px; background:#4e4e4e; left:50%; margin-left:-60px; bottom:-60px; font-size:30px; color:#fff;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;}
.footer-area > div div > a i{line-height:60px;}
.footer-area > div div > a:hover{background:#2a2a2a;}


.footer-area > div p{color:#bababa; line-height:2;}
.footer-area > div p i{margin:0 7px 0 15px;}
.footer-area > div p:last-child{padding:15px 0 0; font-size:13px; color:#707070;}



/* Paralex Design */

.parallax {min-height: 250px; background-position: 50% 50%; background-repeat: no-repeat; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; padding:50px 0; clear:both;}
.parallax-1 {background-image: url("../images/why-us-bg.jpg");}

.website-skeleton {background-image: url("../images/skeleton.jpg"); background-repeat:no-repeat; width:auto; height:900px;}
.website-skeleton-1 {padding-left:260px; padding-top:165px;}

/*------------------------------------------------------------------------Next page-----------------------------------------------------------------------------------------------------*/

.inner-banner{display:block; overflow:hidden; background:#000; margin-bottom:0; position:relative}
.inner-banner img{float:left; opacity:1; width:100%;}
/*.inner-banner > span{position:absolute; left:0; right:0; text-align:center; top:20%; color:#fff; font-weight:700; font-size:72px; text-transform:uppercase; z-index:100;}*/



/* --- Inner Area Start --- */
.inner-link{display:table; width:100%; padding:10% 0; color:#fff; position:absolute; top:0; z-index:100;}
.inner-link > div{display:table-cell; vertical-align:middle; width:50%;}
.inner-link > div h1{text-transform:uppercase; font-size:26px; font-weight:500; line-height:1.5; font-family:'attack of the cucumbers';}

.inner-link > div:first-child ul{display:block; clear:both; font-family:'attack of the cucumbers';}
.inner-link > div:first-child ul li{ display:inline-table; font-weight:300;}
.inner-link > div:first-child ul li a{color:#fff;}
.inner-link > div:first-child ul li:after{content:'/'; display:block; float:right; padding-left:10px; margin-right:10px;}
.inner-link > div:first-child ul li:last-child:after{display:none;}

.inner-link > div:last-child ul{float:right; width:75%;}
.inner-link > div:last-child ul li{float:left; width:50%; margin:5px 0; /*text-transform:uppercase;*/ opacity: 0.7; font-family:'attack of the cucumbers';}
.inner-link > div:last-child ul li a{padding:10px 15px; display:block; margin:0 5px; color:#fff; font-size:14px; border-radius:10px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#31499a+0,246cb9+100 */
background: rgb(49,73,154); /* Old browsers */
background: -moz-linear-gradient(-45deg,  rgba(49,73,154,1) 0%, rgba(36,108,185,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(49,73,154,1) 0%,rgba(36,108,185,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(49,73,154,1) 0%,rgba(36,108,185,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#31499a', endColorstr='#246cb9',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

/*.inner-link > div:last-child ul li a:hover{background:#256db9;}*/
.inner-link > div:last-child ul li a:hover{background:#535d5e; border-radius:10px;}

<!-- -->
.inner-link-1{display:table; width:85%;  padding-top:1%; padding-bottom:0%; color:#fff; top:0; z-index:100;}
.inner-link-1 > div{display:table-cell; vertical-align:bottom; width:auto; }
.inner-link-1 > div h1{text-transform:uppercase; font-size:32px; font-weight:500; line-height:1.5;}
.inner-link-1 > div:first-child ul{display:block; clear:both;}
.inner-link-1 > div:first-child ul li{ display:inline-table; font-weight:300;}
.inner-link-1 > div:first-child ul li a{color:#fff;}
.inner-link-1 > div:first-child ul li:last-child:after{display:none;}
.inner-link-1 > div:last-child ul{float:right; width:100%;}
.inner-link-1 > div:last-child ul li{float:left; width:12%; margin:-10px 0px 12px 0px; font-family:'attack of the cucumbers'; text-align:center;}
.inner-link-1 > div:last-child ul li a{padding:10px 10px; display:block; margin:0 1px; color:#fff; font-size:12px; border-radius:5px; background:#535d5e; }
.inner-link-1 > div:last-child ul li a:hover{background:#fab702; border-radius:5px;}
<!-- -->

<!-- -->
.inner-link-2{display:table; width:auto;  padding-top:1%; padding-bottom:0%; color:#fff; top:0; z-index:100;}
.inner-link-2 > div{display:table-cell; vertical-align:middle; width:auto; }
.inner-link-2 > div h1{text-transform:uppercase; font-size:32px; font-weight:500; line-height:1.5;}
.inner-link-2 > div:first-child ul{display:block; clear:both;}
.inner-link-2 > div:first-child ul li{ display:inline-table; font-weight:300;}
.inner-link-2 > div:first-child ul li a{color:#fff;}
.inner-link-2 > div:first-child ul li:last-child:after{display:none;}
.inner-link-2 > div:last-child ul{float:right; width:100%;}
.inner-link-2 > div:last-child ul li{float:left; width:auto; margin:-10px 0px 15px 0px; /*text-transform:uppercase;*/ opacity: 0.7; font-family:'attack of the cucumbers'; text-align:center;}
.inner-link-2 > div:last-child ul li a{padding:10px 20px; display:block; margin:0 1px; color:#fff; font-size:12px; border-radius:5px;background: rgb(1, 131, 172);}
.inner-link-2 > div:last-child ul li a:hover{background:#535d5e; border-radius:5px;}
<!-- -->

.submenu-area{ display:block; width:100%; float:left; background:#0783ac; padding:15px 0; border-bottom:2px dotted #fff;  color:#fff; clear:both}
.submenu-area > div div{ float:left;}
.submenu-area > div div:nth-child(2){ float:right; position:relative; top:-56px; margin-bottom:-56px;}

/*.submenu-area > div div h1{ font-size:28px; font-weight:500; line-height:1.5;}*/
ul.page-path {  display:block; overflow:hidden; margin-bottom:5px;}
ul.page-path li{float:left; padding:0 6px; color:#fff;}
ul.page-path li a{color:#fff;}
ul.page-path li a:hover{color:#333;}
.submenu-area > div div h1{ display:block; font-size:35px; clear:both; font-weight:300; font-family: 'Raleway', sans-serif;}

.submenu-area > div div h2{ display:block; font-size:1.5em; font-family:'attack of the cucumbers';}

ul.pro-nav li{ display:inline-table; background:#0783ac;}
ul.pro-nav li a{ display:block; color:#fff; padding:10px 20px; font-size:15px; text-transform:uppercase; position:relative; font-weight:bold;}
ul.pro-nav li a:hover{color:#fff; background:#ffb400;}
ul.pro-nav li a:hover:after{ content:""; display:block; position:absolute; bottom:-15px; left:50%; margin-left:-15px;border-left: 15px solid transparent;border-right: 15px solid transparent;border-top: 15px solid #ffb400;}


/*-------------------------------Next submenu-area End------------------------------*/

.pro-matter-area{ display:block; overflow:hidden; padding:25px 0 0; }

.pro-matter-area div{ display:block; }
.pro-matter-area img{ float:right; padding-left:30px; max-width:100%;}
.pro-matter-area  p{ display:block; padding-bottom:20px; line-height:1.8; text-align:justify;}
.pro-matter-area > div > p{ display:block; padding-bottom:20px; line-height:1.8; text-align:justify;}

.pro-matter-area > div > span{ display:block; font-size:18px; font-weight:600; color:#f26222; padding-bottom:20px; margin-top:15px; position:relative; padding-left:25px; /* text-transform:uppercase; */}
.pro-matter-area > div > span:before{position:absolute; font-size:20px; left:0; top:1px; color:#1966b2; content:'\f138'; font-family:'FontAwesome'; display:block;}

.pro-matter-area > div > h2{ font-size:25px; padding:10px 0 20px 25px; margin:25px auto 15px; display:block; line-height:1;  position:relative}
.pro-matter-area > div > h2:before{ position:absolute; display:block; font-size:20px; content:"\f046"; font-family:'FontAwesome'; left:0; top:15px; color:#f26222;}


.pro-matter-area1{ display:block; overflow:hidden; padding:25px 0; width:100%;}
.pro-matter-area1 > div{ display: inline-block; width:48%; }
.pro-matter-area1 p{ padding-bottom:16px; }
/*.pro-matter-area1 img{ max-width:100%; display:block; clear:both}*/
.pro-matter-area1 span{ display:block; font-size:18px; font-weight:600; color:#f26222; /*padding-bottom:20px;*/ margin-top:15px; position:relative; padding-left:25px; /*text-transform:uppercase;*/}
.pro-matter-area1 span:before{position:absolute; font-size:20px; left:0; top:1px; color:#1966b2; content:'\f138'; font-family:'FontAwesome'; display:block;}

.alt-cen{ text-align:center; margin:25px auto; display:block; }
.alt-cen img{ width:100%;}

.bor-outer{ border:5px solid #f6f6f6}

ul.pinting{ display:block; margin:30px auto 20px; text-align:center; clear:both; }
ul.pinting li{ display: inline-block; width:32%; margin-left:-4px; padding:10px; box-sizing:border-box;}
ul.pinting li img{ max-width:100%; float:left}



ol.link1{padding-bottom:10px; padding-top:0; margin-top:0; display:block}


.tow-box-sp{ display:block}

.tow-box-sp > div{ display: inline-block; width:50%; }
.tow-box-sp > div:last-child{ width:48%; }




/***DSP***************/

@font-face {font-family: 'attack of the cucumbers'; font-style: normal; font-weight: 100; src: local('attack of the cucumbers'), local('attack of the cucumbers'), url(font-awesome/fonts/attack-of-the-cucumbers.ttf) format('woff2'); }

.pro-matter-area2{ display:table; overflow:hidden; padding:25px 0; width:100% }
.pro-matter-area2 > div{ display: table-cell; vertical-align:top; padding:0 10px; }
.pro-matter-area2 > div:first-child{ width:25%}
.pro-matter-area2 > div:last-child{width:50%}
.pro-matter-area2 > div > img{ width:100%; }
.pro-matter-area2 ul{ display:block}
.pro-matter-area2 ul li{/*float:left; width:50%;*/ display:block; margin:5px 0; text-transform:uppercase}
.pro-matter-area2 ul li a:hover{background:#256db9;}

.flower { border: 20px solid pink; border-image-source: url(../images/flaower-border-image.png); border-image-slice: 20 22; border-image-repeat: round; }
.bull123{background: url(../images/sprade-1.jpg); width:920px; }
.page-bg{background: url(../images/contact_us-bg.jpg) no-repeat center; color:#FFF; height:925px;}


.colsleft{width:250px; float:left;}
.colsright{width:920px; float:right;}

/********************/

.pro-matter-area1{ display:table; overflow:hidden; padding:25px 0; width:100% }
.pro-matter-area1 > div{ display: table-cell; vertical-align:top; padding:0 10px; }
.pro-matter-area1 > div:first-child{ width:25%}
.pro-matter-area1 > div:last-child{width:25%}
.pro-matter-area1 > div > img{ width:100%; }
.pro-matter-area1 ul{ display:block}
.pro-matter-area1 ul li{/*float:left; width:50%;*/ display:block; margin:5px 0; text-transform:uppercase;}
.pro-matter-area1 ul li a{padding:10px 15px; display:block; /*margin:0 5px;*/ color:#fff; font-size:14px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#31499a+0,246cb9+100 */
background: rgb(49,73,154); /* Old browsers */
background: -moz-linear-gradient(-45deg,  rgba(49,73,154,1) 0%, rgba(36,108,185,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(49,73,154,1) 0%,rgba(36,108,185,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(49,73,154,1) 0%,rgba(36,108,185,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#31499a', endColorstr='#246cb9',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.pro-matter-area1 ul li a:hover{background:#256db9;}
.pro-matter-area1 > div p{ display:block; clear:both; padding-bottom:16px; text-align:justify;}
.pro-matter-area1 > div span{ display:block; font-size:18px; font-weight:600; color:#f26222; padding-bottom:20px; margin-top:15px; position:relative; padding-left:25px; /*text-transform:uppercase;*/}
.pro-matter-area1 > div span:before{position:absolute; font-size:20px; left:0; top:1px; color:#1966b2; content:'\f138'; font-family:'FontAwesome'; display:block;}
.pro-matter-area1 > div > h2{ font-size:28px; padding:10px 0 20px 0; margin:0 auto 15px; display:block; line-height:1;  position:relative}
/*.pro-matter-area1 > div h2:before{ position:absolute; display:block; font-size:20px; content:"\f046"; font-family:'FontAwesome'; left:0; top:15px; color:#f26222;}*/

.milestones{ display:table; width:100%; border-spacing:5px 8px;}
.milestones div{ display: table-row; }
.milestones div div{ display: table-cell; padding:12px; border:1px solid #ddd;}

.milestones div > div:nth-child(odd){ background:#672d93; color:#fff;   font-size:16px; padding:10px 15px;   border:none; }

.collor-gree{ background:#00a8a8!important;}
.collor-org{ background:#f1592a!important;}
.collor-org1{ background:#ee5ba2!important;}
.collor-org2{ background:#0e6da3!important;}

/* ----------------------- Colour Box Area Start ----------------------- */

ul.download-pdf{ display:block;  margin:0px auto; text-align:center;}
ul.download-pdf li{ display: inline-block; width:22%; vertical-align:top; margin:15px; background:#fff;  border:1px solid #ddd}
ul.download-pdf li img{ max-width:100%; clear:both; display:block; padding:0%;  text-align:center; margin:0;}
ul.download-pdf li strong{  display:block; padding:20px 0; background:#f6f6f6;border-top:1px solid #ddd}
ul.download-pdf li a{ color:#333; text-transform:uppercase; text-decoration:none; }
ul.download-pdf li a:hover{ color:#009ce8;  }


/* ----------------------- Colour Box Area Start ----------------------- */

ul.colour-box{ display:block; margin:0px auto;}
ul.colour-box li{ display: inline-block; /* width:31%; */  width:16%; position:relative; clear:both; margin:0px; /* background:#fdfdfd; */ vertical-align:top; min-height:280px; border:0px solid #f6f6f6; border-top:0px solid #0063c6; padding:0px; box-sizing:border-box;}
ul.colour-box li:nth-child(2){border-top:0px solid #ff9326; }
ul.colour-box li:nth-child(3){border-top:0px solid #e0d305; }
ul.colour-box li:nth-child(4){border-top:0px solid #fd2b1b; }
ul.colour-box li:nth-child(5){border-top:0px solid #b850c8; }
ul.colour-box li:nth-child(6){border-top:0px solid #b850c8; }

ul.colour-box li strong{ color:#0063c6; text-transform:uppercase; display:block; clear:both; padding:10px 10px; font-size:15px; text-align:center;}
ul.colour-box li:nth-child(2) strong{ color:#ff9326; }
ul.colour-box li:nth-child(3) strong{ color:#e0d305; }
ul.colour-box li:nth-child(4) strong{ color:#fd2b1b; }
ul.colour-box li:nth-child(5) strong{ color:#b850c8; }
ul.colour-box li:nth-child(6) strong{ color:#b850c8; }

ul.colour-box li p{ text-align:justify; padding-bottom: 25px; font-size: 12px;padding-left: 5px;padding-right: 5px; color:#FFF; }
ul.colour-box li a{ background:#333; text-decoration:none; color: #fff; display:block; clear:both; margin-bottom:10px; margin-left:15px; bottom:0; left:40%;  padding:2% 2%; border-radius:50px; vertical-align:top; }
ul.colour-box li a:hover{ background:#b850c8;}
ul.colour-box li:nth-child(2) a:hover{ background:#0063c6;}
ul.colour-box li:nth-child(3) a:hover{ background:#009900;}
ul.colour-box li:nth-child(4) a:hover{ background:#fec12b;}
ul.colour-box li:nth-child(5) a:hover{ background:#d25409;}
ul.colour-box li:nth-child(6) a:hover{ background:#fd2b1b;}


ul.colour-box12{ display:block; margin:0px;}
ul.colour-box12 li{ display: inline-block; /* width:31%; */  width:20%; position:relative; clear:both; margin:10px 5px;  /* background:#fdfdfd; */ vertical-align:top; min-height:280px; border:1px solid #ddd; border-top:1px solid #ddd; padding:0px; box-sizing:border-box; padding-bottom:50px;}
ul.colour-box12 li:nth-child(2){border-top:1px solid #ddd; }
ul.colour-box12 li:nth-child(3){border-top:1px solid #ddd; }
ul.colour-box12 li:nth-child(4){border-top:1px solid #ddd; }
ul.colour-box12 li:nth-child(5){border-top:1px solid #ddd; }

ul.colour-box12 li strong{ color:#0063c6; text-transform:uppercase; display:block; clear:both; padding:10px 0; font-size:18px; }
ul.colour-box12 li:nth-child(2) strong{ color:#ff9326; }
ul.colour-box12 li:nth-child(3) strong{ color:#e0d305; }
ul.colour-box12 li:nth-child(4) strong{ color:#fd2b1b; }
ul.colour-box12 li:nth-child(5) strong{ color:#b850c8; }

ul.colour-box12 li p{ text-align:center; padding-bottom:55px; }

ul.colour-box12 li a{ background:#333; text-decoration:none; color: #fff; display:block; clear:both; margin-bottom:10px; bottom:0; left:50%;  padding:2% 3%; position:absolute; border-radius:5px; vertical-align:bottom; -webkit-transform: translate(-50%, 0%);
-moz-transform: translate(-50%, 0%);
-ms-transform: translate(-50%, 0%);
-o-transform: translate(-50%, 0%);
transform: translate(-50%, 0%);}


.aln-left{ text-align:left;}



/*-------------------------responsive-tabs----------------------------*/

.responsive-tabs{position:relative;  margin:25px auto; text-align:center;}
.responsive-tabs > div{display:block; overflow:hidden; padding:20px 0 0;}
.responsive-tabs h3{font-size:26px; line-height:1.7; border-bottom:1px #ccc solid; color:#222; margin-bottom:20px; font-family: 'Open Sans', sans-serif; font-weight:300;}
.responsive-tabs > div > img{float:right; margin-bottom:10px;}
.responsive-tabs > a{ display: inline-table; border-radius:50px; text-align:center; background:#f6f6f6; color:#222; padding:10px 30px; margin:1% auto;}
.responsive-tabs > a:hover{ background:#fab702; }

.responsive-tabs > a.active{ background:#fab702; }
.small-area{float:left; width:65%;}

.responsive-tabs p{ line-height:1.5; padding-bottom:15px; display:block }

.responsive-tabs ol{ display:block; margin-top:20px;}
.responsive-tabs ol li{ display:block; color:#343a42; font-size:13px;}
.responsive-tabs ol li i{ margin-right:5px;  color:#808181; font-size:12px;}

.events-gallery{display:block; overflow:hidden; clear:both;}
.events-gallery li{width:28%; margin:1%; border:1px #ddd solid; padding:10px; float:left;}
.events-gallery li a{display:block; overflow:hidden; clear:both; text-align:center;}
.events-gallery li img{max-width:100%; max-height:100%; float:left;}

/*----------------------year sp ----------------------------*/

.milestones{ display:table; width:100%; border-spacing:0 8px;}
.milestones div{ display: table-row; }
.milestones div div{ display: table-cell;  border:1px solid #ddd; vertical-align:middle}
.milestones div div:first-child{ background:#15b9a9; position:relative; width:5px;}
.milestones div div:first-child:before{  position: absolute; display:block; border-top:10px solid transparent; content:''; right:-10px; top:50%; margin-top:-10px;  border-bottom:10px solid transparent; border-left:10px solid #15b9a9;}

.milestones div div span{ /* Safari */ color:#fff;  display:block; padding:20px 0; line-height:1; 
-webkit-transform: rotate(-90deg);

/* Firefox */
-moz-transform: rotate(-90deg);

/* IE */
-ms-transform: rotate(-90deg);

/* Opera */
-o-transform: rotate(-90deg);

/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}

.milestones div div:last-child{ padding-left:15px;}


.milestones div:nth-child(2) div:first-child{ background:#1282cc; }
.milestones div:nth-child(2) div:first-child:before{ border-left-color:#1282cc; }


.milestones div:nth-child(3) div:first-child{ background:#fcd033; }
.milestones div:nth-child(3) div:first-child:before{ border-left-color:#fcd033; }


.milestones div:nth-child(4) div:first-child{ background:#3b5998; }
.milestones div:nth-child(4) div:first-child:before{ border-left-color:#3b5998; }


.milestones div:nth-child(5) div:first-child{ background:#ed4400; }
.milestones div:nth-child(5) div:first-child:before{ border-left-color:#ed4400; }


.milestones div:nth-child(6) div:first-child{ background:#0fbaf2; }
.milestones div:nth-child(6) div:first-child:before{ border-left-color:#0fbaf2; }


.milestones div:nth-child(7) div:first-child{ background:#f39d00; }
.milestones div:nth-child(7) div:first-child:before{ border-left-color:#f39d00; }

.milestones div:nth-child(8) div:first-child{ background:#4480a8; }
.milestones div:nth-child(8) div:first-child:before{ border-left-color:#4480a8; }

.milestones div:nth-child(9) div:first-child{ background:#399b3d; }
.milestones div:nth-child(9) div:first-child:before{ border-left-color:#399b3d; }


.milestones div:nth-child(10) div:first-child{ background:#36c2db; }
.milestones div:nth-child(10) div:first-child:before{ border-left-color:#36c2db; }

.milestones div:nth-child(11) div:first-child{ background:#15b9a9; }
.milestones div:nth-child(11) div:first-child:before{ border-left-color:#15b9a9; }

.milestones div:nth-child(12) div:first-child{ background:#cf68d8; }
.milestones div:nth-child(12) div:first-child:before{ border-left-color:#cf68d8; }


.milestones div:nth-child(13) div:first-child{ background:#0e7ec6; }
.milestones div:nth-child(13) div:first-child:before{ border-left-color:#0e7ec6; }


.milestones div:nth-child(14) div:first-child{ background:#36c2db; }
.milestones div:nth-child(14) div:first-child:before{ border-left-color:#36c2db; }

.milestones div:nth-child(15) div:first-child{ background:#ff2832; }
.milestones div:nth-child(15) div:first-child:before{ border-left-color:#ff2832; }

.milestones div:nth-child(16) div:first-child{ background:#15b9a9; }
.milestones div:nth-child(16) div:first-child:before{ border-left-color:#15b9a9; }

.milestones div:nth-child(17) div:first-child{ background:#f19a14; }
.milestones div:nth-child(17) div:first-child:before{ border-left-color:#f19a14; }

.milestones div:nth-child(18) div:first-child{ background:#4480a8; }
.milestones div:nth-child(18) div:first-child:before{ border-left-color:#4480a8; }


.milestones div:nth-child(19) div:first-child{ background:#306abe; }
.milestones div:nth-child(19) div:first-child:before{ border-left-color:#306abe; }


.milestones div:nth-child(20) div:first-child{ background:#eb1f28; }
.milestones div:nth-child(20) div:first-child:before{ border-left-color:#eb1f28; }




ul.three-box-sp{ display:block; margin:35px auto; padding-top:35px}
ul.three-box-sp li{ display: inline-block; padding:15px; width:28%; border:1px solid #ddd; margin:16px 25px; margin-left:-4px; vertical-align:top; position:relative; min-height:200px;}
ul.three-box-sp li p{  position:relative; display:block; padding:0 0 6px 25px;}
ul.three-box-sp li p i{ position:absolute; color:#000; font-size:18px; left:0; top:0; color:#f67b02; }
ul.three-box-sp li strong{ font-size:20px; display:block; color:#000; border-bottom:1px dotted #ddd; margin-bottom:10px;}
ul.three-box-sp li span{ font-size:16px; display:block; clear:both; font-weight:600; color:#44197a; margin-bottom:6px;}



.contact-box-sp{ display:block; margin:35px auto; padding-top:35px  display: inline-block; padding:15px; width:28%; border:1px solid #ddd; margin:16px 25px; margin-left:-4px; vertical-align:top; position:relative; min-height:200px;}

.contact-box-sp { display: inline-block; padding:15px; width:28%; border:1px solid #ddd; margin:16px 25px; margin-left:-4px; vertical-align:top; position:relative; min-height:200px;}
.contact-box-sp p{  position:relative; display:block; padding:0 0 6px 25px;}
.contact-box-sp li p i{ position:absolute; color:#000; font-size:18px; left:0; top:0; color:#f67b02; }
.contact-box-sp strong{ font-size:20px; display:block; color:#000; border-bottom:1px dotted #ddd; margin-bottom:10px;}
.contact-box-sp span{ font-size:16px; display:block; clear:both; font-weight:600; color:#44197a; margin-bottom:6px;}

.pro-matter-area123{ display:block; overflow:hidden; padding:25px 0; width:100%;}
.pro-matter-area123 > div{ display: inline-block; width:50%; }

.events-gallery{display:block; overflow:hidden; clear:both; padding:15px 0 35px;}
.events-gallery li{display:inline-block; padding:10px; background:#fff; margin:10px; border:1px #eee solid;}
.events-gallery li img{float:left; width:340px; height:300px;}

.dot1{ font-size:25px;padding: 0px; vertical-align:middle; text-align:left; padding-left:15px;}
.dot2{ content:"\2022"; font-size:25px;padding: 0px; vertical-align:middle; text-align:left; padding-left:5px;}

aside { display: block; position: relative; margin: 0px 0;	height:130px;}    
aside h3 { font-weight:400l letter-spacing: 2px; color: #fff; padding:0px; margin: 0px; line-height: 0px; font-family: Comic Sans MS;font-size: 13px;}
.csstransforms aside { border-left: 0px solid #0783ac; padding-left: 0px; }
.csstransforms aside h3 { position: absolute; top: 0; left: 0;background: none; -webkit-transform-origin: 0 0; -moz-transform-origin: 0 0; -ms-transform-origin: 0 0; -o-transform-origin:0 0; transform: rotate(90deg); -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); -o-transform: rotate(90deg); }

aside1 { display: block; position: relative; margin: 0px 0;	height:50px;}    
aside1 h3 { font-weight:400l letter-spacing: 2px; color: #fff; padding:0px; margin: 0px; line-height: 0px; font-family: Comic Sans MS;font-size: 13px;}

.csstransforms aside1 { border-left: 5px solid #0783ac; padding-left: 0px; }
.csstransforms aside1 h3 { position: absolute; top: 0; left: 0;background: none; -webkit-transform-origin: 0 0; -moz-transform-origin: 0 0; -ms-transform-origin: 0 0; -o-transform-origin:0 0;               -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg);}

#myBtn {display: none; position: fixed; bottom: 20px; right: 30px; z-index: 99; border: none;   outline: none;   background-color: #0783ac;color: #FFF;cursor: pointer;   padding: 15px;   border-radius: 10px; }
#myBtn:hover { background-color: #555;}

#myBtnback {display: none; position: fixed; bottom: 20px; left: 30px; z-index: 99; border: none;   outline: none;   background-color: #FF0000;color: #FFF;cursor: pointer;   padding: 15px;   border-radius: 10px; }
#myBtnback:hover { background-color: #555;}


/*-------------------------------Next area End------------------------------*/

.contact-details{display:table; width:100%;}
.contact-details > div{display:table-cell; width:33.33%; font-size:15px; box-sizing:border-box; padding:0 25px 10px; border-left:2px #ddd dotted; vertical-align:top;}
.contact-details > div h2{font-size:16px; margin-bottom:5px; padding-bottom:0; color:#30324f; text-transform:uppercase;}
.contact-details > div ul{display:block; margin-bottom:20px;}
.contact-details > div ul li{display:block; margin-bottom:10px;}
.contact-details > div ul li i{float:left; font-size:16px; padding-right:12px; width:15px; position:relative; top:2px; text-align:center; color:#e51e25;}
.contact-details > div ul li:nth-child(3) i{font-size:24px; top:-2px;}
.contact-details > div p{line-height:1.6;}

.contact-details > div form{display:block; padding:10px 0;}
.contact-details > div form label{display:block; overflow:hidden; margin:0 0 11px;}
.contact-details > div form label input, .contact-details > div form label textarea{display:block; width:100%; padding:10px; box-sizing:border-box; font-family: Comic Sans MS; font-size:13px; border:none; background:#e8e8f4;}
.contact-details > div form label input[type="button"]{width:auto; float:left; padding:8px 20px; cursor:pointer; background:#282d7d; color:#fff; text-transform:uppercase; font-weight:600;}


/*.clientele-txt{display:block; overflow:hidden; text-align:center; margin-bottom:15px;}
.clientele-txt h2{margin-bottom:0;}
.clientele-txt h2 span{font-size:40px; color:#ff8d12;}
.clientele-logos-area{display:block; overflow:hidden; padding:20px 0 10px;}
.clientele-logos-area li{width:14.28%; text-align:center; float:left; padding:10px 0;}
.clientele-logos-area li img{
-webkit-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3);
box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.3);
}*/


/*---------------Table-------------------*/


.table-bg-area{ display:block; overflow:hidden; background:#fafafa url(../images/table-bg.html) no-repeat top center; border-top:8px solid #f26323; padding:60px 0 30px; text-align:center;}

.table-area{ display:block; overflow:hidden; padding:20px; text-align:left;}
.table-area p{ display: block; padding:10px 0 25px;}

.table-area > div{ display:block; overflow:hidden; margin:0px 0 40px;}
.table-area > div h4{ display:block; font-size:18px; padding-bottom:20px; color:#4D4D4D}
.table-area > div img{ float:right; margin-left:15px;}
.table-area > div div{ display:block; overflow:hidden;}

.table-area > div:last-child{ margin:0px 0 0px;}

table {border-collapse: collapse; width: 100%;border-bottom: 1px solid #999;}
th {background-color: #0783ac; text-align:left; border-right: 1px solid #FFF;color: white;padding: 7px 10px;}
td {padding: 8px; border-bottom: 1px solid #ddd; border-right: 1px solid #cccccc;}
td.highlight{background:#eee;}

<!-- table fixed start --> 
.data-table, .data-table td, .data-table th {border-color: black; border-style: solid;}
.data-table {border-width: 0 0 0px 0px; border-spacing: 0; border-collapse: collapse; margin: 0;}
.data-table td, .data-table th {margin: 0px; padding: 6px; border-width: 1px; vertical-align: top;}
.data-table th {background-color: #0783ac;border-right: 1px solid #cccccc;} 
<!-- table fixed end --> 

#left-colum{width:250px; float:left;}
.right-colum{width:920px; float:right;}

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


@media (max-width: 1400px){
.header-wrap{ width:100%; }
}

@media (max-width: 1300px){
.wrap{ width:98%;}
.header-wrap{ width:98%; }
.navigation-area h1{ font-size:40px; }
}

@media all and (max-width: 1140px) {
.wrap{width:98%; margin:0 auto;}
.inner-content-area, .inner-content-area-full{top:-180px; margin-bottom:-180px;}
.mission-area > div:last-child{background:#f3f3f3; width:35%;}
.header-wrap{ width:98%; }
.navigation-area{ float:none; display:block!important;  text-align:center; clear:both; margin:0 auto;}
.logo-main{  margin:0 auto; text-align: center;  clear:both }
.logo-main img{ max-width:100%;}
.top-header-area > div > div{ display:block; margin-left:0; vertical-align:top; padding:12px 0 0;  display:block; clear:both;  text-align:center;}
.top-header-area > div > div:first-child{ display:block; float:none; text-align:center; clear:both; width:auto;}
.top-header-area > div > div:last-child{ display:block; text-align:center;}
}

@media all and (max-width: 1024px){
.wrap{width:98%; margin:0 auto;}
.inner-content-area, .inner-content-area-full{top:-180px; margin-bottom:-180px;}
.inner-link > div h1{text-transform:uppercase; font-size:14px; font-weight:500; line-height:1.5;}
.inner-link-1{top:-250px;}
.inner-link-1 > div{display:block; vertical-align:middle; width:100%; clear:both;}
.inner-link > div:first-child{width:100%; float:none; display:block; clear:both; margin-top:5px;}
.inner-link-1 > div:last-child ul{float:none; display:block; width:100%; margin:0 auto; text-align:center; clear:both}
.inner-link-1 > div:last-child ul li{float:left; margin:5px 0; width:25%;}
.inner-link-2{top:-250px;}
.inner-link-2 > div{display:block; vertical-align:middle; width:100%; clear:both;}
.inner-link > div:first-child{width:100%; float:none; display:block; clear:both; margin-top:5px;}
.inner-link-2 > div:last-child ul{float:none; display:block; width:100%; margin:0 auto; text-align:center; clear:both}
.inner-link-2 > div:last-child ul li{float:left; margin:5px 0; width:25%;}


}


@media all and (max-width: 1030px){
.inner-link > div h1{text-transform:uppercase; font-size:14px; font-weight:500; line-height:1.5;}

.inner-link-1{top:-250px;}
.inner-link-1 > div{display:block; vertical-align:middle; width:100%; clear:both;}
.inner-link > div:first-child{width:100%; float:none; display:block; clear:both; margin-top:5px;}
.inner-link-1 > div:last-child ul{float:none; display:block; width:100%; margin:0 auto; text-align:center; clear:both}
.inner-link-1 > div:last-child ul li{float:left; margin:5px 0; width:25%;}

.inner-link-2{top:-250px;}
.inner-link-2 > div{display:block; vertical-align:middle; width:100%; clear:both;}
.inner-link > div:first-child{width:100%; float:none; display:block; clear:both; margin-top:5px;}
.inner-link-2 > div:last-child ul{float:none; display:block; width:100%; margin:0 auto; text-align:center; clear:both}
.inner-link-2 > div:last-child ul li{float:left; margin:5px 0; width:25%;}


}

@media all and (max-width: 810px){

.navigation-area h1{  font-size:38px; }

.footer-button-area ul li a span{display:none;}
.banner-area:after{display:none;}

.inner-content-area, .inner-content-area-full{width:100%; clear:both; top:0; margin-bottom:0;}
.inner-content-area > div{display:block; width:100%!important; clear:both;}
.inner-content-area > div:first-child{display:none;}

.inner-link > div h1{text-transform:uppercase; font-size:24px; font-weight:500; line-height:1.5;}
.inner-link-1 > div:last-child ul{ margin:10px auto;}
.inner-link-1 > div:first-child{width:100%; float:none; clear:both; margin-top:25px;}
.inner-link-1 > div:last-child ul li{float:left; margin:0px 0; width:25%;}
.inner-link-1 > div:last-child ul li a{padding:5px; display:block; margin:0 2px; color:#fff; font-size:14px;}

.inner-link-2 > div:last-child ul{ margin:10px auto;}
.inner-link-2 > div:first-child{width:100%; float:none; clear:both; margin-top:25px;}
.inner-link-2 > div:last-child ul li{float:left; margin:0px 0; width:25%;}
.inner-link-2 > div:last-child ul li a{padding:5px; display:block; margin:0 2px; color:#fff; font-size:14px;}

.mission-area > div{display:block;}
.mission-area > div:nth-child(2){text-align:left; padding-top:0;}
.mission-area > div:last-child{width:100%;}

.important-txt{background:none;}

.contact-details > div{display:block; width:100%; padding:0 0 10px; margin-bottom:15px; border:none; border-bottom:2px #ddd dotted;}

.footer-area > div div > img{ margin-bottom:20px; max-width:100%;}
.footer-area > div div > a{width:100px; height:100px; bottom:-50px;}

.submenu-area > div div:last-child{ top:0; margin-bottom:0; float:left;}
.submenu-area > div div h1{font-size:30px; }

.website-skeleton {background-image: url("../images/skeleton.jpg"); background-repeat:no-repeat; width:auto; height:700px;}
.website-skeleton-1 {padding-left:300px; padding-top:250px;}

}



@media all and (max-width: 650px){
.welcome-area{ padding:35px 0; }
.welcome > div{display:block; width:100%;}
.welcome > div:last-child{text-align:center; padding:20px 0 0;}

.header-navigation{top:10px; margin-top:10px;}
.logo img{ max-width:100%;}

.inner-link > div h1{text-transform:uppercase; font-size:12px; font-weight:500; line-height:1.5;}
.inner-link-1{display:block; width:100%; padding:0; position: relative; left:0; top:0; clear:both;}
.inner-link-1 > div{display:block; clear:both; width:auto;}
.inner-link-1 > div:first-child{width:auto; padding-bottom:20px;}

.inner-link-2{display:block; width:100%; padding:0; position: relative; left:0; top:0; clear:both;}
.inner-link-2 > div{display:block; clear:both; width:auto;}
.inner-link-2 > div:first-child{width:auto; padding-bottom:20px;}

ul.why-us ul li{width:48%;}

.footer-button-area ul li{display:block; width:100%; margin:0 0 5px;}
.footer-button-area ul li a span{display:block;}

.mid-product-img-box img{width:100%;}

.footer-area > div div > a{display:none;}
.footer-area > div div > img{ margin-bottom:0; max-width:100%;}

.submenu-area > div div:last-child{top:0; margin-bottom:0; float:left;}

.pro-matter-area1{ display:block;}
.pro-matter-area1 > div{ display:block; vertical-align:top; padding:10px;}
.pro-matter-area1 > div:first-child{ width:auto; display:block; clear:both}
.pro-matter-area1 > div:last-child{ width:auto; display:block; clear:both}
.submenu-area > div div h1{font-size:25px; }

.website-skeleton { display:none;}
.website-skeleton-1 {padding-left:10px; padding-top:10px;}
}



@media all and (max-width: 500px){
.header-outer{ float:none; display:block; text-align:center; margin:0 auto;}
.logo{ float:none; display:block; clear:both; }

.inner-link > div h1{text-transform:uppercase; font-size:12px; font-weight:500; line-height:1.5;}
.inner-link-1 > div:last-child ul li{width:100%; margin:0 0 10px;}
.inner-link-2 > div:last-child ul li{width:100%; margin:0 0 10px;}

.navigation-area h1{  font-size:22px; padding-bottom:15px; padding-top:5px; }
.welcome-area h2{  font-size:20px; }

.three-circle-area ul li{display:block; width:100%; padding-bottom:15px; margin-bottom:15px; border-bottom:1px #ddd dotted;}
.three-circle-area ul li:last-child{border-bottom:0;}

.callus-box{ display:none}
.top-socil-icons{float:none; display:block; margin:0 auto; text-align:center; clear:both; }
.footer-area > div div ul{float:none; display:block; clear:both}

.website-skeleton { display: block; background-image:none;}
.website-skeleton-1 {padding-left:10px; padding-top:10px;}

}



@media all and (max-width: 370px){
ul.why-us li{width:98%;}

.inner-banner > span{top:20%; font-size:60px;}
.short-txt-area img{width:100%;}

.website-skeleton { display: block; background-image:none;}
.website-skeleton-1 {padding-left:10px; padding-top:10px;}

 
}


/* -------------- Chrome Only ------------------ */
@media screen and (-webkit-min-device-pixel-ratio:0) {
}