350 lines
		
	
	
		
			6.6 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
			
		
		
	
	
			350 lines
		
	
	
		
			6.6 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
| body {
 | |
| 	line-height: 1.4;
 | |
| 	font-family: 'Roboto', sans-serif;
 | |
|     font-size: 18px;
 | |
|     letter-spacing: 0.5px;
 | |
|     font-size: 15px;
 | |
| 	font-weight: 400;
 | |
| }
 | |
| ol, ul {
 | |
| 	list-style: none;
 | |
| }
 | |
| blockquote, q {
 | |
| 	quotes: none;
 | |
| }
 | |
| blockquote:before, blockquote:after,
 | |
| q:before, q:after {
 | |
| 	content: '';
 | |
| 	content: none;
 | |
| }
 | |
| table {
 | |
| 	border-collapse: collapse;
 | |
| 	border-spacing: 0;
 | |
| }
 | |
| a {
 | |
|     outline: none;
 | |
| }
 | |
| 
 | |
| a:hover, a:focus, a:active{
 | |
| 	text-decoration: none;
 | |
|     outline: none;
 | |
| }
 | |
| /***********************************
 | |
| ************************************
 | |
| Responsive media queries
 | |
| ************************************
 | |
| ***********************************/
 | |
| .header {
 | |
|     background: url('../img/network.jpg') no-repeat fixed;
 | |
|     background-size: cover;
 | |
|     height: 100vh;
 | |
|     position: relative;
 | |
| }
 | |
| .navbar-default {
 | |
|     background-color: transparent;
 | |
| 	border: 0px;
 | |
|     padding: 20px 0;
 | |
|     transition: all 0.3s;
 | |
| }
 | |
| .navbar-brand {
 | |
|     font-size: 25px;
 | |
| }
 | |
| .navbar-default .navbar-brand, .navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus {
 | |
|     color: #fff;
 | |
|     outline: none;
 | |
| }
 | |
| .navbar-default .navbar-nav > li > a{
 | |
| 	font-size: 14px;
 | |
| 	font-weight: 400;
 | |
| 	color: #fff;
 | |
|     outline: none;
 | |
| }
 | |
| .navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover {
 | |
|     color: #fffde0;
 | |
|     background-color: transparent;
 | |
| }
 | |
| .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
 | |
|     color: #fffde0;
 | |
|     background-color: transparent;
 | |
| }
 | |
| 
 | |
| .top-nav-collapse {
 | |
|     padding: 0;
 | |
| 		border-bottom-style: solid;
 | |
| 		border-bottom-color: #606060;
 | |
|     background: rgba(0,0,0, 1);
 | |
| }
 | |
| 
 | |
| .bg-color{
 | |
| 	background-color: RGBA(0, 0, 0, 0.2);
 | |
| 	height: 100vh;
 | |
| }
 | |
| .navbar-border{
 | |
| }
 | |
| .banner-text{
 | |
| 	border-left: 5px solid #BE2525;
 | |
| 	padding: 15px 40px;
 | |
| 	color: #fff;
 | |
| 	margin-top: 170px;
 | |
| }
 | |
| .banner-text h2, .banner-text p{
 | |
| 	font-weight: 400;
 | |
| 	font-family: 'Questrial', sans-serif;
 | |
| }
 | |
| .banner-text h2 {
 | |
| 	font-size: 50px;
 | |
| }
 | |
| .banner-text p {
 | |
| 	font-size: 30px;
 | |
| }
 | |
| .overlay-detail{
 | |
| 	margin: 0 auto;
 | |
| }
 | |
| .overlay-detail a i {
 | |
|     text-align: center;
 | |
|     position: absolute;
 | |
|     bottom: -140px;
 | |
|     font-size: 24px;
 | |
|     color: #fff;
 | |
|     width: 40px;
 | |
| 	height: 40px;
 | |
| 	border: 1px solid #fff;
 | |
| 	line-height: 40px;
 | |
| 	border-radius: 50%;
 | |
| }
 | |
| #about{
 | |
| 
 | |
