@charset "utf-8";

/* ----------------------------------

Name: wayne.css
Version: 1.0

----------------------------------

Table of contents
        
    01. Google Font
    02. Reset
    03. Typography
    04. Icon
    05. Background Color
    06. Border Color
    07. Margin
    08. Padding
    09. Custom
    10. Button
    11. Form Control
	12. Video and Sound
	13. OWL Carousel


*/

/* ===================================
    Google Font
====================================== */

@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700');
@import url('https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900');

/* ===================================
    Reset
====================================== */

body{ font-family: 'Open Sans', sans-serif; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; font-size:13px; color:#707070; line-height:22px; letter-spacing: 0.01em }
a { text-decoration: none; color:#4e4e4e; cursor: pointer !important; outline: 0; }
a:hover, a:focus{ text-decoration: none;}
a:focus {outline: none; }
img { max-width:100%; height:auto; -webkit-backface-visibility: hidden; }
p {margin:0 0 22px 0}
ul{ margin: 0px; }
input, button, button:focus {outline: 0;}
input{ border: 1px solid #dfdfdf; font-size: 11px;  padding: 8px 15px; width: 100%; margin: 0 0 20px 0; max-width: 100%; resize: none;}
input[type="text"] { -webkit-appearance: none;  border-radius: 0; }
input:focus{ border: 1px solid #989898; outline: none; }
* { transition-timing-function: ease-in-out; -moz-transition-timing-function: ease-in-out; -webkit-transition-timing-function: ease-in-out; -o-transition-timing-function: ease-in-out; transition-duration: .2s; -moz-transition-duration: .2s; -webkit-transition-duration: .2s; -o-transition-duration: .2s; }
::selection { color: #000; background:#dcdcdc; }
::-moz-selection { color:#000; background:#dcdcdc; }
::-webkit-input-placeholder { color: #999; text-overflow: ellipsis; }
:-moz-placeholder { color: #999 !important; text-overflow: ellipsis; opacity:1; }
::-moz-placeholder { color: #999 !important; text-overflow: ellipsis; opacity:1; } 
:-ms-input-placeholder { color: #999 !important; text-overflow: ellipsis; opacity:1; }
::-webkit-scrollbar { width:12px }
::-webkit-scrollbar-track { -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3); -moz-box-shadow:inset 0 0 6px rgba(0,0,0,.3); box-shadow:inset 0 0 6px rgba(0,0,0,.3); }
::-webkit-scrollbar-thumb { background:rgba(210,210,210,.8); -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.5); -moz-box-shadow:inset 0 0 6px rgba(0,0,0,.5); box-shadow:inset 0 0 6px rgba(0,0,0,.5); }

/* ===================================
    Typography
====================================== */

/* font family */
.alt-font {font-family: 'Montserrat', sans-serif !important;}

/* heading */
h1, h2, h3, h4 { margin:0; padding:0; color: #000;}
h1 { font-size:50px; line-height: 60px;}
h2 { font-size:35px; line-height:40px}
h3 { font-size:30px; line-height:35px}
h4 { font-size:25px; line-height:33px} 

/* different text size */
.text-extra-small { font-size:10px !important; line-height:15px;}
.text-small2{ font-size:11px !important;}
.text-small{ font-size:12px !important; line-height:20px; display: inline-block !important}
.text-extra-medium{ font-size:13px !important; line-height:24px;}
.text-medium{ font-size:14px !important; line-height:24px;}
.text-large{ font-size:16px !important; line-height: 25px; }
.text-extra-large { font-size:18px !important; line-height:28px;  }
.title-large{ font-size:28px !important; line-height:35px;}
.title-extra-large{ font-size:35px !important; line-height:40px;}
.title-extra-large-2{ font-size:45px !important; line-height:50px;}
.title-extra-large-3{ font-size:30px !important; line-height:57px;}
.title-extra-large-9{ font-size:110px !important; line-height:100px;}

/* letter spacing */
.letter-spacing-4 { letter-spacing:4px}
.letter-spacing-minus-1{ letter-spacing: -1px !important;}
.no-letter-spacing { letter-spacing: 0px}

/* font weight */
.font-weight-100 { font-weight:100 !important;}
.font-weight-300 { font-weight:300 !important;}
.font-weight-400 { font-weight:400 !important;}
.font-weight-500 { font-weight:500 !important;}

/* text property */
.text-decoration-underline { text-decoration:underline !important;}

/* text color */
.text-white{ color:#ffffff !important;}
.text-black{ color:#000000 !important;}
.text-dark-gray { color:#282828!important;}
.text-light-gray{ color: #bfbfbf;}
.text-fast-blue{ color: #3966e6;}
.text-blue-gray { color:#919499;}
.text-light-purple-blue { color: #374a8a;}
.text-greenish-blue { color: #3ed6a2;}
.text-deep-green-dark{color: #40c37d}
.text-dark-purple-blue {color: #1080f2;}
.text-red {color: #bc3031;}
.text-dark-purple-blue { color: #2a3869;}

/* slider typography */
.slider-text-middle-main { display: table; height: 100%; width: 100% }
.slider-text-middle { display: table-cell; vertical-align: middle; }
.slider-typography { height: 100%; position: absolute; z-index: 1; right: 0; left: 0; }

/* ===================================
    Icon
====================================== */

/* icon size */
.icon-extra-large {font-size:50px !important;}
.icon-large {font-size:35px !important;}
.icon-small {font-size:25px !important;}
.icon-extra-small {font-size:14px !important;}


/* ===================================
    Background Color
====================================== */

.bg-white{ background: #fff;}
.bg-light-gray { background: #f7f7f7;}
.bg-dark-gray{ background: #282828;}
.bg-greenish-blue { background: #3ed6a2;}
.bg-dark-purple-blue { background: #2a3869;}


/* background image */
.cover-background { background-position: center center !important; background-repeat: no-repeat !important; background-size: cover !important; overflow: hidden; position: relative;}
.wayne-background {background-image: url('../images/bg-image/hero-bg.jpg');}

/* ===================================
    Border Color
====================================== */
.border-bottom-light{border-bottom: 1px solid rgba(255,255,255,0.1) !important;}
.border-none {border: 0 !important}
.border-radius-100 {border-radius: 100% !important;}

/* border color */
.border-purple {border: 2px solid #2a3869;}

/* ===================================
    Margin
====================================== */

/* margin all side */
.margin-six{margin:3.5% !important}

/* margin bottom */
.margin-one-bottom{margin-bottom:1% !important}
.margin-two-bottom{margin-bottom:1.5% !important}
.margin-three-bottom{margin-bottom:2% !important}
.margin-four-bottom{margin-bottom:2.5% !important}
.margin-five-bottom{margin-bottom:3% !important}
.margin-eight-bottom {margin-bottom:4.5% !important}
.margin-ten-bottom{margin-bottom:5.5% !important}
.margin-eleven-bottom{margin-bottom:6% !important}
.margin-thirteen-bottom{margin-bottom:7% !important}
.margin-fifteen-bottom{margin-bottom:8% !important}
.margin-twenty-three-bottom{margin-bottom:12% !important}

/* margin top */
.margin-seven-top{margin-top:4% !important}
.margin-fourteen-top{margin-top:7.5% !important}
.margin-twenty-five-top{margin-top:13% !important}

/* margin right */
.margin-five-right {margin-right:3% !important}

.no-margin{ margin:0 !important}
.no-margin-tb{ margin-top: 0 !important; margin-bottom: 0 !important}
.no-margin-bottom{ margin-bottom:0 !important}
.margin-lr-auto {margin-left:auto !important; margin-right:auto !important}

/* ===================================
    Padding
====================================== */

/* padding bottom */
.padding-five-bottom {padding-bottom:3% !important}
.padding-60px-tb{ padding-top: 60px !important; padding-bottom: 60px !important;}
.padding-110px-tb{ padding-top: 110px !important; padding-bottom: 110px !important;}
.padding-130px-tb{ padding-top: 130px !important; padding-bottom: 130px !important;}
.no-padding-top{ padding-top:0 !important}

/* ===================================
    Custom
====================================== */

/* float */
.float-left { float: left !important;}

/* section */
.center-col { float: none !important; margin-left: auto !important; margin-right: auto !important;}
section {border-bottom:1px solid #ececec}

/* vertical align */
.vertical-align-middle { vertical-align: middle !important;}

/* display */
.display-block { display: block !important}
.display-inline-block { display: inline-block !important}
.display-table{ display: table !important;}
.display-table-cell-vertical-middle{ display: table-cell; vertical-align: middle; float: none;}
.list-style-none { list-style: none; padding: 0; margin: 0;}

/* position */
.position-relative{ position: relative !important; z-index: 5 }
.position-inherit {position: inherit !important;}

/* width */
.width-60 { width:60% !important;}
.width-90 { width:90% !important;}
.width-95 { width:95% !important;}
.width-100 { width:100% !important;}

/* section height  */
.small-screen {height: 450px;}
.one-sixth-screen {height: 985px;}

/* column for equalizer   ***/
.two-column > div:nth-child(2n+1) { clear: both; }
.four-column > div:nth-child(4n+1) { clear: both; }

/* ===================================
    Button
====================================== */

.btn {display: inline-block; border-radius:4px; width: auto; font-family: 'Montserrat', sans-serif !important; font-weight: 500; white-space: inherit; cursor: pointer !important;}
.btn:hover {opacity:0.7}
.btn-circle { border-radius:30px !important}
.btn i { margin-left:7px; vertical-align:baseline; margin-top: 1px;}
.btn.btn-large { font-size: 13px; padding: 11px 25px !important; line-height: 18px;}
.btn.btn-medium { font-size: 12px; padding: 8px 20px !important; line-height: 18px;}
.btn-circle.btn-large { font-size: 14px; padding: 12px 30px !important; line-height: 18px;}
.btn-circle.btn-medium { font-size: 12px; padding: 8px 25px !important; line-height: 18px;}

.btn.btn-border {border: 2px solid; background-color: rgba(0, 0, 0, 0);}
.box-shadow-dark { box-shadow: 0 0 6px rgba(0,0,0,.4) !important;}

/* Back to top button */
#top {
    position:fixed;
    right:10px;
    bottom:10px;
    cursor:pointer;
    width:40px;
    height:40px;
    background-color: rgba(50,50,50,.8);
    text-indent:-9999px;
    display:none;
    -webkit-border-radius:60px;
    -moz-border-radius:60px;
    border-radius:60px;
	z-index:5;
}
#top span {
    position:absolute;
    top:50%;
    left:50%;
    margin-left:-8px;
    margin-top:-12px;
    height:0;
    width:0;
    border:8px solid transparent;
    border-bottom-color:#ffffff;
}
#top:hover {
    background-color:#3ed6a2;
    opacity:1;filter:"alpha(opacity=100)";
    -ms-filter:"alpha(opacity=100)";
}

/* ===================================
    Form Control
====================================== */

.extra-big-input { padding: 18px 25px; border:1px solid rgba(0,0,0,.1) !important; font-size: 14px !important}

/* wayne style */

.input-group input {margin:0; border-radius:4px 0 0 4px; border-color: #fff !important; padding: 19px 25px;}
.input-group-btn .btn {border-radius:0 4px 4px 0}
.input-group-btn .btn.btn-large {line-height:2px; height:62px; padding:15px 25px!important}


/* ===================================
    Video and Sound
====================================== */

.video-wrapper { height: 100%; overflow: hidden; position: absolute; width: 100%; top: 0;}
.html-video { background-color: #000; height: auto; left: 50%; min-height: 100%; min-width: 100%; position: absolute; top: 50%; transform: translate(-50%, -50%); width: auto; z-index: -3;}
.sound iframe{width: 100%;}
.video-background { position: relative; height: 100%; width: 100%; z-index: 1; top: 0; background: rgba(67,67,67,0.5); }



/* ===================================
    OWL Carousel
====================================== */

.owl-bg-img {display: block; overflow: hidden; position: relative; width: 100%;}
.owl-buttons .owl-prev {position: absolute; top: 50%; margin-top:-18px; left: 70px; font-size: 35px; color: #fff}
.owl-buttons .owl-next {position: absolute; top: 50%; right:70px; font-size: 35px; color: #fff; margin-top:-18px;}
.owl-pagination {position: absolute; bottom: 35px; text-align: center; width: 100%;}
.owl-pagination .owl-page {display: inline-block}
.owl-pagination .owl-page span {width: 10px; height: 10px; border-radius: 100%; border: 2px solid rgba(255,255,255,.5); display: inline-block; margin: 0 5px;}
.owl-pagination .active span {background-color: #fff; border: 2px solid rgba(255,255,255,.8);}
.owl-pagination-bottom .owl-pagination{position: absolute; bottom:-50px; text-align: center; width: 100%;}
.owl-pagination-bottom .owl-pagination .active span {background: rgba(255,255,255,.8); }
.owl-without-next-pre-arrow .owl-buttons { display: none;}
.owl-pagination-bottom-30px .owl-pagination{bottom:-30px; position: absolute; text-align: center; width: 100%;}

/* hide dot buttons */
.owl-no-buttons .owl-buttons { display: none;}

/* hide dot navigation */
.owl-no-pagination .owl-pagination { display: none}

/* hide next previous arrow */
.owl-without-next-prev-arrow .owl-prev, .owl-without-next-prev-arrow .owl-next {display: none}

/* dark pagination */
.owl-dark-pagination .owl-item {cursor: url("../images/icon/icon-move-black.png"), move !important;}
.owl-dark-pagination .owl-pagination .owl-page span {border: 2px solid rgba(0,0,0,.5);}
.owl-dark-pagination .owl-pagination .active span {background-color: #000; border: 2px solid rgba(0,0,0,.8);}
.owl-dark-pagination .owl-buttons .owl-prev {position: absolute; top: 48%; left: 70px; font-size: 35px; color: #000}
.owl-dark-pagination .owl-buttons .owl-next {position: absolute; top: 48%; right:70px; font-size: 35px; color: #000}

/* outside next previous arrow */
.outside-arrow .owl-buttons .owl-prev {background: #999999; border-radius: 50%; color: #ffffff; font-size: 24px; height: 50px; padding: 13px; position: absolute; left: -60px; top: 50%; width: 50px; margin-top: -25px}
.outside-arrow .owl-buttons .owl-next {background: #999999; border-radius: 50%; color: #ffffff; font-size: 24px; height: 50px; padding: 13px; position: absolute; right: -60px; top: 50%; width: 50px; margin-top: -25px}

/* outside next previous arrow simple */
.outside-arrow-simple .owl-buttons .owl-prev {color: #282828; font-size: 24px; height: 50px; padding: 13px; position: absolute; left: -60px; top: 50%; width: 50px; margin-top: -25px}
.outside-arrow-simple .owl-buttons .owl-next {color: #282828 ; font-size: 24px; height: 50px; padding: 13px; position: absolute; right: -60px; top: 50%; width: 50px; margin-top: -25px}



/* custom */
.img-round{ width: 250px; border-radius: 50%; overflow: hidden;}
.img-round-100{ border-radius: 50%; height: 100px; width: 100px; overflow: hidden;}

.alertMsg {
	float: left;
	font-size: 14px;
	display: block;
	padding: 5px 17px;
}