/*
Theme Name: Royal Oversea Employment Agency
Version: 1.0
Theme URI: http://www..com
Description: Nice and sleek responsive design for  Royal Oversea Employment Agency Co, Ltd.
Author: Digital Dots
Author URI: http://www.digitaldots.com.mm
*/
@import url("assets/css/reset.css");


/* WordPress Core styles */
a img.aligncenter{display:block;margin-left:auto;margin-right:auto}
.wp-caption{background: #E0E0E0; border: 1px solid #CCCCCC;max-width:96%;text-align:center;padding:5px 3px 10px}
.wp-caption.alignright{margin:5px 0 20px 20px}
.wp-caption img{border:0 none;height:auto;max-width:98.5%;width:auto;margin:0;padding:0}
.wp-caption p.wp-caption-text{font-size:11px;line-height:17px;margin:0;padding:0 4px 5px}
.alignnone,a img.alignnone,.wp-caption.alignnone,.wp-caption.alignleft{margin:5px 20px 20px 0}
.aligncenter,div.aligncenter,.aligncenter{display:block;margin:5px auto}
.alignright,a img.alignright{float:right;margin:5px 0 20px 20px}
.alignleft,a img.alignleft{float:left;margin:5px 20px 20px 0}

/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {	
	
}

@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) 
and (orientation:portrait){
	
	
}
/* iphone */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {

}

/*General CSS*/
html, body, div, span, applet, object, iframe, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
}

h1,h2,h3,h4,h5,h6 {
    color: #841818;
    font-weight: bold;
    margin-bottom: 20px;
}

body, input, textarea, select {
    font-family: 'Oxygen', sans-serif;
    font-size: 11pt;
    line-height: 2em;
}

a:hover,a:focus{text-decoration: none;color: #92F3A8;}
.fl {float: left;}
.fr {float: right;}
.tcenter {text-align: center;}
.tright {text-align: right;}
.tleft {text-align: left;}
.inline-block {display: inline-block;}
.bold {font-weight: bold;}

/*Heder*/
#header {text-align: center;}
.page-template-template-contact #header, .page-template-default #header {
   background: url(assets/images/default-banner.jpg) no-repeat center;
    padding: 2em 0 0 0em;
}
.home #header {
    padding: 2em 0 0 0em;
    background: #fff;
}

.top-bar a,.top-bar span{
    color: #fff;
    display: inline-block;
    text-decoration: none;
    margin: 0 15px;
}
.top-bar a.facebook {float: right;}
.top-bar {background-color: #841818;min-height: 40px;color: #fff;padding-top: 5px;}

#logo span {
    display: block;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-size: 2em;
    color: #841818;
    font-weight: 700;
    font-family: 'Oswald', sans-serif;
}

#logo {
    display: inline-block;
    margin-bottom: 40px;
}

#logo a {
    width: auto;
    display: inline-block;
}

/*Menu*/
/*.home #header #nav ul,.page-template-default #header #nav ul,.page-template-template-contact #header #nav ul{
    background:none;
    padding: 0px;
    display: block;
}
*/
#header #nav ul.construction-menu ,#header #nav ul.agency-menu {
    display: inline-block;
    padding: 0em 3em;
    border-radius: 40px;
   background: rgba(25, 123, 48,0.6);
}

#nav ul {
    display: inline-block;
    padding: 0em 3em;
    border-radius: 40px;
}
#header #nav > ul > li {
    display: inline-block;
}
.home #header #nav li.current-menu-item a {
    color: green;
}
#header #nav ul li.current-menu-item a {
    color: #841818;
}
#header #nav ul ul li.current-menu-item a:hover {color: #fff;}
#header #nav ul li.current-menu-item a:hover ul.sub-menu a {color: #fff;}
#header #nav ul li.current-menu-item ul.sub-menu a:hover {color: #fff;}
#nav > ul > li > a, #nav > ul > li > span {
    display: block;
    padding: 1.3em 1em;
    letter-spacing: 1px;
    text-decoration: none;
    font-weight: 200;
    font-size: 1.1em;
    outline: 0;
    color: #464646;
}
#nav > ul > li.menu-item-has-children:hover ul {z-index: 1;}
#nav ul ul {
	position: absolute;
    margin-top: -1px;
    border-top: 1px solid transparent;
    padding:  0 !important;
	z-index: -1;
    border-radius: 0;
    display: block !important;
}

