﻿/*

"Diavlo" v 1.0 

Website Template 

created by www.i3dthemes.com

June / 19 / 2014

/*

*/

/*###################### -=[ GOOGLE FONTS ]=- ###############################*/

@import url('https://fonts.googleapis.com/css?family=Oswald:400,700,300');

@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic');

@font-face {

    font-family: 'bebasregular';

    src: url('fonts/bebas/BEBAS___-webfont.eot');

    src: url('fonts/bebas/BEBAS___-webfont.eot?#iefix') format('embedded-opentype'),

         url('fonts/bebas/BEBAS___-webfont.woff') format('woff'),

         url('fonts/bebas/BEBAS___-webfont.ttf') format('truetype'),

         url('fonts/bebas/BEBAS___-webfont.svg#bebasregular') format('svg');

    font-weight: normal;

    font-style: normal;

}

@font-face {

    font-family: 'buxton_sketchregular';

    src: url('fonts/buxton/buxtonsketch-webfont.eot');

    src: url('fonts/buxton/buxtonsketch-webfont.eot?#iefix') format('embedded-opentype'),

         url('fonts/buxton/buxtonsketch-webfont.woff') format('woff'),

         url('fonts/buxton/buxtonsketch-webfont.ttf') format('truetype'),

         url('fonts/buxton/buxtonsketch-webfont.svg#buxton_sketchregular') format('svg');

    font-weight: normal;

    font-style: normal;

}

/*###################### -=[ GLOBAL FONT STYLES ]=- ##########################*/

html, body {

	margin: 0;

	padding: 0;

	overflow-x: hidden;

}

body {

	color: #196484;

	font-size: 16px;

	font-family: 'Open Sans', sans-serif;

	line-height: 1.628571429;

	background: #DFEAEB url('../graphics/body-bg.jpg');

}

/* LINKS */

a {

	color: #196484;

	text-decoration: none;

}

a:hover, a:focus {

	color: #000000;

	text-decoration: underline;

}

a:focus {

	outline: thin dotted;

	outline: 5px auto -webkit-focus-ring-color;

	outline-offset: -2px;

}

/* PARAGRAPHS */

p {

	margin: 0 0 10px;

}

.lead {

	margin: 20px 0;

	font-weight: 400;

	line-height: 1.4;

}

/* HORIZONTAL RULE */

hr {

	margin-top: 20px;

	margin-bottom: 20px;

	border: 0;

	border-top: 1px solid #eeeeee;

}

.highlight {

	color: #196484;

}

/*********************** THUMBNAILS / START ************************************/

.img-thumbnail {

	padding: 10px;

	font-size: 80%;

}

/* catalog paypal buttons */

div.img-thumbnail div.caption form.well table tbody tr td {

	padding: 5px;

}

div.col-sm-4 div.img-thumbnail div.caption form.well {

	text-align: center;

}

div.col-sm-4 div.img-thumbnail div.caption form.well table {

	width: 100%;

}

div.col-sm-4 div.img-thumbnail div.caption form.well input {

	margin-top: 10px;

}

input, button, select, textarea {

	color: #555555;

	font-size: .9em;

}

/*********************** HEADINGS / START **************************************/

h1, .h1 {

	color: #330066;

	font-size: 39px;

	font-family: 'Oswald', sans-serif;

	font-weight: normal;

	line-height: 2;

	margin: 10px 0px 25px 0px;

}

h2, .h2 {

	color: #293037;

	font-size: 32px;

	font-family: 'Oswald', sans-serif;

	font-weight: normal;

	line-height: 1.8;

	margin: 10px 0px 20px 0px;

}

h3, .h3 {

	color: #330066;

	font-size: 26px;

	font-family: 'Oswald', sans-serif;

	font-weight: normal;

	line-height: 1.6;

	margin: 10px 0px 15px 0px;

}

h4, .h4 {

	color: #000000;

	font-size: 21px;

	font-family: 'Oswald', sans-serif;

	font-weight: normal;

	line-height: 1.4;

	margin: 10px 0px 10px 0px;

}

h5, .h5 {

	color: #196484;

	font-size: 17px;

	font-family: 'Oswald', sans-serif;

	font-weight: normal;

	line-height: 1.2;

	margin: 10px 0px 5px 0px;

}

