/************************
Designed by : http://responsivewebinc.com
************************/

/* Basic CSS starts */
html { 
  overflow-y: scroll; 
}

body
{
    background: #091385;
    font-family: 'Open Sans' , sans-serif;
    font-size: 14px;
    line-height: 22px;
    -webkit-font-smoothing: antialiased;
    background-image: url('../Images/Main_BG.jpg');
    background-repeat: repeat-x;
}

h1,h2,h3,h4,h5,h6{
	font-family: 'Open Sans Condensed', sans-serif;
	font-weight: 700;
}

p{
	margin:0;
	padding:0;
}

a{
	color: #ff9c3c;
	/*border-bottom: 1px dotted #fff;*/
	text-decoration: none !important;
}

a:hover
{
    text-decoration: underline;
    color: #f58c26;
}

a:hover,a:active,a:focus {
	outline: 0;
}

hr{
}

.tooltip {
    position: fixed;
}

.logo-main
{
    margin: 0px 0px 15px 20px;
    width: 242px;
    height: 60px;
    background-image: url('../Images/Logo_Main_NewUI.png');
    background-repeat: no-repeat;
    position: relative;    
}
.ie .logo-main
{
    width: 242px;
    height: 60px;
    background-image: url('../Images/SAGT_Logo_Main.png');
    background-repeat: no-repeat;
    position: relative;
    margin-top: 25px;
}
.logo-main-default
{
    margin: 0px 0px 15px 20px;
    width: 242px;
    height: 70px;
    background-image: url('../Images/Logo_Main_NewUI.png');
    background-repeat: no-repeat;
    position: relative;    
}
.ie .logo-main-default
{
    width: 242px;
    height: 70px;
    background-image: url('../Images/SAGT_Logo_Main.png');
    background-repeat: no-repeat;
    position: relative;
    margin-top: 25px;
}
.logo-title1
{
    margin: 5px 0px 0px 0px;
    font-size: 15px;
    color: #3c3c3c;
    font-weight: bold;
}
.logo-title2
{
    padding: 0px;
    margin: -5px 0px 0px 0px;
    font-size: 13px;
    color: #3c3c3c;
}


:focus {
	outline:none;
}

::-moz-focus-inner {
	border:0;
}

form input[type="text"],
form input[type="email"],
form input[type="password"],
form textarea,
form button,
.btn{	
	box-shadow: none !important;
}

form input[type="text"], form input[type="email"], form input[type="password"], form textarea
{
    border: 1px solid #5564b5 !important;
    background-color: #f8f9ff !important;
}

.form-group label{
	font-weight: normal;
	font-size: 13px !important;
}

*{
	box-shadow:none !important;
	border-radius:0px !important;
}

/* Dashed border image like this [ ============= ] */

.dashed-border{
	width: 100%;
	margin-bottom: 30px;
	height: 4px;
	border: 1px dashed #e5e5e5;
}


/* Background Color*/

.br-dark-blue{
	/*background: #2b37b9 !important;*/
	/* For new UI*/
	background: #3a4f63 !important;
}

.br-mid-blue{
	/*background: #4752c7 !important;*/
	/* For new UI*/
	background: #89a1c5 !important;
}

.br-light-blue{
	/*background: #3790e4 !important;*/
	/* For new UI*/
	background: #f6f6f6 !important;
}


.br-gray{
	/*background: #f7f7f7;*/
	/* For new UI*/
	background: #e6e6e6 !important;
}
}

.br-black{
	background: #333;
}




.br-white{
	background: #fff;
}

/* Text Color */

.blue{
	color: #428bcf;
}

.lblue{
	color: #47d4e0;
}

.white{
	color: #ffffff;
}

.black{
	color: #666;
}


/* Background Color on hover with Link Block */

.br-dark-blue.box-link:hover{
	background: #131f9b !important;
}

.br-mid-blue.box-link:hover{
	background: #3a44ab !important;
}

.br-light-blue.box-link:hover{
	background: #0f6dc6 !important;
}

.br-gray.box-link:hover{
	background: #d8d5d5 !important;
}

.br-black.box-link:hover{
	background: #000330 !important;
}

/* Home page text */
.home-page-text
{
    font-size: 12px;
    line-height: 17px;    
}
.home-page-text-para
{
    font-size: 12px;
    line-height: 17px;
    padding-top: 12px;
}

/* Home page icons */
.icon-about-sagt
{
    background-image: url('../Images/Icon_About_SAGT.png');
    background-repeat: no-repeat;
    width: 90px;
    height: 70px;    
    display: inline-block;
	line-height: 80px;
}