#nav ul ul li {
	list-style: none;
	text-align: left;
}

#nav ul ul li a{
	padding: 6px 20px;
    background-color: #FFFFFF;
    display: block;
    color: #080808;

}
#nav ul ul li a:hover {
	text-decoration: none;
    background-color: #831818;
    color: #fff;
}
/*Front Page*/

.homepage #construction,.homepage #agency {
    padding: 14em 0em;
    position: relative;
	text-align: center;
}
.homepage #construction,.homepage #agency { background-size: cover !important; }

.homepage #welcome {
	 background: #ddd url(assets/images/welcome.jpg) repeat;
	 padding: 5em 0em;
	position: relative;
	text-align: center;
}

.homepage #construction h1 ,.homepage #agency h1  {
    display: block;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 3em;
    font-weight: 900;
    color: #fff;
    margin-bottom: 30px;
    font-family: 'Oswald', sans-serif;
}
.homepage #construction a.view,.homepage #agency a.view  {
	border: 2px solid #fff;
    color: #fff;
    font-size: 22px;
    padding: 7px 35px;
    font-family: Arial;
    font-weight: bold;
}
.homepage #construction a.view:hover,.homepage #agency a.view:hover {
	background-color: #C0F1C2;
    color: #841818;
    border-color: #197B30;
}
.homepage #welcome h2 {
	color: #831818;
	display: block;
    text-decoration: none;
    font-weight: 900;
    margin-bottom: 30px;
    font-family: 'Oswald', sans-serif;
}
.homepage #welcome p {
	font-weight: bold;
    font-family: Arial;
    font-size: 1.1em;
}

/*Copyright Area*/

.homepage #copyright { background-color: #197b30;}
#copyright span {
	color: #fff;
	margin-bottom: 20px;
	position: relative;
    top: -17px;
}

/*Construction*/
#main .container {background-color: #fff;}

.page-child.construction,.page-parent.construction,.post-type-archive-project,.single-project
  { background: url(assets/images/con-back.jpg)repeat #dce6b3; }
.page-child.construction #header,
.page-parent.construction #header,
.post-type-archive-project #header,
.single-project #header{
	background: #ddd url(assets/images/banner-construction.jpg) no-repeat center;
	background-size: cover;
	padding: 7em 0em;
}
.page-child.construction #footer .container,
.page-parent.construction #footer .container,
.post-type-archive-project #footer .container,
.single-project #footer .container
{background-color: #b5dc7d;}


#footer .container div.row,#main .container div.row {padding-top: 50px;padding-bottom: 50px;}


.page-child.construction #logo,
.page-parent.construction #logo,
.post-type-archive-project #logo,
.single-project #logo
{margin-bottom: 3em;}

#nav > ul.construction-menu > li > a, #nav > ul.construction-menu > li > span {
	padding: 0.5em 1em;color: #fff;
}

/*Agency*/

.page-parent.agency,.page-child.agency,.category,.single-post {background: url(assets/images/gplaypattern.jpg)repeat #dce6b3;}
.page-parent.agency #header,.page-child.agency #header,.category #header,.single-post #header{
	background: #ddd url(assets/images/banner-agency.jpg) no-repeat center;
	background-size: cover;
	padding: 7em 0em;
}
.page-parent.agency #footer .container,
.page-child.agency #footer .container,
.category #footer .container,
.single-post #footer .container
 {background-color: #c8faca;}

.page-parent.agency #logo ,
.page-child.agency #logo,
.single-post #logo,.category  #logo
{margin-bottom: 3em;}
#nav > ul.agency-menu > li > a, #nav > ul.agency-menu > li > span {
	padding: 0.5em 1em;color: #fff;
}