h6, .h6 {

	color: #196484;

	font-size: 14px;

	font-family: 'Oswald', sans-serif;

	font-weight: normal;

	line-height: 1;

	margin: 10px 0px 3px 0px;

}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {

	text-decoration: none;

}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {

	color: inherit;

}

.highlight{

	color:#196484;

}

/*********************** BLOCKQUOTES / START ***********************************/

blockquote {

	padding: 10px 20px;

	margin: 0 0 20px;

	font-size: 17.5px;

	border-left: 5px solid #EBEBEB;

}

blockquote p:last-child, blockquote ul:last-child, blockquote ol:last-child {

	margin-bottom: 0;

}

blockquote footer, blockquote small, blockquote .small {

	display: block;

	font-size: 80%;

	line-height: 1.42857143;

	color: #000;

}

blockquote footer:before, blockquote small:before, blockquote .small:before {

	content: '\2014 \00A0';

}

.blockquote-reverse, blockquote.pull-right {

	padding-right: 15px;

	padding-left: 0;

	border-right: 5px solid #eeeeee;

	border-left: 0;

	text-align: right;

}

/*********************** LISTS / START *****************************************/

ul, ol {

	margin-top: 0;

	margin-bottom: 10px;

}

ul ul, ol ul, ul ol, ol ol {

	margin-bottom: 0;

}

/*

*/

/*###################### -=[ SHARED COMPONENTS ]=- ############################*/

/*

*/

/*********************** PHONE / START ******************************************/

.phone {

	float: left;

	margin: 0px 30px;

}

.phone a {

	color: #EBEBEB;

	font-size: 12px;

	font-family: 'Open Sans', sans-serif;

	font-weight: normal;

	text-decoration: none;

	padding: 2px 5px;

}

.phone a:hover {

	color: #196484;

	background: #293037;

	border-radius: 10px;

}

.tl-bg45 {

	background: rgba(255, 255, 255, 0.21);

	width: auto;

	height: 30px;

	float: left;

}

.tl-bg45-left {

	font-size: 0px;

	line-height: 0%;

	width: 0px;

	border-top: 30px solid transparent;

	border-right: 30px solid rgba(255, 255, 255, 0.21);

	float: left;

}

.tl-bg45-right {

	font-size: 0px;

	line-height: 0%;

	width: 0px;

	border-top: 30px solid rgba(255, 255, 255, 0.21);

	border-right: 30px solid transparent;

	float: left;

}

/*********************** TEXT LINKS / START ******************************************/

.text-links {

	float: left;

	color: #EBEBEB;

	margin-left: 20px;

}

.text-links a:before {

	content: "» ";

}

.text-links a {

	color: #EBEBEB;

	font-size: 12px;

	font-family: 'Open Sans', sans-serif;

	font-weight: normal;

	text-decoration: none;

	padding: 2px 6px 2px 6px;

	margin: 0px 15px 0px 0px;

	z-index: 10005;

}

.text-links a:hover {

	color: #196484;

	background: #293037;

	border-radius: 10px;

}

/*********************** WEBSITE NAME / START ***********************************/

.website-name {

	float: left;

	padding: 30px 80px 0px 75px;

	height: 100px;

	box-sizing: border-box;

	background: url('../graphics/website-name-bg.png') right center no-repeat;

}



.website-name-hover a:hover {

	/* border-bottom: 5px #196484 solid;*/

	text-decoration: none;

}



.website-text1 {

	color: #3B3364;

	font-size: 31px;

	font-family: 'bebasregular', sans-serif;

	text-transform: uppercase;

}

.website-text2 {

	color: #196484;

	font-size: 31px;

	font-family: 'bebasregular', sans-serif;

	text-transform: uppercase;

}

/*********************** TAGLINE / START ****************************************/

.tagline {

	color: #293037;

	font-size: 20px;

	font-family: 'buxton_sketchregular', cursive;

	font-weight: normal;

	float: left;

	margin-top: 35px;

	margin-left: -30px;

}

/*********************** GRAPHIC LOGO / START ***********************************/

.graphic-logo {

	float: left;

}

/*********************** SOCIAL ICONS / START ***********************************/

.social-icons {

	float: right;

	position: relative;

	margin-top: 2px;

}

.social-icon-fontawesome {

	position: relative;

	z-index: 10005;

}

.social-icons a {

	text-decoration: none;

	border: 0;

}

/* social icons */

