/* Import Fonts */
@import url('https://fonts.googleapis.com/css?family=Karla:400,400i,700,700i&display=swap&subset=latin-ext');
@import url('https://fonts.googleapis.com/css?family=Rubik:300,300i,400,400i,500,500i,700,700i,900,900i&display=swap&subset=cyrillic,hebrew,latin-ext');
@import url('https://fonts.googleapis.com/css?family=Barlow+Condensed:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&display=swap&subset=latin-ext,vietnamese');

/* Import Plugins */
@import "bootstrap.css";
@import "animate.css";
@import "animsition.css";
@import "magnific-popup.css";
@import "cubeportfolio.css";
@import "owl.carousel.css";
@import "flexslider.css";
@import "shortcodes.css";

/* Import Icons */
@import "fontawesome.css";
@import "conrex-icons.css";
@import "flag-icon.css";

/* Elements */
body {
  color: #181819;
  
    font-family: "Karla", sans-serif;
    font-size: 16px;
    line-height: 1.75;
    font-weight: 400;
    background-color: #fff;
}
blockquote { position: relative; background-color: #f0f1ff; font-size: 14px; line-height: 1.715; padding: 23px 30px 23px 100px; margin: 45px 0; }
blockquote:before { position: absolute; top: 38px; left: 46px; font-family: "Font Awesome 5 Free", sans-serif; content: "\f10d"; font-size: 30px; 
	color: #f55b15; }
strong { color: #12124d; }
blockquote div { margin-top: 11px; }

p strong { font-size: 20px; line-height: 32px; font-weight: 700; }

abbr, acronym { border-bottom: 1px dotted #6e819e; }
code, kbd, tt, var, samp, pre { background-color: #f9f9f9; border: 1px solid #6e819e; }
hr { background-color: #6e819e; }
table, th, td { border: 1px solid #6e819e; }

select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"] {
    color: #6e819e;
    border: 2px solid #f55b15 !important;
    padding: 20px 30px;
    margin-bottom: 20px;
    background-color: #fff;
    border: none;
    font-family: "Karla", sans-serif;
    font-size: 14px;
    line-height: 1.286;
    width: 100%;
    outline: none;
}

select { color: #999; }

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus { border-color: #e8e1fe; }

/* Button */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] { color: #fff; font-family: "Roboto", sans-serif; background-color: #f55b15; font-size: 16px; line-height: 60px;
	font-weight: 400; border: none; outline: none; display: inline-block; padding: 0 60px;  text-transform: uppercase; border-radius: 30px; }

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus { transition: all ease 0.3s; outline: none; }

/* Link */
a { color: #6e819e; transition: all ease 0.3s; }
a:hover,
a:active { color: #f46904; transition: all ease 0.3s; text-decoration: none; }

span:hover,
span:active { transition: all ease 0.3s; }

/* Typography */
h1,
h2,
h3,
h4,
h5,
h6 { color: #12124d; font-family: "Karla", sans-serif; font-weight: 700; font-size: 22px; line-height: 1.37; letter-spacing: -0.04em; }

h1 { font-size: 80px; line-height: 1.125; }		/* 80px */
h2 { font-size: 34px; line-height: 1.295; }		/* 34px */
h3 { font-size: 28px; line-height: 1.072; }		/* 28px */
h4 { font-size: 1.6em; line-height: 1.3; }		/* 24px */
h5 { font-size: 1.34em; line-height: 1.3; }		/* 20px */
h6 { font-size: 1.2em; line-height: 1.3; }		/* 18px */

/* Image */
img { max-width: 100%; height: auto; vertical-align: middle; transition: ease-out 0.3s; }

/* Extra class */
.current { color: #f55b15; }
.center { text-align: center; }
.slider-bg-overlay:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; 
	background-image: linear-gradient(to right, rgba(26, 33, 37, 1), rgba(18, 18, 77, 0)); }

/*-- Background Class --*/
.bg-gray { background-color: #f6f9ff; }
.bg-orange { background-color: #f55b15; }
.bg-black { background-color: #222; }
.bg-white { background-color: #fff; }

/*-- Text format (for rev-Slider) --*/
.text-white { color: #fff !important; }
.text-gray { color: #55637d !important; }
.text-black { color: #222 !important; }

.text-stroke {
    -webkit-text-stroke: 2px rgba(255, 255, 255, 0.35) !important;
    !important;
    letter-spacing: 0.04em !important;
    color: transparent !important;
}

.font-weight-400 { font-weight: 400 !important; }
.font-weight-700 { font-weight: 700 !important; }

.font-open-sans { font-family: "Open Sans", sans-serif !important; }
.font-rubik { font-family: "Rubik", sans-serif !important; }

.letter-spacing-30 { letter-spacing: -0.03em !important; }
.letter-spacing-40 { letter-spacing: -0.04em !important; }
.letter-spacing-100 { letter-spacing: -0.1em !important; }

.slider-text { max-width: 600px; }