/*Default Template*/
body {
    color: #000;
    font-size: 14px;
    line-height: 2em;
    font-family: 'Oxygen', sans-serif;
    background: #ddd url(assets/images/welcome.jpg) repeat;
}

#footer .container {
  background-color: #E2FBE3;
}

ul {
    list-style-position: inside;
    margin-bottom: 20px;
}

/*.page-content ul {padding-left: 20px;}*/
/*Construction Template*/

.image.full {
    display: block;
    width: 100%;
    margin: 0 0 2em 0;
}
.image img {
    display: block;
    width: 100%;
    border-radius: 6px;
}
.mt-50 {margin-top: 50px;}
.mb-30 {margin-bottom: 30px;}
header {
    margin-bottom: 2em;
}
.services header h2 {padding-left:27px;}
header h2{
   font-weight: 700;
   text-transform: uppercase;
}


.button {
    position: relative;
    display: inline-block;
    margin-top: 2em;
    padding: 0.6em 1.4em;
    background: #197B30;
    border-radius: 6px;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 1em;
    color: #FFF;
    -moz-transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out;
    -webkit-transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out;
    -o-transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out;
    -ms-transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out;
    transition: color 0.35s ease-in-out, background-color 0.35s ease-in-out;
    cursor: pointer;
}
.services .services-container {padding-left: 27px;border-left: 1px solid #A9A9A9;}
.services article {
	border-bottom: 1px solid #C7C7C7;
	margin-bottom: 15px;
}
.services article:nth-child(3) {border:none;}
.services article .icon-image {
	float: left;
	margin-right: 10px;
	border-radius: 50%;
	border:2px solid green;
	overflow: hidden;
	width: 65px;
    height: 65px;
}
.services article .icon-image img {width: 100%;}
.services article p {line-height: 20px;margin-bottom: 20px;}
.services article span {font-weight: bold;text-transform: uppercase;}

/*Carousel CSS */


.jcarousel-wrapper {
  /*  margin: 20px auto;*/
    position: relative;
    padding: 15px;
}

/** Carousel **/

.jcarousel {
    position: relative;
    overflow: hidden;
    width: 100%;
}

.jcarousel ul {
    width: 20000em;
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
}

.jcarousel li {
    width: 200px;
    margin-right: 30px;
    float: left;
    border: 1px solid #fff;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.jcarousel img {
    display: block;
    max-width: 100%;
    width: 100%;
    height: auto !important;
    border-radius: 6px;
}

/** Carousel Controls **/

.jcarousel-control-prev,
.jcarousel-control-next {
    position: absolute;
    top: 50%;
    margin: -15px 15px;
    width: 35px;
    height: 35px;
    text-align: center;
    background: transparent;
    border: 2px solid #fff;
    color: #fff;
    text-decoration: none;
    text-shadow: 0 0 1px #000;
    font: 24px/28px Arial, sans-serif;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    -webkit-box-shadow: 0 0 4px #F0EFE7;
    -moz-box-shadow: 0 0 4px #F0EFE7;
    box-shadow: 0 0 4px #F0EFE7;
}

.jcarousel-control-prev {
    left: 15px;
}

.jcarousel-control-next {
    right: 15px;
}

/*Footer*/

#footer ul.contact-infor li {
    padding: 10px 0;
    list-style: none;
    font-size: 1.3em;
    color: #000;
}
#footer ul.contact-infor li a {color: #000;}
.contact-infor i {
    font-size: 24px;
    margin-right: 25px;
    float: left;
    color: #166B2A;
}
.contact-infor i.fa-envelope-o {height: 45px;margin-right: 19px;}
.contact-infor i.fa-map-marker, .contact-infor i.fa-mobile-phone{
    font-size: 35px;
    height: 45px;
}