.social-icon-fontawesome a:link, .social-icon-fontawesome a:visited {

	color: #3B3364;

	text-decoration: none;

	outline: none;

}

.social-icon-fontawesome a:last-child {

	border-right: 0;

}

.social-icon-fontawesome a:hover {

	color: #196484;

	text-decoration: none;

}

div.social-icon-fontawesome div {

	border-radius: 50%;

	background: #DFEAEB;

	box-sizing: border-box;

	padding: 0px;

	-webkit-transition: all .5s ease;

	transition: all .5s ease;

	opacity: 1;

	display: inline-block;

	width: 22px;

	height: 22px;

	background: #DFEAEB;

}

div.social-icon-fontawesome div a i.fa-fw {

	width: 22px;

	height: 22px;

}

div.social-icon-fontawesome div {

	line-height: 22px;

}

div.social-icon-fontawesome div:hover {

	background: #43B4C5;

}

div.social-icon-fontawesome a:hover {

	color: #ffffff;

	text-decoration: none;

}

/*********************** GOOGLE SEARCH / START **********************************/

.google-search {

	position: relative;

	float: right;

	margin-top: 4px;

	margin-right: -70px;

}

/* google search input text color  */

input#gsc-i-id1.gsc-input {

	color: #333333!important;/* input text color  */;

	padding-left: 10px!important;

}

input.gsc-input {

	font-size: 16px!important;

	padding: 1px 1px!important;

}

#gs_tti50.gsib_a input#gsc-i-id1.gsc-input {

	margin-top: -20px!important;

}

.gsib_a {

	padding-left: 8px;

	padding-right: 8px;

	padding-top: 0px!important;

	margin-top: -10px!important;

}

.gsst_a .gscb_a {

	color: #efefef!important;/* X close color  */

}

#gs_cb50.gscb_a {

	display: none;

}

.google-search {

	width: 200px;

	-webkit-transition: all 0.5s ease;

	transition: all 0.5s ease;

	z-index: 10005;

}

.google-search:hover {

	width: 300px;

}

.gsc-input-box {

	height: 22px!important;

	border-radius: 20px;

	border: 0px solid #F2F3F4!important;

	padding: 0px 0px 0px 0px!important;

	margin-left: 6px;

	box-sizing: border-box;

	-webkit-transition: all .5s ease;

	transition: all .5s ease;

	-webkit-box-shadow: inset 0 0 10px 0 rgba(0,0,0,0.3);

	box-shadow: inset 0 0 10px 0 rgba(0,0,0,0.3);

	background: #ffffff url('../graphics/google-search-bg.png') right center no-repeat!important;

	padding: 2px 10px 8px!important;

}

.gsc-input-box:hover {

	background: #ffffff url('../graphics/google-search-bg.png') 5px center no-repeat!important;

	-webkit-box-shadow: inset 1px 1px 0 0 #ffffff, inset -1px -1px 0 0 #ffffff;

	box-shadow: inset 1px 1px 0 0 #ffffff, inset -1px -1px 0 0 #ffffff;

	box-sizing: border-box;

}

.gsc-search-box .gsc-input > input:focus, .gsc-input-box-focus {

	border: 0px solid #F2F3F4!important;

	background: #ffffff url('../graphics/google-search-bg.png') right center no-repeat!important;

	-webkit-box-shadow: inset 1px 1px 0 0 #ffffff, inset -1px -1px 0 0 #ffffff!important;

	box-shadow: inset 1px 1px 0 0 #ffffff, inset -1px -1px 0 0 #ffffff!important;

	box-sizing: border-box!important;

}

table.gsc-search-box td {

	vertical-align: top!important;

}

.gsc-input {

	background: transparent!important;

}

.cse .gsc-search-button input.gsc-search-button-v2, input.gsc-search-button-v2 {

	visibility: hidden!important;

}

.cse input.gsc-search-button, input.gsc-search-button {

	background-color: transparent!important;

	background-image: url('../graphics/search-btn.png')!important;

	background-repeat: no-repeat!important;

	border: 0px!important;

	border-radius: 0px!important;

	height: 34px;

	min-width: 65px;

	padding: 0 6px;

	margin-right: -4px;

	margin-top: -2px;

	-webkit-transition: all 1s ease-in-out;

	transition: all 1s ease-in-out;

}

input.gsc-search-button gsc-search-button-v2 {

	visibility: hidden!important;

	margin-right: 999px;

	display: none;

}

