/*
Theme Name: Developer Theme
Description: This is a bare bones theme used for building out custom themes
Author: Adam Bates
Version: 1.0
*/
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Roboto:wght@400;700&display=swap');

:root{
	--main_font:'Lato',sans-serif;;
	--header_font:'Roboto',sans-serif;
	--main_font_color:"#333333";
	--header_font_color:"#0073aa";
}

html, body{margin:0; padding:0; font-size:16px; font-family:var(--main_font); color:var(--main_font_color);}

.content_wrap{max-width:1160px; padding:0 20px; margin:0 auto; position:relative;}

.clear{clear:both;}

.alignleft{float:left; margin:15px 15px 15px 0;}
.alignright{float:right; margin:15px 0 15px 15px;}

a{cursor:pointer; color:#333;}

img{border:none;}

h1,h2,h3,h4,h5,h6{font-family:var(--header_font); color:var(--header_font_color);}

.theme_sn a{display:inline-block; height:30px; line-height:30px; width:30px; text-align:center; color:#fff; font-size:16px; border-radius:30px; transition:all .2s ease;}
.theme_sn a:hover{transform:scale(1.2);}
.theme_sn a .sr_text{display:none;}

.form_style_1{position:relative;}
.form_style_1 .element_wrap{width:100%; margin:0 0 4% 0; display:inline-block; vertical-align:top;}
.form_style_1 .element_wrap label{display:block; font-weight:bold; margin:0 0 4px 0; opacity:.8;}
.form_style_1 .element_wrap [type=text], .form_style_1 .element_wrap [type=password], .form_style_1 .element_wrap [type=email]{width:100%; padding:8px 20px; border-radius:3px; box-sizing: border-box; }
.form_style_1 .element_wrap select{width:100%; padding:7px 4%; border-radius:3px;}
.form_style_1 .element_wrap.half{width:48.5%; margin:0 0 3% 2%;}
.form_style_1 .element_wrap.one_third{width:31.5%; margin:0 0 3% 2%;}
.form_style_1 .element_wrap.two_thirds{width:65.5%; margin:0 0 3% 2%;}
.form_style_1 .element_wrap.one_fourth{width:23%; margin:0 0 3% 2%;}
.form_style_1 .element_wrap.one_fifth{width:18%; margin:0 0 3% 2%;}
.form_style_1 .element_wrap.row_first{margin:0 0 3% 0;}
.form_style_1 .instructions{margin:0 0 6px 0; opacity:.7; font-size:14px;}
.form_style_1 .form_loading{position:absolute; top:0; right:0; bottom:0; left:0; background:rgba(255,255,255,0.7); background-size:60px 60px; transition:all 0.2s ease; display:none; z-index:99; text-align:center;}
.form_style_1 .form_loading svg{margin:20px 0 0 0;}
.form_style_1 [type=submit]{ font-size:16px; padding:8px 30px;}

[type='text'],[type='password'],select{padding:4px 15px; border-radius:2px; border:1px solid #b5b5b5; font-family:var(--main_font);}
textarea{padding:4px 15px; border-radius:2px; border:1px solid #b5b5b5; font-family:var(--main_font);}
[type='text'].required,[type='password'].required,select.required{background:#ffe5e5; border:1px solid #ff9393;}

.button{display:inline-block; transition:all 0.2s ease; cursor:pointer; text-align:center; background:#f4f4f4; text-decoration:none; padding:9px 25px; color:#333; border:none;}
	.button .fa{margin:0 7px 0 0;}
	.button:disabled, .button.disabled{cursor:default; opacity:0.5; /* pointer-events:none; */}
	.button:hover{background:#dadada; transform:scale(1.04);}

.button.green{background:#50b981; color:#fff;}
	.button.green:hover{background:#3faa71;}
	
.button.blue{background:#1e1ca4; color:#fff;}
	.button.blue:hover{background:#1288b7;}	
	
.button.grey{background:#333; color:#fff;}
	.button.grey:hover{background:#202020;}

.button.black{background:#000; color:#fff;}

#loading_mask{position:absolute; top:0; right:0; left:0; bottom:0; background:rgba(255,255,255,.5); z-index:99;}
#loading_mask svg{position:absolute; top:calc(50% - 25px); left:calc(50% - 25px);}

.lightbox_blur{filter:blur(3px);}

#vlb_lightbox_mask{position:fixed; top:0; right:0; bottom:0; left:0; background:rgba(0,0,0,.8); z-index:9999; display:none;}

#vlb_lightbox{position:fixed; top:10px; left:50%; padding:0px; background:#fff; z-index:9999; box-shadow:0 1px 5px rgba(0,0,0,0.2); border-radius:1px; transform:rotateY(90deg); transition:all 0.6s cubic-bezier(.87,-.41,.19,1.44); opacity:0; /* transform:scale(50); */ filter:blur(0); -webkit-transform: translateZ(0);}
#vlb_lightbox.open{opacity:1; transform:rotateY(0deg); top:50px; transform:scale(1);}
#vlb_lightbox .lb_title{margin:0 0 10px 0;}
#vlb_lightbox #vlb_lightbox_close{position:absolute; top:-20px; right:-13px; font-size:33px; transition:all .2s ease; opacity:.7; z-index:99; color:#fff;}
#vlb_lightbox #vlb_lightbox_close:hover{opacity:1;}

#md_lightbox_mask{position:fixed; top:0; right:0; bottom:0; left:0; background:rgba(0,0,0,.3); z-index:99999999; display:none;}

#md_lightbox{position:fixed; top:10px; left:50%; padding:20px; background:#fff; z-index:99999999; box-shadow:0 1px 5px rgba(0,0,0,0.2); border-radius:1px; transform:rotateY(90deg); transition:all 0.6s cubic-bezier(.87,-.41,.19,1.44); opacity:0; /* transform:scale(50); */ filter:blur(0); -webkit-transform: translateZ(0);}
#md_lightbox.open{opacity:1; transform:rotateY(0deg); top:50px; transform:scale(1);}
#md_lightbox .lb_title{margin:0 0 10px 0;}
#md_lightbox #lightbox_close{position:absolute; top:2px; right:5px; font-size:25px; transition:all .2s ease; opacity:.5; z-index:99;}
#md_lightbox #lightbox_close:hover{opacity:1;}
#md_lightbox.lb_message{text-align:center;}
#md_lightbox.lb_message .fas{display:block; text-align:center; font-size:30px; margin:0 0 10px 0;}
#md_lightbox.lb_message p{font-size:18px; margin:20px 0;}

#main_header{position:fixed; top:0; right:0; left:0; padding:10px; background:#fff; z-index:999; box-shadow:1px 1px 1px rgba(0,0,0,.1);}
.admin-bar #main_header{top:32px;}

#logo{float:left;}
/* #logo img{height:100px; width:auto;} */

#header_button{float:right; background:#1f6ab4; color:#fff; text-decoration:none; padding:0 15px; transition:all .2s ease; margin:21px 0 0 15px; line-height:36px;}
#header_button:hover{background:#3481ce;}

#header_button_mobile{display:block; background:#1f6ab4; color:#fff; text-decoration:none; transition:all .2s ease; line-height:36px; margin:10px !important;}
#header_button_mobile:hover{background:#3481ce;}

#main_nav{text-align:right; float:right; margin:21px 0 0 0;}
#main_nav ul{list-style:none; margin:0; padding:0;}
#main_nav li{display:block; float:left;}
#main_nav li a{display:block;  line-height:36px; padding:0 15px; text-decoration:none; transition:all 0.2s ease; font-weight:bold; position:relative;}
#main_nav li:hover a:after, #main_nav li.current-menu-item a:after{content:""; height:3px; background:#f4b81a; position:absolute; bottom:0; right:15px; left:15px;}
#main_nav li.menu-item-has-children > a:after{font-family:"Font Awesome 6 Free"; content:"\f078"; display:inline-block; margin:0 0 0 10px; font-size:8px; vertical-align:top; transition:all 0.2s ease; opacity:.5;}
#main_nav li.menu-item-has-children.submenu_open > a:after{transform:rotate(180deg);}
#main_nav ul.sub-menu{position:absolute; left:0; top:36px; background:#efefef; min-width:150px; transition:all .2s ease-out; text-align:left; max-height:0; opacity:0; transform:scale(.5); display:none;}
#main_nav li:hover .sub-menu{display:block;}
#main_nav .submenu_open>ul.sub-menu{max-height:300px; transition:all .2s ease-in; opacity:1; transform:scale(1); z-index:9999;}
#main_nav ul.sub-menu li{display:block;}
#main_nav ul.sub-menu li a{line-height:36px; display:block; white-space:nowrap; background:none; color:#333;}
#main_nav ul.sub-menu li a:hover{background:#e0e0e0;}
#main_nav ul.sub-menu li.menu-item-has-children > a:after{font-family:"Font Awesome 5 Pro"; content:"\f054"; display:inline-block; font-size:8px; vertical-align:top;}
#main_nav ul.sub-menu ul.sub-menu{left:100%; top:0;}
	
#mobile_nav *{margin:0; padding:0; outline:0;}
#mobile_nav{position:fixed; top:0; bottom:0; left:0; width:260px; margin:0 0 0 -261px; background:#fff; text-align:center; transition:all 0.5s cubic-bezier(.87,-.41,.19,1.44); z-index:9999999; display:none;}
#mobile_nav.open{box-shadow:0 0 5px 0 #dadada;}
.admin-bar #mobile_nav{top:46px;}
#mobile_nav.open{margin:0;}
#menu_scroll{position:absolute; top:0; bottom:0; left:0; width:260px; background:#fff; text-align:center; overflow-y:scroll; direction:rtl;}
#mobile_nav #nav_button{position:absolute; top:0; left:100%; width:73px; height:73px; line-height:73px; font-size:30px; text-align:center; color:#1f6ab4; transition:all 0.1s ease; cursor:pointer; z-index:9999999;}
#mobile_nav.open #nav_button{/* color:#000000; */ background:#1f6ab4; color:#fff;}
#mobile_nav #nav_button #icon_holder:before{font-family:"Font Awesome 6 Free"; content:"\f0c9"; display:inline-block; transition:all 0.2s ease; font-weight:700;}
#mobile_nav.open #nav_button #icon_holder:before{content:"\f00d";}
#mobile_nav #nav_button i{margin:0 7px 0 0;}
#mobile_nav li{position:relative;}
#mobile_nav li a{display:block; padding:10px 5px; color:#333; font-size:15px; font-weight:500; border-bottom:1px solid #f1f1f1; text-decoration:none; transition:all 0.1s ease; direction:ltr;}
#mobile_nav li a:hover{background:#f1f1f1;}
#mobile_nav li .submenu_toggle{position:absolute; top:0; right:0; width:40px; line-height:40px; text-align:center; font-size:11px; transition:all 0.2s ease; display:block; border-left:1px solid #f1f1f1; background:#f9f9f9;}
#mobile_nav li .submenu_toggle i{transition:all .2s ease;}
#mobile_nav li .submenu_toggle.open i{transform:rotate(180deg);}
#mobile_nav li .sub-menu{display:none;}
#mobile_nav li .sub-menu a{display:block; padding:10px 5px; color:#000000; font-size:14px; font-weight:normal; background:none; border-bottom:1px solid #f2f2f2; margin:0; transition:all 0.1s ease; background:#f9f9f9;}
#mobile_nav li .sub-menu a:hover{background:#f4f4f4;}

#container{min-height:350px; margin:100px 0 0 0; padding:40px 0;}
.fl-builder #container{margin:0; padding:0;}

.entry-title{margin:0 0 15px 0; font-family:var(--header_font); color:var(--header_font_color); font-size:23px;}
	
#content{width:70%; float:left;}

#sidebar{width:25%; float:right;}
	#sidebar ul.sid{list-style:none; margin:0; padding:0;}
	#sidebar .widget-container{background:#f6f6f6; margin:0 0 20px 0; padding:20px 30px;}
	#sidebar .widget-title{margin:0 0 10px 0; color:#3b3b3b; font-size:17px;}
	
.category .post{border-bottom:1px solid #dadada; padding:20px 0;}
.category .post .entry-title{font-size:20px !important; margin:0 0 10px 0 !important;}
.category .post .entry-meta{font-size:14px; font-style:italic; opacity:0.7; margin:0 0 10px 0;}
.category .post .thumbnail{float:left; height:90px; width:140px; margin:5px 20px 20px 0;}
.category .post p{margin:0 0 10px 0;}
	
.single .entry-meta{font-size:14px; font-style:italic; opacity:0.7; margin:0 0 15px 0;}
	
#main_footer{text-align:center; background:#9aa9b8; padding:20px 0 60px 0; color:#fff;}
#main_footer p{margin:0;}
#main_footer a{color:#fff;}
	
#footer_nav{margin:0 0 20px 0;}
#footer_nav ul{list-style:none; margin:0; padding:0;}
#footer_nav ul li{display:inline-block;}
#footer_nav ul li a{display:inline-block; padding:5px 15px; color:#fff; text-decoration:none; font-size:18px;}

#footer_content{margin:0 0 20px 0;}

#main_footer .theme_sn{position:absolute; top:0; right:0;}

@media only screen and (max-width: 1200px){
	
}

@media only screen and (max-width: 782px){
	.admin-bar #main_header{top:46px;}
}

@media only screen and (max-width: 768px){
	#main_nav{display:none;}
    #mobile_nav{display:block;}
    #logo{text-align:center; float:none;}
    #logo img{height:50px; width:auto;}
    #header_button{display:none;}
    #main_footer .theme_sn{position:relative; top:auto; right:auto;}
    #content{width:auto; float:none; margin:0 0 20px 0; padding:0 0 20px 0; border-bottom:2px solid #dadada;}
    #sidebar{width:auto; float:none;}
}