#footer ul.gallery {list-style:none;}
#footer ul.gallery li img {width: 100%;border-radius: 5px;display: block;}
#footer ul.gallery li{
	width: 50%;
    padding: 3px;
    float: left;
}

section.gallery a{color: #841818;text-decoration: underline;font-weight: 700;}

section.useful-links ul li a,section.popular-jobs ul li a{
	color: #841818;
    font-size: 1.3em;
    font-weight: 700;
 }

 section.useful-links ul,section.popular-jobs ul {
    list-style: none;
    padding:0;
    margin:0;
}

section.useful-links ul li,section.popular-jobs ul li { 
    padding-left: 1em; 
    text-indent: -.7em;
    line-height: 38px;
}

section.useful-links ul li:before,section.popular-jobs ul li:before  {
   content: "• ";
    color: #197B30;
    font-size: 28px;
    top: 5px;
    position: relative;
    margin-right: 8px;
}
section.useful-links ul ul li:before,section.popular-jobs ul ul li:before  {
   content: "* ";
   font-size: 25px;
}
section.useful-links h2,section.popular-jobs h2,section.gallery h2 {padding-left: 27px;}
#footer section .line {
	display: inline-block;
	padding-left: 20px;
	border-left: 1px solid green;
}

/*Agency Template*/

.services-container div {
    border-bottom: 1px solid #A9A9A9;
}
.services-container .who,.services-container .client,.services-container .countries{
     margin-bottom: 30px;
    padding-bottom: 30px;
}
.services-container div:last-child {border: none;}
.services-container div ul{list-style: none;}
.services-container div h2 {font-weight: 700;margin-bottom: 30px;}
section.latest-job article .border ,section.service article .border {
    margin-bottom: 20px;
    border-bottom: 1px solid #A9A9A9;
    float: left;
    padding-bottom: 20px;
}
.icon-image{display: block;}
.icon-image img{width: 100%;}
section.latest-job .post-content a.button {margin-top: 1em;  text-transform: none;  padding: 0em 1.4em;}
section.latest-job .post-content p {line-height: 20px;text-align: justify;}
section.latest-job .post-content a h4 ,section.service .post-content  h4 {font-weight: 700;margin-bottom: 10px;color: #000000;} 
section.latest-job .icon-image img.new {position: absolute;right: 30px;width: 20%;}
.services-container div #menu-location-menu li a {
    display: inline-flex;
    color: #000;
    text-transform: uppercase;
    font-weight: bold;
}

.services-container .client ul li{display: inline-block;width: 50%;}
.services-container div #menu-location-menu li a span {margin-left: 15px;}


/*Contact Form 7*/
textarea {
    display: inline;
    width: 100%;
    height: 100px;
    max-height: 300px;
    font-size: 14px;
    background-color: #AFAFAF;
    color: #fff;
    padding: 5px 0px 5px 10px;
    margin: 5px 0px 0px 0px;
    border-radius: 3px;
    -moz-border-radius: 5px;
}