.cse input.gsc-search-button:hover, input.gsc-search-button:hover {

	background-image: url('../graphics/search-btn-hover.png')!important;

}

.cse input.gsc-search-button:focus, input.gsc-search-button:focus {

	-webkit-box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.0) inset!important;

	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.0) inset!important;

}

input.gsc-search-button {

	z-index: 999!important;

	position: relative!important;

}

.cse .gsc-control-cse, .gsc-control-cse {

	padding: 0!important;

	background-color: transparent!important;

	border: 0px solid #FFFFFF!important;

	border-radius: 20px;

	padding-left: 6px;

}

form.gsc-search-box {

	margin: 0!important;

}

table.gsc-search-box {

	margin-bottom: 0px!important;

}

.cse .gsc-control-cse, .gsc-control-cse {

	background-color: transparent!important;

	border: 0px solid #FFFFFF!important;

}

/*********************** CUSTOM COMPONENTS / START ******************************/

.template .custom-component1 {

	position: absolute;

	top: 0px;

	right: 0px;

	visibility: hidden;

	display: none;

}

.template .custom-component2 {

	position: absolute;

	top: 0px;

	right: 0px;

	visibility: hidden;

	display: none;

}

.template .custom-component3 {

	position: absolute;

	top: 0px;

	right: 0px;

	visibility: hidden;

	display: none;

}

/*********************** SCROLL TO TOP / START **********************************/

/* Image style */

#scrollUp {

	bottom: 50px;

	right: 20px;

	height: 38px;

	width: 38px;

	background: url('../graphics/scrollUp-button.png') no-repeat;

	outline: none;

}

#scrollUp-active {

	display: none;

	outline: none;

}

/***********************  FEATURED VIDEO / START ********************************/

div.featured-video iframe {

	border: 0;

	margin: 0px;

	padding: 0px;

	width: 100%;

	height: 100%;

}

div.featured-video iframe[seamless] {

	background-color: transparent;

	border: 0px none transparent;

	padding: 0px;

	overflow: hidden;

}

/***********************  QUOTE ROTATOR SMALL / START ***************************/

div.quote-rotator p {

	margin-bottom: 20px;

}

/*********************** MOBILE STYLES / START ********************************/

@media (max-width: 1024px) {



.header.fullscreen {

	height: 900px;

}



/* text links */

.tl-bg45-left {

	display: none;

}

.tl-bg45-right {

	display: none;

}

.tl-bg45 {

	background: none;

	float: none;

	height: auto;

	width: auto;

}

.text-links {

	float: none;

	margin-left: 0px;

	width: 100%;

	text-align: center;

}

/* text links */

.website-name {

	background: none;

	height: auto;

	padding: 0;

	margin: 0 0 0 20px;

	text-align: left;

	float: left;

}

.tagline {

	background: none;

	height: auto;

	padding: 0;

	margin: 0 20px 0 0;

	text-align: right;

	float: right;

}

.menu-top {

	position: fixed;

	top: 0px;

	left: 0px;

	width: 100%;

	display: block;

	float: none;

	background: #ffffff;

}

.header {

	margin-top: 40px;

}

.sticky-menubar {

	min-height: 40px!important;

	height: auto;

	z-index:10557;

}

.navbar .navbar-nav {

	display: inline-block;

	float: none;

}

.navbar .navbar-collapse {

	text-align: center;

}

.navbar-default .navbar-nav > li > a {

	padding-top: 10px!important;

	padding-bottom: 0px!important;

}

.navbar-toggle {

	background-color: rgba(255,255,255,0.5);

	background-image: none;

	border: 0px solid transparent;

	border-radius: 0;

	float: none;

	margin-bottom: 1px;

	margin-right: 0px;

	margin-top: 0px;

	padding: 9px 10px;

	position: relative;

	width: 100%;

}

.navbar {

	margin-bottom: 0px;

	min-height: 20px;

}

.phone {

	float: none;

	text-align: center;

	margin-top: 0px;

}

.social-icons {

	float: none;

	text-align: center;

	margin-bottom: 10px;

}

.google-search {

	display: none;

}

}

@media (max-width: 992px) {

/* text links */

}

@media (max-width: 1025px) {

.parallax1, parallax2, .parallax3 {

	background: url('../themed-images/parallax-backgrounds/images/parallax2.jpg');

}

}