.icon-port-of-colombo
{
    background-image: url('../Images/Icon_Port_of_Colombo.png');
    background-repeat: no-repeat;
    width: 90px;
    height: 70px;
    display: inline-block;
    line-height: 80px;
}
.icon-facility
{
    background-image: url('../Images/Icon_Facility.png');
    background-repeat: no-repeat;
    width: 90px;
    height: 70px;
    display: inline-block;
    line-height: 80px;
}
.icon-our-policies
{
    background-image: url('../Images/Icon_Policies.png');
    background-repeat: no-repeat;
    width: 90px;
    height: 70px;
    display: inline-block;
    line-height: 80px;
}
.icon-industry
{
    background-image: url('../Images/Icon_Industry.png');
    background-repeat: no-repeat;
    width: 90px;
    height: 70px;
    display: inline-block;
    line-height: 80px;
}
.icon-da-payments
{    
    width: 100%;
    height: 230px;  
    display: inline-block;        
}
.icon-da-payments-imgclip-1
{    
   width:80%;
   height: auto;   
}
.icon-da-payments-imgclip-2
{    
   width:100%;
   height: auto;   
}
.icon-da-payments-imgclip-3
{    
   width:100%;
   height: auto;   
}

.icon-contactus
{
    background-image: url('../Images/Icon_Contact_Us.png');
    background-repeat: no-repeat;
    width: 90px;
    height: 70px;
    display: inline-block;
    line-height: 80px;
}
.icon-news
{
    background-image: url('../Images/Icon_News.png');
    background-repeat: no-repeat;
    width: 60px;
    height: 55px;
    display: inline-block;
    line-height: 50px;
}
.icon-gallery
{
    background-image: url('../Images/Icon_Gallery.png');
    background-repeat: no-repeat;
    width: 60px;
    height: 55px;
    display: inline-block;
    line-height: 50px;
}
.icon-careers
{
    background-image: url('../Images/Icon_Careers.png');
    background-repeat: no-repeat;
    width: 60px;
    height: 55px;
    display: inline-block;
    line-height: 50px;
}
.icon-sitemap
{
    background-image: url('../Images/Icon_Sitemap.png');
    background-repeat: no-repeat;
    width: 60px;
    height: 55px;
    display: inline-block;
    line-height: 50px;
}
.icon-v-tour
{
    background-image: url('../Images/V_Tour.png');
    background-repeat: no-repeat;
    width: 192px;
    height: 109px;
    display: inline-block;
    line-height: 50px;
}
.icon-faq
{
    background-image: url('../Images/Icon_FAQ.png');
    background-repeat: no-repeat;
    width: 60px;
    height: 55px;
    display: inline-block;
    line-height: 50px;
}
.icon-contact-us
{
    background-image: url('../Images/Icon_Contact_Us.png');
    background-repeat: no-repeat;
    width: 60px;
    height: 55px;
    display: inline-block;
    line-height: 50px;
}
.icon-vessel-schedule
{
    background-image: url('../Images/Icon_Vessel_Schedule.png');
    background-repeat: no-repeat;
    width: 35px;
    height: 45px;
    display: inline-block;
    line-height: 50px;
}
.icon-demurrage-due
{
    background-image: url('../Images/Icon_Demurrage_Due.png');
    background-repeat: no-repeat;
    width: 35px;
    height: 45px;
    display: inline-block;
    line-height: 50px;
}
.icon-exchange-rates
{
    background-image: url('../Images/Icon_Currency_Rates.png');
    background-repeat: no-repeat;
    width: 35px;
    height: 45px;
    display: inline-block;
    line-height: 50px;
}
.icon-all-features
{
    background-image: url('../Images/Icon_All_Features.png');
    background-repeat: no-repeat;
    width: 35px;
    height: 45px;
    display: inline-block;
    line-height: 50px;
}

/* virtual tour */
.virtual-tour-wrapper
{
	 margin-bottom: 20px;
	padding-bottom: 20px;
}


