/*
Theme Name:   WmtPress
Description:  Lite theme for Wordpress websites
Author:       Victor Sauhing
Author URI:   https://webmastech.com
Version:      1.0.0
*/

/*------------------------------ GLOBAL CSS ------------------------------*/ 
.WmtPage{padding:0;}

:root {
	--shape-arrow-bottom: polygon(100% 0, 100% calc( 100% - 2.5rem ), 50% 100%, 0 calc( 100% - 2.5rem ), 0 0);
	--shape-ribbon: polygon(100% 0, calc( 100% - 1rem ) 50%, 100% 100%, 0 100%, 1rem 50%, 0 0);
	--shape-comment: polygon(100% 0, 100% calc( 100% - 0.5rem ), calc( 50% + 0.5rem) calc( 100% - 0.5rem ), 50% 100%, calc( 50% - 0.5rem) calc( 100% - 0.5rem ), 0 calc( 100% - 0.5rem ), 0 0);
}


/*------------------------------ 2.1 Typography ------------------------------*/ 
html, body { margin: 0; padding: 0; }
html { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
body { background: #ffffff; overflow-x: hidden; }
body, button, input, select, textarea { font-size: 1rem; color: #555; }
pre, code, input, textarea { font: inherit; }
::-moz-selection { background: #000000; color: #FFFFFF; }
::selection { background: #000000; color: #FFFFFF; }


@media (max-width: 991px) { html { font-size: 15px; } }
@media (max-width: 767px) { html { font-size: 14px; } }

/*------------------------------ 2.2 Links ------------------------------*/ 
a { color: #20929C;; text-decoration: none; outline: none; }
a:hover { color: #20929C; text-decoration: underline; }
a:active, a:focus, a:hover { outline: none; }

/*------------------------------ 2.3 Heading ------------------------------*/ 
h1, h2, h3, h4, h5, h6 { clear: both; margin-bottom: 0.9rem; margin-top: 0; }
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { text-decoration: none; color: #20929C; }
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover{ color: #20929C;  }
h1 { line-height: 1.3; font-size: 2rem; color: #20929C;}
h1 span { font-weight: bold; }
h2 { line-height: 1.2; font-size: 1.5rem; color: #0b2a4a;}
h3 { font-size: 1.25rem; }
h4 { font-size: 1.06rem; margin-bottom: 0.75rem; }
h5 { text-transform: uppercase; font-size: 0.93rem; }
h6 { text-transform: uppercase; font-size: 0.75rem; letter-spacing: 1px; }

@media (min-width: 768px) { /* Medium devices (tablets, 768px and up) */
   h1 { font-size: 2.5rem; } h2 { font-size: 2rem; } 
}

/*------------------------------ 2.4 Base ------------------------------*/ 
ul, ol, dl, p, details, address, .vcard, figure, pre, fieldset, table, dt, dd, hr { margin-bottom: 15px; margin-bottom: 0.9375rem; margin-top: 0; }

/*------------------------------ 2.5 Content ------------------------------*/ 
img { height: auto; max-width: 100%; vertical-align: middle; }
b, strong { font-weight: bold; }
blockquote { clear: both; margin: 20px 0; }
blockquote p { font-style: italic; }
blockquote cite { font-style: normal; margin-bottom: 20px; font-size: 13px; }
dfn, cite, em, i { font-style: italic; }
figure { margin: 0; }
address { margin: 20px 0; }
hr { border: 0; border-top: 1px solid #e9e9e9; height: 1px; margin-bottom: 20px; }
tt, kbd, pre, code, samp, var { font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; background-color: #e9e9e9; padding: 5px 7px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; }
pre { overflow: auto; white-space: pre-wrap; max-width: 100%; line-height: 1.7; margin: 20px 0; padding: 20px; }
details summary { font-weight: bold; margin-bottom: 20px; }
details :focus { outline: none; }
abbr, acronym, dfn { cursor: help; font-size: .95em; text-transform: uppercase; border-bottom: 1px dotted #e9e9e9; letter-spacing: 1px; }
mark { background-color: transparent; text-decoration: none; padding: 0;}
small { font-size: 82%; }
big { font-size: 125%; }
ul, ol { padding-left: 20px; }
ul { list-style: disc; }
ol { list-style: decimal; }
dt { font-weight: bold; }
dd { margin: 0 20px 20px; }

/*------------------------------ 2.6 Table ------------------------------*/ 
table { width: 100%; margin-bottom: 20px; border: 1px solid #e9e9e9; border-collapse: collapse; border-spacing: 0; }
table > thead > tr > th, table > tbody > tr > th, table > tfoot > tr > th, table > thead > tr > td, table > tbody > tr > td, table > tfoot > tr > td {vertical-align: middle; }
table > thead > tr > th, table > thead > tr > td { border-bottom-width: 2px; }
table th { font-size: 14px; letter-spacing: 2px; text-transform: uppercase; }

/*------------------------------ 2.7 Form ------------------------------*/ 
fieldset { padding: 20px; border: 1px solid #e9e9e9; }
input[type="button"]:hover, input[type="button"]:focus, input[type="reset"]:hover, input[type="reset"]:focus, input[type="submit"]:hover, input[type="submit"]:focus, button:hover, button:focus { cursor: pointer; }
textarea { resize: vertical; }
select { max-width: 100%; overflow: auto; vertical-align: top; outline: none; border: 1px solid #e9e9e9; padding: 10px; }
textarea, input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"] { padding: 0.5rem; max-width: 100%;font-size: 0.9rem; font-weight: normal; line-height: 1.2; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; -o-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; transition: all 0.2s linear; -moz-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear; background-color: #f3f8f9; border: 1px solid #CCC; box-sizing: border-box; color: #000000; }
textarea:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="email"]:focus, input[type="month"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="text"]:focus, input[type="time"]:focus, input[type="url"]:focus, input[type="week"]:focus { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; -o-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset; transition: all 0.2s linear; -moz-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear; border-color: #EBEBEB; border-bottom: 1px solid #fff !important; background: #e9e9e9; }
button::-moz-focus-inner { border: 0; padding: 0; }
input[type="radio"], input[type="checkbox"] { margin: 0 10px; }

/*------------------------------ GENERAL CSS ------------------------------*/
.w0{width:0%;} .w5{width:5%;} .w10{width:10%; } .w15{width:15%; } .w20{width:20%; } .w25{width:25%; } .w30{width:30%; } .w35{width:35%; } .w40{width:40%; } .w45{width:45%; }
.w50{width:50%; } .w55{width:55%; } .w60{width:60%; } .w65{width:65%; } .w70{width:70%; } .w75{width:75%; } .w80{width:80%; } .w85{width:85%; } .w90{width:90%; }  .w95{width:95%; } .w100{width:100%; }

.h100{height:100%;}

.bgcolor-f{ background-color: #FFF;} .color-f, .color-f a, .color-e b, .color-e a:hover, .color-d b, .color-d a:hover{ color:#FFF!important; } 
.bgcolor-e{ background-color: #EEE;} .color-e, .color-e a{ color:#EEE!important; }
.bgcolor-d{ background-color: #DDD;} .color-d, .color-d a{ color:#DDD!important; }
.bgcolor-0{ background-color: #000;} .color-0, .color-0 a{ color:#000!important; }
.bgcolor-required{ background-color: var(--color-required); } .color-required{ color:var(--color-required)!important; }

.bgcolor-1{ background-color: var(--color-1); } .color-1, .color-1 a{ color: var(--color-1)!important; }
.bgcolor-2{ background-color: var(--color-2); } .color-2, .color-2 a{ color: var(--color-2)!important; }
.bgcolor-3{ background-color: var(--color-3); } .color-3, .color-3 a{ color: var(--color-3)!important; }
.bgcolor-4{ background-color: var(--color-4); } .color-4, .color-4 a{ color: var(--color-4)!important; }

.bgcolor-light-1{ background-color: var(--color-light-1); } .color-light-1, .color-light-1 a{ color: var(--color-light-1); }

.fontsize-lg{ font-size: 1.25rem; } 
.fontsize-md{ font-size: 1rem; }
.fontsize-sm{ font-size: 0.75rem; }
.fontsize-xs{ font-size: 0.5rem; }

.fontfamily-1{ font-family: var(--font-1);}
.fontfamily-2{ font-family: var(--font-2);}

.bullet-1{width: 25px; height: 25px; font-size:12px; line-height: 25px; text-align: center; border-radius: 25px;}
.bullet-2{width: 40px; height: 40px; font-size:20px; line-height: 40px; text-align: center; border-radius: 40px;}
.bullet-3{width: 50px; height: 50px; font-size:25px; line-height: 50px; text-align: center; border-radius: 50px;}
.bullet-4{width: 100px; height: 100px; font-size:50px; line-height: 100px; text-align: center; border-radius: 100px;}
.bullet-5{width: 200px; height: 200px; font-size:150px; line-height: 200px; text-align: center; border-radius: 200px;}

.hover-scale-1:hover{ transform: scale(1.03); }
.hover-scale-2:hover{ transform: scale(1.06); }
.hover-scale-3:hover{ transform: scale(1.1); }

.cursor-pointer{cursor: pointer;}
.particlejs{ position:absolute; top:0; width:100%; height: 100%; z-index: 0;}


.Parallax{background-attachment: fixed!important;}
.IsMobile .Parallax { background-attachment: initial!important; }


.after-border::after{ content: ''; width: 55%; height: 4px; max-width: 500px; display: block; margin: 5px auto 0 auto; }
.after-border.color-1:after{ background: var(--color-1); }
.after-border.color-2:after{ background: var(--color-2); }
.after-border.color-3:after{ background: var(--color-3); }

.after-border.color-f:after{ background: #fff; }
.after-border.text-shadow-f:after{ box-shadow: 3px 3px 0 #FFF; }
.after-border.text-shadow-0:after{ box-shadow: 3px 3px 0 #000; }


.mt-n1 {	margin-top: -0.25rem !important; }
.mt-n2 {	margin-top: -0.50rem !important; }
.mt-n3 {	margin-top: -1rem !important; }

/*------------------------------ SHADOW CSS ------------------------------*/
.tshadow-0{text-shadow: 2px 2px 5px #000;}
.tshadow-f{text-shadow: 0 0 5px #ffffff, 0 0 5px #ffffff, 0 0 5px #ffffff, 0 0 5px #ffffff, 0 0 5px #ffffff, 0 0 5px #ffffff;}

.tborder-0{text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; }
.tborder-f{text-shadow: -1px -1px 0 #FFF, 1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px 1px 0 #FFF; }
/*.tborder-f{text-shadow: -2px -2px 0 #ffffff, 2px -2px 0 #ffffff, -2px 2px 0 #ffffff, 2px 2px 0 #ffffff; }*/

.bshadow-0{ box-shadow: 2px 2px 5px #000000aa!important; }
.bshadow-light{ box-shadow: 0 5px 15px #00000030!important; }
.bshadow-inset-dark{ box-shadow: inset 0 0 30px #000000!important; }
.bshadow-inset-light{ box-shadow: inset 0 0 10px #00000055!important; }