| /*	margin-bottom: -3px;*/
 | |
| }
 | |
| .section-padding{
 | |
| 	padding: 60px 0px;
 | |
| }
 | |
| .title{
 | |
| 	font-size: 24px;
 | |
| 	margin-bottom: 50px;
 | |
| }
 | |
| .title-text{
 | |
| 	padding: 0px 25px 0px 0px;
 | |
| 	border-right: 5px solid #BE2525;
 | |
| 	font-size: 24px;
 | |
| }
 | |
| .abt-list li{
 | |
| 	padding: 5px 0px;
 | |
| 	font-size: 18px;
 | |
| 	font-weight: 400;
 | |
| }
 | |
| section {
 | |
| 	background-color: #3a3a3a;
 | |
| 	color: white;
 | |
| }
 | |
| .grid-padding{
 | |
| 	padding: 0 8px;
 | |
| }
 | |
| .grid-padding img{
 | |
| 	margin-bottom: 15px;
 | |
| }
 | |
| .padding-right-zero{
 | |
| 	padding-right: 0px !important;
 | |
| }
 | |
| #myGrid{
 | |
| 	margin-top: 50px;
 | |
| }
 | |
| .test-sec blockquote {
 | |
|     background: #eee;
 | |
|     display: block;
 | |
|     font-size: 14px;
 | |
|     line-height: 20px;
 | |
|     padding: 15px;
 | |
|     position: relative;
 | |
| }
 | |
| .test-sec blockquote::after {
 | |
|     content: '';
 | |
|     position: absolute;
 | |
|     bottom: -14px;
 | |
|     margin-left: 10px;
 | |
|     border-top: 14px solid #eee;
 | |
|     border-left: 14px solid transparent;
 | |
|     border-right: 14px solid transparent;
 | |
| }
 | |
| blockquote {
 | |
|     padding: 10px 20px;
 | |
|     margin: 0 0 20px;
 | |
|     font-size: 17.5px;
 | |
|     border-left: 5px solid RGBA(0, 0, 0, 0.18);
 | |
| }
 | |
| .test-sec .carousel-info span {
 | |
|     display: block;
 | |
| }
 | |
| .test-sec span.testimonials-name {
 | |
|     color: #62646f;
 | |
|     font-weight: 600;
 | |
|     margin: 16px 0 5px;
 | |
| }
 | |
| #contact {
 | |
|     width: 100%;
 | |
|     background-color: RGBA(8, 7, 7, 0.92);
 | |
| }
 | |
| 
 | |
| #contact .btn-primary {
 | |
|     background: #BE2525;
 | |
|     border: 1px solid #BE2525;
 | |
| }
 | |
| 
 | |
| .validation {
 | |
|     color: red;
 | |
|     display:none;
 | |
|     margin: 0 0 20px;
 | |
|     font-weight:400;
 | |
|     font-size:13px;
 | |
| }
 | |
| 
 | |
| #sendmessage {
 | |
|     color: green;
 | |
|     border:1px solid green;
 | |
|     background: #fff;
 | |
|     display:none;
 | |
|     text-align:center;
 | |
|     padding:15px;
 | |
|     font-weight:600;
 | |
|     margin-bottom:15px;
 | |
| }
 | |
| 
 | |
| #errormessage {
 | |
|     color: red;
 | |
|     display:none;
 | |
|     border:1px solid red;
 | |
|     text-align:center;
 | |
|     padding:15px;
 | |
|     font-weight:600;
 | |
|     margin-bottom:15px;
 | |
|     background: #fff;
 | |
| }
 | |
| 
 | |
| #sendmessage.show, #errormessage.show, .show {
 | |
| 	display:block;
 | |
| }
 | |
| 
 | |
| footer {
 | |
|     padding: 40px 0;
 | |
|     background: #F2F3EB;
 | |
| }
 | |
| 
 | |
| .footer a {
 | |
|     color: #BE2525;
 | |
| }
 | |
| 
 | |
| .footer__navigation li, .social-list li{
 | |
| 	display: inline-block;
 | |
| }
 | |