/* ePort - Home page - private login */
.eport-header
{
    background-position: 10px;
    background-color: #d6d9f5;
    background-image: url('../Images/ePort_Logo_Main_NewUI.png');
    background-repeat: no-repeat;
    min-height: 60px;
    min-width: 250px;
}
.eport-body-bg
{
    height: 230px;
    background-position: left bottom;
    background-image: url('../Images/Page_BG_NewUI.jpg');
    background-repeat: no-repeat;
}
.eport-body
{
    padding: 10px 10px 20px 10px;    
}
.eport-body-text
{
    font-size: 12px;
    line-height: 17px;
    padding-right: 10px;
}
.eport-body-text-login-para
{
    font-size: 11px;
    line-height: 13px;
    padding-right: 10px;
    padding-bottom: 5px;
}
.eport-body-field-title
{
    font-size: 13px;    
    color: #acc7e3;
    font-weight: bold;
}
.eport-body-subtext
{
    font-size: 11px;
    padding-left: 5px;
}
.eport-user-typetext
{
    padding-left: 5px;
}
.eport-user-typetext-li
{
    padding-bottom: 5px;
    padding-top: 5px;
}

#Txt_UName, #Txt_PWD
{
    max-width: 300px;    
}
.eport-login-ani
{
    background-position: 5px;
    width: 20px;
    height: 31px;
    background-image: url('../Images/Login_Loading.gif');
    background-repeat: no-repeat;
    float: left;
    margin-left: 5px;
}
.eport-login-ani-text
{
    font-size: 11px;
    color: #FFFFFF;
    float: left;
    margin-top: 5px;
    margin-left: 5px;    
}
#DIV_Login_Msg .panel
{
    border: 1px solid #7680e3;
}
#DIV_Login_Msg .panel .panel-heading
{
    background-color: #000099;
    color: #FFFFFF;
}
#DIV_Login_Msg .panel .panel-body
{
    background-color: #3a4f63;
    color: #FFFFFF;
    font-size: 12px;
}
#DIV_Login_Msg_Txt
{
    padding-bottom: 10px;
}

/* ePort - Home page - public login */
.eport-public-body
{
    padding: 0px;
}
.eport-public-body-title
{
    font-size: 14px;
    font-weight: bold;
}
.eport-public-body-text
{
    font-size: 12px;
    line-height: 17px;    
}

/* Home page - Vessel Schedule */
.vessel-schedule-header
{
    padding: 0px 10px 0px 10px;
    background-color: #3a4f63;
    min-height: 50px;
    min-width: 250px;
}

.vessel-schedule-header H4
{
    color:#ffffff;
    font-weight: 600;
    font-size:17px;
}
.vessel-schedule-header-btn-wrapper
{
    margin-top: 10px;
    float: right !important;    
}
.vessel-schedule-header-btn
{
    border: 1px solid #89a1c5;
}
.vessel-schedule-sub-header
{
    padding: 0px 10px 0px 10px;
    background-color: #89a1c5;
    min-height: 20px;
    min-width: 250px;
}
.vessel-schedule-sub-heading
{    
    font-size: 15px;
    font-weight: bold;
    color: #ffffff;
    text-align: left !important;     
}
.vessel-schedule-sub-heading H6
{
    color:#ffffff;
    font-weight: 600;
    font-size:14px;
}

.vessel-schedule-body
{
    padding: 0px 10px 10px 10px;
    overflow: hidden;
    max-height:150px;
}
.vessel-schedule-text1
{
    font-size: 12px;
    color: #ffffff;
    text-align: left !important;    
    font-weight: bold;
    float: left;    
}
.vessel-schedule-text2
{
    font-size: 11px;
    color: #ffffff;
    text-align: left !important;    
    float: left;    
}
.vessel-schedule-text3
{    
    overflow: hidden;
    font-size: 10px;
    text-align: left !important;
    float: left;
}
.vessel-schedule-loading-wrapper
{
    width: 100%;    
    text-align: center;
    padding-top: 20px;
    font-size: 11px;
}

#vertical-ticker{
	height:100%;
	overflow:hidden;
	margin:0; 
	padding:0;	
}
#vertical-ticker li
{
    padding: 2px 0px 2px 0px;
    display: block;
    color: #FFFFFF;
    border-bottom: 1px solid #636ddd;
    text-align: left;
    font-size: 12px;
    font-weight: bold;
    border-bottom-style: dotted;
}




/* Sub pages  */
.subpage-main-wrapper
{
    background-color: #ffffff;
    padding: 0px;
    min-height:300px;
}
.subpage-content-wrapper
{
    padding: 10px 20px 20px 20px;
}

/* Sparkline tooltip */

.jqstooltip {
  width: auto !important;
  height: auto !important;
  border-radius: 5px;
  padding: 4px 6px !important;
  background-color: rgba(0, 0, 0, 0.5) !important;
  border: 0 !important;
}

/* Basic CSS ends */


.wrapper-home,
.wrapper{
	padding-top: 0px;
	width: 100%;
	min-height: 100%;
	max-height: 100%;	 
}


/* Home page Heading */

