MAINHACK

Viewing / Editing File: style_o.css

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,nav ul,nav li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
ol,ul{list-style:none;margin:0px;padding:0px;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
table{border-collapse:collapse;border-spacing:0;}
/* start editing from here */
a{text-decoration: none !important; outline: none !important; }
.txt-rt{text-align:right;}/* text align right */
.txt-lt{text-align:left;}/* text align left */
.txt-center{text-align:center;}/* text align center */
.float-rt{float:right;}/* float right */
.float-lt{float:left;}/* float left */
.clear{clear:both;}/* clear float */
.pos-relative{position:relative;}/* Position Relative */
.pos-absolute{position:absolute;}/* Position Absolute */
.vertical-base{ vertical-align:baseline;}/* vertical align baseline */
.vertical-top{  vertical-align:top;}/* vertical align top */
.underline{ padding-bottom:5px; border-bottom: 1px solid #eee; margin:0 0 20px 0;}/* Add 5px bottom padding and a underline */
nav.vertical ul li{ display:block;}/* vertical menu */
nav.horizontal ul li{   display: inline-block;}/* horizontal menu */
img{max-width:100%;}
/*end reset*/

@font-face{
font-family: "Abel-Regular";
src:url(../fonts/Abel-Regular.ttf);
}

@font-face{
font-family: "BlackOpsOne-Regular";
src:url(../fonts/BlackOpsOne-Regular.ttf);
}

body{ width:100%; font-family: "Abel-Regular"; background: #eef3fa; }
.container{ width: 450px; margin: 0px auto;  padding: 0; }

.modal-dialog { width: 300px !important; margin: 30px auto; }
.social-share ul{ position: relative; width: 100%; padding: 0; margin: 0; text-align: center; }
.social-share ul li{ position: relative; padding: 0; margin:0 0px; display: inline-block; text-align: center; }
.social-share ul li a{ padding: 8px 10px; margin: 0 4px; background: #540910; text-decoration: none; transition: all 500ms ease-in-out; color: #fff; border-radius: 5px; font-family: 'Montserrat', sans-serif; font-size: 15px; letter-spacing: 0; border-bottom: 1px solid #0960f3;  }
.social-share ul li a i.fa{     padding: 0 0px 0px 0; margin: 0; font-size: 15px; line-height: 20px;  }
.social-share ul li a:hover{ border-bottom: 2px solid #8e8989;  transition: all 500ms ease-in-out; }
.modal-title { margin: 0; text-align: center; font-family: 'Open Sans'; font-size: 20px; line-height: 30px; background: #540910; padding: 10px 0; border-radius: 6px; color: #fff; font-weight: bold; }
.modal-footer { padding: 15px; text-align: right; border-top: none !important; }

/*banner-header*/
.banner-header{  width: 100%; position: relative; padding:40px 20px 20px; background: #fff; background: url(../images/them2.png) no-repeat top left; background-size: cover; margin: 10px 0 0; border: 10px solid #e53236;}
.banner-header .logo{ width: 100%; margin: -5px auto 15px; }
.banner-header .logo img{ width: 100%; height: auto; }
.banner-header .details-name{ width: 100%; text-align: left;}
.banner-header .details-name h1{ color: #eee; font-size: 23px; line-height: 30px; padding: 0; margin: 0; text-transform: uppercase; font-family: 'Righteous', cursive; }
.banner-header .details-name h4{ color: #eee; font-size: 21px; line-height: 25px; padding: 5px 0 20px; margin: 0;}

.banner-header .my-details{ text-align: center; width: 100%; padding: 15px 0 10px; margin: 0; }
.banner-header .my-details ul{ padding: 0; margin: 0 auto; text-align: center; }
.banner-header .my-details ul li{ position: relative; display: inline-block; width: 90px; margin: 10px 0 10px; border-radius: 5px; background: #e53236; border: 2px solid #bb200b; -webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.31); -moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.31); box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.31); }
.banner-header .my-details ul li:hover{ border-bottom: 1px solid #fff;} 
.banner-header .my-details ul li a{ color: #c9e3f0; padding:6px 0; font-size: 15px; line-height: 20px; display: block;}
.banner-header .my-details ul li a:hover{ color: #fff;}
.banner-header .my-details ul li a i{ color: #fff; padding: 0 5px 0 0; }

.banner-header .name-contact{ text-align: left; width: 100%; padding: 80px 0 20px; margin: 0; }
.banner-header .name-contact ul{ padding: 0; margin: 0; }
.banner-header .name-contact ul li{ padding: 0 0 10px; margin: 0; font-size: 17px; line-height: 25px; font-family: revert; }
.banner-header .name-contact ul li span{padding: 0 0 0 0; margin: 0px 10px 0 0; width: 30px; height: 30px; border-radius: 50%; background: #e53236; display: inline-block; text-align: center; border: none; border-bottom-color: currentcolor; border-bottom-style: none; border-bottom-width: medium; border-bottom: 10px solid #ea0606; }
.banner-header .name-contact ul li span i{ padding: 0; margin: 0; color: #fff; font-size: 15px; }
.banner-header .name-contact ul li a{ padding: 0; margin: 0; color: #420607; font-size: 16px; line-height: 20px;}
.banner-header .name-contact ul li a:hover{ font-style: italic; color: #000; }

.dropdown-top {padding: 0px; margin: 0; width: 100%; display: inline-block;}
.dropdown-top .input-group { width: 46%; float: left; display: block; margin: 0 6px 10px; font-family: 'Open Sans'; background: #eceaea; height: 40px; overflow: hidden; border-radius: 6px; border: none; border-bottom: 2px solid #eef3fa; color: #000; padding: 0px; }
.dropdown-top .input-group input{ border: none; background: #eceaea; font-size: 13px; line-height: 18px; padding: 10px 0 0 5px; display: block; color: #000; outline: none; text-align: center; }

.dropdown-top .input-group a.whatsapp-button{ border: none; background: #5abf55; line-height: 18px; padding: 10px 0 0; display: block; color: #fff; width: 100%; height: 40px; text-align: center; margin: 0 0 0; font-size: 15px; font-weight: bold; }
.dropdown-top .input-group a.phonebook-button{ border: none; background: #eceaea; line-height: 18px; padding: 10px 0 0; display: block; color: #000000a3; width: 100%; height: 40px; text-align: center; margin: 0 0 0; font-size: 14px; font-weight: normal; }

.dropdown-top .input-group button.share-button{ border: none; background: #02cbff; line-height: 18px; padding: 0px 0 0; display: block; color: #fff; width: 100%; height: 40px; text-align: center; margin: 0 0 0; font-size: 15px; font-weight: bold; }

.banner-header .social-mid{ text-align: center; width: 100%; padding: 35px 0 20px; margin: 0; }
.banner-header .social-mid ul{ padding: 0; margin: 0 auto; text-align: center; }
.banner-header .social-mid ul li{ position: relative; display: inline-block; width: 30px; height: 30px; margin: 0 3px 0px; border-radius: 2%; border: none; border-bottom: 2px solid #c8c8c8; 
-webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.31);
-moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.31);
box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.31);}
.banner-header .social-mid ul li:hover{ box-shadow:none; }
.banner-header .social-mid ul li:nth-child(1){ background: #0879ea; }
.banner-header .social-mid ul li:nth-child(2){ background: #4646fb; }
.banner-header .social-mid ul li:nth-child(3){ background: #fd01bb; }
.banner-header .social-mid ul li:nth-child(4){ background: #0073b1; }
.banner-header .social-mid ul li:nth-child(5){ background: #ff0000; }

.banner-header .social-mid ul li a{ color: #fff; font-size: 14px; line-height: 25px; text-align: center; }
.banner-header .social-mid ul li a i{ color: #fff; }

/*About*/
.about-top{ width: 100%; height: auto; padding: 0 0px; margin: 10px 0; background: #fff; border: 10px solid #e53236; box-shadow: none; position: relative; }
.about-top h2{text-align: center; font-family: 'Open Sans' !important; font-size: 25px; font-weight: bold; line-height: 30px; padding: 10px 0 10px; margin: 0; text-transform: uppercase;}
.about-top h3{text-align: center; font-family: "Abel-Regular"; font-family: 'Open Sans' !important;font-size: 17px; color: #585656; line-height: 30px; padding: 0 0 10px; margin: 0; }
.about-top h3 span{ font-weight: bold; }
.about-top p{ text-align: justify; font-family: 'Open Sans' !important; padding: 0 20px 30px; font-size: 15px; line-height: 25px; }

/*Services*/
.service-top{ width: 100%; height: auto; padding: 0 0px; margin: 10px 0; background: #fff; border: 10px solid #e53236; box-shadow: none; position: relative; }
.service-top h2{text-align: center; font-family: 'Open Sans' !important; font-size: 25px; font-weight: bold; line-height: 30px; padding: 10px 0 10px; margin: 0; text-transform: uppercase; }
img.pro-img{  width: 100%; border-radius: 30px; text-align: center; background: #f1f1f1; padding: 10px; margin: 0 auto; }
.service-top a{ text-align: center;text-align: center; position: relative; display: block; color: #fff; font-weight: normal; font-size: 20px; line-height: 40px; width: 40%; border-radius: 20px; margin: 10px auto; text-decoration: none; background: #e53236;  }
.service-top a:hover{ background: #29bcff; }

/*gallery*/
.gallery-top{ width: 100%; height: auto; padding: 0 0px; margin: 10px 0; background: #fff; border: 10px solid #e53236; box-shadow: none; position: relative; }
.gallery-top h2{ text-align: center; font-family: 'Open Sans' !important; font-size: 25px; font-weight: bold; line-height: 30px; padding: 10px 0 10px; margin: 0; text-transform: uppercase; }
img.gallery-img{  width: 100%; border-radius: 30px; text-align: center;  padding: 10px; margin: 0 auto; }

/*video*/
.video-top{ width: 100%; height: auto; padding:0 30px 20px; margin: 10px 0; background: #fff; border: 10px solid #e53236; box-shadow: none; position: relative; }
.video-top h2{ text-align: center; font-family: 'Open Sans' !important; font-size: 25px; font-weight: bold; line-height: 30px; padding: 10px 0 10px; margin: 0; text-transform: uppercase;color: #000; }
img.video-img{  width: 100%; border-radius: 30px; text-align: center;  padding: 10px; margin: 0 auto; }

/*FEEDBACKS*/
.feedback-top{ width: 100%; height: auto; padding: 0 0px; margin: 10px 0; background: #fff; border: 10px solid #e53236; box-shadow: none; position: relative; }
.feedback-top h2{text-align: center; font-family: 'Open Sans' !important; font-size: 25px; font-weight: bold; line-height: 30px; padding: 10px 0 10px; margin: 0; text-transform: uppercase; color: #000; }
.feedback-top .input-group{ width: 45%; float: left; display: block;margin: 10px; }
.feedback-top .input-group input { font-family: 'Open Sans' !important;border: 1px solid #ccc; width: 100%; color: #000; padding: 10px; margin: 0; font-size: 16px; }
.feedback-top input[type="submit"] { font-family: 'Open Sans' !important; outline: none; padding: .5em 2em; font-size: 1em; color: #fff; border: none; border-bottom-color: currentcolor; border-bottom-style: none; border-bottom-width: medium; transition: .5s all; background: #e53236; width: 30%; margin: 20px auto 15px; border-radius: 35px; border-bottom: 3px solid #b5b5b5; display: block; }
.feedback-top input[type="submit"]:hover { background: #333; color: #fff; }

/*enquuiry*/
.enquuiry-top{ width: 100%; height: auto; padding: 0 0px; margin: 10px 0; background: #fff; border: 10px solid #e53236; box-shadow: none; position: relative; }
.enquuiry-top h2{ text-align: center; font-family: 'Open Sans' !important; font-size: 25px; font-weight: bold; line-height: 30px; padding: 10px 0 10px; margin: 0; text-transform: uppercase; color: #000; }
.enquuiry-top .input-group{ width: 45%; float: left; display: block;margin: 10px; }
.enquuiry-top .input-group input { font-family: 'Open Sans' !important; border: 1px solid #ccc; width: 100%; color: #000; padding: 10px; margin: 0; font-size: 16px; }
.enquuiry-top .input-group textarea { font-family: 'Open Sans' !important; border: 1px solid #ccc; width: 100%; color: #000; padding: 10px; margin: 0; font-size: 16px; }
.enquuiry-top input[type="submit"] {font-family: 'Open Sans' !important; outline: none; padding: .5em 2em; font-size: 1em; color: #fff; border: none; border-bottom-color: currentcolor; border-bottom-style: none; border-bottom-width: medium; -webkit-transition: .5s all; -moz-transition: .5s all; transition: .5s all; background: #e53236; width: 30%; display: block; margin: 10px auto 15px; border-radius: 30px; border-bottom: 3px solid #b3b0b0; }
.enquuiry-top input[type="submit"]:hover { background: #333; color: #fff; }

/*payment*/
.payment-top{ width: 100%; height: auto; padding: 0 0px; margin: 10px 0; background: #fff; border: 10px solid #e53236; box-shadow: none; position: relative; }
.payment-top h2{text-align: center; font-family: 'Open Sans' !important; font-size: 25px; font-weight: bold; line-height: 30px; padding: 10px 0 10px; margin: 0; text-transform: uppercase; color: #000; }
.payment-top .pay-det{ width: 100%; padding: 0 20px 30px; margin: 0; }
.payment-top .pay-det h3{ font-weight: bold; font-size: 20px; line-height: 30px; padding: 0; margin: 0; font-family: 'Open Sans' !important;}
.payment-top .pay-det p{ font-size: 17px; color: #000; line-height: 30px; display: block; font-family: 'Open Sans' !important;}
.payment-top .pay-det p span{ text-align: right; float: right; font-size: 16px; color: #484848; line-height: 20px; padding: 0; margin: 0; }

/*footer-menu*/
.footer-menu{ width: 100%; background: #fff; background-image: linear-gradient(to bottom,#fff,#ffffff,#ffffff,#ffffff,#b3b3b3); position: fixed; z-index: 999999; bottom: 0; box-shadow: 10px 0px 40px 0 rgba(0,0,0,0.5); }
.footer-menu ul{ padding: 0; margin: 0; text-align: center; }
.footer-menu ul li{ display: inline-block;color: #000; font-size: 16px; line-height: 22px; padding:10px 20px; margin: 0; }
.footer-menu ul li a{ color: #ff0000c4; font-weight: bold; text-decoration: none; }
.footer-menu ul li a:hover{ color: #c80707c4; }
.footer-menu ul li a span{ color: #ff0000c4;padding: 0 5px 0 0;}
.cpy-right{ margin: 20px 0 60px; background: #fff; padding: 20px 20px 15px;   }
.cpy-right p{ text-align: center; color: #000; }
.cpy-right p a{ text-decoration: none; }

/*RESPONSIV 414*/
@media screen and (max-width: 420px) {
	.container{ width: 415px; margin: 0px auto;  padding: 0; overflow: hidden; }
	.logo-block h3 { font-size: 20px; line-height: 30px; }
	.logo-block h6 { font-size: 12px; line-height: 20px; }
	.social-block ul li a { padding: 7px 10px; border-radius: 12px; font-size: 12px; }
	.contact-top ul li i.fa { font-size: 15px; padding: 10px 0; width: 8%; }
	.contact-top ul li { font-size: 15px; }
	.dropdown-top .input-group input { width: 90%; padding: 8px 8px; margin: 0; font-size: 13px; }
	.dropdown-top .input-group a{ font-size: 13px; }
	.dropdown-top .input-group button{ font-size: 13px; }

a.contact-action-container-text { font-size: 17px }

.about-top h2 { text-align: center; font-family: 'Open Sans'; font-size: 25px; }
	.about-top p { font-size: 14px; line-height: 27px; text-align: justify;}

.enquuiry-top h2{ text-align: center; font-family: 'Open Sans'; font-size: 25px; }
	.enquuiry-top .input-group input { border: 1px solid #dedede; width: 100%; padding: 13px 10px; margin: 0; font-size: 14px; }
	.enquuiry-top .input-group textarea{ border: 1px solid #dedede; width: 100%; padding: 5px; margin: 0; font-size: 13px; }

.feedback-top h2{ text-align: center; font-family: 'Open Sans'; font-size: 25px; }
	.feedback-top .input-group input { border: 1px solid #dedede; width: 100%; padding: 5px; margin: 0; font-size: 13px; }
	.feedback-top .input-group textarea{ border: 1px solid #dedede; width: 100%; padding: 5px; margin: 0; font-size: 13px; }

.payment-top .pay-det p { font-size: 15px; color: #464545; }
	.payment-top .pay-det p span { text-align: right; float: right; font-size: 14px; }
	
	.footer-menu ul li { display: inline-block; color: #000; font-size: 8px; line-height: 22px; padding: 0; margin: 0; letter-spacing: 0; }
	.footer-menu ul li a { color: #370101; font-weight: normal; text-decoration: none; }

.enquuiry-top .input-group { width: 46%; float: left; display: block; margin: 5px; }
	.feedback-top .input-group { width: 47%; float: left; display: block; margin: 5px; }
	.feedback-top .input-group input { border: 1px solid #dedede; width: 100%; padding: 10px 10px; margin: 0; font-size: 14px; }

}

/*RESPONSIV 375*/
@media screen and (max-width: 380px) {
	body{ width:100%; font-family: "Abel-Regular"; background:url("../images/gif-body.gif" ) 0px 0px no-repeat; background-attachment: fixed;
background-size: cover;     background: #fff; }
	.container{ width: 370px; margin: 0px auto;  padding: 0; overflow: hidden; }
	.header { width: 100%; padding: 0; margin: 0; height:700px; border: none; }
    .footer-menu ul li { display: inline-block; color: #000; font-size: 8px; line-height: 22px; padding: 0 3px; }
    .dropdown-top .input-group a { font-size: 12px; }
    .feedback-top .input-group { width: 46%; float: left; display: block; margin: 5px;}
    .feedback-top input[type="submit"]{ width: 40%; }
    .enquuiry-top .input-group { width: 46%; float: left; display: block; margin: 5px;}
    .enquuiry-top input[type="submit"]{ width: 40%; }
    .service-top a{ width: 40%; }
    .header { width: 100%; padding: 0; margin: 0; height: 600px; border: none; background: #fbfbfb; }
    a.contact-action-container-text { font-size: 16px; padding: 0 0 0 20px; }
    .logo-block h6 { font-size: 15px; line-height: 20px; }

}

/*RESPONSIV 360*/
@media screen and (max-width: 365px) {
	.container{ width: 360px; margin: 0px auto;  padding: 0; overflow: hidden; }
	.logo { width: 25%; }
	.logo-block h6 { font-size: 11px; line-height: 20px; }
    a.contact-action-container-text { font-size: 16px; }
    .contact-action-container-icon{ margin: 0 0 0 -10px; }
    .footer-menu ul li { display: inline-block; color: #000; font-size: 8px; line-height: 22px; padding: 0 0px; }
    .logo-block { width: 100%; padding: 20px 0 0; margin: 0; text-align: center; }
    .header { width: 100%; padding: 0; margin: 0; height: 660px; border: none; }
    .logo-block h6 { font-size: 15px; line-height: 20px; }

}

/*RESPONSIV 320*/
@media screen and (max-width: 350px) {
	.container{ width: 320px; margin: 0px auto;  padding: 0; overflow: hidden; }
	.logo-block h3 { font-size: 19px; line-height: 30px; padding: 5px 0 0; }
	.logo-block h6 { font-size: 10px; line-height: 20px; }
	a.contact-action-container-text { font-size: 15px; }
	.dropdown-top .input-group button { font-size: 12px; } 
	.dropdown-top .input-group a { font-size: 11px; }
	.dropdown-top .input-group input { width: 90%; padding: 8px 5px; margin: 0; font-size: 12px; font-family: 'Open Sans'; }
	.header { width: 100%; padding: 0; margin: 0; border: none; background: url(../images/banner.jpg) 0 -50px no-repeat; height: 650px; }

}

@media screen and (max-width: 300px)
{

}

Cancel / Back

[ MAINHACK ]

Viewing / Editing File: style_o.css

Server Info

System Features

User Info