| .contact-sec h2 {
 | |
|     font-size: 28px;
 | |
|     color: #fff;
 | |
|     font-weight: 600;
 | |
|     padding: 15px 0px;
 | |
| }
 | |
| .footer__navigation li a
 | |
| {
 | |
| 	display: inline-block;
 | |
| 	color: #767676;
 | |
| 	font-weight: 600;
 | |
| 	font-variant-ligatures: common-ligatures;
 | |
| 	font-size: 1.2em;
 | |
| 	line-height: 1.625em;
 | |
| 	margin-top: 0;
 | |
| 	margin-bottom: 1.625em;
 | |
| 	padding-right: 10px;
 | |
| }
 | |
| .contact-sec p {
 | |
|     color: #fff;
 | |
|     font-size: 18px;
 | |
|     padding: 16px 0px 24px;
 | |
| }
 | |
| .contact-sec i{
 | |
| 	padding-right: 15px;
 | |
| }
 | |
| .contact-sec a {
 | |
|     color: #FFF;
 | |
|     background-color: RGBA(174, 142, 142, 0.7);
 | |
|     display: inline-block;
 | |
|     padding: 16px 34px;
 | |
|     font-size: 18px;
 | |
|     transition: all 0.5s ease-in 0s;
 | |
| }
 | |
| .carousel-info, blockquote {
 | |
|     float: left;
 | |
| }
 | |
| .social-list li{
 | |
| 	transition: 0.2s linear;
 | |
| 	-webkit-transition: 0.2s linear;
 | |
| 	-moz-transition: 0.2s linear;
 | |
| 	opacity: .5;
 | |
| 	display: inline-block;
 | |
| 	margin: 0;
 | |
| }
 | |
| .social-list li a{
 | |
| 		font-size: 28px;
 | |
| 		margin-right: 15px;
 | |
| }
 | |
| .type-underline, .type-underline:hover{
 | |
| 	color: #767676;
 | |
| }
 | |
| .footer__lower {
 | |
|     margin-top: 3.25em;
 | |
| }
 | |
| .type--fine-print{
 | |
| 	color: #767676;
 | |
| }
 | |
| .navbar-toggle {
 | |
|     position: relative;
 | |
|     background-color: #fff;
 | |
|     border-radius: 4px;
 | |
| }
 | |
| .navbar-nav > li > a {
 | |
|     padding-top: 24px;
 | |
|     padding-bottom: 24px;
 | |
| }
 | |
| .navbar-brand{
 | |
| 	margin-top: 9px;
 | |
| }
 | |
| .grid-item { width: 200px; }
 | |
| .grid-item--width2 { width: 400px; }
 | |
| 
 | |
| /***********************************
 | |
| ************************************
 | |
| Responsive media queries
 | |
| ************************************
 | |
| ***********************************/
 | |
| @media (min-width: 551px) and (max-width: 980px){
 | |
| 	.title-text{
 | |
| 	margin-bottom: 15px;
 | |
| 	}
 | |
| }
 | |
| @media (min-width: 100px) and (max-width: 550px) {
 | |
| 
 | |
| 	.navbar-nav > li > a {
 | |
|     padding-top: 15px;
 | |
|     padding-bottom: 15px;
 | |
| 	}
 | |
| 	.navbar-brand{
 | |
| 		margin-top: 0px;
 | |
| 	}
 | |
|     .carousel-info {
 | |
|     	margin-bottom: 30px;
 | |
| 	}
 | |
| 	.type--fine-print{
 | |
| 		text-align: center;
 | |
| 	}
 | |
| 	.text-center-xs{
 | |
| 		text-align: center !important;
 | |
| 	}
 | |
| 	.social-list{
 | |
| 		margin-bottom: 15px;
 | |
| 	}
 | |
| 	.banner-text h2, .banner-text p {
 | |
|     font-size: 30px;
 | |
| 	}
 | |
| 	.title-text{
 | |
| 	margin-bottom: 15px;
 | |
| 	}
 | |
| }
 |