.header
{
    margin: 0px;
    padding: 25px 0px 25px 0px;
}
.ie .header
{
    margin: 0px;
    padding: 0px;
    display:inline;
}

.header h1{
	display: inline-block;
	margin: 0;
	font-size: 50px;
	letter-spacing: 0.03em;
	font-weight: normal;
}

.header h1 a{
	color: #fefefe;
	border: 0;
}

.header span.sub-header{
	display: inline-block;
	margin-left: 5px;
	color: #777;
	font-size: 22px;
	font-family: 'Open Sans Condensed', sans-serif;
}


/* Search Box  CSS */

.header .submenu
{
    margin: 20px auto 12px auto;
    text-align: right;
}

.header .submenu > ul > li
{
    height:28px;    
}

.header .submenu > ul > li > span
{
    display: inline-block;
    vertical-align: middle;
    height:28px !important;
}

.header .submenu > ul > li > i
{    
    margin: 5px;
    color: #3c3c3c;
}

.header .search > form > .input-group > input
{
    background: #f3f4fe;
    font-size: 12px;
    border: 0 !important;
    border-radius: 0;
    box-shadow: none !important;
    color: #3c3c3c;
} 

.header .search > form > .input-group > .input-group-btn > button{
	background: #f3f4fe;
	border: 0;
	padding-top: 7px;
	padding-bottom: 7px;
}

.header .search > form > .input-group > .input-group-btn > button i:hover{
	color: #999;
} 



/* Home page box css*/

.box{
	color: #fff;
}

.half-width{
	width: 48.8%;
}

.double-width{
	width: 100%;
	height: 230px;
}

.pad{
	margin: 20px;
}

.large-box{
	height: 390px;
}

.medium-box{
	height: 230px;
}

.small-box{
	height: 140px;
}

.ex-small-box{
	height: 90px;
}



.large-box, .medium-box, .small-box{
	margin-bottom: 10px;
	overflow: hidden;
}

.large-box > a,
.small-box > a{
	border: 0 !important;
}

.box-link {
	text-overflow: ellipsis;
   -webkit-transition: background 1s ease;
   -moz-transition: background 1s ease;
   -o-transition: background 1s ease;
   -ms-transition: background 1s ease;
   transition: background 1s ease;
}

.box-link a{
	display: inline-block;
	width: 100%;
	height: 100%;
	color: #fefefe;
	text-align: center;
	border: 0;
}

.box-link i{
	display: inline-block;
	line-height: 80px;
	font-size: 50px;
}

.box-link h5{
	margin: 0;
	font-size: 14px;
}

.box-link h4{
	margin: 0;
	font-size: 12px;
}

.box-da-payments
{
    background-position: center center;
    background-image: url('../Images/Pay_Storage_BG_NewUI.jpg');
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
}

.box-da-payments-2
{
    background-position: center center;
    background-image: url('../Images/Pay_Storage_Tile_Full_NewUI.jpg');
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
}


/* box css end*/


/* Footer Copy right CSS */

.footer
{
    color: #3a4f63;
    margin: 5px 0 20px 0;
    font-size: 12px;
}
.footer a{
	color: #ff9c3c;
}
.footer a:hover
{
    border: 0;
    color: #f58c26;  
    text-decoration: underline !important;
}
.footer-ctext
{
    text-align: left;
    padding-top: 5px;
}
.footer-social-media
{    
    
	padding-top: 5px;
}
.footer-links
{
    text-align: right;
}
.footer-verisign-seal
{
    padding-left: 10px;
}

.social {
    margin: 0;
    padding: 0;
}

.social ul {
    margin: 0;
    padding: 5px;
}

.social ul li {
    margin: 5px;
    list-style: none outside none;
    display: inline-block;
}
.social i {
    width: 40px;
    height: 40px;
    color: #FFF;
    background-color: #1824a9;
    font-size: 22px;
    text-align:center;
    padding-top: 12px;
    border-radius: 50% !important;
    -moz-border-radius: 50% !important;
    -webkit-border-radius: 50% !important;
    -o-border-radius: 50% !important;
    transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    -webkit-transition: all ease 0.3s;
    -o-transition: all ease 0.3s;
    -ms-transition: all ease 0.3s;
}

.social i:hover {
    color: #FFF;
    text-decoration: none;
    transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    -webkit-transition: all ease 0.3s;
    -o-transition: all ease 0.3s;
    -ms-transition: all ease 0.3s;
}