input[type="text"],input[type="email"] {
    display: inline;
    width: 100%;
    font-size: 14px;
    background-color: #AFAFAF;
    font-family: 'Lato';
    color: white;
    padding: 5px 0px 5px 10px;
    margin: 5px 0px 5px 0px;
    border-radius: 3px;
    -moz-border-radius: 5px;
}
input[type="submit"] {
    display: inline;
    font-size: 14px;
    background-color: #197B30;
    color: #fff;
    padding: 5px 20px;
    margin: 30px 0px 0px 0px;
    border-radius: 3px;
    -moz-border-radius: 5px;
}
div.wpcf7-validation-errors {background-color: #FFCDCD;}

/*SideBar*/

.services ul.sec3 li img {
    float: left;
    margin-right: 1.50em;
    border-radius: 6px;
}
.services ul.sec3 li span {font-size: 20px;color: #51565D;}
.services ul.sec3 li  {  
    padding-bottom: 0.80em;
    margin-bottom: 0.80em;
    border-bottom: 1px solid #C7C7C7;
}
.services ul.sec3 li a {display: inline-block;}
.services ul.sec3 {list-style: none;padding: 0px;display: inline-block;}

 .services ul.sec3 li img {width: 100px;}
 
/*Our Clients Template*/

section.clients ul {list-style: none;display: inline-block;}

/*Single Project*/
.single img.wp-post-image {width: 100%;height: auto;}
#enquireform ul {list-style: none;}
#enquireform input[type="text"],#enquireform input[type="email"],#enquireform textarea{
    background-color: #E8E8E8;color: #000;
}
.enquire-section h3 {font-weight: 700;margin: 10px 0;}
.success {
    display: none;
    color: #18A030;
    padding: 10px;
    background-color: #C8FACA;
}
#sendingbutton,#processing {display: none;}
.invalid-field {
    border: 1px solid #932820 !important;
    box-shadow: 0 0 5px red !important;
}

/*Responsive Css*/

@media only screen and (max-width: 800px) {
    
    #footer section .line {border:none;}

    section.useful-links ul li, section.popular-jobs ul li {line-height: normal;}
    #footer ul.contact-infor li {font-size: 1em;}
    #footer section .line {padding-left: 0px;}
    header h2,.services-container div h2{font-size: 1.5em;}
    section.useful-links ul li a, section.popular-jobs ul li a {font-size: 1em;}
    section.useful-links h2, section.popular-jobs h2, section.gallery h2 {padding-left: 0px;}
    .top-bar a, .top-bar span {margin: 0 5px;}

    .homepage #welcome{    padding: 3em 0em;}
    .homepage #construction, .homepage #agency{padding: 7em 0em;}

      .page-child.construction #header, 
    .page-parent.construction #header,
    .post-type-archive-project #header, 
    .single-project #header,.page-parent.agency #header,
     .page-child.agency #header, 
     .category #header, 
     .single-post #header {padding: 3em 0em;}

     .services header h2 {padding-left: 0px;}
     .services-container .client {text-align: center;}
    
     .services ul.sec3 li span {font-size: 14px;font-weight: 700;}
}
@media only screen and (max-width: 763px) {
    section.services,section.sidebar,#footer section.gallery,#footer section.useful-links {margin-top: 20px;display: inline-block;width: 100%;}
    .services .services-container,#footer section .line,
    section.useful-links h2, section.popular-jobs h2, section.gallery h2
    {padding-left: 0px;border:none;display: block;}
    .post-type-archive-project #main .row .row div {margin-bottom: 20px;}
    .page-template-template-our-clients section.clients ul li{width: 50%;display: inline-block;text-align: center;}
     #main .container div.row {
        padding-top: 35px;
        padding-bottom: 20px;
    }
    .button {margin-top: 0px;}
}

@media only screen and (max-width: 600px) {
    .top-bar a.facebook {float: none;}
    .top-bar {text-align: center;}
    #nav ul.main-menu {margin: 20px 0; background: #C8FAC9;}

    .page-child.construction #header, 
    .page-parent.construction #header,
    .post-type-archive-project #header, 
    .single-project #header,.page-parent.agency #header,
     .page-child.agency #header, 
     .category #header, 
     .single-post #header {padding: 1em 0em;}
     #footer section.popular-jobs { margin-top: 20px;}


}
@media only screen and (max-width: 320px)  {
        #logo span {line-height: 40px;letter-spacing: 0px;}
        #copyright span {top: 5px;}
        .contact-infor i.fa-envelope-o,.contact-infor i.fa-map-marker{height: 60px;}
        .page-template-template-our-clients section.clients ul li {width: 100%;text-align: center;}
}