.social .fa-facebook:hover { /* round facebook icon*/
    background: #4060A5;
}
.social .fa-twitter:hover { /* round twitter icon*/
    background: #00ABE3;
}
.social .fa-linkedin:hover { /* round linkedin icon*/
    background: #0094BC;
}
.social .fa-instagram:hover { /* round instagram icon*/
    background: #375989;
}



/* Responsive CSS */

/* Mobile phones */
@media (max-width: 480px){
	
	.container
    {
        padding: 0px 15px 0px 15px;
    }
	
	.pad
	{
	    margin: 5px;
    }
    
    .icon-da-payments
    {    
        width: 100%;
        height: 100%;
        display: inline-block;           
    }
    
    .header
    {
        margin: 0px;
        padding: 25px 0px 10px 0px;
    }
    
    .ie .logo-main
    {        
        margin-top: 25px !important;
    }
    
	
	.vessel-schedule-text1
    {
        font-size: 11px;        
        float: left;    
    }
    .vessel-schedule-text2
    {
        font-size: 11px;        
        float: left;    
    }
    
    .footer-ctext
    {
        text-align: center !important;
        padding-top: 5px !important;	
    }
    .footer-links
    {
        text-align: center !important;	
    }   
    	
	
}

@media (max-width: 550px){
	    
}

/* Tablets */
@media (max-width: 767px){
	
	.container
    {
        padding: 0px 15px 0px 15px;
    }
    
    .header
    {
        margin: 0px;
        padding: 25px 0px 10px 0px;
    }
    
    .icon-da-payments
    {    
        width: 200px;
        height: 180px;
        display: inline-block;
        line-height: 80px;    
    }
    
    .ie .logo-main
    {        
        margin-top: 25px !important;
    }
	
	.wrapper-home
    {
        /* max-width: 550px !important; */
        margin: 0 auto;
    }
    
	
	.header
	{
	    text-align: center !important;
	}
	.header .row .col-md-9 .logo-main{
		text-align: center !important;
		float: none;
        margin: 0 auto;        
	}	
	
	
	.footer-ctext
    {
        text-align: center !important;
        padding-top: 5px !important;
    }
    .footer-links
    {
        text-align: center !important;	
    }  
    
	
}

/* Desktop */
@media (max-width: 991px){
	.banner .caption span.logo-text{
		margin-top: -30px !important;
		width: 70px;
		line-height: 70px;
		font-size: 40px;
	}
	
	.banner .caption p{
		display: none !important;
	}
	
	.banner .caption img.slide-two,
	.banner .caption.btn-two{
		display: none !important;
	}
	
	.banner .caption a.caption-button{
		margin-top: -200px !important;
		margin-left: 60px !important;
	}

	.box{
		margin-bottom: 0px;
	}
	.box, .large-box,
	.medium-box, .small-box{
		height: auto !important;
	}
	
	.icon-da-payments
    {    
        width: 200px;
        height: 180px;
        display: inline-block;
        line-height: 80px; 
        text-align: center !important;   
    }
	
	.img-gal{
		height: 300px !important;
	}
	
	.testimonial .carousel{
		height: 220px !important;
	}
	
	.w-pad{
		margin: 20px !important;
	}

	.weather .w-today img{
		max-width: 80px !important;
	}
	
	.weather .w-today h6{
		font-size: 50px !important;
	}
	
	.weather .w-today h6 sup{
		top: -20px !important;
	}

	
	.weather .w-report span{
		font-size: 13px !important;
	}
	
	.team-member .member-dtls{
		margin-bottom: 20px;
	}
	
	/* inner Pages */
	
	
	.inner-support .support-item  .scontact{
		margin-top: 30px;
	}

}

@media (max-width: 1199px){
	.w-pad{
		margin: 5px;
	}
	
	.weather .w-today{
		margin-bottom: 20px;
	}
	.weather .w-today img{
		max-width: 90px;
	}
	
	.weather .w-today h6{
		font-size: 40px;
		margin-left: -5px;
	}
	
	.weather .w-today h6 sup{
		top: -12px;
	}

	.weather .w-report span{
		font-size: 12px;
	}
	
	.form-group label{
		display: none !important;
	}
	
	/* inner pages */
	
	.inner-blog .inner-sidebar .widget-content .bform button{
		margin-top: 7px;
	}
	
	.inner-blog .inner-sidebar .widget-content .social a i{
		margin-top: 5px;
	}

}



/*NEW UI RULES*/

.btn-primary {
    border: 1px solid #f58c26 !important;
    color: #ffffff;
    background-color: #ff9c3c !important;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary {
    color: #ffffff;
    background-color: #f58c26 !important;
    border-color: #f58c26 !important;
}